/* heycomb.com shared styles. Self-hosted fonts, no remote resources.
   Layout: calm paper pages with wide display type; one honeycomb geometry reused everywhere.
   Type and spacing use rem so a visitor's own text-size setting carries through. */

@font-face{font-family:"Mona Sans";font-style:normal;font-weight:200 900;font-stretch:75% 125%;font-display:swap;src:url("../fonts/mona-sans.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Geist Mono";font-style:normal;font-weight:400 600;font-display:swap;src:url("../fonts/geist-mono.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --paper:#faf8f3; --paper-2:#f1ede4; --raised:#fffdf9; --ink:#2a2c29; --ink-2:#464943; --muted:#62675e;
  --line:rgba(42,44,41,.09); --line-2:rgba(42,44,41,.18);
  --cell:#fffdf9; --cell-edge:rgba(42,44,41,.14); --center:#e9e4d8;
  --mark-ink:#403e3b; --mark-gold:#c39c5d;
  --acc-l:#8c5e1d; --tint-l:#f5e5c1; --tonal-l:#fbf1dd; --on-l:#fffdf8;
  --acc-d:#e7bd73; --tint-d:#4d432b; --tonal-d:#3d372b; --on-d:#241e13;
  --accent:var(--acc-l); --tint:var(--tint-l); --tonal:var(--tonal-l); --on-accent:var(--on-l);
  --ring-cell:var(--cell);
  --sw-honey:#8c5e1d; --sw-sage:#3c7055; --sw-ocean:#376c89; --sw-lilac:#6c568a; --sw-rose:#8f5262; --sw-graphite:#495650;
  --shadow-a:rgba(72,54,24,.17); --shadow-b:rgba(72,54,24,.08); --glass:rgba(255,253,249,.62);
  --tl-close:#bd7464; --copy-green:#2fb350; --on-green:#ffffff; --cursor:#161616; --cursor-edge:#ffffff;
  --ph-sky1:#f3c98f; --ph-sky2:#eea374;
  --f-display:"Mona Sans", ui-sans-serif, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --f-mono:"Geist Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --spring:cubic-bezier(.3,1.42,.52,1); --ease:cubic-bezier(.22,.8,.2,1);
  --hex:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 173.2' preserveAspectRatio='none'%3E%3Cpath d='M40 17.3Q50 0 70 0L130 0Q150 0 160 17.3L190 69.3Q200 86.6 190 103.9L160 155.9Q150 173.2 130 173.2L70 173.2Q50 173.2 40 155.9L10 103.9Q0 86.6 10 69.3Z'/%3E%3C/svg%3E");
  --hexp:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 173.2 200' preserveAspectRatio='none'%3E%3Cpath d='M17.3 40Q0 50 0 70L0 130Q0 150 17.3 160L69.3 190Q86.6 200 103.9 190L155.9 160Q173.2 150 173.2 130L173.2 70Q173.2 50 155.9 40L103.9 10Q86.6 0 69.3 10Z'/%3E%3C/svg%3E");
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root{
  --paper:#1b1c19; --paper-2:#232420; --raised:#2b2c28; --ink:#f3f0e7; --ink-2:#d6d2c6; --muted:#aeb2a5;
  --line:rgba(243,240,231,.08); --line-2:rgba(243,240,231,.17); --cell:#31322e; --cell-edge:rgba(243,240,231,.12); --center:#3c3d38;
  --mark-ink:#ece8dd; --accent:var(--acc-d); --tint:var(--tint-d); --tonal:var(--tonal-d); --on-accent:var(--on-d);
  --sw-honey:#e7bd73; --sw-sage:#a8c9ae; --sw-ocean:#a4c6dd; --sw-lilac:#c9b5e3; --sw-rose:#e2b4c0; --sw-graphite:#c1cbc2;
  --shadow-a:rgba(0,0,0,.5); --shadow-b:rgba(0,0,0,.28); --glass:rgba(43,44,40,.62); --tl-close:#bf7b6a; color-scheme:dark}}
:root[data-preset="sage"]{--acc-l:#3c7055;--tint-l:#e0ebdf;--tonal-l:#edf3e9;--on-l:#ffffff;--acc-d:#a8c9ae;--tint-d:#334c3c;--tonal-d:#2d3c31;--on-d:#172d20}
:root[data-preset="ocean"]{--acc-l:#376c89;--tint-l:#dfecf2;--tonal-l:#edf4f7;--on-l:#ffffff;--acc-d:#a4c6dd;--tint-d:#2d475a;--tonal-d:#293b47;--on-d:#172c3a}
:root[data-preset="lilac"]{--acc-l:#6c568a;--tint-l:#eae3f3;--tonal-l:#f3eff8;--on-l:#ffffff;--acc-d:#c9b5e3;--tint-d:#453752;--tonal-d:#37303f;--on-d:#2a2037}
:root[data-preset="rose"]{--acc-l:#8f5262;--tint-l:#f3e0e6;--tonal-l:#f9edf0;--on-l:#ffffff;--acc-d:#e2b4c0;--tint-d:#52353e;--tonal-d:#412d34;--on-d:#361f27}
:root[data-preset="graphite"]{--acc-l:#495650;--tint-l:#e1e5df;--tonal-l:#edf0eb;--on-l:#ffffff;--acc-d:#c1cbc2;--tint-d:#3e4942;--tonal-d:#303932;--on-d:#202b23}
:root[data-cells="tonal"]{--ring-cell:var(--tonal)}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:6rem;padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f-display);font-size:1.0625rem;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip;min-height:100vh;display:flex;flex-direction:column}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:70;background:var(--paper)}
main{flex:1}
img{max-width:100%;height:auto}
[hidden]{display:none!important}
a{color:inherit}
main a:not(.btn):not(.kind),.contact span{overflow-wrap:anywhere}
h1,h2,h3{overflow-wrap:break-word}
button{font:inherit;color:inherit}
::selection{background:var(--tint);color:var(--ink)}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:.4rem}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:absolute;left:1rem;top:-5rem;z-index:80;padding:.65rem 1rem;border-radius:.6rem;background:var(--raised);border:2px solid var(--accent);font-weight:600;text-decoration:none}
.skip-link:focus{top:calc(.75rem + env(safe-area-inset-top,0px))}
.wrap{width:100%;max-width:77.5rem;margin-inline:auto;padding-left:max(clamp(1rem,4vw,2.5rem),env(safe-area-inset-left,0px));padding-right:max(clamp(1rem,4vw,2.5rem),env(safe-area-inset-right,0px))}
.narrow{max-width:50rem}
.ic{width:1.25rem;height:1.25rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.hexmask{-webkit-mask:var(--hex) center/100% 100% no-repeat;mask:var(--hex) center/100% 100% no-repeat}
.mono{font-family:var(--f-mono)}

/* Type */
h1,h2,h3{text-wrap:balance}
.eyebrow{display:inline-flex;align-items:center;gap:.6rem;margin:0 0 1.1rem;font:500 .78rem/1.2 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.eyebrow::before{content:"";width:.8rem;height:.7rem;flex:none;background:var(--accent);-webkit-mask:var(--hex) center/100% 100% no-repeat;mask:var(--hex) center/100% 100% no-repeat}
.h2{margin:0 0 1rem;font-size:clamp(2rem,4.4vw,3.6rem);font-stretch:112%;font-weight:660;letter-spacing:-.04em;line-height:1;max-width:18ch}
.h3{margin:0 0 .4rem;font-size:1.25rem;font-stretch:108%;font-weight:660;letter-spacing:-.02em;line-height:1.2}
.lede{margin:0;max-width:36ch;font-size:clamp(1.125rem,1.5vw,1.3rem);line-height:1.5;color:var(--ink-2);text-wrap:pretty}
.sub{margin:0;max-width:56ch;font-size:clamp(1.0625rem,1.3vw,1.18rem);line-height:1.58;color:var(--ink-2);text-wrap:pretty}
.sec{position:relative;padding-block:clamp(4rem,9vw,7.5rem)}
.sec.tight-top{padding-top:clamp(2rem,4vw,3rem)}
.band{background:var(--paper-2);border-block:1px solid var(--line)}
section[id],[id].anchor{scroll-margin-top:6rem}

/* Buttons and pills */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:3.1rem;padding:.6rem 1.4rem;border-radius:999px;border:1px solid transparent;font-size:1rem;font-weight:620;font-stretch:106%;line-height:1.2;text-decoration:none;text-align:center;max-width:100%;cursor:pointer;transition:transform .35s var(--spring),background-color .25s,border-color .25s}
.btn .ic{width:1.1rem;height:1.1rem;transition:transform .35s var(--spring)}
.btn:hover{transform:translateY(-2px)}
.btn:hover .ic{transform:translateX(2px)}
.btn-pri{background:var(--ink);color:var(--paper)}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--line-2)}
.btn-ghost:hover{border-color:var(--ink)}
.pill{display:inline-flex;align-items:center;gap:.6rem;min-height:2.25rem;padding:.3rem .9rem .3rem .5rem;border-radius:999px;border:1px solid var(--line-2);background:var(--raised);font-size:.9rem;font-weight:580;line-height:1.2}
.pill .dot{width:1.35rem;height:1.17rem;flex:none;background:var(--accent)}
.text-link{color:var(--ink);font-weight:600;text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:.22em}
.text-link:hover{text-decoration-thickness:3px}
.mini{display:inline-flex;align-items:center;gap:.35rem;min-height:1.9rem;padding:.3rem .8rem;border-radius:.5rem;border:1px solid var(--line-2);background:var(--raised);font:600 .8rem/1 var(--f-display);color:var(--ink);cursor:pointer;white-space:nowrap}
.mini .ic{width:.85rem;height:.85rem;stroke-width:2.2}
.mini.pri{background:var(--accent);color:var(--on-accent);border-color:transparent}
.mini.done{background:var(--ink);color:var(--paper)}
kbd{display:inline-block;padding:.05em .4em .1em;border-radius:.3rem;border:1px solid var(--line-2);box-shadow:0 1.5px 0 var(--line-2);font:500 .86em/1.3 var(--f-mono);background:var(--raised)}

/* Header */
.site-head{container-type:inline-size;flex-wrap:wrap;position:sticky;top:calc(.6rem + env(safe-area-inset-top,0px));z-index:50;margin:.6rem auto 0;width:min(73rem,calc(100% - 1.5rem - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px)));display:flex;align-items:center;gap:.5rem;padding:.4rem .45rem .4rem .9rem;border-radius:1.6rem;background:color-mix(in srgb,var(--paper) 78%,transparent);-webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5);border:1px solid var(--line);transition:box-shadow .35s,border-color .35s}
.site-head.scrolled{box-shadow:0 .9rem 2.2rem -1rem var(--shadow-a);border-color:var(--line-2)}
.brand{display:inline-flex;align-items:center;gap:.55rem;margin-right:auto;padding:.3rem 0;font-size:1.2rem;font-weight:720;font-stretch:118%;letter-spacing:-.03em;text-decoration:none;color:var(--ink);white-space:nowrap}
.brand svg{width:2rem;height:2rem;flex:none}
.lc{transform-box:fill-box;transform-origin:center}
.brand:hover .lc{animation:lcpop .6s var(--spring) calc(var(--i)*45ms)}
@keyframes lcpop{35%{transform:scale(.72)}}
.nav{display:flex;align-items:center;gap:.15rem}
.nav a{padding:.55rem .85rem;border-radius:999px;font-size:.95rem;font-weight:560;color:var(--ink-2);text-decoration:none;white-space:nowrap}
.nav a:hover{background:var(--line);color:var(--ink)}
.nav a[aria-current="page"]{color:var(--ink);background:var(--tint)}
.head-status{display:inline-flex;align-items:center;gap:.45rem;min-height:2.6rem;margin-left:.3rem;padding:.35rem 1rem;border-radius:999px;background:var(--ink);color:var(--paper);font-size:.9rem;font-weight:620;white-space:nowrap;text-decoration:none}
.head-status .dot{width:.85rem;height:.74rem;background:var(--mark-gold)}
.menu{display:none}
.menu summary{list-style:none;display:inline-flex;align-items:center;gap:.4rem;min-height:2.6rem;padding:.35rem .9rem;border-radius:999px;border:1px solid var(--line-2);font-weight:600;font-size:.95rem;cursor:pointer}
.menu summary::-webkit-details-marker{display:none}
.menu[open] summary{background:var(--tint)}
.menu .nav{position:absolute;right:.4rem;top:calc(100% + .45rem);flex-direction:column;align-items:stretch;min-width:min(12rem,calc(100vw - 2rem));max-width:calc(100vw - 2rem);padding:.4rem;border-radius:1rem;background:var(--raised);border:1px solid var(--line-2);box-shadow:0 1.2rem 2.4rem -1rem var(--shadow-a)}
.menu .nav a{border-radius:.6rem;padding:.75rem .9rem}
/* On narrow or short screens (in em, so large text counts) the header scrolls away instead of covering content */
@media (max-width:30em),(max-height:30em){.site-head{position:relative;top:auto}}
/* Collapse by the header's own width in rem, so enlarged text collapses it too */
@container (max-width:44rem){.site-head>.nav{display:none}.menu{display:block;order:2}.head-status{margin-left:0;padding:.35rem .8rem}}
@container (max-width:30rem){.head-status .label-long{display:none}}
@container (max-width:20rem){.head-status{display:none}}

/* Honeycomb: one geometry for every menu on the site */
.hc{--d:calc(var(--R)*1.93);--W:calc(var(--R)*2);--H:calc(var(--R)*1.7320508);position:relative;flex:none;width:calc(var(--d)*1.7320508 + var(--W));height:calc(var(--d)*2 + var(--H));filter:drop-shadow(0 1px 1px var(--shadow-b)) drop-shadow(0 .8rem 1.2rem var(--shadow-a))}
.hx{position:absolute;left:50%;top:50%;width:var(--W);height:var(--H);margin:calc(var(--H)/-2) 0 0 calc(var(--W)/-2);padding:0;border:0;color:var(--ink);background:var(--edge,var(--cell-edge));-webkit-mask:var(--hex) center/100% 100% no-repeat;mask:var(--hex) center/100% 100% no-repeat;--fill:var(--ring-cell);-webkit-tap-highlight-color:transparent}
.hx::before{content:"";position:absolute;inset:1.3px;background:var(--fill);-webkit-mask:var(--hex) center/100% 100% no-repeat;mask:var(--hex) center/100% 100% no-repeat;transition:background-color .4s var(--ease)}
/* Closed cells are hidden from keyboard and screen readers too; visibility switches after the closing animation */
.hx.ring{cursor:pointer;transform:translate(calc(var(--d)*var(--x)),calc(var(--d)*var(--y)));transition:transform .64s var(--spring) calc(var(--i)*38ms),opacity .2s linear calc(var(--i)*38ms),color .3s,visibility 0s}
.hc:not(.open) .hx.ring{transform:scale(.3);opacity:0;visibility:hidden;pointer-events:none;transition:transform .3s cubic-bezier(.55,0,.8,.3) calc((5 - var(--i))*20ms),opacity .22s linear calc((5 - var(--i))*20ms + 70ms),visibility 0s linear .45s}
.hx.center{--fill:var(--center);transition:transform .5s var(--spring),opacity .25s}
.hc:not(.open) .hx.center{transform:scale(.55);opacity:0}
.cc{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--R)*.07);width:100%;height:100%;padding:0 calc(var(--R)*.3);text-align:center;font-size:clamp(.6875rem,calc(var(--R)*.205),.86rem);font-weight:630;line-height:1.12;letter-spacing:-.01em;overflow-wrap:normal;hyphens:none}
.cc .ic{width:calc(var(--R)*.32);height:calc(var(--R)*.32);min-width:.9rem;min-height:.9rem;color:var(--accent);transition:color .3s}
.lb{text-wrap:balance}
.why{display:none;font:500 .7rem/1.1 var(--f-mono);color:var(--muted)}
.hx.off{cursor:not-allowed}
.hx.off .ic,.hx.off .lb{opacity:.42}
.hx.off .why{display:block}
.hx.hot,.hx.ring:focus-visible{--fill:var(--accent);color:var(--on-accent);outline:none}
.hx.hot .ic,.hx.ring:focus-visible .ic,.hx.hot .why,.hx.ring:focus-visible .why{color:var(--on-accent)}
.hx.ring:focus-visible::after{content:"";position:absolute;inset:5px;background:var(--on-accent);opacity:.95;-webkit-mask:var(--hex) center/100% 100% no-repeat,var(--hex) center/100% 100% no-repeat;-webkit-mask-composite:xor;mask:var(--hex) center/100% 100% no-repeat exclude,var(--hex) center/calc(100% - 5px) calc(100% - 5px) no-repeat}
@media (hover:hover){.hc.live .hx.ring:not(.off):hover{--fill:var(--accent);color:var(--on-accent)}.hc.live .hx.ring:not(.off):hover .ic{color:var(--on-accent)}}
.hx.center .cc{gap:.15rem}
.hx.center .ic{color:var(--muted)}
.ext{font:600 clamp(.7rem,calc(var(--R)*.19),.8rem)/1.1 var(--f-mono);letter-spacing:.05em}
/* Fit modes chosen by measuring labels against the hexagon outline */
.hx.ring.tight .ic{display:none}
.hx.ring.tight .cc{line-height:1.06;padding:0 calc(var(--R)*.26)}
.hc.compact .hx.ring .lb,.hc.compact .hx.ring .why{display:none}
.hc.compact .hx.ring .ic{width:calc(var(--R)*.46);height:calc(var(--R)*.46)}
.hc.compact .hx.ring .ic{display:block}
.hc.compact .hx.center .ext{display:none}
.hc.compact .hx.center .ic{width:calc(var(--R)*.46);height:calc(var(--R)*.46)}
.hx.probe{transform:none!important;opacity:1!important;visibility:hidden!important;pointer-events:none;transition:none!important}
.hc-legend{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,11rem),1fr));gap:.35rem .9rem;margin:.9rem 0 0;padding:0;list-style:none;font-size:.9rem;line-height:1.3}
.hc-legend li{display:flex;align-items:center;gap:.5rem}
.hc-legend .ic{width:1rem;height:1rem;color:var(--accent)}
.hc-legend .why{display:inline;margin-left:.3rem}
.hx.shake{animation:shake .4s ease}
@keyframes shake{25%{translate:-4px 0}75%{translate:4px 0}}
.hx.flip{animation:flip .52s var(--ease) both;animation-delay:calc(var(--i)*45ms)}
@keyframes flip{50%{transform:translate(calc(var(--d)*var(--x)),calc(var(--d)*var(--y))) scaleX(0)}}
.hx.center.flip{animation-name:flipc;animation-delay:0s}
@keyframes flipc{50%{transform:scaleX(0)}}
.fname{display:inline-block;padding:.3rem .75rem;border-radius:999px;background:var(--raised);border:1px solid var(--line-2);font:500 .8rem/1.2 var(--f-mono);white-space:nowrap;box-shadow:0 .4rem .9rem -.5rem var(--shadow-a)}

/* Shared small UI: documents, windows, review rows */
.doc{width:2.9rem;height:3.6rem;position:relative;flex:none;display:flex;align-items:flex-end;justify-content:center;padding-bottom:.5rem;border-radius:.3rem .8rem .3rem .3rem;background:var(--raised);box-shadow:0 0 0 1px var(--line-2),0 .5rem 1rem -.5rem var(--shadow-a)}
.doc::before{content:"";position:absolute;top:0;right:0;width:.8rem;height:.8rem;border-radius:0 .75rem 0 .25rem;background:linear-gradient(225deg,var(--paper-2) 50%,var(--line-2) 50%)}
.doc b{font:600 .56rem/1 var(--f-mono);letter-spacing:.05em;padding:.2rem .25rem;border-radius:.25rem;background:var(--ink);color:var(--paper)}
.doc.cp b{background:var(--accent);color:var(--on-accent)}
.doc.img::after{content:"";position:absolute;inset:.55rem .45rem 1.4rem;border-radius:.2rem;background:radial-gradient(circle at 70% 40%,#fff1cf 0 12%,transparent 13%),radial-gradient(90% 60% at 25% 105%,#556347 0 99%,transparent 100%),linear-gradient(var(--ph-sky1),var(--ph-sky2))}
.win{border-radius:.9rem;background:var(--raised);border:1px solid var(--line-2);box-shadow:0 2rem 4rem -1.8rem var(--shadow-a),0 2px 6px var(--shadow-b);overflow:hidden}
.win-top{min-height:2.2rem;display:flex;align-items:center;gap:.75rem;padding:.3rem .8rem;border-bottom:1px solid var(--line);font-size:.8rem;font-weight:650}
.tl{display:flex;gap:.4rem}
.tl i{width:.7rem;height:.7rem;border-radius:50%;background:var(--muted);opacity:.28}
.tl i:first-child{background:var(--tl-close);opacity:.85}
.rv-row{display:flex;align-items:center;gap:.8rem;padding:.9rem .9rem .85rem}
.chk{width:1.2rem;height:1.2rem;flex-shrink:0;border-radius:.3rem;display:grid;place-items:center;background:var(--accent);color:var(--on-accent)}
.chk .ic{width:.8rem;height:.8rem;stroke-width:2.6}
.rv-row .doc{width:2.25rem;height:2.8rem;padding-bottom:.35rem}
.rv-row .doc b{font-size:.5rem}
.rv-txt{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.rv-txt b{font-size:.94rem;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rv-txt small{font:500 .72rem/1.35 var(--f-mono);color:var(--muted)}
.rv-foot{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem;padding:.65rem .85rem .8rem;border-top:1px solid var(--line);background:var(--paper)}
.rv-orig{display:flex;align-items:center;gap:.35rem;font-size:.75rem;color:var(--muted)}
.rv-orig .ic{width:.9rem;height:.9rem}
.rv-btns{display:flex;flex-wrap:wrap;gap:.4rem;margin-left:auto}

/* Home: hero */
.hero{position:relative;isolation:isolate;overflow:hidden;padding-block:clamp(2.5rem,6vw,5rem) clamp(3rem,6vw,5.5rem)}
.lattice{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;-webkit-mask-image:radial-gradient(75% 70% at 72% 42%,#000 25%,transparent 78%);mask-image:radial-gradient(75% 70% at 72% 42%,#000 25%,transparent 78%)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.75rem,4.5vw,4.5rem);align-items:center}
.hero-title{margin:1.4rem 0 1.5rem;font-size:clamp(2.75rem,6.6vw,6.25rem);font-weight:690;font-stretch:116%;letter-spacing:-.048em;line-height:.92}
.hero-title .ln{display:block}
.swap{display:inline-block;color:var(--accent);white-space:nowrap}
.ch{display:inline-block;white-space:pre}
.ch.in{animation:chIn .72s var(--spring) both;animation-delay:calc(var(--k)*34ms)}
.ch.out{animation:chOut .3s cubic-bezier(.5,0,.75,0) both;animation-delay:calc(var(--k)*16ms)}
@keyframes chIn{from{opacity:0;transform:translateY(.42em) rotate(7deg);filter:blur(7px)}}
@keyframes chOut{to{opacity:0;transform:translateY(-.32em);filter:blur(6px)}}
.swap[data-fx="squeeze"]{animation:squeeze 1.15s var(--spring) .7s both}
@keyframes squeeze{from{font-stretch:125%;letter-spacing:.01em}to{font-stretch:75%;letter-spacing:-.06em}}
.swap[data-fx="beat"] .ch.in{animation:chIn .6s var(--spring) both,beat .42s ease-in-out 2 both;animation-delay:calc(var(--k)*34ms),calc(.62s + var(--k)*60ms)}
@keyframes beat{50%{transform:translateY(-.13em) scaleY(1.1)}}
.swap[data-fx="stack"] .ch.in{animation-name:stackIn}
@keyframes stackIn{from{opacity:0;transform:translate(.7em,-.18em) rotate(-12deg);filter:blur(4px)}}
.cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;margin-top:2rem}
.facts{display:flex;flex-wrap:wrap;gap:.5rem 1.2rem;margin:1.75rem 0 0;padding:0;list-style:none;font-size:.95rem;color:var(--ink-2)}
.facts li{display:flex;align-items:center;gap:.5rem}
.facts .ic{width:1.05rem;height:1.05rem;color:var(--accent)}
.hero-stage{container-type:inline-size;justify-self:end;width:100%;max-width:35rem}
.stage-cap{margin:.85rem 0 0;text-align:center;font:500 .8rem/1.45 var(--f-mono);color:var(--muted)}
@media (max-width:61rem){.hero-grid{grid-template-columns:minmax(0,1fr)}.hero-stage{justify-self:center}}

/* Hero demo desk. Lays out at real size; the honeycomb radius follows the container. */
.desk{--R:min(17.2cqw,3.75rem);position:relative;display:flex;flex-direction:column;border-radius:1.75rem;overflow:hidden;background:radial-gradient(110% 75% at 50% 32%,var(--raised),var(--paper-2) 72%);border:1px solid var(--line-2);box-shadow:0 3.5rem 6rem -3rem var(--shadow-a),0 2px 0 var(--line);user-select:none;-webkit-user-select:none}
.menubar{flex:none;min-height:1.9rem;display:flex;align-items:center;gap:1rem;padding:.2rem 1rem;font-size:.8rem;font-weight:500;background:var(--glass);border-bottom:1px solid var(--line)}
.menubar b{font-weight:720}
.menubar .r{margin-left:auto;display:flex;align-items:center;gap:.8rem;font-variant-numeric:tabular-nums;white-space:nowrap}
.menubar svg{width:1.05rem;height:1.05rem}
@container (max-width:22rem){.menubar .opt{display:none}}
.stage{position:relative;flex:none;height:calc(var(--R)*5.59 + 4.3rem)}
.stage>.fname{position:absolute;left:50%;top:.9rem;translate:-50% 0;z-index:3;transition:opacity .3s,transform .5s var(--spring)}
.desk:not(.menu-open) .stage>.fname{opacity:0;transform:translateY(.5rem)}
.stage .hc,.stage .c-intro,.stage .float{position:absolute;left:50%;top:calc(3.1rem + var(--R)*2.795);translate:-50% -50%}
.c-intro{z-index:2;width:calc(var(--R)*7.63);height:calc(var(--R)*7.63);overflow:visible;pointer-events:none}
.c-intro path{transform-box:fill-box;transform-origin:center;transition:transform .6s cubic-bezier(.55,0,.75,.3) calc(var(--i)*55ms),opacity .3s linear calc(var(--i)*55ms + 260ms)}
.c-intro.go path{transform:translate(calc(var(--dx)*1px),calc(var(--dy)*1px)) scale(.3);opacity:0}
.c-intro.gone{display:none}
.desk .hc-legend{margin:0;padding:0 1rem .9rem}
.shelf{flex:none;display:flex;justify-content:space-around;align-items:flex-start;gap:.25rem;padding:.85rem .5rem .9rem;border-top:1px solid var(--line);background:var(--glass)}
.sf{position:relative;flex:1 1 0;min-width:0;max-width:6.5rem;min-height:2.75rem;padding:.1rem 0;border:0;background:none;display:flex;flex-direction:column;align-items:center;gap:.45rem;cursor:pointer;color:var(--ink);border-radius:.6rem}
.sf .lbl{max-width:100%;padding:.1rem .4rem;border-radius:.3rem;font-size:.72rem;font-weight:560;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background-color .25s,color .25s}
.sf.sel .lbl{background:var(--accent);color:var(--on-accent)}
.sf .stack{position:relative;width:2.9rem;height:3.6rem}
.sf .stack>.doc{position:absolute;inset:0;transition:opacity .25s,transform .6s var(--spring)}
.sf.lifted .stack>.doc.orig{opacity:.35}
.sf .doc.cp{opacity:0;transform:scale(.8)}
.sf.has-copy .doc.cp{opacity:1;transform:translate(1.1rem,-.25rem) rotate(9deg)}
.cur{position:absolute;left:0;top:0;z-index:30;width:1.5rem;height:1.9rem;pointer-events:none;opacity:0;transition:opacity .35s}
.cur.vis{opacity:1}
.cur svg{width:100%;height:100%;overflow:visible;transform-origin:4px 3px;transition:transform .12s;filter:drop-shadow(0 2px 2.5px rgba(0,0,0,.28))}
.cur.down svg{transform:scale(.88)}
.cur .plus{position:absolute;left:1rem;top:1.3rem;width:1rem;height:1rem;border-radius:50%;display:grid;place-items:center;background:var(--copy-green);color:var(--on-green);font:700 .8rem/1 var(--f-display);opacity:0;transform:scale(.4);transition:opacity .15s,transform .25s var(--spring)}
.cur.copy .plus{opacity:1;transform:none}
.cur .key{position:absolute;left:1.75rem;top:-.6rem;padding:.2rem .4rem .25rem;border-radius:.4rem;background:var(--raised);border:1px solid var(--line-2);box-shadow:0 2px 0 var(--line-2);font:600 .7rem/1 var(--f-mono);white-space:nowrap;color:var(--ink);opacity:0;transform:translateY(4px);transition:opacity .2s,transform .3s var(--spring)}
.cur.shift .key{opacity:1;transform:none}
.ghost{position:absolute;left:0;top:0;z-index:25;pointer-events:none;opacity:0;transition:opacity .18s,scale .3s var(--ease)}
.ghost.on{opacity:.94}
.ghost.drop{scale:.25;opacity:0}
.ghost .doc{box-shadow:0 0 0 1px var(--line-2),0 1.1rem 1.9rem -.6rem var(--shadow-a)}
.ripple{position:absolute;z-index:4;width:calc(var(--R)*2);height:calc(var(--R)*1.732);translate:-50% -50%;background:var(--accent);opacity:0;pointer-events:none}
.ripple.go{animation:ripple .7s var(--ease)}
@keyframes ripple{from{opacity:.45;transform:scale(1)}to{opacity:0;transform:scale(1.6)}}
.float{z-index:12;opacity:0;scale:.92;visibility:hidden;pointer-events:none;transition:opacity .25s,scale .45s var(--spring),visibility 0s linear .3s}
.float.on{opacity:1;scale:1;visibility:visible;pointer-events:auto;transition:opacity .25s,scale .45s var(--spring),visibility 0s}
.prep,.toast{display:flex;align-items:center;gap:.7rem;padding:.8rem 1.1rem;border-radius:999px;background:var(--raised);border:1px solid var(--line-2);box-shadow:0 1.2rem 2.5rem -1.1rem var(--shadow-a);font-size:.88rem;font-weight:560;white-space:nowrap}
.toast{white-space:normal;width:max-content;max-width:min(20rem,86cqw);border-radius:1rem;line-height:1.35}
.toast .ic{color:var(--accent)}
.spin{width:1.1rem;height:1.1rem;border-radius:50%;border:2.5px solid var(--line-2);border-top-color:var(--accent);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.rv{width:min(22rem,90cqw)}

/* Home: sections */
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:2.5rem 0 0;padding:0;list-style:none}
.step{display:flex;flex-direction:column;gap:.6rem;padding:1.5rem 1.5rem 1.6rem;border-radius:1.4rem;background:var(--raised);border:1px solid var(--line)}
.step .n{width:2.4rem;height:2.08rem;display:grid;place-items:center;background:var(--accent);color:var(--on-accent);font:600 .9rem/1 var(--f-mono)}
.step h3{margin:.3rem 0 0;font-size:1.3rem;font-stretch:108%;font-weight:660;letter-spacing:-.02em;line-height:1.2}
.step p{margin:0;color:var(--ink-2)}
.step-note{margin:1.25rem 0 0;font-size:.95rem;color:var(--muted)}
@media (max-width:56rem){.steps{grid-template-columns:minmax(0,1fr)}}
.kinds{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,13.5rem),1fr));gap:1rem;margin-top:2.5rem}
.kind{position:relative;display:flex;flex-direction:column;gap:.5rem;padding:1.4rem 1.4rem 1.5rem;border-radius:1.4rem;background:var(--raised);border:1px solid var(--line);text-decoration:none;color:var(--ink);transition:border-color .25s,transform .35s var(--spring)}
.kind:hover{border-color:var(--accent);transform:translateY(-3px)}
.kind .kh{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;overflow-wrap:anywhere;font-size:1.15rem;font-weight:660;font-stretch:106%;letter-spacing:-.015em}
.kind .kh .hexmask{width:2.1rem;height:1.82rem;display:grid;place-items:center;background:var(--tint);color:var(--accent);flex:none}
.kind .kh .ic{width:1.05rem;height:1.05rem}
.kind p{margin:0;color:var(--ink-2);font-size:.98rem}
.kind .more{margin-top:auto;padding-top:.4rem;font-size:.9rem;font-weight:600;color:var(--accent)}
.after-links{display:flex;flex-wrap:wrap;gap:.75rem 1.5rem;margin-top:1.75rem;font-size:1rem}
.trust{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,3vw,2.5rem);margin-top:2.5rem}
.trust div{display:flex;flex-direction:column;gap:.5rem}
.trust .ic{width:1.5rem;height:1.5rem;color:var(--accent)}
.trust h3{margin:.2rem 0 0;font-size:1.2rem;font-weight:660;font-stretch:106%;letter-spacing:-.015em}
.trust p{margin:0;color:var(--ink-2)}
@media (max-width:56rem){.trust{grid-template-columns:minmax(0,1fr)}}
.final{position:relative;isolation:isolate;overflow:hidden;padding-block:clamp(4.5rem,10vw,8.5rem)}
.final .lattice{-webkit-mask-image:radial-gradient(70% 70% at 30% 50%,#000 20%,transparent 75%);mask-image:radial-gradient(70% 70% at 30% 50%,#000 20%,transparent 75%)}
.final-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(1.5rem,5vw,5rem);align-items:center}
.cmark{position:relative;width:min(20rem,64vw);aspect-ratio:1;justify-self:center;container-type:inline-size}
.cm{position:absolute;left:50%;top:50%;width:22.69%;height:26.2%;margin:-13.1% 0 0 -11.345%;background:var(--mark-ink);-webkit-mask:var(--hexp) center/100% 100% no-repeat;mask:var(--hexp) center/100% 100% no-repeat;transform:translate(calc(var(--ox)*1cqw),calc(var(--oy)*1cqw))}
.cm.g{background:var(--mark-gold);overflow:hidden}
.cm.g::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.55) 50%,transparent 65%);transform:translateX(-120%)}
.cmark.formed .cm.g::after{animation:glint 1.4s var(--ease) .2s}
@keyframes glint{to{transform:translateX(120%)}}
.final h2{margin:0;font-size:clamp(3.25rem,9vw,8.5rem);font-weight:720;font-stretch:125%;letter-spacing:-.055em;line-height:.9}
.final .sub{margin-top:1.4rem}
@media (max-width:56rem){.final-grid{grid-template-columns:minmax(0,1fr)}.cmark{width:min(13rem,56vw)}}

/* Inner pages */
.page-head{padding-block:clamp(2.5rem,6vw,4.5rem) clamp(1.5rem,3vw,2.5rem)}
.page-title{margin:0 0 1rem;font-size:clamp(2.4rem,6vw,4.75rem);font-weight:690;font-stretch:114%;letter-spacing:-.045em;line-height:.98;max-width:16ch}
.jump{display:flex;flex-wrap:wrap;gap:.45rem;margin:1.75rem 0 0;padding:0;list-style:none}
.jump a{display:inline-flex;align-items:center;min-height:2.4rem;padding:.35rem .9rem;border-radius:999px;border:1px solid var(--line-2);font-size:.9rem;font-weight:580;text-decoration:none;color:var(--ink-2)}
.jump a:hover{border-color:var(--accent);color:var(--ink)}
.fsec{padding-block:clamp(2.5rem,5vw,4rem);border-top:1px solid var(--line)}
.fgrid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(1.5rem,4vw,4rem);align-items:start}
@media (max-width:56rem){.fgrid{grid-template-columns:minmax(0,1fr)}}
.fsec h2{margin:0 0 .6rem;font-size:clamp(1.75rem,3.2vw,2.5rem);font-weight:670;font-stretch:110%;letter-spacing:-.035em;line-height:1.05}
.fsec .for{margin:0 0 1rem;font:500 .85rem/1.5 var(--f-mono);color:var(--muted)}
.ticks{margin:0;padding:0;list-style:none;display:grid;gap:.75rem}
.ticks li{position:relative;padding-left:1.7rem;color:var(--ink-2)}
.ticks li::before{content:"";position:absolute;left:0;top:.42em;width:.9rem;height:.78rem;background:var(--accent);-webkit-mask:var(--hex) center/100% 100% no-repeat;mask:var(--hex) center/100% 100% no-repeat}
.ticks b{color:var(--ink);font-weight:640}
.limit{margin:1.1rem 0 0;padding:.85rem 1rem;border-radius:.9rem;background:var(--paper-2);border:1px solid var(--line);font-size:.95rem;color:var(--ink-2)}
.limit b{color:var(--ink)}
.panel{padding:clamp(.6rem,3vw,2rem);border-radius:1.5rem;background:var(--paper-2);border:1px solid var(--line)}
.fam{display:flex;flex-wrap:wrap;gap:.45rem;margin:1.5rem 0 0}
.fam button{display:inline-flex;align-items:center;gap:.5rem;min-height:2.75rem;padding:.35rem 1rem;border-radius:999px;border:1px solid var(--line-2);background:transparent;font-size:.95rem;font-weight:600;cursor:pointer;transition:background-color .25s,color .25s,border-color .25s}
.fam button:hover{border-color:var(--ink)}
.fam button[aria-selected="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.mc-stage{container-type:inline-size;display:flex;flex-direction:column;align-items:center;gap:1rem;padding-block:1.5rem 1rem}
.mc-stage .hc{--R:min(17.4cqw,4.1rem)}
.mc-hint{display:flex;gap:.6rem;align-items:flex-start;margin:1rem 0 0;max-width:46ch;min-height:3em;font-size:.98rem;color:var(--ink-2)}
.mc-hint .ic{color:var(--accent);margin-top:.15rem}
.mc-stage .hc-legend{width:100%}
.recipes{display:grid;grid-template-columns:minmax(0,1fr);gap:.9rem}
.recipe{padding:1.1rem 1.2rem;border-radius:1.1rem;background:var(--raised);border:1px solid var(--line)}
.recipe h3{margin:0 0 .6rem;font-size:1.1rem;font-weight:660}
.recipe ol{margin:0;padding:0;list-style:none;display:grid;gap:.45rem;counter-reset:s}
.recipe li{display:flex;gap:.65rem;align-items:baseline;counter-increment:s;color:var(--ink-2);overflow-wrap:anywhere}
.recipe li::before{content:counter(s);flex:none;width:1.6rem;height:1.38rem;display:grid;place-items:center;background:var(--tint);color:var(--accent);font:600 .75rem/1 var(--f-mono);-webkit-mask:var(--hex) center/100% 100% no-repeat;mask:var(--hex) center/100% 100% no-repeat}
.review-demo{max-width:24rem}
.settings{max-width:34rem}
.set-main{display:grid;grid-template-columns:minmax(0,1fr);gap:.9rem;padding:1.1rem 1.2rem 1.25rem}
.set-main h3{margin:.2rem 0 0;font:600 .72rem/1.2 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.sw{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.3rem}
.sw button{display:flex;flex-direction:column;align-items:center;gap:.4rem;min-height:2.75rem;padding:.5rem .1rem;border:0;border-radius:.6rem;background:transparent;font-size:.78rem;font-weight:600;cursor:pointer}
.sw button:hover{background:var(--line)}
.sw .chip{width:2.5rem;height:2.17rem;display:grid;place-items:center;background:var(--sw);color:var(--paper);transition:transform .4s var(--spring)}
.sw .chip .ic{width:1rem;height:1rem;stroke-width:2.6;opacity:0}
.sw button[aria-checked="true"]{background:var(--line)}
.sw button[aria-checked="true"] .chip{transform:scale(1.08)}
.sw button[aria-checked="true"] .chip .ic{opacity:1}
@media (max-width:30rem){.sw{grid-template-columns:repeat(auto-fill,minmax(min(100%,max(30%,3rem)),1fr))}}
.seg{display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:2px;width:max-content;max-width:100%;padding:3px;border-radius:.65rem;background:var(--line)}
.seg button{min-height:2.4rem;padding:.3rem .85rem;border:0;border-radius:.5rem;background:transparent;font-size:.85rem;font-weight:600;color:var(--ink-2);cursor:pointer}
.seg button[aria-checked="true"]{background:var(--raised);color:var(--ink);box-shadow:0 1px 3px var(--shadow-b)}
.set-prev{container-type:inline-size;display:grid;justify-items:center;padding:1rem .5rem;border-radius:.9rem;background:var(--paper-2)}
.set-prev .hc{--R:min(13.5cqw,2.6rem)}
.icon-note{display:flex;align-items:center;gap:1rem;margin:1.5rem 0 0;max-width:44ch;font-size:.98rem;color:var(--ink-2)}
.icon-note span{min-width:0;overflow-wrap:anywhere}
.icon-note img{width:4rem;height:auto;flex:none;filter:drop-shadow(0 .5rem .9rem var(--shadow-a))}
.price-points{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));gap:1rem;margin-top:1.5rem}
.price-points div{padding:1.2rem 1.3rem;border-radius:1.1rem;background:var(--raised);border:1px solid var(--line)}
.price-points h3{margin:0 0 .35rem;font-size:1.1rem;font-weight:660}
.price-points p{margin:0;color:var(--ink-2);font-size:.98rem}
.soon-box{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 2rem;padding:clamp(1.4rem,3vw,2.2rem);border-radius:1.5rem;background:var(--ink);color:var(--paper)}
.soon-box h2{margin:0;font-size:clamp(1.6rem,3vw,2.3rem);font-weight:680;font-stretch:112%;letter-spacing:-.03em;line-height:1.1}
.soon-box p{margin:.4rem 0 0;max-width:46ch;opacity:.85}
.soon-box a{color:var(--paper)}
.soon-box .btn-ghost{color:var(--paper);border-color:color-mix(in srgb,var(--paper) 40%,transparent)}
.soon-box .btn-ghost:hover{border-color:var(--paper)}

/* Formats */
.fmt-intro{display:grid;gap:.9rem;max-width:62ch}
.fmt-group{padding-block:clamp(2rem,4vw,3rem);border-top:1px solid var(--line)}
.fmt-group h2{margin:0 0 .35rem;font-size:clamp(1.5rem,2.8vw,2.1rem);font-weight:670;font-stretch:110%;letter-spacing:-.03em}
.fmt-group>p{margin:0 0 1.1rem;color:var(--ink-2);max-width:62ch}
.fmt-table{width:100%;border-collapse:collapse;font-size:.98rem}
.fmt-table caption{text-align:left;font-weight:600;padding-bottom:.6rem}
.fmt-table th,.fmt-table td{text-align:left;vertical-align:top;padding:.75rem .6rem;border-bottom:1px solid var(--line)}
.fmt-table thead th{font:600 .72rem/1.2 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line-2)}
.fmt-table th[scope="row"]{white-space:nowrap;width:1%;padding-right:1.4rem}
.chips{display:flex;flex-wrap:wrap;gap:.35rem;margin:0;padding:0;list-style:none}
.chips li,.fx{display:inline-flex;align-items:center;min-height:1.75rem;padding:.15rem .55rem;border-radius:.45rem;border:1px solid var(--line-2);background:var(--raised);font:500 .82rem/1.2 var(--f-mono);letter-spacing:.03em}
.fx{border-color:transparent;background:var(--tint);color:var(--ink);font-weight:600}
@media (max-width:40rem){.fmt-table thead{display:none}.fmt-table,.fmt-table tbody,.fmt-table tr,.fmt-table th,.fmt-table td{display:block;width:100%}.fmt-table tr{padding:.7rem 0;border-bottom:1px solid var(--line)}.fmt-table th,.fmt-table td{border:0;padding:.2rem 0}.fmt-table th[scope="row"]{white-space:normal}.fmt-table .fx{max-width:100%;overflow-wrap:anywhere}.fmt-table td::before{content:"Converts to";display:block;margin:.35rem 0 .35rem;font:600 .68rem/1.2 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}}

/* Prose pages: support and privacy */
.prose{max-width:46rem}
.prose h1{margin:0 0 1rem;font-size:clamp(2.3rem,6vw,3.6rem);font-weight:690;font-stretch:112%;letter-spacing:-.04em;line-height:1.02}
.prose h2{margin:2.2rem 0 .6rem;font-size:1.35rem;font-weight:660;font-stretch:106%;letter-spacing:-.02em;line-height:1.25}
.prose p{margin:0 0 1rem}
.prose .lead{font-size:1.2rem;color:var(--ink-2);line-height:1.5}
.prose .note{font-size:.95rem;color:var(--muted)}
.prose a{color:var(--ink);text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:.22em}
.contact{display:flex;align-items:center;flex-wrap:wrap;gap:.9rem;margin:1.5rem 0 1.75rem}
.contact span{font-size:.95rem;color:var(--muted)}
.prose .button{display:inline-flex;align-items:center;justify-content:center;min-height:3rem;padding:.6rem 1.25rem;border-radius:999px;background:var(--ink);color:var(--paper);font-weight:620;text-decoration:none}
.faq{margin-top:1.75rem;border-top:1px solid var(--line-2)}
.faq details{border-bottom:1px solid var(--line-2)}
.faq summary{position:relative;list-style:none;cursor:pointer;padding:1.15rem 2.2rem 1.15rem 0;min-height:3.5rem;font-weight:620}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:.3rem;top:1rem;font-weight:400;font-size:1.4rem;line-height:1;color:var(--accent)}
.faq details[open] summary::after{content:"−"}
.faq details p{padding-right:1rem;color:var(--ink-2)}
.policy>section+section{margin-top:1.6rem}

/* Footer */
.foot{margin-top:auto;border-top:1px solid var(--line);padding-block:2.75rem calc(2.5rem + env(safe-area-inset-bottom,0px))}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,1fr));gap:2rem 3rem;align-items:start}
.foot .brand{font-size:1.1rem}
.foot-about{margin:.7rem 0 0;max-width:32ch;color:var(--ink-2);font-size:.95rem}
.foot h2{margin:0 0 .7rem;font:600 .72rem/1.2 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.foot ul{margin:0;padding:0;list-style:none;display:grid;gap:.35rem}
.foot ul a{display:inline-block;padding:.2rem 0;color:var(--ink-2);text-decoration:none;font-size:.98rem;overflow-wrap:anywhere}
.foot ul a:hover{color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:.22em}
.legal{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.9rem 1.5rem;margin-top:2.25rem;padding-top:1.25rem;border-top:1px solid var(--line);font-size:.82rem;color:var(--muted)}
.motion-btn{display:inline-flex;align-items:center;gap:.5rem;min-height:2.5rem;padding:.3rem .9rem;border-radius:999px;border:1px solid var(--line-2);background:transparent;font-size:.85rem;font-weight:600;color:var(--ink-2);cursor:pointer}
.motion-btn:hover{border-color:var(--ink);color:var(--ink)}
.motion-btn .ic{width:1rem;height:1rem}
@media (max-width:47.5rem){.foot-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.75rem 1.5rem}.foot-grid>:first-child{grid-column:1/-1}}
@media (max-width:26rem){.foot-grid{grid-template-columns:minmax(0,1fr)}}

/* Colour change reveal */
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}

/* Motion off: the footer switch, or Reduce Motion unless the visitor turns motion back on */
.calm *,.calm *::before,.calm *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0s!important;transition-duration:.01ms!important;transition-delay:0s!important}
.calm{scroll-behavior:auto}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}:root:not(.motion-ok) *,:root:not(.motion-ok) *::before,:root:not(.motion-ok) *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}