@font-face{font-family:"JetBrains Mono";src:url(../fonts/jetbrains-mono-latin.woff2) format("woff2");font-weight:400 700;font-display:swap}
/* Self-hosted from Google Fonts (SIL Open Font License 1.1). Subsets: latin, latin-ext. */
/* Schibsted Grotesk normal latin-ext */
@font-face {
  font-family: 'Schibsted Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(../fonts/schibsted-grotesk-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Schibsted Grotesk normal latin */
@font-face {
  font-family: 'Schibsted Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(../fonts/schibsted-grotesk-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ==========================================================================
   BloomX design system 2.1.0, dark mood (site, Instagram): black + ONE lime accent.
   Source of truth: /Users/mba/BX/design-system (roles and fonts come from tokens.css, loaded before this file).
   The old names below are kept as aliases of the system roles so existing rules keep working.
   Retired 02/11/2026: sapphire blue, Hanken Grotesk, Martian Mono, Sofia Sans Extra Condensed, the "Signal X" logo.

   Lime (--accent, --action): the main button « Réserver mon audit offert », one hero word or figure, active states,
   focus ring, the logo X. Never lime text on a light background (use --navy there).
   WCAG 2.x contrast: ink #F4F4F2 on black 19.1 · ink-2 #A3A6AB on black 8.6 · lime #D4FF3A on black 17.6
     · navy #111827 on lime 15.6 · navy on bone 16.9 · line-strong #5E6166 on black 3.4
   ========================================================================== */

:root{
  /* colour: legacy names -> design-system roles. --gold* = value (CTA, figures), --accent* = lime. */
  --black:#000000;          /* page base */
  --surface:var(--night-900);        /* panels: dialog, simulator, lead feed, mega menu */
  --raised:var(--surface-2);         /* hover/active fill inside panels */
  --bone:var(--ink);           /* primary text */
  --cream:var(--ink);
  --grey:var(--ink-2);           /* secondary text */
  --titanium:#8E9196;       /* metal: outlines, noise streaks, logo shading */
  --platinum:#C9CCD1;       /* metal light: survivors, secondary emphasis */
  --gold:var(--accent);           /* CTA fill (navy text), result figures */
  --gold-hi:#FFFFFF;        /* CTA hover, brightest result tier */
  --gold-ink:var(--navy);       /* accent colour on light surfaces = navy */
  --gold-deep:var(--line-strong);      /* decorative neutral */
  --accent:var(--lime-400);         /* LIME: logo X, booked slots, active states, live dot, result markers. Never body text on light */
  --accent-light:var(--lime-400);   /* lime as text / focus ring on dark */
  --accent-deep:var(--accent-soft);    /* deep lime, glows only */
  --on-accent:var(--navy);
  --line:var(--night-700);           /* hairlines (decorative) */
  --line-strong:var(--night-500);    /* form control borders (3:1) */
  --ink-on-bone:var(--navy);
  --grey-on-bone:#45484D;

  /* type */
  --font-head:"Schibsted Grotesk",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-body:var(--font-head);
  --font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --font-cond:var(--font-head);

  --fs-xs:.8125rem;                                  /* 13 */
  --fs-sm:.9375rem;                                  /* 15 */
  --fs-base:1.0625rem;                               /* 17 */
  --fs-lg:clamp(1.125rem,.4vw + 1rem,1.3125rem);     /* 18 → 21 */
  --fs-h4:clamp(1.25rem,.8vw + 1rem,1.5rem);         /* 20 → 24 */
  --fs-h3:clamp(1.5rem,1.6vw + 1rem,2.25rem);        /* 24 → 36 */
  --fs-h2:clamp(2.125rem,3.6vw + 1rem,4.5rem);       /* 34 → 72 */
  --fs-h1:clamp(2.625rem,6.2vw + .5rem,7.5rem);      /* 42 → 120 */
  --fs-giant:clamp(2.75rem,10vw,10.5rem);            /* 72 → 300, condensed only */
  --fs-marquee:clamp(2.5rem,7vw,7.5rem);             /* condensed only */

  --lh-tight:.92; --lh-head:1.04; --lh-body:1.6;

  /* space (4px base) */
  --s-1:.25rem; --s-2:.5rem; --s-3:.75rem; --s-4:1rem; --s-5:1.5rem; --s-6:2rem;
  --s-7:3rem; --s-8:4rem; --s-9:6rem; --s-10:9rem;
  --gutter:clamp(1rem,4.5vw,4rem);
  --section:clamp(5rem,11vw,11rem);
  --maxw:90rem;
  --traffic:#7A7D82;        /* noise labels: raw traffic, vanity metrics (AA on black/surface only) */
  --glass:rgba(14,15,16,.62);
  /* photos: neutral cool monochrome */
  --photo-tone:grayscale(1) brightness(.88) contrast(1.08);
  --measure:36rem;

  /* shape + motion */
  --r-pill:999px; --r-sm:2px; --r-md:6px;
  --ease:cubic-bezier(.2,.7,.2,1);
  --dur:.28s;
  --header-h:4.5rem;
  --focus:var(--lime-400);
  color-scheme:dark;
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{background:var(--black);color:var(--bone);font:400 var(--fs-base)/var(--lh-body) var(--font-body);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip;min-height:100vh;
  font-feature-settings:"kern"; text-rendering:optimizeLegibility}
img,picture,svg,canvas,video{display:block;max-width:100%}
img{height:auto}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
a{color:inherit;text-underline-offset:.18em;text-decoration-thickness:1px}
ul[class],ol[class],nav ul,.site-footer ul{list-style:none;padding:0}
h1,h2,h3,h4{font-family:var(--font-head);font-weight:500;line-height:var(--lh-head);letter-spacing:-.025em;text-wrap:balance}
p{text-wrap:pretty}
p,li,dd,dt,summary{overflow-wrap:break-word}
:lang(de) h1,:lang(de) h2,:lang(de) h3,:lang(de) .giant{hyphens:auto;-webkit-hyphens:auto}
strong{font-weight:600}
::selection{background:var(--accent);color:var(--on-accent)}
[hidden]{display:none!important}

/* focus: visible on every background */
:focus{outline:none}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:var(--r-sm)}
.on-bone :focus-visible,.law :focus-visible{--focus:var(--black)}
.btn--primary:focus-visible{outline-color:var(--ink)}
.btn:focus-visible{border-radius:var(--r-pill)}

.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* ---------- layout ---------- */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:var(--section)}
.section + .section{padding-top:0}
.section--rule{border-top:1px solid var(--line);padding-top:var(--section)}
.stack > * + *{margin-top:var(--s-5)}
.grid-12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s-5)}

/* ---------- type ---------- */
.h1,.h2,.h3,.h4{font-family:var(--font-head);font-weight:500;line-height:var(--lh-head);text-wrap:balance}
.h1{font-size:var(--fs-h1);line-height:.96;letter-spacing:-.04em}
.h2,h2{font-size:var(--fs-h2);letter-spacing:-.035em}
.h3,h3{font-size:var(--fs-h3);letter-spacing:-.025em;line-height:1.1}
.h4,h4{font-size:var(--fs-h4);letter-spacing:-.015em;line-height:1.2}
.lead{font-size:var(--fs-lg);color:var(--grey);max-width:var(--measure);line-height:1.55}
.lead strong{color:var(--bone);font-weight:500}
.muted{color:var(--grey)}
.small{font-size:var(--fs-sm)}
.prose{max-width:42rem}
.prose > * + *{margin-top:1em}
.prose h2{font-size:var(--fs-h3);margin-top:2.2em}
.prose h3{font-size:var(--fs-h4);margin-top:1.8em}
.prose ul,.prose ol{padding-left:1.2em}
.prose li + li{margin-top:.4em}
.prose a{color:var(--bone)}
.prose a:hover{text-decoration-color:var(--gold)}
.todo{background:rgba(212,255,58,.16);color:var(--bone);padding:0 .25em;border-radius:var(--r-sm);font-weight:500}

/* micro-label: small, sentence case, tabular. Used for indices and meta, never above every heading */
.micro{font:500 var(--fs-xs)/1.3 var(--font-body);color:var(--grey);font-variant-numeric:tabular-nums;letter-spacing:.01em}

/* giant condensed title (section openers, 404) */
.giant{font-family:var(--font-head);font-weight:700;font-size:var(--fs-giant);line-height:.95;letter-spacing:-.04em;
  text-wrap:nowrap;margin-left:-.04em;overflow-wrap:normal}
.giant-count{font:500 var(--fs-sm)/1 var(--font-body);color:var(--grey);vertical-align:top;letter-spacing:0;
  margin-left:.4em;position:relative;top:.9em;font-variant-numeric:tabular-nums}
.sec-head{display:grid;gap:var(--s-6);margin-bottom:clamp(3rem,6vw,6rem)}
.sec-head .lead{justify-self:start}
@media (min-width:64rem){
  .sec-head{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s-5);align-items:end}
  .sec-head .giant,.sec-head .h2,.sec-head .h1,.sec-head .micro{grid-column:1 / -1}
  .sec-head .lead{grid-column:7 / span 5}
}
@media (max-width:30rem){ .giant{text-wrap:wrap;overflow-wrap:anywhere} }

/* ---------- skip link ---------- */
.skip-link{position:fixed;left:var(--s-4);top:var(--s-4);z-index:100;background:var(--bone);color:var(--black);
  padding:.75rem 1.1rem;border-radius:var(--r-pill);font-weight:600;text-decoration:none;transform:translateY(-200%)}
.skip-link:focus,.skip-link:focus-visible{transform:none;outline:2px solid var(--accent-light);outline-offset:2px}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:3rem;padding:.75rem 1.4rem;
  border-radius:var(--r-pill);border:1px solid transparent;font:600 var(--fs-sm)/1.1 var(--font-body);letter-spacing:.005em;
  text-decoration:none;white-space:nowrap;transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.btn svg{width:1.15em;height:1.15em;flex:none}
.btn--primary{background:var(--action);color:var(--on-action)}
.btn--primary:hover{background:var(--action-hover)}
.btn--secondary{background:transparent;color:var(--bone);border-color:rgba(244,244,242,.45)}
.btn--secondary:hover{background:var(--bone);color:var(--black);border-color:var(--bone)}
.btn--whatsapp{background:transparent;color:var(--bone);border-color:rgba(244,244,242,.45)}
.btn--whatsapp:hover{background:var(--bone);color:var(--black)}
.btn--lg{min-height:3.5rem;padding:1rem 1.8rem;font-size:var(--fs-base)}
.btn--sm{min-height:2.75rem;padding:.6rem 1.1rem;font-size:var(--fs-xs)}
.on-bone .btn--primary{background:var(--navy);color:#fff}
.on-bone .btn--primary:hover{background:var(--navy-800);color:#fff}
.on-bone .btn--secondary{color:var(--black);border-color:rgba(0,0,0,.5)}
.on-bone .btn--secondary:hover{background:var(--black);color:var(--bone)}
.btn-row{display:flex;flex-wrap:wrap;gap:var(--s-3);align-items:center}
.link{color:var(--bone);text-decoration:underline;text-decoration-color:rgba(244,244,242,.4);min-height:44px;display:inline-flex;align-items:center}
.link:hover{text-decoration-color:var(--gold)}
.icon-btn{display:inline-grid;place-items:center;width:2.75rem;height:2.75rem;border-radius:var(--r-pill);border:1px solid var(--line-strong);background:transparent;color:var(--bone)}
.icon-btn:hover{border-color:var(--bone)}
.icon-btn svg{width:1.1rem;height:1.1rem}

/* ---------- header (floating pill, condenses on scroll) ---------- */
.site-header{position:fixed;inset:0 0 auto 0;z-index:50;padding:var(--s-3) var(--gutter);pointer-events:none}
.header-bar{position:relative;pointer-events:auto;display:flex;align-items:center;gap:var(--s-5);margin-inline:auto;max-width:var(--maxw);
  height:var(--header-h);padding-inline:0;border-radius:var(--r-pill);border:1px solid transparent;
  transition:max-width .5s var(--ease),height .4s var(--ease),padding .4s var(--ease),background-color .4s var(--ease),border-color .4s var(--ease)}
.site-header.is-condensed .header-bar{max-width:62rem;height:3.5rem;padding-inline:.5rem .5rem;padding-left:1.1rem;
  background:rgba(0,0,0,.86);border-color:var(--line);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2)}
.logo{display:inline-flex;align-items:center;gap:.55rem;text-decoration:none;color:var(--bone);min-height:44px;flex:none}
.logo-mark{width:1.75rem;height:1.75rem;color:var(--accent);transition:transform .6s var(--ease)}
.logo-word{height:.95rem;width:auto}
.logo:hover .logo-mark{transform:rotate(-30deg)}
.nav{display:none}
.nav-list{display:flex;gap:.25rem}
.nav-list > li > a,.nav-trigger{display:inline-flex;align-items:center;gap:.3rem;min-height:2.75rem;padding:0 .8rem;border-radius:var(--r-pill);text-decoration:none;
  font-size:var(--fs-sm);font-weight:500;color:var(--grey);transition:color var(--dur);background:none;border:0}
.nav-list > li > a:hover,.nav-list > li > a[aria-current="page"],.nav-trigger:hover,.nav-trigger[aria-expanded="true"],.nav-trigger[aria-current="true"]{color:var(--bone)}
.nav-trigger svg{width:.95rem;height:.95rem;transition:transform var(--dur) var(--ease)}
.nav-trigger[aria-expanded="true"] svg{transform:rotate(180deg)}
.js .nav-nojs{display:none}
html:not(.js) .nav-trigger{display:none}
.nav-list > li > a[aria-current="page"],.nav-trigger[aria-current="true"]{text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:.45em}
.header-end{margin-left:auto;display:flex;align-items:center;gap:var(--s-2)}
.header-cta{display:none}
.menu-btn{display:inline-flex;align-items:center;gap:.5rem;min-height:2.75rem;min-width:2.75rem;padding:0 1rem;border-radius:var(--r-pill);
  background:var(--bone);color:var(--black);border:0;font-weight:600;font-size:var(--fs-sm)}
.menu-btn-lines{position:relative;width:1rem;height:.6rem}
.menu-btn-lines::before,.menu-btn-lines::after{content:"";position:absolute;left:0;right:0;height:1.5px;background:currentColor;transition:transform var(--dur) var(--ease)}
.menu-btn-lines::before{top:0}.menu-btn-lines::after{bottom:0}
.menu-btn[aria-expanded="true"] .menu-btn-lines::before{transform:translateY(.27rem) rotate(45deg)}
.menu-btn[aria-expanded="true"] .menu-btn-lines::after{transform:translateY(-.27rem) rotate(-45deg)}
.menu-nojs{display:inline-flex;align-items:center;min-height:2.75rem;padding:0 1rem;color:var(--bone)}
.js .menu-nojs{display:none}
html:not(.js) .menu-btn{display:none}
@media (min-width:64rem){
  .nav{display:block;margin-left:auto}
  .header-end{margin-left:0}
  .header-cta{display:inline-flex}
  .menu-btn,.menu-nojs{display:none!important}
}
@media (min-width:64rem) and (max-width:74rem){ .nav-list > li > a,.nav-trigger{padding:0 .55rem} .site-header.is-condensed .header-bar{max-width:100%} }

/* services mega menu (desktop): button[aria-expanded] > #mega; links are real <a>s */
.mega{position:absolute;top:calc(100% + .5rem);left:50%;width:min(66rem,calc(100vw - 2 * var(--gutter)));translate:-50% 0;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s-2);
  display:grid;gap:var(--s-2);box-shadow:0 40px 90px rgba(0,0,0,.7);
  opacity:0;transform:translateY(-.4rem);transition:opacity .22s var(--ease),transform .3s var(--ease)}
.mega.is-open{opacity:1;transform:none}
.mega-intro{position:relative;overflow:hidden;border-radius:var(--r-sm);padding:var(--s-5);display:grid;align-content:space-between;gap:var(--s-6);min-height:12rem;
  background:var(--black) url("../brand/bloom-motif.svg") no-repeat right -6rem top -6rem / 14rem}
.mega-intro p{color:var(--grey);font-size:var(--fs-sm);max-width:17rem}
.mega-intro .mega-all{display:inline-flex;align-items:center;gap:.5rem;min-height:2.75rem;font:500 var(--fs-h4)/1.2 var(--font-head);letter-spacing:-.02em;text-decoration:none;color:var(--bone)}
.mega-intro .mega-all svg{width:1.1rem;height:1.1rem;transition:transform var(--dur) var(--ease)}
.mega-intro .mega-all:hover svg{transform:translateX(.25rem)}
.mega-list{display:grid;gap:2px}
.mega-link{display:grid;grid-template-columns:2rem 1fr;gap:.1rem var(--s-3);padding:var(--s-4);border-radius:var(--r-sm);text-decoration:none;color:var(--bone);min-height:44px;transition:background-color var(--dur)}
.mega-link .micro{grid-row:1 / span 2;padding-top:.3rem;transition:color var(--dur)}
.mega-name{font:500 var(--fs-base)/1.25 var(--font-head);letter-spacing:-.015em}
.mega-desc{color:var(--grey);font-size:var(--fs-xs);line-height:1.45}
.mega-link:hover,.mega-link:focus-visible,.mega-link[aria-current="page"]{background:var(--raised)}
.mega-link:hover .micro,.mega-link:focus-visible .micro,.mega-link[aria-current="page"] .micro{color:var(--accent-light)}
.mega-link:focus-visible{outline-offset:-2px}
@media (min-width:64rem){
  .mega{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
  .mega-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:63.99rem){ .mega{display:none!important} }
@media (prefers-reduced-motion:reduce){ .mega{transform:none} }

/* mobile menu panel */
.menu{position:fixed;inset:0;z-index:49;background:var(--black);padding:calc(var(--header-h) + var(--s-7)) var(--gutter) var(--s-6);
  display:flex;flex-direction:column;gap:var(--s-6);overflow-y:auto;visibility:hidden;opacity:0;transition:opacity .3s var(--ease),visibility 0s linear .3s}
.menu.is-open{visibility:visible;opacity:1;transition:opacity .3s var(--ease)}
.menu-list > li > a{display:flex;align-items:baseline;gap:var(--s-4);padding:.35rem 0;min-height:44px;text-decoration:none;
  font:500 clamp(2rem,9vw,3rem)/1.1 var(--font-head);letter-spacing:-.035em}
.menu-list > li > a[aria-current="page"]{text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:.18em}
.menu-list .micro{min-width:1.6rem}
.menu-list .menu-sub{display:grid;gap:0 var(--s-5);padding:var(--s-2) 0 var(--s-4) calc(1.6rem + var(--s-4))}
.menu-sub a{display:flex;align-items:center;min-height:44px;text-decoration:none;color:var(--grey);font:500 var(--fs-lg)/1.2 var(--font-head);letter-spacing:-.015em}
.menu-sub a:hover,.menu-sub a[aria-current="page"]{color:var(--bone)}
.menu-sub a[aria-current="page"]{text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:.25em}
@media (min-width:36rem){ .menu-list .menu-sub{grid-template-columns:repeat(2,minmax(0,1fr))} }
.menu-foot{margin-top:auto;display:grid;gap:var(--s-5)}
@media (min-width:64rem){ .menu{display:none} }
body.menu-open{overflow:hidden}

/* ---------- hero: pinned scroll-driven bloom ---------- */
.hero{position:relative;height:100svh;min-height:34rem}
.js .hero{height:200svh}
.hero-pin{position:sticky;top:0;height:100svh;min-height:34rem;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end}
.hero-bloom{position:absolute;inset:0;width:100%;height:100%}
html:not(.js) .hero-bloom{background:url("../brand/bloom-motif.svg") no-repeat 74% 40% / min(44vw,34rem);opacity:.7}
.hero-content{position:relative;z-index:1;padding-bottom:clamp(2rem,6vh,4.5rem);display:grid;gap:var(--s-5)}
.hero-title{font-size:var(--fs-h1);line-height:.98;letter-spacing:-.045em;font-weight:500;max-width:11em}
.hero-content > *{max-width:52rem}
.hero-sub{color:var(--grey);font-size:var(--fs-lg);max-width:30rem;line-height:1.5}
.hero-sub strong{color:var(--bone);font-weight:500}
.hero-scroll{position:absolute;right:var(--gutter);bottom:clamp(2rem,6vh,4.5rem);z-index:1;display:none}
@media (max-width:63.99rem){ html:not(.js) .hero-bloom{background-position:50% 22%;background-size:80vw} }

/* strike & swap headline */
.swap{display:block}
.swap-item{display:block}
.swap-from,.swap-to{display:block}
.swap-from{color:var(--grey)}
.swap s{text-decoration:none;position:relative;display:inline-block;color:var(--grey)}
.swap s::after{content:"";position:absolute;left:-.04em;right:-.04em;top:54%;height:.075em;background:var(--gold);transform-origin:left center}
.swap-to{color:var(--bone)}
/* static (no JS / reduced motion): all pairs, compact */
.swap-list{display:grid;gap:.08em}
.swap:not(.is-live) .swap-list{font-size:.5em;line-height:1.05;gap:.35em;letter-spacing:-.025em}
.swap:not(.is-live) .swap-item{display:flex;flex-wrap:wrap;column-gap:.28em}
/* live: one pair at a time, stacked in the same grid cell */
.swap.is-live .swap-list{display:grid}
.swap.is-live .swap-item{grid-area:1/1;opacity:0;visibility:hidden}
.swap.is-live .swap-item.is-active{opacity:1;visibility:visible;transition:opacity .35s var(--ease) .3s}
.swap.is-live .swap-item s::after{transform:scaleX(0)}
.swap.is-live .swap-item .swap-to{opacity:0;transform:translateY(.25em)}
.swap.is-live .swap-item.is-struck s::after{transform:scaleX(1);transition:transform .5s var(--ease)}
.swap.is-live .swap-item.is-struck .swap-to{opacity:1;transform:none;transition:opacity .5s var(--ease) .25s,transform .6s var(--ease) .25s}
.swap.is-live .swap-item.is-leaving{opacity:0;transition:opacity .25s var(--ease),visibility 0s linear .25s;visibility:hidden}

/* ---------- lead-feed demo card ---------- */
.leadfeed{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s-3);font-size:var(--fs-sm);width:100%;max-width:22rem}
.leadfeed-head{display:flex;align-items:center;gap:var(--s-3);padding:0 0 var(--s-3) var(--s-2)}
.leadfeed-title{font-weight:600;flex:1}
.tag{display:inline-flex;align-items:center;gap:.4em;font:600 var(--fs-xs)/1 var(--font-body);color:var(--black);background:var(--bone);border-radius:var(--r-pill);padding:.32rem .6rem}
.tag--outline{background:transparent;color:var(--bone);box-shadow:inset 0 0 0 1px var(--line-strong)}
.leadfeed-list{display:grid;gap:2px;position:relative}
.lead-item{background:var(--black);border-radius:var(--r-sm);padding:var(--s-3) var(--s-4);display:grid;grid-template-columns:1fr auto;gap:.15rem var(--s-3)}
.lead-item:first-child{box-shadow:inset 2px 0 0 var(--accent)}
.lead-what{font-weight:600}
.lead-where{color:var(--grey);text-align:right;font-variant-numeric:tabular-nums}
.lead-meta{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:.2rem var(--s-4);color:var(--grey);font-size:var(--fs-xs);font-variant-numeric:tabular-nums}
.lead-meta .ok{color:var(--bone)}
.lead-meta .ok::before{content:"";display:inline-block;width:.45em;height:.45em;border-radius:50%;background:var(--accent);margin-right:.4em;vertical-align:.1em}
.leadfeed.is-anim .lead-item:first-child{animation:lead-in .6s var(--ease)}
@keyframes lead-in{from{opacity:0;transform:translateY(-.6rem)}to{opacity:1;transform:none}}
.hero .leadfeed{position:relative;z-index:1}
@media (min-width:64rem){
  .hero .leadfeed{position:absolute;right:var(--gutter);bottom:clamp(2rem,6vh,4.5rem)}
  .hero .leadfeed .lead-item:nth-child(n+4){display:none}
}
@media (max-width:63.99rem){
  /* compact ticker in the hero on small screens: newest lead only */
  .hero .leadfeed{position:absolute;z-index:1;left:var(--gutter);right:var(--gutter);top:calc(var(--header-h) + var(--s-3));width:auto;max-width:26rem;padding:var(--s-2)}
  .hero .leadfeed-head{padding:0 0 var(--s-2) var(--s-2)}
  .hero .leadfeed .lead-item:not(:first-child){display:none}
}

/* ---------- client logos ---------- */
.logos{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-6) clamp(2rem,5vw,4.5rem)}
.logos img{height:clamp(2rem,3vw,2.75rem);width:auto;opacity:.85}
.logos .is-tall img{height:clamp(2.75rem,4.2vw,3.75rem)}

/* ---------- services: numbered list with image reveal ---------- */
.svc-list{border-top:1px solid var(--line);position:relative;overflow-x:clip}
:not(body).svc{position:relative;border-bottom:1px solid var(--line)}
.svc-row{display:grid;grid-template-columns:2.5rem 1fr;gap:var(--s-2) var(--s-4);padding:clamp(1.25rem,2.6vw,2.25rem) 0;text-decoration:none;color:inherit;align-items:baseline}
.svc-num{font:500 var(--fs-sm)/1 var(--font-body);color:var(--grey);font-variant-numeric:tabular-nums;transition:color var(--dur)}
.svc-title{font:500 clamp(1.75rem,4.4vw,4rem)/1.02 var(--font-head);letter-spacing:-.04em;transition:transform .45s var(--ease)}
.svc-items{grid-column:2;color:var(--grey);font-size:var(--fs-sm);max-width:34rem}
:not(body).svc-media{margin:0;overflow:hidden;border-radius:var(--r-sm)}
:not(body).svc-media picture,.case-media picture{display:block;height:100%}
:not(body).svc-media img{width:100%;height:100%;object-fit:cover}
a.svc-row:hover .svc-num,a.svc-row:focus-visible .svc-num,:not(body).svc:hover .svc-num,:not(body).svc:focus-within .svc-num{color:var(--accent-light)}
/* touch / no hover: small inline image */
@media (hover:none),(pointer:coarse),(max-width:47.99rem){
  :not(body).svc{display:grid;grid-template-columns:1fr 5.5rem;gap:var(--s-4);align-items:center}
  :not(body).svc-media{aspect-ratio:4/3}
}
@media (max-width:30rem){ :not(body).svc{grid-template-columns:1fr 4.5rem} }
/* fine pointer: image floats beside the row, revealed on hover/focus (follows the pointer with JS) */
@media (hover:hover) and (pointer:fine) and (min-width:48rem){
  .svc-row{grid-template-columns:4rem minmax(0,7fr) minmax(0,5fr)}
  .svc-items{grid-column:3;align-self:center}
  :not(body).svc-media{position:absolute;z-index:2;pointer-events:none;width:clamp(14rem,22vw,20rem);aspect-ratio:4/5;
    left:var(--mx,62%);top:var(--my,50%);translate:-50% -50%;
    clip-path:inset(50% 0 50% 0);transition:clip-path .5s var(--ease)}
  :not(body).svc-media img{transform:scale(1.15);transition:transform .8s var(--ease)}
  :not(body).svc:hover :not(body).svc-media,:not(body).svc:focus-within :not(body).svc-media{clip-path:inset(0 0 0 0)}
  :not(body).svc:hover :not(body).svc-media img,:not(body).svc:focus-within :not(body).svc-media img{transform:scale(1)}
  :not(body).svc:hover .svc-title,:not(body).svc:focus-within .svc-title{transform:translateX(.4rem)}
  .svc-list:hover :not(body).svc:not(:hover) .svc-title{color:var(--grey)}
}

/* ---------- case-study cards (editorial, asymmetric) ---------- */
.cases{display:grid;gap:var(--s-8) var(--s-5)}
.case{position:relative}
.case-link{display:block;text-decoration:none;color:inherit}
.case-media{margin:0;overflow:hidden;border-radius:var(--r-sm);aspect-ratio:4/3;background:var(--surface)}
.case-media img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.case-link:hover .case-media img,.case-link:focus-visible .case-media img{transform:scale(1.04)}
.case-body{display:grid;grid-template-columns:1fr auto;gap:var(--s-2) var(--s-5);padding-top:var(--s-5);align-items:start}
.case-client{font-size:var(--fs-sm);color:var(--grey);grid-column:1/-1}
.case-title{font-size:var(--fs-h4);max-width:24rem;line-height:1.2}
.case-figure{white-space:nowrap;font:700 calc(clamp(3.5rem,7vw,6.5rem) * .58)/0.95 var(--font-head);color:var(--gold);letter-spacing:-.035em;grid-row:2;grid-column:2;text-align:right}
.case-figure small{white-space:normal;hyphens:manual;display:block;font:500 var(--fs-xs)/1.3 var(--font-body);color:var(--grey);letter-spacing:0;margin-top:.5rem;max-width:9rem;margin-left:auto}
.case-tags{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:var(--s-2);margin-top:var(--s-2)}
.case-tags li{font-size:var(--fs-xs);color:var(--grey);border:1px solid var(--line);border-radius:var(--r-pill);padding:.3rem .7rem}
.case-link:hover .case-title{text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:.2em}
@media (min-width:48rem){
  .cases{grid-template-columns:repeat(12,minmax(0,1fr))}
  .case:nth-child(3n+1){grid-column:1 / span 7}
  .case:nth-child(3n+2){grid-column:9 / span 4;margin-top:clamp(6rem,16vw,14rem)}
  .case:nth-child(3n+2) .case-media{aspect-ratio:4/5}
  /* narrow card: title, then the figure under it (no side-by-side squeeze) */
  .case:nth-child(3n+2) .case-body{grid-template-columns:1fr}
  .case:nth-child(3n+2) .case-figure{grid-column:1;grid-row:auto;text-align:left}
  .case:nth-child(3n+2) .case-figure small{margin-left:0}
  .case:nth-child(3n){grid-column:3 / span 6}
  .case:nth-child(3n) .case-media{aspect-ratio:16/10}
}

/* ---------- marquee ---------- */
.marquee{position:relative;overflow:hidden;border-block:1px solid var(--line);padding-block:clamp(1rem,2.5vw,2rem)}
.marquee-track{display:flex;width:max-content}
.marquee-list{display:flex;flex:none;align-items:center}
.marquee-list li{display:flex;align-items:center;font:700 calc(var(--fs-marquee) * .58)/0.95 var(--font-head);letter-spacing:-.035em;white-space:nowrap;padding-right:.35em}
.marquee-list li::after{content:"";width:.32em;height:.32em;margin-left:.35em;flex:none;background:var(--accent);-webkit-mask:url("../brand/mark.svg") center/contain no-repeat;mask:url("../brand/mark.svg") center/contain no-repeat;opacity:.9}
.marquee-list li:nth-child(even){color:var(--grey)}
.marquee-toggle{position:absolute;right:var(--gutter);bottom:var(--s-3);z-index:1;background:var(--black)}
@media (prefers-reduced-motion:no-preference){
  .marquee.is-ready .marquee-track{animation:marquee var(--marquee-dur,38s) linear infinite}
  .marquee.is-paused .marquee-track{animation-play-state:paused}
  .marquee:hover .marquee-track,.marquee:focus-within .marquee-track{animation-play-state:paused}
}
@keyframes marquee{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){ .marquee-toggle{display:none} }

/* ---------- stats row ---------- */
.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line)}
.stat{display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:var(--s-3);padding:var(--s-5) var(--s-4) var(--s-5) 0;border-bottom:1px solid var(--line)}
.stat dd{font:700 calc(clamp(3.5rem,8vw,8rem) * .58)/0.95 var(--font-head);letter-spacing:-.035em;margin:0}
.stat dt{color:var(--grey);font-size:var(--fs-sm);max-width:14rem}
@media (min-width:48rem){
  .stats{grid-template-columns:repeat(4,minmax(0,1fr));border-bottom:1px solid var(--line)}
  .stat{border-bottom:0;padding:var(--s-6) var(--s-5) var(--s-6) 0}
  .stat + .stat{border-left:1px solid var(--line);padding-left:var(--s-5)}
}

/* ---------- steps / timeline (a real sequence) ---------- */
.steps-wrap{display:grid;gap:var(--s-7)}
.steps{position:relative;counter-reset:step;display:grid}
.steps::before,.steps::after{content:"";position:absolute;left:1.375rem;top:1.375rem;bottom:1.375rem;width:1px;background:var(--line)}
.steps::after{background:var(--accent);transform-origin:top;transform:scaleY(var(--p,0))}
.step{counter-increment:step;position:relative;padding:0 0 clamp(2.5rem,5vw,4rem) 4.5rem}
.step:last-child{padding-bottom:0}
.step::before{content:counter(step,decimal-leading-zero);position:absolute;left:0;top:-.15rem;width:2.75rem;height:2.75rem;border-radius:50%;
  background:var(--black);box-shadow:inset 0 0 0 1px var(--line-strong);display:grid;place-items:center;font:500 var(--fs-xs)/1 var(--font-body);
  color:var(--grey);font-variant-numeric:tabular-nums;transition:box-shadow .3s,color .3s;z-index:1}
.step.is-reached::before{box-shadow:inset 0 0 0 1px var(--accent);color:var(--bone)}
.step h3{font-size:var(--fs-h3);margin-bottom:var(--s-2)}
.step p{color:var(--grey);max-width:var(--measure)}
@media (min-width:64rem){
  .steps-wrap{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s-5)}
  .steps-wrap > :first-child{grid-column:1 / span 5;position:sticky;top:calc(var(--header-h) + var(--s-6));align-self:start}
  .steps-wrap > .steps{grid-column:7 / span 6}
}

/* ---------- FAQ ---------- */
.faq{border-top:1px solid var(--line);max-width:56rem}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--s-5);
  padding:var(--s-5) 0;min-height:44px;font:500 var(--fs-h4)/1.25 var(--font-head);letter-spacing:-.015em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:.85rem;height:.85rem;
  background:linear-gradient(currentColor 0 0) center/100% 1.5px no-repeat,linear-gradient(currentColor 0 0) center/1.5px 100% no-repeat;
  color:var(--grey);transition:transform .3s var(--ease),color .3s}
.faq details[open] summary::after,.faq summary:hover::after{color:var(--accent-light)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq summary:hover{color:var(--bone)}
.faq .faq-a{padding:0 0 var(--s-6);color:var(--grey);max-width:var(--measure)}
.faq .faq-a > * + *{margin-top:.8em}

/* ---------- law panel (the inverted moment) ---------- */
.law{background:var(--bone);color:var(--black);border-radius:var(--r-sm);padding:clamp(2rem,6vw,6rem) clamp(1.25rem,5vw,5rem)}
.law-date{white-space:nowrap;font:700 calc(clamp(3.5rem,11vw,11rem) * .58)/0.95 var(--font-head);letter-spacing:-.035em;color:var(--black)}
.law-date span{color:var(--gold-ink)}
.law h2{margin-top:var(--s-6);max-width:16em}
.law .lead{color:var(--grey-on-bone)}
.law-facts{display:grid;gap:0;margin-top:var(--s-7);border-top:1px solid rgba(0,0,0,.2)}
.law-facts > div{padding:var(--s-5) 0;border-bottom:1px solid rgba(0,0,0,.2);display:grid;gap:var(--s-2)}
.law-facts dt{font:500 var(--fs-h3)/1.1 var(--font-head);letter-spacing:-.03em}
.law-facts dd{color:var(--grey-on-bone);max-width:30rem}
.law-src{margin-top:var(--s-6);font-size:var(--fs-xs);color:var(--grey-on-bone);max-width:44rem}
.law a{color:var(--black)}
@media (min-width:64rem){
  .law-inner{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s-5)}
  .law-inner > .law-head{grid-column:1 / span 8}
  .law-facts{grid-column:1 / -1;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--s-5)}
  .law-src{grid-column:1 / span 8}
}

/* ---------- forms (simulator) ---------- */
.field{display:grid;gap:var(--s-2)}
.field-label{font-size:var(--fs-sm);font-weight:500;color:var(--bone)}
.field-row{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-3)}
.field-row output{font:600 var(--fs-base)/1 var(--font-head);font-variant-numeric:tabular-nums}
.input,.select{width:100%;min-height:3rem;background:var(--black);border:1px solid var(--line-strong);border-radius:var(--r-md);padding:.7rem .9rem;color:var(--bone)}
.select{appearance:none;-webkit-appearance:none;padding-right:2.5rem;
  background-image:linear-gradient(45deg,transparent 50%,var(--bone) 50%),linear-gradient(135deg,var(--bone) 50%,transparent 50%);
  background-position:calc(100% - 1.15rem) 55%,calc(100% - .85rem) 55%;background-size:.3rem .3rem;background-repeat:no-repeat}
.input:hover,.select:hover{border-color:var(--grey)}
.input:focus-visible,.select:focus-visible{outline-offset:1px}
.seg{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.seg button{min-height:2.75rem;padding:.5rem 1rem;border-radius:var(--r-pill);border:1px solid var(--line-strong);background:transparent;font-size:var(--fs-sm)}
.seg button:hover{border-color:var(--bone)}
.seg button[aria-pressed="true"]{background:var(--bone);color:var(--black);border-color:var(--bone)}
.range{-webkit-appearance:none;appearance:none;width:100%;height:2.75rem;background:transparent;--p:50%}
.range::-webkit-slider-runnable-track{height:2px;background:linear-gradient(to right,var(--accent) var(--p),var(--line-strong) var(--p))}
.range::-moz-range-track{height:2px;background:var(--line-strong)}
.range::-moz-range-progress{height:2px;background:var(--accent)}
.range::-webkit-slider-thumb{-webkit-appearance:none;width:1.4rem;height:1.4rem;border-radius:50%;background:var(--bone);margin-top:calc(-.7rem + 1px);border:0}
.range::-moz-range-thumb{width:1.4rem;height:1.4rem;border-radius:50%;background:var(--bone);border:0}
.range:focus-visible{outline-offset:0}

/* simulator */
.sim > *{min-width:0}
.sim{display:grid;gap:2px;border-radius:var(--r-md);overflow:hidden;border:1px solid var(--line)}
.sim-in{display:grid;gap:var(--s-6);padding:clamp(1.25rem,3.5vw,2.75rem);background:var(--black)}
.sim-out{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-5);align-content:start;padding:clamp(1.25rem,3.5vw,2.75rem);background:var(--surface)}
.sim-out-label{display:flex;align-items:center;gap:var(--s-3);flex-wrap:wrap;color:var(--grey);font-size:var(--fs-sm)}
.sim-ca{font:700 calc(clamp(3.75rem,9vw,8rem) * .58)/0.95 var(--font-head);letter-spacing:-.035em;font-variant-numeric:tabular-nums;color:var(--bone)}
.sim-range{color:var(--grey);font-size:var(--fs-sm);font-variant-numeric:tabular-nums}
.sim-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line)}
.sim-flow > div{display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:var(--s-1);padding:var(--s-4) var(--s-3) 0 0}
.sim-flow > div + div{border-left:1px solid var(--line);padding-left:var(--s-3)}
.sim-flow dd{white-space:nowrap;font:600 clamp(1.1rem,1.9vw,1.6rem)/1 var(--font-head);letter-spacing:-.03em;font-variant-numeric:tabular-nums;margin:0}
.sim-flow dt{color:var(--grey);font-size:var(--fs-xs);line-height:1.35}
 @media (max-width:30rem){
  .sim-flow{grid-template-columns:1fr}
  .sim-flow > div,.sim-flow > div + div{flex-direction:row-reverse;justify-content:space-between;align-items:baseline;border-left:0;padding:var(--s-3) 0;border-bottom:1px solid var(--line)}
}
.sim-note{color:var(--grey);font-size:var(--fs-sm);max-width:30rem}
@media (min-width:56rem){ .sim{grid-template-columns:minmax(0,6fr) minmax(0,5fr)} }

/* ---------- contact + Calendly placeholder ---------- */
.contact-list{display:grid;border-top:1px solid var(--line)}
.contact-list a,.contact-list > div{display:grid;grid-template-columns:minmax(6rem,10rem) 1fr;gap:var(--s-4);align-items:baseline;padding:var(--s-5) 0;
  border-bottom:1px solid var(--line);text-decoration:none;min-height:44px}
.contact-list .micro{font-size:var(--fs-sm)}
@media (max-width:40rem){ .contact-list a,.contact-list > div{grid-template-columns:1fr;gap:var(--s-1)} }
.contact-list .val{font:500 var(--fs-h4)/1.25 var(--font-head);letter-spacing:-.015em;overflow-wrap:anywhere}
.contact-list a:hover .val{text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:.2em}
.cal-embed{border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);min-height:28rem;display:grid;position:relative;overflow:hidden}
.cal-placeholder{display:grid;align-content:center;justify-items:start;gap:var(--s-4);padding:clamp(1.5rem,4vw,3rem);max-width:34rem}
.cal-placeholder p{color:var(--grey);font-size:var(--fs-sm)}
.cal-embed iframe{width:100%;height:100%;min-height:44rem;border:0;display:block;background:var(--surface)}
.cal-embed.is-loaded .cal-placeholder{display:none}
.cal-fallback{margin-top:var(--s-3);font-size:var(--fs-sm);color:var(--grey)}

/* ---------- cookie banner + preferences dialog ---------- */
.cookie-banner{position:fixed;z-index:70;left:var(--gutter);right:var(--gutter);bottom:var(--s-4);max-width:34rem;
  background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r-md);padding:var(--s-5);display:grid;gap:var(--s-4);
  box-shadow:0 24px 60px rgba(0,0,0,.7)}
.cookie-banner .h4{font-size:var(--fs-base);font-weight:600;letter-spacing:-.01em}
.cookie-banner p{font-size:var(--fs-sm);color:var(--grey)}
.cookie-banner p a{color:var(--bone)}
.cookie-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-2)}
.cookie-actions .btn{padding-inline:.6rem;white-space:normal;text-align:center}
.cookie-banner .h4{color:var(--bone)}
/* desktop: bottom-right, clear of the left-aligned hero copy and CTAs */
@media (min-width:40.0625rem){ .cookie-banner{left:auto;right:var(--gutter)} }
@media (max-width:40rem){
  .cookie-banner{padding:var(--s-4);gap:var(--s-3);bottom:var(--s-2);left:var(--s-2);right:var(--s-2);max-height:60dvh;overflow:auto}
  .cookie-banner p{font-size:.8125rem;line-height:1.45}
  .cookie-actions{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .cookie-actions .btn{min-height:44px;padding-inline:.25rem;font-size:.8125rem}
}
.dialog{width:min(40rem,calc(100% - 2rem));max-height:calc(100dvh - 2rem);margin:auto;padding:0;background:var(--surface);color:var(--bone);
  border:1px solid var(--line-strong);border-radius:var(--r-md);overflow:auto}
.dialog::backdrop{background:rgba(0,0,0,.72)}
.dialog form{display:grid;gap:var(--s-5);padding:clamp(1.25rem,4vw,2.25rem)}
.dialog-head{display:flex;justify-content:space-between;gap:var(--s-4);align-items:start}
.dialog-head .h3{font-size:var(--fs-h4)}
.dialog p{color:var(--grey);font-size:var(--fs-sm)}
.consent-cat{border:0;padding:var(--s-4) 0 0;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr auto;gap:var(--s-1) var(--s-4);align-items:center}
.consent-cat legend{float:left;font-weight:600;padding:0}
.consent-cat p{grid-column:1/-1}
.consent-cat .switch{grid-row:1;grid-column:2}
.dialog-actions{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.dialog-actions .btn{flex:1 1 10rem}
/* switch (styled checkbox, keeps native semantics) */
.switch{position:relative;display:inline-flex;align-items:center;gap:var(--s-2);min-height:44px;cursor:pointer;font-size:var(--fs-xs);color:var(--grey)}
.switch input{appearance:none;-webkit-appearance:none;width:2.75rem;height:1.6rem;border-radius:var(--r-pill);border:1px solid var(--line-strong);background:var(--black);position:relative;cursor:pointer;margin:0;transition:background-color .2s,border-color .2s}
.switch input::after{content:"";position:absolute;top:50%;left:.2rem;width:1.1rem;height:1.1rem;border-radius:50%;background:var(--grey);translate:0 -50%;transition:transform .2s var(--ease),background-color .2s}
.switch input:checked{background:var(--accent);border-color:var(--accent)}
.switch input:checked::after{transform:translateX(1.15rem);background:var(--black)}
.switch input:disabled{opacity:.55;cursor:not-allowed}
.switch input:focus-visible{outline:2px solid var(--accent-light);outline-offset:3px}

/* ---------- footer ---------- */
.site-footer{border-top:1px solid var(--line);padding-block:clamp(3.5rem,8vw,7rem) var(--s-6);font-size:var(--fs-sm)}
.footer-cta{display:grid;gap:var(--s-6);padding-bottom:clamp(3rem,7vw,6rem);border-bottom:1px solid var(--line)}
.footer-cta .h2{max-width:14em}
.footer-grid{display:grid;gap:var(--s-7) var(--s-5);grid-template-columns:repeat(2,minmax(0,1fr));padding-block:var(--s-7)}
.footer-grid h2{font:500 var(--fs-sm)/1.3 var(--font-body);color:var(--grey);letter-spacing:0;margin-bottom:var(--s-3)}
.footer-grid ul{display:grid}
.footer-grid a,.footer-grid button.linklike{display:inline-flex;align-items:center;min-height:2.75rem;text-decoration:none;color:var(--bone)}
.footer-grid a:hover,.footer-grid button.linklike:hover{text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:.25em}
.footer-grid address{font-style:normal;line-height:1.7;padding-top:.6rem}
.footer-brand{grid-column:1/-1}
.footer-brand .logo-mark{width:2.4rem;height:2.4rem}
.footer-brand .logo-word{height:1.2rem}
.footer-brand p{color:var(--grey);margin-top:var(--s-4);max-width:22rem}
.footer-bottom{display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-6);justify-content:space-between;color:var(--grey);padding-top:var(--s-5);border-top:1px solid var(--line);font-size:var(--fs-xs)}
button.linklike{background:none;border:0;padding:0;font:inherit;text-align:left}
@media (max-width:30rem){ .footer-grid{grid-template-columns:1fr} }
.footer-grid a{overflow-wrap:anywhere}
@media (min-width:56rem) and (max-width:79.99rem){ .footer-grid{grid-template-columns:repeat(4,minmax(0,1fr))} }
@media (min-width:80rem){ .footer-grid{grid-template-columns:1.6fr repeat(4,minmax(0,1fr))} .footer-brand{grid-column:auto} }

/* ---------- 404 ---------- */
.notfound{min-height:100svh;display:grid;align-content:end;gap:var(--s-6);padding-block:calc(var(--header-h) + var(--s-8)) var(--s-8)}
.notfound .giant{font-size:clamp(7rem,30vw,24rem);color:var(--bone);display:flex;align-items:center;gap:.02em}
.notfound .nf-mark{color:var(--accent)}
.notfound .lead{color:var(--grey)}

/* ---------- breadcrumbs (inner pages) ---------- */
.crumbs ol{display:flex;flex-wrap:wrap;align-items:center;list-style:none;padding:0;font-size:var(--fs-xs);color:var(--grey)}
.crumbs li{display:inline-flex;align-items:center}
.crumbs li + li::before{content:"/";margin:0 .6em;color:var(--line-strong)}
.crumbs a{display:inline-flex;align-items:center;min-height:2.75rem;min-width:1.5rem;color:var(--grey);text-decoration:none}
.crumbs a:hover{color:var(--bone);text-decoration:underline;text-decoration-color:var(--gold)}
.crumbs [aria-current="page"]{color:var(--bone)}

/* ---------- page hero (inner pages): giant condensed title + intro, static bloom motif ---------- */
.page-hero{position:relative;overflow:hidden;padding-top:calc(var(--header-h) + var(--s-7));padding-bottom:clamp(3.5rem,8vw,7rem);border-bottom:1px solid var(--line)}
.page-hero-bloom{position:absolute;z-index:0;pointer-events:none;width:min(62vw,48rem);aspect-ratio:1;right:max(-12vw,-10rem);top:calc(var(--header-h) - 4rem);
  background:url("../brand/bloom-motif.svg") center/contain no-repeat;opacity:.42;
  -webkit-mask:radial-gradient(closest-side,#000 55%,transparent);mask:radial-gradient(closest-side,#000 55%,transparent)}
.page-hero > .wrap{position:relative;z-index:1;display:grid;gap:var(--s-6)}
.page-hero .crumbs{margin-bottom:clamp(1rem,4vw,3.5rem)}
.page-hero .btn--secondary,.page-hero .btn--whatsapp{background:rgba(0,0,0,.72);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.page-hero .btn--secondary:hover,.page-hero .btn--whatsapp:hover{background:var(--bone)}
.page-eyebrow{display:flex;gap:var(--s-3);align-items:baseline}
.page-eyebrow .micro + .micro::before{content:"·";margin-right:var(--s-3)}
.page-title{font:700 calc(clamp(3.5rem,11.5vw,12.5rem) * .58)/0.95 var(--font-head);letter-spacing:-.035em;text-wrap:balance;max-width:16ch;margin-left:-.04em}
.page-title em{font-style:normal;color:var(--grey)}
.page-hero-foot{display:grid;gap:var(--s-6);align-items:end}
.page-hero-foot .lead{color:var(--grey)}
@media (min-width:64rem){
  .page-hero-foot{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s-5)}
  .page-hero-foot .lead{grid-column:1 / span 6}
  .page-hero-foot .btn-row{grid-column:1 / span 6;justify-self:start}
}
@media (max-width:40rem){ .page-hero-bloom{width:110vw;right:-45vw;top:calc(var(--header-h) + 2rem);opacity:.3} }
/* simple heading variant for legal pages */
.page-hero--plain .page-title{font:500 var(--fs-h1)/.98 var(--font-head);letter-spacing:-.045em;max-width:16ch}

/* ---------- service group page: every service of the group ---------- */
.svc-details{border-top:1px solid var(--line);counter-reset:svcd}
.svc-detail{display:grid;gap:var(--s-5);padding-block:clamp(2.5rem,5vw,4.5rem);border-bottom:1px solid var(--line)}
.svc-detail-head{display:grid;grid-template-columns:2.5rem 1fr;gap:var(--s-3) var(--s-4);align-items:baseline}
.svc-detail-head .micro{font-size:var(--fs-sm)}
.svc-detail-head h2,.svc-detail-head h3{font-size:var(--fs-h3);letter-spacing:-.03em;line-height:1.08}
.svc-detail-head .tag{grid-column:2;justify-self:start}
.svc-detail-body{display:grid;gap:var(--s-5);align-content:start}
.svc-detail-body > p{color:var(--grey);max-width:var(--measure)}
.svc-detail-body > p strong{color:var(--bone);font-weight:500}
.svc-detail-media{margin:0;border-radius:var(--r-sm);overflow:hidden;aspect-ratio:3/2;background:var(--surface)}
.svc-detail-head .svc-detail-media{grid-column:1 / -1;margin-top:var(--s-2)}
.svc-detail-media img{width:100%;height:100%;object-fit:cover}
.ticks{display:grid;gap:.55rem;list-style:none;padding:0;font-size:var(--fs-sm)}
.ticks li{position:relative;padding-left:1.5rem}
.ticks li::before{content:"";position:absolute;left:0;top:.72em;width:.75rem;height:1px;background:var(--grey)}
@media (min-width:64rem){
  .svc-detail{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s-5)}
  .svc-detail-head{grid-column:1 / span 6;grid-template-columns:4rem 1fr;align-self:start;position:sticky;top:calc(var(--header-h) + var(--s-6))}
  .svc-detail-body{grid-column:7 / -1}
  .svc-detail-head .svc-detail-media{grid-column:2;margin-top:var(--s-4);max-width:24rem}
}
.tag--gold{background:transparent;color:var(--accent-light);box-shadow:inset 0 0 0 1px var(--accent-light)}
.on-bone .tag--gold{color:var(--navy);box-shadow:inset 0 0 0 1px var(--navy)}

/* other groups (bottom of each group page) */
.group-nav{display:grid;border-top:1px solid var(--line)}
.group-nav a{display:grid;grid-template-columns:2.5rem 1fr auto;gap:var(--s-4);align-items:center;padding:var(--s-4) 0;min-height:44px;
  border-bottom:1px solid var(--line);text-decoration:none;font:500 var(--fs-h4)/1.2 var(--font-head);letter-spacing:-.02em}
.group-nav a svg{width:1.2rem;height:1.2rem;color:var(--grey);transition:transform var(--dur) var(--ease),color var(--dur)}
.group-nav a:hover svg,.group-nav a:focus-visible svg{transform:translateX(.3rem);color:var(--accent-light)}
@media (min-width:48rem){ .group-nav{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s-6)} }

/* ---------- feature grid: commitments, principles, story, team (unordered sets) ---------- */
.features{display:grid;gap:0 var(--s-5);list-style:none;padding:0}
.feature{display:grid;gap:var(--s-3);align-content:start;padding:var(--s-5) 0 var(--s-6);border-top:1px solid var(--line)}
.feature h3{font-size:var(--fs-h4)}
.feature p{color:var(--grey);font-size:var(--fs-sm);max-width:30rem}
.feature .micro{font-size:var(--fs-xs)}
@media (min-width:48rem){ .features{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (min-width:80rem){ .features--4{grid-template-columns:repeat(4,minmax(0,1fr))} .features--3{grid-template-columns:repeat(3,minmax(0,1fr))}
  /* exactly 5 items: 3 + 2 on a 6-column grid, no orphan card */
  .features--4:has(> li:nth-child(5):last-child){grid-template-columns:repeat(6,minmax(0,1fr))}
  .features--4:has(> li:nth-child(5):last-child) > li{grid-column:span 2}
  .features--4:has(> li:nth-child(5):last-child) > li:nth-child(n+4){grid-column:span 3} }

/* ---------- apps in production (Réalisations) + filter ---------- */
.filters{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-bottom:var(--s-6)}
.filters button{min-height:2.75rem;padding:.5rem 1.1rem;border-radius:var(--r-pill);border:1px solid var(--line-strong);background:transparent;font-size:var(--fs-sm)}
.filters button:hover{border-color:var(--bone)}
.filters button[aria-pressed="true"]{background:var(--bone);color:var(--black);border-color:var(--bone)}
html:not(.js) .filters{display:none}
.apps{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,17rem),1fr));gap:2px;list-style:none;padding:0}
.app{display:grid;grid-template-columns:3rem 1fr;gap:var(--s-1) var(--s-4);align-content:start;background:var(--surface);padding:var(--s-5);border-radius:var(--r-sm)}
.app-ini{grid-row:1 / span 3;width:3rem;height:3rem;display:grid;place-items:center;border-radius:var(--r-md);box-shadow:inset 0 0 0 1px var(--line-strong);
  font:700 calc(1.35rem * .58)/1 var(--font-head);letter-spacing:-.035em;color:var(--bone)}
.app-name{font:500 var(--fs-base)/1.25 var(--font-head);letter-spacing:-.015em}
.app-client{color:var(--grey);font-size:var(--fs-xs)}
.app p{color:var(--grey);font-size:var(--fs-sm);margin-top:var(--s-2)}
.apps-empty{color:var(--grey);padding:var(--s-5) 0}

/* ---------- chips (tech stack, platforms) ---------- */
.chips{display:flex;flex-wrap:wrap;gap:var(--s-2);list-style:none;padding:0}
.chips li{font-size:var(--fs-sm);border:1px solid var(--line);border-radius:var(--r-pill);padding:.45rem .9rem;color:var(--bone)}

/* ---------- timeline (Agence): dated, not numbered ---------- */
.timeline{border-top:1px solid var(--line)}
.timeline > div{display:grid;gap:var(--s-2) var(--s-5);padding:var(--s-5) 0;border-bottom:1px solid var(--line)}
.timeline dt{white-space:nowrap;font:700 calc(clamp(2.5rem,5vw,4rem) * .58)/0.95 var(--font-head);letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.timeline dd{color:var(--grey);max-width:var(--measure);margin:0}
@media (min-width:48rem){ .timeline > div{grid-template-columns:minmax(9rem,max-content) 1fr;align-items:baseline} }

/* ---------- booking band (end of each page) ---------- */
.book{display:grid;gap:var(--s-7);padding-block:var(--section);border-top:1px solid var(--line)}
.book-title{font-size:var(--fs-h2);max-width:14em}
.book-list{display:grid;list-style:none;padding:0;border-top:1px solid var(--line);counter-reset:bk}
.book-list li{counter-increment:bk;display:grid;grid-template-columns:2.5rem 1fr;gap:var(--s-4);padding:var(--s-4) 0;border-bottom:1px solid var(--line)}
.book-list li::before{content:counter(bk,decimal-leading-zero);font:500 var(--fs-xs)/1.9 var(--font-body);color:var(--grey);font-variant-numeric:tabular-nums}
.book-note{color:var(--grey);font-size:var(--fs-sm)}
.book > :last-child{display:grid;gap:var(--s-5);align-content:start}
@media (min-width:64rem){
  .book{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s-5);align-items:start}
  .book > :first-child{grid-column:1 / span 6}
  .book > :last-child{grid-column:8 / -1;gap:var(--s-6)}
}

/* ---------- key/value list (legal notice, facts) ---------- */
.kv{display:grid;border-top:1px solid var(--line);max-width:56rem}
.kv > div{display:grid;gap:var(--s-1) var(--s-5);padding:var(--s-4) 0;border-bottom:1px solid var(--line)}
.kv dt{color:var(--grey);font-size:var(--fs-sm)}
.kv dd{margin:0;overflow-wrap:anywhere}
@media (min-width:40rem){ .kv > div{grid-template-columns:minmax(10rem,16rem) 1fr;align-items:baseline} }
.prose .kv{margin-block:1.5em}
.prose-updated{color:var(--grey);font-size:var(--fs-sm)}

/* ---------- inverted helper ---------- */
.on-bone{background:var(--bone);color:var(--black)}
.on-bone .lead,.on-bone .muted{color:var(--grey-on-bone)}

/* ---------- reduced motion: everything static ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .js .hero{height:100svh}
  .hero-pin{position:relative}
}

/* ---------- data table (privacy policy cookie list) ---------- */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-sm)}
.table-wrap:focus-visible{outline:2px solid var(--focus,var(--accent-light));outline-offset:2px}
.table-wrap table{width:100%;min-width:40rem;border-collapse:collapse;font-size:var(--fs-sm)}
.table-wrap th,.table-wrap td{text-align:left;vertical-align:top;padding:var(--s-3) var(--s-4);border-bottom:1px solid var(--line)}
.table-wrap th{font-weight:600;color:var(--bone);background:var(--surface)}
.table-wrap td{color:var(--grey)}
.table-wrap tr:last-child td{border-bottom:0}
.prose .table-wrap{max-width:none}
/* phones: the table scrolls sideways; a hint (added by app.js) and an edge fade show it */
.table-hint{display:none;font:400 11px/1.4 var(--font-mono);color:var(--grey);margin:0 0 var(--s-2);text-align:right}
@media (max-width:40rem){
  .table-hint{display:block}
  .table-wrap.is-scrollable:not(.is-end){-webkit-mask-image:linear-gradient(90deg,#000 80%,transparent);mask-image:linear-gradient(90deg,#000 80%,transparent)}
}


/* ======================================================================
   Moteur v4 theme: black, neutral bone + ONE ice-blue family (traffic = low-chroma step)
   (gold = value: CTA, booked, results, active, focus; --traffic = noise)
   ====================================================================== */
body{background:var(--black) radial-gradient(90rem 50rem at 80% -10%,rgba(244,244,242,.035),transparent 60%) no-repeat}
::selection{background:var(--accent);color:var(--on-accent)}


.site-header.is-condensed .header-bar,.mega,.leadfeed,.sim,.dialog,.cookie-banner{background:var(--glass);-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%)}
.page-hero-bloom{filter:saturate(1.2);opacity:.35}
/* law panel: dark glass with a cold edge instead of the light panel */
.law{background:linear-gradient(110deg,rgba(201,204,209,.06),rgba(22,23,25,.55) 55%,rgba(14,15,16,.6));color:var(--bone);border:1px solid rgba(244,244,242,.18)}
.law .lead,.law-facts dd,.law-src{color:var(--grey)}
.law-date{color:var(--traffic)}
.law-date span{color:var(--gold)}
.law .btn--primary{background:var(--action);color:var(--on-action)}
.law .btn--primary:hover{background:var(--action-hover);color:var(--on-action)}
.law :focus-visible{--focus:var(--gold-hi)}
.law a{color:var(--bone)}
/* strike lines use the cold "vanity" colour */
.swap s::after{background:var(--traffic)}
.swap-to{color:var(--bone)}
.case-figure,.stat dd{color:var(--gold-hi)}

.logo-mark{display:none}

/* ---------- certifications & partner badges (text badges) ---------- */
.certs{display:flex;flex-wrap:wrap;gap:var(--s-3);list-style:none;padding:0}
.cert{display:inline-flex;flex-direction:column;justify-content:center;gap:.15rem;min-height:3.5rem;padding:.55rem 1rem;border:1px solid var(--line);border-radius:var(--r-md);background:var(--glass)}
.cert b{font:600 var(--fs-sm)/1.2 var(--font-head);color:var(--bone)}
.cert span{font-size:var(--fs-xs);color:var(--grey)}
.cert::before{content:"";width:.45rem;height:.45rem;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent);margin-bottom:.2rem}
/* text wordmarks for clients without a logo file */
.logo-text{font:700 clamp(1.4rem,2.2vw,1.9rem)/1 var(--font-head);letter-spacing:-.03em;color:var(--bone);opacity:.85}

/* revision 3: ice-only accents, mono micro-labels */
.micro{font-family:var(--font-mono);font-size:.75rem;letter-spacing:.01em}
.btn--primary{color:#000000}
.cert::before{display:none}
.cert{flex-direction:row;align-items:center;gap:.8rem}
.cert svg{width:1.6rem;height:1.6rem;flex:none;fill:var(--bone)}
.cert-txt{display:grid;gap:.1rem}
/* ---------- header (Interface v3): glass bar, dropdown, quick search ---------- */
.hdr{position:fixed;z-index:60;top:14px;left:50%;transform:translateX(-50%);width:min(calc(100% - 2*var(--gutter)),1180px);display:flex;align-items:center;gap:.5rem;padding:8px 8px 8px 18px;border-radius:999px;background:rgba(14,15,16,.6);border:1px solid var(--line);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);transition:background .3s;contain:layout}
.hdr.tight{width:min(calc(100% - 2*var(--gutter)),1000px);background:rgba(14,15,16,.82)}
.hdr .logo{margin-right:auto;min-height:44px;display:flex;align-items:center;text-decoration:none;color:var(--bone)}
.hnav{display:flex;align-items:center;gap:2px}
.hnav>a,.hnav .dd>button,.hnav .dd>.nav-nojs{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border-radius:999px;text-decoration:none;font:500 .9375rem/1 var(--font-head);color:#DCDDE0;background:none;border:0;cursor:pointer}
.hnav>a:hover,.hnav .dd>button:hover,.hnav .dd>button[aria-expanded=true],.hnav>a[aria-current=page],.hnav .dd>button[aria-current=true]{background:rgba(244,244,242,.08);color:var(--bone)}
.js .hnav .dd>.nav-nojs{display:none}
.dd{position:relative}
.dd svg{width:12px;height:12px;transition:transform .25s}
.dd button[aria-expanded=true] svg{transform:rotate(180deg)}
.hmega{position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-38%);width:min(760px,90vw);display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:10px;border-radius:16px;background:var(--surface);border:1px solid rgba(244,244,242,.16);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);box-shadow:0 30px 80px -20px #000}
.hmega[hidden]{display:none}
.hmega a{display:block;padding:14px;border-radius:10px;text-decoration:none;color:var(--bone)}
.hmega a:hover,.hmega a:focus-visible,.hmega a[aria-current=page]{background:rgba(244,244,242,.08)}
.hmega .micro{color:var(--traffic)}
.hmega strong{display:block;font:600 1rem/1.25 var(--font-head);margin:.25rem 0 .15rem}
.hmega small{display:block;color:var(--grey);font-size:var(--fs-xs);line-height:1.4}
.hmega .all{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);border-radius:0 0 10px 10px;margin-top:4px}
.goto{white-space:nowrap;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 10px 0 14px;border-radius:999px;background:rgba(14,15,16,.5);border:1px solid var(--line);color:var(--bone);cursor:pointer;font:500 .9375rem/1 var(--font-head)}
.goto:hover{border-color:rgba(212,255,58,.55)}
.goto svg{width:16px;height:16px;color:var(--traffic)}
kbd{font:400 10px/1 var(--font-mono);padding:4px 6px;border-radius:5px;border:1px solid rgba(244,244,242,.22);color:var(--grey);background:rgba(0,0,0,.4)}
.hdr .header-cta{min-height:44px;display:inline-flex}
/* language menu (header) + language links (footer) */
.lang{position:relative}
.lang summary{list-style:none;display:inline-flex;align-items:center;gap:6px;min-height:44px;min-width:44px;padding:0 12px;border-radius:999px;background:rgba(14,15,16,.5);border:1px solid var(--line);color:var(--bone);cursor:pointer;font:500 .875rem/1 var(--font-head);letter-spacing:.02em}
.lang summary::-webkit-details-marker{display:none}
.lang summary:hover,.lang[open] summary{border-color:rgba(212,255,58,.55)}
.lang summary svg{width:16px;height:16px;color:var(--traffic)}
.lang-list{position:absolute;right:0;top:calc(100% + 10px);min-width:170px;display:grid;gap:2px;padding:6px;border-radius:14px;background:rgba(14,15,16,.94);border:1px solid rgba(244,244,242,.16);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);box-shadow:0 30px 80px -20px #000}
.lang-list a{display:flex;align-items:center;min-height:44px;padding:0 12px;border-radius:9px;color:var(--bone);text-decoration:none;font:500 .9375rem/1 var(--font-head)}
.lang-list a:hover,.lang-list a:focus-visible{background:rgba(244,244,242,.08)}
.lang-list a[aria-current]{font-weight:600;color:var(--bone)}
.lang-list a[aria-current]::after{content:"✓";margin-left:auto;padding-left:12px}
.ft-lang{display:flex;flex-wrap:wrap;gap:4px 18px;width:100%;margin-top:12px}
.ft-lang a{display:inline-flex;align-items:center;min-height:44px;color:var(--grey);text-decoration:none}
.ft-lang a:hover,.ft-lang a:focus-visible{color:var(--bone);text-decoration:underline}
.ft-lang a[aria-current]{color:var(--bone)}
.js .hdr .menu-nojs{display:none}
.hdr .menu-nojs{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;color:var(--bone)}
@media (max-width:1060px){.hnav{display:none}}
@media (max-width:560px){.lang summary{padding:0 10px}.lang-code{display:none}.lang summary{width:44px;justify-content:center;padding:0}.hdr{padding:6px 6px 6px 14px;top:10px}.goto .lbl,.goto kbd{display:none}.goto{padding:0;width:44px;justify-content:center}.hdr .header-cta{padding-inline:12px;font-size:.8125rem;white-space:nowrap}}
/* very small phones (≤ 360 px): search and language icons give way so the German / Spanish CTA stays on one line
   inside the header (languages stay in the footer row) */
@media (max-width:360px){.hdr .goto,.hdr .lang{display:none}.hdr .logo-word{height:.85rem}}
main > :first-child.page-hero,main > .page-hero:first-child{padding-top:calc(var(--header-h) + 3rem)}

/* quick-search palette */
.pal{position:fixed;inset:0;z-index:120;display:flex;align-items:flex-start;justify-content:center;padding:12vh 16px 16px;background:rgba(0,0,0,.6);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.pal[hidden]{display:none}
.pal-box{width:min(640px,100%);max-height:76vh;display:flex;flex-direction:column;background:rgba(14,15,16,.96);border:1px solid rgba(244,244,242,.16);border-radius:16px;overflow:hidden;box-shadow:0 40px 120px -20px #000}
.pal-in{display:flex;align-items:center;gap:12px;padding:10px 10px 10px 16px;border-bottom:1px solid var(--line)}
.pal-in svg{width:18px;height:18px;color:var(--traffic);flex:none}
.pal-in input{flex:1;background:none;border:0;color:var(--bone);font:500 1.125rem var(--font-head);min-height:44px;outline:none}
.pal-in input::placeholder{color:var(--grey)}
.pal-list{overflow:auto;padding:8px;margin:0;list-style:none}
.pal-list .grp{padding:12px 10px 6px;color:var(--traffic);font:400 11px/1 var(--font-mono)}
.pal-list [role=option]{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;min-height:44px;text-decoration:none;color:var(--bone)}
.pal-list [role=option][aria-selected=true]{background:rgba(212,255,58,.1);box-shadow:inset 2px 0 0 var(--accent)}
.pal-list .ic{width:28px;height:28px;border-radius:8px;border:1px solid var(--line);display:grid;place-items:center;color:var(--traffic);font:400 10px/1 var(--font-mono);flex:none}
.pal-list .gold .ic{background:var(--gold);color:#000000;border-color:var(--gold)}
.pal-empty{padding:20px 16px;color:var(--grey)}
.pal-foot{display:flex;gap:16px;padding:10px 16px;border-top:1px solid var(--line);color:var(--grey);font:400 10px/1 var(--font-mono);margin:0}

/* booking pop-up (Calendly loads on click) */
.bookdlg{width:min(1000px,calc(100vw - 24px));height:min(860px,calc(100svh - 24px));max-width:none;max-height:none;padding:0;border:1px solid rgba(244,244,242,.16);border-radius:16px;background:#0E0F10;color:var(--bone);overflow:hidden;box-shadow:0 40px 140px -20px #000}
.bookdlg[open]{display:flex;flex-direction:column}
.bookdlg::backdrop{background:rgba(0,0,0,.72);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.bookdlg-head{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 14px 12px 22px;border-bottom:1px solid var(--line)}
.bookdlg-head .micro{color:var(--traffic)}
.bookdlg-head h2{margin:.25rem 0 0}
.bookdlg-frame{flex:1;position:relative;background:#0E0F10}
.bookdlg-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.bookdlg-frame::before{content:"Chargement du calendrier…";position:absolute;inset:0;display:grid;place-items:center;color:var(--grey);font:400 12px var(--font-mono)}
.bookdlg-note{padding:10px 22px;border-top:1px solid var(--line);font-size:var(--fs-xs);color:var(--grey);margin:0}
.bookdlg-note a{color:var(--bone)}
.bookdlg{margin:auto}
.offices .soon{color:var(--grey)}.offices .soon::before{background:transparent;border:1px solid var(--grey);box-shadow:none}

/* revision 5 (client 2026-10-07): Moteur v3 colours — (superseded by Moteur v4 single ice family) */
.pal-list .gold .ic{color:#000000}

/* ==========================================================================
   Polish 2 effects (app.js adds every class below; without JS nothing is hidden).
   Tune: reveal distance/duration here, stagger/selectors in app.js FX.
   ========================================================================== */
/* scroll reveal: fade + 12px rise, < 400 ms */
.rv{opacity:0;transform:translate3d(0,12px,0)}
.rv.rv-in{opacity:1;transform:none;transition:opacity .36s var(--ease),transform .36s var(--ease);transition-delay:var(--rv-d,0ms)}
@media (prefers-reduced-motion:reduce){.rv{opacity:1!important;transform:none!important;transition:none!important}}
@media print{.rv{opacity:1!important;transform:none!important}}

/* page transitions: fade in on load (html.js is set inline in <head>), fade out on internal link click */
@media (prefers-reduced-motion:no-preference){
  .js body{animation:bx-page-in .32s var(--ease) backwards}
  html.is-leaving body{opacity:0;transition:opacity .08s ease-in}
}
@keyframes bx-page-in{from{opacity:.01}to{opacity:1}} /* .01, not 0: the first frame still counts as contentful paint */

/* cursor glow: soft ice light, desktop + fine pointer only */
.cursor-glow{position:fixed;left:0;top:0;z-index:55;width:var(--glow,560px);height:var(--glow,560px);border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(244,244,242,.06),rgba(142,145,150,.03) 45%,transparent 72%);
  mix-blend-mode:screen;opacity:0;transition:opacity .4s ease;will-change:transform}
.cursor-glow.is-on{opacity:1}
@media (prefers-reduced-motion:reduce),(hover:none),(pointer:coarse){.cursor-glow{display:none}}

/* mobile sticky booking bar */
.mbar{display:none}
@media (max-width:820px){
  .mbar{display:flex;position:fixed;z-index:65;left:0;right:0;bottom:0;gap:10px;align-items:center;
    height:calc(56px + env(safe-area-inset-bottom));padding:6px max(12px,env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
    background:rgba(14,15,16,.72);border-top:1px solid var(--line);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);
    transform:translate3d(0,110%,0);visibility:hidden;transition:transform .3s var(--ease),visibility 0s linear .3s}
  .mbar.is-on{transform:none;visibility:visible;transition:transform .3s var(--ease),visibility 0s}
  .mbar-cta{flex:1;min-height:44px;padding-block:.5rem;font-size:var(--fs-sm)}
  .mbar-wa{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:999px;border:1px solid rgba(244,244,242,.35);color:var(--bone)}
  .mbar-wa svg{width:20px;height:20px}
  .mbar-wa:hover{background:var(--bone);color:var(--black)}
  body.has-mbar{padding-bottom:calc(56px + env(safe-area-inset-bottom))}
}
@media (prefers-reduced-motion:reduce){.mbar{transition:none!important}}
.case-figure,.h-metric,.stat dd,.law-facts dt{font-variant-numeric:tabular-nums}

/* footer: see strip.css (redesign, audit round 8) */

/* Moteur v4: photos toned to the single ice family */
:not(body).svc-media img,.case-media img,.svc-detail-media img{filter:var(--photo-tone)}

/* ==== Hero motif mount (round 10). Drawing, sizing and bloom swap = designer's motifs.css / motifs.js; this is only the fallback box.
 Desktop: beside the text on the right (where the contact bloom sits); phones: faint, behind the top of the hero. ==== */
.hero-motif{position:absolute;z-index:0;pointer-events:none;width:min(46vw,40rem);aspect-ratio:1;
  right:max(-4vw,-3rem);top:calc(var(--header-h) - 1rem)}
@media (max-width:40rem){ .hero-motif{width:100vw;right:-30vw;top:calc(var(--header-h) + 1rem)} }

/* ---------- audit fixes ---------- */
/* floating header: anchors and focused elements land below it (bottom padding is set by app.js for the mobile bar) */
html{scroll-padding-top:calc(var(--header-h) + 1.5rem)}
/* 320px / 400% zoom: buttons wrap instead of being cut off */
@media (max-width:30rem){ .btn,.sim-out .btn{white-space:normal;text-align:center} }
/* contact 'Suivez-nous': the round icons must not inherit the contact-list two-column grid */
.contact-list .ft-social .soc{grid-template-columns:none;gap:0;padding:0;align-items:center}
/* booking dialog: second close control after the Calendly frame (Tab out of the iframe lands here) */
.bookdlg-close2{align-self:center;margin:8px auto;min-height:44px;padding:0 18px;border:1px solid var(--line);border-radius:var(--r-pill);background:none;color:var(--bone);font:500 .875rem/1 var(--font-head);cursor:pointer}
.bookdlg-close2:hover,.bookdlg-close2:focus-visible{border-color:var(--bone)}