/* Rebond Finance — v2
   Porcelaine de Limoges : blanc biscuit, filet or, cachet marine. */

@font-face{
  font-family:"Jost";
  src:url("fonts/jost-var.woff2") format("woff2");
  font-weight:100 900; font-display:swap;
  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;
}
@font-face{
  font-family:"Jost";
  src:url("fonts/jost-var-ext.woff2") format("woff2");
  font-weight:100 900; font-display:swap;
  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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"Hanken Grotesk";
  src:url("fonts/hanken-var.woff2") format("woff2");
  font-weight:100 900; font-display:swap;
  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;
}
@font-face{
  font-family:"Hanken Grotesk";
  src:url("fonts/hanken-var-ext.woff2") format("woff2");
  font-weight:100 900; font-display:swap;
  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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root{
  --white:#ffffff;
  --biscuit:#f6f5f2;
  --biscuit-2:#efede7;
  --navy:#0a1830;
  --ink:#132542;
  --ink-2:#435069;
  --gold:#b08d4f;
  --gold-text:#85652f;
  --gold-soft:#e9dfcb;
  --line:rgba(19,37,66,.12);
  --line-2:rgba(19,37,66,.22);

  --display:"Jost", "Futura", "Century Gothic", sans-serif;
  --text:"Hanken Grotesk", "Segoe UI", system-ui, sans-serif;

  --wrap:1180px;
  --gutter:clamp(16px, 4vw, 40px);
  --section:clamp(88px, 11vw, 152px);
  --header:76px;
  --ease:cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:calc(var(--header) + 16px); }
body{
  margin:0;
  background:var(--white);
  color:var(--ink);
  font-family:var(--text);
  font-size:1.0625rem;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  font-feature-settings:"kern","liga";
}
img,svg{ display:block; max-width:100%; }
::selection{ background:var(--gold-soft); color:var(--navy); }
html{ scrollbar-color:var(--line-2) var(--white); }
::-webkit-scrollbar{ width:11px; height:11px; }
::-webkit-scrollbar-track{ background:var(--white); }
::-webkit-scrollbar-thumb{ background:#cfd3db; border:3px solid var(--white); border-radius:99px; }
:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; border-radius:2px; }

h1,h2,h3,h4{
  font-family:var(--display);
  font-weight:300;
  color:var(--navy);
  margin:0;
  line-height:1.08;
  letter-spacing:-.012em;
  text-wrap:balance;
}
h1{ font-size:clamp(2.5rem, 5.6vw, 4.6rem); }
h2{ font-size:clamp(2rem, 3.6vw, 3.05rem); }
h3{ font-size:clamp(1.3rem, 1.8vw, 1.6rem); font-weight:400; letter-spacing:-.005em; line-height:1.2; }
p{ margin:0 0 1em; text-wrap:pretty; }
p:last-child{ margin-bottom:0; }
a{ color:inherit; text-decoration-color:var(--gold); text-underline-offset:.22em; text-decoration-thickness:1px; }
strong{ font-weight:600; color:var(--navy); }
ul,ol{ margin:0; padding:0; list-style:none; }

.wrap{ max-width:var(--wrap); margin:0 auto; padding:0 var(--gutter); }
.narrow{ max-width:760px; }
.section{ padding:var(--section) 0; }
.section-tight{ padding:calc(var(--section) * .6) 0; }
.biscuit{ background:var(--biscuit); }
.lead{ font-size:clamp(1.12rem, 1.5vw, 1.3rem); line-height:1.55; color:var(--ink-2); max-width:56ch; }
.muted{ color:var(--ink-2); }
.measure{ max-width:64ch; }
.skip{ position:absolute; left:-999px; top:8px; background:var(--navy); color:#fff; padding:10px 16px; z-index:100; }
.skip:focus{ left:8px; }
.visually-hidden{ position:absolute!important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* ---------- Icons ---------- */
.i{ width:1em; height:1em; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; flex:none; }

/* ---------- Buttons & links ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.7em;
  font:500 .95rem/1 var(--text);
  letter-spacing:.01em;
  padding:1.05em 1.7em;
  border-radius:999px;
  background:var(--navy); color:#fff;
  text-decoration:none;
  border:1px solid var(--navy);
  transition:background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
  cursor:pointer;
}
.btn:hover{ background:var(--ink); }
.btn .i{ transition:transform .35s var(--ease); }
.btn:hover .i{ transform:translateX(3px); }
.btn-line{ background:transparent; color:var(--navy); border-color:var(--line-2); }
.btn-line:hover{ background:transparent; border-color:var(--gold); }
.link{
  display:inline-flex; align-items:center; gap:.55em;
  color:var(--navy); font-weight:500; font-size:.95rem;
  text-decoration:none;
  background:linear-gradient(var(--gold),var(--gold)) 0 100% / 100% 1px no-repeat;
  padding-bottom:3px;
  transition:background-size .4s var(--ease);
}
.link:hover{ background-size:0 1px; background-position:100% 100%; }
.link .i{ transition:transform .35s var(--ease); }
.link:hover .i{ transform:translateX(3px); }
.actions{ display:flex; flex-wrap:wrap; align-items:center; gap:18px 28px; }

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.94);
  backdrop-filter:saturate(160%) blur(10px);
  -webkit-backdrop-filter:saturate(160%) blur(10px);
  border-bottom:1px solid transparent;
  transition:border-color .3s;
}
.site-header.scrolled{ border-bottom-color:var(--line); }
.nav-row{ height:var(--header); display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand{ display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--navy); }
.brand img{ width:38px; height:auto; }
.brand span{ font:500 .8rem/1 var(--display); letter-spacing:.2em; text-transform:uppercase; white-space:nowrap; }
.nav{ display:flex; align-items:center; gap:clamp(14px, 1.7vw, 30px); }
.nav a{
  text-decoration:none; color:var(--ink-2); font-size:.875rem; white-space:nowrap;
  padding:6px 0; position:relative; transition:color .2s;
}
.nav a:not(.btn)::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--gold);
  transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease);
}
.nav a:not(.btn):hover{ color:var(--navy); }
.nav a:not(.btn):hover::after,.nav a[aria-current="page"]::after{ transform:scaleX(1); }
.nav a[aria-current="page"]{ color:var(--navy); }
.nav .btn,.nav .btn[aria-current="page"]{ padding:.8em 1.25em; font-size:.86rem; color:#fff; }
.nav-toggle{
  display:none; width:44px; height:44px; border:1px solid var(--line-2); border-radius:999px;
  background:#fff; cursor:pointer; position:relative; color:var(--navy);
}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{
  content:""; position:absolute; left:13px; right:13px; height:1px; background:currentColor; transition:transform .3s var(--ease), opacity .2s;
}
.nav-toggle span{ top:50%; }
.nav-toggle span::before{ left:0; right:0; top:-5px; }
.nav-toggle span::after{ left:0; right:0; top:5px; }
.nav-toggle[aria-expanded="true"] span{ background:transparent; }
.nav-toggle[aria-expanded="true"] span::before{ transform:translateY(5px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span::after{ transform:translateY(-5px) rotate(-45deg); }

@media (max-width:940px){
  .nav-toggle{ display:block; }
  .nav{
    position:fixed; inset:var(--header) 0 auto 0;
    flex-direction:column; align-items:stretch; gap:0;
    background:#fff; border-bottom:1px solid var(--line);
    padding:8px var(--gutter) 24px;
    max-height:calc(100svh - var(--header)); overflow:auto;
    transform:translateY(-8px); opacity:0; visibility:hidden;
    transition:opacity .3s var(--ease), transform .3s var(--ease), visibility 0s .3s;
  }
  .nav.open{ opacity:1; transform:none; visibility:visible; transition:opacity .3s var(--ease), transform .3s var(--ease); }
  .nav a{ padding:16px 0; font-size:1.05rem; border-bottom:1px solid var(--line); }
  .nav a:not(.btn)::after{ display:none; }
  .nav .btn{ margin-top:20px; justify-content:center; padding:1em; font-size:.95rem; border-bottom:0; }
}

/* ---------- Plate (home hero) ---------- */
.plate-hero{
  position:relative;
  min-height:calc(100svh - var(--header));
  display:grid; place-items:center;
  padding:clamp(24px, 4vh, 48px) var(--gutter) clamp(56px, 8vh, 88px);
  overflow:hidden;
}
.plate{
  --size:min(86svh, 92vw, 880px);
  position:relative;
  width:var(--size); aspect-ratio:1;
  display:grid; place-items:center;
}
.plate-rim{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.plate-rim .marli{ fill:var(--biscuit); }
.plate-rim .well{ fill:var(--white); }
.plate-rim .filet{ fill:none; stroke:var(--gold); }
.plate-rim .f1{ stroke-width:2; }
.plate-rim .f2{ stroke-width:1; }
.plate-rim .f3{ stroke-width:1.6; }
.plate-inner{
  position:relative; z-index:1;
  width:72%;
  text-align:center;
  display:flex; flex-direction:column; align-items:center;
}
.plate-inner .stamp{ width:clamp(92px, 13vmin, 128px); height:auto; margin-bottom:clamp(14px, 2.6vmin, 26px); overflow:visible; }
.plate-inner .stamp circle{ fill:none; stroke:var(--gold); stroke-width:1; }
.plate-inner .stamp text{ font:500 11px var(--display); letter-spacing:1.4px; text-transform:uppercase; fill:var(--ink-2); }
.plate-inner h1{ font-size:clamp(2.2rem, 5.1vmin, 4.1rem); max-width:13ch; }
.plate-inner .lead{ margin:clamp(16px, 2.6vmin, 26px) auto 0; max-width:38ch; font-size:clamp(1.02rem, 1.9vmin, 1.2rem); }
.plate-inner .actions{ justify-content:center; gap:12px 22px; margin-top:clamp(22px, 3.6vmin, 36px); }
@media (min-width:721px) and (max-height:820px){
  .plate-inner{ width:70%; transform:translateY(-3%); }
  .plate-inner .stamp{ width:clamp(84px, 13vmin, 104px); margin-bottom:8px; }
  .plate-inner h1{ font-size:clamp(1.9rem, 5.4vmin, 3.2rem); }
  .plate-inner .lead{ margin-top:10px; font-size:.98rem; max-width:34ch; }
  .plate-inner .actions{ flex-direction:column; gap:10px; margin-top:16px; }
  .plate-inner .btn{ padding:.85em 1.4em; }
}
.plate-foot{
  position:absolute; left:0; right:0; bottom:clamp(18px, 3vh, 30px);
  text-align:center; font-size:.8rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-2);
}

/* the gold filet is drawn on load like a brush on a turning wheel */
.js .plate-rim:not(.drawn) .filet{ opacity:0; }
.plate-rim .rot{ transform-origin:50% 50%; transform:rotate(-90deg); }


@media (max-width:720px){
  .plate-hero{ min-height:auto; padding-top:40px; padding-bottom:72px; }
  .plate{ --size:136vw; margin-top:-6vw; }
  .plate-inner{ width:66%; }
  .plate-inner h1{ font-size:clamp(1.95rem, 8.6vw, 2.5rem); }
  .plate-inner .lead{ font-size:1rem; }
  .plate-inner .actions{ flex-direction:column; gap:14px; }
  .plate-foot{ position:static; margin-top:18px; padding:0 var(--gutter); letter-spacing:.1em; }
  .plate-hero{ display:flex; flex-direction:column; align-items:center; }
}
@media (max-width:420px){
  .plate{ --size:150vw; }
  .plate-inner{ width:60%; }
  .plate-inner .lead{ font-size:.95rem; margin-top:12px; }
}

/* ---------- Page head (inner pages) ---------- */
.page-head{
  position:relative; overflow:hidden;
  padding:clamp(72px, 10vw, 136px) 0 clamp(64px, 8vw, 112px);
  border-bottom:1px solid var(--line);
}
.page-head .arc{
  position:absolute; pointer-events:none;
  right:calc(-1 * clamp(260px, 32vw, 480px)); top:50%;
  width:clamp(520px, 64vw, 960px); aspect-ratio:1;
  transform:translateY(-50%);
}
.page-head .arc .marli{ fill:var(--biscuit); }
.page-head .arc .well{ fill:var(--white); }
.page-head .arc .filet{ fill:none; stroke:var(--gold); vector-effect:non-scaling-stroke; stroke-width:1; }
.page-head .arc .f2{ stroke-width:.6; }
.page-head .content{ position:relative; max-width:760px; }
.page-head h1{ max-width:16ch; }
.page-head .lead{ margin-top:28px; }
.page-head .actions{ margin-top:40px; }
.crumb{ display:inline-flex; gap:10px; align-items:center; font-size:.85rem; color:var(--ink-2); margin-bottom:28px; text-decoration:none; }
.crumb:hover{ color:var(--navy); }
@media (max-width:820px){
  .page-head .arc{ right:-62vw; top:0; width:120vw; transform:translateY(-38%); opacity:.9; }
}

/* ---------- Section heads ---------- */
.head{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(24px, 6vw, 96px); align-items:end; margin-bottom:clamp(48px, 6vw, 80px); }
.head p{ color:var(--ink-2); max-width:48ch; }
.head.single{ grid-template-columns:1fr; }
@media (max-width:820px){ .head{ grid-template-columns:1fr; align-items:start; } }

/* ---------- Filet ornament ---------- */
.ornament{ display:flex; align-items:center; justify-content:center; gap:14px; color:var(--gold); padding:8px 0; }
.ornament::before,.ornament::after{ content:""; height:1px; width:min(120px, 18vw); background:currentColor; }
.ornament svg{ width:9px; height:9px; }

/* ---------- Situation rows ---------- */
.rows{ border-top:1px solid var(--line-2); }
.rows > li{ border-bottom:1px solid var(--line); }
.row{
  display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) auto;
  gap:clamp(16px, 4vw, 56px); align-items:baseline;
  padding:clamp(26px, 3.2vw, 38px) 0;
  text-decoration:none; color:inherit;
  position:relative;
}
.row h3{ transition:color .3s; }
.row p{ color:var(--ink-2); margin:0; max-width:46ch; }
.row .go{ display:inline-flex; align-items:center; gap:10px; font-size:.88rem; color:var(--gold-text); white-space:nowrap; }
.row .go .i{ transition:transform .4s var(--ease); }
a.row::before{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px; background:var(--gold);
  transform:scaleX(0); transform-origin:left; transition:transform .6s var(--ease);
}
a.row:hover::before,a.row:focus-visible::before{ transform:scaleX(1); }
a.row:hover .go .i{ transform:translateX(4px); }
@media (max-width:820px){
  .row{ grid-template-columns:1fr; gap:10px; }
}

/* ---------- Three ways ---------- */
.ways{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); }
.way{ padding:8px clamp(20px, 3vw, 44px) 8px; border-left:1px solid var(--gold); display:flex; flex-direction:column; gap:18px; }
.way:first-child{ border-left:0; padding-left:0; }
.way h3{ font-size:clamp(1.5rem, 2.2vw, 2rem); font-weight:300; }
.way p{ color:var(--ink-2); margin:0; }
.way .link{ margin-top:auto; align-self:flex-start; }

@media (max-width:900px){
  .ways{ grid-template-columns:1fr; }
  .way{ border-left:0; border-top:1px solid var(--gold); padding:36px 0; }
  .way:first-child{ border-top:0; padding-top:0; }
}

/* ---------- Cartographie (concentric rings) ---------- */
.carto{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(40px, 7vw, 112px); align-items:center; }
.rings{ width:100%; max-width:560px; margin:0 auto; overflow:visible; }
.rings circle{ fill:none; stroke:var(--gold); stroke-width:1; vector-effect:non-scaling-stroke; transition:stroke .4s, stroke-width .4s, fill .4s; }
.rings .band{ fill:var(--white); stroke:none; transition:fill .5s var(--ease); }
.rings text{ font-family:var(--display); font-size:15px; letter-spacing:.18em; text-transform:uppercase; fill:var(--ink-2); transition:fill .3s; }
.rings .core{ fill:var(--white); stroke:var(--gold); }
.rings .core-label{ fill:var(--navy); }
.rings[data-active="perf"] .band-perf,
.rings[data-active="orga"] .band-orga,
.rings[data-active="strat"] .band-strat{ fill:var(--biscuit-2); }
.rings[data-active="cash"] .core{ fill:var(--biscuit-2); }
.rings[data-active="perf"] .t-perf,.rings[data-active="orga"] .t-orga,.rings[data-active="strat"] .t-strat{ fill:var(--navy); }
.axes{ border-top:1px solid var(--line-2); }
.axes li{ border-bottom:1px solid var(--line); }
.axes button{
  all:unset; box-sizing:border-box; cursor:pointer; width:100%;
  display:grid; grid-template-columns:120px 1fr; gap:20px; align-items:baseline;
  padding:20px 0;
}
.axes button:focus-visible{ outline:2px solid var(--gold); outline-offset:4px; }
.axes .ax{ font-family:var(--display); font-size:1.25rem; color:var(--navy); font-weight:400; }
.axes .ax-d{ color:var(--ink-2); font-size:.98rem; }
.axes button[aria-pressed="true"] .ax{ color:var(--gold-text); }
@media (max-width:900px){ .carto{ grid-template-columns:1fr; } .rings{ max-width:420px; } }
@media (max-width:720px){ .rings text{ font-size:21px; letter-spacing:.12em; } }
@media (max-width:480px){ .axes button{ grid-template-columns:1fr; gap:4px; } }

/* ---------- Statement ---------- */
.statement{ text-align:center; }
.statement blockquote{ margin:0 auto; max-width:24ch; font:300 clamp(1.9rem, 4vw, 3.3rem)/1.18 var(--display); color:var(--navy); letter-spacing:-.012em; text-wrap:balance; }
.statement cite{ display:block; margin-top:28px; font-style:normal; font-size:.85rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-text); }

/* ---------- Portrait strip ---------- */
.portrait{ display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:clamp(36px, 7vw, 112px); align-items:center; }
.portrait figure{ margin:0; position:relative; }
.portrait .photo{
  width:100%; aspect-ratio:1; object-fit:cover; border-radius:50%;
  filter:grayscale(.15) contrast(1.02);
}
.portrait figure::after{
  content:""; position:absolute; inset:-14px; border-radius:50%; border:1px solid var(--gold); pointer-events:none;
}
.portrait h2{ margin-bottom:24px; }
.portrait p{ color:var(--ink-2); }
.portrait .actions{ margin-top:32px; }
@media (max-width:820px){ .portrait{ grid-template-columns:1fr; } .portrait figure{ max-width:300px; margin:14px auto 0; } }

/* ---------- Two columns text ---------- */
.split{ display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:clamp(32px, 7vw, 112px); align-items:start; }
.split > :first-child{ position:sticky; top:calc(var(--header) + 32px); }
.split .body p{ color:var(--ink-2); }
.split .body p.big{ font:300 clamp(1.4rem, 2.2vw, 1.8rem)/1.35 var(--display); color:var(--navy); margin-bottom:1.1em; }
@media (max-width:900px){ .split{ grid-template-columns:1fr; } .split > :first-child{ position:static; } }

/* ---------- Scope list (périmètre) ---------- */
.scope{ columns:2; column-gap:clamp(32px, 6vw, 80px); }
.scope li{
  break-inside:avoid; display:flex; gap:16px; align-items:baseline;
  padding:16px 0; border-bottom:1px solid var(--line);
  font-family:var(--display); font-size:clamp(1.12rem, 1.5vw, 1.3rem); color:var(--navy);
}
.scope li::before{ content:""; width:7px; height:7px; border-radius:50%; border:1px solid var(--gold); flex:none; transform:translateY(-2px); }
.scope li span{ display:block; font-family:var(--text); font-size:.95rem; color:var(--ink-2); margin-top:2px; }
@media (max-width:640px){ .scope{ columns:1; } }

/* ---------- Timeline drawn to scale ---------- */
.scale{ margin-top:8px; }
.scale-bar{ position:relative; display:flex; height:56px; align-items:stretch; }
.seg{ position:relative; border-left:1px solid var(--navy); }
.seg::before{ content:""; position:absolute; left:0; right:0; top:50%; height:1px; background:var(--navy); }
.seg.s1{ flex:5; min-width:10px; }
.seg.s2{ flex:90; }
.seg.s3{ flex:120; }
.seg.s3b{ flex:60; border-left:1px dashed var(--gold); }
.seg.s3b::before{ background:none; height:0; border-top:1px dashed var(--gold); }
.seg.s4{ flex:70; border-left:1px solid var(--navy); }
.seg.s4::before{ background:none; height:0; border-top:1px dotted var(--ink-2); }
.seg .dot{ position:absolute; left:-5px; top:calc(50% - 5px); width:9px; height:9px; border-radius:50%; background:#fff; border:1px solid var(--navy); }
.scale-legend{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:clamp(16px, 3vw, 40px); margin-top:36px; }
.scale-legend .when{ font:400 1.6rem/1 var(--display); color:var(--navy); }
.scale-legend .what{ display:block; margin-top:8px; font-size:.82rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-text); }
.scale-legend p{ margin-top:14px; color:var(--ink-2); font-size:.98rem; }
.scale-note{ margin-top:28px; font-size:.85rem; color:var(--ink-2); }
@media (max-width:820px){
  .scale-legend{ grid-template-columns:1fr 1fr; row-gap:36px; }
}
@media (max-width:480px){ .scale-legend{ grid-template-columns:1fr; } }

/* ---------- Formats ---------- */
.formats{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); border-top:1px solid var(--navy); }
.format{ padding:28px clamp(16px, 2vw, 28px) 4px 0; }
.format + .format{ padding-left:clamp(16px, 2vw, 28px); border-left:1px solid var(--line); }
.format .tag{ font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-text); }
.format h3{ margin:0 0 6px; font-size:1.35rem; }
.format .tag{ display:block; margin-bottom:14px; }
.format p{ color:var(--ink-2); font-size:.98rem; }
@media (max-width:980px){
  .formats{ grid-template-columns:1fr 1fr; }
  .format:nth-child(3){ padding-left:0; border-left:0; }
  .format:nth-child(n+3){ border-top:1px solid var(--line); margin-top:24px; }
}
@media (max-width:560px){
  .formats{ grid-template-columns:1fr; }
  .format,.format + .format{ padding-left:0; border-left:0; }
  .format + .format{ border-top:1px solid var(--line); margin-top:20px; }
}

/* ---------- Case study ---------- */
.case{ display:grid; grid-template-columns:minmax(0,4fr) minmax(0,8fr); gap:clamp(32px, 6vw, 96px); }
.case .facts{ border-top:1px solid var(--navy); }
.case .facts div{ padding:18px 0; border-bottom:1px solid var(--line); }
.case .facts dt{ font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-text); }
.case .facts dd{ margin:6px 0 0; font:400 1.2rem/1.35 var(--display); color:var(--navy); }
.steps{ counter-reset:s; }
.steps li{ display:grid; grid-template-columns:150px 1fr; gap:24px; padding:22px 0; border-bottom:1px solid var(--line); }
.steps li:first-child{ border-top:1px solid var(--line-2); }
.steps .t{ font-size:.85rem; color:var(--gold-text); padding-top:4px; }
.steps h3{ font-size:1.25rem; margin-bottom:6px; }
.steps p{ color:var(--ink-2); margin:0; font-size:.98rem; }
@media (max-width:900px){ .case{ grid-template-columns:1fr; } }
@media (max-width:520px){ .steps li{ grid-template-columns:1fr; gap:6px; } }

/* ---------- Path (transmission) ---------- */
.path{ display:grid; grid-template-columns:repeat(6, minmax(0,1fr)); position:relative; padding-top:6px; }
.path::before{ content:""; position:absolute; left:calc(100%/12); right:calc(100%/12); top:30px; height:1px; background:linear-gradient(90deg, var(--navy) 0 80%, var(--gold) 80%); }
.path li{ text-align:center; padding:0 8px; position:relative; }
.path .node{ width:50px; height:50px; margin:5px auto 22px; border-radius:50%; background:#fff; border:1px solid var(--navy); display:grid; place-items:center; position:relative; }
.path .node::after{ content:""; width:8px; height:8px; border-radius:50%; background:var(--gold); }
.path li:last-child .node{ border:1px dashed var(--gold); }
.path li:last-child .node::after{ background:transparent; border:1px solid var(--gold); }
.path h3{ font-size:1.15rem; font-weight:400; hyphens:auto; }
.path p{ margin-top:10px; font-size:.92rem; color:var(--ink-2); }
@media (max-width:1100px){
  .path{ grid-template-columns:1fr; padding-left:0; max-width:620px; }
  .path::before{ left:25px; right:auto; top:30px; bottom:30px; width:1px; height:auto; background:linear-gradient(180deg, var(--navy) 0 82%, var(--gold) 82%); }
  .path li{ display:grid; grid-template-columns:50px 1fr; gap:22px; text-align:left; padding:0 0 26px; }
  .path .node{ margin:0; }
  .path p{ margin-top:6px; }
}

/* ---------- Criteria (reprise) ---------- */
.criteria{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); border-top:1px solid var(--navy); }
.criteria div{ padding:26px clamp(16px, 2.4vw, 32px) 30px 0; border-bottom:1px solid var(--line); }
.criteria div:not(:nth-child(3n+1)){ padding-left:clamp(16px, 2.4vw, 32px); border-left:1px solid var(--line); }
.criteria dt{ font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-text); }
.criteria dd{ margin:10px 0 0; font:300 clamp(1.4rem, 2.2vw, 1.9rem)/1.2 var(--display); color:var(--navy); }
.criteria dd small{ display:block; margin-top:8px; font:400 .95rem/1.5 var(--text); color:var(--ink-2); }
@media (max-width:860px){
  .criteria{ grid-template-columns:1fr 1fr; }
  .criteria div:not(:nth-child(3n+1)){ padding-left:0; border-left:0; }
  .criteria div:nth-child(2n){ padding-left:clamp(16px, 3vw, 28px); border-left:1px solid var(--line); }
}
@media (max-width:520px){
  .criteria{ grid-template-columns:1fr; }
  .criteria div:nth-child(2n){ padding-left:0; border-left:0; }
}

/* ---------- Simple list with gold dots ---------- */
.dots li{ display:flex; gap:16px; align-items:baseline; padding:12px 0; color:var(--ink); }
.dots li::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--gold); flex:none; transform:translateY(-2px); }

/* ---------- Note ---------- */
.note{ border-top:1px solid var(--gold); padding-top:22px; font-size:.95rem; color:var(--ink-2); max-width:70ch; }
.note strong{ font-weight:600; }

/* ---------- FAQ ---------- */
.faq{ border-top:1px solid var(--line-2); }
.faq details{ border-bottom:1px solid var(--line); }
.faq summary{
  list-style:none; cursor:pointer; display:flex; justify-content:space-between; gap:24px; align-items:center;
  padding:24px 0; font:400 clamp(1.1rem, 1.5vw, 1.28rem)/1.35 var(--display); color:var(--navy);
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary .pm{ width:30px; height:30px; flex:none; border:1px solid var(--line-2); border-radius:50%; position:relative; transition:border-color .3s, transform .4s var(--ease); }
.faq summary .pm::before,.faq summary .pm::after{ content:""; position:absolute; left:50%; top:50%; width:11px; height:1px; background:var(--navy); transform:translate(-50%,-50%); }
.faq summary .pm::after{ transform:translate(-50%,-50%) rotate(90deg); transition:transform .4s var(--ease); }
.faq details[open] summary .pm{ border-color:var(--gold); }
.faq details[open] summary .pm::after{ transform:translate(-50%,-50%) rotate(0); }
.faq summary:hover .pm{ border-color:var(--gold); }
.faq .a{ padding:0 0 28px; color:var(--ink-2); max-width:68ch; }

/* ---------- Close / CTA ---------- */
.close{ text-align:center; position:relative; overflow:hidden; }
.close .ring{ position:absolute; left:50%; top:50%; width:min(820px, 140vw); aspect-ratio:1; transform:translate(-50%,-50%); pointer-events:none; }
.close .ring circle{ fill:none; stroke:var(--gold); vector-effect:non-scaling-stroke; }
.close .content{ position:relative; max-width:620px; margin:0 auto; }
.close h2{ margin-bottom:22px; }
.close p{ color:var(--ink-2); margin:0 auto; max-width:44ch; }
.close .actions{ justify-content:center; margin-top:36px; }
.close .mail{ display:block; margin-top:22px; font-size:.92rem; color:var(--ink-2); }

/* ---------- Contact ---------- */
.contact{ display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:clamp(40px, 7vw, 112px); align-items:start; }
.contact .info p{ color:var(--ink-2); }
.contact .email{ font:400 clamp(1.1rem, 1.8vw, 1.4rem)/1.3 var(--display); color:var(--navy); word-break:break-word; }
.form{ display:grid; gap:26px; }
.form .two{ display:grid; grid-template-columns:1fr 1fr; gap:26px; }
.field label{ display:block; font-size:.85rem; letter-spacing:.01em; color:var(--ink-2); margin-bottom:8px; }
.field label .opt{ color:#6b7488; }
.field input,.field select,.field textarea{
  width:100%; font:400 1.02rem/1.4 var(--text); color:var(--navy);
  background:transparent; border:0; border-bottom:1px solid var(--line-2); border-radius:0;
  padding:10px 0 12px; transition:border-color .3s;
  appearance:none; -webkit-appearance:none;
}
.field select{ background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%23b08d4f' stroke-width='1.5'/%3E%3C/svg%3E") right 2px center / 16px no-repeat; padding-right:28px; cursor:pointer; }
.field textarea{ min-height:150px; resize:vertical; }
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-bottom-color:var(--gold); }
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{ box-shadow:0 1px 0 0 var(--gold); }
.field input::placeholder,.field textarea::placeholder{ color:#6b7488; }
.field.invalid input,.field.invalid select,.field.invalid textarea{ border-bottom-color:#a3362a; }
.field .err{ display:none; font-size:.85rem; color:#a3362a; margin-top:6px; }
.field.invalid .err{ display:block; }
.form-status{ font-size:.92rem; color:var(--ink-2); min-height:1.4em; }
.form-status.ok{ color:#2f6b47; }
.choices{ display:flex; flex-wrap:wrap; gap:10px; }
.choices label{ margin:0; }
.choices input{ position:absolute; opacity:0; width:1px; height:1px; }
.choices span{
  display:inline-block; padding:.65em 1.1em; border:1px solid var(--line-2); border-radius:999px;
  font-size:.9rem; letter-spacing:0; color:var(--ink); cursor:pointer; transition:border-color .2s, background .2s, color .2s;
}
.choices span:hover{ border-color:var(--gold); }
.choices input:checked + span{ background:var(--navy); border-color:var(--navy); color:#fff; }
.choices input:focus-visible + span{ outline:2px solid var(--gold); outline-offset:3px; }
fieldset{ border:0; padding:0; margin:0; }
legend{ font-size:.85rem; letter-spacing:.01em; color:var(--ink-2); margin-bottom:12px; padding:0; }
@media (max-width:900px){ .contact{ grid-template-columns:1fr; } }
@media (max-width:560px){ .form .two{ grid-template-columns:1fr; } }

/* ---------- Footer ---------- */
.site-footer{ border-top:1px solid var(--line); padding:clamp(64px, 8vw, 96px) 0 36px; background:var(--white); }
.foot{ display:grid; grid-template-columns:auto 1fr 1fr 1fr; gap:clamp(32px, 5vw, 72px); align-items:start; }
.cachet{ width:132px; height:132px; color:var(--navy); }
.cachet text{ font:500 8.4px var(--display); letter-spacing:2.1px; fill:var(--navy); text-transform:uppercase; }
.cachet circle{ fill:none; stroke:var(--gold); }
.foot h4{ font:500 .76rem/1 var(--text); letter-spacing:.18em; text-transform:uppercase; color:var(--gold-text); margin-bottom:18px; }
.foot li{ padding:5px 0; }
.foot a{ text-decoration:none; color:var(--ink-2); font-size:.95rem; }
.foot a:hover{ color:var(--navy); text-decoration:underline; }
.foot p{ color:var(--ink-2); font-size:.95rem; }
.legal-row{ margin-top:clamp(48px, 6vw, 72px); padding-top:24px; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px 32px; font-size:.84rem; color:var(--ink-2); }
.legal-row a{ color:var(--ink-2); }
@media (max-width:900px){ .foot{ grid-template-columns:1fr 1fr; } .foot .cachet-col{ grid-column:1 / -1; } }
@media (max-width:520px){ .foot{ grid-template-columns:1fr; } }

/* ---------- Legal page ---------- */
.legal h2{ font-size:1.6rem; margin:56px 0 18px; }
.legal p{ color:var(--ink-2); }

/* ---------- Reveal ---------- */


@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .js .plate-rim .filet{ opacity:1; }
  *{ transition-duration:.01ms!important; }
}
