/* ============================================================
   SPLITLEY PRESS — print & letterpress inspired
   Class convention: semantic kebab-case + BEM-ish modifiers
   Type: Fraunces (display) + Manrope (body) + Space Mono (meta)
   Palette: ivory / midnight / brass / terracotta
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300..900;1,9..144,400..700&family=Manrope:wght@400;500;600;700;800&family=Space+Mono:wght@400;700&display=swap');

/* ---------- tokens ---------- */
:root{
  --ink:#141b3f;
  --ink-2:#1f2a5c;
  --ink-soft:#4a5488;
  --ivory:#f7f0e1;
  --ivory-2:#efe4cf;
  --paper:#fffdf6;
  --brass:#a8812f;
  --brass-soft:#c9a24d;
  --terra:#b5532f;
  --terra-deep:#8f3d24;
  --line:rgba(20,27,63,.14);
  --line-strong:rgba(20,27,63,.30);
  --font-display:'Fraunces',Georgia,'Times New Roman',serif;
  --font-body:'Manrope',system-ui,-apple-system,sans-serif;
  --font-mono:'Space Mono','Courier New',monospace;
  --radius:8px;
  --radius-sm:4px;
  --shadow-card:0 1px 2px rgba(20,27,63,.04),0 14px 30px -18px rgba(20,27,63,.30);
  --shadow-lift:0 2px 4px rgba(20,27,63,.06),0 30px 50px -22px rgba(20,27,63,.45);
  --wrap:1160px;
  --space:clamp(1.1rem,4vw,2.1rem);
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0}
img,svg,video{display:block;max-width:100%}
img{height:auto}
button,input,select,textarea{font:inherit;color:inherit}
a{color:inherit;text-decoration:none}
ol,ul{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,p{margin:0}
fieldset{margin:0;padding:0;border:0}

/* ---------- base ---------- */
body{
  background:var(--ivory);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:clamp(1rem,.95rem + .2vw,1.125rem);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.container{
  width:100%;
  max-width:var(--wrap);
  margin-inline:auto;
  padding-inline:clamp(1.25rem,4vw,2.75rem);
}
.container-wide{max-width:1360px}
section{scroll-margin-top:96px}
::selection{background:var(--brass);color:var(--paper)}

/* ---------- type ---------- */
h1,h2,h3,h4{font-family:var(--font-display);font-weight:560;line-height:1.04;letter-spacing:-.015em;color:var(--ink);text-wrap:balance}
h1{font-size:clamp(2.6rem,1.3rem + 4.6vw,4.9rem)}
h2{font-size:clamp(2rem,1.3rem + 2.6vw,3.1rem)}
h3{font-size:clamp(1.35rem,1.1rem + 1vw,1.9rem);font-weight:520}
p{max-width:62ch}
.lead{font-size:clamp(1.15rem,1rem + .7vw,1.45rem);line-height:1.5;font-weight:450;color:var(--ink-2)}
.eyebrow{
  font-family:var(--font-mono);font-size:.78rem;font-weight:700;
  letter-spacing:.24em;text-transform:uppercase;color:var(--terra);
  display:inline-flex;align-items:center;gap:.6rem;
}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--terra);display:inline-block}

/* ---------- links & buttons ---------- */
a{transition:color .2s ease}
.link{position:relative;color:var(--ink-soft)}
.link::after{content:"";position:absolute;left:0;bottom:-2px;width:100%;height:1px;background:var(--brass);transform:scaleX(0);transform-origin:left;transition:transform .28s ease}
.link:hover{color:var(--ink)}
.link:hover::after{transform:scaleX(1)}

.btn{
  display:inline-flex;align-items:center;gap:.55rem;
  font-family:var(--font-mono);font-size:.82rem;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;
  padding:.95em 1.5em;border:1px solid transparent;border-radius:var(--radius-sm);
  cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease,color .2s ease,border-color .2s ease;
}
.btn--primary{background:var(--ink);color:var(--ivory);border-color:var(--ink)}
.btn--primary:hover{background:var(--ink-2);transform:translateY(-2px);box-shadow:var(--shadow-lift)}
.btn--primary .arrow{transition:transform .25s ease}
.btn--primary:hover .arrow{transform:translate(4px,-4px)}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line-strong)}
.btn--ghost:hover{border-color:var(--ink);transform:translateY(-2px)}
.btn--light{background:var(--ivory);color:var(--ink);border-color:var(--ivory)}
.btn--light:hover{background:var(--paper);transform:translateY(-2px);box-shadow:var(--shadow-lift)}

/* ---------- masthead / header ---------- */
.masthead{position:sticky;top:0;z-index:50;background:var(--ivory);border-bottom:1px solid var(--line)}
.masthead__strip{background:var(--ink);color:var(--ivory);font-family:var(--font-mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase}
.masthead__strip .container{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding-block:.55rem}
.masthead__strip a{color:var(--brass-soft);border-bottom:1px solid transparent}
.masthead__strip a:hover{color:var(--ivory);border-color:var(--ivory)}
.masthead__strip__note{opacity:.7}
.masthead__bar{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding-block:1rem}
.brand{display:flex;align-items:center;gap:.7rem}
.brand__mark{flex:none;width:42px;height:42px}
.brand__word{font-family:var(--font-display);font-weight:600;font-size:1.35rem;letter-spacing:-.02em;line-height:1}
.brand__sub{font-family:var(--font-mono);font-size:.6rem;letter-spacing:.28em;text-transform:uppercase;color:var(--terra);margin-top:.25rem}
.masthead__cta{display:flex;align-items:center;gap:.9rem}
.masthead__cta .btn{padding:.7em 1.15em}
.masthead__toggle{display:none;width:44px;height:44px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:transparent;cursor:pointer;align-items:center;justify-content:center}
.masthead__toggle span,.masthead__toggle span::before,.masthead__toggle span::after{content:"";display:block;width:20px;height:2px;background:var(--ink);transition:transform .25s ease,opacity .25s ease}
.masthead__toggle span::before{transform:translateY(-6px)}
.masthead__toggle span::after{transform:translateY(4px)}

.masthead__nav{display:flex;flex-direction:column;gap:.4rem;padding-block:1.2rem}
.masthead__nav.is-open{display:flex}
.masthead__nav a{font-family:var(--font-mono);font-size:.9rem;letter-spacing:.04em;padding:.55rem 0;border-bottom:1px solid var(--line)}
.masthead__nav a.is-active{color:var(--terra)}
.masthead__nav a:hover{color:var(--ink)}

/* ---------- footer ---------- */
.footer{background:var(--ink);color:var(--ivory);margin-top:clamp(4rem,8vw,7rem)}
.footer__colophon{border-bottom:1px solid rgba(255,255,255,.14);padding-block:clamp(2.5rem,6vw,4rem)}
.footer__grid{display:grid;gap:2.5rem;grid-template-columns:1.4fr 1fr 1fr 1fr}
.footer__brand .brand__word{color:var(--ivory)}
.footer__tag{font-family:var(--font-display);font-style:italic;font-weight:450;font-size:1.15rem;color:var(--brass-soft);margin-top:1rem;max-width:30ch;line-height:1.4}
.footer__head{font-family:var(--font-mono);font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--brass-soft);margin-bottom:1.1rem}
.footer__list li{margin-bottom:.7rem}
.footer__list a{color:rgba(247,240,225,.82);font-size:.95rem}
.footer__list a:hover{color:var(--ivory)}
.footer__bottom{padding-block:1.5rem;display:flex;flex-wrap:wrap;gap:.8rem 2rem;justify-content:space-between;align-items:center;font-family:var(--font-mono);font-size:.74rem;letter-spacing:.05em;color:rgba(247,240,225,.6)}
.footer__bottom a:hover{color:var(--ivory)}

/* ---------- hero ---------- */
.hero{position:relative;padding-block:clamp(3.5rem,8vw,6rem);overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 85% 0%,rgba(168,129,47,.12),transparent 55%);pointer-events:none}
.hero__grid{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2.5rem,5vw,4.5rem);align-items:center}
.hero__title{margin:1.4rem 0 1.2rem}
.hero__title em{font-style:italic;color:var(--terra);font-weight:480}
.hero__sub{font-size:clamp(1.08rem,1rem + .5vw,1.3rem);color:var(--ink-2);max-width:44ch;margin-bottom:2rem}
.hero__actions{display:flex;flex-wrap:wrap;gap:.9rem;margin-bottom:2.2rem}
.hero__meta{display:flex;flex-wrap:wrap;gap:1.4rem 2rem;font-family:var(--font-mono);font-size:.76rem;letter-spacing:.05em;color:var(--ink-soft);border-top:1px solid var(--line);padding-top:1.3rem}
.hero__meta span{display:inline-flex;align-items:center;gap:.5rem}
.hero__meta span::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--brass)}

/* ---------- print sheet / image frame ---------- */
.hero__art{position:relative}
.hero__art--wide{max-width:620px;margin-top:2.5rem}
.hero__art--wide img{border-radius:var(--radius)}
.sheet{position:relative;background:var(--paper);border:1px solid var(--line-strong);border-radius:var(--radius);box-shadow:var(--shadow-lift);padding:1.1rem}
.sheet::before{content:"";position:absolute;inset:.55rem;border:1px solid var(--line);border-radius:4px;pointer-events:none}
.sheet__img{position:relative;border-radius:var(--radius-sm);overflow:hidden;aspect-ratio:4/5}
.sheet__img img{width:100%;height:100%;object-fit:cover;animation:kenburns 22s ease-in-out infinite alternate}
.sheet__caption{display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.06em;color:var(--ink-soft);padding:.7rem .2rem .1rem}
.stamp{position:absolute;right:-14px;top:26px;width:92px;height:92px;border-radius:50%;border:2px solid var(--terra);color:var(--terra);display:grid;place-items:center;transform:rotate(-12deg);background:rgba(247,240,225,.75);backdrop-filter:blur(1px)}
.stamp__in{width:78px;height:78px;border:1px solid var(--terra);border-radius:50%;display:grid;place-items:center;font-family:var(--font-mono);font-size:.5rem;letter-spacing:.14em;text-align:center;line-height:1.5;text-transform:uppercase}

/* ---------- generic section ---------- */
.section{padding-block:clamp(4rem,9vw,7.5rem)}
.section--ivory{background:var(--ivory)}
.section--paper{background:var(--paper);border-block:1px solid var(--line)}
.section--ink{background:var(--ink);color:var(--ivory)}
.section__head{max-width:44ch;margin-bottom:clamp(2.2rem,5vw,3.2rem)}
.section__head h2{margin-top:1rem}
.section__head .lead{margin-top:1.1rem}

/* ---------- feature grid / cards ---------- */
.grid{display:grid;gap:clamp(1.4rem,3vw,2rem)}
.grid--3{grid-template-columns:repeat(3,1fr)}
.grid--2{grid-template-columns:repeat(2,1fr)}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:clamp(1.6rem,3vw,2.2rem);box-shadow:var(--shadow-card);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lift);border-color:var(--line-strong)}
.card__no{font-family:var(--font-mono);font-size:.8rem;letter-spacing:.1em;color:var(--brass);display:block;margin-bottom:1.1rem}
.card__title{margin-bottom:.7rem}
.card__text{color:var(--ink-soft);font-size:1rem}
.section--ink .card{background:var(--ink-2);border-color:rgba(255,255,255,.14);box-shadow:none}
.section--ink .card__text{color:rgba(247,240,225,.78)}
.section--ink .card__title{color:var(--ivory)}

/* ---------- stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.stat{border-left:2px solid var(--brass);padding-left:1.2rem}
.stat__num{font-family:var(--font-display);font-weight:600;font-size:clamp(2.4rem,1.4rem + 3vw,3.6rem);line-height:1;color:var(--ink);letter-spacing:-.03em}
.stat__label{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);margin-top:.6rem}
.section--ink .stat{border-color:var(--brass-soft)}
.section--ink .stat__num{color:var(--brass-soft)}
.section--ink .stat__label{color:rgba(247,240,225,.7)}

/* ---------- CTA band ---------- */
.cta{background:var(--ink);color:var(--ivory);border-radius:var(--radius);padding:clamp(2.5rem,6vw,4rem);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:2rem;position:relative;overflow:hidden}
.cta::before{content:"";position:absolute;inset:0;background:radial-gradient(90% 130% at 90% 120%,rgba(181,83,47,.35),transparent 60%);pointer-events:none}
.cta h2{color:var(--ivory);position:relative}
.cta p{color:rgba(247,240,225,.82);margin-top:.8rem;position:relative}
.cta__actions{display:flex;flex-wrap:wrap;gap:.9rem;position:relative}

/* ---------- FAQ ---------- */
.faq{max-width:760px}
.faq__item{border-bottom:1px solid var(--line)}
.faq__item:first-child{border-top:1px solid var(--line)}
.faq__q{width:100%;background:transparent;border:0;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;padding:1.35rem .2rem;text-align:left;font-family:var(--font-display);font-weight:500;font-size:clamp(1.1rem,1rem + .4vw,1.35rem);color:var(--ink)}
.faq__q:hover{color:var(--terra)}
.faq__icon{flex:none;width:26px;height:26px;border:1px solid var(--line-strong);border-radius:50%;display:grid;place-items:center;font-family:var(--font-mono);font-size:1rem;color:var(--terra);transition:transform .3s ease,background .3s ease}
.faq__item.is-open .faq__icon{transform:rotate(45deg);background:var(--terra);color:var(--ivory);border-color:var(--terra)}
.faq__a{max-height:0;overflow:hidden;transition:max-height .35s ease}
.faq__a p{padding:0 .2rem 1.4rem;color:var(--ink-soft)}

/* ---------- reveal animations ---------- */
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.js .reveal.is-in{opacity:1;transform:none}
.js .reveal-d1{transition-delay:.08s}
.js .reveal-d2{transition-delay:.16s}
.js .reveal-d3{transition-delay:.24s}
.js .reveal-d4{transition-delay:.32s}
@keyframes kenburns{from{transform:scale(1.06) translate(1%,1%)}to{transform:scale(1.18) translate(-2%,-2%)}}

/* ---------- responsive ---------- */
@media (max-width:1040px){
  .masthead__bar{flex-wrap:wrap}
  .masthead__nav{order:3;width:100%}
  .masthead__toggle{display:inline-flex}
  .masthead__cta .btn--ghost{display:none}
}
@media (max-width:900px){
  .hero__grid{grid-template-columns:1fr}
  .hero__art{max-width:520px;margin-inline:auto;width:100%}
  .footer__grid{grid-template-columns:1fr 1fr}
  .grid--3{grid-template-columns:1fr 1fr}
  .stats{grid-template-columns:1fr 1fr;gap:2rem 1.5rem}
}
@media (max-width:560px){
  .footer__grid{grid-template-columns:1fr}
  .grid--3,.grid--2{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr}
  .cta{flex-direction:column;align-items:flex-start}
  .hero__actions{width:100%}
  .hero__actions .btn{flex:1;justify-content:center}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important}
  .js .reveal{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
} html{-webkit-text-size-adjust:100%} img,svg,video{max-width:100%;height:auto} *{box-sizing:border-box} body{margin:0}