/* Páginas editoriales TMJ Arena — extensión visual del home */
.content-page{padding-top:var(--nav-height);background:var(--white);color:var(--ink)}
.content-page main{overflow:hidden}
.content-page .nav-links a[aria-current="page"]{color:var(--terra)}
.content-page .nav-links a[aria-current="page"]::after{left:0;right:0}

/* Hero editorial: misma atmósfera fotográfica y escala del home */
.page-hero{position:relative;min-height:clamp(540px,76svh,760px);display:flex;align-items:flex-end;overflow:hidden;background:var(--ink);padding:0 5vw 74px}
.page-hero__image{position:absolute;inset:-2px;width:calc(100% + 4px);height:calc(100% + 4px);object-fit:cover;object-position:center;filter:grayscale(.5) sepia(.2) saturate(.78) contrast(.96);transform:scale(1.01)}
.page-hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(34,27,22,.16) 0%,rgba(42,31,24,.3) 42%,rgba(25,20,17,.82) 82%,rgba(14,11,9,.94) 100%)}
.page-hero::after{content:"";position:absolute;z-index:1;left:5vw;right:5vw;bottom:36px;height:1px;background:rgba(247,243,238,.2)}
.page-hero__inner{position:relative;z-index:2;width:min(1180px,100%);margin:0 auto;color:var(--white)}
.page-kicker{display:inline-flex;align-items:center;gap:10px;text-transform:uppercase;letter-spacing:.14em;font-size:11px;font-weight:700;color:#E8C4A8;margin:0 0 20px}
.page-kicker::before{content:"";width:22px;height:1px;background:currentColor}
.page-hero h1{font-size:clamp(3rem,7vw,5.6rem);font-weight:700;line-height:.96;letter-spacing:-.035em;max-width:900px;margin:0}
.page-hero__lead{font-size:clamp(1rem,1.7vw,1.15rem);line-height:1.65;max-width:650px;margin:22px 0 0;color:rgba(247,243,238,.78)}

/* Sistema editorial */
.editorial-section{padding:clamp(72px,8vw,108px) 5vw}
.editorial-section.alt{background:var(--sand)}
.editorial-section.olive{background:var(--olive);color:var(--white)}
.editorial-wrap{width:min(1120px,100%);margin:0 auto}
.editorial-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(300px,.82fr);gap:clamp(40px,6vw,78px);align-items:center}
.editorial-grid.reverse .editorial-media{order:-1}
.editorial-title{font-size:clamp(2rem,4vw,3.4rem);font-weight:700;line-height:1.04;letter-spacing:-.03em;margin:0 0 28px;color:var(--ink)}
.editorial-title span{color:var(--terra)}
.editorial-section.olive .section-label,.editorial-section.olive .editorial-title{color:var(--white)!important}
.editorial-section.olive .editorial-title span{color:var(--sand)!important}
.editorial-section.olive .editorial-copy{color:rgba(247,243,238,.82)}
.editorial-copy{max-width:720px;font-size:1.02rem;line-height:1.76;color:var(--ink-mid)}
.editorial-copy p{margin:0 0 18px}
.editorial-copy p:last-child{margin-bottom:0}
.editorial-copy strong{color:var(--ink)}
.editorial-section.olive .editorial-copy strong{color:var(--white)}
.editorial-media{position:relative}
.editorial-media::after{content:"";position:absolute;inset:14px -14px -14px 14px;border:1px solid rgba(181,110,77,.35);border-radius:var(--radius);z-index:0}
.editorial-media img{position:relative;z-index:1;width:100%;display:block;border-radius:var(--radius);box-shadow:var(--shadow-ui);aspect-ratio:4/5;object-fit:cover;filter:saturate(.88) contrast(.97)}

/* Tarjetas y pasos: mismos materiales y bordes del home */
.info-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:38px}
.info-card{position:relative;padding:30px 28px;border:1px solid var(--border);border-radius:var(--radius);background:rgba(247,243,238,.72);transition:transform .24s ease,border-color .24s ease}
.info-card::before{content:"";display:block;width:28px;height:2px;background:var(--terra);margin-bottom:22px}
.info-card:hover{transform:translateY(-3px);border-color:rgba(181,110,77,.35)}
.info-card h3{font-size:1.16rem;line-height:1.25;margin:0 0 11px}
.info-card p{margin:0;color:var(--ink-mid);line-height:1.65;font-size:.96rem}
.editorial-section.alt .info-card{background:rgba(247,243,238,.52)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:42px}
.step{padding:28px 24px;border-top:2px solid var(--terra);background:rgba(247,243,238,.48);border-radius:0 0 var(--radius) var(--radius)}
.step-number{font-size:.72rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--terra);margin-bottom:15px}
.step h3{font-size:1.24rem;line-height:1.25;margin:0 0 11px}
.step p{margin:0;line-height:1.62;color:var(--ink-mid);font-size:.95rem}

/* FAQ */
.faq-list{max-width:900px;margin:38px auto 0}
.faq-item{border-top:1px solid var(--border)}
.faq-item:last-child{border-bottom:1px solid var(--border)}
.faq-item summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 0;font-size:1.1rem;line-height:1.35;font-weight:650;color:var(--ink)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";flex:0 0 auto;display:grid;place-items:center;width:32px;height:32px;border:1px solid var(--border);border-radius:50%;font-size:1.3rem;font-weight:300;line-height:1;transition:transform .2s ease,background .2s ease}
.faq-item[open] summary::after{content:"–";background:var(--terra);color:var(--white);border-color:var(--terra);transform:rotate(180deg)}
.faq-answer{padding:0 58px 25px 0;color:var(--ink-mid);line-height:1.72;max-width:760px}

/* Fundadoras */
.profile-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:40px}
.profile-card{border-radius:var(--radius);overflow:hidden;background:var(--sand);border:1px solid var(--border)}
.profile-card img{width:100%;aspect-ratio:4/4.7;object-fit:cover;display:block;filter:saturate(.9) contrast(.98)}
.profile-card__body{padding:30px}
.profile-card h3{font-size:clamp(1.55rem,2.4vw,2rem);line-height:1.08;margin:0 0 8px}
.profile-card .role{font-size:.78rem;font-weight:750;letter-spacing:.08em;text-transform:uppercase;color:var(--terra);margin-bottom:18px}
.profile-card p{line-height:1.7;color:var(--ink-mid);margin:0}
.quote-block{padding:clamp(34px,5vw,58px);border-radius:var(--radius);background:var(--ink);color:var(--white);font-size:clamp(1.65rem,3.8vw,3rem);line-height:1.16;letter-spacing:-.03em}
.quote-block small{display:block;font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;margin-top:24px;color:var(--sand-md)}

/* Navegación cruzada entre contenidos */
.related-pages{padding:72px 5vw;background:var(--white);border-top:1px solid var(--border)}
.related-pages__inner{width:min(1120px,100%);margin:0 auto}
.related-pages__head{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:28px}
.related-pages__title{font-size:clamp(1.8rem,3vw,2.7rem);line-height:1.05;letter-spacing:-.03em;margin:0}
.related-pages__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.related-card{display:flex;flex-direction:column;justify-content:space-between;min-height:170px;padding:24px;border:1px solid var(--border);border-radius:var(--radius);color:var(--ink);text-decoration:none;background:var(--white);transition:transform .22s ease,border-color .22s ease,background .22s ease}
.related-card:hover{transform:translateY(-3px);border-color:rgba(181,110,77,.42);background:rgba(233,217,199,.28)}
.related-card small{font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;color:var(--terra);font-weight:750}
.related-card strong{font-size:1.22rem;line-height:1.25;font-weight:650}
.related-card span{align-self:flex-end;font-size:1.2rem;color:var(--terra)}

/* Contacto y CTA */
.inline-links{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.inline-links a{display:inline-flex;align-items:center;border:1px solid var(--border);border-radius:999px;padding:11px 17px;text-decoration:none;color:var(--ink);font-size:.92rem;font-weight:600;transition:background .2s ease,border-color .2s ease}
.inline-links a:hover{background:var(--white);border-color:rgba(181,110,77,.42)}
.cta-band{padding:clamp(72px,9vw,108px) 5vw;background:var(--terra);color:var(--white);text-align:center}
.cta-band h2{font-size:clamp(2.25rem,5vw,4.5rem);font-weight:700;line-height:.98;letter-spacing:-.04em;margin:0 auto 22px;max-width:840px}
.cta-band p{font-size:1.04rem;line-height:1.65;margin:0 auto 30px;max-width:620px;color:rgba(247,243,238,.84)}
.cta-band .btn-primary{display:inline-flex;align-items:center;gap:10px;background:var(--ink)!important;color:var(--white)!important}

@media(max-width:960px){
 .editorial-grid{grid-template-columns:1fr;gap:42px}
 .editorial-grid.reverse .editorial-media{order:0}
 .editorial-media{max-width:620px}
 .info-cards,.steps{grid-template-columns:1fr 1fr}
 .profile-grid{grid-template-columns:1fr}
 .related-pages__grid{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
 .page-hero{min-height:600px;padding-bottom:58px}
 .page-hero::after{bottom:26px}
 .page-hero h1{font-size:clamp(2.8rem,13vw,4.5rem)}
 .editorial-section{padding:68px 5vw}
 .related-pages{padding:60px 5vw}
 .related-pages__head{align-items:start;flex-direction:column}
}
@media(max-width:620px){
 .page-hero{min-height:560px;padding-left:20px;padding-right:20px}
 .page-hero::after{left:20px;right:20px}
 .editorial-section{padding:60px 20px}
 .info-cards,.steps,.related-pages__grid{grid-template-columns:1fr}
 .editorial-media::after{inset:10px -8px -10px 8px}
 .quote-block{padding:32px 26px}
 .faq-item summary{font-size:1rem;padding:21px 0}
 .faq-answer{padding-right:8px}
 .profile-card__body{padding:25px}
 .related-pages{padding:54px 20px}
 .cta-band{padding:68px 20px}
}
@media(prefers-reduced-motion:reduce){.info-card,.related-card,.faq-item summary::after{transition:none!important}}

/* =========================================================
   FAQ — respuesta “¿Qué debo llevar?”
   Mejora de jerarquía y lectura, manteniendo el lenguaje visual TMJ
   ========================================================= */
.faq-answer p{
  margin:0;
}

.faq-answer--equipment{
  max-width:800px;
  padding-top:2px;
  padding-bottom:30px;
}

.faq-answer__intro{
  margin-bottom:16px !important;
  color:var(--ink);
  font-size:.92rem;
  font-weight:700;
  letter-spacing:.01em;
}

.faq-essentials{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin:0 0 24px;
  padding:0;
  list-style:none;
}

.faq-essentials li{
  position:relative;
  min-height:76px;
  display:flex;
  align-items:flex-end;
  padding:17px 16px 15px;
  border:1px solid rgba(30,27,26,.10);
  border-radius:14px;
  background:rgba(233,217,199,.34);
  color:var(--ink);
  font-size:.9rem;
  font-weight:650;
  line-height:1.4;
}

.faq-essentials li::before{
  content:"";
  position:absolute;
  top:15px;
  left:16px;
  width:22px;
  height:2px;
  border-radius:999px;
  background:var(--terra);
}

.faq-answer__notes{
  display:grid;
  gap:13px;
  padding-top:20px;
  border-top:1px solid rgba(30,27,26,.09);
}

.faq-answer__notes p{
  line-height:1.72;
}

.faq-answer__notes strong{
  color:var(--ink);
  font-weight:700;
}

@media(max-width:700px){
  .faq-essentials{
    grid-template-columns:1fr;
  }

  .faq-essentials li{
    min-height:62px;
    align-items:center;
    padding:15px 16px 15px 48px;
  }

  .faq-essentials li::before{
    top:50%;
    left:17px;
    width:18px;
    transform:translateY(-50%);
  }
}

/* TMJ v4 — fotografías de la página Fundadoras */
.page-hero--fundadoras .page-hero__image{
  object-position:center 44%;
  filter:grayscale(.34) sepia(.14) saturate(.88) contrast(1.02);
}
.page-hero--fundadoras::before{
  background:
    linear-gradient(90deg,rgba(20,16,13,.46) 0%,rgba(20,16,13,.17) 52%,rgba(20,16,13,.08) 100%),
    linear-gradient(180deg,rgba(34,27,22,.10) 0%,rgba(42,31,24,.22) 44%,rgba(25,20,17,.72) 84%,rgba(14,11,9,.90) 100%);
}
.profile-card--josefina img{
  object-position:center 30%;
}
.profile-card--catalina img{
  object-position:64% center;
}
@media(max-width:768px){
  .page-hero--fundadoras .page-hero__image{
    object-position:52% center;
  }
  .page-hero--fundadoras::before{
    background:linear-gradient(180deg,rgba(24,19,16,.12) 0%,rgba(24,19,16,.28) 42%,rgba(18,14,12,.80) 80%,rgba(12,9,8,.94) 100%);
  }
}

/* TMJ v5 — encuadres específicos de la página Footvolley */
.content-page .page-hero__image[src*="footvolley-hero"]{
  object-position:center 58%;
}
.footvolley-image--game{
  object-position:center 42% !important;
}
.footvolley-image--practice{
  object-position:center 52% !important;
}
@media(max-width:620px){
  .content-page .page-hero__image[src*="footvolley-hero"]{
    object-position:58% center;
  }
  .footvolley-image--game{
    object-position:center 38% !important;
  }
  .footvolley-image--practice{
    object-position:center 48% !important;
  }
}


/* FAQ hero v6 */
.page-hero__image[src*="faq-heroe"]{
  object-position:50% 42%;
}
@media (max-width:1024px){
  .page-hero__image[src*="faq-heroe"]{object-position:54% 40%;}
}
@media (max-width:768px){
  .page-hero__image[src*="faq-heroe"]{object-position:58% 38%;}
}

/* TMJ — Página 404 */
.page-404{background:var(--sand);}
.error-hero{position:relative;min-height:780px;display:grid;place-items:center;overflow:hidden;padding:150px 5vw 90px;background:var(--olive);color:var(--white);text-align:center;isolation:isolate;}
.error-hero::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(circle at 50% 26%,rgba(247,243,238,.12),transparent 30%),linear-gradient(180deg,rgba(30,27,26,.08),rgba(30,27,26,.34));}
.error-hero__texture{position:absolute;inset:0;z-index:-1;opacity:.2;background-image:linear-gradient(115deg,transparent 0 47%,rgba(247,243,238,.10) 47% 48%,transparent 48% 100%);background-size:72px 72px;mask-image:linear-gradient(to bottom,black,transparent 85%);}
.error-hero__inner{width:min(900px,100%);margin:0 auto;display:flex;flex-direction:column;align-items:center;}
.error-hero .page-kicker{color:var(--sand);margin-bottom:20px;}
.error-code{display:flex;align-items:center;justify-content:center;gap:clamp(12px,2.8vw,34px);font-size:clamp(6.4rem,19vw,13rem);font-weight:800;line-height:.78;letter-spacing:-.075em;color:var(--sand);margin:0 0 34px;}
.error-code img{width:clamp(96px,15vw,180px);height:clamp(96px,15vw,180px);object-fit:contain;display:block;filter:drop-shadow(0 18px 28px rgba(30,27,26,.18));animation:error-ball-float 4s ease-in-out infinite;}
.error-hero h1{max-width:760px;margin:0 0 22px;font-size:clamp(2.25rem,5.5vw,4.8rem);font-weight:700;line-height:.98;letter-spacing:-.045em;color:var(--white);}
.error-hero__lead{max-width:620px;margin:0 auto 32px;color:rgba(247,243,238,.82);font-size:clamp(1rem,1.8vw,1.14rem);line-height:1.7;}
.error-home{display:inline-flex!important;align-items:center;gap:10px;background:var(--terra)!important;color:var(--white)!important;text-decoration:none;}
.error-links{padding:clamp(68px,8vw,105px) 5vw;background:var(--sand);}
.error-links__inner{width:min(1120px,100%);margin:0 auto;}
.error-links h2{margin:0 0 34px;font-size:clamp(2rem,4vw,3.4rem);line-height:1.04;letter-spacing:-.035em;color:var(--ink);}
.error-links h2 span{color:var(--terra);}
.error-links__grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;}
.error-links__grid a{min-height:175px;display:flex;flex-direction:column;justify-content:space-between;padding:23px;border:1px solid var(--border);border-radius:var(--radius);background:rgba(247,243,238,.72);color:var(--ink);text-decoration:none;transition:transform .22s ease,border-color .22s ease,background .22s ease;}
.error-links__grid a:hover{transform:translateY(-3px);border-color:rgba(181,110,77,.42);background:var(--white);}
.error-links__grid small{font-size:.68rem;font-weight:750;letter-spacing:.12em;text-transform:uppercase;color:var(--terra);}
.error-links__grid strong{font-size:1.08rem;line-height:1.25;}
.error-links__grid a>span{align-self:flex-end;color:var(--terra);font-size:1.2rem;}
@keyframes error-ball-float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-10px) rotate(2deg)}}
@media(max-width:980px){.error-links__grid{grid-template-columns:repeat(2,1fr)}.error-links__grid a:last-child{grid-column:1/-1;min-height:145px}}
@media(max-width:620px){.error-hero{min-height:690px;padding:128px 20px 72px}.error-code{gap:10px;margin-bottom:28px}.error-code img{width:88px;height:88px}.error-links{padding:60px 20px}.error-links__grid{grid-template-columns:1fr}.error-links__grid a:last-child{grid-column:auto}.error-links__grid a{min-height:140px}}
@media(prefers-reduced-motion:reduce){.error-code img{animation:none}.error-links__grid a{transition:none}}
