/* ===========================================================
   Multiplied Media — design system (v2)
   Neutral charcoal / muted olive-khaki / cool off-white.
   Archivo for display type, Inter for body. Sans-serif led —
   no decorative secondary typeface.
=========================================================== */

:root{
  --ink:#16180f;
  --ink-2:#1c1e14;
  --ink-3:#1f2216;
  --khaki:#f3f5df; /* exact colour sampled from the official logo mark */
  --khaki-hover:#e7e9cf;
  --khaki-ink:#6f7159; /* derived deep olive shade, for the khaki accent on light/cream backgrounds */
  --stone:#c9c6ba;
  --cream:#f0efe9;
  --white:#ffffff;
  --line: rgba(201,198,186,.14);
  --line-strong: rgba(201,198,186,.26);
  --muted: rgba(201,198,186,.58);
  --muted-on-cream: rgba(20,20,19,.60);
  --container: 1320px;
  --gutter: 48px;
}
@media(max-width:900px){ :root{ --gutter:24px; } }

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--ink);
  color:var(--stone);
  font-family:'Inter',ui-sans-serif,-apple-system,BlinkMacSystemFont,Helvetica,Arial,sans-serif;
  line-height:1.6;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none;}
img,video{max-width:100%;display:block;}
ul{list-style:none;}
button{font-family:inherit;}

.wrap{max-width:var(--container);margin:0 auto;padding:0 var(--gutter);}
.display{font-family:'Archivo',ui-sans-serif,sans-serif;font-weight:600;letter-spacing:-.015em;line-height:1.08;}
.eyebrow{
  display:inline-flex;align-items:center;gap:12px;
  font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--khaki);
}
.eyebrow::before{content:'';width:24px;height:1px;background:currentColor;opacity:.7;}
.on-cream .eyebrow{color:var(--khaki-ink);}

.section-label{max-width:640px;margin-bottom:56px;}
.section-label h2{font-size:clamp(1.8rem,3.4vw,2.6rem);margin-top:18px;}
.section-label p{color:var(--muted);margin-top:18px;font-size:1.02rem;max-width:520px;}
.on-cream .section-label p{color:var(--muted-on-cream);}

section{padding:130px 0;}
@media(max-width:700px){section{padding:80px 0;}}
.on-cream{background:var(--cream);color:var(--ink);}
.on-ink-2{background:var(--ink-2);}

/* reveal on scroll */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .8s ease, transform .8s ease;}
.reveal.in{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:16px 30px;font-size:.86rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  border-radius:2px;border:1px solid transparent;cursor:pointer;
  transition:all .25s ease;white-space:nowrap;
}
.btn-khaki{background:var(--khaki);color:var(--ink);}
.btn-khaki:hover{background:var(--khaki-hover);color:var(--ink);}
.btn-line{border-color:var(--line-strong);color:inherit;}
.btn-line:hover{border-color:currentColor;}
.btn-arrow{transition:transform .25s ease;}
.btn:hover .btn-arrow{transform:translateX(4px);}
.btn-sm{padding:12px 20px;font-size:.76rem;}

/* Navigation */
header{position:fixed;top:0;left:0;right:0;z-index:100;transition:background .35s ease, border-color .35s ease, backdrop-filter .35s ease;}
header.scrolled{background:rgba(22,24,15,.88);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);}
nav.wrap{display:flex;align-items:center;justify-content:space-between;height:92px;}

/* Logo lockup — official mark + wordmark. Header always sits on a dark
   ground (transparent-over-hero, then solid ink on scroll), so the pale
   mark and light wordmark colour both stay correct throughout. */
.logo-slot{display:flex;align-items:center;gap:11px;}
.logo-img{height:24px;width:auto;display:block;flex-shrink:0;}
.logo-word{
  font-family:'Archivo',sans-serif;font-weight:600;font-size:.88rem;
  letter-spacing:.05em;color:var(--khaki);white-space:nowrap;line-height:1;
}
@media(max-width:420px){.logo-word{font-size:.72rem;letter-spacing:.03em;}}

.navlinks{display:none;gap:40px;align-items:center;}
.navlinks a{font-size:.82rem;font-weight:500;letter-spacing:.02em;color:var(--stone);position:relative;padding-bottom:3px;}
.navlinks a::after{content:'';position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--khaki);transition:width .25s ease;}
.navlinks a:hover::after{width:100%;}
.navlinks a.current::after{width:100%;background:var(--khaki);}
@media(min-width:960px){.navlinks{display:flex;}}
.nav-cta{display:none;}
@media(min-width:960px){.nav-cta{display:inline-flex;}}

.nav-toggle{display:flex;flex-direction:column;gap:5px;width:26px;background:none;border:none;cursor:pointer;padding:8px;}
@media(min-width:960px){.nav-toggle{display:none;}}
.nav-toggle span{display:block;height:1px;background:var(--stone);width:100%;transition:transform .3s ease, opacity .3s ease;}

.mobile-menu{
  position:fixed;inset:0;background:var(--ink);z-index:99;
  display:flex;flex-direction:column;justify-content:center;padding:0 32px;
  transform:translateY(-100%);transition:transform .45s cubic-bezier(.65,0,.35,1);
}
.mobile-menu.open{transform:translateY(0);}
.mobile-menu a{
  font-family:'Archivo',sans-serif;font-size:1.9rem;font-weight:600;
  padding:14px 0;border-bottom:1px solid var(--line);color:var(--stone);
}
.mobile-menu .btn{margin-top:32px;align-self:flex-start;border-bottom:none;padding:16px 30px;font-size:.86rem;font-family:inherit;}
.mobile-menu .btn-khaki{color:var(--ink);}

/* Footer */
footer{background:var(--ink);border-top:1px solid var(--line);padding:72px 0 0;}
.foot-top{display:grid;grid-template-columns:1fr;gap:44px;padding-bottom:52px;}
@media(min-width:800px){.foot-top{grid-template-columns:1.4fr .8fr .8fr;}}
.foot-brand{font-family:'Archivo',sans-serif;font-size:1.05rem;font-weight:600;letter-spacing:.02em;margin-bottom:16px;color:var(--stone);text-transform:uppercase;}
.foot-tag{color:var(--muted);max-width:300px;font-size:.92rem;margin-bottom:22px;}
.foot-socials{display:flex;gap:14px;}
.foot-socials a{width:36px;height:36px;border-radius:50%;border:1px solid var(--line-strong);display:flex;align-items:center;justify-content:center;transition:border-color .2s ease;}
.foot-socials a:hover{border-color:var(--khaki);}
.foot-col h4{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-bottom:20px;font-weight:600;}
.foot-col a{display:block;font-size:.92rem;margin-bottom:13px;color:var(--stone);}
.foot-col a:hover{color:var(--khaki);}
.foot-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;padding:24px 0;border-top:1px solid var(--line);color:var(--muted);font-size:.76rem;}
.foot-bottom a{color:var(--muted);}
.foot-bottom a:hover{color:var(--stone);}

/* Page hero (interior pages) */
.page-hero{padding:190px 0 80px;border-bottom:1px solid var(--line);}
.page-hero .eyebrow{margin-bottom:20px;}
.page-hero h1{font-size:clamp(2.3rem,5vw,3.6rem);max-width:800px;}
.page-hero p{color:var(--muted);max-width:560px;margin-top:22px;font-size:1.04rem;}