/* =========================================================
   XIBALBA FIGHTERS — design tokens
   Obsidian Black / Dirty Bone / Xibalba Red
   ========================================================= */
:root{
  --obsidian:#0D0D0D;
  --obsidian-2:#171717;
  --bone:#EDE6D6;
  --bone-dim:#B9AF98;
  --red:#CB2721;
  --red-dim:#8f1c18;

  --display: "Big Shoulders Display", sans-serif;
  --body: "Inter", sans-serif;

  --container: 1180px;
  --edge: 1.5rem;
  --radius: 2px;

  --ease: cubic-bezier(.22,.61,.36,1);
}

@media (min-width: 720px){
  :root{ --edge: 3rem; }
}

*,*::before,*::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ animation-duration:0.001ms !important; transition-duration:0.001ms !important; }
}

/* Scroll reveal — single consistent system across the page */
.reveal{ opacity:0; transform:translateY(14px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-revealed{ opacity:1; transform:translateY(0); }

/* Grain — subtle premium texture, sits above everything, never blocks interaction */
body::after{
  content:"";
  position:fixed; inset:0; z-index:200; pointer-events:none;
  opacity:.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

body{
  margin:0;
  background:var(--obsidian);
  color:var(--bone);
  font-family:var(--body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }

::selection{ background:var(--red); color:var(--bone); }

:focus-visible{
  outline:2px solid var(--red);
  outline-offset:3px;
}

.section-inner{
  max-width:var(--container);
  margin:0 auto;
  padding-left:var(--edge);
  padding-right:var(--edge);
}

/* ---------- Typography scale ---------- */
.eyebrow{
  font-family:var(--body);
  font-weight:700;
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  margin:0 0 1rem;
}
.eyebrow--light{ color:var(--bone-dim); }
.eyebrow--dark{ color:#8a8378; }

h1,h2,h3{ font-family:var(--display); font-weight:800; text-transform:uppercase; margin:0; }

p{ margin:0 0 1rem; max-width:62ch; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:.4em;
  font-family:var(--body);
  font-weight:700;
  font-size:.85rem;
  letter-spacing:.05em;
  text-transform:uppercase;
  padding:1rem 1.6rem;
  border-radius:var(--radius);
  border:1px solid transparent;
  cursor:pointer;
  transition:transform .18s var(--ease), background-color .18s var(--ease), color .18s var(--ease), border-color .18s var(--ease);
  white-space:nowrap;
}
.btn:hover{ transform:translateY(-1px); }
.btn:active{ transform:translateY(0); }

.btn--primary{ background:var(--red); color:var(--bone); }
.btn--primary:hover{ background:#e02e27; }

.btn--ghost-light{ background:transparent; color:var(--bone); border-color:rgba(237,230,214,.35); }
.btn--ghost-light:hover{ border-color:var(--bone); background:rgba(237,230,214,.06); }

.btn--primary-outline-dark{
  display:inline-flex; align-items:center; gap:.4em;
  font-family:var(--body); font-weight:700; font-size:.85rem; letter-spacing:.05em; text-transform:uppercase;
  padding:1rem 1.6rem; border-radius:var(--radius); border:1px solid var(--obsidian); color:var(--obsidian);
  background:transparent; transition:background-color .18s var(--ease), color .18s var(--ease);
}
.btn--primary-outline-dark:hover{ background:var(--obsidian); color:var(--bone); }

.btn--small{ padding:.7rem 1.1rem; font-size:.72rem; }
.btn--large{ padding:1.25rem 2.2rem; font-size:1rem; }
.btn--block{ display:flex; justify-content:center; width:100%; }

.cta-row{ display:flex; flex-wrap:wrap; gap:1rem; align-items:center; }

/* =========================================================
   NAV
   ========================================================= */
.nav{
  position:sticky; top:0; z-index:40;
  background:rgba(13,13,13,.88);
  backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(237,230,214,.08);
}
.nav__inner{
  max-width:var(--container); margin:0 auto;
  padding:.85rem var(--edge);
  display:flex; align-items:center; gap:1.5rem;
}
.nav__mark{ display:flex; align-items:center; gap:.7rem; margin-right:auto; }
.nav__mark-icon{ width:26px; height:auto; }
.nav__mark-logo{ height:22px; width:auto; }

.nav__links{ display:none; gap:1.6rem; }
.nav__links a{
  font-size:.78rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  color:var(--bone-dim); transition:color .15s var(--ease);
}
.nav__links a:hover{ color:var(--bone); }

.nav__cta{ display:none; }

.nav__burger{
  width:36px; height:36px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;
  background:none; border:none; cursor:pointer; padding:0;
}
.nav__burger span{ width:22px; height:2px; background:var(--bone); transition:transform .25s var(--ease), opacity .2s var(--ease); }
.nav__burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav__burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav__burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

.nav__mobile{
  max-height:0; overflow:hidden;
  transition:max-height .3s var(--ease);
  border-top:1px solid rgba(237,230,214,.08);
  display:flex; flex-direction:column;
}
.nav__mobile.is-open{ max-height:26rem; }
.nav__mobile a{
  padding:1rem var(--edge);
  font-size:.85rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  border-bottom:1px solid rgba(237,230,214,.06);
  color:var(--bone-dim);
}
.nav__mobile-cta{ margin:1rem var(--edge); justify-content:center; color:var(--bone) !important; }

@media (min-width:960px){
  .nav__links{ display:flex; }
  .nav__cta{ display:inline-flex; }
  .nav__burger{ display:none; }
  .nav__mobile{ display:none; }
}

/* =========================================================
   HERO — editorial cover moment
   ========================================================= */
.hero{
  position:relative;
  min-height:100svh;
  display:flex; flex-direction:column; justify-content:flex-end;
  overflow:hidden;
  padding:5.5rem 0 2.5rem;
}
.hero__photo{ position:absolute; inset:0; z-index:0; }
.hero__photo img{
  width:100%; height:100%; object-fit:cover; object-position:68% 30%;
  transform:scale(1.08);
  filter:contrast(1.1) brightness(.72);
}
.hero__vignette{
  position:absolute; inset:0; z-index:0;
  background:
    linear-gradient(180deg, rgba(13,13,13,.75) 0%, rgba(13,13,13,.25) 30%, rgba(13,13,13,.55) 62%, rgba(13,13,13,.97) 100%),
    linear-gradient(90deg, rgba(13,13,13,.55) 0%, transparent 45%);
}

.hero__spine{
  display:none;
}
@media (min-width:960px){
  .hero__spine{
    display:block; position:absolute; z-index:1; top:50%; right:1.5rem;
    transform:translateY(-50%) rotate(90deg); transform-origin:right center;
    font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; color:var(--bone-dim);
    white-space:nowrap; margin:0;
  }
}

.hero__frame{ position:relative; z-index:1; padding:0 var(--edge); max-width:var(--container); margin:0 auto; width:100%; }

.hero__top{ display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1.25rem; }
.hero__kicker{ margin:0; }
.hero__pulse{
  display:flex; align-items:center; gap:.5rem;
  font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--bone-dim);
}
.hero__pulse span{
  width:8px; height:8px; border-radius:50%; background:var(--red);
  box-shadow:0 0 0 0 rgba(203,39,33,.6);
  animation:pulse-red 2.4s ease-out infinite;
}
@keyframes pulse-red{
  0%{ box-shadow:0 0 0 0 rgba(203,39,33,.55); }
  70%{ box-shadow:0 0 0 10px rgba(203,39,33,0); }
  100%{ box-shadow:0 0 0 0 rgba(203,39,33,0); }
}
@media (prefers-reduced-motion: reduce){ .hero__pulse span{ animation:none; } }

.hero__title{ margin:0; }
.hero__word{
  display:block;
  font-size:clamp(3.4rem, 13vw, 7.5rem);
  line-height:.9;
  letter-spacing:-.01em;
}
.hero__word--b{ margin-left:0; }
.hero__word.is-red{ color:var(--red); }
@media (min-width:960px){
  .hero__word--a{ margin-left:0; }
  .hero__word--b{ margin-left:10vw; }
  .hero__word--c{ margin-left:20vw; }
}

.hero__bottom{ margin-top:1.75rem; max-width:34ch; }
.hero__lede{ font-size:1.02rem; color:var(--bone-dim); margin:0 0 1.1rem; }

.hero__offer{
  display:inline-flex; align-items:center; flex-wrap:wrap; gap:.5rem;
  margin:0 0 .85rem; padding:.6rem 1rem;
  border:1px solid rgba(237,230,214,.22);
  font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; font-weight:700; color:var(--bone);
}
.hero__offer-x{ color:var(--red); font-weight:700; }
.hero__offer-tag{ color:var(--bone-dim); font-weight:600; margin-left:.25rem; }
.hero__no-exp{ margin:0 0 1.5rem; font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; color:var(--bone-dim); font-weight:600; }

.hero__marks{
  display:none;
}
@media (min-width:960px){
  .hero__marks{
    display:block; position:absolute; z-index:1; left:var(--edge); bottom:8rem; width:30px; opacity:.55; pointer-events:none;
  }
  .hero__marks img{ width:100%; height:auto; filter:brightness(1.4); }
}

.hero__threshold{
  position:absolute; z-index:1; top:5.5rem; right:var(--edge); width:34px; opacity:.5; pointer-events:none;
}
@media (min-width:960px){ .hero__threshold{ width:44px; top:6.5rem; } }

.hero__scroll{
  position:relative; z-index:1;
  margin-top:2.75rem; padding:0 var(--edge);
  display:flex; align-items:center; gap:.9rem;
}
.hero__scroll span{
  width:1px; height:34px; background:linear-gradient(var(--red), transparent);
}
.hero__scroll p{ margin:0; font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; color:var(--bone-dim); }

/* =========================================================
   MANIFIESTO (dark, editorial — brand content)
   ========================================================= */
.manifesto{ padding:6rem 0; border-top:1px solid rgba(237,230,214,.08); }
.manifesto__layout{ display:grid; grid-template-columns:1fr; gap:2.5rem; }
@media (min-width:860px){ .manifesto__layout{ grid-template-columns:1fr 1fr; gap:4rem; align-items:start; } }
.manifesto__title{ font-size:clamp(2.4rem, 6vw, 3.6rem); line-height:.98; max-width:14ch; margin-bottom:2rem; }
.manifesto__photo{ width:100%; max-width:280px; aspect-ratio:4/5; object-fit:cover; object-position:top; border:1px solid rgba(237,230,214,.12); }
.manifesto__copy p{ color:var(--bone-dim); font-size:1.05rem; max-width:46ch; }
.manifesto__quote{
  margin:1.75rem 0 0; padding-left:1.5rem;
  border-left:2px solid var(--red);
  font-family:var(--display); font-weight:700; text-transform:none;
  font-size:clamp(1.3rem, 3vw, 1.75rem); line-height:1.25; color:var(--bone);
  max-width:20ch;
}
.manifesto__quote span{ color:var(--red); }

/* =========================================================
   02 — PROCESS (light section)
   ========================================================= */
.process{ background:var(--bone); color:var(--obsidian); padding:6rem 0; }
.process__title{ font-size:clamp(2.2rem, 6vw, 4rem); line-height:.98; margin:0 0 1.5rem; max-width:14ch; }
.process__body{ max-width:56ch; color:#3a3630; font-size:1.05rem; }

.marks-row{
  display:grid; grid-template-columns:1fr; gap:2.5rem;
  margin:3rem 0 2.5rem;
}
@media (min-width:760px){
  .marks-row{ grid-template-columns:repeat(3,1fr); gap:2rem; }
  .marks-item:nth-child(2){ margin-top:5rem; }
  .marks-item:nth-child(3){ margin-top:1.25rem; }
}
.marks-item{ border-top:1px solid rgba(13,13,13,.18); padding-top:1.5rem; max-width:26ch; }
.marks-item__icon{ width:64px; height:44px; overflow:hidden; margin-bottom:1.5rem; position:relative; }
.marks-item__icon img{ position:absolute; width:64px; height:auto; left:0; }
.marks-item__icon--descend img{ top:-42px; }
.marks-item__icon--fight img{ top:-169px; }
.marks-item__icon--rise img{ top:-296px; }
.marks-item h3{ font-family:var(--display); font-weight:800; text-transform:uppercase; font-size:1.4rem; margin-bottom:.7rem; }
.marks-item p{ font-size:.92rem; color:#4d473d; margin:0; }

/* =========================================================
   03 — CLASSES (dark)
   ========================================================= */
.classes{ padding:6rem 0; }
.classes__title{ font-size:clamp(2.2rem, 6vw, 4rem); margin:0 0 1rem; }
.classes__sub{ color:var(--bone-dim); max-width:52ch; margin-bottom:3rem; }

.classes__grid{ border-top:1px solid rgba(237,230,214,.14); }

.discipline-row{
  display:grid; grid-template-columns:2.5rem 1fr; gap:.5rem 1.25rem;
  padding:1.75rem 0; border-bottom:1px solid rgba(237,230,214,.14);
  transition:padding-left .25s var(--ease);
}
@media (min-width:760px){
  .discipline-row{ grid-template-columns:3rem 1.4fr 1fr; align-items:center; gap:1.5rem; }
}
.discipline-row:hover{ padding-left:.5rem; }
.discipline-row__num{ font-family:var(--display); font-size:1.1rem; color:var(--red); }
.discipline-row__main h3{ font-size:clamp(1.6rem,3.5vw,2.25rem); margin-bottom:.4rem; }
.discipline-row__main p{ color:var(--bone-dim); font-size:.92rem; margin:0; max-width:46ch; }
.discipline-row__meta{ grid-column:2/3; display:flex; justify-content:space-between; align-items:center; margin-top:.75rem; }
@media (min-width:760px){ .discipline-row__meta{ grid-column:auto; flex-direction:column; align-items:flex-end; gap:.5rem; margin-top:0; } }
.discipline-row__meta span{ font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--bone-dim); }
.discipline-row__meta a{ font-size:.78rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--bone); white-space:nowrap; }
.discipline-row__meta a:hover{ color:var(--red); }
.discipline-row--cta .discipline-row__num{ color:var(--bone-dim); }
.discipline-row--cta .discipline-row__cta-title{ font-family:var(--body); font-size:1.2rem; text-transform:none; font-weight:800; }

/* =========================================================
   04 — BOOKING (light section)
   ========================================================= */
.booking{ background:var(--bone); color:var(--obsidian); padding:6rem 0; }
.booking__title{ font-size:clamp(2.2rem, 6vw, 4rem); margin-bottom:.75rem; }
.booking__sub{ color:#4d473d; margin-bottom:3rem; }

.booking__layout{ display:grid; grid-template-columns:1fr; gap:2rem; align-items:start; }
@media (min-width:960px){ .booking__layout{ grid-template-columns:1.5fr 1fr; gap:3rem; } }

.booking__widget{
  background:var(--obsidian); color:var(--bone);
  border:1px solid rgba(237,230,214,.08);
  display:flex; flex-direction:column;
}

/* booking step chrome */
.bk-steps{ display:flex; align-items:center; gap:.5rem; padding:1.5rem 1.75rem 0; }
.bk-step{ font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; color:#5f594e; display:flex; align-items:center; gap:.5rem; }
.bk-step.is-active{ color:var(--bone); }
.bk-step.is-done{ color:var(--red); }
.bk-step__dot{ width:6px; height:6px; border-radius:50%; background:currentColor; }
.bk-step__line{ flex:1; height:1px; background:rgba(237,230,214,.15); }

.bk-body{ padding:1.75rem; flex:1; display:flex; flex-direction:column; }
.bk-heading{ font-family:var(--display); font-size:1.5rem; text-transform:uppercase; margin-bottom:.35rem; }
.bk-subheading{ color:var(--bone-dim); font-size:.9rem; margin-bottom:1.5rem; }

.bk-days{ display:flex; gap:.6rem; overflow-x:auto; padding-bottom:.5rem; margin-bottom:.5rem; -webkit-overflow-scrolling:touch; }
.bk-day{
  flex:0 0 auto; min-width:64px;
  background:transparent; border:1px solid rgba(237,230,214,.18); color:var(--bone);
  padding:.85rem .5rem; border-radius:var(--radius); cursor:pointer;
  font-family:var(--body); font-size:.78rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase;
  text-align:center;
  transition:border-color .15s var(--ease), background-color .15s var(--ease), color .15s var(--ease);
}
.bk-day span{ display:block; font-size:1rem; margin-top:.2rem; font-weight:800; }
.bk-day:hover{ border-color:var(--bone); }
.bk-day.is-selected{ background:var(--red); border-color:var(--red); color:var(--bone); }

.bk-slots{ display:flex; flex-direction:column; gap:.75rem; margin-top:1.25rem; }
.bk-slot{
  display:flex; align-items:center; gap:1rem;
  border:1px solid rgba(237,230,214,.12); padding:1rem 1.1rem;
  border-radius:var(--radius);
}
.bk-slot__time{ font-family:var(--body); font-weight:800; font-size:1.05rem; min-width:5.2rem; }
.bk-slot__info{ flex:1; min-width:0; }
.bk-slot__disc{ font-weight:700; font-size:.95rem; text-transform:uppercase; letter-spacing:.02em; }
.bk-slot__meta{ font-size:.78rem; color:var(--bone-dim); margin-top:.15rem; }
.bk-slot__pick{
  flex:0 0 auto; background:none; border:1px solid var(--bone); color:var(--bone);
  padding:.55rem .9rem; font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  cursor:pointer; border-radius:var(--radius); transition:background-color .15s var(--ease), color .15s var(--ease);
}
.bk-slot__pick:hover{ background:var(--red); border-color:var(--red); }
.bk-slot--full{ opacity:.4; }
.bk-slot--full .bk-slot__pick{ pointer-events:none; border-color:#5f594e; color:#5f594e; }
.bk-empty{ color:var(--bone-dim); font-size:.9rem; padding:2rem 0; text-align:center; }

.bk-back{ align-self:flex-start; background:none; border:none; color:var(--bone-dim); font-size:.75rem; letter-spacing:.06em; text-transform:uppercase; cursor:pointer; margin-bottom:1.25rem; padding:0; }
.bk-back:hover{ color:var(--bone); }

.bk-summary{ background:rgba(237,230,214,.05); border:1px solid rgba(237,230,214,.1); padding:1rem 1.1rem; margin-bottom:1.5rem; border-radius:var(--radius); }
.bk-summary p{ margin:0; font-size:.85rem; color:var(--bone-dim); }
.bk-summary strong{ color:var(--bone); font-family:var(--body); font-weight:800; font-size:1.02rem; display:block; margin-top:.15rem; text-transform:uppercase; letter-spacing:.01em; }

.bk-form{ display:flex; flex-direction:column; gap:1rem; flex:1; }
.bk-field label{ display:block; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--bone-dim); margin-bottom:.5rem; }
.bk-field input{
  width:100%; background:transparent; border:1px solid rgba(237,230,214,.2); color:var(--bone);
  padding:.85rem 1rem; border-radius:var(--radius); font-family:var(--body); font-size:.95rem;
}
.bk-field input:focus{ border-color:var(--bone); outline:none; }
.bk-radio-row{ display:flex; gap:.6rem; flex-wrap:wrap; }
.bk-radio{
  border:1px solid rgba(237,230,214,.2); padding:.6rem 1rem; border-radius:var(--radius); cursor:pointer;
  font-size:.8rem; color:var(--bone-dim);
}
.bk-radio input{ margin-right:.4em; }
.bk-radio.is-checked{ border-color:var(--red); color:var(--bone); }
.bk-form .btn{ margin-top:.5rem; }

/* First class kit card — editorial starter pack */
.kit-card{
  background:var(--obsidian); color:var(--bone);
  border:1px solid rgba(237,230,214,.1);
  padding:2.25rem 0 0;
  overflow:hidden;
}
.kit-card__label{ font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--bone-dim); margin:0 1.75rem .4rem; }
.kit-card__title{ font-size:clamp(2rem,4vw,2.5rem); text-transform:uppercase; margin:0 1.75rem .9rem; line-height:.95; }
.kit-card__formula{
  margin:0 1.75rem 1.75rem; padding-bottom:1.5rem; border-bottom:1px solid rgba(237,230,214,.12);
  font-family:var(--display); font-weight:700; text-transform:uppercase; font-size:1.05rem; letter-spacing:.02em;
  color:var(--bone-dim); display:flex; flex-wrap:wrap; gap:.5rem;
}
.kit-card__formula span{ color:var(--red); }

.kit-list{ list-style:none; margin:0 0 1.75rem; padding:0; }
.kit-item{
  position:relative; display:flex; align-items:center; gap:1.1rem;
  padding:1.1rem 1.75rem; border-top:1px solid rgba(237,230,214,.1);
}
.kit-item:last-child{ border-bottom:1px solid rgba(237,230,214,.1); }
.kit-item__num{ font-family:var(--display); font-size:1.6rem; color:var(--red); min-width:2.2rem; line-height:1; }
.kit-item__body h4{ font-family:var(--display); font-weight:700; text-transform:uppercase; font-size:1.1rem; margin:0 0 .2rem; }
.kit-item__body p{ margin:0; font-size:.85rem; color:var(--bone-dim); }
.kit-item--photo{ padding-right:0; }
.kit-item__photo{ width:76px; height:76px; object-fit:cover; margin-left:auto; flex:0 0 auto; }

.kit-card__resolve{
  margin:0 0 1.75rem; padding:1.5rem 1.75rem;
  background:rgba(203,39,33,.08); border-top:1px solid rgba(237,230,214,.1); border-bottom:1px solid rgba(237,230,214,.1);
  font-family:var(--display); font-weight:700; text-transform:uppercase; font-size:1.15rem; line-height:1.3; color:var(--bone);
}
.kit-card__price{ margin:0; padding:0 1.75rem 1.75rem; font-size:.85rem; color:var(--bone-dim); }
.placeholder{ border:1px dashed var(--red); color:var(--red); padding:.1em .5em; font-weight:700; text-transform:uppercase; font-size:.78rem; }

.kit-card--compact{ padding:2rem 1.75rem; }
.kit-card--compact .kit-card__label{ margin:0 0 .75rem; }
.kit-card__formula--compact{ margin:0 0 1.5rem; padding:0; border:none; font-size:1.35rem; }

/* =========================================================
   05 — PRIMERA VEZ (light)
   ========================================================= */
.first-time{ background:var(--bone); color:var(--obsidian); padding:6rem 0; }
.first-time__title{ font-size:clamp(2.2rem,6vw,4rem); max-width:16ch; margin-bottom:3rem; }
.first-time__layout{ display:grid; grid-template-columns:1fr; gap:2rem; align-items:start; }
@media (min-width:960px){ .first-time__layout{ grid-template-columns:1.6fr 1fr; gap:3rem; } }

.faq{ border-top:1px solid rgba(13,13,13,.15); }
.faq-item{ border-bottom:1px solid rgba(13,13,13,.15); }
.faq-item__q{
  width:100%; text-align:left; background:none; border:none; cursor:pointer;
  display:flex; justify-content:space-between; align-items:center; gap:1rem;
  padding:1.35rem 0; font-family:var(--body); font-weight:700; font-size:1.02rem; color:var(--obsidian);
}
.faq-item__icon{ font-family:var(--display); font-size:1.2rem; color:var(--red); flex:0 0 auto; transition:transform .2s var(--ease); }
.faq-item.is-open .faq-item__icon{ transform:rotate(45deg); }
.faq-item__a{ max-height:0; overflow:hidden; transition:max-height .25s var(--ease); }
.faq-item.is-open .faq-item__a{ max-height:12rem; }
.faq-item__a p{ padding-bottom:1.35rem; margin:0; color:#4d473d; font-size:.95rem; max-width:58ch; }

.first-time .kit-card{ background:var(--obsidian); }

/* =========================================================
   06 — CULTURE (dark)
   ========================================================= */
.culture{ padding:0 0 6rem; }
.culture__opener{ position:relative; height:52vh; min-height:320px; max-height:560px; overflow:hidden; margin-bottom:5rem; }
.culture__opener img{ width:100%; height:100%; object-fit:cover; object-position:center 35%; }
.culture__opener::after{ content:""; position:absolute; inset:0; background:linear-gradient(0deg, var(--obsidian) 0%, transparent 40%); }
.culture__opener-tag{
  position:absolute; left:var(--edge); bottom:1.5rem; z-index:1; margin:0;
  font-family:var(--display); font-weight:700; text-transform:uppercase; letter-spacing:.02em;
  font-size:clamp(1.3rem,4vw,2.2rem); color:var(--bone);
}
.culture__title{ font-size:clamp(2.2rem,6vw,4rem); margin-bottom:1.25rem; max-width:16ch; }
.culture__body{ color:var(--bone-dim); max-width:58ch; margin-bottom:3rem; }

.culture__grid{ display:grid; grid-template-columns:repeat(2,1fr); grid-auto-rows:9rem; gap:.5rem; margin-bottom:3rem; }
@media (min-width:720px){ .culture__grid{ grid-template-columns:repeat(4,1fr); grid-auto-rows:11rem; } }
.culture__frame{
  margin:0; background:var(--obsidian-2);
  border:1px solid rgba(237,230,214,.08);
  display:flex; align-items:flex-end; padding:.9rem;
  position:relative; overflow:hidden;
}
.culture__frame img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}
.culture__frame::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(13,13,13,.85) 0%, rgba(13,13,13,.05) 55%, rgba(13,13,13,.25) 100%);
}
.culture__frame--tall{ grid-row:span 2; }
.culture__frame--wide{ grid-column:span 2; }
.culture__frame figcaption{ position:relative; z-index:1; font-size:.7rem; letter-spacing:.06em; text-transform:uppercase; color:var(--bone); }
.culture__tag{ font-family:var(--display); font-weight:800; font-size:clamp(1.8rem,5vw,3rem); margin:0; }

/* =========================================================
   07 — COACHES (light)
   ========================================================= */
.coaches{ background:var(--bone); color:var(--obsidian); padding:6rem 0; }
.coaches__title{ font-size:clamp(2.2rem,6vw,4rem); margin-bottom:3rem; }
.coaches__grid{ border-top:1px solid rgba(13,13,13,.16); }

.coach-row{
  display:grid; grid-template-columns:2.5rem 1fr; gap:.4rem 1.25rem;
  padding:1.75rem 0; border-bottom:1px solid rgba(13,13,13,.16);
}
@media (min-width:760px){
  .coach-row{ grid-template-columns:3rem 1fr auto 1.6fr auto; align-items:center; gap:1.5rem; }
  .coach-row > *{ grid-column:auto; }
}
.coach-row__num{ font-family:var(--display); font-size:1.1rem; color:var(--red); }
.coach-row h3{ font-size:clamp(1.6rem,3vw,2rem); grid-column:2; }
@media (min-width:760px){ .coach-row h3{ grid-column:auto; } }
.coach-row__disc{ grid-column:2; font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; color:var(--red); font-weight:700; margin-top:-.6rem; }
@media (min-width:760px){ .coach-row__disc{ grid-column:auto; margin-top:0; } }
.coach-row .coach-row__quote{ grid-column:2; font-size:.92rem; color:#4d473d; margin:.3rem 0 0; max-width:40ch; }
@media (min-width:760px){ .coach-row .coach-row__quote{ grid-column:auto; margin:0; } }
.coach-row a{ grid-column:2; justify-self:start; font-size:.78rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; margin-top:.5rem; }
@media (min-width:760px){ .coach-row a{ grid-column:auto; justify-self:end; margin-top:0; white-space:nowrap; } }
.coach-row a:hover{ color:var(--red); }

/* =========================================================
   08 — KIDS (dark, red-tinted)
   ========================================================= */
.kids{ padding:6rem 0; background:linear-gradient(180deg, var(--obsidian) 0%, #150606 100%); }
.kids__inner{ display:grid; grid-template-columns:1fr; gap:3rem; align-items:center; }
@media (min-width:860px){ .kids__inner{ grid-template-columns:1.3fr .7fr; } }
.kids__title{ font-size:clamp(2rem,5.5vw,3.4rem); margin-bottom:1.5rem; max-width:14ch; }
.kids__values{ list-style:none; margin:0 0 2rem; padding:0; display:flex; flex-wrap:wrap; gap:.6rem; }
.kids__values li{
  border:1px solid rgba(237,230,214,.2); padding:.5rem 1rem; font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; border-radius:var(--radius);
}
.kids__mark{ justify-self:center; position:relative; width:100%; max-width:300px; }
.kids__photo{ display:block; width:100%; aspect-ratio:3/4; object-fit:cover; border:1px solid rgba(237,230,214,.15); }
.kids__marks{ position:absolute; bottom:-1.5rem; right:-1.25rem; width:64px; opacity:.95; }

/* =========================================================
   09 — FINAL CTA
   ========================================================= */
.final-cta{ position:relative; padding:9rem 0 10rem; overflow:hidden; text-align:left; }
.final-cta__threshold{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; opacity:.3; pointer-events:none; }
.final-cta__threshold img{ width:118%; max-width:1300px; animation:threshold-breathe 6s ease-in-out infinite; }
@media (min-width:720px){ .final-cta__threshold img{ width:88%; } }
@keyframes threshold-breathe{
  0%, 100%{ transform:scale(1); opacity:1; }
  50%{ transform:scale(1.045); opacity:.85; }
}
@media (prefers-reduced-motion: reduce){ .final-cta__threshold img{ animation:none; } }
.final-cta__inner{ position:relative; z-index:1; }
.final-cta__title{ font-size:clamp(2.4rem,8vw,5rem); line-height:.98; margin-bottom:2rem; }
.final-cta__whatsapp{ margin-top:1.5rem; color:var(--bone-dim); font-size:.9rem; }
.final-cta__whatsapp a{ color:var(--bone); font-weight:700; text-decoration:underline; text-underline-offset:3px; }
.final-cta__whatsapp a:hover{ color:var(--red); }

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer{ background:var(--bone); color:var(--obsidian); padding:4rem 0 0; }
.site-footer__inner{ display:grid; grid-template-columns:1fr; gap:2.5rem; padding-bottom:3rem; border-bottom:1px solid rgba(13,13,13,.15); }
@media (min-width:760px){ .site-footer__inner{ grid-template-columns:1.3fr 1fr 1fr; } }
.site-footer__logo{ width:150px; margin-bottom:1rem; }
.site-footer__brand p{ font-size:.85rem; color:#4d473d; margin:0; }
.site-footer__links, .site-footer__contact{ display:flex; flex-direction:column; gap:.75rem; }
.site-footer__links a, .site-footer__contact a{ font-size:.85rem; font-weight:600; text-transform:uppercase; letter-spacing:.04em; }
.site-footer__links a:hover, .site-footer__contact a:hover{ color:var(--red); }
.site-footer__bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:.5rem; padding:1.5rem 0; font-size:.78rem; color:#6b6558; }
.site-footer__bottom p{ margin:0; }

/* =========================================================
   STICKY MOBILE CTA
   ========================================================= */
.sticky-cta{
  position:fixed; left:0; right:0; bottom:0; z-index:35;
  padding:.75rem var(--edge);
  padding-bottom:calc(.75rem + env(safe-area-inset-bottom));
  background:rgba(13,13,13,.94); backdrop-filter:blur(6px);
  border-top:1px solid rgba(237,230,214,.1);
  transform:translateY(0); transition:transform .3s var(--ease);
}
.sticky-cta.is-hidden{ transform:translateY(100%); }
.sticky-cta a{
  display:flex; justify-content:center; align-items:center;
  background:var(--red); color:var(--bone); padding:.95rem; border-radius:var(--radius);
  font-weight:700; font-size:.85rem; letter-spacing:.04em; text-transform:uppercase;
}
@media (min-width:960px){ .sticky-cta{ display:none; } }

/* =========================================================
   MODAL — confirmation
   ========================================================= */
.modal{
  position:fixed; inset:0; z-index:60;
  background:rgba(13,13,13,.8);
  display:flex; align-items:flex-end; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity .25s var(--ease);
}
.modal.is-open{ opacity:1; pointer-events:auto; }
@media (min-width:720px){ .modal{ align-items:center; } }
.modal__panel{
  background:var(--obsidian); color:var(--bone);
  border:1px solid rgba(237,230,214,.15);
  width:100%; max-width:520px;
  padding:2.5rem 2rem 2rem;
  position:relative;
  transform:translateY(2rem); transition:transform .3s var(--ease);
  max-height:90vh; overflow-y:auto;
}
.modal.is-open .modal__panel{ transform:translateY(0); }
.modal__close{
  position:absolute; top:1rem; right:1.25rem; background:none; border:none; color:var(--bone-dim);
  font-size:1.8rem; cursor:pointer; line-height:1;
}
.modal__close:hover{ color:var(--bone); }
.modal__title{ font-size:clamp(2.2rem,7vw,3rem); margin-bottom:1.5rem; }
.modal__details{ display:grid; grid-template-columns:auto 1fr; gap:.5rem 1rem; margin:0 0 1.5rem; }
.modal__details dt{ font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--bone-dim); }
.modal__details dd{ margin:0; font-weight:700; }
.modal__note{ color:var(--bone-dim); font-size:.9rem; margin-bottom:1.75rem; }
.modal__actions{ display:flex; flex-wrap:wrap; gap:.75rem; }
