/* Elevate HR — refonte 2026. Vanilla CSS, no framework, no external font. */

:root{
  --bg: #FBFAF7;
  --bg-deep: #F2EFE7;
  --surface: #FFFFFF;
  --line: rgba(27,42,77,0.12);
  --accent: #C9A265;
  --accent-text: #87642E;
  --accent-text-lg: #AB7F3C;
  --ink: #1B2A4D;
  --ink-deep: #0F1B33;
  --muted: #5B6479;
  --error: #A6342C;
  --radius: 4px;
  --ease: cubic-bezier(.16,1,.3,1);
  --dur: 0.25s;
  --sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", "Cascadia Code", "Roboto Mono", Consolas, monospace;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg: #10182B; --bg-deep: #0B1220; --surface: #16213A; --line: rgba(230,232,240,0.12);
    --accent-text: var(--accent); --accent-text-lg: var(--accent);
    --ink: #EDEFF4; --ink-deep: #FFFFFF; --muted: #9AA3BC;
  }
}
:root[data-theme="dark"]{
  --bg: #10182B; --bg-deep: #0B1220; --surface: #16213A; --line: rgba(230,232,240,0.12);
  --accent-text: var(--accent); --accent-text-lg: var(--accent);
  --ink: #EDEFF4; --ink-deep: #FFFFFF; --muted: #9AA3BC;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--bg); color:var(--ink); font-family:var(--sans); line-height:1.5; -webkit-font-smoothing:antialiased;}
.wrap{max-width:1120px; margin:0 auto; padding:0 24px;}
a{color:inherit;}
img{max-width:100%; display:block;}
button{font-family:inherit;}
.mono{font-family:var(--mono);}
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}
h1,h2,h3{font-family:var(--sans); font-weight:800; letter-spacing:-0.02em; color:var(--ink); text-wrap:balance;}

/* i18n: FR and EN both live in the DOM as real text nodes at all times;
   only the one matching html[lang] is visible. This is what makes a
   plain `curl` (or a non-JS crawler) see the full bilingual content. */
[data-i18n]{display:none;}
html[lang="fr"] [data-i18n="fr"]{display:revert;}
html[lang="en"] [data-i18n="en"]{display:revert;}
html[lang="fr"] span[data-i18n="fr"], html[lang="fr"] a[data-i18n="fr"]{display:inline;}
html[lang="en"] span[data-i18n="en"], html[lang="en"] a[data-i18n="en"]{display:inline;}
html[lang="fr"] li[data-i18n="fr"]{display:list-item;}
html[lang="en"] li[data-i18n="en"]{display:list-item;}

/* ===== Nav ===== */
nav{position:sticky; top:0; z-index:80; background:color-mix(in srgb, var(--bg) 90%, transparent); backdrop-filter:blur(10px); border-bottom:1px solid var(--line);}
nav .wrap{display:flex; align-items:center; justify-content:space-between; height:64px; gap:20px;}
.logo{font-weight:800; font-size:19px; text-decoration:none; flex-shrink:0; letter-spacing:-0.01em;}
.logo span{color:var(--accent-text-lg);}
.nav-anchors{display:flex; gap:24px; list-style:none;}
.nav-anchors a{font-size:14px; color:var(--muted); text-decoration:none; transition:color var(--dur) var(--ease);}
.nav-anchors a:hover{color:var(--ink);}
.nav-right{display:flex; align-items:center; gap:12px;}
.nav-cta{background:var(--accent); color:var(--ink) !important; padding:10px 18px; border-radius:var(--radius); font-weight:700; font-size:13.5px; text-decoration:none; white-space:nowrap; min-height:40px; display:inline-flex; align-items:center;}
.lang-toggle{display:flex; gap:2px; border:1px solid var(--line); border-radius:var(--radius); padding:2px;}
.lang-btn{background:none; border:none; font-family:var(--mono); font-size:11px; font-weight:700; padding:6px 9px; border-radius:2px; cursor:pointer; color:var(--muted);}
.lang-btn.active{background:var(--accent); color:var(--ink);}
@media(max-width:760px){ .nav-anchors{display:none;} }

/* ===== Hero ===== */
.hero{padding:56px 0 56px; text-align:center;}
.hero-eyebrow{font-family:var(--mono); font-size:12px; letter-spacing:0.03em; color:var(--muted); margin-bottom:22px;}
.hero-h1{font-size:clamp(30px,6vw,72px); line-height:1.05; margin-bottom:28px;}
.hero-h1 .role-slot{color:var(--accent-text-lg); display:inline-block; min-width:1ch;}
.selector-wrap{max-width:640px; margin:0 auto;}
.selector-input-shell{position:relative; border:2px solid var(--line); border-radius:8px; background:var(--surface); transition:border-color var(--dur) var(--ease);}
.selector-input-shell:focus-within{border-color:var(--accent);}
#role-input{width:100%; border:none; background:transparent; font-family:var(--sans); font-size:20px; font-weight:600; color:var(--ink); padding:18px 20px;}
#role-input:focus{outline:none;}
#role-input::placeholder{color:var(--muted); font-weight:500;}
.suggest-list{position:absolute; left:0; right:0; top:calc(100% + 6px); background:var(--surface); border:1px solid var(--line); border-radius:8px; box-shadow:0 16px 40px -12px rgba(15,20,35,0.25); max-height:320px; overflow-y:auto; z-index:40; text-align:left;}
.suggest-list[hidden]{display:none;}
.suggest-item{display:flex; justify-content:space-between; align-items:center; padding:12px 18px; cursor:pointer; font-size:15px; border-bottom:1px solid var(--line);}
.suggest-item:last-child{border-bottom:none;}
.suggest-item:hover, .suggest-item.active-option{background:var(--bg-deep);}
.suggest-item .fam{font-family:var(--mono); font-size:10.5px; color:var(--muted); text-transform:uppercase;}
.chips{display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:16px;}
.chip{font-family:var(--mono); font-size:12px; background:var(--bg-deep); border:1px solid var(--line); border-radius:999px; padding:7px 14px; color:var(--muted); cursor:pointer; transition:border-color var(--dur) var(--ease), color var(--dur) var(--ease);}
.chip:hover{border-color:var(--accent); color:var(--accent-text-lg);}
.chip-other{border-style:dashed;}

.hero-result{max-width:720px; margin:32px auto 0; text-align:center;}
.hero-result[hidden]{display:none;}
.hero-counter{background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:36px 32px;}
.counter-num{font-family:var(--mono); font-weight:800; font-size:clamp(42px,7vw,64px); color:var(--accent-text-lg); line-height:1; display:block;}
.counter-label{font-size:16px; color:var(--muted); margin-top:8px;}
.counter-sub{font-size:13px; color:var(--muted); margin-top:4px;}
.hero-fallback{font-size:13.5px; color:var(--muted); margin-top:18px; line-height:1.6; max-width:520px; margin-left:auto; margin-right:auto;}
.hero-proof{margin-top:22px; text-align:left; background:var(--bg-deep); border-radius:8px; padding:20px 22px;}
.hero-proof-label{font-size:13px; font-weight:700; margin-bottom:12px;}
.hero-proof-cards{display:flex; flex-wrap:wrap; gap:10px;}
.hero-proof-card{background:var(--surface); border:1px solid var(--line); border-radius:6px; padding:10px 14px; font-size:13px;}
.hero-proof-card b{display:block; font-size:14px;}
.hero-proof-pentalog{border:1px dashed var(--line); background:transparent;}
.hero-proof-pentalog-text{font-size:13px; color:var(--muted); line-height:1.6;}
.hero-cta{margin-top:24px;}
.hero-empty{max-width:520px; margin:10px auto 0; text-align:center;}
.hero-empty[hidden]{display:none;}
.hero-empty p{font-size:14.5px; color:var(--muted); line-height:1.6; margin-bottom:18px;}

.roles-index{max-width:640px; margin:20px auto 0; text-align:left;}
.roles-index summary{cursor:pointer; text-align:center; font-size:13px; color:var(--accent-text); font-weight:700; list-style:none;}
.roles-index summary::-webkit-details-marker{display:none;}
.roles-index-body{margin-top:16px; background:var(--bg-deep); border-radius:8px; padding:20px 22px; grid-template-columns:1fr 1fr; gap:20px;}
/* higher specificity than [data-i18n]{display:none}/.roles-index-body on their own,
   so the active language's grid layout reliably wins regardless of source order */
html[lang="fr"] .roles-index-body[data-i18n="fr"], html[lang="en"] .roles-index-body[data-i18n="en"]{display:grid;}
@media(max-width:640px){ .roles-index-body{grid-template-columns:1fr;} }
.roles-index-group-label{font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:0.05em; color:var(--muted); margin-bottom:8px;}
.roles-index-row{display:flex; justify-content:space-between; gap:10px; font-size:12.5px; padding:4px 0; border-bottom:1px solid var(--line);}
.roles-index-row span:last-child{font-family:var(--mono); color:var(--muted); white-space:nowrap;}

/* ===== Buttons ===== */
.btn-primary{display:inline-flex; align-items:center; gap:8px; background:var(--accent); color:var(--ink); padding:15px 28px; border-radius:var(--radius); font-weight:700; font-size:15px; text-decoration:none; border:none; cursor:pointer; box-shadow:0 4px 14px -6px rgba(201,162,101,0.5); transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);}
.btn-primary:hover{transform:translateY(-1px); box-shadow:0 8px 20px -8px rgba(201,162,101,0.75);}
.btn-primary:disabled{opacity:0.6; cursor:not-allowed;}
.btn-ghost{color:var(--ink); text-decoration:none; font-size:14.5px; font-weight:600; border-bottom:1px solid var(--line); padding-bottom:2px; background:none; border-top:none; border-left:none; border-right:none; cursor:pointer; font-family:inherit;}
.btn-ghost:hover{border-color:var(--accent); color:var(--accent-text);}

/* ===== Sections ===== */
section{padding:72px 0; border-top:1px solid var(--line);}
.section-alt{background:var(--bg-deep);}
.section-head{max-width:640px; margin:0 auto 40px; text-align:center;}
.kicker{font-family:var(--mono); font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--accent-text); margin-bottom:12px;}
/* .kicker is a <span>, whose UA default is inline: neither the base
   [data-i18n]{display:none} hide rule nor the generic span->inline
   override give it the block layout it needs, so — same fix as
   .roles-index-body above — give the active language its own
   high-specificity rule that wins over both. */
html[lang="fr"] .kicker[data-i18n="fr"], html[lang="en"] .kicker[data-i18n="en"]{display:block;}
.section-head h2{font-size:clamp(26px,4vw,40px); margin-bottom:12px;}
.section-head p{color:var(--muted); font-size:16px;}

/* ===== Stats (section 2) ===== */
.stats-row{display:grid; grid-template-columns:repeat(3,1fr); gap:28px; max-width:820px; margin:0 auto; text-align:center;}
.stat-num{font-family:var(--mono); font-weight:800; font-size:clamp(38px,6vw,58px); color:var(--ink);}
.stat-label{font-size:14px; color:var(--muted); margin-top:6px;}
.stats-sub{text-align:center; margin-top:32px; font-size:15px; color:var(--muted);}
@media(max-width:640px){ .stats-row{grid-template-columns:1fr; gap:32px;} }

/* ===== Network breakdown (section 2 bis) ===== */
.network-grid{list-style:none; max-width:820px; margin:40px auto 0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.network-grid li{display:flex; flex-direction:column; align-items:center; gap:4px; text-align:center; padding:18px 12px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface);}
.network-num{font-family:var(--mono); font-weight:700; font-size:22px; color:var(--ink);}
.network-label{font-size:13px; color:var(--muted); line-height:1.4;}
@media(max-width:640px){ .network-grid{grid-template-columns:repeat(2,1fr); gap:12px;} }

/* ===== Funnel (section 3) ===== */
.funnel{display:flex; align-items:flex-end; justify-content:center; gap:0; flex-wrap:wrap; margin-bottom:16px; padding:12px 0;}
.funnel-step{display:flex; flex-direction:column; align-items:center; gap:14px; text-align:center; width:150px; opacity:0; transform:translateY(14px); transition:opacity .5s var(--ease), transform .5s var(--ease);}
.funnel-step.show{opacity:1; transform:translateY(0);}
.funnel-num{font-family:var(--mono); font-weight:800; line-height:1; color:var(--ink); display:flex; align-items:center; justify-content:center; border-radius:50%; border:1.5px solid var(--line); background:var(--surface); aspect-ratio:1;}
.funnel-step[data-n="100"] .funnel-num{font-size:30px; width:92px;}
.funnel-step[data-n="15"] .funnel-num{font-size:26px; width:78px;}
.funnel-step[data-n="3"] .funnel-num{font-size:22px; width:66px;}
.funnel-step[data-n="1"] .funnel-num{font-size:24px; width:72px; color:var(--bg); background:var(--accent); border-color:var(--accent);}
.funnel-step[data-n="1"].show{animation:landPulse .5s var(--ease);}
@keyframes landPulse{0%{transform:scale(0.85); opacity:0;} 60%{transform:scale(1.06);} 100%{transform:scale(1); opacity:1;}}
.funnel-label{font-family:var(--mono); font-size:11.5px; text-transform:uppercase; letter-spacing:0.03em; color:var(--muted); max-width:120px;}
.funnel-arrow{color:var(--line); font-size:22px; padding-bottom:38px; margin:0 -6px;}
@media(max-width:640px){ .funnel{flex-direction:column; gap:22px;} .funnel-arrow{transform:rotate(90deg); padding-bottom:0;} }

.method-grid{display:grid; grid-template-columns:1fr 1fr; gap:22px; max-width:900px; margin:48px auto 0;}
.method-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:26px;}
.method-card h3{font-size:17px; margin-bottom:10px;}
.method-card p{font-size:14.5px; color:var(--muted); line-height:1.6;}
@media(max-width:700px){ .method-grid{grid-template-columns:1fr;} }

/* ===== Results (section 4) ===== */
.case-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:20px;}
.case-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:26px; transition:transform var(--dur) var(--ease), border-color var(--dur) var(--ease);}
.case-card:hover{transform:translateY(-3px); border-color:rgba(201,162,101,0.4);}
.case-client{font-size:12.5px; color:var(--muted); text-transform:uppercase; letter-spacing:0.04em; margin-bottom:6px;}
.case-title{font-weight:700; font-size:15.5px; margin-bottom:14px; min-height:38px;}
.case-num{font-family:var(--mono); font-weight:800; font-size:32px; color:var(--ink);}
.case-delay{font-weight:700; color:var(--accent-text); font-size:13.5px; margin-bottom:10px;}
.case-detail{font-size:13px; color:var(--muted); line-height:1.5;}

.volume-box{max-width:600px; margin:56px auto 0; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:30px 34px; text-align:center;}
.volume-box h3{font-size:19px; margin-bottom:14px;}
.volume-box p{font-size:14.5px; color:var(--muted); line-height:1.6; margin-bottom:16px;}
.volume-box .btn-primary{margin-top:6px;}

.clients-block{margin-top:64px;}
.client-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:2px; max-width:920px; margin:0 auto; background:var(--line); border:1px solid var(--line);}
.client-name{background:var(--surface); padding:22px 16px; text-align:center; font-weight:800; font-size:17px; opacity:0; transform:translateY(8px); transition:opacity .4s var(--ease), transform .4s var(--ease);}
.client-name.show{opacity:1; transform:translateY(0);}
@media(max-width:760px){ .client-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:420px){ .client-grid{grid-template-columns:1fr;} }
.roles-filled{max-width:820px; margin:24px auto 0; text-align:center; font-size:13.5px; color:var(--muted); line-height:1.7;}
.roles-filled strong{color:var(--ink);}

.pentalog-block{max-width:760px; margin:56px auto 0; padding-top:40px; border-top:1px dashed var(--line); text-align:center;}
.pentalog-block h3{font-size:18px; margin-bottom:14px; color:var(--muted);}
.pentalog-block p{font-size:13.5px; color:var(--muted); line-height:1.7;}
.pentalog-accounts{font-weight:600; color:var(--ink);}

/* ===== Testimonials (section 5) ===== */
.testi-featured{max-width:680px; margin:0 auto 32px; text-align:center; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:36px;}
.testi-featured-tag{font-family:var(--mono); font-size:12px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--accent-text); margin-bottom:16px;}
.testi-featured-quote{font-size:20px; font-weight:600; line-height:1.4; margin-bottom:18px;}
.testi-name{font-weight:700; font-size:14.5px;}
.testi-role{font-size:12.5px; color:var(--muted); border-top:1px solid var(--line); padding-top:6px; margin-top:6px; display:inline-block;}
.testi-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(240px,1fr)); gap:20px; margin-bottom:20px;}
.testi-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:24px;}
.testi-pull{font-size:17px; font-weight:600; line-height:1.4; margin-bottom:10px;}
.testi-full{font-size:13px; color:var(--muted); line-height:1.55; margin-bottom:16px;}
.testi-fineprint{font-size:12px; color:var(--muted); text-align:center;}

/* ===== FAQ ===== */
.faq-list{max-width:720px; margin:0 auto;}
.faq-item{border-bottom:1px solid var(--line);}
.faq-item summary{cursor:pointer; list-style:none; padding:20px 30px 20px 0; font-weight:700; font-size:15.5px; color:var(--ink); position:relative; line-height:1.4;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:'+'; position:absolute; right:2px; top:18px; font-family:var(--mono); font-size:20px; color:var(--accent-text); transition:transform var(--dur) var(--ease);}
.faq-item[open] summary::after{transform:rotate(45deg);}
.faq-answer{padding:0 40px 22px 0;}
.faq-answer p{font-size:14px; color:var(--muted); line-height:1.65;}
.testi-worked-with{max-width:820px; margin:48px auto 0; padding-top:40px; border-top:1px dashed var(--line);}
.testi-worked-with .section-head{margin-bottom:28px;}
.testi-worked-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
@media(max-width:700px){ .testi-worked-grid{grid-template-columns:1fr;} }

/* ===== The question ===== */
.question-block{max-width:760px; margin:0 auto; text-align:center; padding:24px 0;}
.question-text{font-size:clamp(28px,5vw,44px); font-weight:800; letter-spacing:-0.01em; line-height:1.2; color:var(--ink); text-wrap:balance; margin-bottom:36px;}

/* ===== Pricing ===== */
.pricing-box{max-width:520px; margin:0 auto; text-align:center; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:44px 36px;}
.pricing-rate{font-family:var(--mono); font-weight:800; font-size:56px; color:var(--ink);}
.pricing-rate-label{font-size:14px; color:var(--muted); margin-top:4px;}
.pricing-sub{font-weight:700; font-size:17px; margin-top:16px;}
.pricing-reassurance{list-style:none; margin:26px auto 0; text-align:left; display:inline-block;}
.pricing-reassurance li{font-size:14px; color:var(--muted); padding-left:24px; position:relative; margin-bottom:10px;}
.pricing-reassurance li::before{content:'✓'; position:absolute; left:0; color:var(--accent-text); font-weight:700;}
.pricing-fineprint{font-size:12px; color:var(--muted); margin-top:22px;}
.prereq-details{max-width:560px; margin:40px auto 0;}
.prereq-details summary{cursor:pointer; text-align:center; font-weight:700; font-size:15px; color:var(--ink); list-style:none; padding:14px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface);}
.prereq-details summary::-webkit-details-marker{display:none;}
.prereq-list{list-style:none; margin-top:16px; padding:0 8px;}
.prereq-list li{gap:10px; font-size:14px; color:var(--muted); padding:11px 0; border-top:1px solid var(--line);}
.prereq-list li::before{content:'→'; color:var(--accent-text); flex-shrink:0;}
/* same fix as .kicker/.roles-index-body above: li's flex layout needs a
   selector specific (and specific enough) to beat both the base hide rule
   and the generic li->list-item override, for the active language only */
html[lang="fr"] .prereq-list li[data-i18n="fr"], html[lang="en"] .prereq-list li[data-i18n="en"]{display:flex;}

/* ===== Bio ===== */
.bio-grid{display:grid; grid-template-columns:220px 1fr; gap:44px; align-items:center; max-width:760px; margin:0 auto;}
.bio-photo{width:220px; height:220px; border-radius:50%; object-fit:cover; border:1px solid var(--line);}
.bio-photo-fallback{width:220px; height:220px; border-radius:50%; background:var(--bg-deep); color:var(--accent-text); font-weight:800; font-size:56px; align-items:center; justify-content:center; font-family:var(--mono); display:none;}
.bio-text h2{margin-bottom:16px;}
.bio-text p{font-size:15px; color:var(--muted); margin-bottom:14px; line-height:1.65;}
.bio-links{display:flex; gap:16px; margin-top:20px;}
.bio-links a{font-weight:700; font-size:14px; color:var(--accent-text); text-decoration:none; display:inline-flex; align-items:center; gap:6px;}
@media(max-width:640px){ .bio-grid{grid-template-columns:1fr; text-align:center; justify-items:center;} .bio-links{justify-content:center;} }

.values-block{max-width:900px; margin:64px auto 0; padding-top:48px; border-top:1px solid var(--line);}
.values-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:24px;}
.value-card{text-align:center;}
.value-name{font-family:var(--mono); font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; color:var(--accent-text-lg); margin-bottom:10px;}
.value-text{font-size:13.5px; color:var(--muted); line-height:1.6;}
@media(max-width:760px){ .values-grid{grid-template-columns:1fr 1fr; row-gap:32px;} }
@media(max-width:460px){ .values-grid{grid-template-columns:1fr;} }

/* ===== Contact ===== */
.contact-form{display:flex; flex-direction:column; gap:18px; max-width:600px; margin:0 auto;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.form-field{display:flex; flex-direction:column; gap:6px;}
.form-field label{font-family:var(--mono); font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:0.06em;}
.form-field input, .form-field select, .form-field textarea{font-family:var(--sans); font-size:14.5px; color:var(--ink); background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:12px 14px; transition:border-color var(--dur) var(--ease); resize:vertical;}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(201,162,101,0.18);}
.form-field input[aria-invalid="true"], .form-field textarea[aria-invalid="true"]{border-color:var(--error);}
.form-error{font-size:12.5px; color:var(--error); min-height:1em; display:none;}
.form-error.show{display:block;}
.form-status{font-size:13.5px; color:var(--accent-text); min-height:1em; text-align:center;}
.form-status.error{color:var(--error);}
.contact-form .btn-primary{align-self:flex-start;}
.contact-confirm{max-width:520px; margin:0 auto; text-align:center; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:36px;}
.contact-confirm[hidden]{display:none;}
.contact-below{max-width:600px; margin:32px auto 0; text-align:center; font-size:14px; color:var(--muted); display:flex; gap:20px; justify-content:center; flex-wrap:wrap;}
.contact-below a{font-weight:700; color:var(--accent-text); text-decoration:none;}
@media(max-width:600px){ .form-row{grid-template-columns:1fr;} }

/* ===== Footer ===== */
footer{padding:36px 0; border-top:1px solid var(--line); text-align:center;}
footer p{font-size:12.5px; color:var(--muted);}
.footer-links{list-style:none; margin:0 0 14px; padding:0; display:flex; flex-wrap:wrap; justify-content:center; gap:8px 22px;}
.footer-links a{font-size:12.5px; color:var(--muted); text-decoration:none; border-bottom:1px solid transparent; transition:color var(--dur) var(--ease), border-color var(--dur) var(--ease);}
.footer-links a:hover, .footer-links a:focus-visible{color:var(--ink); border-bottom-color:var(--line);}

/* ===== Reveal on scroll ===== */
.reveal{opacity:0; transform:translateY(16px); transition:opacity .6s var(--ease), transform .6s var(--ease);}
.reveal.show{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion: reduce){
  .reveal, .funnel-step, .client-name{opacity:1 !important; transform:none !important; transition:none !important; animation:none !important;}
}

::selection{background:var(--accent); color:var(--ink-deep);}