/* ==========================================================================
   Freight Edge - "SINCE 1989" direction
   Typography-led, in the Freight Edge brand colours. No stock photography,
   no bento grid. Industrial signage + enterprise computing.

   Type concept:
     Archivo      - American gothic signage. The freight yard.
     IBM Plex Sans/Mono - the typeface family of enterprise computing.
                    Chosen because this company was writing software in 1989.

   Colour: white pages, with brand-navy bands for the page heads, the closing
   call to action and the footer. Those bands re-define the tokens below
   (see "navy bands"), so every component inside them re-themes by itself.
   ========================================================================== */

:root{
  /* brand, sampled from the logo (assets/img/brand/fe-mark.svg) */
  --brand-blue:   #005B88;   /* 7.36:1 on white - fine for any text */
  --brand-orange: #F36523;   /* 3.14:1 on white - large display text, fills and rules ONLY */
  --navy:         #00344F;   /* darker brand blue for bands; brand orange is 4.2:1 on it */

  /* ground */
  --ground:    #ffffff;
  --ground-2:  #f4f7f9;
  --ground-3:  #e8eef2;
  --line:      #dbe3e9;
  --line-2:    #c3cfd8;

  /* ink */
  --ink:       #0e2433;
  --ink-2:     #45586a;
  --ink-3:     #5f6f7c;

  /* signal - small text and links use blue; orange is for big type and fills */
  --accent:      var(--brand-blue);
  --accent-dim:  #00466a;
  --hot:         var(--brand-orange);
  --bad:         #b42318;

  /* primary button */
  --fill:        var(--brand-orange);
  --fill-ink:    #0e2433;     /* 5.1:1 on brand orange; white would be 3.1:1 */
  --fill-hover:  var(--brand-blue);
  --fill-hover-ink: #ffffff;

  --wrap: 1240px;

  --f-disp: "Archivo", "Arial Narrow", Impact, sans-serif;
  --f-body: "IBM Plex Sans", "Segoe UI", system-ui, sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, Consolas, monospace;
}

/* navy bands - page heads, closing CTA, footer */
.hero,.phead,.close,.foot{
  --ground:    var(--navy);
  --ground-2:  #003d5c;
  --ground-3:  #004868;
  --line:      rgba(255,255,255,.14);
  --line-2:    rgba(255,255,255,.3);
  --ink:       #ffffff;
  --ink-2:     rgba(255,255,255,.82);
  --ink-3:     rgba(255,255,255,.64);
  --accent:    #ff8a4f;    /* lighter orange: 5.6:1 on navy, for small text */
  --accent-dim:#e9763c;
  --fill-hover:#ffffff;
  --fill-hover-ink: var(--navy);
  background:var(--ground);color:var(--ink);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
}

body{
  margin:0;
  background:var(--ground);
  color:var(--ink);
  font-family:var(--f-body);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img,svg{max-width:100%;display:block}
a{color:inherit}
::selection{background:var(--accent);color:#fff}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:24px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;z-index:200;background:var(--accent);color:#fff;padding:12px 18px}

/* ---------- section scaffolding ------------------------------------- */
.sec{padding:clamp(64px,8vw,132px) 0;border-top:1px solid var(--line)}
.sec-tight{padding:clamp(40px,5vw,64px) 0}

/* the § marker - encodes real section order, spec-sheet style */
.marker{
  font-family:var(--f-mono);font-size:.72rem;font-weight:500;
  letter-spacing:.16em;text-transform:uppercase;color:var(--accent);
  display:flex;align-items:center;gap:14px;margin:0 0 28px;
}
.marker::after{content:"";flex:1;height:1px;background:var(--line)}

/* ---------- the wall of type ---------------------------------------- */
.slab{
  font-family:var(--f-disp);
  font-weight:800;
  line-height:.9;
  letter-spacing:-.035em;
  text-transform:uppercase;
  margin:0;
  text-wrap:balance;
}
.slab-xl{font-size:clamp(2.05rem,5.9vw,5.2rem)} /* 30% under the original 2.9rem/8.4vw/7.4rem (Ryan 11-08-2026) */
.slab-l {font-size:clamp(2.2rem,5.4vw,4.4rem)}
.slab-m {font-size:clamp(1.6rem,3.2vw,2.5rem);line-height:.98}
.dim{color:var(--ink-3)}
.hot{color:var(--hot)}

.lede{
  font-size:clamp(1.05rem,1.5vw,1.24rem);
  line-height:1.55;color:var(--ink-2);max-width:52ch;margin:26px 0 0;
}
.lede strong{color:var(--ink);font-weight:600}

/* ---------- nav ------------------------------------------------------ */
.nav{
  position:sticky;top:0;z-index:100;
  background:rgba(255,255,255,.94);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:70px;gap:20px}
.mark{
  text-decoration:none;display:flex;align-items:center;gap:10px;flex:none;
  color:var(--brand-blue);
}
.foot .mark{color:#fff}
.mark-fe{width:30px;height:30px;flex:none}
.mark-word{width:auto;height:15px}
.nav-links{display:flex;align-items:center;gap:2px}
.nav-links a{
  font-family:var(--f-mono);font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-2);text-decoration:none;padding:9px 11px;white-space:nowrap;
  transition:color .15s ease;
}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--accent)}
.nav-sep{width:1px;height:20px;background:var(--line-2);margin:0 8px}
.nav-cta{
  background:var(--fill);border:1px solid var(--fill);color:var(--fill-ink)!important;margin-left:8px;
}
.nav-cta:hover{background:var(--fill-hover);border-color:var(--fill-hover);color:var(--fill-hover-ink)!important}

.burger{
  display:none;width:42px;height:42px;border:1px solid var(--line-2);
  background:transparent;color:var(--ink);cursor:pointer;place-items:center;
}
.burger svg{width:20px;height:20px}
.nav[data-open="true"] .burger{border-color:var(--accent);color:var(--accent)}
@media (max-width:1100px){
  .burger{display:grid}
  .nav-links{
    display:none;position:fixed;inset:66px 0 auto 0;flex-direction:column;
    align-items:stretch;background:var(--ground-2);border-bottom:1px solid var(--line);
    padding:10px 24px 22px;max-height:calc(100dvh - 66px);overflow-y:auto;
  }
  .nav[data-open="true"] .nav-links{display:flex}
  .nav-links a{padding:15px 0;font-size:.9rem;border-bottom:1px solid var(--line)}
  .nav-sep{display:none}
  .nav-cta{margin:14px 0 0;text-align:center;padding:15px!important}
}

/* ---------- hero ----------------------------------------------------- */
.hero{padding:clamp(48px,7vw,104px) 0 clamp(40px,5vw,72px);border-top:none;position:relative;overflow:hidden}
.hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(920px 520px at 88% -10%,rgba(243,101,35,.2),transparent 62%);
}
.hero > .wrap{position:relative;z-index:1}
/* home headline (Ryan 11-08-2026): the orange
   line kept on one line once the screen is wide enough, and the paragraph as
   wide as the headline */
@media (min-width:560px){.hero .one-line{white-space:nowrap}}
.hero .lede{max-width:none}
.stamp{
  font-family:var(--f-mono);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-3);margin:0 0 30px;display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;
}
.stamp b{color:var(--accent);font-weight:500}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:38px}

/* ---------- buttons -------------------------------------------------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--f-mono);font-size:.79rem;font-weight:500;
  letter-spacing:.13em;text-transform:uppercase;text-decoration:none;
  padding:16px 26px;border:1px solid var(--line-2);color:var(--ink);
  background:transparent;cursor:pointer;transition:all .16s ease;
}
.btn:hover{border-color:var(--accent);color:var(--accent)}
.btn-fill{background:var(--fill);border-color:var(--fill);color:var(--fill-ink)}
.btn-fill:hover{background:var(--fill-hover);border-color:var(--fill-hover);color:var(--fill-hover-ink)}
.btn svg{width:15px;height:15px;transition:transform .16s ease}
.btn:hover svg{transform:translateX(3px)}

/* ---------- the ledger (timeline) ------------------------------------ */
.ledger{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border-top:1px solid var(--line)}
.ledger-3{grid-template-columns:repeat(3,1fr)}
@media (max-width:1080px){.ledger{grid-template-columns:repeat(2,1fr)}.ledger-3{grid-template-columns:1fr}}
@media (max-width:620px){.ledger{grid-template-columns:1fr}}
.entry{
  background:var(--ground);padding:32px 26px 36px;
  position:relative;transition:background .2s ease;
}
.entry:hover{background:var(--ground-2)}
.entry-yr{
  font-family:var(--f-mono);font-size:.76rem;letter-spacing:.16em;
  color:var(--accent);margin:0 0 16px;
}
.entry h3{
  font-family:var(--f-disp);font-weight:700;text-transform:uppercase;
  font-size:1.22rem;line-height:1.05;letter-spacing:-.015em;margin:0 0 12px;
}
.entry p{margin:0;font-size:.94rem;color:var(--ink-2);line-height:1.55}

/* ---------- flow (Technology: carriers -> platform -> you) ------------ */
.flow{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:44px;align-items:stretch}
.flow-col{position:relative;border:1px solid var(--line-2);padding:28px 26px;background:var(--ground)}
.flow-core{border:2px solid var(--hot);background:var(--ground-2)}
.flow-col:not(:last-child)::after{
  content:"";position:absolute;top:50%;right:-34px;width:24px;height:2px;background:var(--hot);
}
.flow-h{
  font-family:var(--f-mono);font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--accent);margin:0 0 14px;
}
.flow ul{list-style:none;margin:0;padding:0}
.flow li{padding:9px 0;border-top:1px solid var(--line);font-size:.98rem;color:var(--ink)}
.flow li:first-child{border-top:none}
@media (max-width:860px){
  .flow{grid-template-columns:1fr;gap:34px}
  .flow-col:not(:last-child)::after{top:auto;bottom:-24px;right:auto;left:50%;width:2px;height:16px}
}

/* ---------- data readout --------------------------------------------- */
.readout{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}
@media (max-width:820px){.readout{grid-template-columns:1fr}}
.cell{background:var(--ground);padding:36px 30px}
.cell-n{
  font-family:var(--f-disp);font-weight:800;font-size:clamp(2.6rem,5vw,3.9rem);
  line-height:1;letter-spacing:-.04em;color:var(--hot);
  font-variant-numeric:tabular-nums;margin-bottom:12px;
}
.cell-k{
  font-family:var(--f-mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-3);margin:0 0 10px;
}
.cell p{margin:0;font-size:.93rem;color:var(--ink-2);line-height:1.55}

/* ---------- spec list (services) ------------------------------------- */
.spec{border-top:1px solid var(--line)}
.spec-row{
  display:grid;grid-template-columns:76px 1fr 1.35fr;gap:26px;align-items:baseline;
  padding:26px 0;border-bottom:1px solid var(--line);
  transition:padding-left .22s ease,background .22s ease;
}
.spec-row:hover{padding-left:14px;background:var(--ground-2)}
@media (max-width:760px){
  .spec-row{grid-template-columns:1fr;gap:8px;padding:22px 0}
}
.spec-n{font-family:var(--f-mono);font-size:.76rem;color:var(--accent);letter-spacing:.1em}
.spec-t{
  font-family:var(--f-disp);font-weight:700;text-transform:uppercase;
  font-size:1.5rem;letter-spacing:-.02em;line-height:1;margin:0;
}
.spec-d{margin:0;color:var(--ink-2);font-size:.97rem;line-height:1.55}

/* ---------- contrast block (us vs them) ------------------------------ */
.versus{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);margin-top:44px}
@media (max-width:760px){.versus{grid-template-columns:1fr}}
.vs-col{background:var(--ground);padding:34px 30px}
.vs-col.them{background:var(--ground-2)}
.vs-h{
  font-family:var(--f-mono);font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;
  margin:0 0 22px;padding-bottom:14px;border-bottom:1px solid var(--line);
}
.them .vs-h{color:var(--ink-3)}
.us .vs-h{color:var(--accent)}
.vs-list{list-style:none;margin:0;padding:0}
.vs-list li{
  padding:13px 0 13px 26px;position:relative;font-size:.96rem;line-height:1.5;
  border-bottom:1px solid var(--line);
}
.vs-list li:last-child{border-bottom:none}
.them .vs-list li{color:var(--ink-3)}
.us .vs-list li{color:var(--ink)}
.them .vs-list li::before{content:"\00d7";position:absolute;left:0;top:12px;color:var(--ink-3);font-size:1.1rem}
.us .vs-list li::before{content:"";position:absolute;left:1px;top:19px;width:11px;height:6px;
  border-left:2px solid var(--hot);border-bottom:2px solid var(--hot);transform:rotate(-45deg)}

/* ---------- closing CTA ---------------------------------------------- */
.close{text-align:center;position:relative;overflow:hidden}
.close::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(760px 400px at 50% 130%,rgba(243,101,35,.22),transparent 66%);
}
.close > .wrap{position:relative;z-index:1}
.close .lede{margin-inline:auto}
.close .hero-actions{justify-content:center}

/* ---------- footer ---------------------------------------------------- */
.foot{border-top:4px solid var(--brand-orange);padding:56px 0 0}
.foot-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr 1.1fr;gap:32px;padding-bottom:44px}
@media (max-width:1100px){.foot-grid{grid-template-columns:1.4fr 1fr 1fr}}
@media (max-width:760px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.foot-grid{grid-template-columns:1fr}}
.foot h4{
  font-family:var(--f-mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-3);margin:0 0 18px;font-weight:500;
}
.foot ul{list-style:none;margin:0;padding:0}
.foot li{margin-bottom:11px}
.foot a{color:var(--ink-2);text-decoration:none;font-size:.93rem}
.foot a:hover{color:var(--accent)}
.foot address{font-style:normal;color:var(--ink-2);font-size:.93rem;line-height:1.7}
.foot-bar{
  border-top:1px solid var(--line);padding:20px 0;display:flex;flex-wrap:wrap;
  gap:12px;justify-content:space-between;
  font-family:var(--f-mono);font-size:.7rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--ink-3);
}
.foot-bar a{color:var(--ink-3);font-size:.7rem}

@media print{
  .nav,.hero-actions{display:none}
  body{background:#fff;color:#000}
}

/* ==========================================================================
   Freight Edge - "SINCE 1989" : interior page components
   Appended to v2.css by build-site.js. Same tokens, same single-theme world.
   ========================================================================== */

/* ---------- interior page head --------------------------------------- */
.phead{
  padding:clamp(56px,7vw,104px) 0 clamp(40px,5vw,64px);
  border-top:none;position:relative;overflow:hidden;
}
.phead::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(880px 460px at 85% -12%,rgba(243,101,35,.18),transparent 62%);
}
.phead > .wrap{position:relative;z-index:1}
.crumb{
  font-family:var(--f-mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-3);margin:0 0 26px;
}
.crumb a{color:var(--ink-3);text-decoration:none}
.crumb a:hover{color:var(--accent)}
.crumb i{font-style:normal;color:var(--line-2);margin:0 10px}

/* ---------- products dropdown ----------------------------------------- */
.lg{position:relative}
.lg-btn{
  font-family:var(--f-mono);font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-2);background:transparent;border:none;padding:9px 11px;cursor:pointer;white-space:nowrap;
  display:inline-flex;align-items:center;gap:7px;transition:color .15s ease;
}
.lg-btn:hover,.lg[data-open="true"] .lg-btn{color:var(--accent)}
.lg-btn svg{width:9px;height:9px;transition:transform .2s ease}
.lg[data-open="true"] .lg-btn svg{transform:rotate(180deg)}
.lg-left .lg-menu{right:auto;left:0}
.lg-btn.on{color:var(--accent)}
.lg-menu{
  position:absolute;right:0;top:calc(100% + 12px);min-width:238px;
  background:var(--ground);border:1px solid var(--line-2);padding:6px;
  box-shadow:0 12px 32px rgba(14,36,51,.12);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .16s ease,transform .16s ease,visibility .16s;
}
.lg[data-open="true"] .lg-menu{opacity:1;visibility:visible;transform:none}
.lg-menu a{
  display:flex;align-items:center;gap:12px;padding:12px 13px;text-decoration:none;
  color:var(--ink);font-size:.9rem;border-bottom:1px solid var(--line);
}
.lg-menu a:last-child{border-bottom:none}
.lg-menu a:hover{background:var(--ground-2);color:var(--accent)}
.lg-menu small{display:block;color:var(--ink-3);font-size:.76rem;margin-top:2px}
@media (max-width:1100px){
  .lg{border-bottom:1px solid var(--line)}
  .lg-btn{width:100%;justify-content:space-between;padding:15px 0;font-size:.9rem}
  .lg-menu{
    position:static;opacity:1;visibility:visible;transform:none;border:none;
    background:transparent;padding:0 0 12px;min-width:0;box-shadow:none;
    max-height:0;overflow:hidden;transition:max-height .22s ease;
  }
  .lg[data-open="true"] .lg-menu{max-height:340px}
  .lg-menu a{border-bottom:none;padding:11px 0 11px 12px;border-left:1px solid var(--line)}
}

/* ---------- forms ------------------------------------------------------ */
.formwrap{border:1px solid var(--line);background:var(--ground-2);padding:clamp(24px,4vw,44px)}
fieldset{border:none;padding:0;margin:0 0 40px;min-width:0}
fieldset:last-of-type{margin-bottom:26px}
legend{
  font-family:var(--f-mono);font-size:.74rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--accent);padding:0 0 12px;margin-bottom:24px;width:100%;
  border-bottom:1px solid var(--line);
}
.fnote{font-size:.9rem;color:var(--ink-3);margin:-14px 0 24px;line-height:1.55}

.g2{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:20px}
.g2:last-child,.g3:last-child{margin-bottom:0}
@media (max-width:740px){.g2,.g3{grid-template-columns:1fr}}
.wide{grid-column:1/-1}

.f{display:flex;flex-direction:column;margin-bottom:20px}
.g2 > .f,.g3 > .f{margin-bottom:0}
.f > label,.glabel{
  font-family:var(--f-mono);font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-2);margin-bottom:9px;display:block;
}
.rq{color:var(--accent);margin-left:3px}
.help{font-size:.8rem;color:var(--ink-3);margin:7px 0 0;line-height:1.45}

input[type=text],input[type=email],input[type=tel],input[type=date],
input[type=time],select,textarea{
  width:100%;font-family:var(--f-body);font-size:.97rem;color:var(--ink);
  background:var(--ground);border:1px solid var(--line-2);
  padding:13px 14px;transition:border-color .15s ease,background .15s ease;
  appearance:none;-webkit-appearance:none;border-radius:0;
}
textarea{min-height:130px;resize:vertical;line-height:1.6}
input:hover,select:hover,textarea:hover{border-color:var(--ink-3)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);background:var(--ground-3)}
input::placeholder,textarea::placeholder{color:var(--ink-3)}
select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235f6f7c' stroke-width='2.4' stroke-linecap='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;background-size:15px;
  padding-right:40px;cursor:pointer;
}
select option{background:var(--ground-2);color:var(--ink)}
input[type=date],input[type=time]{cursor:pointer}
.f.bad input,.f.bad select,.f.bad textarea{border-color:var(--bad)}
.emsg{color:var(--bad);font-size:.8rem;margin-top:7px;display:none;font-family:var(--f-mono);letter-spacing:.05em}
.f.bad .emsg{display:block}

.opts{display:flex;flex-wrap:wrap;gap:8px;margin-top:3px}
.opt{
  display:inline-flex;align-items:center;gap:10px;cursor:pointer;user-select:none;
  border:1px solid var(--line-2);padding:11px 15px;font-size:.9rem;color:var(--ink-2);
  background:var(--ground);transition:all .15s ease;
}
.opt:hover{border-color:var(--ink-3);color:var(--ink)}
.opt input{
  appearance:none;-webkit-appearance:none;margin:0;flex:none;width:15px;height:15px;
  border:1px solid var(--ink-3);background:transparent;cursor:pointer;border-radius:0;
  transition:all .15s ease;
}
.opt input[type=radio]{border-radius:50%}
.opt input:checked{background:var(--accent);border-color:var(--accent)}
.opt input[type=checkbox]:checked{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-size:11px;background-position:center;background-repeat:no-repeat;
}
.opt input[type=radio]:checked{box-shadow:inset 0 0 0 3px var(--ground)}
.opt:has(input:checked){border-color:var(--accent);color:var(--ink)}

.factions{
  display:flex;flex-wrap:wrap;align-items:center;gap:18px;
  padding-top:26px;border-top:1px solid var(--line);
}
.factions .help{margin:0;flex:1;min-width:210px}
.factions .help a{color:var(--accent);text-decoration:none}

.fstatus{display:none;padding:18px 20px;margin-bottom:26px;border:1px solid var(--line-2);font-size:.94rem;line-height:1.55}
.fstatus.show{display:block}
.fstatus.ok{border-color:var(--accent);background:rgba(0,91,136,.06)}
.fstatus.bad{border-color:var(--bad);background:rgba(180,35,24,.06)}
.fstatus strong{
  display:block;font-family:var(--f-mono);font-size:.76rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--accent);margin-bottom:8px;
}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- tables ----------------------------------------------------- */
.tscroll{overflow-x:auto;border:1px solid var(--line);-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;font-size:.93rem;min-width:580px}
th,td{padding:16px 18px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
th{
  font-family:var(--f-mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-3);background:var(--ground-2);font-weight:500;white-space:nowrap;
}
td{color:var(--ink-2)}
td strong{color:var(--ink);font-weight:600}
tbody tr:last-child td{border-bottom:none}
tbody tr:hover{background:var(--ground-2)}
.sevtag{
  display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;
  font-family:var(--f-mono);font-size:.8rem;color:var(--fill-ink);background:var(--brand-orange);flex:none;
}
.sevtag.s2{background:var(--brand-blue);color:#fff}
.sevtag.s3{background:#5b7f96;color:#fff}
.sevtag.s4{background:var(--line-2);color:var(--ink)}

/* ---------- sold-as block -------------------------------------------- */
.soldas{border:1px solid var(--line);background:var(--ground-2);padding:28px 30px;margin-top:44px}
.soldas h3{
  font-family:var(--f-mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--accent);margin:0 0 18px;font-weight:500;
}
.soldas dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:12px 22px}
@media (max-width:600px){.soldas dl{grid-template-columns:1fr;gap:4px 0}}
.soldas dt{
  font-family:var(--f-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-3);white-space:nowrap;padding-top:2px;
}
.soldas dd{margin:0;color:var(--ink-2);font-size:.96rem;line-height:1.5}
.soldas dd + dt{border-top:1px solid var(--line);padding-top:14px}
.soldas dt + dd{}
.soldas dd.bt{border-top:1px solid var(--line);padding-top:14px}

/* ---------- callout ---------------------------------------------------- */
.callout{border-left:3px solid var(--hot);background:var(--ground-2);padding:20px 24px;margin:32px 0}
.callout p{margin:0;color:var(--ink-2);font-size:.96rem;line-height:1.6}
.callout strong{color:var(--ink)}
.callout a{color:var(--accent)}

/* ---------- tiles (contact / support) ---------------------------------- */
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}
@media (max-width:820px){.tiles{grid-template-columns:1fr}}
.tile{background:var(--ground);padding:32px 28px}
.tile h3{
  font-family:var(--f-mono);font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--ink-3);margin:0 0 14px;font-weight:500;
}
.tile .big{
  font-family:var(--f-disp);font-weight:700;font-size:1.34rem;letter-spacing:-.02em;
  color:var(--ink);text-decoration:none;display:block;line-height:1.2;
}
.tile a.big:hover{color:var(--accent)}
.tile p{margin:10px 0 0;font-size:.92rem;color:var(--ink-2);line-height:1.6}

/* ---------- two-column split ------------------------------------------- */
.split{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(32px,5vw,64px);align-items:start}
@media (max-width:880px){.split{grid-template-columns:1fr}}

/* ---------- bullet list ------------------------------------------------ */
.blist{list-style:none;padding:0;margin:26px 0 0}
.blist li{
  position:relative;padding:14px 0 14px 30px;border-bottom:1px solid var(--line);
  color:var(--ink-2);font-size:.97rem;line-height:1.55;
}
.blist li:last-child{border-bottom:none}
.blist li::before{
  content:"";position:absolute;left:2px;top:21px;width:11px;height:6px;
  border-left:2px solid var(--hot);border-bottom:2px solid var(--hot);transform:rotate(-45deg);
}
.blist strong{color:var(--ink)}
.blist a{color:var(--accent)}

/* ---------- prose (privacy) -------------------------------------------- */
.prose{max-width:74ch}
.prose h2{
  font-family:var(--f-disp);font-weight:700;text-transform:uppercase;
  font-size:1.36rem;letter-spacing:-.015em;margin:2.4em 0 .7em;color:var(--ink);
}
.prose h2:first-child{margin-top:0}
.prose h3{
  font-family:var(--f-mono);font-size:.78rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--accent);margin:2em 0 .7em;font-weight:500;
}
.prose p,.prose li{color:var(--ink-2);font-size:1rem;line-height:1.7}
.prose strong{color:var(--ink);font-weight:600}
.prose a{color:var(--accent)}
.prose ul{padding-left:1.1em}
.prose hr{border:none;border-top:1px solid var(--line);margin:2.6em 0}
.pmeta{
  font-family:var(--f-mono);font-size:.76rem;letter-spacing:.06em;color:var(--ink-3);
  border:1px solid var(--line);padding:18px 20px;margin-bottom:2.6em;line-height:1.9;
}
.pmeta b{color:var(--ink-2);font-weight:500}
.toc{border:1px solid var(--line);background:var(--ground-2);padding:24px 26px;margin-bottom:2.8em}
.toc h2{
  font-family:var(--f-mono)!important;font-size:.68rem!important;letter-spacing:.16em!important;
  color:var(--ink-3)!important;margin:0 0 14px!important;font-weight:500!important;
}
.toc ol{margin:0;padding-left:1.4em;columns:2;column-gap:34px}
.toc li{margin-bottom:8px;font-size:.9rem;break-inside:avoid;color:var(--ink-2)}
.toc a{color:var(--ink-2);text-decoration:none}
.toc a:hover{color:var(--accent)}
@media (max-width:640px){.toc ol{columns:1}}

/* ---------- back to top ------------------------------------------------ */
.totop{
  position:fixed;right:22px;bottom:22px;z-index:90;width:44px;height:44px;
  display:grid;place-items:center;background:var(--fill);color:var(--fill-ink);border:none;cursor:pointer;
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .2s ease,transform .2s ease,visibility .2s;
}
.totop.show{opacity:1;visibility:visible;transform:none}
.totop:hover{background:var(--fill-hover);color:var(--fill-hover-ink)}
.totop svg{width:18px;height:18px}
@media (max-width:640px){.totop{right:14px;bottom:14px}}
