/* ============================================================
   LUIS FELIPE DA SILVA — DESIGN SYSTEM
   ============================================================ */

:root{
  --black:#0a0a0a;
  --near-black:#0d0d0e;
  --charcoal:#151516;
  --graphite:#222224;
  --graphite-2:#2c2c2f;
  --line:rgba(255,255,255,0.09);
  --line-strong:rgba(255,255,255,0.16);
  --off-white:#f3f1ec;
  --white:#ffffff;
  --text:rgba(243,241,236,0.92);
  --text-dim:rgba(243,241,236,0.62);
  --text-dimmer:rgba(243,241,236,0.38);
  --accent:#b3202c;
  --accent-bright:#d42a38;
  --accent-dim:rgba(179,32,44,0.35);

  --font-display:'Oswald', sans-serif;
  --font-body:'Inter', sans-serif;

  --container:1320px;
  --pad:clamp(1.5rem, 5vw, 4rem);
  --section-pad:clamp(5.5rem, 12vw, 10rem);

  --ease:cubic-bezier(.16,.8,.24,1);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth; overflow-x:hidden; width:100%;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
}

body{
  margin:0;
  background:var(--black);
  color:var(--text);
  font-family:var(--font-body);
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  width:100%;
  position:relative;
}

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

h1,h2,h3,h4{
  font-family:var(--font-display);
  text-transform:uppercase;
  font-weight:700;
  line-height:0.98;
  letter-spacing:-0.01em;
  margin:0;
}

p{margin:0;}

.skip-link{
  position:absolute; left:-999px; top:0; z-index:999;
  background:var(--accent); color:#fff; padding:1em 1.5em;
}
.skip-link:focus{left:1rem; top:1rem;}

/* grain overlay — absolute (not fixed) against body: avoids the iOS/Android bug where a
   fixed+mix-blend-mode layer repaints incorrectly whenever the browser's address bar
   shows/hides, leaving a stale dark strip at the top during scroll */
.grain{
  position:absolute; top:0; left:0; right:0; height:100%; z-index:200; pointer-events:none;
  opacity:0.045; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%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");
}
@media (max-width:640px){
  .grain{display:none;}
}

/* ---------- utility ---------- */
.eyebrow{
  font-family:var(--font-display);
  text-transform:uppercase;
  letter-spacing:0.32em;
  font-size:0.72rem;
  font-weight:500;
  color:var(--text-dim);
  margin-bottom:1.1rem;
}
.eyebrow.center{text-align:center;}
.center{text-align:center;}
.accent-text{color:var(--accent-bright);}
.lede{font-size:clamp(1.05rem,1.6vw,1.25rem); color:var(--text-dim); font-weight:400; max-width:38em;}
.lede.center{margin-left:auto; margin-right:auto;}

.section{
  position:relative;
  padding:var(--section-pad) var(--pad);
  max-width:var(--container);
  margin:0 auto;
}

.btn{
  display:inline-flex; align-items:center; gap:0.6em;
  font-family:var(--font-display);
  text-transform:uppercase;
  letter-spacing:0.08em;
  font-size:0.9rem;
  font-weight:600;
  padding:1em 1.9em;
  border:1px solid var(--line-strong);
  transition:transform 0.35s var(--ease), background 0.35s, border-color 0.35s, color 0.35s;
  white-space:nowrap;
}
.btn span{transition:transform 0.3s var(--ease);}
.btn:hover span{transform:translateX(4px);}
.btn-primary{background:var(--accent); border-color:var(--accent); color:#fff;}
.btn-primary:hover{background:var(--accent-bright); border-color:var(--accent-bright);}
.btn-ghost{background:transparent; color:var(--off-white);}
.btn-ghost:hover{border-color:var(--off-white);}

/* ---------- reveal animations ---------- */
.reveal-up, .reveal-fade{
  opacity:0; transform:translateY(28px);
  transition:opacity 0.9s var(--ease), transform 0.9s var(--ease);
}
.reveal-fade{transform:translateY(14px);}
.reveal-up.is-visible, .reveal-fade.is-visible{opacity:1; transform:translateY(0);}

.reveal-line{display:block; overflow:hidden;}
.reveal-line span{
  display:block;
  transform:translateY(105%);
  transition:transform 0.9s var(--ease);
}
.reveal-line.is-visible span, .hero-title .reveal-line span{transform:translateY(0);}

/* stagger children */
.reveal-up:nth-child(2){transition-delay:0.08s;}
.reveal-up:nth-child(3){transition-delay:0.16s;}
.reveal-up:nth-child(4){transition-delay:0.24s;}
.reveal-up:nth-child(5){transition-delay:0.32s;}
.reveal-up:nth-child(6){transition-delay:0.4s;}
.reveal-up:nth-child(7){transition-delay:0.48s;}

/* ============================================================
   NAV
   ============================================================ */
.site-nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  transition:background 0.4s var(--ease), border-color 0.4s var(--ease), padding 0.4s var(--ease);
  border-bottom:1px solid transparent;
}
.site-nav.scrolled{
  background:rgba(10,10,10,0.85);
  backdrop-filter:blur(10px);
  border-bottom-color:var(--line);
}
.nav-inner{
  max-width:var(--container); margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  padding:1.4rem var(--pad);
  transition:padding 0.4s var(--ease);
}
.site-nav.scrolled .nav-inner{padding-top:1rem; padding-bottom:1rem;}
.nav-logo{
  font-family:var(--font-display); font-weight:700; text-transform:uppercase;
  font-size:1.05rem; letter-spacing:0.04em; color:#fff;
}
.nav-logo span{color:var(--text-dimmer); font-weight:400; margin-left:0.35em;}
.nav-links{display:none; gap:2.4rem;}
.nav-links a{
  font-family:var(--font-display); text-transform:uppercase; font-size:0.82rem;
  letter-spacing:0.14em; color:var(--text-dim);
  position:relative; padding-bottom:4px;
}
.nav-links a::after{
  content:''; position:absolute; left:0; bottom:0; width:0; height:1px;
  background:var(--accent-bright); transition:width 0.3s var(--ease);
}
.nav-links a:hover{color:#fff;}
.nav-links a:hover::after{width:100%;}

.nav-toggle{
  width:34px; height:24px; position:relative; background:none; border:none; cursor:pointer;
  display:flex; flex-direction:column; justify-content:space-between; padding:3px 0;
  z-index:210;
  filter:drop-shadow(0 1px 3px rgba(0,0,0,0.7));
}
.nav-toggle span{
  display:block; height:2px; width:100%; background:#fff; border-radius:1px;
  transition:transform 0.35s var(--ease), opacity 0.3s;
}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(8px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-8px) rotate(-45deg);}

.mobile-menu{
  position:fixed; inset:0; z-index:150; background:var(--black);
  display:flex; flex-direction:column; justify-content:space-between;
  padding:7rem var(--pad) 3rem;
  transform:translateY(-100%);
  transition:transform 0.55s var(--ease);
}
.mobile-menu.open{transform:translateY(0);}
.mobile-menu nav{display:flex; flex-direction:column; gap:1.1rem;}
.mobile-menu nav a{
  font-family:var(--font-display); text-transform:uppercase; font-weight:600;
  font-size:clamp(2.2rem,9vw,3rem); color:var(--off-white); letter-spacing:-0.01em;
}
.mobile-menu-foot a{
  font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.14em;
  color:var(--text-dim); font-size:0.9rem;
}

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:relative; height:100vh; height:100svh; min-height:560px;
  display:flex; align-items:flex-end;
  overflow:hidden;
}
.hero-media{position:absolute; inset:0; z-index:1;}
.hero-media img{
  width:100%; height:100%; object-fit:cover; object-position:60% 25%;
  filter:brightness(0.72) contrast(1.08);
  transform:scale(1.06);
  will-change:transform;
}
.hero-scrim{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(10,10,10,0.55) 0%, rgba(10,10,10,0.1) 32%, rgba(10,10,10,0.25) 60%, rgba(10,10,10,0.92) 100%),
    linear-gradient(90deg, rgba(10,10,10,0.55) 0%, rgba(10,10,10,0) 45%);
}
.hero-content{
  position:relative; z-index:2;
  width:100%; max-width:var(--container); margin:0 auto;
  padding:0 var(--pad) clamp(3rem,8vh,6rem);
}
.hero-title{
  font-size:clamp(2.8rem, 9.5vw, 7.2rem);
  color:#fff;
}
.hero-sub{
  margin-top:1.6rem;
  font-family:var(--font-display); text-transform:uppercase;
  font-size:1.05rem; letter-spacing:0.06em; color:var(--off-white);
}
.hero-sub span{color:var(--text-dim); font-weight:400; letter-spacing:0.1em; font-size:0.88rem;}
.hero-cta{margin-top:2.4rem; display:flex; flex-wrap:wrap; gap:1rem;}

.scroll-hint{
  position:absolute; bottom:1.8rem; left:50%; transform:translateX(-50%); z-index:2;
  width:1px; height:48px; background:var(--line-strong); overflow:hidden;
}
.scroll-hint span{
  display:block; width:100%; height:40%; background:var(--off-white);
  animation:scrollhint 2.2s ease-in-out infinite;
}
@keyframes scrollhint{
  0%{transform:translateY(-100%);}
  100%{transform:translateY(250%);}
}

/* ============================================================
   STORY
   ============================================================ */
.story{
  display:grid; grid-template-columns:minmax(0,1fr); gap:2.5rem;
  align-items:center;
}
.story-media img{
  width:100%; aspect-ratio:4/5; object-fit:cover;
  filter:brightness(0.92) contrast(1.05);
}
.story h2{font-size:clamp(2.2rem,5.2vw,3.6rem); margin-bottom:1.4rem; color:#fff;}
.story-copy p + p{margin-top:1.1rem;}
.story-copy .lede{color:var(--off-white); font-weight:500;}

/* ============================================================
   STATS
   ============================================================ */
.stats{max-width:100%; padding-top:0; padding-bottom:0;}
.stats-grid{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  border-top:1px solid var(--line); border-left:1px solid var(--line);
}
.stat{
  border-right:1px solid var(--line); border-bottom:1px solid var(--line);
  padding:clamp(2.5rem,6vw,4.5rem) 1.5rem;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center;
}
.stat-num{
  font-family:var(--font-display); font-weight:300;
  font-size:clamp(3.4rem,9vw,7rem); line-height:1; color:#fff;
  font-variant-numeric:tabular-nums;
}
.stat-label{
  margin-top:0.9rem;
  font-family:var(--font-display); text-transform:uppercase;
  letter-spacing:0.22em; font-size:0.78rem; color:var(--text-dim);
}

/* ============================================================
   MISSION
   ============================================================ */
.mission{
  text-align:center;
  padding-top:clamp(6rem,14vw,11rem); padding-bottom:clamp(6rem,14vw,11rem);
}
.mission-inner{max-width:900px; margin:0 auto;}
.mission-line{
  font-family:var(--font-display); text-transform:uppercase; font-weight:700;
  font-size:clamp(2.6rem,9vw,6rem); line-height:1.02; color:#fff;
}
.mission-sub{color:var(--text-dimmer);}
@supports (-webkit-text-stroke: 1px black) or (text-stroke: 1px black){
  .mission-sub{color:transparent; -webkit-text-stroke:1px var(--text-dim); text-stroke:1px var(--text-dim);}
}
.mission-copy{
  margin-top:2.5rem; font-size:clamp(1rem,1.6vw,1.2rem); color:var(--text-dim);
  max-width:34em; margin-left:auto; margin-right:auto;
}

/* ============================================================
   TIMELINE
   ============================================================ */
.timeline h2{font-size:clamp(2.2rem,5.5vw,3.8rem); margin-bottom:clamp(3rem,7vw,5rem); color:#fff;}
.timeline-track{position:relative; padding-left:2.2rem;}
.timeline-line{
  position:absolute; left:0; top:0.6rem; bottom:0.6rem; width:1px;
  background:var(--line);
}
.timeline-line span{
  position:absolute; top:0; left:0; width:100%; height:0%;
  background:var(--accent-bright);
  transition:height 0.15s linear;
}
.tl-item{
  position:relative; display:grid; grid-template-columns:minmax(0,1fr); gap:1.4rem;
  padding-bottom:clamp(3rem,7vw,5rem);
}
.tl-item::before{
  content:''; position:absolute; left:-2.2rem; top:0.5rem;
  width:9px; height:9px; border-radius:50%;
  background:var(--black); border:1px solid var(--text-dim);
  transform:translateX(-4.5px);
}
.tl-media{
  aspect-ratio:16/10; overflow:hidden; background:var(--charcoal);
  border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
}
.tl-media img{width:100%; height:100%; object-fit:cover; filter:grayscale(0.75) contrast(1.08) brightness(0.85); transition:filter 0.6s var(--ease), transform 0.6s var(--ease);}
.tl-media:hover img{filter:grayscale(0) contrast(1.02) brightness(0.95); transform:scale(1.04);}
.tl-media--text{
  font-family:var(--font-display); text-transform:uppercase; font-weight:700;
  font-size:2.4rem; letter-spacing:0.05em; color:var(--graphite-2);
}
.tl-media--accent{color:var(--accent-dim); font-size:3rem;}
.tl-year{
  font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.2em;
  font-size:0.78rem; color:var(--text-dim);
}
.tl-copy h3{font-size:clamp(1.5rem,3vw,2.1rem); margin:0.5rem 0 0.6rem; color:#fff;}
.tl-copy p{color:var(--text-dim); max-width:32em;}
.tl-item--final .tl-copy h3{line-height:1.05;}

/* ============================================================
   BOXING
   ============================================================ */
.boxing{display:grid; grid-template-columns:minmax(0,1fr); gap:2.5rem; align-items:start;}
.boxing-media img{width:100%; aspect-ratio:4/5; object-fit:cover; filter:grayscale(0.55) brightness(0.9) contrast(1.08);}
.boxing h2{font-size:clamp(2.2rem,5.2vw,3.6rem); margin-bottom:1rem; color:#fff;}
.boxing-copy > .lede{margin-bottom:2.2rem;}
.boxing-style{
  display:grid; grid-template-columns:minmax(0,1fr); gap:1.6rem;
  padding:1.8rem 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  margin-bottom:2.2rem;
}
.style-item h4{
  font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.03em;
  font-size:1.05rem; color:#fff; margin-bottom:0.4rem;
}
.style-item p{color:var(--text-dim); font-size:0.95rem;}

.corner{display:flex; flex-direction:column;}
.corner-row{
  display:flex; justify-content:space-between; gap:1.5rem;
  padding:0.85rem 0; border-bottom:1px solid var(--line);
  font-size:0.95rem;
}
.corner-label{
  font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.14em;
  font-size:0.72rem; color:var(--text-dimmer); white-space:nowrap; padding-top:0.15rem;
}
.corner-value{color:var(--off-white); text-align:right;}
.corner-value em{display:block; font-style:normal; color:var(--text-dim); font-size:0.82rem; margin-top:0.15rem;}

/* ============================================================
   ACHIEVEMENTS
   ============================================================ */
.achievements h2{font-size:clamp(2.2rem,5.5vw,3.8rem); margin-bottom:clamp(3rem,7vw,4.5rem); color:#fff;}
.ach-grid{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px;
  background:var(--line);
}
.ach-grid > div{background:var(--black); padding:2rem;}
.ach-big{display:flex; flex-direction:column; justify-content:center; align-items:flex-start; min-height:180px;}
.ach-num{font-family:var(--font-display); font-weight:300; font-size:clamp(3.5rem,9vw,6rem); color:#fff; line-height:1;}
.ach-label{margin-top:0.6rem; font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.2em; font-size:0.75rem; color:var(--text-dim);}
.ach-media{padding:0 !important; grid-column:span 2; aspect-ratio:16/9; overflow:hidden;}
.ach-media img{width:100%; height:100%; object-fit:cover; filter:grayscale(0.7) contrast(1.1) brightness(0.85); transition:filter 0.6s var(--ease), transform 0.6s var(--ease);}
.ach-media:hover img{filter:grayscale(0) brightness(0.95); transform:scale(1.04);}
.ach-title{display:flex; flex-direction:column; justify-content:center; min-height:140px;}
.ach-title h3{font-size:clamp(1.1rem,2.4vw,1.5rem); color:#fff; line-height:1.15; overflow-wrap:break-word; hyphens:auto;}
.ach-title span{margin-top:0.5rem; font-size:0.85rem; color:var(--text-dim); font-family:var(--font-display); letter-spacing:0.08em; text-transform:uppercase;}
.ach-goal{grid-column:span 2; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:3rem 2rem !important;}
.ach-goal h3{font-size:clamp(2rem,6vw,3.2rem); margin-top:0.5rem;}

/* ============================================================
   SOCIAL
   ============================================================ */
.social-head h2{font-size:clamp(2.2rem,5.5vw,3.8rem); color:#fff; margin:0.8rem 0 1.4rem;}
.social-stats{display:flex; gap:2.5rem; margin:2rem 0;}
.social-stats div{display:flex; flex-direction:column;}
.social-stats span{font-family:var(--font-display); font-size:clamp(1.8rem,4vw,2.6rem); color:#fff; font-weight:600;}
.social-stats em{font-style:normal; font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.14em; font-size:0.72rem; color:var(--text-dim); margin-top:0.3rem;}
.social-grid{
  margin-top:clamp(3rem,6vw,4.5rem);
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0.5rem;
}
.social-card{aspect-ratio:4/5; overflow:hidden; background:var(--charcoal);}
.social-card img{width:100%; height:100%; object-fit:cover; filter:grayscale(0.65) contrast(1.08) brightness(0.85); transition:filter 0.6s var(--ease), transform 0.6s var(--ease);}
.social-card:hover img{filter:grayscale(0) brightness(0.95); transform:scale(1.06);}

/* ============================================================
   PARTNERS
   ============================================================ */
.partners h2{font-size:clamp(2.2rem,5.5vw,3.8rem); color:#fff; margin-bottom:1.2rem;}
.partner-logos{
  margin-top:clamp(3rem,6vw,4.5rem);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:clamp(3rem,8vw,6rem);
  padding:clamp(2.2rem,5vw,3.5rem) 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.partner-logo{
  display:flex; align-items:center; justify-content:center;
  height:56px;
}
.partner-logo img{
  max-height:100%; max-width:180px; width:auto; height:auto;
  object-fit:contain;
  filter:grayscale(1) brightness(0) invert(1);
  opacity:0.55;
  transition:filter 0.4s var(--ease), opacity 0.4s var(--ease), transform 0.4s var(--ease);
}
.partner-logo:hover img{
  filter:none;
  opacity:1;
  transform:scale(1.06);
}

/* ============================================================
   SPONSORSHIP
   ============================================================ */
.sponsorship h2{font-size:clamp(2.2rem,5.5vw,3.8rem); color:#fff; margin-bottom:1rem;}
.benefits{
  margin:clamp(3rem,6vw,4.5rem) 0;
  display:grid; grid-template-columns:minmax(0,1fr); gap:0;
  border-top:1px solid var(--line);
}
.benefit{
  padding:2rem 0.5rem; border-bottom:1px solid var(--line);
  display:grid; grid-template-columns:auto minmax(0,1fr); gap:0.4rem 1.5rem; align-items:start;
}
.benefit-num{
  font-family:var(--font-display); font-weight:300; font-size:1.6rem; color:var(--text-dimmer);
  grid-row:span 2;
}
.benefit h3{font-size:1.25rem; color:#fff; align-self:end;}
.benefit p{color:var(--text-dim); font-size:0.95rem; max-width:36em;}

/* ============================================================
   INVESTMENT
   ============================================================ */
.investment h2{font-size:clamp(2.2rem,5.5vw,3.8rem); color:#fff; margin-bottom:clamp(3rem,6vw,4.5rem);}
.investment-figure{text-align:center; margin-bottom:clamp(3rem,6vw,4.5rem);}
.investment-num{
  display:block; font-family:var(--font-display); font-weight:700;
  font-size:clamp(3rem,10vw,6.5rem); color:var(--accent-bright); letter-spacing:-0.01em;
}
.investment-sub{display:block; margin-top:0.8rem; color:var(--text-dim); font-size:0.95rem;}
.investment-list{max-width:640px; margin:0 auto;}
.inv-row{
  display:flex; justify-content:space-between; gap:1rem;
  padding:1rem 0; border-bottom:1px solid var(--line);
  font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.03em;
  font-size:0.95rem; color:var(--off-white);
}
.inv-row span:last-child{color:var(--text-dim); font-variant-numeric:tabular-nums;}

/* ============================================================
   FINAL CTA
   ============================================================ */
.final-cta{
  max-width:100%; padding:0;
  position:relative; min-height:100vh; min-height:100svh;
  display:flex; align-items:flex-end;
  overflow:hidden;
}
.final-media{position:absolute; inset:0; z-index:1;}
.final-media img{width:100%; height:100%; object-fit:cover; object-position:50% 20%; filter:grayscale(1) brightness(0.6) contrast(1.15);}
.final-content{
  position:relative; z-index:2; width:100%; max-width:var(--container); margin:0 auto;
  padding:clamp(4rem,10vh,7rem) var(--pad);
  text-align:center;
}
.final-content h2{font-size:clamp(2.6rem,9vw,6.5rem); color:#fff;}
.final-name{
  margin-top:2rem; font-family:var(--font-display); text-transform:uppercase;
  letter-spacing:0.1em; font-size:1.1rem; color:var(--off-white);
}
.final-tag{margin-top:0.6rem; color:var(--text-dim); font-size:0.95rem;}
.final-btns{margin-top:2.4rem; display:flex; flex-wrap:wrap; gap:1rem; justify-content:center;}

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer{border-top:1px solid var(--line); padding:2.5rem var(--pad);}
.footer-inner{
  max-width:var(--container); margin:0 auto;
  display:flex; flex-direction:column; gap:1.2rem;
}
.footer-brand{display:flex; flex-direction:column;}
.footer-name{font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.05em; color:#fff; font-size:1rem;}
.footer-sub{color:var(--text-dimmer); font-size:0.82rem; margin-top:0.2rem;}
.footer-links{display:flex; gap:1.6rem;}
.footer-links a{font-size:0.85rem; color:var(--text-dim); transition:color 0.3s;}
.footer-links a:hover{color:#fff;}
.footer-copy{color:var(--text-dimmer); font-size:0.78rem;}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (min-width:640px){
  .stats-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
  .benefits{grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:3rem;}
  .benefit{border-right:1px solid var(--line);}
  .benefit:nth-child(2n){border-right:none;}
  .social-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}

@media (min-width:900px){
  .nav-links{display:flex;}
  .nav-toggle{display:none;}

  .story{grid-template-columns:0.85fr minmax(0,1fr); gap:5rem;}
  .story-media{order:1;}
  .story-copy{order:2;}

  .boxing{grid-template-columns:0.8fr minmax(0,1fr); gap:5rem;}
  .boxing-style{grid-template-columns:repeat(3,minmax(0,1fr));}

  .tl-item{grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:3.5rem; align-items:center;}
  .tl-item:nth-child(even) .tl-media{order:2;}

  .ach-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
  .ach-media{grid-column:span 2;}
  .ach-goal{grid-column:span 4; flex-direction:row; gap:1.2rem; padding:2.5rem 2rem !important;}
  .ach-goal h3{margin-top:0;}

  .social-head{display:flex; align-items:flex-end; justify-content:space-between; gap:3rem; flex-wrap:wrap;}
  .social-head > *{flex:1 1 auto;}

  .hero-title{max-width:56rem;}
}

@media (min-width:1200px){
  :root{--section-pad:clamp(6rem,10vw,11rem);}
  .ach-grid{grid-template-columns:repeat(4, minmax(0,1fr));}
}

/* image hover zoom generic (favourite media blocks) */
.story-media, .boxing-media, .tl-media, .social-card, .ach-media{overflow:hidden;}
.story-media img, .boxing-media img{transition:transform 0.7s var(--ease);}
.story-media:hover img, .boxing-media:hover img{transform:scale(1.035);}