/* Convoy Fleet Services LLC, static site styles */
@font-face{font-family:"Archivo Black";src:url("../assets/archivo-black.woff") format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"Barlow";src:url("../assets/barlow-400.woff") format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"Barlow";src:url("../assets/barlow-600.woff") format("woff");font-weight:600;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url("../assets/barlow-cond-700.woff") format("woff");font-weight:700;font-display:swap}

:root{
  --ink:#16120e;
  --ink-soft:#3f372d;
  --paper:#f3ead8;
  --paper-deep:#e7dac0;
  --orange:#ee5a1e;
  --amber:#f68c1f;
  --yellow:#ffd43b;
  --pale:#fff1b0;
  --display:"Archivo Black","Arial Black",Impact,sans-serif;
  --label:"Barlow Condensed","Arial Narrow",sans-serif;
  --body:"Barlow","Helvetica Neue",Arial,sans-serif;
  --grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .55 0'/></filter><rect width='220' height='220' filter='url(%23n)'/></svg>");
  --wrap:min(1180px,92vw);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.125rem/1.55 var(--body);position:relative}
body::after{content:"";position:fixed;inset:0;background:var(--grain);opacity:.09;mix-blend-mode:multiply;pointer-events:none;z-index:50}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--display);font-weight:400;text-transform:uppercase;line-height:.95;margin:0;letter-spacing:.005em}
p{margin:0 0 1em}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px;box-shadow:0 0 0 6px var(--yellow)}
.skip{position:absolute;left:12px;top:-60px;background:var(--ink);color:var(--paper);padding:.6rem 1rem;z-index:100;font-weight:600}
.skip:focus{top:12px}
.wrap{width:var(--wrap);margin-inline:auto}
.label{font:700 .95rem/1 var(--label);letter-spacing:.2em;text-transform:uppercase}

/* ---------- top bar ---------- */
.bar{position:absolute;top:0;left:0;right:0;z-index:20;padding:14px 0}
.bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none}
.brand img{height:96px;width:auto;flex:none}
.brand svg{width:46px;height:auto;flex:none}
.brand b{display:block;font:400 1.5rem/1 var(--display);letter-spacing:.02em}
.brand small{display:block;font:700 .72rem/1 var(--label);letter-spacing:.34em;margin-top:.25rem}
.bar nav{display:flex;align-items:center;gap:1.6rem}
.bar nav a{font:700 1rem/1 var(--label);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;padding:.4rem 0;border-bottom:3px solid transparent}
.bar nav a:hover{border-color:var(--ink)}
.bar nav a.btn-mini{background:var(--ink);color:var(--yellow);padding:.7rem 1rem;border:0}
.bar nav a.btn-mini:hover{background:var(--paper);color:var(--ink)}

/* ---------- hero ---------- */
.hero{position:relative;min-height:max(720px,min(900px,100svh));overflow:hidden;
  background:linear-gradient(to bottom,var(--orange) 0 38%,#f06f1f 38% 52%,var(--amber) 52% 66%,#fbae25 66% 79%,var(--yellow) 79% 100%);
  display:flex;flex-direction:column}
.hero::before{content:"";position:absolute;inset:0;background:var(--grain);opacity:.16;mix-blend-mode:multiply;pointer-events:none}
.sun{position:absolute;right:-7vw;bottom:34px;width:min(720px,70vw);aspect-ratio:1;transform:translateY(50%);z-index:1}
.hero > .wrap{position:relative;z-index:3;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4.2fr);gap:3rem;align-items:start;padding-top:170px;padding-bottom:200px}
.hero h1{font-size:clamp(2.7rem,6.2vw,5.8rem);max-width:10em}
.hero h1 em{font-style:normal;background:var(--ink);color:var(--yellow);padding:0 .12em;margin-left:-.04em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.hero .lede{font-size:clamp(1.15rem,1.7vw,1.4rem);max-width:30em;margin-top:1.6rem;font-weight:600;color:var(--ink)}
.cta-row{display:flex;flex-wrap:wrap;gap:1rem 1.6rem;align-items:center;margin-top:2rem}
.btn{display:inline-block;background:var(--ink);color:var(--paper);text-decoration:none;font:400 1.1rem/1 var(--display);text-transform:uppercase;letter-spacing:.04em;padding:1.1rem 1.6rem;border:0;cursor:pointer;box-shadow:6px 6px 0 var(--yellow);transition:transform .12s,box-shadow .12s}
.btn:hover{transform:translate(3px,3px);box-shadow:3px 3px 0 var(--yellow)}
.btn.on-paper{box-shadow:6px 6px 0 var(--orange)}
.btn.on-paper:hover{box-shadow:3px 3px 0 var(--orange)}
.textlink{font:700 1.05rem/1 var(--label);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;border-bottom:3px solid var(--ink);padding-bottom:.3rem}
.textlink:hover{background:var(--ink);color:var(--yellow)}
.sticker{position:relative;justify-self:end;width:min(100%,400px);margin-top:.5rem;transform:rotate(3.2deg);background:#fff;padding:14px;border-radius:8px;box-shadow:7px 8px 0 var(--ink)}
.sticker::before{content:"";position:absolute;top:-16px;left:34%;width:110px;height:30px;background:rgba(255,212,59,.82);transform:rotate(-6deg);box-shadow:0 1px 0 rgba(0,0,0,.12)}
.sticker img{width:100%;height:auto;border-radius:2px}
.road{position:absolute;left:0;right:0;bottom:0;z-index:4;height:34px;background:var(--ink)}
.road::after{content:"";position:absolute;left:0;right:0;top:15px;height:4px;background:repeating-linear-gradient(90deg,var(--yellow) 0 38px,transparent 38px 76px)}
.convoy{position:absolute;bottom:34px;right:0;z-index:5;height:clamp(105px,9.5vw,150px);width:auto;max-width:none;fill:var(--ink)}
@media (prefers-reduced-motion:no-preference){
  .convoy{animation:roll 1.4s cubic-bezier(.2,.7,.2,1) both}
  @keyframes roll{from{transform:translateX(40%);opacity:0}to{transform:none;opacity:1}}
}

/* ---------- ledger / services ---------- */
.services{position:relative;padding:110px 0 120px;background:var(--paper)}
.services .wrap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:4rem;align-items:start}
.side{position:sticky;top:30px}
.side h2{font-size:clamp(2.4rem,4.6vw,4.2rem)}
.side p{margin-top:1.4rem;max-width:22em}
.side .note{margin-top:2rem;border-left:6px solid var(--orange);padding:.2rem 0 .2rem 1rem;font-weight:600}
.ledger{list-style:none;margin:0;padding:0;border-bottom:3px solid var(--ink)}
.ledger li{display:grid;grid-template-columns:3.2rem minmax(0,1fr);column-gap:1rem;padding:1.5rem .8rem 1.5rem 0;border-top:3px solid var(--ink);position:relative;transition:background .15s,padding .15s}
.ledger li:hover{background:var(--pale);padding-left:.8rem}
.ledger .no{font:700 1.3rem/1.5 var(--label);letter-spacing:.1em;color:var(--orange)}
.ledger h3{font-size:clamp(1.35rem,2.4vw,1.9rem);line-height:1.02}
.ledger p{margin:.55rem 0 0;max-width:34em;color:var(--ink-soft)}
.ledger .on{display:block;margin-top:.7rem;font:700 .88rem/1.3 var(--label);letter-spacing:.14em;text-transform:uppercase}
.ledger li:nth-child(even){margin-left:2.2rem}

/* ---------- how it works ---------- */
.how{position:relative;background:var(--ink);color:var(--paper);padding:130px 0 120px}
.horizon{position:absolute;top:0;left:7%;width:150px;height:75px;transform:translateY(-100%);background:var(--orange);border-radius:150px 150px 0 0}
.how h2{font-size:clamp(2.4rem,5vw,4.6rem);max-width:8em}
.how .intro{max-width:34em;margin-top:1.4rem;color:#e0d6c1}
.how .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:4rem}
.steps{list-style:none;margin:0;padding:0 0 0 76px;position:relative;counter-reset:s}
.steps::before{content:"";position:absolute;left:0;top:0;bottom:0;width:44px;background:#000;border-left:3px solid #2e271f;border-right:3px solid #2e271f}
.steps::after{content:"";position:absolute;left:20px;top:0;bottom:0;width:4px;background:repeating-linear-gradient(to bottom,var(--yellow) 0 26px,transparent 26px 52px)}
.steps li{position:relative;padding-bottom:2.8rem;counter-increment:s}
.steps li:last-child{padding-bottom:0}
.steps li:nth-child(2){margin-left:1.5rem}
.steps li:nth-child(3){margin-left:3rem}
.steps li:nth-child(4){margin-left:1.2rem}
.steps li::before{content:counter(s);position:absolute;left:-76px;top:-.1rem;width:44px;height:44px;display:grid;place-items:center;background:var(--yellow);color:var(--ink);font:400 1.25rem/1 var(--display);transform:rotate(0deg);border-radius:50%;box-shadow:0 0 0 5px var(--ink)}
.steps h3{font-size:1.5rem;color:var(--yellow);margin-bottom:.5rem}
.steps p{margin:0;max-width:30em;color:#e6dcc7}

/* ---------- vehicles ---------- */
.vehicles{background:var(--yellow);padding:100px 0 0;position:relative;overflow:hidden}
.vehicles::before{content:"";position:absolute;inset:0;background:var(--grain);opacity:.14;mix-blend-mode:multiply;pointer-events:none}
.vehicles .head{position:relative;display:flex;justify-content:space-between;align-items:end;gap:2rem;flex-wrap:wrap}
.vehicles h2{font-size:clamp(2.4rem,5vw,4.4rem);max-width:7em}
.vehicles .head p{max-width:24em;font-weight:600;margin:0}

.fleetgrid{position:relative;display:grid;grid-template-columns:var(--cols);column-gap:1.2%;grid-template-rows:auto 34px auto;margin-top:3.2rem}
.fleetgrid figure{display:contents}
.fleetgrid svg{grid-row:1;grid-column:var(--c);width:100%;height:auto;fill:var(--ink);align-self:end;margin-bottom:-1px}
.fleetgrid figcaption{grid-row:3;grid-column:var(--c);padding:1rem 0 3.2rem;font-size:.95rem;line-height:1.3}
.fleetgrid figcaption b{display:block;font:700 1.05rem/1 var(--label);letter-spacing:.14em;text-transform:uppercase;margin-bottom:.3rem}
.fleetgrid .gl{grid-row:2;grid-column:1/-1;margin:0 calc(50% - 50vw);background:var(--ink);position:relative}
.fleetgrid .gl::after{content:"";position:absolute;left:0;right:0;top:15px;height:4px;background:repeating-linear-gradient(90deg,var(--paper) 0 38px,transparent 38px 76px)}

/* ---------- coverage ---------- */
.coverage{padding:120px 0;background:var(--paper)}
.coverage .wrap{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:4.5rem;align-items:center}
.coverage h2{font-size:clamp(2.4rem,5vw,4.5rem)}
.coverage h2 span{color:var(--orange);-webkit-text-stroke:0}
.coverage p{max-width:30em;margin-top:1.3rem}
.coverage .fine{font-weight:600;border-top:3px solid var(--ink);padding-top:1rem;margin-top:1.8rem}
.tilemap{display:grid;grid-template-columns:repeat(11,1fr);gap:4px;width:100%;margin:0;padding:0;list-style:none}
.tilemap li{aspect-ratio:1;display:grid;place-items:center;background:var(--orange);color:var(--ink);font:700 clamp(.62rem,1.05vw,.9rem)/1 var(--label);letter-spacing:.06em;border:2px solid var(--ink)}
.tilemap li:nth-child(5n+2){background:var(--amber)}
.tilemap li:nth-child(7n+3){background:var(--yellow)}
.tilemap .gap{background:none;border:0}
.mapcap{margin-top:.8rem;font:700 .85rem/1.3 var(--label);letter-spacing:.14em;text-transform:uppercase}

/* ---------- quote ---------- */
.quote{background:var(--paper-deep);padding:110px 0 120px;position:relative}
.quote .wrap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:4rem;align-items:start}
.quote h2{font-size:clamp(2.4rem,4.6vw,4.2rem)}
.quote .ph{margin-top:2rem;font-weight:600}
.quote .ph span{display:block;margin-top:.4rem;font-weight:400}
.mark{background:var(--yellow);padding:0 .3em;font-weight:600}
form.ticket{position:relative;background:var(--paper);border:3px solid var(--ink);padding:2rem 2rem 2.2rem 3.2rem;box-shadow:9px 9px 0 var(--ink)}
form.ticket::before{content:"";position:absolute;left:14px;top:12px;bottom:12px;width:12px;background:radial-gradient(circle,var(--paper-deep) 0 5px,transparent 5.5px) 0 0/12px 26px repeat-y}
.ticket .tophead{display:flex;justify-content:space-between;align-items:baseline;border-bottom:3px solid var(--ink);padding-bottom:.8rem;margin-bottom:1.4rem}
.ticket .tophead strong{font:400 1.4rem/1 var(--display);text-transform:uppercase}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem 1.4rem}
.fields .full{grid-column:1/-1}
label,.legend{display:block;font:700 .92rem/1 var(--label);letter-spacing:.16em;text-transform:uppercase;margin-bottom:.45rem}
input[type=text],input[type=email],input[type=tel],select,textarea{width:100%;font:400 1.1rem/1.3 var(--body);color:var(--ink);background:#fbf6ea;border:0;border-bottom:3px solid var(--ink);border-radius:0;padding:.7rem .6rem}
textarea{min-height:7rem;resize:vertical;border:3px solid var(--ink)}
input:focus,select:focus,textarea:focus{outline:0;background:var(--pale);box-shadow:none}
fieldset{border:0;margin:0;padding:0;min-width:0}
.checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem 1.2rem}
.checks label{display:flex;align-items:center;gap:.6rem;font:400 1.05rem/1.2 var(--body);letter-spacing:0;text-transform:none;margin:0;cursor:pointer}
.checks input{appearance:none;-webkit-appearance:none;width:1.4rem;height:1.4rem;flex:none;border:3px solid var(--ink);background:#fbf6ea;margin:0;display:grid;place-content:center;cursor:pointer}
.checks input::before{content:"";width:.7rem;height:.7rem;background:var(--orange);transform:scale(0);transition:transform .1s}
.checks input:checked::before{transform:scale(1)}
.checks input:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.status{margin-top:1.2rem;padding:1rem;background:var(--yellow);border:3px solid var(--ink);font-weight:600}
.status[hidden]{display:none}
.hp{position:absolute;left:-9999px}

/* ---------- footer ---------- */
footer{background:var(--ink);color:var(--paper);padding:70px 0 40px;position:relative}
footer .top{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,3fr) minmax(0,3fr);gap:3rem}
footer .brand b{font-size:2rem}
footer .brand img{height:auto;width:180px;background:var(--paper);padding:10px 14px;transform:rotate(-1.5deg)}
footer h3{font:700 .95rem/1 var(--label);letter-spacing:.2em;color:var(--yellow);margin-bottom:.9rem}
footer p,footer li{margin:0 0 .4rem;color:#e0d6c1}
footer ul{list-style:none;margin:0;padding:0}
footer a{text-decoration:none;border-bottom:2px solid #5b5043}
footer a:hover{border-color:var(--yellow)}
footer .legal{margin-top:3.5rem;padding-top:1.2rem;border-top:3px solid #332b22;font-size:.95rem;color:#b9ae98}

/* ---------- small screens ---------- */
@media (max-width:900px){
  .bar nav a:not(.btn-mini){display:none}
  .hero > .wrap{grid-template-columns:1fr;padding-top:150px;padding-bottom:190px;gap:2.5rem}
  .sticker{justify-self:start;width:min(86%,340px);margin-left:.4rem}
  .sun{right:-30vw;width:110vw}
  .services .wrap,.how .wrap,.coverage .wrap,.quote .wrap{grid-template-columns:1fr;gap:2.5rem}
  .side{position:static}
  .ledger li:nth-child(even){margin-left:0}
  .steps li:nth-child(n){margin-left:0}
          .fleetgrid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:none;column-gap:1.4rem;row-gap:0}
  .fleetgrid figure{display:block;margin-bottom:1.8rem}
  .fleetgrid svg{grid-row:auto;grid-column:auto;border-bottom:12px solid var(--ink)}
  .fleetgrid figcaption{grid-row:auto;grid-column:auto;padding:.8rem 0 0}
  .fleetgrid .gl{display:none}
  .vehicles .wrap{padding-bottom:1.2rem}
  footer .top{grid-template-columns:1fr;gap:2rem}
  .fields{grid-template-columns:1fr}
  form.ticket{padding:1.6rem 1.2rem 1.8rem 2.4rem;box-shadow:6px 6px 0 var(--ink)}
  form.ticket::before{left:9px}
}
@media (max-width:520px){
  body{font-size:1.05rem}
  .brand small{display:none}
  .brand img{height:68px}
  .checks{grid-template-columns:1fr}
  .ledger li{grid-template-columns:2.4rem minmax(0,1fr)}
  .tilemap{gap:3px}
  .tilemap li{border-width:1.5px}
}

.usmap{width:100%;height:auto;filter:drop-shadow(6px 7px 0 var(--ink))}
.usmap path{transition:fill .15s}
.usmap path:hover{fill:var(--yellow)}

/* =====================================================================
   Services dropdown, mobile menu, and the individual service pages
   ===================================================================== */
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.bar .wrap{position:relative}
.navwrap{display:flex;align-items:center;gap:1rem}
.menu-btn{display:none;background:var(--ink);color:var(--yellow);border:0;cursor:pointer;font:700 1rem/1 var(--label);letter-spacing:.16em;text-transform:uppercase;padding:.8rem 1rem;align-items:center;gap:.6rem}
.menu-btn .bars{display:inline-block;width:18px;height:12px;border-top:3px solid currentColor;border-bottom:3px solid currentColor;position:relative}
.menu-btn .bars::after{content:"";position:absolute;left:0;right:0;top:3px;height:3px;background:currentColor}
.dd{position:relative}
.dd-btn{background:none;border:0;border-bottom:3px solid transparent;color:inherit;cursor:pointer;font:700 1rem/1 var(--label);letter-spacing:.16em;text-transform:uppercase;padding:.4rem 0;display:inline-flex;align-items:center;gap:.5rem}
.dd-btn:hover,.dd.open .dd-btn,.dd-btn.is-here{border-color:var(--ink)}
.dd-btn::after{content:"";width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:7px solid currentColor;transition:transform .15s}
.dd.open .dd-btn::after{transform:rotate(180deg)}
.dd-panel{display:none;position:absolute;top:100%;left:-1.2rem;padding-top:14px;width:min(26rem,92vw);z-index:40}
.dd.open .dd-panel{display:block}
html:not(.js) .dd:hover .dd-panel,html:not(.js) .dd:focus-within .dd-panel{display:block}
.dd-list{list-style:none;margin:0;padding:.35rem .5rem .5rem;background:var(--paper);color:var(--ink);border:3px solid var(--ink);box-shadow:8px 8px 0 var(--yellow)}
.dd-list li{border-top:2px solid var(--ink)}
.dd-list li:first-child{border-top:0}
.bar nav .dd-list a{display:grid;grid-template-columns:2.3rem minmax(0,1fr);align-items:baseline;padding:.72rem .6rem;font:600 1.08rem/1.15 var(--body);letter-spacing:0;text-transform:none;border:0;color:var(--ink)}
.bar nav .dd-list a:hover,.bar nav .dd-list a:focus-visible{background:var(--pale)}
.bar nav .dd-list a[aria-current=page]{background:var(--yellow)}
.dd-list .n{font:700 .95rem/1 var(--label);letter-spacing:.1em;color:var(--orange)}
.bar nav .dd-list .all{display:block;font:700 .9rem/1 var(--label);letter-spacing:.18em;text-transform:uppercase;padding:.8rem .6rem .7rem}
.dd-list li.sep{border-top-width:4px}

/* ---------- service page hero strip ---------- */
.shero{position:relative;overflow:hidden;
  background:linear-gradient(to bottom,var(--orange) 0 40%,#f06f1f 40% 55%,var(--amber) 55% 69%,#fbae25 69% 82%,var(--yellow) 82% 100%);
  display:flex;flex-direction:column}
.shero::before{content:"";position:absolute;inset:0;background:var(--grain);opacity:.16;mix-blend-mode:multiply;pointer-events:none}
.shero .sun{right:var(--sr,-6vw);width:min(560px,62vw);bottom:34px}
.shero > .wrap{position:relative;z-index:3;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4.2fr);gap:3rem;align-items:start;padding-top:158px;padding-bottom:178px}
.crumb{margin:0 0 1rem;font:700 .88rem/1.2 var(--label);letter-spacing:.18em;text-transform:uppercase}
.crumb a{text-decoration:none;border-bottom:2px solid rgba(22,18,14,.45)}
.crumb a:hover{border-color:var(--ink)}
.shero h1{font-size:clamp(2.3rem,5.2vw,4.7rem);max-width:11em}
.shero h1 em{font-style:normal;background:var(--ink);color:var(--yellow);padding:0 .12em;margin-left:-.04em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.shero .lede{font-size:clamp(1.1rem,1.55vw,1.32rem);max-width:32em;margin-top:1.4rem;font-weight:600}
.plate{position:relative;justify-self:end;width:min(100%,350px);margin-top:.6rem;transform:rotate(2.6deg);background:var(--paper);border:3px solid var(--ink);padding:1.2rem 1.3rem 1.3rem;box-shadow:7px 8px 0 var(--ink)}
.plate::before{content:"";position:absolute;top:-16px;left:30%;width:104px;height:28px;background:rgba(255,212,59,.85);transform:rotate(-5deg);box-shadow:0 1px 0 rgba(0,0,0,.12)}
.plate .label{color:var(--orange)}
.plate strong{display:block;margin-top:.55rem;font:400 clamp(1.3rem,2vw,1.7rem)/1.02 var(--display);text-transform:uppercase}
.plate p{margin:.65rem 0 0;font-size:1rem;line-height:1.35;color:var(--ink-soft)}
.shero .convoy{height:clamp(86px,8vw,124px)}

/* ---------- sections ---------- */
.sec{position:relative;padding:92px 0 96px}
.sec.paper{background:var(--paper)}
.sec.deep{background:var(--paper-deep)}
.sec.ink{background:var(--ink);color:var(--paper)}
.sec.sunny{background:var(--yellow)}
.sec.sunny::before{content:"";position:absolute;inset:0;background:var(--grain);opacity:.12;mix-blend-mode:multiply;pointer-events:none}
.sec > .wrap{position:relative}
.sec h2{font-size:clamp(2rem,3.9vw,3.4rem)}
.sec .label.k{display:block;margin-bottom:.8rem;color:var(--orange)}
.sec.ink .label.k{color:var(--yellow)}
.gs{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:4rem;align-items:start}
.gs.flip{grid-template-columns:minmax(0,8fr) minmax(0,4fr)}
.gs.flip > .head{order:2}
.gs .head.stick{position:sticky;top:28px}
.head .sub{margin-top:1.1rem;max-width:20em;color:var(--ink-soft)}
.sec.ink .head .sub{color:#d9cfba}
.stack > .head{margin-bottom:2.3rem;max-width:44em}
.stack > .head .sub{max-width:34em}
.prose p{max-width:40em}
.prose p + p{margin-top:1.1em}
.prose a,.faq a,.tnote a,.slip a{text-decoration-thickness:2px;text-underline-offset:3px}
.prose a:hover,.faq a:hover,.tnote a:hover,.slip a:hover{background:var(--yellow)}
.twin{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 4rem}
.twin > div + div{border-left:3px solid var(--ink);padding-left:3rem}
.twin h2{margin-bottom:1.3rem}
.pull{font:400 clamp(1.25rem,2.3vw,1.9rem)/1.08 var(--display);text-transform:uppercase;border-left:8px solid var(--orange);padding:.25rem 0 .25rem 1.1rem;margin:2.4rem 0 0;max-width:19em}
.bignum{display:block;font:400 clamp(4.6rem,13vw,10rem)/.82 var(--display);color:var(--orange);letter-spacing:-.01em}
.bignum small{display:block;margin-top:.9rem;font:700 1rem/1.2 var(--label);letter-spacing:.2em;text-transform:uppercase;color:var(--ink)}
.stack.big{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:4rem;align-items:start}
.note-box{border-left:6px solid var(--orange);padding:.3rem 0 .3rem 1.1rem;margin-top:2rem;font-weight:600;max-width:36em}
.sec.ink .note-box{border-color:var(--yellow)}

.chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.8rem .7rem}
.chips li{background:var(--paper);border:3px solid var(--ink);padding:.55rem .95rem .6rem;font-weight:600;line-height:1.2;box-shadow:4px 4px 0 var(--ink)}
.chips li:nth-child(3n+1){background:var(--yellow);transform:rotate(-.9deg)}
.chips li:nth-child(3n+2){transform:rotate(.7deg)}
.chips li:nth-child(5n+4){background:var(--pale)}
.sec .after{margin-top:1.6rem;max-width:38em;font-weight:600}
.ruled{list-style:none;margin:0;padding:0;border-bottom:3px solid var(--ink)}
.ruled li{padding:1.15rem 0 1.2rem;border-top:3px solid var(--ink);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:0 2rem}
.ruled b{font:400 1.25rem/1.05 var(--display);text-transform:uppercase}
.ruled span{color:var(--ink-soft)}

.cl-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,17.5rem),1fr));gap:2.4rem 3rem}
.cl-groups.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.cl-group h3{font:700 1rem/1.15 var(--label);letter-spacing:.18em;border-bottom:3px solid var(--ink);padding-bottom:.65rem;margin-bottom:1rem}
.cl-group p.gnote{font-size:1rem;color:var(--ink-soft);margin:-.2rem 0 .9rem}
.cl{list-style:none;margin:0;padding:0}
.cl li{position:relative;padding-left:1.9rem;margin-bottom:.6rem;line-height:1.4}
.cl li::before{content:"";position:absolute;left:0;top:.28em;width:.95rem;height:.95rem;border:3px solid var(--ink);background:linear-gradient(var(--orange),var(--orange)) center/.4rem .4rem no-repeat,#fbf6ea}
.sec.ink .cl li::before{border-color:var(--paper);background:linear-gradient(var(--yellow),var(--yellow)) center/.4rem .4rem no-repeat,transparent}
.sheet{list-style:none;margin:0;padding:0;columns:2;column-gap:3.4rem;counter-reset:sh}
.sheet li{break-inside:avoid;counter-increment:sh;position:relative;padding:.85rem 0 .9rem 3.2rem;border-top:3px solid var(--ink);line-height:1.4}
.sheet li::before{content:counter(sh,decimal-leading-zero);position:absolute;left:0;top:.9rem;font:700 1.25rem/1 var(--label);letter-spacing:.08em;color:var(--orange)}
.sheet b{display:block;font:400 1.1rem/1.1 var(--display);text-transform:uppercase;margin-bottom:.3rem}
.sheet span{color:var(--ink-soft)}

.table-wrap{overflow-x:auto;border:3px solid var(--ink);box-shadow:8px 8px 0 var(--ink);background:#fbf6ea;-webkit-overflow-scrolling:touch}
table.spec{border-collapse:collapse;width:100%;min-width:600px;font-size:1.05rem;line-height:1.35}
.spec th{background:var(--ink);color:var(--yellow);font:700 .88rem/1.2 var(--label);letter-spacing:.14em;text-transform:uppercase;text-align:left;padding:.85rem 1rem}
.spec td{padding:.85rem 1rem;border-top:2px solid var(--ink);vertical-align:top}
.spec tbody tr:nth-child(even){background:var(--pale)}
.spec td:first-child{font-weight:600}
.spec td.fig{font-family:var(--display);font-size:1.15rem;white-space:nowrap}
.tnote{font-size:1rem;margin-top:1.5rem;max-width:46em;color:var(--ink-soft)}
.subgap{margin-top:3rem}

.ticks{list-style:none;margin:0;padding:0 0 0 1.7rem;border-left:4px solid var(--ink)}
.ticks li{position:relative;margin-bottom:1.7rem;max-width:40em}
.ticks li:last-child{margin-bottom:0}
.ticks li::before{content:"";position:absolute;left:calc(-1.7rem - 4px);top:.62rem;width:1.1rem;height:4px;background:var(--ink)}
.ticks b{display:block;font:400 1.35rem/1.05 var(--display);text-transform:uppercase;margin-bottom:.3rem}
.ticks span{color:var(--ink-soft)}
.when{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2rem}
.when > div{padding:1.6rem 1.6rem 1.8rem;border:3px solid var(--ink)}
.when .stop{background:var(--ink);color:var(--paper);box-shadow:8px 8px 0 var(--orange)}
.when .soon{background:var(--paper);box-shadow:8px 8px 0 var(--ink)}
.when h3{font-size:1.5rem;margin-bottom:1rem}
.when .stop h3{color:var(--yellow)}
.when ul{list-style:none;margin:0;padding:0}
.when li{padding:.55rem 0 .6rem;border-top:2px solid currentColor;line-height:1.35}
.when li:first-child{border-top:0;padding-top:0}

.stds{list-style:none;margin:0;padding:0;border-bottom:3px solid #3a3228}
.stds li{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:0 2rem;padding:1.15rem 0 1.2rem;border-top:3px solid #3a3228}
.stds b{font:400 1.2rem/1.1 var(--display);color:var(--yellow)}
.stds span{color:#e6dcc7}
.stds em{font-style:normal;display:block;margin-top:.4rem;font-size:.98rem;color:#bfb49c}

.route{list-style:none;margin:0;padding:3.6rem 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:relative;counter-reset:r}
.route::before{content:"";position:absolute;left:0;right:0;top:.55rem;height:22px;background:var(--ink)}
.route::after{content:"";position:absolute;left:0;right:0;top:1.35rem;height:4px;background:repeating-linear-gradient(90deg,var(--yellow) 0 30px,transparent 30px 60px)}
.route li{position:relative;padding:.4rem 1.6rem 0 0;counter-increment:r}
.route li::before{content:counter(r);position:absolute;left:0;top:-3.3rem;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--yellow);color:var(--ink);font:400 1.25rem/1 var(--display);box-shadow:0 0 0 5px var(--ink);z-index:2}
.route h3{font-size:1.3rem;margin-bottom:.5rem}
.route p{margin:0;color:var(--ink-soft)}
.sec.ink .route p{color:#e6dcc7}
.sec.ink .route h3{color:var(--yellow)}
.sec.ink .route::before{background:#000;border-top:3px solid #2e271f;border-bottom:3px solid #2e271f}
.sec.ink .steps h3{margin-bottom:.5rem}

.slip{position:relative;background:var(--paper);border:3px solid var(--ink);padding:2rem 2rem 2.2rem 3.4rem;box-shadow:9px 9px 0 var(--orange)}
.slip::before{content:"";position:absolute;left:14px;top:12px;bottom:12px;width:12px;background:radial-gradient(circle,var(--paper-deep) 0 5px,transparent 5.5px) 0 0/12px 26px repeat-y}
.slip .tophead{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;flex-wrap:wrap;border-bottom:3px solid var(--ink);padding-bottom:.8rem;margin-bottom:1.3rem}
.slip .tophead strong{font:400 1.35rem/1 var(--display);text-transform:uppercase}
.slip .cl li{margin-bottom:.7rem}
.slip .foot{margin:1.3rem 0 0;padding-top:1rem;border-top:2px dashed var(--ink);font-size:1rem;color:var(--ink-soft)}

.faq{border-bottom:3px solid var(--ink)}
.faq details{border-top:3px solid var(--ink)}
.faq summary{list-style:none;cursor:pointer;position:relative;font:400 clamp(1.1rem,1.9vw,1.4rem)/1.12 var(--display);text-transform:uppercase;padding:1.15rem 3.2rem 1.15rem 0}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before,.faq summary::after{content:"";position:absolute;right:.4rem;top:50%;width:20px;height:4px;background:var(--ink);transition:transform .15s}
.faq summary::after{transform:rotate(90deg)}
.faq details[open] summary::after{transform:rotate(0)}
.faq summary:hover{background:var(--pale)}
.faq .ans{padding:0 0 1.4rem;max-width:44em}
.faq .ans p{margin:0 0 .9em}
.faq .ans p:last-child{margin-bottom:0}
.sec.deep .faq summary:hover{background:var(--paper)}

.cta{position:relative;background:var(--yellow);padding:76px 0 82px;overflow:hidden}
.cta::before{content:"";position:absolute;inset:0;background:var(--grain);opacity:.14;mix-blend-mode:multiply;pointer-events:none}
.cta .wrap{position:relative;display:flex;gap:2rem 3rem;align-items:center;justify-content:space-between;flex-wrap:wrap}
.cta h2{font-size:clamp(1.9rem,3.8vw,3.2rem);max-width:12em}
.cta p{margin:1rem 0 0;max-width:30em;font-weight:600}
.pager{display:grid;grid-template-columns:1fr 1fr;background:var(--ink);color:var(--paper)}
.pager a{display:block;text-decoration:none;padding:2rem 4vw 2.2rem;transition:background .15s}
.pager a:hover{background:#000}
.pager a + a{border-left:3px solid #332b22;text-align:right}
.pager .label{display:block;color:var(--yellow);margin-bottom:.6rem}
.pager b{font:400 clamp(1.1rem,2.2vw,1.7rem)/1.05 var(--display);text-transform:uppercase}
.pager .arr{display:inline-block;width:.7em;height:.7em;border-top:4px solid var(--yellow);border-left:4px solid var(--yellow);vertical-align:.05em;margin-right:.5em;transform:rotate(-45deg)}
.pager a + a .arr{margin:0 0 0 .5em;transform:rotate(135deg)}

/* home page ledger links + footer columns */
.ledger h3 a{text-decoration:none}
.ledger h3 a::after{content:"";position:absolute;inset:0}
.ledger li{cursor:pointer}
.ledger .go{display:inline-block;margin-top:.75rem;font:700 .88rem/1 var(--label);letter-spacing:.16em;text-transform:uppercase;border-bottom:3px solid var(--orange);padding-bottom:.2rem}
.ledger li:hover .go{background:var(--ink);color:var(--yellow);border-color:var(--ink)}
footer .top.four{grid-template-columns:minmax(0,4.2fr) minmax(0,3.6fr) minmax(0,2.2fr) minmax(0,3fr)}
footer .brand img{max-width:100%}

@media (max-width:900px){
  .menu-btn{display:inline-flex}
  .bar nav{display:none;position:absolute;left:0;right:0;top:calc(100% + 6px);flex-direction:column;align-items:stretch;gap:0;background:var(--paper);color:var(--ink);border:3px solid var(--ink);box-shadow:7px 7px 0 var(--yellow);padding:.4rem .9rem .9rem;z-index:45;max-height:calc(100svh - 130px);overflow-y:auto}
  .navwrap.open nav{display:flex}
  html:not(.js) .bar nav{display:flex;position:static;box-shadow:none;border:0;background:none;flex-direction:row;flex-wrap:wrap;padding:0}
  html:not(.js) .menu-btn{display:none}
  .bar nav a:not(.btn-mini){display:block;padding:.95rem 0;border-bottom:2px solid var(--ink);font-size:1.05rem}
  .bar nav a.btn-mini{display:block;text-align:center;margin-top:.9rem;padding:1rem}
  .dd{border-bottom:2px solid var(--ink)}
  .dd-btn{width:100%;justify-content:space-between;padding:.95rem 0;font-size:1.05rem;border-bottom:0}
  .dd-panel{position:static;width:auto;padding:0 0 .6rem}
  .dd-list{box-shadow:none;border:0;border-left:6px solid var(--orange);padding:0 0 0 .4rem;background:transparent}
  .dd-list li{border-color:rgba(22,18,14,.35)}
  .bar nav .dd-list a{display:grid;padding:.8rem .4rem;border-bottom:0;font-size:1.05rem}
  .bar nav .dd-list a.all{display:block;padding:.8rem .4rem}
  .shero > .wrap{grid-template-columns:1fr;gap:2.2rem;padding-top:148px;padding-bottom:150px}
  .plate{justify-self:start;width:min(88%,340px);margin-left:.3rem}
  .shero .sun{right:-26vw;width:100vw}
  .shero .convoy{height:clamp(66px,17vw,96px)}
  .gs,.gs.flip,.stack.big{grid-template-columns:minmax(0,1fr);gap:2rem}
  .gs.flip > .head{order:0}
  .gs .head.stick{position:static}
  .twin{grid-template-columns:1fr;gap:2.4rem}
  .twin > div + div{border-left:0;padding-left:0;border-top:3px solid var(--ink);padding-top:2rem}
  .ruled li,.stds li{grid-template-columns:1fr;gap:.35rem}
  .sheet{columns:1}
  .cl-groups.two{grid-template-columns:1fr}
  .route{grid-template-columns:1fr;padding:0 0 0 70px}
  .route::before{left:0;right:auto;top:0;bottom:0;width:22px;height:auto}
  .route::after{left:9px;right:auto;top:0;bottom:0;width:4px;height:auto;background:repeating-linear-gradient(to bottom,var(--yellow) 0 24px,transparent 24px 48px)}
  .route li{padding:0 0 2rem}
  .route li::before{left:-70px;top:-.2rem}
  .when{grid-template-columns:1fr}
  .sec{padding:70px 0 74px}
  footer .top.four{grid-template-columns:1fr 1fr;gap:2rem}
  footer .top.four > :first-child{grid-column:1/-1}
}
@media (max-width:520px){
  .shero > .wrap{padding-top:130px}
  .slip{padding:1.5rem 1.1rem 1.7rem 2.3rem;box-shadow:6px 6px 0 var(--orange)}
  .slip::before{left:8px}
  .pager{grid-template-columns:1fr}
  .pager a + a{border-left:0;border-top:3px solid #332b22;text-align:left}
  footer .top.four{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:no-preference){
  .shero .convoy{animation:roll 1.2s cubic-bezier(.2,.7,.2,1) both}
}
@media print{.bar,.cta,.pager,.road,.sun{display:none}}
.gs > *,.twin > *,.stack > *{min-width:0}