/* ============================================================
   IRON CLASSIC — Design System v2
   "Gold's Gym / Venice Beach — Old School 80s"
   Orange & black, athletic type, sunburst, stripes, grain
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Anton&family=Archivo:wght@400;500;600;700;800;900&family=Saira+Condensed:wght@600;700;800;900&family=Space+Mono:wght@400;700&display=swap');

:root{
  /* surfaces — warm near-black */
  --bg:        #15110a;
  --bg-1:      #19140c;
  --surface:   #211a10;
  --surface-2: #2b2113;
  --line:        rgba(239,227,200,0.12);
  --line-strong: rgba(239,227,200,0.24);

  /* text */
  --text:    #f3e9d6;
  --muted:   #b0a48d;
  --muted-2: #756a54;

  /* accent — burnt orange */
  --iron:        #d49b2b;
  --iron-bright: #e8b54a;
  --iron-deep:   #a9760f;
  --iron-soft:   rgba(212,155,43,0.15);

  /* 1950s mustard hero */
  --mustard:      #d49b2b;
  --mustard-deep: #b9831c;
  --mustard-pale: #e4be6a;

  /* vintage paper light sections — exact hero video parchment */
  --cream:   #ece0c2;
  --cream-2: #ded0b0;
  --ink:     #181206;
  --ink-mut: #5c5238;

  --maxw: 1240px;
  --ease: cubic-bezier(.2,.7,.3,1);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:'Archivo', system-ui, sans-serif;
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  position:relative;
}
/* film grain overlay */
body::after{
  content:""; position:fixed; inset:0; z-index:9999; 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='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
::selection{ background:var(--iron); color:#1a0f03; }

/* ---------- typography ---------- */
.display{
  font-family:'Anton', sans-serif;
  font-weight:400;
  text-transform:uppercase;
  line-height:0.9;
  letter-spacing:0.005em;
  margin:0;
  text-shadow:3px 3px 0 rgba(0,0,0,0.45);
}
.eyebrow{
  font-family:'Space Mono', monospace;
  font-size:13px;
  letter-spacing:0.30em;
  text-transform:uppercase;
  color:var(--iron-bright);
  margin:0 0 22px;
  display:flex;
  align-items:center;
  gap:14px;
  font-weight:700;
}
.eyebrow::before, .eyebrow::after{
  content:""; height:0; border-top:7px solid transparent; border-bottom:7px solid transparent;
}
.eyebrow::before{ border-left:11px solid var(--iron); }
.eyebrow.center{ justify-content:center; }
.eyebrow.center::after{ border-right:11px solid var(--iron); border-left:0; }
.eyebrow:not(.center)::after{ display:none; }
h2.display{ font-size:clamp(42px, 6.4vw, 92px); }
h3{ font-family:'Archivo'; font-weight:800; letter-spacing:-0.01em; }
p{ text-wrap:pretty; }
.lead{ color:var(--muted); font-size:clamp(17px,1.4vw,20px); max-width:60ch; }

/* ---------- layout ---------- */
.wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 32px; }
section{ position:relative; }
.section-pad{ padding:clamp(80px,11vh,148px) 0; }

/* caution-stripe divider */
.stripe-rule{
  height:14px; width:100%;
  background:repeating-linear-gradient(-45deg, var(--iron) 0 16px, var(--ink) 16px 32px);
  border-top:2px solid var(--ink); border-bottom:2px solid var(--ink);
}

/* ---------- buttons — chunky retro sticker ---------- */
.btn{
  display:inline-flex; align-items:center; gap:11px;
  font-family:'Archivo'; font-weight:900;
  font-size:15px; letter-spacing:0.05em; text-transform:uppercase;
  padding:16px 30px;
  border:2.5px solid var(--ink);
  cursor:pointer;
  background:var(--mustard);
  color:#1a0f03;
  box-shadow:5px 5px 0 var(--ink);
  transition:transform .14s var(--ease), box-shadow .14s var(--ease), background .2s;
  position:relative;
  white-space:nowrap;
  border-radius:2px;
}
.btn:hover{ transform:translate(3px,3px); box-shadow:2px 2px 0 var(--ink); background:var(--mustard-pale); }
.btn:active{ transform:translate(5px,5px); box-shadow:0 0 0 var(--ink); }
.btn .arrow{ transition:transform .2s var(--ease); }
.btn:hover .arrow{ transform:translateX(4px); }
.btn--ghost{
  background:transparent; color:var(--text);
  border:2.5px solid var(--line-strong);
  box-shadow:5px 5px 0 rgba(0,0,0,.4);
}
.btn--ghost:hover{ background:transparent; color:var(--mustard); border-color:var(--mustard); }
.btn--lg{ padding:20px 38px; font-size:16px; }
.btn--dark{ background:var(--ink); color:var(--mustard-pale); border-color:#000; box-shadow:5px 5px 0 rgba(0,0,0,.55); }
.btn--dark:hover{ background:#000; }

/* ---------- scroll reveal ---------- */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.08s; }
.reveal.d2{ transition-delay:.16s; }
.reveal.d3{ transition-delay:.24s; }
.reveal.d4{ transition-delay:.32s; }
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  html{ scroll-behavior:auto; }
}

/* ============================================================
   HEADER / NAV
   ============================================================ */
.header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  transition:background .35s, border-color .35s, backdrop-filter .35s;
  border-bottom:2px solid transparent;
}
.header.scrolled{
  background:rgba(21,17,10,.9);
  backdrop-filter:blur(12px) saturate(140%);
  border-bottom:2px solid var(--iron);
}
.nav{ display:flex; align-items:center; justify-content:space-between; height:84px; }
.brand{ display:flex; align-items:center; gap:13px; }
.brand .mark-img{ height:54px; width:auto; flex:none; display:block; }
.brand .mark-cream{ display:none; }
.header.scrolled .brand .mark-dark{ display:none; }
.header.scrolled .brand .mark-cream{ display:block; }
.brand .word{
  font-family:'Anton'; text-transform:uppercase;
  font-size:23px; letter-spacing:0.10em; line-height:1; color:var(--ink);
}
.brand .word b{ color:#7a2e06; font-weight:400; }
.header.scrolled .brand .word{ color:var(--text); }
.header.scrolled .brand .word b{ color:var(--iron); }
.foot-word{ color:#fff !important; }
.foot-word b{ color:var(--iron) !important; }
.nav-links{ display:flex; align-items:center; gap:36px; }
.nav-links a{
  font-family:'Archivo'; font-weight:800; font-size:14px; color:rgba(24,18,6,.72);
  letter-spacing:0.06em; text-transform:uppercase; transition:color .2s; position:relative;
}
.header.scrolled .nav-links a{ color:var(--muted); }
.nav-links a::after{
  content:""; position:absolute; left:0; bottom:-7px; height:3px; width:0;
  background:var(--iron); transition:width .28s var(--ease);
}
.nav-links a:hover{ color:var(--text); }
.nav-links a:hover::after{ width:100%; }
.nav-cta{ display:flex; align-items:center; gap:18px; }
.burger{ display:none; background:none; border:none; color:var(--ink); cursor:pointer; }
.header.scrolled .burger{ color:var(--text); }
@media (max-width:980px){
  .nav-links{ display:none; }
  .nav-cta .btn{ display:none; }
  .burger{ display:block; }
}

/* ============================================================
   HERO
   ============================================================ */
.hero{ position:relative; min-height:100vh; display:flex; align-items:center; overflow:hidden;
  background:var(--cream);
}
/* halftone paper texture */
.hero::before{
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none; opacity:.5;
  background-image:radial-gradient(rgba(24,18,6,.10) 1px, transparent 1.5px);
  background-size:7px 7px;
}
/* founder cut-out, foreground right */
.hero-cut{
  position:absolute; right:-2%; bottom:0; z-index:3;
  height:118%; width:auto; max-width:62%; object-fit:contain; object-position:bottom right;
  filter:drop-shadow(14px 18px 20px rgba(24,18,6,.34));
  pointer-events:none;
}
.hero-inner{ max-width:620px; }
.hero .wrap{ position:relative; z-index:4; padding-top:90px; }
.hero-inner{ max-width:620px; }
.hero .eyebrow{ color:var(--ink); }
.hero .eyebrow::before{ border-left-color:var(--ink); }
.hero h1.display{
  font-size:clamp(38px, 5vw, 72px);
  line-height:1.0;
  margin:14px 0 0;
  color:var(--ink);
  text-shadow:3px 3px 0 rgba(212,155,43,.55);
}
.hero h1 .out{ color:#7a2e06; -webkit-text-stroke:0; }
.hero .btn--ghost{ color:var(--ink); border-color:rgba(24,18,6,.45); box-shadow:5px 5px 0 rgba(24,18,6,.5); }
.hero .btn--ghost:hover{ color:#7a2e06; border-color:var(--ink); background:rgba(24,18,6,.05); }
.hero-sub{ margin:42px 0 0; max-width:46ch; font-size:clamp(16px,1.4vw,19px); color:rgba(24,18,6,.82); font-weight:500; }
.hero-cta-row{ display:flex; flex-wrap:wrap; align-items:center; gap:16px; margin-top:40px; max-width:600px; }
.hero-proof{
  display:flex; align-items:center; gap:18px;
  margin-top:60px; padding-top:28px; border-top:2px solid rgba(24,18,6,.25);
  max-width:560px;
}
.avatars{ display:flex; align-items:center; }
.avatars > *{ margin-left:-12px; }
.avatars > *:first-child{ margin-left:0; }
.av-photo{
  width:46px; height:46px; border-radius:50%;
  border:3px solid var(--ink);
  background-size:cover; background-position:center top;
  background-color:var(--surface-2);
}
.av-plus{
  width:46px; height:46px; border-radius:50%;
  border:3px solid var(--mustard); background:var(--ink); color:var(--mustard-pale);
  display:grid; place-items:center; font-family:'Anton'; font-size:15px;
}
.hero-proof .pf-num{ display:block; font-family:'Anton'; color:#7a2e06; font-size:28px; letter-spacing:.02em; line-height:1; margin-bottom:4px; }
.hero-proof .pf-txt{ color:rgba(24,18,6,.78); font-size:14px; line-height:1.4; margin:0; }
.hero-proof .pf-txt b{ color:var(--ink); }
.scroll-hint{
  position:absolute; left:50%; bottom:24px; transform:translateX(-50%);
  z-index:3; color:rgba(24,18,6,.6); font-family:'Space Mono',monospace;
  font-size:11px; letter-spacing:.3em; text-transform:uppercase;
  display:flex; flex-direction:column; align-items:center; gap:10px;
}
.scroll-hint .line{ width:2px; height:46px; background:linear-gradient(var(--ink),transparent); animation:scrolly 2.2s var(--ease) infinite; }
@keyframes scrolly{ 0%{transform:scaleY(0);transform-origin:top;} 45%{transform:scaleY(1);transform-origin:top;} 55%{transform:scaleY(1);transform-origin:bottom;} 100%{transform:scaleY(0);transform-origin:bottom;} }
@media (max-width:760px){
  .hero-cut{ height:80%; right:-8%; max-width:70%; opacity:.85; }
}

/* ============================================================
   SECTION 2 — PROGRAMME POUR TOUS (duo)
   ============================================================ */
.duo-head{ text-align:center; max-width:820px; margin:0 auto clamp(48px,6vh,80px); }
.duo-head .lead{ margin:22px auto 0; }
.duo{ display:grid; grid-template-columns:1fr 1fr; gap:24px; perspective:1600px; }
.fig{
  position:relative; overflow:hidden;
  min-height:600px; cursor:pointer;
  background:var(--surface);
  border:2.5px solid var(--ink);
  box-shadow:7px 7px 0 var(--ink);
  transform-style:preserve-3d;
  transition:transform .5s var(--ease), box-shadow .5s var(--ease), border-color .4s;
  border-radius:3px;
}
.fig .photo{
  position:absolute; inset:0;
  background-size:cover; background-position:center 12%;
  filter:grayscale(1) contrast(1.08) brightness(.82);
  transition:transform .7s var(--ease), filter .6s var(--ease);
  z-index:1;
}
.fig .scrim{
  position:absolute; inset:0; z-index:2;
  background:linear-gradient(to top, rgba(9,7,4,.94) 4%, rgba(9,7,4,.32) 44%, rgba(9,7,4,.05) 72%);
  transition:opacity .5s;
}
.fig .glow{
  position:absolute; inset:0; z-index:0; opacity:0;
  transition:opacity .6s var(--ease);
  background:radial-gradient(60% 70% at 50% 45%, rgba(212,155,43,.6), transparent 68%);
  filter:blur(8px);
}
.fig .tag{
  position:absolute; top:22px; left:22px; z-index:4;
  font-family:'Space Mono',monospace; font-size:12px; letter-spacing:.22em;
  text-transform:uppercase; color:#1a0f03; font-weight:700;
  padding:7px 13px; background:var(--iron); border:2px solid var(--ink);
}
.fig .reveal-box{
  position:absolute; left:0; right:0; bottom:0; z-index:5;
  padding:36px 32px; transform:translateY(14px); opacity:0;
  transition:transform .5s var(--ease), opacity .5s var(--ease);
}
.fig .reveal-box .who{ font-family:'Anton'; text-transform:uppercase; font-size:40px; line-height:.92; margin:0 0 8px; text-shadow:2px 2px 0 rgba(0,0,0,.5); }
.fig .reveal-box .msg{ color:var(--text); font-weight:600; font-size:17px; margin:0 0 22px; max-width:26ch; }
.fig .resting{ position:absolute; left:0; right:0; bottom:0; z-index:5; padding:36px 32px; transition:opacity .4s; }
.fig .resting .who{ font-family:'Anton'; text-transform:uppercase; font-size:40px; line-height:.92; margin:0 0 6px; text-shadow:2px 2px 0 rgba(0,0,0,.5); }
.fig .resting .hint{ color:var(--muted); font-size:14px; display:flex; align-items:center; gap:8px; }
.fig:hover{ box-shadow:7px 7px 0 var(--iron-deep), 0 40px 80px -30px rgba(212,155,43,.5); border-color:var(--iron); z-index:6; }
.fig:hover .photo{ transform:scale(1.06); filter:grayscale(.15) contrast(1.06) brightness(.9); }
.fig:hover .glow{ opacity:1; }
.fig:hover .reveal-box{ opacity:1; transform:none; }
.fig:hover .resting{ opacity:0; }
.fig.left:hover{ transform:scale(1.03) rotateY(6deg) rotateZ(-1deg); }
.fig.right:hover{ transform:scale(1.03) rotateY(-6deg) rotateZ(1deg); }
.fig.right .reveal-box,.fig.right .resting,.fig.right .tag{ text-align:right; }
.fig.right .tag{ left:auto; right:22px; }
.fig.right .reveal-box .msg{ margin-left:auto; }
.fig.right .resting .hint{ justify-content:flex-end; }
.duo-foot{ margin-top:clamp(48px,6vh,76px); text-align:center; display:flex; flex-direction:column; align-items:center; gap:26px; }
.duo-foot h3{ font-family:'Anton'; font-weight:400; text-transform:uppercase; font-size:clamp(30px,4.4vw,56px); line-height:1; margin:0; max-width:18ch; text-shadow:3px 3px 0 rgba(0,0,0,.4); }
.duo-foot h3 em{ color:var(--iron); font-style:normal; }
@media (max-width:820px){
  .duo{ grid-template-columns:1fr; }
  .fig{ min-height:480px; }
  .fig.left:hover,.fig.right:hover{ transform:scale(1.01); }
}

/* ============================================================
   SECTION 3 — COMMENT ÇA MARCHE (zigzag) — LIGHT cream
   ============================================================ */
.howto{ background:var(--cream); color:var(--ink); }
.howto::before{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:radial-gradient(rgba(24,18,6,.10) 1px, transparent 1.5px);
  background-size:7px 7px;
}
.howto > .wrap{ position:relative; z-index:1; }
.howto .eyebrow{ color:var(--iron-deep); }
.howto .eyebrow::before{ border-left-color:var(--iron-deep); }
.howto .eyebrow.center::after{ border-right-color:var(--iron-deep); }
.howto h2.display{ color:var(--ink); text-shadow:3px 3px 0 rgba(212,155,43,.35); }
.howto-head{ text-align:center; max-width:760px; margin:0 auto; }
.howto-head .lead{ color:var(--ink-mut); margin:22px auto 0; }
.steps{ position:relative; margin-top:clamp(56px,7vh,96px); }
.steps .spine{ position:absolute; left:50%; top:0; bottom:0; width:3px; transform:translateX(-50%); background:repeating-linear-gradient(var(--iron-deep) 0 9px, transparent 9px 19px); opacity:.4; z-index:0; }
.steps .spine-fill{ position:absolute; left:50%; top:0; width:3px; transform:translateX(-50%); background:var(--iron); z-index:1; height:0; transition:height .2s linear; box-shadow:0 0 14px rgba(212,155,43,.7); }
.step{ position:relative; z-index:2; display:grid; grid-template-columns:1fr 88px 1fr; align-items:center; margin-bottom:clamp(44px,6vh,86px); }
.step:last-child{ margin-bottom:0; }
.step .node{
  grid-column:2; justify-self:center;
  width:64px; height:64px; border-radius:50%;
  display:grid; place-items:center;
  font-family:'Anton'; font-size:26px; color:var(--cream);
  background:var(--ink); border:3px solid var(--cream);
  box-shadow:0 0 0 3px var(--ink); position:relative; z-index:3;
  transition:transform .4s var(--ease), background .4s;
}
.step.in .node{ background:var(--iron); box-shadow:0 0 0 3px var(--ink), 0 0 22px rgba(212,155,43,.6); }
.step .txt{ padding:0 clamp(20px,3vw,52px); }
.step .txt h3{ font-family:'Anton'; font-weight:400; text-transform:uppercase; font-size:clamp(26px,3vw,42px); line-height:1; margin:0 0 14px; color:var(--ink); }
.step .txt .num{ font-family:'Space Mono',monospace; font-size:13px; letter-spacing:.26em; color:var(--iron-deep); display:block; margin-bottom:14px; font-weight:700; }
.step .txt p{ color:var(--ink-mut); margin:0; max-width:42ch; }
.step .visual{ padding:0 clamp(20px,3vw,52px); }
.step.rev .txt{ grid-column:3; text-align:left; }
.step.rev .visual{ grid-column:1; }
.step:not(.rev) .txt{ grid-column:1; text-align:right; }
.step:not(.rev) .visual{ grid-column:3; }
.step:not(.rev) .txt p{ margin-left:auto; }
.vcard{ background:#fff; padding:24px; border:2.5px solid var(--ink); box-shadow:7px 7px 0 var(--ink); transition:transform .25s var(--ease), box-shadow .25s var(--ease); border-radius:3px; }
.vcard:hover{ transform:translate(3px,3px); box-shadow:4px 4px 0 var(--iron-deep); }

/* step1 mini offers */
.mini-offers{ display:flex; flex-direction:column; gap:10px; }
.mini-offer{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px 16px; cursor:pointer; border:2px solid rgba(24,18,6,.18); background:#fff; transition:border-color .15s, background .15s, transform .12s, box-shadow .15s; border-radius:2px; }
.mini-offer:hover{ transform:translateX(4px); }
.mini-offer .mo-name{ font-family:'Anton'; text-transform:uppercase; letter-spacing:.03em; color:var(--ink); font-size:18px; }
.mini-offer .mo-price{ font-family:'Anton'; color:var(--iron-deep); font-size:21px; }
.mini-offer.sel{ border-color:var(--iron); background:var(--iron-soft); box-shadow:4px 4px 0 var(--iron-deep); }
.mini-offer.sel .check{ opacity:1; transform:scale(1); }
.mini-offer .check{ color:var(--iron-deep); opacity:0; transform:scale(.4); transition:.15s var(--ease); }

/* step2 form mock */
.formmock{ display:flex; flex-direction:column; gap:12px; }
.fm-row{ height:48px; background:#f3ecdb; border:2px solid rgba(24,18,6,.12); display:flex; align-items:center; padding:0 14px; color:var(--ink-mut); font-size:14px; border-radius:2px; }
.fm-row .label{ font-family:'Space Mono',monospace; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-mut); font-weight:700; }
.fm-row .val{ margin-left:auto; color:var(--ink); font-weight:700; }
.fm-row .caret{ width:2px; height:20px; background:var(--iron); margin-left:2px; animation:blink 1s step-end infinite; }
@keyframes blink{ 50%{opacity:0;} }
.fm-bar{ height:10px; background:#e3d6ba; overflow:hidden; border:2px solid rgba(24,18,6,.12); border-radius:2px; }
.fm-bar i{ display:block; height:100%; width:0; background:var(--iron); }

/* step3 ebooks — real cover mockups */
.ebooks{ display:grid; grid-template-columns:repeat(4,1fr); gap:8px 6px; }
.ebook{ position:relative; cursor:pointer; background:none; border:none; padding:6px 2px; transition:transform .3s var(--ease); display:flex; align-items:flex-end; justify-content:center; }
.ebook img{ width:100%; height:auto; filter:drop-shadow(3px 4px 5px rgba(24,18,6,.35)); transition:filter .3s; }
.ebook .free{ position:absolute; top:2px; right:2px; z-index:3; font-family:'Space Mono',monospace; font-size:8px; letter-spacing:.02em; background:var(--iron); color:#1a0f03; padding:3px 5px; font-weight:700; border:1.5px solid var(--ink); }
.ebook .tick{ position:absolute; inset:6px 2px; z-index:4; display:grid; place-items:center; background:rgba(212,155,43,.45); opacity:0; transform:scale(.6); transition:.3s var(--ease); border:3px solid var(--iron); box-shadow:inset 0 0 0 2px var(--ink); }
.ebook .tick svg{ width:34px; height:34px; color:#1a0f03; background:var(--iron); border:2px solid var(--ink); padding:5px; border-radius:50%; }
.ebook.picked img{ filter:drop-shadow(0 0 0 var(--iron)) drop-shadow(3px 4px 5px rgba(24,18,6,.35)); }
.ebook.picked .tick{ opacity:1; transform:scale(1); }
.ebook:hover{ transform:translateY(-5px) scale(1.03); }
.ebooks-hint{ margin-top:14px; font-size:13px; color:var(--ink-mut); font-family:'Space Mono',monospace; letter-spacing:.04em; }
.ebooks-hint b{ color:var(--iron-deep); }

/* step4 dashboard */
.dashcard{ background:linear-gradient(160deg,#1a140b,#2a2012); color:var(--cream); border:2.5px solid var(--iron); box-shadow:7px 7px 0 var(--iron-deep); }
.dashcard:hover{ box-shadow:4px 4px 0 var(--iron-deep); }
.dash-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.dash-badge{ font-family:'Space Mono',monospace; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:#1a0f03; background:var(--iron); padding:5px 11px; font-weight:700; border:2px solid var(--ink); }
.dash-deliver{ font-family:'Anton'; font-size:clamp(22px,2.6vw,34px); text-transform:uppercase; line-height:1; margin:0 0 8px; }
.dash-deliver em{ color:var(--iron-bright); font-style:normal; }
.dash-sub{ color:#bdb09b; font-size:14.5px; margin:0 0 20px; }
.dash-files{ display:flex; flex-direction:column; gap:9px; }
.dash-file{ display:flex; align-items:center; gap:12px; padding:11px 13px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:2px; }
.dash-file .ico{ width:30px; height:30px; background:var(--iron-soft); display:grid; place-items:center; color:var(--iron-bright); flex:none; }
.dash-file .fn{ font-weight:700; font-size:14px; }
.dash-file .fmeta{ margin-left:auto; font-family:'Space Mono',monospace; font-size:11px; color:#8a8170; }
.howto-foot{ text-align:center; margin-top:clamp(56px,7vh,90px); }
@media (max-width:820px){
  .steps .spine,.steps .spine-fill{ left:31px; }
  .step{ grid-template-columns:64px 1fr; gap:20px; }
  .step .node{ grid-column:1; }
  .step .txt,.step.rev .txt,.step:not(.rev) .txt{ grid-column:2; text-align:left; padding:0; }
  .step .visual,.step.rev .visual,.step:not(.rev) .visual{ grid-column:2; padding:18px 0 0; }
  .step:not(.rev) .txt p{ margin-left:0; }
}

/* ============================================================
   SECTION 4 — OFFRES (pricing)
   ============================================================ */
.pricing-head{ text-align:center; max-width:820px; margin:0 auto clamp(50px,6vh,84px); }
.pricing-head .lead{ margin:22px auto 0; }
.tiers{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:stretch; perspective:1800px; }
.tier{
  position:relative; padding:38px 32px 34px;
  background:var(--surface); border:2.5px solid var(--ink);
  box-shadow:7px 7px 0 var(--ink);
  display:flex; flex-direction:column;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .4s;
  border-radius:3px; backface-visibility:hidden;
}
.tier:hover{ border-color:var(--iron); }
.tier.tl:hover{ transform:translateY(-6px) rotate(-1deg) scale(1.02); box-shadow:7px 7px 0 var(--iron-deep), 0 40px 80px -34px rgba(212,155,43,.5); z-index:4; }
.tier.tr:hover{ transform:translateY(-6px) rotate(1deg) scale(1.02); box-shadow:7px 7px 0 var(--iron-deep), 0 40px 80px -34px rgba(212,155,43,.5); z-index:4; }
.tier .t-name{ font-family:'Anton'; text-transform:uppercase; font-size:30px; letter-spacing:.02em; margin:0; }
.tier .t-tagline{ color:var(--muted); font-size:14px; margin:6px 0 26px; }
.tier .t-price{ display:flex; align-items:flex-start; gap:4px; margin-bottom:6px; }
.tier .t-price .cur{ font-family:'Anton'; font-size:24px; margin-top:10px; color:var(--muted); }
.tier .t-price .amt{ font-family:'Anton'; font-size:72px; line-height:.85; text-shadow:3px 3px 0 rgba(0,0,0,.4); }
.tier .t-once{ font-family:'Space Mono',monospace; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted-2); margin-bottom:28px; font-weight:700; }
.tier ul{ list-style:none; margin:0 0 30px; padding:0; display:flex; flex-direction:column; gap:14px; flex:1; }
.tier li{ display:flex; gap:12px; align-items:flex-start; font-size:15px; color:#ddd0b9; line-height:1.45; }
.tier li .ck{ flex:none; width:22px; height:22px; border-radius:50%; background:var(--iron-soft); display:grid; place-items:center; color:var(--iron); margin-top:1px; }
.tier li.inc{ color:var(--text); font-weight:800; }
.tier li.inc .ck{ background:var(--iron); color:#1a0f03; }
.tier .t-cta{ width:100%; justify-content:center; }
.tier--featured{
  background:linear-gradient(180deg, rgba(212,155,43,.12), var(--surface) 42%);
  border-color:var(--iron);
  box-shadow:7px 7px 0 var(--iron-deep), 0 0 0 1px rgba(212,155,43,.4);
}
.tier--featured .badge{
  position:absolute; top:-16px; left:50%; transform:translateX(-50%);
  font-family:'Anton'; font-size:14px; letter-spacing:.06em; text-transform:uppercase;
  background:var(--iron); color:#1a0f03; padding:8px 18px; border:2.5px solid var(--ink);
  box-shadow:3px 3px 0 var(--ink); white-space:nowrap;
}
.tier--featured:hover{ box-shadow:7px 7px 0 var(--iron-deep), 0 0 44px -2px rgba(212,155,43,.7), 0 50px 100px -30px rgba(212,155,43,.85); }
.tier--featured:hover .badge{ box-shadow:3px 3px 0 var(--ink), 0 0 24px -2px rgba(232,181,74,.95); }
.tier .t-cond{ font-size:11px; color:var(--muted-2); margin-top:16px; text-align:center; }
.pricing-foot{ text-align:center; margin-top:clamp(50px,6vh,80px); }
.pricing-foot h3{ font-family:'Anton'; font-weight:400; text-transform:uppercase; font-size:clamp(26px,3.6vw,48px); line-height:1.04; margin:0 auto; max-width:24ch; text-shadow:3px 3px 0 rgba(0,0,0,.4); }
.pricing-foot h3 em{ color:var(--iron); font-style:normal; }
@media (max-width:900px){
  .tiers{ grid-template-columns:1fr; max-width:460px; margin-inline:auto; }
  .tier.tl:hover,.tier.tr:hover{ transform:translateY(-4px) scale(1.005); }
  .tier--featured{ order:-1; }
}

/* ============================================================
   SECTION 5 — QUI SUIS-JE
   ============================================================ */
.about{ overflow:hidden; }
.about-grid{ display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(30px,5vw,76px); align-items:center; }
.about-photo{ position:relative; overflow:hidden; min-height:580px; background:#0e0c0a; border:2.5px solid var(--ink); box-shadow:9px 9px 0 var(--iron-deep); border-radius:3px; }
.about-photo .ph{ position:absolute; inset:0; background-size:cover; background-position:center 20%; filter:contrast(1.06) saturate(1.04); }
.about-photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(9,7,4,.6), transparent 45%); }
.about-photo .frame-tag{ position:absolute; left:20px; bottom:18px; z-index:2; font-family:'Space Mono',monospace; font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--cream); font-weight:700; }
.about-photo .frame-tag b{ color:var(--iron-bright); }
.about-quote{ font-family:'Anton'; font-weight:400; text-transform:uppercase; font-size:clamp(24px,2.6vw,38px); line-height:1.04; margin:0 0 24px; text-shadow:2px 2px 0 rgba(0,0,0,.4); }
.about-quote em{ color:var(--iron); font-style:normal; }
.about-bio{ color:var(--muted); max-width:52ch; }
.about-stats{ display:flex; gap:36px; margin-top:34px; flex-wrap:wrap; }
.about-stats .st .n{ font-family:'Anton'; font-size:42px; color:var(--iron); line-height:1; text-shadow:2px 2px 0 rgba(0,0,0,.4); }
.about-stats .st .l{ font-size:13px; color:var(--muted); letter-spacing:.02em; }
@media (max-width:820px){
  .about-grid{ grid-template-columns:1fr; }
  .about-photo{ min-height:460px; }
}

/* ============================================================
   SECTION 6 — FAQ
   ============================================================ */
.faq-grid{ display:grid; grid-template-columns:0.85fr 1.15fr; gap:clamp(30px,5vw,72px); align-items:start; }
.faq-aside h2.display{ font-size:clamp(38px,5vw,72px); }
.faq-aside .lead{ margin-top:22px; }
.faq-aside .btn{ margin-top:30px; }
.faq-list{ border-top:2px solid var(--line); }
.faq-item{ border-bottom:2px solid var(--line); }
.faq-q{ width:100%; text-align:left; background:none; border:none; cursor:pointer; display:flex; align-items:center; gap:22px; padding:26px 4px; color:var(--text); font-family:'Archivo'; font-weight:800; font-size:clamp(17px,1.7vw,21px); transition:color .2s; }
.faq-q:hover{ color:var(--iron-bright); }
.faq-q .qn{ font-family:'Anton'; font-size:18px; color:var(--iron); flex:none; }
.faq-q .ic{ margin-left:auto; flex:none; width:26px; height:26px; position:relative; transition:transform .35s var(--ease); }
.faq-q .ic::before,.faq-q .ic::after{ content:""; position:absolute; background:var(--iron); }
.faq-q .ic::before{ left:50%; top:3px; bottom:3px; width:3px; transform:translateX(-50%); transition:transform .35s var(--ease); }
.faq-q .ic::after{ top:50%; left:3px; right:3px; height:3px; transform:translateY(-50%); }
.faq-item.open .faq-q .ic::before{ transform:translateX(-50%) scaleY(0); }
.faq-a{ overflow:hidden; height:0; transition:height .4s var(--ease); }
.faq-a .inner{ padding:0 4px 28px 52px; color:var(--muted); max-width:62ch; }
@media (max-width:820px){ .faq-grid{ grid-template-columns:1fr; } .faq-a .inner{ padding-left:40px; } }

/* ============================================================
   SECTION 7 — FINAL CTA
   ============================================================ */
.finalcta{ background:var(--iron); color:#1a0f03; text-align:center; overflow:hidden; position:relative; border-top:3px solid var(--ink); border-bottom:3px solid var(--ink); }
.finalcta::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.5;
  background:repeating-conic-gradient(from 0deg at 50% 50%, rgba(26,15,3,.08) 0deg 5deg, transparent 5deg 11deg);
}
.finalcta::after{
  content:"IRON"; position:absolute; inset:0; z-index:0;
  font-family:'Anton'; font-size:32vw; color:rgba(26,15,3,.10);
  display:grid; place-items:center; pointer-events:none; letter-spacing:.02em;
}
.finalcta .wrap{ position:relative; z-index:1; }
.finalcta .eyebrow{ color:#1a0f03; }
.finalcta .eyebrow::before{ border-left-color:#1a0f03; }
.finalcta .eyebrow.center::after{ border-right-color:#1a0f03; }
.finalcta h2.display{ color:#1a0f03; font-size:clamp(40px,5.6vw,82px); line-height:0.96; text-shadow:4px 4px 0 rgba(255,255,255,.22); }
.finalcta p{ color:rgba(26,15,3,.82); font-size:clamp(17px,1.6vw,21px); max-width:48ch; margin:32px auto 38px; font-weight:700; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer{ background:#0d0a06; padding:clamp(64px,9vh,100px) 0 40px; }
.foot-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.1fr; gap:40px; }
.foot-brand .brand{ margin-bottom:18px; }
.foot-brand p{ color:var(--muted); font-size:14.5px; max-width:32ch; }
.foot-col h4{ font-family:'Space Mono',monospace; font-size:12px; letter-spacing:.22em; text-transform:uppercase; color:var(--iron); margin:0 0 20px; font-weight:700; }
.foot-col a{ display:block; color:var(--muted); font-size:15px; margin-bottom:13px; transition:color .2s, transform .2s; width:fit-content; }
.foot-col a:hover{ color:var(--iron-bright); transform:translateX(3px); }
.socials{ display:flex; gap:12px; }
.socials a{ width:46px; height:46px; display:grid; place-items:center; margin:0; border:2px solid var(--line-strong); color:var(--muted); transition:.2s var(--ease); border-radius:2px; }
.socials a:hover{ color:#1a0f03; background:var(--iron); border-color:var(--ink); transform:translateY(-3px); }
.socials a svg{ width:20px; height:20px; }
.foot-bottom{ margin-top:clamp(48px,7vh,80px); padding-top:28px; border-top:2px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.foot-bottom .rights{ display:flex; align-items:center; gap:12px; color:var(--muted-2); font-size:13px; }
.foot-bottom .rights .mk{ height:34px; display:grid; place-items:center; }
.foot-bottom .rights .mk img{ height:34px; width:auto; display:block; }
.foot-bottom .legal{ display:flex; gap:24px; }
.foot-bottom .legal a{ color:var(--muted-2); font-size:13px; }
.foot-bottom .legal a:hover{ color:var(--muted); }
@media (max-width:900px){ .foot-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .foot-grid{ grid-template-columns:1fr; } .wrap{ padding:0 22px; } }

/* ---------- mobile menu ---------- */
#mobileMenu{ position:fixed; top:84px; left:0; right:0; z-index:99; background:rgba(21,17,10,.98); backdrop-filter:blur(14px); border-bottom:2px solid var(--iron); display:flex; flex-direction:column; padding:14px 22px 22px; transform:translateY(-12px); opacity:0; pointer-events:none; transition:transform .3s var(--ease), opacity .3s var(--ease); }
#mobileMenu.show{ transform:none; opacity:1; pointer-events:auto; }
#mobileMenu a{ padding:16px 4px; font-family:'Anton'; font-size:20px; text-transform:uppercase; letter-spacing:.04em; color:var(--text); border-bottom:1px solid var(--line); }
#mobileMenu a:last-child{ border:none; }
#mobileMenu .m-cta{ margin-top:14px; background:var(--iron); color:#1a0f03; text-align:center; padding:16px; border:2.5px solid var(--ink); }
body.menu-open{ overflow:hidden; }

/* ============================================================
   MOBILE
   ============================================================ */
@media (max-width:600px){
  html, body{ overflow-x:hidden; }
  body{ font-size:16px; }
  .wrap{ padding:0 20px; }
  .section-pad{ padding:64px 0; }
  .nav{ height:66px; }
  .brand .mark-img{ height:42px; }
  .brand .word{ font-size:18px; letter-spacing:.08em; }
  #mobileMenu{ top:66px; }
  .hero{ min-height:auto; padding:120px 0 90px; align-items:center; }
  .hero .wrap{ padding-top:0; }
  .hero-inner{ max-width:100%; }
  .eyebrow{ font-size:11px; letter-spacing:.2em; margin-bottom:16px; flex-wrap:wrap; }
  .hero h1.display{ font-size:clamp(44px,14vw,62px); }
  .hero-sub{ margin-top:22px; font-size:16px; max-width:100%; }
  .hero-cta-row{ gap:12px; margin-top:30px; }
  .hero-cta-row .btn{ width:100%; justify-content:center; }
  .hero-proof{ margin-top:42px; padding-top:24px; gap:14px; }
  .av-photo,.av-plus{ width:40px; height:40px; }
  .hero-proof .pf-num{ font-size:24px; }
  .hero-proof .pf-txt{ font-size:13px; }
  .scroll-hint{ display:none; }
  h2.display{ font-size:clamp(36px,9vw,48px); }
  .lead{ font-size:16px; }
  .duo{ gap:16px; }
  .fig{ min-height:430px; }
  .fig .reveal-box,.fig .resting{ padding:26px 22px; }
  .fig .reveal-box .who,.fig .resting .who{ font-size:34px; }
  .fig .resting{ opacity:0; }
  .fig .reveal-box{ opacity:1; transform:none; }
  .fig .glow{ opacity:.5; }
  .duo-foot{ gap:22px; margin-top:48px; }
  .duo-foot .btn{ width:100%; justify-content:center; }
  .steps{ margin-top:44px; }
  .step{ margin-bottom:40px; gap:16px; grid-template-columns:52px 1fr; align-items:start; }
  .steps .spine,.steps .spine-fill{ left:26px; }
  .step .node{ width:52px; height:52px; font-size:21px; margin-top:16px; }
  .step .txt h3{ font-size:26px; }
  .vcard{ padding:18px; }
  .ebooks{ gap:7px 5px; }
  .ebook .free{ font-size:7px; padding:2px 4px; }
  .howto-foot .btn{ width:100%; justify-content:center; }
  .tiers{ gap:18px; }
  .tier{ padding:32px 24px 30px; }
  .tier .t-price .amt{ font-size:60px; }
  .pricing-foot h3{ font-size:clamp(24px,6.5vw,34px); }
  .about-grid{ gap:28px; }
  .about-photo{ min-height:400px; }
  .about-quote{ font-size:24px; }
  .about-bio{ max-width:100%; }
  .about-stats{ gap:24px; }
  .about-stats .st .n{ font-size:34px; }
  .faq-q{ gap:14px; padding:20px 2px; font-size:17px; }
  .finalcta::after{ font-size:50vw; }
  .finalcta h2.display{ font-size:clamp(38px,11vw,60px); }
  .finalcta .btn{ width:100%; justify-content:center; }
  .foot-grid{ grid-template-columns:1fr 1fr; gap:30px 20px; }
  .foot-brand{ grid-column:1 / -1; }
  .foot-bottom{ flex-direction:column; align-items:flex-start; gap:16px; }
  .foot-bottom .legal{ gap:16px; flex-wrap:wrap; }
}
@media (max-width:380px){
  .hero h1.display{ font-size:42px; }
  .about-stats{ gap:18px; }
}

/* ============================================================
   OFFER FORM MODAL (Fillout)
   ============================================================ */
body.modal-open{ overflow:hidden; }
.form-modal{ position:fixed; inset:0; z-index:1000; display:none; }
.form-modal.show{ display:block; }
.form-modal__backdrop{
  position:absolute; inset:0; background:rgba(13,10,6,.78);
  backdrop-filter:blur(6px); animation:fmFade .25s var(--ease);
}
.form-modal__panel{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:min(720px, calc(100vw - 32px)); max-height:calc(100vh - 48px);
  display:flex; flex-direction:column;
  background:var(--cream); color:var(--ink);
  border:3px solid var(--ink); border-radius:4px;
  box-shadow:14px 14px 0 var(--iron-deep);
  animation:fmPop .32s var(--ease);
}
@keyframes fmFade{ from{opacity:0;} to{opacity:1;} }
@keyframes fmPop{ from{opacity:0; transform:translate(-50%,-46%) scale(.96);} to{opacity:1; transform:translate(-50%,-50%) scale(1);} }
.form-modal__head{
  display:flex; align-items:center; gap:14px;
  padding:16px 20px; border-bottom:2px solid rgba(24,18,6,.16);
  background:var(--mustard);
}
.form-modal__heading{ display:flex; flex-direction:column; gap:5px; }
.form-modal__kicker{ font-family:'Space Mono',monospace; font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:#1a0f03; font-weight:700; }
.form-modal__title{ font-family:'Anton'; font-weight:400; text-transform:uppercase; font-size:26px; letter-spacing:.02em; margin:0; color:var(--ink); line-height:1; }
.form-modal__close{
  margin-left:auto; flex:none; width:40px; height:40px; display:grid; place-items:center;
  background:var(--ink); color:var(--mustard-pale); border:2px solid var(--ink); cursor:pointer;
  border-radius:2px; transition:transform .15s var(--ease), background .2s;
}
.form-modal__close:hover{ background:#000; transform:rotate(90deg); }
.form-modal__body{ padding:14px 16px 18px; overflow-y:auto; -webkit-overflow-scrolling:touch; }
.form-modal__loading{ padding:60px 0; text-align:center; font-family:'Space Mono',monospace; font-size:13px; letter-spacing:.08em; color:var(--ink-mut); }
@media (max-width:600px){
  .form-modal__panel{ width:calc(100vw - 20px); max-height:calc(100vh - 24px); box-shadow:8px 8px 0 var(--iron-deep); }
  .form-modal__title{ font-size:20px; }
}