
  :root{
    --ink:#1F3044;          /* printed shipping ink */
    --ink-deep:#162333;
    --kraft:#C79A62;        /* corrugate tan */
    --kraft-deep:#7E5A2C;
    --paper:#F6F1E6;        /* uncoated paper */
    --stamp:#B93A26;        /* rubber-stamp red */
    --line:rgba(31,48,68,.28);
    --line-strong:rgba(31,48,68,.55);
    --paper-line:rgba(246,241,230,.25);
    --maxw:1140px;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{
    font-family:'Libre Franklin',system-ui,sans-serif;
    font-size:17px;line-height:1.6;color:var(--ink);
    background:var(--paper);
  }
  ::selection{background:var(--kraft);color:var(--ink-deep)}
  img,svg{display:block;max-width:100%}
  a{color:inherit}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}

  h1,h2,h3,.display{
    font-family:'Big Shoulders Display',sans-serif;
    text-transform:uppercase;line-height:.95;letter-spacing:.01em;
    font-weight:800;
  }
  .mono{font-family:'IBM Plex Mono',monospace;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}

  /* ---------- stamp eyebrow ---------- */
  .stamp{
    display:inline-block;font-family:'IBM Plex Mono',monospace;
    font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
    color:var(--stamp);border:2px solid var(--stamp);border-radius:4px;
    padding:.3em .8em;transform:rotate(-1.5deg);
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='40'%3E%3Crect width='120' height='40' fill='white'/%3E%3Ccircle cx='14' cy='9' r='2.4' fill='black'/%3E%3Ccircle cx='72' cy='31' r='2' fill='black'/%3E%3Ccircle cx='103' cy='7' r='1.7' fill='black'/%3E%3Ccircle cx='44' cy='36' r='1.5' fill='black'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='40'%3E%3Crect width='120' height='40' fill='white'/%3E%3Ccircle cx='14' cy='9' r='2.4' fill='black'/%3E%3Ccircle cx='72' cy='31' r='2' fill='black'/%3E%3Ccircle cx='103' cy='7' r='1.7' fill='black'/%3E%3Ccircle cx='44' cy='36' r='1.5' fill='black'/%3E%3C/svg%3E");
    -webkit-mask-size:120px 40px;mask-size:120px 40px;
  }
  .stamp--paper{color:#DFB57E;border-color:#DFB57E}

  /* ---------- header ---------- */
  header{
    position:sticky;top:0;z-index:50;
    background:var(--paper);border-bottom:2px solid var(--ink);
  }
  .nav{display:flex;align-items:center;gap:32px;height:68px}
  .brand{display:flex;align-items:center;gap:11px;text-decoration:none}
  .brand svg{width:34px;height:34px;flex:none}
  .brand-name{font-family:'Big Shoulders Display',sans-serif;font-weight:800;text-transform:uppercase;font-size:1.35rem;letter-spacing:.03em;line-height:1}
  .brand-name small{display:block;font-family:'IBM Plex Mono',monospace;font-weight:400;font-size:.55rem;letter-spacing:.32em;color:var(--kraft-deep);margin-top:2px}
  .nav-links{display:flex;gap:26px;margin-left:auto}
  .nav-links a{text-decoration:none;font-size:.85rem;font-weight:600;letter-spacing:.02em;padding:4px 0;border-bottom:2px solid transparent}
  .nav-links a:hover{border-bottom-color:var(--kraft)}
  .btn{
    display:inline-block;text-decoration:none;cursor:pointer;
    font-family:'IBM Plex Mono',monospace;font-size:.8rem;font-weight:500;
    letter-spacing:.1em;text-transform:uppercase;
    background:var(--ink);color:var(--paper);border:2px solid var(--ink);
    padding:.85em 1.6em;transition:background .15s,color .15s;
  }
  .btn:hover{background:var(--stamp);border-color:var(--stamp);color:var(--paper)}
  .btn--ghost{background:transparent;color:var(--ink)}
  .btn--ghost:hover{background:var(--ink);color:var(--paper)}
  .btn--paper{background:var(--kraft);border-color:var(--kraft);color:var(--ink-deep)}
  .btn--paper:hover{background:var(--paper);border-color:var(--paper);color:var(--ink-deep)}
  .nav .btn{padding:.6em 1.2em}
  :focus-visible{outline:3px solid var(--stamp);outline-offset:2px}

  /* ---------- hero ---------- */
  .hero{border-bottom:2px solid var(--ink);overflow:hidden}
  .hero .wrap{
    display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
    gap:48px;align-items:center;padding-top:72px;padding-bottom:72px;
  }
  .hero h1{font-size:clamp(3.2rem,7.2vw,5.6rem);margin:20px 0 22px}
  .hero h1 em{font-style:normal;color:var(--stamp)}
  .hero p{max-width:46ch;font-size:1.06rem}
  .hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}
  .hero-note{margin-top:18px;color:var(--kraft-deep)}
  .dieline{position:relative}
  .dieline svg{width:100%;height:auto}

  /* ---------- ticker ---------- */
  .ticker{background:var(--ink);color:var(--paper);border-bottom:2px solid var(--ink);overflow:hidden;padding:10px 0}
  .ticker-track{display:flex;width:max-content;animation:tick 28s linear infinite}
  .ticker span{font-family:'IBM Plex Mono',monospace;font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap;padding:0 .5em}
  .ticker span::after{content:"▸";color:var(--kraft);padding-left:1em}
  @keyframes tick{to{transform:translateX(-50%)}}
  @media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    .ticker-track{animation:none}
    .reveal{opacity:1 !important;transform:none !important;transition:none !important}
  }

  /* ---------- sections ---------- */
  section{padding:88px 0}
  .sec-head{max-width:60ch;margin-bottom:52px}
  .sec-head h2{font-size:clamp(2.2rem,4.5vw,3.4rem);margin:16px 0 14px}
  .sec-head p{font-size:1.02rem}

  /* boxes grid */
  .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:2px solid var(--ink)}
  .cell{padding:30px 28px 34px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);background:#fffdf7}
  .grid .cell:nth-child(3n){border-right:none}
  .grid .cell:nth-child(n+4){border-bottom:none}
  .cell svg{width:58px;height:58px;margin-bottom:18px}
  .cell h3{font-size:1.45rem;font-weight:700;margin-bottom:8px}
  .cell p{font-size:.92rem;margin-bottom:14px}
  .cell .mono{color:var(--kraft-deep)}

  /* why — navy */
  .navy{background:var(--ink);color:var(--paper);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
  .navy .sec-head h2{color:var(--paper)}
  .why-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:var(--paper-line);border:1px solid var(--paper-line)}
  .why{background:var(--ink);padding:30px 30px 34px}
  .why h3{font-size:1.4rem;font-weight:700;color:#DFB57E;margin-bottom:10px}
  .why p{font-size:.95rem;color:var(--paper)}

  /* box files */
  .files{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
  .file{border:2px solid var(--ink);background:#fffdf7;padding:26px 26px 30px;position:relative}
  .file::before{
    content:attr(data-tab);position:absolute;top:-14px;left:18px;
    font-family:'IBM Plex Mono',monospace;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;
    background:var(--kraft);color:var(--ink-deep);padding:3px 10px;border:2px solid var(--ink);
  }
  .file h3{font-size:1.35rem;font-weight:700;margin:8px 0 10px}
  .file p{font-size:.93rem}
  .file p + p{margin-top:10px}

  /* how it works */
  .road{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
  .stage{border-top:4px solid var(--ink);padding-top:18px}
  .stage .mono{color:var(--stamp)}
  .stage h3{font-size:1.5rem;font-weight:700;margin:8px 0 8px}
  .stage p{font-size:.94rem}

  /* form */
  .quote{background:var(--kraft);border-top:2px solid var(--ink)}
  .quote .wrap{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
  .quote h2{font-size:clamp(2.4rem,4.5vw,3.6rem);color:var(--ink-deep);margin:16px 0 14px}
  .quote .lead{color:var(--ink-deep);max-width:42ch}
  .quote .lead + .lead{margin-top:12px}
  .stamp--onkraft{color:var(--ink-deep);border-color:var(--ink-deep)}
  form{background:var(--paper);border:2px solid var(--ink);padding:34px 32px 38px}
  .field{margin-bottom:20px}
  label{display:block;font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:7px;color:var(--ink)}
  input,select,textarea{
    width:100%;font-family:'Libre Franklin',sans-serif;font-size:.98rem;color:var(--ink);
    background:#fffdf7;border:2px solid var(--line-strong);padding:.7em .8em;border-radius:0;
  }
  input:focus,select:focus,textarea:focus{outline:none;border-color:var(--stamp)}
  textarea{resize:vertical;min-height:96px}
  .form-foot{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:6px}
  .form-foot .mono{color:var(--kraft-deep);text-transform:none;letter-spacing:.03em}
  .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

  /* footer */
  footer{background:var(--ink-deep);color:var(--paper);padding:56px 0 40px;border-top:2px solid var(--ink)}
  .foot{display:flex;gap:40px;align-items:flex-start;flex-wrap:wrap}
  .foot .brand-name{color:var(--paper)}
  .foot .brand-name small{color:var(--kraft)}
  .foot-links{margin-left:auto;display:flex;gap:28px}
  .foot-links a{font-size:.85rem;text-decoration:none;opacity:1}
  .foot-links a:hover{text-decoration:underline;color:#DFB57E}
  .foot-base{margin-top:36px;padding-top:18px;border-top:1px solid var(--paper-line);display:flex;gap:16px;flex-wrap:wrap;justify-content:space-between}
  .foot-base .mono{opacity:.9;text-transform:none;letter-spacing:.04em}

  /* reveal */
  .reveal{opacity:0;transform:translateY(14px);transition:opacity .5s ease,transform .5s ease}
  .reveal.in{opacity:1;transform:none}

  /* ---------- responsive ---------- */
  @media (max-width:920px){
    .hero .wrap{grid-template-columns:1fr;gap:40px;padding-top:56px;padding-bottom:56px}
    .grid{grid-template-columns:1fr 1fr}
    .grid .cell{border-right:2px solid var(--ink);border-bottom:2px solid var(--ink)}
    .grid .cell:nth-child(2n){border-right:none}
    .grid .cell:nth-child(n+5){border-bottom:none}
    .files,.road{grid-template-columns:1fr}
    .files{gap:34px}
    .quote .wrap{grid-template-columns:1fr;gap:40px}
    .why-grid{grid-template-columns:1fr}
    .nav-links{display:none}
  }
  @media (max-width:560px){
    section{padding:64px 0}
    .grid{grid-template-columns:1fr}
    .grid .cell{border-right:none !important;border-bottom:2px solid var(--ink) !important}
    .grid .cell:last-child{border-bottom:none !important}
  }

/* multi-page additions */
.sec-head h1{font-family:'Big Shoulders Display',sans-serif;text-transform:uppercase;line-height:.95;font-weight:800;font-size:clamp(2.6rem,5.5vw,4.2rem);margin:16px 0 14px}
.depts{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.dept{border:2px solid var(--ink);background:#fffdf7;padding:32px 30px;text-decoration:none;display:block;transition:transform .12s}
.dept:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--ink)}
.dept h3{font-family:'Big Shoulders Display',sans-serif;font-weight:800;text-transform:uppercase;font-size:2rem;line-height:1;margin-bottom:10px}
.dept p{font-size:.95rem;margin-bottom:14px}
.dept .mono{color:var(--kraft-deep);display:block;margin-bottom:16px}
.dept .go{font-family:'IBM Plex Mono',monospace;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--stamp)}
.strip{background:var(--ink);color:var(--paper);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);padding:36px 0}
.strip .wrap{display:flex;align-items:center;gap:28px;flex-wrap:wrap;justify-content:space-between}
.strip .mono{color:var(--paper);font-size:.85rem;letter-spacing:.12em}
.strip .mono em{font-style:normal;color:#DFB57E}
.cta-band{background:var(--kraft);border-top:2px solid var(--ink);padding:72px 0;text-align:left}
.cta-band h2{font-family:'Big Shoulders Display',sans-serif;font-weight:800;text-transform:uppercase;line-height:.95;font-size:clamp(2.2rem,4.5vw,3.4rem);color:var(--ink-deep);margin:14px 0 12px}
.cta-band p{color:var(--ink-deep);max-width:50ch;margin-bottom:24px}
.cta-panel{border:2px solid var(--ink);background:#fffdf7;padding:30px 28px;margin:0}
.cta-panel h2{font-family:'Big Shoulders Display',sans-serif;font-weight:700;text-transform:uppercase;font-size:1.7rem;line-height:1;margin:0 0 10px}
.cta-panel p{max-width:52ch;margin-bottom:16px}
@media (max-width:760px){.depts{grid-template-columns:1fr}}
