:root{
  --gold:#C9A84C; --gold-deep:#8A6F22; --gold-wash:#F7EEDC; --line-gold:rgba(201,168,76,.34); --card:#FDFAF5;
  --magenta:#F8007E; --magenta-soft:#FF4DA0;
  /* the brand pink deepened for small text: 4.8:1 on cream, where #F8007E is only 3.7:1 */
  --magenta-ink:#D6006B;
  --ink:#0F0F0F; --charcoal:#2A2A2A; --grey:#63635E; --grey-soft:#8E8E88;
  --paper:#FAF6F0; --paper-deep:#F4EDE3;
  --line:rgba(15,15,15,.12); --line-soft:rgba(15,15,15,.06);
  --serif:'Playfair Display',Georgia,serif;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
}*{box-sizing:border-box;margin:0;padding:0}[hidden]{display:none!important}html{scroll-behavior:smooth}body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}h1,h2,h3{font-family:var(--serif);font-weight:700;line-height:1.06;letter-spacing:-.02em}h1{font-size:clamp(34px,4.1vw,54px)}h2{font-size:clamp(28px,3.6vw,42px)}h3{font-size:clamp(19px,2vw,24px)}p{max-width:66ch}a{color:inherit}:focus-visible{outline:2px solid var(--magenta);outline-offset:3px;border-radius:3px}.wrap{max-width:1180px;margin:0 auto;padding:0 24px}.btn{display:inline-block;font-size:15px;font-weight:600;padding:14px 26px;border:0;border-radius:2px;cursor:pointer;text-decoration:none;background:var(--ink);color:var(--paper);transition:background .18s}.btn:hover{background:var(--magenta)}.btn-gold{background:var(--gold);color:var(--ink)}.btn-gold:hover{background:var(--gold-deep);color:#fff}.btn-ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}.btn-ghost:hover{background:var(--ink);color:var(--paper)}nav{position:sticky;top:0;z-index:60;background:rgba(250,250,246,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line-soft)}.nav-in{display:flex;align-items:center;gap:26px;height:64px}.brand{font-family:var(--serif);font-size:23px;font-weight:700;text-decoration:none;white-space:nowrap;letter-spacing:-.01em}.brand sup{font-size:10px;vertical-align:super;font-weight:400}
/* the mark under the wordmark, for the trademark record and the brand line */
.brand{display:inline-block;line-height:1.05}
.brand .wm{display:block;white-space:nowrap}
.brand .pb{display:block;white-space:nowrap;font-family:var(--sans);font-size:8.5px;font-weight:600;
 letter-spacing:.13em;text-transform:uppercase;color:var(--gold-deep);margin-top:4px}
@media(max-width:360px){.brand .pb{font-size:8px;letter-spacing:.1em}}.brand .acc{color:var(--magenta)}.nav-links{display:flex;gap:20px;margin-left:auto;align-items:center}.nav-links a{font-size:14px;color:var(--charcoal);text-decoration:none;white-space:nowrap}.nav-links a:hover{color:var(--magenta)}.nav-links a[aria-current="page"]{color:var(--ink);font-weight:600}.nav-links a[aria-current="page"]::after{content:'';display:block;height:1.5px;margin-top:4px;background:var(--gold);border-radius:2px}.nav-links a.btn{color:var(--paper)}.nav-links a.btn:hover{color:var(--paper);background:var(--magenta)}.navtoggle{display:none;margin-left:auto;background:none;border:0;font-size:22px;cursor:pointer;padding:6px}/* ---------- HERO ---------- */
.hero{padding:72px 0 72px}.kicker{font-size:16px;color:#7A6118;font-weight:600;margin-bottom:20px}/* teaser card */
.teaser{background:var(--ink);border-radius:5px;padding:30px 32px 28px;color:var(--paper)}input[type=range]:focus-visible{outline:2px solid var(--magenta);outline-offset:3px}/* ---------- sections ---------- */
section{padding:96px 0}.sec-head{max-width:740px;margin-bottom:46px}.sec-head h2{margin-bottom:18px}.sec-head p{font-size:17.5px;color:var(--charcoal)}.dark{background:var(--ink);color:var(--paper)}.dark h2,.dark h3{color:#fff}.dark p{color:#C9C9C4}.tint{background:var(--paper-deep)}/* disconnect */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}/* what it is */
.def{font-size:19px;line-height:1.65;color:var(--charcoal);max-width:70ch}.tint .deliver div{background:var(--paper-deep)}/* silence */
.mark{width:15px;height:26px;border-radius:1px;transition:opacity .9s ease}/* full calculator */
.calc{display:grid;grid-template-columns:1fr 400px;gap:56px;align-items:start}.tint .route{background:var(--paper)}.field-status{font-size:12.5px;font-weight:600;color:var(--gold-deep);margin-bottom:8px}.field-status.read{color:var(--grey)}.field-note{font-size:13.5px;color:var(--grey);margin-bottom:14px;max-width:60ch}.field-row{display:flex;align-items:baseline;gap:9px;margin-bottom:10px}.field-val{font-size:30px;font-weight:600;letter-spacing:-.02em;border:0;border-bottom:2px solid var(--line);background:none;color:var(--ink);padding:0 2px 3px;width:5.5ch;font-family:var(--sans)}.field-val:focus{outline:0;border-bottom-color:var(--magenta)}.field-unit{font-size:14px;color:var(--grey)}.panel-cap{font-size:13px;color:var(--grey)}.figure{font-weight:700;font-size:clamp(38px,4.4vw,50px);letter-spacing:-.035em;color:var(--magenta);line-height:1;margin:6px 0 4px}.line{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-top:1px solid var(--line-soft);font-size:14px}.line dt{color:var(--grey)}.line dd{font-weight:600;white-space:nowrap}.line.total{border-top:1px solid var(--ink);margin-top:6px;padding-top:13px}.line.total dt{color:var(--ink);font-weight:600}.line.total dd{color:var(--magenta);font-size:18px}.recover{background:var(--gold-wash);padding:15px 17px;border-radius:2px;margin-top:20px;font-size:14px;line-height:1.5}.recover b{color:var(--gold-deep);font-size:19px;font-weight:700;display:block}.panel-fine{font-size:12px;color:var(--grey);margin-top:10px;text-align:center}/* stats */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1px;background:var(--line-soft)}/* pillars */
.pillars{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:1px;background:var(--line-soft)}/* maraly + book */
.about{display:grid;grid-template-columns:320px 1fr;gap:60px;align-items:center}/* ladder */
.ladder{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;background:var(--line-soft)}footer{background:var(--paper-deep);padding:58px 0 48px;font-size:14px;position:relative;overflow:hidden}.spark.f1{right:1.5%;top:22%;opacity:.32;animation:none}.spark.f2{right:5%;top:52%;opacity:.22;animation:none}@media(max-width:900px){.spark.f1,.spark.f2{display:none}}.foot-grid{display:grid;grid-template-columns:1.9fr auto auto;gap:56px;margin-bottom:0;align-items:start}.foot-links{display:flex;gap:28px;white-space:nowrap;padding-top:2px}.foot-links a{color:var(--grey);text-decoration:none;font-size:14px}.foot-links a:hover{color:var(--magenta)}.fs-label{font-size:14px;color:var(--grey);margin:0 0 14px;white-space:nowrap}.fs-icons{display:flex;gap:14px}.fs-icons a{display:block;width:22px;height:22px;color:var(--grey);transition:color .2s,transform .2s}.fs-icons svg{display:block;width:22px;height:22px;fill:currentColor}.fs-icons a:hover{color:var(--magenta);transform:translateY(-2px)}.foot-col a{display:block;color:var(--grey);text-decoration:none;padding:5px 0;font-size:14px}.foot-col a:hover{color:var(--magenta)}.foot-brand .brand{display:block;margin-bottom:18px}.legal{font-size:12px;color:#67675F;margin:0;line-height:1.7;max-width:44ch}/* ---- atmosphere ---- */
body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;
 background:
  radial-gradient(ellipse 62% 44% at 4% -10%, rgba(212,178,92,.20), transparent 64%),
  radial-gradient(ellipse 58% 46% at 100% -2%, rgba(248,120,170,.13), transparent 62%),
  radial-gradient(ellipse 70% 40% at 46% 106%, rgba(212,178,92,.12), transparent 64%);}body::after{content:'';position:fixed;inset:0;z-index:1;pointer-events:none;mix-blend-mode:multiply;opacity:.55;
 background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.032 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}nav,header,section,footer{position:relative;z-index:2}.tint{background:rgba(244,237,227,.85)!important}/* ---- accents ---- */
.acc{color:var(--magenta)}.dark .acc{color:var(--magenta-soft)}/* ---- scroll reveal ---- */
.rv{opacity:0;transform:translateY(22px);
 transition:opacity .8s cubic-bezier(.16,.8,.28,1),transform .8s cubic-bezier(.16,.8,.28,1);
 transition-delay:var(--d,0ms)}.rv.in{opacity:1;transform:none}/* ---- disconnect ---- */
.disc{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}/* ---- what it is ---- */
.def{font-size:clamp(19px,1.9vw,22px);line-height:1.62}.tint .deliver div{background:rgba(255,255,255,.55)}/* ---- stats ---- */
.stats{background:none;gap:20px}/* ---- pillars ---- */
.pillars{background:none;gap:20px}/* ---- ladder as a sequence ---- */
.ladder{background:none;gap:22px;position:relative;counter-reset:step;padding-top:22px}/* ---- book cover ---- */
.cover{box-shadow:0 22px 50px rgba(15,15,15,.28);
 background:linear-gradient(155deg,#232323,#0F0F0F 60%)}/* teaser routing */

/* calculator handoff band */
.bridge{display:grid;grid-template-columns:1fr 1.1fr 1.02fr;gap:36px;align-items:center;
 background:linear-gradient(165deg,#FEFCF8,#FBF5EC 60%,#FAF2E6);
 border:1.5px solid rgba(190,158,86,.55);border-radius:18px;padding:38px 40px;
 box-shadow:0 2px 4px rgba(140,100,40,.05),0 22px 54px rgba(150,105,45,.13)}@media(max-width:900px){.foot-grid{grid-template-columns:1fr 1fr;gap:32px}.foot-social{grid-column:1/-1}.foot-links{flex-wrap:wrap;gap:20px}}@media(max-width:560px){.foot-grid{grid-template-columns:1fr;gap:26px}}.legal a{color:var(--grey)}@media(prefers-reduced-motion:reduce){.rv{opacity:1!important;transform:none!important}}@media(max-width:980px){.nav-in{flex-wrap:wrap}.nav-links{display:none;order:3;width:100%;flex-direction:column;align-items:stretch;gap:0;
   margin:0 0 14px;padding-top:8px;border-top:1px solid var(--line-soft)}.nav-links.open{display:flex}.nav-links a{padding:13px 2px;font-size:15px;border-bottom:1px solid var(--line-soft)}.nav-links a.btn{margin-top:12px;text-align:center;border-bottom:0}nav:has(.nav-links.open) .nav-in{height:auto;padding-bottom:6px}.calc{grid-template-columns:1fr;gap:32px}.panel{position:static}.nav-links{display:none}.navtoggle{display:block}section{padding:70px 0}}@media(max-width:640px){.foot-grid{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}.bigquote{margin-top:56px;text-align:center;max-width:800px;margin-left:auto;margin-right:auto}.bigquote blockquote{font-family:var(--serif);font-size:clamp(23px,2.8vw,33px);line-height:1.35;color:var(--ink);max-width:none}.bigquote figcaption{margin-top:18px;font-size:14px;color:var(--grey)}/* ---- warm card system ---- */
.pillar,.deliver div{
  background:var(--card)!important;
  border:1px solid var(--line-gold);
  border-radius:14px!important;
  box-shadow:0 1px 2px rgba(90,60,20,.04),0 10px 30px rgba(90,60,20,.05)!important;
}.recover{border-radius:10px}.btn{border-radius:8px}/* ---- ornament ---- */
.spark{position:absolute;pointer-events:none;color:var(--gold);opacity:.5}.spark svg{display:block}/* ---- dark section ---- */
.dark{background:
  radial-gradient(ellipse 58% 48% at 10% 4%, rgba(201,168,76,.14), transparent 64%),
  radial-gradient(ellipse 50% 44% at 94% 92%, rgba(248,0,126,.12), transparent 66%),
  linear-gradient(165deg,#141313,#0C0C0C 62%,#150F12)}.dark{position:relative}section.tight{padding:74px 0}.dark::before{content:'';position:absolute;left:0;right:0;top:0;height:70px;pointer-events:none;
 background:linear-gradient(180deg,rgba(244,237,227,.13),transparent)}
@keyframes rowGo{0%,16%{opacity:1}44%,74%{opacity:.11}92%,100%{opacity:1}}/* ---- author quote beside the portrait ---- */
.sidequote{margin:26px 0 24px;padding:22px 26px;border-radius:12px;
 border:1px solid var(--line-gold);
 background:linear-gradient(160deg,rgba(247,238,220,.6),rgba(248,0,126,.04))}@media(max-width:820px){.board{padding:24px 22px 22px}.board-legend{grid-template-columns:1fr;gap:20px;padding-top:18px}.board-legend > div{padding:0!important}.board-legend > div + div::before{left:0;right:0;top:-10px;bottom:auto;width:auto;height:1px;
   background:linear-gradient(90deg,rgba(255,255,255,.13),transparent)}.board-legend > div + div{padding-top:10px!important}}/* ---- brand hero load ---- */
.brandhero .kicker,.spark{
  opacity:0;transform:translateY(16px);
  animation:heroIn .9s cubic-bezier(.16,.8,.28,1) forwards;animation-delay:var(--d,0ms)}.spark{--d:900ms;animation-name:sparkIn}
@keyframes heroIn{to{opacity:1;transform:none}}
@keyframes sparkIn{to{opacity:.5;transform:none}}.spark.s2{--d:1040ms}/* ---- brand hero ---- */
.brandhero{min-height:clamp(600px,90vh,900px);display:flex;align-items:center;padding:56px 0 52px;
 position:relative;overflow:hidden}.spark.s1{right:9%;top:20%}.spark.s2{left:2%;bottom:22%;opacity:.35}
@keyframes cueRun{0%{transform:translateY(0)}60%,100%{transform:translateY(92px)}}@media(min-width:900px){.spark.s1{top:2%}}
@media(max-width:640px){.spark.s1{right:5%;top:8px}.spark.s2{display:none}}
/* ---------- consent ---------- */
.cc{position:fixed;left:0;right:0;bottom:0;z-index:90;display:none;
 background:rgba(250,246,240,.97);backdrop-filter:blur(12px);
 border-top:1px solid var(--line-gold);box-shadow:0 -6px 30px rgba(90,60,20,.12)}
.cc.on{display:block}
.cc-in{max-width:1180px;margin:0 auto;padding:20px 24px;display:flex;align-items:center;
 gap:28px;flex-wrap:wrap}
.cc-tx{flex:1;min-width:280px}
.cc-tx b{display:block;font-family:var(--serif);font-size:18px;margin-bottom:5px}
.cc-tx p{font-size:14px;line-height:1.55;color:var(--charcoal);margin:0;max-width:72ch}
.cc-tx a{color:var(--gold-deep);font-weight:600}
.cc-bt{display:flex;gap:9px;flex-wrap:wrap}
.cc-bt button{font-family:var(--sans);font-size:14px;font-weight:600;padding:11px 20px;
 border-radius:2px;cursor:pointer;border:0;white-space:nowrap;transition:background .18s,color .18s}
.cc-acc{background:var(--gold);color:var(--ink)}
.cc-acc:hover{background:var(--gold-deep);color:#fff}
.cc-rej{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.cc-rej:hover{background:var(--ink);color:var(--paper)}
.cc-set{background:none;color:var(--gold-deep);text-decoration:underline;padding:11px 8px}
.cc-set:hover{color:var(--magenta)}

.ccm{position:fixed;inset:0;z-index:95;display:none;align-items:center;justify-content:center;
 padding:24px;background:rgba(15,15,15,.45)}
.ccm.on{display:flex}
.ccm-box{background:var(--paper);border:1px solid var(--line-gold);border-radius:18px;
 max-width:560px;width:100%;max-height:86vh;overflow:auto;padding:32px 34px;
 box-shadow:0 30px 70px rgba(0,0,0,.3)}
.ccm-box h2{font-size:26px;margin:0 0 10px}
.ccm-box > p{font-size:14.5px;color:var(--grey);line-height:1.6;margin:0 0 22px}
.ccr{display:flex;gap:18px;align-items:flex-start;padding:18px 0;border-top:1px solid var(--line-soft)}
.ccr h3{font-size:16px;margin:0 0 4px}
.ccr p{font-size:13.5px;color:var(--grey);line-height:1.55;margin:0}
.ccr .fixed{font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
 color:var(--gold-deep);white-space:nowrap;padding-top:3px}
.tgl{position:relative;flex:0 0 auto;width:46px;height:26px;border-radius:20px;border:0;cursor:pointer;
 background:var(--line);transition:background .2s}
.tgl[aria-checked="true"]{background:var(--gold)}
.tgl::after{content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;
 background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .2s}
.tgl[aria-checked="true"]::after{transform:translateX(20px)}
.ccm-bt{display:flex;gap:10px;margin-top:24px;flex-wrap:wrap}
.ccm-bt .btn{flex:1;text-align:center;min-width:140px}
.foot-legal-links{display:flex;gap:6px 14px;flex-wrap:wrap;align-items:center;margin-top:10px}
.foot-legal-links a,.foot-legal-links button{background:none;border:0;padding:0;cursor:pointer;font-family:var(--sans);
 font-size:12px;color:#67675F;text-decoration:underline;text-underline-offset:2px}
.foot-legal-links a:hover,.foot-legal-links button:hover{color:var(--magenta)}
@media(max-width:760px){
  .cc-in{padding:18px 20px;gap:16px}
  .cc-bt{width:100%}
  .cc-bt button{flex:1}
  .ccm-box{padding:26px 22px}
}

.form-err{font-size:13px;color:var(--magenta);line-height:1.5;margin:10px 0 0;font-weight:500}

/* menu: seven items need about 1060px, so use the mobile menu up to that width (nav rules only) */
@media(min-width:981px) and (max-width:1060px){
  .nav-in{flex-wrap:wrap}
  .nav-links{display:none;order:3;width:100%;flex-direction:column;align-items:stretch;gap:0;margin:0 0 14px;padding-top:8px;border-top:1px solid var(--line-soft)}
  .nav-links.open{display:flex}
  .nav-links a{padding:13px 2px;font-size:15px;border-bottom:1px solid var(--line-soft)}
  .nav-links a.btn{margin-top:12px;text-align:center;border-bottom:0}
  nav:has(.nav-links.open) .nav-in{height:auto;padding-bottom:6px}
  .navtoggle{display:block}
}

/* ==========================================================================
   Mobile and touch refinements
   Two rules of thumb: nothing smaller than 12px on a phone, and anything
   tappable at least 40px tall once there is no mouse.
   These use !important because each page carries its own <style> block after
   this file, so equal-strength rules there would otherwise win.
   ========================================================================== */

@media (max-width: 900px) {
  .eyebrow,
  .hst-l, .hst-s, .way-tag,
  .fu-when, .w4-tag, .stc-lab, .o-tag,
  .q-tag, .nt, .offer-tag,
  .dur, .pl-group, .pl-badge, .tl,
  .co-switch, .co-trust li,
  .cal-cta p, .cd-sub,
  .scale span, .rlab span, .rr span, .sc-row span, .crm-col span,
  .tick span, .q-row label, .nx-f label,
  .rrow span {
    font-size: 12px !important;
    line-height: 1.45 !important;
  }
  .hst-l { letter-spacing: .02em !important }
}

/* Touch: give standalone links and controls a real hit area. Inline links
   inside a paragraph are left alone, since padding there breaks the line. */
@media (hover: none), (max-width: 900px) {
  .navtoggle { min-width: 44px !important; min-height: 44px !important }

  .rung a:not(.btn), .way a:not(.btn), a.tlink, a.flink,
  .foot-links a, .foot-legal-links a, .fs-icons a {
    display: inline-flex !important;
    align-items: center;
    min-height: 40px;
  }

  .tabs button { min-height: 40px !important }

  #cc-settings, #cc-optout, #cc-no, #cc-yes, #cc-more {
    min-height: 40px !important;
    display: inline-flex !important;
    align-items: center;
  }
  /* footer legal row: Privacy and Terms get the same tap height as the two
     cookie buttons beside them, so the wrapped row stays one even block */
  .foot-legal-links a { min-height: 40px !important; display: inline-flex !important; align-items: center; }
  .foot-legal-links { row-gap: 0 !important; margin-top: 4px !important; }
}

/* ---------- BACK TO TOP (every page; markup and script in partials/footer.html) ---------- */
.totop{position:fixed;right:22px;bottom:22px;z-index:80;width:46px;height:46px;border-radius:50%;
 display:flex;align-items:center;justify-content:center;background:var(--ink);color:var(--paper);text-decoration:none;
 box-shadow:0 8px 24px rgba(20,20,20,.22);opacity:0;visibility:hidden;transform:translateY(10px);
 transition:opacity .25s,transform .25s,visibility .25s,background .18s,color .18s}
.totop.on{opacity:1;visibility:visible;transform:none}
.totop:hover{background:var(--gold);color:var(--ink)}
.totop:focus-visible{outline:2px solid var(--magenta);outline-offset:3px;border-radius:50%}
.totop svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:640px){.totop{right:16px;bottom:16px;width:42px;height:42px}}
@media(prefers-reduced-motion:reduce){.totop{transition:none}}
@media print{.totop{display:none}}

/* ---------- LANGUAGE SELECTOR (markup and script in partials/header.html) ---------- */
.lang{position:relative;flex:none}
.lang-btn{display:flex;align-items:center;gap:7px;height:34px;padding:0 11px;border:1px solid var(--line-soft);border-radius:999px;
 background:rgba(255,255,255,.55);font:600 13px/1 var(--sans);letter-spacing:.04em;color:var(--charcoal);cursor:pointer;transition:border-color .18s}
.lang-btn:hover{border-color:var(--gold)}
.lang .flag{width:19px;height:10px;flex:none;border-radius:1.5px;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.lang .caret{width:10px;height:6px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.lang-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:70;list-style:none;margin:0;padding:6px;min-width:170px;
 background:#fff;border:1px solid var(--line-soft);border-radius:12px;box-shadow:0 14px 34px rgba(20,20,20,.14)}
.lang-menu a{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:8px;font-size:14px;color:var(--ink);text-decoration:none}
.lang-menu a:hover{background:var(--paper-deep)}
.lang-menu a[aria-current] {font-weight:600}
.lang-menu .lang-code{font-size:12px;font-weight:700;letter-spacing:.05em;color:var(--gold-deep);min-width:20px}
.lang-menu a > .lang-code:first-child{margin-left:28px}   /* a language without a flag still lines up */
.lang-btn .lang-name{display:none}
/* phone menu (the site switches to it at 1060px): the selector sits beside the menu button */
@media(max-width:1060px){.lang{margin-left:auto}.lang + .navtoggle{margin-left:-14px}}
/* just above that, the full menu plus the selector is tight: close up the spacing */
@media(min-width:1061px) and (max-width:1180px){.nav-in{gap:16px}.nav-links{gap:13px}}

/* ---- page entrance: the hero block of each page arrives in sequence on load.
   Pure CSS (no script needed); same easing and distance family as the scroll
   reveal (.rv). Home has its own, richer entrance. ---- */
[data-enter]>*{opacity:0;transform:translateY(18px);animation:heroIn .8s cubic-bezier(.16,.8,.28,1) forwards}
[data-enter]>*:nth-child(1){animation-delay:.05s}[data-enter]>*:nth-child(2){animation-delay:.13s}
[data-enter]>*:nth-child(3){animation-delay:.21s}[data-enter]>*:nth-child(4){animation-delay:.29s}
[data-enter]>*:nth-child(5){animation-delay:.37s}[data-enter]>*:nth-child(6){animation-delay:.45s}
[data-enter]>*:nth-child(n+7){animation-delay:.53s}
@media(prefers-reduced-motion:reduce){[data-enter]>*{opacity:1;transform:none;animation:none}}

/* ---- language selector: the flag waves once on arrival and again on hover,
   pivoting from its left edge like a flag on a pole; a gold line slides in
   under the language code on hover. Nothing moves with reduced motion. ---- */
@keyframes flagWave{
  0%{transform:perspective(60px) rotateY(0) skewY(0)}
  20%{transform:perspective(60px) rotateY(-18deg) skewY(-5deg)}
  45%{transform:perspective(60px) rotateY(12deg) skewY(4deg)}
  70%{transform:perspective(60px) rotateY(-6deg) skewY(-2deg)}
  100%{transform:perspective(60px) rotateY(0) skewY(0)}}
.lang-btn .flag{transform-origin:0 50%;animation:flagWave 1.3s cubic-bezier(.36,.07,.19,.97) .9s 1 both}
.lang:hover .lang-btn .flag,.lang-btn:focus-visible .flag{animation:flagWave 1.1s cubic-bezier(.36,.07,.19,.97) 0s 1 both}
.lang-btn .lang-code{position:relative}
.lang-btn .lang-code::after{content:'';position:absolute;left:0;right:0;bottom:-4px;height:1.5px;border-radius:1px;
  background:var(--gold);transform:scaleX(0);transform-origin:0 50%;transition:transform .35s cubic-bezier(.16,.8,.28,1)}
.lang:hover .lang-btn .lang-code::after,.lang-btn:focus-visible .lang-code::after{transform:scaleX(1)}
@media(prefers-reduced-motion:reduce){.lang-btn .flag,.lang:hover .lang-btn .flag{animation:none}.lang-btn .lang-code::after{transition:none}}
