/* ─── Cabinet Concierge — Mon Assistant Cyber ───────────────── */

:root{
  --cream:#F0EBE0;
  --paper:#E8E1D2;
  --ink:#2C1810;
  --ink-2:#4a2e1f;
  --sand:#D4A574;
  --terracotta:#7A3B2E;
  --accent:var(--terracotta);
  --rule:rgba(44,24,16,.18);
  --rule-strong:rgba(44,24,16,.45);
  --retro:1;
}
[data-palette="cabinet"]{
  --cream:#F0EBE0; --paper:#E8E1D2; --ink:#2C1810; --ink-2:#4a2e1f;
  --sand:#D4A574; --terracotta:#7A3B2E;
}
[data-palette="salon"]{
  --cream:#EFEAE0; --paper:#E6E0D2; --ink:#1A2B4A; --ink-2:#293c5e;
  --sand:#E8C26B; --terracotta:#C44536;
}
[data-palette="bureau"]{
  --cream:#EBE7DD; --paper:#DFDAC9; --ink:#0D2818; --ink-2:#1f3d2a;
  --sand:#C9A24F; --terracotta:#A8472C;
}
[data-palette="bistro"]{
  --cream:#F2EAD8; --paper:#E8DEC4; --ink:#3B0E12; --ink-2:#5a1d22;
  --sand:#E8B847; --terracotta:#B83C2A;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--cream);
  color:var(--ink);
  font-family:"Newsreader", Georgia, serif;
  font-size:18px;line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:1;
  opacity:calc(.18 + var(--retro,1)*.22);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.17 0 0 0 0 0.09 0 0 0 0 0.06 0 0 0 0.18 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  mix-blend-mode:multiply;
}
::selection{background:var(--terracotta);color:var(--cream)}
a{color:inherit;text-decoration:none}

/* Type */
.serif{font-family:"DM Serif Display","Newsreader",serif;font-weight:400}
.italic{font-style:italic}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace}
.smallcaps{font-variant-caps:all-small-caps;letter-spacing:.18em;font-weight:600}
.eyebrow{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-2)}
h1,h2,h3{margin:0;font-family:"DM Serif Display",serif;font-weight:400;color:var(--ink)}
p{margin:0}

/* Layout */
.container{max-width:1240px;margin:0 auto;padding:0 40px;position:relative;z-index:2}
.section{padding:120px 0;border-top:.5px solid var(--rule);position:relative}
.section:first-of-type{border-top:none}
.sec-num{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-2);display:flex;align-items:center;gap:14px;margin-bottom:48px}
.sec-num::after{content:"";flex:1;height:.5px;background:var(--rule)}
.sec-num .star{display:inline-block;width:10px;height:10px;background:var(--accent);transform:rotate(45deg)}

/* Nav */
.nav{position:sticky;top:0;z-index:50;background:color-mix(in oklab,var(--cream) 92%,transparent);backdrop-filter:saturate(140%) blur(8px);border-bottom:.5px solid var(--rule)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:16px 40px;max-width:1320px;margin:0 auto}
.brand{display:flex;align-items:center;gap:12px;font-family:"DM Serif Display",serif;font-size:22px;letter-spacing:-.01em}
.brand-mark{width:34px;height:34px;border-radius:50%;background:var(--ink);display:grid;place-items:center;color:var(--cream);font-family:"DM Serif Display",serif;font-style:italic;font-size:18px;line-height:1}
.brand-name{display:flex;flex-direction:column;line-height:1}
.brand-name b{font-weight:400}
.brand-name small{font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-2);margin-top:3px}
.nav-links{display:flex;gap:32px;align-items:center;font-size:15px}
.nav-links a{position:relative;padding:6px 0}
.nav-links a:hover{color:var(--terracotta)}
.nav-cta{display:flex;align-items:center;gap:12px}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;border-radius:0;font-family:"Newsreader",serif;font-size:16px;font-weight:500;cursor:pointer;border:.5px solid var(--ink);background:var(--ink);color:var(--cream);transition:transform .15s ease,background .15s ease,box-shadow .15s ease;letter-spacing:.01em;text-align:left}
.btn:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--ink)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--cream)}
.btn.terracotta{background:var(--terracotta);border-color:var(--terracotta);color:var(--cream)}
.btn.terracotta:hover{box-shadow:4px 4px 0 var(--ink)}
.btn.sm{padding:10px 16px;font-size:14px}

/* Hero */
.hero{padding:64px 0 80px;position:relative}
.hero-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:64px;align-items:center}
.hero-eyebrow{display:inline-flex;align-items:center;gap:10px;margin-bottom:28px;padding:6px 12px;border:.5px solid var(--rule-strong);background:var(--paper);font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase}
.hero-eyebrow .dot{width:6px;height:6px;background:var(--terracotta);border-radius:50%;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.hero h1{font-size:clamp(48px,6vw,84px);line-height:1.02;letter-spacing:-.02em;margin-bottom:24px}
.hero h1 em{color:var(--terracotta);font-family:"DM Serif Display",serif}
.hero h1 .underline{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px;text-decoration-color:var(--sand)}
.hero-lede{font-size:20px;line-height:1.5;color:var(--ink-2);max-width:520px;margin-bottom:32px}
.hero-ctas{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.hero-perks{display:flex;gap:24px;margin:32px 0 0;padding:0;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);flex-wrap:wrap;list-style:none}
.hero-perks li{display:flex;align-items:center;gap:8px}
.hero-perks svg{width:14px;height:14px}

/* Lucien card */
.lucien-card{position:relative;background:var(--paper);border:.5px solid var(--ink);padding:24px;box-shadow:8px 8px 0 var(--ink);transform:rotate(calc(-1.2deg * var(--retro,1)))}
.lucien-card::before{content:"";position:absolute;inset:8px;border:.5px solid var(--rule-strong);pointer-events:none}
.lucien-corner{position:absolute;width:14px;height:14px;border:.5px solid var(--ink);background:var(--cream)}
.lucien-corner.tl{top:-7px;left:-7px}.lucien-corner.tr{top:-7px;right:-7px}
.lucien-corner.bl{bottom:-7px;left:-7px}.lucien-corner.br{bottom:-7px;right:-7px}
.lucien-portrait{aspect-ratio:4/5;background:var(--cream);border:.5px solid var(--rule-strong);display:grid;place-items:center;position:relative;overflow:hidden}
.lucien-portrait svg{width:78%;height:auto}
.lucien-name{display:flex;align-items:baseline;justify-content:space-between;margin-top:18px;padding-top:14px;border-top:.5px solid var(--rule)}
.lucien-name .n{font-family:"DM Serif Display",serif;font-size:28px;font-style:italic}
.lucien-name .id{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2)}
.lucien-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px;font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}
.lucien-meta div{display:flex;flex-direction:column;gap:2px}
.lucien-meta b{color:var(--ink);font-weight:500}

.stamp{position:absolute;border:1.5px solid var(--terracotta);color:var(--terracotta);padding:8px 14px;font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.22em;text-transform:uppercase;background:var(--cream);transform:rotate(calc(-8deg * var(--retro,1)));box-shadow:3px 3px 0 var(--terracotta);z-index:3}
.stamp.s2{transform:rotate(calc(6deg * var(--retro,1)))}

/* Demo */
.demo-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:64px;align-items:start}
.demo-copy h2{font-size:clamp(36px,4.2vw,56px);line-height:1.05;letter-spacing:-.015em;margin-bottom:20px}
.demo-copy h2 em{color:var(--terracotta);font-style:italic}
.demo-copy p{font-size:18px;color:var(--ink-2);max-width:480px;margin-bottom:28px}
.demo-steps{display:flex;flex-direction:column;gap:0;margin-top:32px}
.demo-step{display:flex;gap:16px;align-items:flex-start;padding:18px 0;border-top:.5px solid var(--rule)}
.demo-step:last-child{border-bottom:.5px solid var(--rule)}
.demo-step .n{font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--ink-2);letter-spacing:.14em;min-width:32px;padding-top:4px}
.demo-step b{font-family:"DM Serif Display",serif;font-weight:400;font-size:20px;display:block;margin-bottom:4px}
.demo-step small{font-size:14px;color:var(--ink-2);line-height:1.5}

/* Email mockup */
.email-stage{position:relative}
.email-card{background:var(--paper);border:.5px solid var(--ink);box-shadow:6px 6px 0 var(--ink);overflow:hidden;position:relative}
.email-bar{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:.5px solid var(--rule-strong);background:color-mix(in oklab,var(--paper) 60%,var(--cream))}
.email-bar .dots{display:flex;gap:6px}
.email-bar .dots i{width:9px;height:9px;border-radius:50%;display:block;font-style:normal}
.email-bar .dots i:nth-child(1){background:var(--terracotta);opacity:.6}
.email-bar .dots i:nth-child(2){background:var(--sand);opacity:.8}
.email-bar .dots i:nth-child(3){background:var(--ink);opacity:.25}
.email-bar .addr{font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--ink-2)}
.email-body{padding:20px 22px;font-size:14px;line-height:1.5}
.email-meta{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--ink-2);margin-bottom:14px}
.email-meta b{color:var(--ink);font-weight:500;word-break:break-all}
.email-subject{font-family:"DM Serif Display",serif;font-size:18px;margin-bottom:10px}
.email-text{color:var(--ink-2);font-size:14px}
.email-text .link-warn{color:var(--terracotta);text-decoration:underline;word-break:break-all}
.forward-pill{display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:6px 10px;background:var(--cream);border:.5px dashed var(--ink);font-family:"JetBrains Mono",monospace;font-size:11px}

.reply-card{margin-top:18px;background:var(--ink);color:var(--cream);border:.5px solid var(--ink);box-shadow:6px 6px 0 var(--terracotta);padding:22px;position:relative;transform:translateX(20px)}
.reply-card .hd{display:flex;justify-content:space-between;align-items:center;border-bottom:.5px solid rgba(240,235,224,.2);padding-bottom:12px;margin-bottom:14px}
.reply-card .hd .from{display:flex;align-items:center;gap:10px;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.reply-card .hd .from .av{width:22px;height:22px;border-radius:50%;background:var(--sand);color:var(--ink);display:grid;place-items:center;font-family:"DM Serif Display",serif;font-style:italic;font-size:12px}
.reply-card .hd .time{font-family:"JetBrains Mono",monospace;font-size:10px;opacity:.7}
.reply-card .verdict{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.reply-card .verdict .badge{padding:6px 12px;background:var(--terracotta);border:.5px solid var(--cream);font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.22em;text-transform:uppercase}
.reply-card .verdict .score{font-family:"DM Serif Display",serif;font-style:italic;font-size:32px;line-height:1}
.reply-card .verdict .score small{font-size:14px;opacity:.6;font-style:normal}
.reply-card p.reply-text{font-size:15px;line-height:1.55;color:#E8DFD0;font-family:"Newsreader",serif}
.reply-card p.reply-text em{color:var(--sand);font-style:italic}
.reply-card ul.flags{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-direction:column;gap:8px}
.reply-card ul.flags li{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:#E8DFD0}
.reply-card ul.flags li::before{content:"⚑";color:var(--sand);margin-top:2px}
.reply-card .sig{margin-top:18px;padding-top:14px;border-top:.5px solid rgba(240,235,224,.2);font-family:"DM Serif Display",serif;font-style:italic;font-size:16px;color:var(--sand)}

/* Comparatif */
.compar{display:grid;grid-template-columns:1fr 1fr;gap:0;border:.5px solid var(--ink);box-shadow:8px 8px 0 var(--ink);background:var(--paper)}
.compar>div{padding:36px 32px;position:relative}
.compar>div+div{border-left:.5px solid var(--ink)}
.compar .col-them{background:repeating-linear-gradient(135deg,var(--paper) 0 6px,color-mix(in oklab,var(--paper) 92%,var(--ink-2)) 6px 7px)}
.compar h3{font-family:"DM Serif Display",serif;font-size:32px;margin-bottom:6px}
.compar h3 em{font-style:italic;color:var(--terracotta)}
.compar .col-them h3 em{color:var(--ink-2);text-decoration:line-through;text-decoration-thickness:1px}
.compar .tag{display:inline-block;font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.22em;text-transform:uppercase;padding:4px 10px;border:.5px solid var(--rule-strong);margin-bottom:22px}
.compar ul{list-style:none;padding:0;margin:24px 0 0;display:flex;flex-direction:column;gap:14px}
.compar li{display:flex;gap:14px;font-size:16px;line-height:1.45;align-items:flex-start}
.compar li .ico{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-family:"DM Serif Display",serif;font-style:italic;font-size:14px;margin-top:2px}
.compar .col-them .ico{background:var(--ink-2);color:var(--cream);opacity:.7}
.compar .col-us .ico{background:var(--terracotta);color:var(--cream)}
.compar li small{display:block;color:var(--ink-2);font-size:13px;margin-top:2px}
.compar h2-headline{display:block;font-family:"DM Serif Display",serif;font-size:clamp(36px,4vw,52px);line-height:1.05;margin-bottom:14px;max-width:900px}

/* Parents */
.parents{background:var(--ink);color:var(--cream);position:relative}
.parents .sec-num{color:rgba(240,235,224,.6)}
.parents .sec-num::after{background:rgba(240,235,224,.18)}
.parents-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:80px;align-items:center}
.parents h2{color:var(--cream);font-size:clamp(40px,4.6vw,60px);line-height:1.05;letter-spacing:-.015em;margin-bottom:24px}
.parents h2 em{color:var(--sand);font-style:italic}
.parents p{color:rgba(240,235,224,.78);font-size:19px;max-width:520px;margin-bottom:24px}
.parents-bullets{margin-top:32px;display:flex;flex-direction:column;gap:14px}
.parents-bullets>div{display:flex;gap:14px;align-items:flex-start}
.parents-bullets .b{flex:none;width:28px;height:28px;border:.5px solid var(--sand);color:var(--sand);display:grid;place-items:center;font-family:"DM Serif Display",serif;font-style:italic;font-size:14px}
.parents-bullets p{color:var(--cream);margin:0;font-size:16px}
.parents-bullets p small{display:block;color:rgba(240,235,224,.6);font-size:14px;margin-top:2px}
.quote-card{background:var(--cream);color:var(--ink);padding:32px;position:relative;border:.5px solid var(--cream);box-shadow:8px 8px 0 var(--terracotta);transform:rotate(calc(1.5deg * var(--retro,1)))}
.quote-card .q-mark{font-family:"DM Serif Display",serif;font-size:80px;line-height:.6;color:var(--terracotta);font-style:italic;margin-bottom:6px}
.quote-card blockquote{margin:0;font-family:"DM Serif Display",serif;font-size:22px;line-height:1.3;font-style:italic}
.quote-card cite{display:block;margin-top:18px;font-style:normal;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-2)}

/* Scams */
.scams h2{font-size:clamp(40px,4.6vw,60px);line-height:1.05;letter-spacing:-.015em;margin-bottom:16px;max-width:880px}
.scams h2 em{color:var(--terracotta);font-style:italic}
.scams .lede{color:var(--ink-2);font-size:18px;max-width:640px;margin-bottom:56px}
.scam-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:24px}
.scam-card{background:var(--paper);border:.5px solid var(--ink);padding:24px;position:relative;transition:transform .2s ease,box-shadow .2s ease;display:flex;flex-direction:column}
.scam-card:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--ink)}
.scam-card .img{aspect-ratio:4/3;border:.5px solid var(--rule-strong);display:grid;place-items:center;font-family:"JetBrains Mono",monospace;font-size:10px;color:var(--ink);letter-spacing:.16em;text-transform:uppercase;margin-bottom:18px;position:relative;overflow:hidden}
.scam-card .img.brad{background:linear-gradient(135deg,color-mix(in oklab,var(--terracotta) 70%,var(--cream)),color-mix(in oklab,var(--sand) 60%,var(--cream)))}
.scam-card .img.vinted{background:linear-gradient(135deg,color-mix(in oklab,var(--ink) 22%,var(--cream)),color-mix(in oklab,var(--terracotta) 35%,var(--cream)))}
.scam-card .img.colis{background:linear-gradient(135deg,color-mix(in oklab,var(--sand) 50%,var(--cream)),color-mix(in oklab,var(--terracotta) 30%,var(--cream)))}
.scam-card .img.fuite{background:linear-gradient(135deg,color-mix(in oklab,var(--ink) 35%,var(--cream)),color-mix(in oklab,var(--sand) 40%,var(--cream)))}
.scam-card .img.banque{background:repeating-linear-gradient(45deg,var(--paper) 0 8px,color-mix(in oklab,var(--paper) 88%,var(--ink)) 8px 9px)}
.scam-card .img.wa{background:linear-gradient(135deg,color-mix(in oklab,var(--ink) 25%,var(--cream)),color-mix(in oklab,var(--terracotta) 22%,var(--cream)))}
.scam-card .img span{background:var(--cream);padding:6px 10px;border:.5px solid var(--rule-strong);transform:rotate(calc(-4deg * var(--retro,1)))}
.scam-card .cat{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--terracotta);margin-bottom:10px}
.scam-card h3{font-family:"DM Serif Display",serif;font-size:22px;line-height:1.15;margin-bottom:10px}
.scam-card p{font-size:14px;color:var(--ink-2);line-height:1.5;flex:1}
.scam-card .footer{display:flex;justify-content:space-between;align-items:center;margin-top:18px;padding-top:14px;border-top:.5px solid var(--rule);font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-2)}
.scam-card .footer .arrow{font-family:"Newsreader",serif;font-size:18px;text-transform:none;letter-spacing:0;color:var(--terracotta)}
.scam-card.feat{grid-column:span 6}
.scam-card.std{grid-column:span 4}
.scam-card.feat .img{aspect-ratio:16/9}

/* Pricing */
.pricing-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px;align-items:stretch}
.price-card{background:var(--paper);border:.5px solid var(--ink);padding:32px;display:flex;flex-direction:column;gap:18px;position:relative}
.price-card.feat{background:var(--ink);color:var(--cream);transform:translateY(-8px);box-shadow:8px 8px 0 var(--terracotta)}
.price-card.feat .label,.price-card.feat ul li,.price-card.feat .ttl,.price-card.feat .price{color:var(--cream)}
.price-card .label{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
.price-card .ttl{font-family:"DM Serif Display",serif;font-size:34px;line-height:1.05}
.price-card .ttl em{font-style:italic;color:var(--terracotta)}
.price-card.feat .ttl em{color:var(--sand)}
.price-card .price{font-family:"DM Serif Display",serif;font-size:42px;line-height:1}
.price-card .price small{font-size:14px;font-family:"Newsreader",serif;color:var(--ink-2);font-style:italic}
.price-card.feat .price small{color:rgba(240,235,224,.7)}
.price-card ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;font-size:15px;flex:1}
.price-card ul li{display:flex;gap:10px;align-items:flex-start}
.price-card ul li::before{content:"✓";color:var(--terracotta);font-weight:700}
.price-card.feat ul li::before{color:var(--sand)}
.price-card .ribbon{position:absolute;top:-12px;right:18px;background:var(--terracotta);color:var(--cream);padding:6px 12px;font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.22em;text-transform:uppercase;border:.5px solid var(--cream)}
.price-card.feat .btn{background:var(--sand);border-color:var(--sand);color:var(--ink)}
.price-card.feat .btn:hover{box-shadow:4px 4px 0 var(--terracotta)}

/* Ressources teaser */
.ress-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:48px;flex-wrap:wrap}
.ress-head h2{font-size:clamp(36px,4.2vw,52px);line-height:1.05;letter-spacing:-.015em;max-width:680px}
.ress-head h2 em{color:var(--terracotta);font-style:italic}
.ress-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px 28px}
.ress-card{display:flex;flex-direction:column;gap:14px;padding:0;text-align:left}
.ress-card .img{aspect-ratio:4/3;border:.5px solid var(--rule-strong);background:repeating-linear-gradient(135deg,var(--paper) 0 8px,color-mix(in oklab,var(--paper) 88%,var(--ink-2)) 8px 9px);display:grid;place-items:center;color:var(--ink-2);font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.18em;text-transform:uppercase}
.ress-card .img.a{background:linear-gradient(135deg,color-mix(in oklab,var(--terracotta) 40%,var(--cream)),color-mix(in oklab,var(--sand) 50%,var(--cream)))}
.ress-card .img.b{background:linear-gradient(135deg,color-mix(in oklab,var(--ink) 30%,var(--cream)),color-mix(in oklab,var(--terracotta) 25%,var(--cream)))}
.ress-card .img.c{background:linear-gradient(135deg,color-mix(in oklab,var(--sand) 55%,var(--cream)),color-mix(in oklab,var(--ink) 18%,var(--cream)))}
.ress-card .img span{background:var(--cream);padding:5px 10px;border:.5px solid var(--rule-strong)}
.ress-card .cat{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--terracotta)}
.ress-card h3{font-family:"DM Serif Display",serif;font-size:22px;line-height:1.2}
.ress-card .meta{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.ress-card:hover h3{color:var(--terracotta)}

/* FAQ */
.faq-grid{display:grid;grid-template-columns:1fr 2fr;gap:80px;align-items:start}
.faq h2{font-size:clamp(36px,4.2vw,52px);line-height:1.05;letter-spacing:-.015em;margin-bottom:16px}
.faq h2 em{color:var(--terracotta);font-style:italic}
.faq .lede{color:var(--ink-2);font-size:17px;max-width:360px}
.faq-list details{border-top:.5px solid var(--rule-strong);padding:24px 0;cursor:pointer}
.faq-list details:last-child{border-bottom:.5px solid var(--rule-strong)}
.faq-list summary{display:flex;justify-content:space-between;align-items:center;font-family:"DM Serif Display",serif;font-size:22px;list-style:none;line-height:1.3;gap:24px}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"+";font-family:"DM Serif Display",serif;font-size:28px;color:var(--terracotta);transition:transform .2s;flex:none}
.faq-list details[open] summary::after{content:"–"}
.faq-list .ans{padding-top:14px;color:var(--ink-2);font-size:16px;line-height:1.6;max-width:680px}

/* Final CTA */
.final{background:var(--terracotta);color:var(--cream);position:relative;overflow:hidden;border-top:.5px solid var(--ink)}
.final::before{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(45deg,rgba(0,0,0,0) 0 16px,rgba(0,0,0,.04) 16px 17px);pointer-events:none}
.final-inner{display:grid;grid-template-columns:1.2fr 1fr;gap:64px;align-items:center;position:relative}
.final h2{color:var(--cream);font-size:clamp(48px,6vw,76px);line-height:1;letter-spacing:-.02em}
.final h2 em{color:var(--sand);font-style:italic}
.final p{color:color-mix(in oklab,var(--cream) 88%,var(--terracotta));max-width:480px;margin:20px 0 28px;font-size:18px}
.final .btn{background:var(--cream);color:var(--ink);border-color:var(--cream)}
.final .btn:hover{box-shadow:4px 4px 0 var(--ink)}
.final .ghost{background:transparent;color:var(--cream);border-color:var(--cream)}
.final .ghost:hover{background:var(--cream);color:var(--terracotta)}
.final-aside{font-family:"DM Serif Display",serif;font-style:italic;font-size:28px;line-height:1.25;color:var(--cream);text-align:right}
.final-aside small{display:block;margin-top:18px;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-style:normal;color:color-mix(in oklab,var(--cream) 80%,var(--terracotta))}

/* Footer */
footer{background:var(--ink);color:var(--cream);padding:64px 0 32px;font-size:14px}
footer .container{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px}
footer h4{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--sand);margin:0 0 16px;font-weight:500}
footer ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
footer ul a{color:color-mix(in oklab,var(--cream) 75%,var(--ink));transition:color .15s}
footer ul a:hover{color:var(--sand)}
footer .brand-line{display:flex;align-items:center;gap:12px;margin-bottom:18px}
footer .brand-line .brand-mark{background:var(--cream);color:var(--ink)}
footer .blurb{color:color-mix(in oklab,var(--cream) 65%,var(--ink));max-width:320px;font-family:"DM Serif Display",serif;font-style:italic;font-size:17px;line-height:1.4}
footer .bottom{grid-column:1/-1;margin-top:48px;padding-top:24px;border-top:.5px solid rgba(240,235,224,.18);display:flex;justify-content:space-between;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:color-mix(in oklab,var(--cream) 55%,var(--ink));gap:24px;flex-wrap:wrap}

/* Ornament */
.ornament-row{display:flex;justify-content:center;gap:20px;align-items:center;color:var(--terracotta);opacity:calc(.25 + var(--retro,1)*.55);margin:40px 0}
.ornament-row .line{width:80px;height:.5px;background:currentColor}
.ornament-row .diamond{width:8px;height:8px;background:currentColor;transform:rotate(45deg)}

/* Article (ressources) */
.article-hero{padding:64px 0 40px}
.article-hero .crumbs{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2);margin-bottom:24px;display:flex;gap:12px;align-items:center}
.article-hero .crumbs a:hover{color:var(--terracotta)}
.article-hero h1{font-size:clamp(40px,5.4vw,72px);line-height:1.02;letter-spacing:-.02em;margin-bottom:24px;max-width:980px}
.article-hero h1 em{color:var(--terracotta);font-style:italic}
.article-meta{display:flex;gap:32px;flex-wrap:wrap;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-2);padding:18px 0;border-top:.5px solid var(--rule);border-bottom:.5px solid var(--rule)}
.article-meta b{color:var(--ink);font-weight:500}
.article-body{padding:72px 0;display:grid;grid-template-columns:220px 1fr 220px;gap:64px;align-items:start}
.article-toc{position:sticky;top:96px;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);display:flex;flex-direction:column;gap:10px}
.article-toc .lbl{color:var(--terracotta)}
.article-toc a{padding:8px 0;border-top:.5px solid var(--rule);display:block}
.article-toc a:hover{color:var(--ink)}
.article-prose{max-width:680px;font-size:18px;line-height:1.65;color:var(--ink)}
.article-prose>p,.article-prose>ul{margin-bottom:24px}
.article-prose .lead{font-size:22px;line-height:1.5;font-style:italic;color:var(--ink-2);margin-bottom:40px;border-left:3px solid var(--terracotta);padding-left:24px}
.article-prose h2{font-family:"DM Serif Display",serif;font-size:36px;line-height:1.1;margin:56px 0 18px;letter-spacing:-.01em}
.article-prose h3{font-family:"DM Serif Display",serif;font-size:24px;line-height:1.2;margin:36px 0 12px}
.article-prose h2 em,.article-prose h3 em{color:var(--terracotta);font-style:italic}
.article-prose ul{padding-left:24px}
.article-prose ul li{margin-bottom:8px}
.article-prose blockquote{margin:36px 0;padding:24px 28px;background:var(--paper);border-left:3px solid var(--terracotta);font-family:"DM Serif Display",serif;font-style:italic;font-size:22px;line-height:1.35}
.article-prose blockquote cite{display:block;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);font-style:normal;margin-top:14px}
.article-prose .callout{margin:36px 0;padding:28px;border:.5px solid var(--ink);background:var(--paper);box-shadow:6px 6px 0 var(--ink);position:relative}
.article-prose .callout b{font-family:"DM Serif Display",serif;font-size:22px;font-weight:400;display:block;margin-bottom:10px}
.article-prose .callout .stamp-lbl{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--terracotta);margin-bottom:8px;display:block}
.article-prose .figure{margin:36px 0}
.article-prose .figure .img{aspect-ratio:16/9;border:.5px solid var(--rule-strong);background:linear-gradient(135deg,color-mix(in oklab,var(--terracotta) 45%,var(--cream)),color-mix(in oklab,var(--sand) 60%,var(--cream)));display:grid;place-items:center;font-family:"JetBrains Mono",monospace;font-size:10px;color:var(--ink);letter-spacing:.18em;text-transform:uppercase}
.article-prose .figure .img span{background:var(--cream);padding:6px 10px;border:.5px solid var(--rule-strong);transform:rotate(calc(-3deg * var(--retro,1)))}
.article-prose .figure figcaption{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);margin-top:10px}
.article-aside{position:sticky;top:96px;display:flex;flex-direction:column;gap:18px}
.article-aside .card{padding:20px;border:.5px solid var(--ink);background:var(--paper);box-shadow:5px 5px 0 var(--ink)}
.article-aside .card .ttl{font-family:"DM Serif Display",serif;font-size:20px;line-height:1.15;margin-bottom:10px;font-style:italic}
.article-aside .card p{font-size:13px;color:var(--ink-2);line-height:1.5;margin-bottom:14px}
.article-aside .card .btn{font-size:13px;padding:10px 14px;width:100%;justify-content:center}
.article-aside .meta-list{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);display:flex;flex-direction:column;gap:8px}
.article-aside .meta-list>div{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:.5px solid var(--rule)}
.article-aside .meta-list>div b{color:var(--ink);font-weight:500}

/* Responsive */
@media (max-width: 1080px){
  .article-body{grid-template-columns:1fr;gap:40px}
  .article-toc,.article-aside{position:static}
}
@media (max-width: 960px){
  .hero-grid,.demo-grid,.compar,.parents-grid,.final-inner,.faq-grid{grid-template-columns:1fr;gap:40px}
  .compar>div+div{border-left:none;border-top:.5px solid var(--ink)}
  .scam-card.feat,.scam-card.std{grid-column:span 12}
  .pricing-grid,.ress-grid{grid-template-columns:1fr}
  .nav-links{display:none}
  footer .container{grid-template-columns:1fr 1fr;gap:32px}
  .final-aside{text-align:left}
  .section{padding:80px 0}
  .container{padding:0 24px}
  .nav-inner{padding:14px 24px}
}