/* G.L.O LLC site: every colour, gap and font comes from design/tokens.css (var(--g-*)). */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--g-bg);color:var(--g-ink);font:400 var(--g-text-base)/var(--g-leading-body) var(--g-font-body);-webkit-font-smoothing:antialiased}
a{color:inherit}
.wrap{max-width:1040px;margin:0 auto;padding:0 var(--g-s4)}
@media (min-width:720px){.wrap{padding:0 var(--g-s6)}}
header.top{border-bottom:1px solid var(--g-line)}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--g-s4);min-height:64px}
.brand{display:flex;align-items:center;gap:var(--g-s3);text-decoration:none}
.brand svg{width:28px;height:28px;flex:none}
.brand b{font:700 var(--g-text-lg)/1 var(--g-font-display);letter-spacing:.02em}
.brand span{font:600 var(--g-text-xs)/1 var(--g-font-body);letter-spacing:var(--g-tracking-caps);text-transform:uppercase;color:var(--g-ink-dim);border:1px solid var(--g-line);border-radius:var(--g-r-pill);padding:3px 8px}
nav.links{display:flex;gap:var(--g-s5);font-size:var(--g-text-sm);color:var(--g-ink-dim)}
nav.links a{text-decoration:none}
nav.links a:hover{color:var(--g-ink)}
@media (max-width:560px){nav.links{display:none}}
.hero{position:relative;overflow:hidden;padding:var(--g-s8) 0 var(--g-s7);border-bottom:1px solid var(--g-line)}
.hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--g-line) 1px,transparent 1px),linear-gradient(90deg,var(--g-line) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:linear-gradient(90deg,transparent 45%,#000 100%);mask-image:linear-gradient(90deg,transparent 45%,#000 100%)}
@media (max-width:720px){.hero::before{display:none}}
.hero .wrap{position:relative}
.hero-card{max-width:760px}
.eyebrow{font:600 var(--g-text-xs)/1 var(--g-font-body);letter-spacing:var(--g-tracking-caps);text-transform:uppercase;color:var(--g-ink-dim);margin:0 0 var(--g-s4)}
h1{font:700 clamp(2rem,6vw,var(--g-text-hero))/var(--g-leading-tight) var(--g-font-display);letter-spacing:-.02em;margin:0 0 var(--g-s4)}
.lede{font-size:var(--g-text-lg);color:var(--g-ink-dim);max-width:62ch;margin:0 0 var(--g-s6)}
.cta-row{display:flex;flex-wrap:wrap;gap:var(--g-s3)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 var(--g-s5);border-radius:var(--g-r-md);font:600 var(--g-text-base)/1 var(--g-font-body);text-decoration:none;transition:background var(--g-dur-fast) var(--g-ease-state),border-color var(--g-dur-fast) var(--g-ease-state)}
.btn-main{background:var(--g-accent);color:var(--g-accent-ink)}
.btn-ghost{border:1px solid var(--g-line);color:var(--g-ink)}
.btn-ghost:hover{border-color:var(--g-ink-faint)}
section.block{padding:var(--g-s8) 0;border-bottom:1px solid var(--g-line)}
h2{font:700 var(--g-text-2xl)/var(--g-leading-tight) var(--g-font-display);letter-spacing:-.01em;margin:0 0 var(--g-s2)}
.sub{color:var(--g-ink-dim);margin:0 0 var(--g-s6);max-width:62ch}
.grid{display:grid;gap:var(--g-s5)}
@media (min-width:860px){.grid{grid-template-columns:1fr 1fr}}
.card{background:var(--g-surface);border:1px solid var(--g-line);border-radius:var(--g-r-lg);padding:var(--g-s6) var(--g-s5);display:flex;flex-direction:column;box-shadow:var(--g-elev-1)}
.card-top{display:flex;align-items:center;gap:var(--g-s3);margin-bottom:var(--g-s4)}
.card-top svg{width:40px;height:40px;flex:none}
.tag{font:600 var(--g-text-xs)/1 var(--g-font-body);letter-spacing:var(--g-tracking-caps);text-transform:uppercase;color:var(--g-ink-dim)}
h3{font:700 var(--g-text-xl)/var(--g-leading-tight) var(--g-font-display);margin:0}
.what{font-size:var(--g-text-lg);margin:0 0 var(--g-s4)}
ul.facts{list-style:none;padding:0;margin:0 0 var(--g-s5);display:grid;gap:var(--g-s3)}
ul.facts li{display:grid;grid-template-columns:18px 1fr;gap:var(--g-s3);color:var(--g-ink-dim)}
ul.facts li::before{content:"";width:8px;height:8px;margin-top:9px;border-radius:2px;background:var(--g-ink-faint)}
.price{border-top:1px solid var(--g-line);padding-top:var(--g-s4);margin-top:auto}
.price-row{display:flex;justify-content:space-between;align-items:baseline;gap:var(--g-s4);padding:var(--g-s1) 0}
.price-row span{color:var(--g-ink-dim)}
.price-row b{font:600 var(--g-text-lg)/1.3 var(--g-font-display);text-align:right}
.fine{font-size:var(--g-text-sm);color:var(--g-ink-dim);margin:var(--g-s3) 0 var(--g-s5)}
.card .btn{align-self:flex-start}
.steps{display:grid;gap:var(--g-s4)}
@media (min-width:720px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1000px){.steps{grid-template-columns:repeat(4,1fr)}}
.step{border:1px solid var(--g-line);border-radius:var(--g-r-md);padding:var(--g-s5)}
.step b{display:block;font:600 var(--g-text-base)/1.3 var(--g-font-display);margin-bottom:var(--g-s2)}
.step p{margin:0;color:var(--g-ink-dim);font-size:var(--g-text-sm)}
.contact{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--g-s5);background:var(--g-surface);border:1px solid var(--g-line);border-radius:var(--g-r-lg);padding:var(--g-s6) var(--g-s5)}
.contact p{margin:0;color:var(--g-ink-dim)}
.contact a.mail{font:600 var(--g-text-lg)/1.3 var(--g-font-display);color:var(--g-ink);word-break:break-all}
footer.bottom{padding:var(--g-s6) 0 var(--g-s7);color:var(--g-ink-dim);font-size:var(--g-text-sm)}
footer.bottom .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--g-s4)}
footer.bottom nav{display:flex;flex-wrap:wrap;gap:var(--g-s4)}
.prose{max-width:70ch;padding:var(--g-s7) 0 var(--g-s8)}
.prose h1{font-size:var(--g-text-3xl)}
.prose h2{font-size:var(--g-text-xl);margin-top:var(--g-s7)}
.prose p,.prose li{color:var(--g-ink-dim)}
.prose li{margin:var(--g-s2) 0}
.prose strong{color:var(--g-ink)}
a:focus-visible,.btn:focus-visible{outline:2px solid var(--g-info);outline-offset:3px}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
