/* ============================================================
   flower.tech - company site - "The Shop's Day" on the Paris Vitrine system
   Lacquer navy + enamel white, Bodoni Moda display + Archivo text,
   the petal gradient as the one signal per section.
   Hyphens, never dashes, in authored copy.
   ============================================================ */

@property --screw { syntax: '<angle>'; inherits: true; initial-value: 45deg; }

:root{
  --lacquer:#02193C; --lacquer-deep:#001430; --lacquer-hi:#0A2C5E;
  --enamel:#F3F4F7; --enamel-2:#FBFBFD;
  --ink:#0B1233; --ink-2:#2E3A66; --ink-3:#4E5878; --line:#CFD3E0;
  --mag:#E93F85; --vio:#7911F0; --blu:#2952FD; --azu:#4082F6;
  --grad:linear-gradient(90deg,var(--mag) 0%,var(--vio) 38%,var(--blu) 70%,var(--azu) 100%);
  --lacquer-field:linear-gradient(180deg,var(--lacquer-hi) 0%,var(--lacquer) 18%,var(--lacquer) 82%,var(--lacquer-deep) 100%);
  --sheen:linear-gradient(115deg,rgba(255,255,255,.07) 0%,rgba(255,255,255,0) 38%,rgba(255,255,255,0) 62%,rgba(255,255,255,.04) 100%);
  --slats:url(../img/shutter-slat.png) 0 0/512px 20px repeat;
  --shutter-field:linear-gradient(180deg,#050F1D 0%,#050F1D 58%,#0E1E34 80%,#1C2E47 100%);
  --serif:'Bodoni Moda','Didot','Bodoni 72',Georgia,serif;
  --sans:'Archivo','Helvetica Neue',Arial,sans-serif;
  --wrap:1240px; --gut:clamp(16px,4vw,48px);
  --nav-h:72px; --awn-h:92px; --sill-h:18px; --pave-h:58px;
  --pil:max(clamp(24px,6vw,96px),calc((100vw - 1760px) / 2));
  --shut:clamp(196px,28svh,300px);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --t-enamel-wall:0 1px 0 rgba(8,18,53,.06),0 8px 20px rgba(8,18,53,.10);
  --t-lacquer-wall:0 2px 0 rgba(0,0,0,.25),0 14px 30px rgba(0,0,0,.38);
}

*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 12px);background:var(--lacquer-deep);scrollbar-color:var(--ink-3) var(--lacquer-deep)}
body{font-family:var(--sans);font-size:17px;line-height:1.5;color:var(--ink);background:var(--enamel);font-variant-numeric:tabular-nums;overflow-x:hidden}
::selection{background:var(--vio);color:#fff}
img,svg{display:block;max-width:100%}
a{color:inherit;text-underline-offset:.2em;text-decoration-thickness:1.5px}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--vio);outline-offset:3px;border-radius:4px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:12px;top:-60px;z-index:100;background:var(--enamel-2);color:var(--ink);padding:10px 16px;border-radius:6px;font-weight:700;border:1.3px solid var(--ink)}
.skip:focus{top:12px}
.wrap{max-width:calc(var(--wrap) + 2 * var(--gut));margin:0 auto;padding:0 var(--gut)}
.ic{width:16px;height:16px;flex:0 0 auto}

/* ---------- wordmark (Bodoni + logo petal in place of the dot) ---------- */
.wm{font-family:var(--serif);font-variation-settings:'opsz' 14,'wght' 560;font-size:34px;line-height:1;white-space:nowrap;color:var(--enamel);letter-spacing:.002em;text-decoration:none;display:inline-flex;align-items:baseline}
.wm .petal{display:inline-block;height:.329em;width:.2075em;margin:0 .05em -.012em .04em;overflow:visible}
.wm--xl{font-size:clamp(48px,6vw,76px)}

/* ---------- type ---------- */
.h2{font-family:var(--serif);font-weight:800;font-variation-settings:'opsz' 14;font-size:clamp(34px,4.3vw,60px);line-height:1.04;letter-spacing:-.012em;color:var(--ink);max-width:25ch;text-wrap:balance}
.h2 em{font-style:italic;font-weight:720}
.h3{font-family:var(--sans);font-weight:700;font-size:20px;line-height:1.2;letter-spacing:-.005em}
.lede{font-size:clamp(17px,1.35vw,19px);line-height:1.5;color:var(--ink-2);max-width:64ch;margin-top:18px;text-wrap:pretty}
.src{font-size:12.5px;line-height:1.5;color:var(--ink-3);max-width:96ch;margin-top:22px}
.small{font-size:13px;color:var(--ink-3);margin-top:12px}
.num{font-family:var(--serif);font-weight:800;font-variation-settings:'opsz' 14;font-variant-numeric:lining-nums tabular-nums;font-size:clamp(34px,3.2vw,46px);line-height:1;letter-spacing:-.005em;color:var(--ink);display:block}
.num small{font-family:var(--sans);font-weight:700;font-size:.4em;color:var(--ink-3);letter-spacing:0;margin-left:.08em}
.num--sans{font-family:var(--sans);font-weight:800;letter-spacing:-.02em}
.num--word{font-style:italic;font-weight:720}
.op{font-family:var(--sans);font-weight:600;font-size:.8em;margin:0 .06em;position:relative;top:-.06em}

/* ---------- sections and grounds ---------- */
.sec{position:relative;padding:clamp(88px,10vw,148px) 0 clamp(72px,8.5vw,120px)}
.sec--enamel{background:var(--enamel)}
/* enamel sections hang under the awning valance, like the deck's light slides */
.sec--enamel::before{content:"";position:absolute;top:0;left:0;right:0;height:46px;background:url(../img/awning.png) 0 0/auto 100% repeat-x;filter:drop-shadow(0 5px 5px rgba(8,18,53,.22));pointer-events:none}
.front + .sec--enamel::before{display:none}
.front + .sec--enamel{box-shadow:inset 0 14px 16px -12px rgba(8,18,53,.28)}
.sec--lacquer,.sec--night{background:var(--lacquer-field);color:var(--enamel)}
.sec--lacquer::before,.sec--night::before{content:"";position:absolute;inset:0;background:var(--sheen);pointer-events:none}
.sec--lacquer::after{content:"";position:absolute;inset:14px;border:1.5px solid rgba(233,236,243,.42);border-radius:3px;pointer-events:none}
/* after hours: the shutter is down, its slats run behind the company sections */
.after{position:relative;background:linear-gradient(180deg,rgba(2,25,60,.8) 0%,rgba(2,23,54,.88) 100%),var(--slats),#07111F}
.sec--night{background:transparent}
.sec--night::before{display:none}
.sec--night::after{content:"";position:absolute;left:14px;right:14px;top:0;bottom:0;border-left:1.5px solid rgba(233,236,243,.26);border-right:1.5px solid rgba(233,236,243,.26);pointer-events:none}
.sec--night + .sec--night{padding-top:0}
.traction.sec--night::after{border:0;background:linear-gradient(180deg,rgba(233,236,243,0),rgba(233,236,243,.26) 220px) 0 0/1.5px 100% no-repeat,linear-gradient(180deg,rgba(233,236,243,0),rgba(233,236,243,.26) 220px) 100% 0/1.5px 100% no-repeat}
.sec--night + .sec--night > .wrap::before{content:"";display:block;height:1.5px;background:linear-gradient(90deg,rgba(233,236,243,0),rgba(233,236,243,.28) 12%,rgba(233,236,243,.28) 88%,rgba(233,236,243,0));margin-bottom:clamp(64px,7vw,104px)}
.sec--lacquer .h2,.sec--night .h2{color:var(--enamel);font-weight:720}
.sec--lacquer .h2 em,.sec--night .h2 em{font-weight:640}
.sec--lacquer .lede,.sec--night .lede{color:rgba(243,244,247,.84)}
.sec--lacquer .src,.sec--night .src{color:rgba(243,244,247,.62)}
.sec--lacquer .small,.sec--night .small{color:rgba(243,244,247,.62)}
.sec > .wrap{position:relative;z-index:1}

/* ---------- fittings ---------- */
.plaque{position:relative;background:var(--enamel-2);color:var(--ink);border:1.3px solid var(--ink);border-radius:9px;box-shadow:inset 0 0 0 3px var(--enamel-2),var(--t-enamel-wall)}
.sec--lacquer .plaque,.sec--night .plaque,.front .plaque{box-shadow:inset 0 0 0 3px var(--enamel-2),var(--t-lacquer-wall)}
.plaque--soft{background:var(--enamel);border-color:var(--line);box-shadow:none}
.screws::before,.screws::after{content:"";position:absolute;top:9px;width:7px;height:7px;border-radius:50%;
  background:linear-gradient(var(--screw),transparent 42%,rgba(40,48,80,.72) 43% 57%,transparent 58%),radial-gradient(circle at 35% 35%,#fff 0,#bfc4d3 45%,#6a7394 100%);
  box-shadow:0 .5px 0 rgba(255,255,255,.8);transition:--screw .6s var(--ease-out)}
.screws::before{left:9px}.screws::after{right:9px}
.panel{position:relative;background:var(--lacquer-field);color:var(--enamel);border-radius:10px;padding:24px 26px;box-shadow:0 12px 28px rgba(8,18,53,.26)}
.panel::after{content:"";position:absolute;inset:8px;border:1.2px solid rgba(233,236,243,.5);border-radius:5px;pointer-events:none}
.panel h3{font-family:var(--sans);font-weight:700;font-size:18px;color:var(--enamel);margin-bottom:10px}
.panel p{font-size:15px;line-height:1.5;color:rgba(243,244,247,.86)}
.panel--line{background:rgba(243,244,247,.05);box-shadow:none;border:1.5px solid rgba(233,236,243,.5)}
.panel--line::after{display:none}

.tag{display:inline-flex;align-items:center;gap:7px;font-family:var(--sans);font-weight:700;font-size:13px;letter-spacing:.03em;padding:6px 12px;border-radius:6px;white-space:nowrap;text-decoration:none;line-height:1.2}
.tag--signal{background:var(--grad);color:#fff}
.tag--ghost{border:1.5px solid currentColor}
.sec--lacquer .tag--ghost,.sec--night .tag--ghost{color:var(--enamel);border-color:rgba(243,244,247,.6)}
a.tag--ghost:hover{background:rgba(243,244,247,.1)}
.tag--enamel{background:var(--enamel-2);color:var(--ink);border:1.3px solid var(--ink)}
.tag--ill{position:absolute;top:12px;left:12px;z-index:3;font-size:11px;padding:3px 8px;letter-spacing:.06em;text-transform:lowercase}

.stamp{display:inline-flex;align-items:center;font-family:var(--sans);font-weight:700;font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:4px 9px;border-radius:5px;border:1.5px solid var(--ink);white-space:nowrap;line-height:1.2}
.stamp--live{background:var(--grad);color:#fff;border-color:transparent}
.stamp--debug{background:var(--enamel-2);color:var(--ink)}
.stamp--plan{background:transparent;color:var(--ink-3);border-color:var(--line)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--sans);font-weight:700;font-size:16px;letter-spacing:.005em;line-height:1;padding:15px 24px;border-radius:8px;text-decoration:none;white-space:nowrap;transition:background-color .25s,color .25s,box-shadow .25s}
.btn .ic{transition:transform .35s var(--ease-out)}
.btn:hover .ic{transform:translateX(3px)}
.btn--signal{background:var(--grad);color:#fff;box-shadow:0 8px 20px rgba(8,18,53,.22)}
.btn--signal:hover{background:linear-gradient(0deg,rgba(0,0,0,.12),rgba(0,0,0,.12)),var(--grad)}
.btn--ring{color:var(--enamel);font-weight:600;font-size:15px;padding:12px 18px;border:2px solid transparent;border-radius:8px;background:linear-gradient(var(--lacquer),var(--lacquer)) padding-box,var(--grad) border-box}
.btn--ring:hover{background:linear-gradient(var(--lacquer-hi),var(--lacquer-hi)) padding-box,var(--grad) border-box}
.btn--enamel{background:var(--enamel-2);color:var(--ink);box-shadow:inset 0 0 0 1.3px var(--ink),inset 0 0 0 3.5px var(--enamel-2)}
.btn--enamel:hover{background:#fff}
.btn--line{color:var(--enamel);box-shadow:inset 0 0 0 1.5px rgba(243,244,247,.6)}
.btn--line:hover{background:rgba(243,244,247,.08)}

/* lists */
.xlist,.ticks,.notes,.ladder{list-style:none}
.xlist{display:grid;gap:12px;margin-top:26px}
.xlist li,.ticks li{display:grid;grid-template-columns:24px 1fr;gap:12px;align-items:start;font-size:16px;line-height:1.45;color:var(--ink-2)}
.xlist b,.ticks b{color:var(--ink)}
.x,.tk{width:24px;height:24px;border-radius:5px;display:grid;place-items:center;color:#fff;margin-top:.5px}
.x{background:var(--mag)}
.x .ic{width:14px;height:14px}
.tk{background:var(--ink);font-weight:700;font-size:12.5px;font-variant-numeric:lining-nums}
.ticks{display:grid;gap:12px}
.ticks--inv li{color:rgba(243,244,247,.86)} .ticks--inv b{color:var(--enamel)}
.ticks--inv .tk{background:var(--enamel);color:var(--ink)}

/* stats */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:30px}
.stat.plaque{padding:22px 20px 18px}
.stat > span{display:block;margin-top:10px;font-size:14px;line-height:1.4;color:var(--ink-2)}
.stat--accent .num::after{content:"";display:block;width:56px;height:5px;border-radius:3px;background:var(--grad);margin-top:10px}

/* photographs behind glass */
.photo{position:relative;border-radius:10px;overflow:hidden;background:var(--lacquer-deep);box-shadow:var(--t-enamel-wall)}
.photo img{width:100%;height:100%;object-fit:cover}
.glass__sheen{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(112deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,0) 32%),linear-gradient(112deg,rgba(255,255,255,0) 62%,rgba(255,255,255,.05) 70%,rgba(255,255,255,0) 78%);transform:translate3d(var(--gx,0),0,0);transition:transform .9s var(--ease-out)}

/* ============================================================
   NAV - the fascia band
   ============================================================ */
.nav{position:fixed;top:0;left:0;right:0;z-index:60;height:var(--nav-h);background:linear-gradient(180deg,#07234C 0%,var(--lacquer) 60%,#011635 100%);border-bottom:1px solid rgba(233,236,243,.14);transition:box-shadow .3s}
.nav.is-scrolled{box-shadow:0 10px 26px rgba(0,8,25,.35)}
.nav__in{height:100%;max-width:calc(1440px + 2 * var(--gut));margin:0 auto;padding:0 var(--gut);display:flex;align-items:center;gap:clamp(16px,2.6vw,40px)}
.nav .wm{margin-right:auto;font-size:clamp(28px,2.6vw,38px)}
.nav__links{display:flex;gap:clamp(18px,2.4vw,38px)}
.nav__links a{color:rgba(243,244,247,.9);text-decoration:none;font-size:16px;font-weight:500;padding:6px 0;background:linear-gradient(var(--enamel),var(--enamel)) 0 100%/0 1.5px no-repeat;transition:background-size .35s var(--ease-out)}
.nav__links a:hover{background-size:100% 1.5px}
.lang{display:flex;align-items:center;gap:4px;font-size:14px;color:rgba(243,244,247,.5)}
.lang button{padding:6px 4px;font-weight:600;color:rgba(243,244,247,.6);letter-spacing:.04em}
.lang button[aria-pressed="true"]{color:var(--enamel)}
.nav__menu{display:none;width:40px;height:40px;position:relative}
.nav__menu i{position:absolute;left:9px;right:9px;height:2px;background:var(--enamel);border-radius:2px;transition:transform .3s var(--ease-out)}
.nav__menu i:nth-of-type(1){top:15px}.nav__menu i:nth-of-type(2){top:23px}
.nav__menu[aria-expanded="true"] i:nth-of-type(1){transform:translateY(4px) rotate(45deg)}
.nav__menu[aria-expanded="true"] i:nth-of-type(2){transform:translateY(-4px) rotate(-45deg)}
.sheet{position:absolute;top:100%;left:0;right:0;background:var(--lacquer-field);padding:18px var(--gut) 26px;display:grid;gap:4px;border-bottom:1px solid rgba(233,236,243,.18);box-shadow:0 20px 40px rgba(0,8,25,.45)}
.sheet[hidden]{display:none}
.sheet a:not(.btn){color:var(--enamel);text-decoration:none;font-family:var(--serif);font-weight:700;font-variation-settings:'opsz' 14;font-size:28px;padding:8px 0;border-bottom:1px solid rgba(233,236,243,.14)}
.sheet .btn{margin-top:16px}

/* ============================================================
   08:02 - THE SHOPFRONT
   ============================================================ */
.front{position:relative;height:100svh;min-height:640px;max-height:1120px;display:grid;grid-template-rows:var(--nav-h) var(--awn-h) 1fr var(--sill-h) var(--pave-h);background:var(--lacquer-deep);overflow:hidden;isolation:isolate}
.front .awning{grid-row:2;position:relative;z-index:4;background:url(../img/awning.png) 0 0/auto 100% repeat-x;filter:drop-shadow(0 7px 8px rgba(0,6,22,.55))}
.front .awning::before{content:"";position:absolute;left:0;right:0;top:-1px;height:10px;background:linear-gradient(180deg,#011635,rgba(1,22,53,0))}
.facade{grid-row:3;display:grid;grid-template-columns:var(--pil) 1fr var(--pil);min-height:0;position:relative;z-index:1;margin-top:calc(var(--awn-h) * -.3)}
.pilaster{position:relative;background:linear-gradient(90deg,rgba(0,0,0,.34) 0%,rgba(255,255,255,.035) 30%,rgba(0,0,0,0) 62%,rgba(0,0,0,.34) 100%),linear-gradient(180deg,#223756 0%,#1B2E4A 16%,#192B45 84%,#0F1F35 100%);box-shadow:inset -1px 0 0 rgba(255,255,255,.05)}
.pilaster i{position:absolute;left:18%;right:18%;border-radius:3px;background:linear-gradient(180deg,#14263F,#102038);border:1.5px solid rgba(233,236,243,.86);box-shadow:inset 1px 1px 0 rgba(255,255,255,.1),inset -1px -1px 0 rgba(0,0,0,.4),inset 0 0 0 6px rgba(0,8,24,.18),0 0 0 4px rgba(0,8,24,.22),0 0 0 5px rgba(255,255,255,.06)}
.pilaster i:first-child{top:calc(var(--awn-h) * .3 + 22px);bottom:40%}
.pilaster i:last-child{top:calc(60% + 16px);bottom:18px}
.pilaster--l::after,.pilaster--r::after{content:"";position:absolute;top:0;bottom:0;width:9px;background:linear-gradient(90deg,#030915,#1C2E48 50%,#030915)}
.pilaster--l::after{right:0}.pilaster--r::after{left:0}
.bay{position:relative;overflow:hidden;background:#00081A}
.bay::after{content:"";position:absolute;left:0;right:0;top:0;height:34px;z-index:3;background:linear-gradient(180deg,rgba(0,4,16,.75),rgba(0,4,16,0));pointer-events:none}

.window{position:absolute;left:0;right:0;bottom:0;height:calc(100% - var(--shut));padding:12px 12px 0;background:linear-gradient(180deg,#2A4467 0%,#1E3452 12%,#1C3150 88%,#12233B 100%)}
.glass{position:relative;height:100%;border-radius:3px 3px 0 0;overflow:hidden;background:#1a1410;box-shadow:inset 0 0 0 1.5px rgba(233,236,243,.5),0 0 0 2px #0B1626}
.win-svg{position:absolute;inset:0;width:100%;height:100%}
.win-g{transform-box:view-box}
.bx__f,.lx__f{fill:none;stroke:url(#g-frame);stroke-width:4;stroke-linejoin:round;stroke-dasharray:100 100;stroke-dashoffset:0}
.bx__t rect,.lx__t rect{fill:url(#g-frame)}
.bx__t text,.lx__t text{fill:#fff;font-family:var(--sans);font-weight:700;font-size:23px;text-anchor:middle;letter-spacing:.02em;font-variant-numeric:lining-nums tabular-nums}
.lx__t text{font-size:27px}
.lx__f{stroke-width:5}

.clock{position:absolute;z-index:4;top:26px;right:26px;padding:15px 26px 17px;text-align:center;transform-origin:50% -40px}
.clock__t{display:block;font-family:var(--sans);font-weight:700;font-size:clamp(28px,2.6vw,40px);line-height:1;letter-spacing:-.01em;font-variant-numeric:lining-nums tabular-nums;color:var(--ink)}
.clock__l{display:block;margin-top:6px;font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.doors{position:absolute;z-index:4;left:max(26px,calc(min(56svh,500px) * .3 - var(--pil)));bottom:26px;display:flex;gap:14px;flex-wrap:wrap}
.door{display:inline-block;padding:15px 28px 14px;font-size:clamp(16px,1.35vw,20px);font-weight:600;color:var(--ink);text-decoration:none;letter-spacing:-.005em;transition:filter .25s}
.door:hover{filter:brightness(1.04) contrast(1.02)}
/* hero signage: domed enamel sign, dark metal rim, navy inner rule, four screws */
.plaque.sign{background:radial-gradient(130% 110% at 50% 0%,#FFFFFF 0%,#F7F8FB 55%,#E6E9F0 100%);border:2px solid #141C31;border-radius:10px;box-shadow:inset 0 0 0 4px #FBFBFD,inset 0 0 0 5.4px #0B1233,inset 0 7px 6px -2px rgba(255,255,255,.7),inset 0 -6px 10px rgba(8,18,53,.14),0 1px 0 rgba(255,255,255,.16),0 12px 24px rgba(0,0,0,.42)}
.sign::before{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;--sc:radial-gradient(circle,#fff 0 .8px,#c7ccd9 1.5px,#6a7394 3px,rgba(0,0,0,.35) 3.4px,transparent 3.8px);background:var(--sc) 7px 7px/8px 8px no-repeat,var(--sc) calc(100% - 7px) 7px/8px 8px no-repeat,var(--sc) 7px calc(100% - 7px)/8px 8px no-repeat,var(--sc) calc(100% - 7px) calc(100% - 7px)/8px 8px no-repeat}
.front .tag--ill{top:auto;bottom:14px;left:auto;right:14px}

.shutter{position:absolute;left:0;right:0;top:0;height:100%;z-index:2;transform:translateY(calc(-100% + var(--shut)));will-change:transform}
.shutter__face{position:absolute;inset:0 0 18px;background:var(--sheen),var(--slats),var(--shutter-field)}
.shutter__band{position:absolute;left:0;right:0;bottom:0;height:calc(var(--shut) - 18px);padding:calc(var(--awn-h) * .3 + 16px) 4% 0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;z-index:1}
.shutter__face::after{content:"";position:absolute;inset:0;z-index:2;background:var(--slats);opacity:.55;pointer-events:none}
.shutter__title{font-family:var(--serif);font-weight:640;font-variation-settings:'opsz' 28;font-size:min(8.1vw,13.2svh,150px);line-height:.98;letter-spacing:-.032em;color:var(--enamel);white-space:nowrap;text-shadow:0 2px 0 rgba(0,6,22,.45)}
:lang(fr) .shutter__title{font-size:min(5.3vw,11svh,100px)}
:lang(fr) .doors{flex-direction:column;align-items:flex-start;gap:10px}
.shutter__sub{margin-top:min(2.2svh,20px);font-size:clamp(17px,1.9vw,28px);font-weight:500;color:rgba(243,244,247,.9);letter-spacing:-.003em;text-wrap:balance}
.shutter__rail{position:absolute;left:0;right:0;bottom:0;height:18px;background:linear-gradient(180deg,#34465F 0%,#131F31 45%,#050B15 100%);box-shadow:0 1px 0 rgba(233,236,243,.35) inset,0 6px 14px rgba(0,0,0,.55)}
.shutter__rail::before{content:"";position:absolute;left:0;right:0;top:4px;height:1.2px;background:rgba(233,236,243,.32)}
.shutter__rail i{position:absolute;bottom:-6px;width:46px;height:9px;border-radius:0 0 5px 5px;background:linear-gradient(180deg,#26344A,#03070F)}
.shutter__rail i:first-child{left:22%}.shutter__rail i:last-child{right:22%}

.sill{grid-row:4;position:relative;z-index:2;background:linear-gradient(180deg,#2A4467 0%,#1B3050 45%,#0E1C31 100%);box-shadow:0 1px 0 rgba(233,236,243,.4) inset,0 5px 9px rgba(0,0,0,.4)}
.pavement{grid-row:5;background:url(../img/pavement.jpg) 0 0/auto 100% repeat-x;box-shadow:inset 0 12px 12px -10px rgba(0,0,0,.55)}
.olive{position:absolute;z-index:5;left:calc(min(56svh,500px) * -.4);bottom:calc(var(--pave-h) - 26px);height:min(56svh,500px);width:auto;pointer-events:none}
.bollard{position:absolute;z-index:5;right:max(12px,1.6vw);bottom:10px;height:min(18%,170px);width:auto}

/* the shutter rolls up on load (JS adds .is-open); without JS it simply rests open */
.js .front:not(.is-open) .shutter{transform:translateY(0)}
.js .front:not(.is-open) .bx__f{stroke-dashoffset:100}
.js .front:not(.is-open) .bx__t,.js .front:not(.is-open) .clock,.js .front:not(.is-open) .doors .door{opacity:0}
.front.is-open .shutter{animation:rollup 2.1s cubic-bezier(.55,.06,.24,1) both}
@keyframes rollup{0%{transform:translateY(0)}84%{transform:translateY(calc(-100% + var(--shut) - 10px))}100%{transform:translateY(calc(-100% + var(--shut)))}}
.front.is-open .bx__f{animation:draw 1s cubic-bezier(.3,.7,.2,1) both;animation-delay:calc(1.75s + var(--d) * .26s)}
.front.is-open .bx__t{animation:tab .5s var(--ease-out) both;animation-delay:calc(2.3s + var(--d) * .26s);transform-box:fill-box;transform-origin:0 100%}
.front.is-open .clock{animation:swing 1.3s cubic-bezier(.22,1.16,.36,1) both;animation-delay:1.55s}
.front.is-open .doors .door{animation:rise .8s var(--ease-out) both;animation-delay:2.05s}
.front.is-open .doors .door + .door{animation-delay:2.2s}
@keyframes draw{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
@keyframes tab{from{opacity:0;transform:translateY(calc(var(--ty,0px) + 14px)) scaleY(.6)}to{opacity:1;transform:translateY(var(--ty,0px))}}
.bx__t{transform:translateY(var(--ty,0px))}
@keyframes swing{0%{opacity:0;transform:translateY(-26px) rotate(-10deg)}35%{opacity:1}100%{opacity:1;transform:none}}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* ============================================================
   08:05 - PROBLEM
   ============================================================ */
.problem__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,80px);align-items:center}
.dms{display:grid;gap:14px;align-content:center}
.dm{padding:18px 22px 16px;max-width:420px}
.dm:nth-child(2){margin-left:clamp(16px,3vw,44px);opacity:.82}
.dm:nth-child(3){margin-left:clamp(32px,6vw,88px);opacity:.64}
.dm__who{display:block;font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.dm__q{font-family:var(--serif);font-style:italic;font-weight:620;font-variation-settings:'opsz' 14;font-size:clamp(21px,1.9vw,27px);line-height:1.18;color:var(--ink);margin-top:8px;text-wrap:balance}
.dm__t{display:block;text-align:right;font-size:12.5px;font-weight:600;color:var(--ink-3);margin-top:6px;font-variant-numeric:lining-nums tabular-nums}
.dm__cap{font-size:14px;line-height:1.45;color:var(--ink-3);max-width:40ch;margin-top:6px}

/* ============================================================
   08:06 - THE REAL WINDOW ONLINE
   ============================================================ */
.demo{display:grid;grid-template-columns:minmax(0,1.32fr) minmax(0,1fr);gap:clamp(22px,3vw,40px);margin-top:44px;align-items:start}
.cam__glass{position:relative;border-radius:10px;overflow:hidden;border:1.5px solid rgba(233,236,243,.55);box-shadow:0 18px 40px rgba(0,0,0,.45);background:#222}
.cam__svg{width:100%;height:auto;aspect-ratio:4/3}
.cam__live{position:absolute;z-index:3;left:14px;bottom:12px;display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);font-weight:700;font-size:12px;letter-spacing:.16em;color:#fff;background:rgba(0,10,32,.62);padding:5px 10px;border-radius:5px}
.cam__live i{width:8px;height:8px;border-radius:50%;background:var(--mag);box-shadow:0 0 0 0 rgba(233,63,133,.6);animation:pulse 2.2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(233,63,133,.55)}70%{box-shadow:0 0 0 8px rgba(233,63,133,0)}100%{box-shadow:0 0 0 0 rgba(233,63,133,0)}}
.cam figcaption{margin-top:12px}
.lx{cursor:pointer}
.js .demo.is-armed .lx__f{stroke-dashoffset:100;transition:stroke-dashoffset .75s cubic-bezier(.3,.7,.2,1),stroke-width .25s}
.js .demo.is-armed .lx__t{opacity:0;transition:opacity .35s}
.js .demo.is-armed .lx.is-on .lx__f{stroke-dashoffset:0}
.js .demo.is-armed .lx.is-on .lx__t{opacity:1}
.js .demo.is-armed .card{opacity:0;transform:translateY(8px);transition:opacity .45s var(--ease-out),transform .45s var(--ease-out),background-color .25s,color .25s}
.js .demo.is-armed .card.is-on{opacity:1;transform:none}
.lx__f{transition:stroke-width .25s}
.lx.is-hot .lx__f{stroke-width:9}
.rail__h{display:flex;align-items:center;gap:10px;font-size:13.5px;font-weight:600;color:rgba(243,244,247,.78);margin-bottom:14px}
.cards{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.card{display:grid;grid-template-columns:62px 1fr;gap:12px;align-items:center;background:var(--enamel-2);color:var(--ink);border:1.3px solid var(--ink);border-radius:9px;padding:7px 10px 7px 7px;box-shadow:inset 0 0 0 3px var(--enamel-2),0 8px 18px rgba(0,0,0,.3);transition:background-color .25s,color .25s}
.card img{width:62px;height:62px;border-radius:6px;object-fit:cover;background:#E4E6EB}
.card b{display:block;font-weight:700;font-size:14.5px;line-height:1.2}
.card span{display:block;font-size:12px;color:var(--ink-3);margin-top:2px}
.card em{display:block;font-style:normal;font-family:var(--serif);font-weight:800;font-variation-settings:'opsz' 14;font-variant-numeric:lining-nums tabular-nums;font-size:19px;margin-top:3px}
.card.is-hot{background:var(--ink);color:var(--enamel);box-shadow:inset 0 0 0 3px var(--ink),inset 0 0 0 4.3px rgba(243,244,247,.5),0 8px 18px rgba(0,0,0,.3)}
.card.is-hot span{color:rgba(243,244,247,.7)}
.tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.fly{position:fixed;z-index:40;border-radius:6px;object-fit:cover;pointer-events:none;box-shadow:0 14px 30px rgba(0,0,0,.4)}

/* ============================================================
   14:10 - ENGINE
   ============================================================ */
.pipe{position:relative;margin-top:44px;padding-top:26px}
.pipe__rail{position:absolute;left:0;right:0;top:11.5px;height:3px;background:var(--line);border-radius:2px}
.pipe__rail i{position:absolute;inset:0;background:var(--grad);border-radius:2px;transform-origin:0 50%;transform:scaleX(var(--p,1))}
.pipe__stages{list-style:none;display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.stage{padding:22px 18px 18px;display:flex;flex-direction:column}
.stage__n{position:absolute;top:-41px;left:16px;z-index:2;width:30px;height:30px;border-radius:6px;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:700;font-size:14px;font-variant-numeric:lining-nums;box-shadow:0 0 0 4px var(--enamel)}
.stage h3{font-size:17px;font-weight:700;line-height:1.2}
.stage p{font-size:14px;line-height:1.45;color:var(--ink-2);margin-top:8px;flex:1}
.stamps{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.engine__row{display:grid;grid-template-columns:1.25fr 1fr;gap:16px;margin-top:22px}
.moat{padding:24px 26px}
.moat h3{font-size:18px;margin-bottom:12px}
.moat .ticks li{font-size:15px}

/* ============================================================
   19:30 - SAVE THE BOUQUET
   ============================================================ */
.rescue__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(32px,5vw,72px);align-items:center}
.rescue__fig{position:relative}
.rescue__fig .photo{aspect-ratio:4/4.3;box-shadow:0 20px 44px rgba(0,0,0,.45);border:1.5px solid rgba(233,236,243,.5)}
.reprice{position:absolute;right:-18px;bottom:-22px;padding:16px 22px 14px;display:grid;gap:4px;min-width:190px}
.reprice__l{font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.reprice__p{display:flex;align-items:baseline;gap:12px}
.reprice__p s{position:relative;text-decoration:none;font-weight:600;font-size:18px;color:var(--ink-3);font-variant-numeric:lining-nums}
.reprice__p s::after{content:"";position:absolute;left:-3px;right:-3px;top:52%;height:2px;background:var(--mag);transform-origin:0 50%;transform:scaleX(var(--strike,1))}
.reprice__p b{font-family:var(--serif);font-weight:800;font-variation-settings:'opsz' 14;font-variant-numeric:lining-nums;font-size:44px;line-height:1;color:var(--ink)}
.stats--3{grid-template-columns:repeat(3,1fr)}
.kpis{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin-top:26px;padding:16px 20px;border:1.5px solid rgba(233,236,243,.5);border-radius:9px;background:rgba(243,244,247,.05)}
.kpis b{font-weight:600;font-size:15px;color:rgba(243,244,247,.84);flex-basis:100%}
.kpis span{font-weight:700;font-size:15px;color:var(--enamel)}
.kpis span + span::before{content:"·";margin-right:14px;color:rgba(243,244,247,.55)}
.reprice__off{font-weight:700;font-size:12.5px;color:var(--ink-2);font-variant-numeric:lining-nums}
.notes{display:grid;gap:10px;margin-top:24px}
.notes li{position:relative;padding-left:22px;font-size:15px;line-height:1.5;color:rgba(243,244,247,.84)}
.notes li::before{content:"";position:absolute;left:2px;top:.62em;width:9px;height:9px;border-radius:2px;border:1.5px solid rgba(243,244,247,.7)}

/* ============================================================
   DOOR 1 - FLORISTS
   ============================================================ */
.florists__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,3.5vw,48px);margin-top:44px;align-items:stretch}
.photo--tall{min-height:420px}
.steps{list-style:none;display:grid;gap:14px;align-content:center}
.step{display:grid;grid-template-columns:34px 1fr;gap:16px;padding:22px 24px 20px}
.step .tk{width:34px;height:34px;font-size:15px;border-radius:7px}
.step h3{font-size:19px;font-weight:700;line-height:1.2}
.step p{font-size:15px;line-height:1.5;color:var(--ink-2);margin-top:6px}
.plans{display:grid;grid-template-columns:repeat(3,1fr) 1.45fr;gap:14px;margin-top:22px}
.plan{padding:20px 22px 18px;display:flex;flex-direction:column;gap:4px}
.plan__p{font-family:var(--serif);font-weight:800;font-variation-settings:'opsz' 14;font-variant-numeric:lining-nums;font-size:44px;line-height:1}
.plan__n{font-weight:700;font-size:16px;margin-top:8px}
.plan__d{font-size:14px;color:var(--ink-2);line-height:1.4}
.plan--note{display:flex;align-items:center;padding:22px 26px}
.plan--note p{font-size:14.5px}
.plan--note b{color:var(--enamel)}
.florists__foot{display:flex;align-items:center;justify-content:space-between;gap:28px;margin-top:30px;flex-wrap:wrap}
.privacy{font-size:14.5px;line-height:1.5;color:var(--ink-2);max-width:78ch}
.privacy b{color:var(--ink)}

/* ============================================================
   20:00 - RIDEAU DOWN
   ============================================================ */
.closing{position:relative;height:100svh;min-height:560px;background:var(--sheen),linear-gradient(180deg,rgba(0,20,48,1) 0%,rgba(1,21,50,.97) 55%,rgba(2,25,60,.8) 100%),var(--slats),#07111F;overflow:hidden}
.closing__stage{position:absolute;inset:0;display:grid;place-items:center;padding:calc(var(--nav-h) + 20px) var(--gut) 40px}
.closing__front{width:min(1120px,100%);height:min(640px,100%);display:grid;grid-template-rows:auto 1fr;border-left:clamp(14px,3vw,40px) solid #1D3350;border-right:clamp(14px,3vw,40px) solid #1D3350;background:#00081A;box-shadow:0 30px 70px rgba(0,0,0,.55)}
.awning--sm{height:58px;background:url(../img/awning.png) 0 0/auto 100% repeat-x;position:relative;z-index:3;margin:0 calc(clamp(14px,3vw,40px) * -1 - 10px);filter:drop-shadow(0 5px 6px rgba(0,6,22,.5))}
.closing__bay{position:relative;overflow:hidden;margin-top:-16px}
.closing__window{position:absolute;z-index:1;inset:14px 14px 0;overflow:hidden;border-radius:3px;box-shadow:inset 0 0 0 1.5px rgba(233,236,243,.4)}
.closing__window img{width:100%;height:100%;object-fit:cover;filter:brightness(.6) saturate(.82)}
.closing__shutter{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:0 6%;background:var(--sheen),var(--slats),linear-gradient(180deg,#050F1D 0%,#0E1E34 60%,#1C2E47 100%);box-shadow:0 10px 20px rgba(0,0,0,.5);transform:translateY(0)}
.closing__shutter::after{content:"";position:absolute;left:0;right:0;bottom:0;height:18px;background:linear-gradient(180deg,#34465F,#050B15);box-shadow:0 1px 0 rgba(233,236,243,.35) inset}
.closing__title{font-family:var(--serif);font-weight:680;font-variation-settings:'opsz' 18;font-size:clamp(36px,5.4vw,76px);line-height:1.02;letter-spacing:-.015em;color:var(--enamel);max-width:18ch;text-wrap:balance;text-shadow:0 2px 0 rgba(0,6,22,.45)}
.closing__title em{font-weight:560;font-style:italic}
.closing__sub{margin-top:18px;font-size:clamp(16px,1.5vw,20px);color:rgba(243,244,247,.84)}

/* ============================================================
   AFTER HOURS - TRACTION, TEAM, FRANCE, PARTNERS
   ============================================================ */
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:44px}
.fact{padding:26px 20px 20px}
.fact .num{font-size:clamp(32px,3vw,44px)}
.fact p{font-size:14.5px;line-height:1.45;color:var(--ink-2);margin-top:12px}
.fact--accent .num::after{content:"";display:block;width:56px;height:5px;border-radius:3px;background:var(--grad);margin-top:10px}
.platform{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:16px;margin-top:22px;align-items:stretch}
.platform__copy{padding:6px 8px 0 0}
.platform__copy .h3{color:var(--enamel);font-family:var(--serif);font-weight:700;font-variation-settings:'opsz' 14;font-size:clamp(24px,2.1vw,30px);line-height:1.1}
.platform__copy p{font-size:15px;line-height:1.5;color:rgba(243,244,247,.84);margin-top:12px}
.road{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.road li{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:rgba(243,244,247,.84);border:1.3px solid rgba(233,236,243,.36);border-radius:6px;padding:6px 10px}
.road em{font-style:normal;font-weight:700;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:rgba(243,244,247,.6)}
.road li.on{background:var(--enamel-2);color:var(--ink);border-color:var(--enamel-2)}
.road li.on em{color:var(--ink-3)}
.live-site{display:flex;flex-direction:column;gap:10px;text-decoration:none;overflow:hidden;transition:background-color .3s}
.live-site:hover{background:rgba(243,244,247,.1)}
.live-site__k{font-family:var(--sans);font-weight:800;font-size:26px;letter-spacing:-.015em;color:var(--enamel);line-height:1.05}
.live-site__d{font-size:14.5px;line-height:1.5;color:rgba(243,244,247,.84);flex:1}
.live-site__go{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:14px;color:var(--enamel)}
.live-site--img{position:relative;padding-top:0}
.live-site--img img{margin:0 -26px 6px;width:calc(100% + 52px);max-width:none;height:150px;object-fit:cover;border-bottom:1.5px solid rgba(233,236,243,.4)}
.live-site--img .tag--ill{top:10px;left:10px}

.people{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:44px}
.person{display:grid;grid-template-columns:52px 1fr;gap:16px;padding:22px 20px 20px;align-content:start}
.person--lead{grid-column:1 / -1;grid-template-columns:72px 1fr;padding:28px 30px 26px}
.mono{width:52px;height:52px;border-radius:8px;background:var(--lacquer-field);color:var(--enamel);display:grid;place-items:center;font-family:var(--serif);font-weight:640;font-variation-settings:'opsz' 14;font-size:21px;letter-spacing:.02em;box-shadow:inset 0 0 0 1.2px rgba(233,236,243,.35)}
.person--lead .mono{width:72px;height:72px;font-size:29px}
.person h3{font-size:18px;font-weight:700;line-height:1.2}
.person--lead h3{font-size:22px}
.role{font-weight:700;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-top:5px}
.bio{font-size:14.5px;line-height:1.5;color:var(--ink-2);margin-top:10px}
.person--lead .bio{font-size:15px;max-width:74ch}
.team__row{display:grid;grid-template-columns:1.3fr 1fr;gap:16px;margin-top:16px}
.team__row .ticks li{font-size:15px}

.france__grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(20px,3vw,40px);margin-top:44px;align-items:stretch}
.france__photo{min-height:360px}
.quote{padding:clamp(26px,3vw,40px);display:flex;flex-direction:column;justify-content:center}
.quote p{font-family:var(--serif);font-style:italic;font-weight:600;font-variation-settings:'opsz' 14;font-size:clamp(21px,2vw,28px);line-height:1.28;color:var(--ink);text-wrap:pretty}
.quote footer{margin-top:18px;font-size:14px;color:var(--ink-3)} .quote footer b{color:var(--ink)}
.reasons{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}
.reason{padding:22px 22px 20px}
.reason h3{font-size:17px;font-weight:700;line-height:1.25}
.reason p{font-size:14.5px;line-height:1.5;color:var(--ink-2);margin-top:8px}
.market{display:grid;gap:10px;margin-top:34px}
.mbar{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.6fr) auto;align-items:center;gap:20px;padding:16px 22px;border-radius:8px;background:var(--lacquer-field);color:var(--enamel);box-shadow:0 8px 20px rgba(8,18,53,.22)}
.mbar h3{font-weight:700;font-size:15px;line-height:1.3}
.mbar p{font-size:14px;line-height:1.45;color:rgba(243,244,247,.8)}
.mbar b{font-family:var(--serif);font-weight:700;font-variation-settings:'opsz' 14;font-variant-numeric:lining-nums;font-size:26px;white-space:nowrap}
.mbar--sub b{font-family:var(--sans);font-weight:700;font-size:15px;letter-spacing:.02em}
.mbar--first b{background:var(--grad) 0 100%/100% 4px no-repeat;padding-bottom:6px}
.market__note{font-size:14px;color:var(--ink-2);margin-top:6px}



.timeline{position:relative;margin-top:48px}
.timeline__rail{position:absolute;left:0;right:0;top:11px;height:3px;background:rgba(233,236,243,.22);border-radius:2px}
.timeline__rail i{position:absolute;inset:0;background:var(--grad);border-radius:2px;transform-origin:0 50%;transform:scaleX(var(--p,1))}
.timeline ol{list-style:none;display:grid;grid-template-columns:repeat(7,1fr);gap:14px}
.timeline li{position:relative;padding-top:38px}
.timeline li::before{content:"";position:absolute;top:4px;left:0;width:17px;height:17px;border-radius:50%;background:var(--lacquer);border:2px solid rgba(243,244,247,.8);box-shadow:0 0 0 5px var(--lacquer)}
.timeline li.is-on::before{background:var(--enamel);border-color:var(--enamel)}
.timeline b{display:block;font-family:var(--sans);font-weight:800;letter-spacing:-.02em;font-variant-numeric:lining-nums;font-size:24px;line-height:1;color:var(--enamel)}
.timeline span{display:block;font-weight:700;font-size:14.5px;line-height:1.3;color:var(--enamel);margin-top:10px}
.timeline small{display:block;font-size:12.5px;line-height:1.4;color:rgba(243,244,247,.64);margin-top:4px}
.tl--goal b{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
.ask{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(18px,3vw,40px);margin-top:44px;align-items:start}
.ask__main{padding:30px 30px 28px}
.ask__main h3,.ask__h{font-family:var(--serif);font-weight:640;font-variation-settings:'opsz' 14;font-size:26px;line-height:1.15;color:var(--enamel);margin-bottom:16px}
.ask__demo{margin-top:22px;font-family:var(--serif);font-style:italic;font-weight:560;font-variation-settings:'opsz' 14;font-size:20px;line-height:1.35;color:var(--enamel)!important}
.ask__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.ask__money .h3{color:var(--enamel)}
.ladder{display:grid;gap:12px;margin-top:16px}
.ladder li{display:grid;grid-template-columns:24px 1fr;gap:12px;font-size:15px;line-height:1.45;color:rgba(243,244,247,.86)}
.ladder b{width:24px;height:24px;border-radius:5px;border:1.4px solid rgba(243,244,247,.7);display:grid;place-items:center;font-size:12px;color:var(--enamel)}
.use{margin-top:26px}
.use__bar{display:flex;height:14px;border-radius:4px;overflow:hidden;gap:2px}
.use__bar i{flex:var(--w) 0 0;background:var(--enamel)}
.use__bar i:nth-child(2){opacity:.7}.use__bar i:nth-child(3){opacity:.45}.use__bar i:nth-child(4){opacity:.26}
.use__key{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;margin-top:14px}
.use__key li{font-size:13.5px;line-height:1.4;color:rgba(243,244,247,.8)}
.use__key b{color:var(--enamel);font-variant-numeric:lining-nums}

/* ============================================================
   CONTACT - TWO DOORS
   ============================================================ */
.contact__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(28px,5vw,80px);align-items:start}
.contact__mail{margin-top:26px;display:flex;flex-direction:column;gap:6px}
.contact__mail a{font-family:var(--sans);font-weight:700;letter-spacing:-.01em;font-size:clamp(24px,2.4vw,32px);color:var(--ink);text-decoration:none;background:linear-gradient(var(--ink),var(--ink)) 0 100%/100% 1.5px no-repeat;padding-bottom:2px;align-self:flex-start}
.contact__mail span{font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.form{padding:34px 30px 28px;display:grid;gap:16px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.doorpick{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:5px;border-radius:9px;background:var(--enamel);border:1px solid var(--line)}
.doorpick__o{position:relative;cursor:pointer}
.doorpick__o input{position:absolute;opacity:0;inset:0;cursor:pointer}
.doorpick__o span{display:block;text-align:center;padding:12px 10px;border-radius:6px;font-weight:700;font-size:14.5px;color:var(--ink-2);transition:background-color .25s,color .25s}
.doorpick__o input:checked + span{background:var(--ink);color:var(--enamel)}
.doorpick__o input:focus-visible + span{outline:2px solid var(--vio);outline-offset:2px}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field{display:grid;gap:7px}
.field > span{font-weight:700;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.field input,.field textarea{font:inherit;font-size:16px;color:var(--ink);background:#fff;border:1.3px solid var(--line);border-radius:7px;padding:12px 14px;transition:border-color .2s;caret-color:var(--vio)}
.field textarea{resize:vertical;min-height:96px}
.field input:hover,.field textarea:hover{border-color:var(--ink-3)}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px rgba(121,17,240,.16)}
.field input[aria-invalid="true"]{border-color:var(--mag)}
.form__go{width:100%;margin-top:4px}
.form__go[disabled]{opacity:.6;cursor:progress}
.form__msg{min-height:1.4em;font-size:14.5px;color:var(--ink-2)}
.form__msg.is-err{color:#B8155A}
.form__msg.is-ok{color:var(--ink);font-weight:600}
.form[data-role="florist"] .f-partner,.form[data-role="partner"] .f-florist{display:none}
.form:not([data-role]) .f-partner{display:none}

/* ============================================================
   FOOTER + CLOCK DOCK
   ============================================================ */
.foot{background:var(--lacquer-deep);color:var(--enamel);padding:72px 0 30px;position:relative}
.foot::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(0,20,48,.86),rgba(0,20,48,.86)),var(--slats);pointer-events:none}
.foot > .wrap{position:relative}
.foot__in{display:flex;justify-content:space-between;gap:48px;flex-wrap:wrap}
.foot__tag{font-family:var(--serif);font-style:italic;font-weight:560;font-variation-settings:'opsz' 14;font-size:24px;color:rgba(243,244,247,.84);margin-top:12px}
.foot__cols{display:flex;gap:clamp(28px,5vw,72px);flex-wrap:wrap}
.foot__cols div{display:grid;gap:10px;align-content:start}
.foot__cols h4{font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(243,244,247,.55)}
.foot__cols a{font-size:15px;color:rgba(243,244,247,.88);text-decoration:none}
.foot__cols a:hover{text-decoration:underline}
.foot__base{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:56px;padding-top:18px;border-top:1px solid rgba(233,236,243,.2);font-size:12.5px;color:rgba(243,244,247,.55)}

.dock{position:fixed;z-index:55;left:18px;bottom:18px;padding:10px 20px 9px;display:flex;align-items:baseline;gap:12px;opacity:0;transform:translateY(12px);transition:opacity .45s var(--ease-out),transform .45s var(--ease-out);pointer-events:none}

.dock.is-on{opacity:1;transform:none}
.dock__t{font-weight:800;font-size:19px;letter-spacing:-.01em;font-variant-numeric:lining-nums tabular-nums;display:inline-block;overflow:hidden}
.dock__l{font-weight:700;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);white-space:nowrap}

/* ============================================================
   RESPONSIVE
   ============================================================ */
/* short, wide screens crop the top of the window: the price tab moves inside its frame */
@media (max-height:820px) and (min-width:761px){
  .bx__t{--ty:40px}
}
@media (max-width:1180px){
  .nav__links{display:none}
  .nav__menu{display:block}
  .pipe__stages{grid-template-columns:repeat(3,1fr);row-gap:32px}
  .pipe__rail{display:none}
  .pipe{padding-top:0}
  .stage{padding-top:34px}
  .stage__n{top:-15px}
  .plans{grid-template-columns:repeat(3,1fr)}
  .plan--note{grid-column:1 / -1}
  .platform{grid-template-columns:1fr 1fr}
  .platform__copy{grid-column:1 / -1}
  .people{grid-template-columns:repeat(2,1fr)}
  .timeline ol{grid-template-columns:1fr;row-gap:22px;padding-left:34px}
  .timeline li{padding-top:0}
  .timeline li::before{top:3px;left:-34px}
  .timeline b{display:inline;font-size:20px;margin-right:10px}
  .timeline span{display:inline;margin-top:0}
  .timeline__rail{left:8px;right:auto;top:6px;bottom:6px;width:3px;height:auto}
  .timeline__rail i{transform-origin:50% 0;transform:scaleY(var(--p,1))}

}
@media (max-width:980px){
  :root{--awn-h:70px}
  .problem__grid,.demo,.rescue__grid,.florists__grid,.france__grid,.contact__grid,.ask,.engine__row,.team__row{grid-template-columns:1fr}
  .dms{order:2}
  .facts{grid-template-columns:repeat(2,1fr)}
  .reasons{grid-template-columns:1fr}



  .person--lead .bio{columns:1}
  .olive,.bollard{display:none}
  .doors{left:26px}
  .reprice{right:12px;bottom:-18px}
}
@media (max-width:760px){
  :root{--nav-h:62px;--awn-h:56px;--sill-h:14px;--pave-h:26px;--pil:14px;--shut:clamp(236px,35svh,300px)}
  .lx__t{display:none}
  body{font-size:16px}
  .nav .btn--ring{display:none}
  .front{min-height:600px;max-height:none}
  .shutter__title,:lang(fr) .shutter__title{white-space:normal;font-size:min(13.6vw,8.2svh);line-height:.98;text-wrap:balance}
  :lang(fr) .shutter__title{font-size:min(11.4vw,7svh)}
  .shutter__sub{font-size:16px;max-width:30ch}
  .window{padding:8px 8px 128px}
  .window::after{content:"";position:absolute;left:14px;right:14px;bottom:10px;height:110px;border:1.2px solid rgba(233,236,243,.45);border-radius:3px;pointer-events:none}
  .front .clock{display:none}
  .front .tag--ill{top:8px;bottom:auto;left:auto;right:8px}
  .clock{top:12px;right:12px;padding:9px 14px 8px}
  .clock__t{font-size:24px}
  .clock__l{font-size:9.5px;letter-spacing:.12em}
  .doors,:lang(fr) .doors{left:24px;right:24px;bottom:20px;gap:8px;flex-direction:column;align-items:stretch}
  .door{text-align:center;padding:11px 16px 10px;font-size:15px}

  .bx:nth-of-type(1),.bx:nth-of-type(4),.bx:nth-of-type(5),.bx:nth-of-type(6){display:none}
  .win-g{transform-origin:973px 250px;transform:scale(1.5)}
  .stats,.stats--3{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr 1fr;gap:8px}
  .card{grid-template-columns:48px 1fr;gap:9px;padding:6px 8px 6px 6px}
  .card img{width:48px;height:48px}
  .card b{font-size:13px}
  .card em{font-size:16px}
  .pipe__stages{grid-template-columns:1fr}
  .plans{grid-template-columns:1fr}
  .facts,.people{grid-template-columns:1fr}
  .mbar{grid-template-columns:1fr;gap:6px}


  .platform{grid-template-columns:1fr}

  .form{padding:26px 18px 22px}
  .form__row{grid-template-columns:1fr}
  .use__key{grid-template-columns:1fr}
  .dm:nth-child(2){margin-left:18px}.dm:nth-child(3){margin-left:36px}
  .person--lead{grid-template-columns:1fr}
  .person{grid-template-columns:1fr}
  .dock{left:10px;bottom:10px;padding:8px 16px 7px}
  .dock__t{font-size:16px}
  .dock__l{font-size:9.5px}
  .closing__front{height:min(520px,100%)}
  .awning--sm{height:42px}
  .sec--lacquer::after{inset:8px}
  .sec--night::after{left:8px;right:8px}
  .reprice{min-width:0}
  .reprice__p b{font-size:34px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .front .shutter,.front.is-open .shutter{animation:none!important;transform:translateY(calc(-100% + var(--shut)))!important}
  .js .front .bx__f{stroke-dashoffset:0!important;animation:none!important}
  .js .front .bx__t,.js .front .clock,.js .front .doors .door{opacity:1!important;animation:none!important}
  .cam__live i{animation:none}
  .glass__sheen{transition:none}
}
html.still{scroll-behavior:auto}
.still .front .shutter,.still .front.is-open .shutter{animation:none!important;transform:translateY(calc(-100% + var(--shut)))!important}
.still .front .bx__f{stroke-dashoffset:0!important;animation:none!important}
.still .front .bx__t,.still .front .clock,.still .front .doors .door{opacity:1!important;animation:none!important}
.still .cam__live i{animation:none}
