/* Graphics & Graphite — house-brand site. Implements the brand identity handoff exactly:
   Archivo display and interface/body, Space Mono labels; Signal Red / Paper White /
   Graphite Black as the three surfaces, Royal Blue and Leaf Gold as accents only; square
   corners everywhere but product-icon squircles; no shadows, ever - depth comes from 1px
   black rules and flat colour. This is a deliberate, fixed identity (not a light/dark toggle
   - the brand doc itself uses black as a compositional section colour, not a "dark mode"). */

:root{
  --gg-red:#C8102E; --gg-red-hover:#A60D26; --gg-red-active:#8C0B20;
  --gg-paper:#FBFAF8; --gg-white:#FFFFFF;
  --gg-ink:#121214; --gg-ink-2:#3A3A3E; --gg-ink-3:#6B6B70;
  --gg-blue:#1B3FA0; --gg-gold:#D4AF37;
  --gg-paper-2:#B6B6BC; --gg-rule:#D9D7D2;

  --font-display:"Archivo","Helvetica Neue",Arial,sans-serif;
  --font-sans:"Archivo","Helvetica Neue",Arial,sans-serif;
  --font-mono:"Space Mono",ui-monospace,"SF Mono",Menlo,monospace;
  color-scheme: light;
}

*,*::before,*::after{box-sizing:border-box; min-width:0;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0; background:var(--gg-paper); color:var(--gg-ink);
  font-family:var(--font-sans); font-size:16px; line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img,svg{max-width:100%; display:block;}
a{color:var(--gg-red); text-decoration:none;}
a:hover{color:var(--gg-blue);}
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
  outline:2px solid var(--gg-blue); outline-offset:2px;
}
::selection{background:var(--gg-red); color:var(--gg-paper);}

.measure{max-width:46ch;}
.measure-wide{max-width:70ch;}

h1,h2,h3{font-family:var(--font-display); margin:0; text-wrap:balance;}
h1{font-weight:900; letter-spacing:-0.02em; line-height:0.94;}
h2{font-weight:700; letter-spacing:-0.01em; line-height:1.1; font-size:34px;}
h3{font-weight:700; line-height:1.25; font-size:22px;}
p{margin:0;}

.amp{font-style:italic; font-weight:400; color:var(--gg-red);}
.amp--paper{color:var(--gg-paper);}
.amp--gold{color:var(--gg-gold);}

.eyebrow{
  font-family:var(--font-mono); font-size:11px; letter-spacing:.15em; text-transform:uppercase;
  color:var(--gg-red); font-weight:400;
}
.eyebrow--on-dark{color:var(--gg-gold);}

.container{max-width:1160px; margin:0 auto; padding:0 clamp(20px,5vw,72px);}
.rule{border:none; border-top:1px solid var(--gg-ink); margin:0;}
.rule--paper{border-top-color:var(--gg-rule);}

section.band{padding:clamp(44px,7vw,96px) 0;}
section.band--hero{padding-top:clamp(48px,9vw,120px);}

/* Header / nav */
.site-header{border-bottom:1px solid var(--gg-ink); background:var(--gg-paper); position:sticky; top:0; z-index:30;}
.site-header .container{display:flex; align-items:center; justify-content:space-between; height:72px;}
.brand-lockup{display:flex; align-items:center; gap:12px;}
.brand-lockup img{height:26px; width:auto;}
.brand-lockup span{font-family:var(--font-display); font-weight:700; font-size:19px; color:var(--gg-ink);}
nav.primary-nav{display:flex; align-items:center; gap:32px;}
nav.primary-nav a:not(.btn){
  font-family:var(--font-sans); font-weight:500; font-size:15px; color:var(--gg-ink);
  padding-bottom:4px; border-bottom:2px solid transparent;
}
nav.primary-nav a:not(.btn):hover{color:var(--gg-red); border-bottom-color:var(--gg-red);}

/* Buttons - square corners, 1px borders, flat fills, no shadows */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--font-sans); font-weight:600; font-size:15px;
  padding:0 22px; height:48px; min-height:44px; border-radius:0; border:1.5px solid transparent;
  cursor:pointer; white-space:nowrap;
}
.btn--primary{background:var(--gg-red); color:var(--gg-paper);}
.btn--primary:hover{background:var(--gg-red-hover); color:var(--gg-paper);}
.btn--primary:active{background:var(--gg-red-active);}
.btn--secondary{background:transparent; color:var(--gg-ink); border-color:var(--gg-ink);}
.btn--secondary:hover{background:var(--gg-ink); color:var(--gg-paper);}
.btn--on-dark{background:var(--gg-paper); color:var(--gg-ink);}
.btn--on-dark:hover{background:var(--gg-white); color:var(--gg-ink);}
.btn--sm{height:40px; padding:0 16px; font-size:13.5px;}

.text-link{
  font-weight:600; color:var(--gg-red); border-bottom:1px solid var(--gg-red); padding-bottom:1px;
}
.text-link:hover{color:var(--gg-blue); border-bottom-color:var(--gg-blue);}

/* Hero */
.hero-grid{display:grid; grid-template-columns:1.3fr 1fr; gap:48px; align-items:end;}
.hero-tags{display:flex; gap:10px; margin-top:28px; flex-wrap:wrap;}
.tag{
  font-family:var(--font-mono); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase;
  border:1px solid var(--gg-ink); padding:6px 12px;
}
.tag--fill{background:var(--gg-red); border-color:var(--gg-red); color:var(--gg-paper);}
.hero-lede{font-size:clamp(16px,1.6vw,20px); line-height:1.5; color:var(--gg-ink-2); margin-top:24px;}
.hero-actions{display:flex; gap:14px; margin-top:36px; flex-wrap:wrap;}

/* Featured product block */
.product-feature{
  border:1px solid var(--gg-ink); display:grid; grid-template-columns:1fr 1.1fr;
}
.product-feature__text{padding:clamp(28px,4vw,48px); display:flex; flex-direction:column; gap:18px;}
.product-feature__shot{
  border-left:1px solid var(--gg-ink); background:var(--gg-ink); padding:clamp(20px,3vw,32px);
  display:flex; align-items:center;
}
.product-feature__shot img{border:1px solid var(--gg-rule);}
.product-icon{
  width:56px; height:56px; border-radius:22%; background:var(--gg-red); color:var(--gg-paper);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:900; font-size:26px; flex-shrink:0;
}
.product-feature__meta{display:flex; align-items:center; gap:12px;}
.status-pill{
  font-family:var(--font-mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase;
  border:1px solid var(--gg-ink); padding:3px 9px;
}
.product-feature__desc{color:var(--gg-ink-2); font-size:16px; line-height:1.6;}
.product-feature__footer{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  border-top:1px solid var(--gg-rule); padding-top:18px; margin-top:auto;
}
.product-feature__footer .domain{font-family:var(--font-mono); font-size:11px; letter-spacing:.1em; color:var(--gg-ink-3); text-transform:uppercase;}
.product-feature__logo{height:22px; width:auto;}

/* Studio / about */
.studio-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(260px,1fr)); gap:24px; margin-top:40px;}
.studio-card{border:1px solid var(--gg-rule); padding:28px;}
.studio-card .eyebrow{display:block; margin-bottom:10px;}
.studio-card p{color:var(--gg-ink-2); font-size:15px; line-height:1.6; margin-top:10px;}

/* Endorsement band */
.endorsement{background:var(--gg-red); color:var(--gg-paper); padding:clamp(44px,7vw,96px) 0;}
.endorsement .container{display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap;}
.endorsement h2{font-style:italic; font-weight:400; font-size:clamp(30px,5vw,64px); line-height:1.05; color:var(--gg-paper);}
.endorsement-mark{display:flex; align-items:center; gap:12px;}
.endorsement-mark img{height:28px; width:auto;}
.endorsement-mark span{font-family:var(--font-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase;}

/* Footer */
footer.site-footer{background:var(--gg-ink); color:var(--gg-paper-2); padding:40px 0;}
footer.site-footer .container{display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap;}
footer.site-footer a{color:var(--gg-paper-2); border-bottom:1px solid transparent;}
footer.site-footer a:hover{color:var(--gg-paper);}
.legal-text{font-family:var(--font-mono); font-size:11px; letter-spacing:.04em; line-height:1.9; max-width:60ch;}
.footer-links{display:flex; gap:24px; font-size:13.5px;}

/* Policy page */
.policy{max-width:70ch; margin:0 auto; padding:clamp(48px,7vw,80px) clamp(20px,5vw,72px) 96px;}
.policy .eyebrow{display:block; margin-bottom:10px;}
.policy h1{font-size:clamp(34px,5vw,52px); margin-bottom:8px;}
.policy .updated{font-family:var(--font-mono); font-size:11.5px; color:var(--gg-ink-3); letter-spacing:.06em; margin-bottom:40px; display:block;}
.policy h2{font-size:22px; margin-top:40px; margin-bottom:14px;}
.policy p, .policy li{color:var(--gg-ink-2); font-size:16px; line-height:1.65;}
.policy p + p, .policy ul{margin-top:14px;}
.policy ul{padding-left:22px;}
.policy li{margin-bottom:6px;}
.policy a{font-weight:600;}

@media (max-width:820px){
  .hero-grid{grid-template-columns:1fr;}
  .product-feature{grid-template-columns:1fr;}
  .product-feature__shot{border-left:none; border-top:1px solid var(--gg-ink);}
  nav.primary-nav{gap:18px;}
}
@media (max-width:640px){
  nav.primary-nav a:not(.btn){display:none;}
  .site-header .container{height:64px;}
}