/* GeoTag Camera website. Palette from the app's design system: ink #16181A / #F5F7F8,
   chrome #0C0E10, accent "verified" #56CB98 (dark) and #2FA878 (light). Text and filled
   buttons use a deeper green on light surfaces so they clear WCAG AA contrast. */

@font-face{font-family:"Poppins";font-style:normal;font-weight:300;font-display:swap;src:url("fonts/poppins_light.ttf") format("truetype")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/poppins_regular.ttf") format("truetype")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/poppins_medium.ttf") format("truetype")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/poppins_semibold.ttf") format("truetype")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/poppins_bold.ttf") format("truetype")}
@font-face{font-family:"Roboto Mono";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/roboto_mono_regular.ttf") format("truetype")}
@font-face{font-family:"Roboto Mono";font-style:normal;font-weight:500 700;font-display:swap;src:url("fonts/roboto_mono_medium.ttf") format("truetype")}

:root{
  --primary:#17744F; --on-primary:#FFFFFF; --primary-container:#D7F2E5; --on-primary-container:#0B3D2B;
  --accent:#2FA878;
  --secondary:#2462B0; --on-secondary:#FFFFFF; --secondary-container:#DCEBFF; --on-secondary-container:#0A2E52;
  --tertiary:#8A5A1F; --on-tertiary:#FFFFFF; --tertiary-container:#FBE6CE; --on-tertiary-container:#4A2E0C;
  --surface:#F5F7F8; --surface-dim:#EAEDEF; --surface-bright:#FFFFFF;
  --on-surface:#16181A; --on-surface-variant:#555B61; --outline:#D3D8DC;
  --chrome:#0C0E10; --on-chrome:#F5F7F8;
  --warn-bg:#FBE6CE; --warn-fg:#4A2E0C;
  --shape-sm:16px; --shape-md:24px; --shape-lg:32px; --shape-xl:48px;
  --font-display:"Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:"Roboto Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;
  color-scheme:light;
}
:root[data-theme="dark"]{
  --primary:#7FDDB2; --on-primary:#04331F; --primary-container:#0F4A34; --on-primary-container:#BEF2D9;
  --accent:#56CB98;
  --secondary:#9CCBFF; --on-secondary:#05264A; --secondary-container:#123A66; --on-secondary-container:#D3E8FF;
  --tertiary:#F0BE7E; --on-tertiary:#3D2508; --tertiary-container:#5C3A12; --on-tertiary-container:#FBDDB4;
  --surface:#121417; --surface-dim:#0C0E10; --surface-bright:#1B1E22;
  --on-surface:#F5F7F8; --on-surface-variant:#A3A9AF; --outline:#33383D;
  --warn-bg:#4A2E0C; --warn-fg:#FBDDB4;
  color-scheme:dark;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --primary:#7FDDB2; --on-primary:#04331F; --primary-container:#0F4A34; --on-primary-container:#BEF2D9;
    --accent:#56CB98;
    --secondary:#9CCBFF; --on-secondary:#05264A; --secondary-container:#123A66; --on-secondary-container:#D3E8FF;
    --tertiary:#F0BE7E; --on-tertiary:#3D2508; --tertiary-container:#5C3A12; --on-tertiary-container:#FBDDB4;
    --surface:#121417; --surface-dim:#0C0E10; --surface-bright:#1B1E22;
    --on-surface:#F5F7F8; --on-surface-variant:#A3A9AF; --outline:#33383D;
    --warn-bg:#4A2E0C; --warn-fg:#FBDDB4;
    color-scheme:dark;
  }
}

*{box-sizing:border-box; margin:0; padding:0; min-width:0}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%}
body{
  background:var(--surface); color:var(--on-surface); font-family:var(--font-display);
  line-height:1.6; overflow-x:hidden; width:100%;
}
img,svg{display:block; max-width:100%}
img{height:auto}
a{color:var(--primary); text-underline-offset:.18em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--primary); outline-offset:3px; border-radius:6px}
code,kbd,pre{font-family:var(--font-mono)}
.wrap{max-width:1180px; margin:0 auto; padding:0 clamp(1rem,4vw,1.5rem); width:100%}
section{padding:5rem 0}
h1,h2,h3,h4{text-wrap:balance; letter-spacing:-0.015em; color:var(--on-surface)}
h1{font-size:clamp(2rem,7vw,4rem); line-height:1.1; font-weight:300}
h2{font-size:clamp(1.55rem,5vw,2.5rem); line-height:1.18; font-weight:400}
h3{font-size:1.15rem; font-weight:500; letter-spacing:-0.01em}
p{color:var(--on-surface-variant); max-width:64ch}
.lead{margin-top:1rem}
.eyebrow{
  font-family:var(--font-mono); font-size:.78rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--primary); font-weight:500; margin-bottom:.5rem;
}
.icon{width:26px; height:26px; stroke:currentColor; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; flex:none}
.icon-sm{width:20px; height:20px}
.visually-hidden{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:-4rem; z-index:100; background:var(--primary); color:var(--on-primary);
  padding:.7rem 1.1rem; border-radius:12px; font-weight:600; text-decoration:none;
}
.skip-link:focus{top:1rem}

/* header */
header.site{
  position:sticky; top:0; z-index:20; backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  background:color-mix(in srgb, var(--surface) 86%, transparent);
  border-bottom:1px solid var(--outline);
}
.navbar{
  display:flex; align-items:center; justify-content:space-between; gap:.75rem;
  padding:.8rem clamp(1rem,4vw,1.5rem); max-width:1180px; margin:0 auto;
}
.navbar-actions{display:flex; align-items:center; gap:.5rem; flex:none}
.brand{display:flex; align-items:center; gap:.6rem; font-weight:700; font-size:1.05rem; min-width:0; color:var(--on-surface); text-decoration:none}
.brand span{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.brand svg{width:30px; height:30px; flex:none}
.mark-frame{fill:var(--on-surface)}
.mark-dot{fill:#56CB98}
.navlinks{display:flex; align-items:center; gap:1.5rem; font-size:.92rem; font-weight:500}
.navlinks a{text-decoration:none; color:var(--on-surface-variant); padding:.3rem 0}
.navlinks a:hover,.navlinks a[aria-current="page"]{color:var(--on-surface)}
.navlinks a[aria-current="page"]{box-shadow:inset 0 -2px 0 var(--accent)}
.icon-btn{
  display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px;
  border-radius:50%; border:1px solid var(--outline); background:transparent; cursor:pointer; color:var(--on-surface); flex:none;
}
.icon-btn:hover{background:var(--surface-dim)}
.icon-btn .icon{width:22px; height:22px}
.theme-dark-icon{display:none}
:root[data-theme="dark"] .theme-dark-icon{display:block}
:root[data-theme="dark"] .theme-light-icon{display:none}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .theme-dark-icon{display:block}
  :root:not([data-theme="light"]) .theme-light-icon{display:none}
}
.no-js .js-only{display:none}
.menu-btn{display:none}
.menu-btn span, .menu-btn span::before, .menu-btn span::after{
  content:""; display:block; width:18px; height:2px; background:currentColor; border-radius:2px;
  transition:transform .25s, opacity .25s;
}
.menu-btn span{position:relative}
.menu-btn span::before{position:absolute; top:-6px}
.menu-btn span::after{position:absolute; top:6px}
.menu-btn[aria-expanded="true"] span{background:transparent}
.menu-btn[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg)}
.menu-btn[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg)}
.mobile-panel{
  display:none; flex-direction:column; max-width:1180px; margin:0 auto;
  padding:0 clamp(1rem,4vw,1.5rem) 1rem;
}
.mobile-panel a{
  text-decoration:none; color:var(--on-surface); font-weight:600; font-size:1rem;
  padding:.85rem .2rem; border-bottom:1px solid var(--outline);
}
.mobile-panel[data-open="true"]{display:flex}

/* buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.85rem 1.5rem; border-radius:var(--shape-lg);
  font-weight:700; font-size:.95rem; text-decoration:none; border:none; cursor:pointer; min-height:48px;
  transition:transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .25s;
}
.btn:hover{transform:translateY(-2px)}
.btn-filled{background:var(--primary); color:var(--on-primary)}
.btn-tonal{background:var(--primary-container); color:var(--on-primary-container)}
.btn-outline{background:transparent; color:var(--on-surface); border:1.5px solid var(--outline)}
.btn .icon{width:20px; height:20px}

/* hero */
.hero{position:relative; padding:4.5rem 0 3.5rem; overflow:hidden; isolation:isolate}
.hero-blob{
  position:absolute; top:-18%; right:-14%; width:60vw; max-width:820px; aspect-ratio:1;
  background:radial-gradient(circle at 32% 30%, var(--primary-container), transparent 68%);
  border-radius:44% 56% 62% 38% / 48% 42% 58% 52%;
  animation:blobMove 16s ease-in-out infinite alternate; z-index:-1;
}
@keyframes blobMove{
  0%{border-radius:44% 56% 62% 38% / 48% 42% 58% 52%; transform:rotate(0deg)}
  100%{border-radius:58% 42% 40% 60% / 55% 60% 40% 45%; transform:rotate(8deg)}
}
.hero-grid{display:grid; grid-template-columns:1.15fr .85fr; gap:3rem; align-items:center}
.hero .lede{font-size:1.15rem; margin-top:1.3rem; max-width:52ch}
.hero .quip{margin-top:.9rem; font-weight:500; color:var(--on-surface)}
.hero-cta{display:flex; gap:1rem; margin-top:2rem; flex-wrap:wrap}
.hero-meta{margin-top:1rem; font-family:var(--font-mono); font-size:.8rem}
.badges{display:flex; gap:.6rem; flex-wrap:wrap; margin-top:2rem; list-style:none}
.badge{
  font-family:var(--font-mono); font-size:.74rem; padding:.4rem .8rem; border-radius:var(--shape-sm);
  background:var(--surface-bright); border:1px solid var(--outline); color:var(--on-surface-variant);
}
.stamp-demo{
  background:var(--chrome); color:var(--on-chrome); border-radius:var(--shape-xl) var(--shape-xl) var(--shape-xl) var(--shape-sm);
  padding:1.6rem; box-shadow:0 30px 60px -30px rgba(0,0,0,.35);
}
.stamp-demo .frame{
  aspect-ratio:3/4; border-radius:22px; background:
    linear-gradient(180deg, #2a3b36 0%, #1d2a33 55%, #151b20 100%);
  position:relative; overflow:hidden; display:flex; align-items:flex-end; padding:.8rem;
}
.stamp-demo .frame svg.scene{position:absolute; inset:0; width:100%; height:100%}
.stamp-card{
  position:relative; width:100%; background:rgba(12,14,16,.74); border:1px solid rgba(245,247,248,.14);
  border-radius:14px; padding:.75rem .85rem; font-family:var(--font-mono); font-size:.72rem; line-height:1.55; color:#F5F7F8;
}
.stamp-card .place{font-family:var(--font-display); font-weight:600; font-size:.86rem}
.stamp-card .muted{color:#A3A9AF}
.stamp-card .signed{display:inline-flex; align-items:center; gap:.4rem; margin-top:.35rem; color:#BEF2D9; font-weight:500}
.stamp-card .signed::before{content:""; width:.55rem; height:.55rem; border-radius:50%; background:#56CB98}

/* soft panel sections */
.panel{background:var(--surface-dim); border-radius:var(--shape-xl); margin:0 clamp(1rem,4vw,1.5rem); padding:4rem 0}
.center{text-align:center}
.center p{margin-left:auto; margin-right:auto}
.narrow{max-width:780px}

.problem-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1.2rem; margin-top:2rem}
.card{
  background:var(--surface-bright); border:1px solid var(--outline); border-radius:var(--shape-md); padding:1.5rem;
}
.card h3{margin-bottom:.4rem}
.card p{font-size:.93rem; max-width:none}
.card .icon-wrap{background:var(--primary); color:var(--on-primary); width:44px; height:44px; margin-bottom:.9rem}
.card .icon-wrap .icon{width:22px; height:22px}

/* screenshots */
.shots{
  display:flex; gap:1.2rem; overflow-x:auto; padding:1.5rem clamp(1rem,4vw,1.5rem) 1.2rem;
  scroll-snap-type:x mandatory; max-width:1180px; margin:0 auto; list-style:none;
}
.shots li{flex:0 0 auto; width:min(240px,70vw); scroll-snap-align:start}
.shots figure{margin:0}
.shots img{
  width:100%; border-radius:22px; border:1px solid var(--outline); background:var(--surface-dim);
  aspect-ratio:9/19.5; object-fit:cover;
}
.shots figcaption{font-size:.85rem; color:var(--on-surface-variant); margin-top:.6rem}

/* features */
.feature-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.3rem; margin-top:2.5rem}
.feature-card{padding:1.8rem; border:1px solid transparent; transition:transform .3s cubic-bezier(.34,1.56,.64,1), box-shadow .3s}
.js .reveal{opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s cubic-bezier(.22,1,.36,1)}
.js .reveal.in-view{opacity:1; transform:none}
.feature-card:hover{box-shadow:0 20px 40px -24px rgba(0,0,0,.28)}
.feature-card:nth-child(3n+1){border-radius:var(--shape-xl) var(--shape-sm) var(--shape-xl) var(--shape-sm); background:var(--primary-container)}
.feature-card:nth-child(3n+2){border-radius:var(--shape-sm) var(--shape-xl) var(--shape-sm) var(--shape-xl); background:var(--secondary-container)}
.feature-card:nth-child(3n){border-radius:var(--shape-xl) var(--shape-xl) var(--shape-sm) var(--shape-sm); background:var(--tertiary-container)}
.feature-card:nth-child(3n+1) .icon-wrap{background:var(--primary); color:var(--on-primary)}
.feature-card:nth-child(3n+2) .icon-wrap{background:var(--secondary); color:var(--on-secondary)}
.feature-card:nth-child(3n) .icon-wrap{background:var(--tertiary); color:var(--on-tertiary)}
.icon-wrap{width:52px; height:52px; border-radius:var(--shape-sm); display:flex; align-items:center; justify-content:center; margin-bottom:1rem}
.feature-card h3{margin-bottom:.45rem}
.feature-card p{color:var(--on-surface); opacity:.86; font-size:.94rem; max-width:none}

/* verification */
.split{display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:start}
.terminal{
  background:var(--chrome); color:#F5F7F8; border-radius:var(--shape-xl);
  padding:2.2rem; font-family:var(--font-mono); font-size:.86rem; line-height:1.9; overflow-wrap:anywhere;
}
.terminal .k{color:#F0BE7E}
.terminal .s{color:#9CCBFF}
.terminal .ok{color:#56CB98}
.terminal p{color:inherit; max-width:none}
.terminal .gap{margin-top:.8rem}
.proves{display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; margin-top:2rem}
.proves .card h3{display:flex; align-items:center; gap:.5rem}
.proves ul{margin:.6rem 0 0 1.1rem; color:var(--on-surface-variant); font-size:.93rem}
.proves li{margin:.35rem 0}
.yes .icon{color:var(--primary)}
.no .icon{color:var(--tertiary)}
.steps{counter-reset:step; list-style:none; margin-top:1.4rem}
.steps li{counter-increment:step; position:relative; padding-left:2.6rem; margin:1rem 0; color:var(--on-surface-variant)}
.steps li::before{
  content:counter(step); position:absolute; left:0; top:-.05rem; width:1.8rem; height:1.8rem; border-radius:50%;
  background:var(--primary-container); color:var(--on-primary-container); font-family:var(--font-mono); font-weight:500;
  display:flex; align-items:center; justify-content:center; font-size:.85rem;
}
.steps strong{color:var(--on-surface)}

/* profiles */
.profile-grid{display:grid; grid-template-columns:1fr 1fr; gap:1.3rem; margin-top:2rem}
.profile{border-radius:var(--shape-xl); padding:2rem; border:1px solid var(--outline); background:var(--surface-bright)}
.profile .tag{font-family:var(--font-mono); font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; color:var(--primary)}
.profile h3{font-size:1.4rem; font-weight:500; margin:.3rem 0 .6rem}
.profile ul{margin:.8rem 0 0 1.1rem; color:var(--on-surface-variant)}
.profile li{margin:.3rem 0}

/* privacy summary */
.checklist{list-style:none; margin-top:1.4rem; display:grid; gap:.8rem}
.checklist li{display:flex; gap:.7rem; align-items:flex-start; color:var(--on-surface-variant)}
.checklist li .icon{width:22px; height:22px; color:var(--primary); margin-top:.15rem}
.checklist strong{color:var(--on-surface)}

/* roadmap */
.roadmap-chips{display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.2rem; list-style:none}
.chip{padding:.55rem 1.05rem; border-radius:var(--shape-lg); border:1px dashed var(--outline); font-size:.88rem; color:var(--on-surface-variant)}
.chip-solid{border-style:solid; background:var(--surface-bright)}

/* faq */
.faq{max-width:820px; margin-top:2rem}
.faq details{border-bottom:1px solid var(--outline); padding:1.2rem 0}
.faq summary{
  cursor:pointer; font-weight:600; font-size:1.05rem; list-style:none; display:flex; gap:1rem;
  justify-content:space-between; align-items:center; color:var(--on-surface);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; font-size:1.4rem; color:var(--primary); transition:transform .25s; flex:none}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin-top:.8rem}

/* CTA band */
.cta-band{
  background:var(--chrome); color:var(--on-chrome); border-radius:var(--shape-xl);
  padding:4rem 2rem; text-align:center;
}
.cta-band h2{color:var(--on-chrome)}
.cta-band p{color:#A3A9AF; margin:1rem auto 2rem}
.cta-band .btn-filled{background:#56CB98; color:#04331F}
.cta-band .btn-outline{border-color:#33383D; color:#F5F7F8}
.cta-band a:not(.btn){color:#7FDDB2}

/* store badges */
.stores{display:flex; flex-wrap:wrap; gap:1rem 1.2rem; align-items:flex-start; margin-top:1.6rem}
.cta-band .stores{justify-content:center}
.store{display:flex; flex-direction:column; align-items:center; gap:.35rem; text-decoration:none; color:inherit; border-radius:12px}
.store img{height:58px; width:auto}
.store-note{font-size:.76rem; font-family:var(--font-mono); color:var(--on-surface-variant); text-align:center; max-width:17rem}
.cta-band .store-note{color:#A3A9AF}
.store.is-soon img{filter:grayscale(1); opacity:.45}
.store.is-soon .store-note{font-weight:500; letter-spacing:.06em; text-transform:uppercase}

/* sub-page header and prose */
.page-head{padding:3.5rem 0 1.5rem}
.page-head h1{font-size:clamp(2rem,6vw,3.2rem)}
.page-head p{margin-top:.9rem; font-size:1.05rem}
.page-body{padding:1rem 0 4rem}
.prose{max-width:820px}
.prose > * + *{margin-top:1rem}
.prose h2{font-size:clamp(1.35rem,4vw,1.8rem); margin-top:2.6rem; font-weight:500}
.prose h3{margin-top:2rem; font-size:1.15rem}
.prose h4{margin-top:1.5rem; font-size:1rem; font-weight:600}
.prose p, .prose li{color:var(--on-surface-variant); max-width:72ch}
.prose strong{color:var(--on-surface)}
.prose ul, .prose ol{padding-left:1.4rem}
.prose li{margin:.35rem 0}
.prose hr{border:none; border-top:1px solid var(--outline); margin:2.5rem 0}
.prose blockquote{border-left:3px solid var(--accent); padding:.3rem 0 .3rem 1rem}
.prose :not(pre) > code{font-size:.86em; background:var(--surface-dim); border:1px solid var(--outline); padding:.08em .35em; border-radius:6px; overflow-wrap:anywhere}
.prose h2 a.anchor, .prose h3 a.anchor{opacity:0; margin-left:.4rem; text-decoration:none; color:var(--on-surface-variant); font-weight:400}
.prose h2:hover a.anchor, .prose h3:hover a.anchor, .prose a.anchor:focus{opacity:1}
pre{
  background:var(--chrome); color:#F5F7F8; border-radius:var(--shape-sm); padding:1rem 1.2rem;
  overflow-x:auto; font-size:.84rem; line-height:1.6; max-width:100%;
}
pre code{white-space:pre}
pre.license-text{background:var(--surface-bright); color:var(--on-surface); border:1px solid var(--outline); white-space:pre-wrap; overflow-wrap:anywhere; font-size:.8rem}
pre.license-text code{white-space:pre-wrap}
.table-wrap{overflow-x:auto; max-width:100%; border:1px solid var(--outline); border-radius:var(--shape-sm)}
table{border-collapse:collapse; width:100%; font-size:.9rem}
th,td{text-align:left; padding:.7rem .9rem; border-bottom:1px solid var(--outline); vertical-align:top; color:var(--on-surface-variant)}
th{color:var(--on-surface); font-weight:600; background:var(--surface-dim)}
tr:last-child td{border-bottom:none}
td code{overflow-wrap:anywhere}
.toc{border:1px solid var(--outline); border-radius:var(--shape-md); padding:1.2rem 1.4rem; background:var(--surface-bright); max-width:820px; margin-bottom:2rem}
.toc ol{margin:.5rem 0 0 1.2rem; columns:2 16rem; column-gap:2rem}
.toc li{margin:.25rem 0; break-inside:avoid; color:var(--on-surface-variant)}
.source-note{font-size:.85rem; font-family:var(--font-mono); margin-top:2.5rem; padding-top:1.2rem; border-top:1px solid var(--outline); max-width:820px}
.license-block{border:1px solid var(--outline); border-radius:var(--shape-md); padding:1rem 1.2rem; margin-top:1rem; background:var(--surface-bright)}
.license-block summary{cursor:pointer; font-weight:600; color:var(--on-surface)}
.license-block[open] summary{margin-bottom:1rem}

.notice{
  border-radius:var(--shape-md); padding:1.2rem 1.4rem; display:flex; gap:.9rem; align-items:flex-start;
  background:var(--warn-bg); color:var(--warn-fg); max-width:820px;
}
.notice p, .notice strong{color:var(--warn-fg); max-width:none}
.notice .icon{margin-top:.1rem}
.notice.info{background:var(--primary-container); color:var(--on-primary-container)}
.notice.info p, .notice.info strong{color:var(--on-primary-container)}
.notice a{color:inherit; font-weight:600}

.cmd-grid{display:grid; gap:1rem; margin-top:1rem}
.cmd h4{margin:0 0 .4rem; font-size:.95rem}
.req-list{list-style:none; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1rem; margin-top:1.2rem}
.req-list li{background:var(--surface-bright); border:1px solid var(--outline); border-radius:var(--shape-md); padding:1.1rem 1.2rem; color:var(--on-surface-variant); font-size:.93rem}
.req-list strong{display:block; color:var(--on-surface); font-size:1rem; margin-bottom:.2rem}

.support-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; margin-top:1.5rem}
.support-grid .card{display:flex; flex-direction:column}
.support-grid .card .btn{margin-top:auto; align-self:flex-start}
.support-grid .card p{margin-bottom:1.2rem}

/* footer */
footer.site{padding:3.5rem 0 2.5rem; margin-top:3rem; border-top:1px solid var(--outline)}
.foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:2rem}
.foot-grid h2{font-size:.78rem; font-family:var(--font-mono); letter-spacing:.14em; text-transform:uppercase; color:var(--on-surface-variant); font-weight:500; margin-bottom:.8rem}
.foot-grid ul{list-style:none; display:grid; gap:.45rem; font-size:.92rem}
.foot-grid a{color:var(--on-surface); text-decoration:none}
.foot-grid a:hover{color:var(--primary); text-decoration:underline}
.foot-brand p{font-size:.9rem; margin-top:.7rem}
.foot-bottom{display:flex; flex-wrap:wrap; justify-content:space-between; gap:.6rem 1.5rem; margin-top:2.5rem; padding-top:1.4rem; border-top:1px solid var(--outline); font-size:.85rem; color:var(--on-surface-variant)}
.foot-bottom p{font-size:.85rem; max-width:none}
.foot-bottom .mono{font-family:var(--font-mono)}

/* section dividers (from the original landing page) */
.section-divider{display:flex; align-items:center; gap:1.1rem; max-width:1180px; margin:0 auto; padding:0 clamp(1rem,4vw,1.5rem); height:64px}
.section-divider .line{flex:1; height:1px; background:linear-gradient(90deg, transparent, var(--outline), transparent)}
.section-divider .motif{
  width:42px; height:42px; flex:none; display:flex; align-items:center; justify-content:center;
  border-radius:38% 62% 60% 40% / 46% 40% 60% 54%; animation:motifMorph 6s ease-in-out infinite alternate;
  background:var(--primary); color:var(--on-primary);
}
.section-divider.alt .motif{background:var(--secondary); color:var(--on-secondary)}
.section-divider.alt2 .motif{background:var(--tertiary); color:var(--on-tertiary)}
.section-divider .motif svg{width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
@keyframes motifMorph{
  0%{border-radius:38% 62% 60% 40% / 46% 40% 60% 54%}
  100%{border-radius:58% 42% 40% 60% / 55% 60% 40% 45%}
}

/* 404 */
.error-page{padding:6rem 0; text-align:center}
.error-page .code{font-family:var(--font-mono); font-size:.9rem; color:var(--primary); letter-spacing:.14em}
.error-page p{margin:1rem auto 0}
.error-page .hero-cta{justify-content:center}

@media (max-width:960px){
  .navlinks{display:none}
  .menu-btn{display:inline-flex}
  .hero-grid{grid-template-columns:1fr; gap:2.5rem}
  .stamp-demo{max-width:340px; margin:0 auto; width:100%}
  .split{grid-template-columns:1fr}
  .feature-grid{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr}
  .support-grid{grid-template-columns:1fr}
}
@media (max-width:640px){
  section{padding:3.2rem 0}
  .hero{padding:2.2rem 0 2rem}
  .hero-blob{width:110vw; top:-10%; right:-30%; opacity:.7}
  .feature-grid, .proves, .profile-grid{grid-template-columns:1fr}
  .panel{padding:2.8rem 0; border-radius:var(--shape-lg)}
  .cta-band{padding:2.6rem 1.2rem; border-radius:var(--shape-lg)}
  .terminal{padding:1.4rem; font-size:.78rem}
  .hero-cta .btn{flex:1 1 auto}
  .badge{font-size:.7rem; padding:.35rem .7rem}
  .brand{font-size:.95rem}
  .brand svg{width:26px; height:26px}
  .store img{height:50px}
  .profile{padding:1.5rem}
  .foot-grid{grid-template-columns:1fr}
  th,td{padding:.55rem .6rem}
}
@media (max-width:380px){
  h1{font-size:1.85rem}
  .navbar{gap:.4rem}
  .icon-btn{width:40px; height:40px}
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none !important; transition:none !important}
  .js .reveal{opacity:1; transform:none}
}
@media print{
  header.site, .skip-link, .section-divider, .hero-blob, footer.site{display:none}
  body{background:#fff; color:#000}
}
.center-row{justify-content:center}
.eyebrow.sub{margin-top:2rem}
.prose h3.h4{font-size:1rem; font-weight:600; margin:0 0 .4rem}
.cmd{background:var(--surface-bright); border:1px solid var(--outline); border-radius:var(--shape-md); padding:1.1rem 1.2rem}
.cmd > * + *{margin-top:.6rem}
.prose, .prose p, .prose li{overflow-wrap:break-word}
.prose a{overflow-wrap:anywhere}
.page-head h1{overflow-wrap:break-word}