/*!******************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[7].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[7].use[3]!./app/(products)/shared/productLayout.module.css ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************/
/* ============================================
   WRAPPER GENERAL
============================================ */
.productLayout_wrapper__MmVEP {
  display: flex;
  gap: 3rem;                 /* Distancia profesional entre sidebar y contenido */
  max-width: 1500px;
  margin: 0 auto;
  padding-top: 60px;         /* Espaciado justo debajo del navbar */
}

/* ============================================
   SIDEBAR
============================================ */
.productLayout_sidebar__Ian1y {
  width: 250px;
  position: -webkit-sticky;
  position: sticky;
  top: 90px;
}

.productLayout_sidebarInner__w0sF9 {
  background: rgba(15,15,20,0.85);
  border: 1px solid rgba(255,255,255,0.1);
  -webkit-backdrop-filter: blur(16px);
          backdrop-filter: blur(16px);
  padding: 1.6rem;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  gap: 0.8rem;               /* 🔥 Aquí se arregla el sidebar roto */
}

.productLayout_sidebarTitle__PQLDt {
  color: white;
  font-size: 1.1rem;
  font-weight: 600;
  margin-bottom: 0.6rem;
}

.productLayout_navItem__BncLY {
  width: 100%;
  background: transparent;
  color: #bdbdc7;
  padding: 10px 12px;
  border-radius: 8px;
  text-align: left;
  border: none;
  cursor: pointer;
  transition: .25s ease;
}

.productLayout_navItem__BncLY:hover {
  background: rgba(255,255,255,0.08);
}

.productLayout_active__ED10v {
  background: rgba(255,255,255,0.18) !important;
  color: white !important;
}

/* ============================================
   CONTENT AREA
============================================ */
.productLayout_content__HKBos {
  flex: 1 1;
  padding-right: 2rem;
}

/* ============================================
   HERO (ARRIBA DEL TODO)
============================================ */
.productLayout_hero__swnZy {
  text-align: center;
  margin-bottom: 2.2rem;      /* Espacio elegante */
}

.productLayout_heroImg__3oj_D {
  width: 90px;
  height: 90px;
  margin-bottom: 0.6rem;
}

.productLayout_heroTitle__oaQnm {
  font-size: 2.8rem;
  font-weight: 700;
  margin-bottom: 0.7rem;
  color: white;
}

.productLayout_heroSubtitle__m3CjY {
  font-size: 1.15rem;
  color: #bfbfc9;
  margin-bottom: 0.5rem;
}

.productLayout_heroDesc__fdKtx {
  max-width: 720px;
  margin: 0.5rem auto 0;
  color: #cacad2;
}

/* ============================================
   SECCIONES
============================================ */
.productLayout_section__Wu38P {
  margin-top: 1rem;          /* Antes: 4rem (demasiado) */
  margin-bottom: 2.2rem;     /* Espaciado profesional */
}

.productLayout_section__Wu38P h2 {
  font-size: 2rem;
  font-weight: 600;
  margin-bottom: 0.8rem;
  color: white;
}

/* ============================================
   GRID TARJETAS
============================================ */
.productLayout_grid__U_bsB {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px,1fr));
  grid-gap: 1.6rem;
  gap: 1.6rem;
}

.productLayout_card__2EKVt {
  background: rgba(20,20,26,0.85);
  border: 1px solid rgba(255,255,255,0.08);
  padding: 1.6rem;
  border-radius: 14px;
}

/* ============================================
   FAQ
============================================ */
.productLayout_faq__21Afb {
  margin-bottom: 1.5rem;
}

.productLayout_faq__21Afb h4 {
  color: white;
  margin-bottom: 0.4rem;
}

/* ============================================
   FINAL CTA
============================================ */
.productLayout_finalCta__YvJSL {
  text-align: center;
  padding: 3rem 0 4rem;
}

.productLayout_finalCta__YvJSL button {
  background: var(--primary);
  padding: 12px 28px;
  font-weight: 600;
  font-size: 1rem;
  border: none;
  border-radius: 14px;
  cursor: pointer;
  color: white;
}