/* ==========================================================================
   Lagos FTZ — Shipping Manifest theme
   --------------------------------------------------------------------------
   Visual language:  Industrial cargo dispatch / mailroom counter manifest.
   Type pairing:     Barlow Condensed (display) + DM Sans (body) + IBM Plex Mono (data)
   Colors:           Putty + cargo orange + waybill ink + safety yellow.
   Class prefix:     lftz-* (lagos-ftz)
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;500;600;700&family=DM+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600;700&display=swap');

:root {
  --lftz-putty: #e8e2d6;
  --lftz-putty-deep: #d8d0bf;
  --lftz-putty-pale: #f1ede3;
  --lftz-paper: #fbf8f1;
  --lftz-ink: #1c2a3a;
  --lftz-ink-soft: #262f3d;
  --lftz-ink-fade: #5b5d61;
  --lftz-rule: #8a7f6f;
  --lftz-rule-soft: #b8aa92;
  --lftz-orange: #d94a16;
  --lftz-orange-deep: #b53a0d;
  --lftz-orange-bright: #ed5a23;
  --lftz-yellow: #f4c526;
  --lftz-yellow-soft: #fde58a;
  --lftz-green: #2a7a4a;
  --lftz-shadow: 0 18px 30px -22px rgba(28, 42, 58, 0.45);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { overflow-x: clip; max-width: 100vw; }
html { scroll-behavior: smooth; }

body {
  background: var(--lftz-putty);
  color: var(--lftz-ink);
  font-family: 'DM Sans', system-ui, -apple-system, sans-serif;
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Subtle waybill grain overlay — every page reads as printed paper */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image:
    linear-gradient(180deg, rgba(28,42,58,0.03) 0 1px, transparent 1px 28px),
    linear-gradient(90deg, rgba(28,42,58,0.025) 0 1px, transparent 1px 28px);
  background-size: 28px 28px;
  pointer-events: none;
  z-index: 0;
}
body > * { position: relative; z-index: 1; }

a { color: var(--lftz-ink); text-decoration: underline; text-decoration-color: var(--lftz-orange); text-underline-offset: 3px; }
a:hover { color: var(--lftz-orange); }

/* ==========================================================================
   Type — display, body, mono
   ========================================================================== */

.lftz-display {
  font-family: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 0.96;
  text-transform: uppercase;
}

.lftz-mono {
  font-family: 'IBM Plex Mono', 'Courier New', monospace;
  font-weight: 500;
  letter-spacing: 0.04em;
}

.lftz-eyebrow {
  font-family: 'IBM Plex Mono', 'Courier New', monospace;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--lftz-ink);
}

/* ==========================================================================
   Layout — outer page chrome
   ========================================================================== */

.lftz-page { min-height: 100vh; display: flex; flex-direction: column; }

.lftz-shell {
  width: min(1280px, 100% - 64px);
  margin: 0 auto;
}

@media (max-width: 760px) {
  .lftz-shell { width: calc(100% - 32px); }
}

/* ==========================================================================
   Header / nav — sticky waybill bar
   ========================================================================== */

.lftz-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--lftz-putty);
  border-bottom: 2px solid var(--lftz-ink);
}
.lftz-header__strip {
  background: var(--lftz-ink);
  color: var(--lftz-yellow);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  padding: 6px 0;
}
.lftz-header__strip-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
}
.lftz-header__strip-row span { white-space: nowrap; }
.lftz-header__strip-row span:nth-child(2) { color: var(--lftz-paper); opacity: 0.85; }

.lftz-header__main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 18px 0;
}
.lftz-brand {
  display: flex;
  align-items: center;
  gap: 14px;
  text-decoration: none;
  color: var(--lftz-ink);
}
.lftz-brand img,
.lftz-brand svg { width: 56px; height: 56px; }
.lftz-brand__words {
  display: flex;
  flex-direction: column;
  gap: 2px;
  line-height: 1;
}
.lftz-brand__name {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 26px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.lftz-brand__tag {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--lftz-ink-fade);
}

.lftz-nav { display: flex; gap: 24px; align-items: center; }
.lftz-nav a {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--lftz-ink);
  position: relative;
  padding: 4px 0;
}
.lftz-nav a:hover { color: var(--lftz-orange); }
.lftz-nav a[data-current="1"]::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -2px;
  height: 3px;
  background: var(--lftz-orange);
}

/* Mobile hamburger drawer */
.lftz-burger {
  display: none;
  width: 40px;
  height: 40px;
  background: transparent;
  border: 2px solid var(--lftz-ink);
  cursor: pointer;
  padding: 0;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.lftz-burger-toggle { display: none; }
.lftz-burger-bars {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  width: 18px;
  height: 14px;
  pointer-events: none;
}
.lftz-burger-bars span {
  display: block;
  width: 100%;
  height: 2px;
  background: var(--lftz-ink);
  transition: transform 0.24s ease, opacity 0.24s ease;
}
.lftz-drawer-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(28, 42, 58, 0.6);
  z-index: 90;
}
.lftz-drawer {
  position: fixed;
  top: 0;
  right: -100%;
  width: 320px;
  height: 100vh;
  height: 100dvh;
  background: var(--lftz-paper);
  border-left: 4px solid var(--lftz-orange);
  box-shadow: -16px 0 40px -8px rgba(28, 42, 58, 0.35);
  padding: 32px 28px;
  transition: right 0.28s ease;
  z-index: 100;
  overflow-y: auto;
}
.lftz-drawer__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 24px;
  padding-bottom: 18px;
  border-bottom: 1.5px dashed var(--lftz-rule-soft);
}
.lftz-drawer__head .lftz-eyebrow { font-size: 10px; }
.lftz-drawer__close-btn {
  width: 32px; height: 32px;
  border: 2px solid var(--lftz-ink);
  background: transparent;
  cursor: pointer;
  position: relative;
}
.lftz-drawer__close-btn::before,
.lftz-drawer__close-btn::after {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  width: 16px; height: 2px;
  background: var(--lftz-ink);
}
.lftz-drawer__close-btn::before { transform: translate(-50%, -50%) rotate(45deg); }
.lftz-drawer__close-btn::after { transform: translate(-50%, -50%) rotate(-45deg); }

.lftz-drawer__nav {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.lftz-drawer__nav a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 0;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--lftz-ink);
  border-bottom: 1px solid var(--lftz-rule-soft);
}
.lftz-drawer__nav a::after {
  content: '→';
  font-family: 'IBM Plex Mono', monospace;
  color: var(--lftz-orange);
  opacity: 0;
  transition: opacity 0.2s ease;
}
.lftz-drawer__nav a:hover { color: var(--lftz-orange); }
.lftz-drawer__nav a:hover::after { opacity: 1; }
.lftz-drawer__cta {
  display: block;
  margin-top: 26px;
  padding: 14px;
  background: var(--lftz-ink);
  color: var(--lftz-yellow);
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
}

.lftz-burger-toggle:checked ~ .lftz-drawer { right: 0; }
.lftz-burger-toggle:checked ~ .lftz-drawer-backdrop { display: block; }
.lftz-burger-toggle:checked ~ .lftz-header .lftz-burger-bars span:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}
.lftz-burger-toggle:checked ~ .lftz-header .lftz-burger-bars span:nth-child(2) { opacity: 0; }
.lftz-burger-toggle:checked ~ .lftz-header .lftz-burger-bars span:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}
body:has(.lftz-burger-toggle:checked) { overflow: hidden; }

/* ==========================================================================
   Main grid — 8/4 (main + sticky sidebar)
   ========================================================================== */

.lftz-detail {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 56px;
  padding: 36px 0 88px;
}
.lftz-main { min-width: 0; }
.lftz-aside {
  align-self: start;
}

/* ==========================================================================
   Manifest hero — Section 01
   ========================================================================== */

.lftz-manifest {
  background: var(--lftz-paper);
  border: 3px solid var(--lftz-ink);
  position: relative;
  margin-bottom: 36px;
}
.lftz-manifest::before,
.lftz-manifest::after,
.lftz-manifest > .lftz-corner-tl,
.lftz-manifest > .lftz-corner-tr,
.lftz-manifest > .lftz-corner-bl,
.lftz-manifest > .lftz-corner-br {
  content: '';
  position: absolute;
  width: 14px;
  height: 14px;
  border: 2px solid var(--lftz-ink);
  background: var(--lftz-yellow);
}
/* corner brackets — manifest "stapled corner" effect */
.lftz-manifest > .lftz-corner-tl { top: -8px; left: -8px; }
.lftz-manifest > .lftz-corner-tr { top: -8px; right: -8px; }
.lftz-manifest > .lftz-corner-bl { bottom: -8px; left: -8px; }
.lftz-manifest > .lftz-corner-br { bottom: -8px; right: -8px; }
/* hide the ::before/::after defaults — corner divs are explicit */
.lftz-manifest::before, .lftz-manifest::after { display: none; }

.lftz-manifest__bar {
  background: var(--lftz-ink);
  color: var(--lftz-yellow);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  padding: 8px 28px;
  display: flex;
  justify-content: space-between;
  gap: 24px;
}
.lftz-manifest__bar span:nth-child(2) { color: var(--lftz-orange-bright); }
.lftz-manifest__bar span:nth-child(3) { color: var(--lftz-paper); opacity: 0.8; }

.lftz-manifest__body {
  padding: 32px 36px 36px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 36px;
  align-items: start;
}

.lftz-manifest__sender { display: flex; flex-direction: column; gap: 10px; }
.lftz-manifest__sender .lftz-eyebrow { color: var(--lftz-ink-fade); }

.lftz-manifest__name {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(40px, 6vw, 76px);
  font-weight: 700;
  line-height: 0.95;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  color: var(--lftz-ink);
}

.lftz-manifest__zip {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  margin-top: 6px;
  padding: 6px 12px;
  background: var(--lftz-yellow);
  border: 2px solid var(--lftz-ink);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.12em;
  width: fit-content;
}
.lftz-manifest__zip strong { font-weight: 700; }

.lftz-manifest__addr {
  font-size: 15px;
  color: var(--lftz-ink-soft);
  line-height: 1.45;
  max-width: 56ch;
  margin-top: 4px;
}

.lftz-manifest__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 14px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--lftz-ink-fade);
}
.lftz-manifest__meta strong { color: var(--lftz-ink); font-weight: 600; }

.lftz-manifest__cta {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 240px;
}
.lftz-btn {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 18px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none;
  border: 2.5px solid var(--lftz-ink);
  background: var(--lftz-paper);
  color: var(--lftz-ink);
  cursor: pointer;
  transition: background 0.18s ease, color 0.18s ease;
}
.lftz-btn::after { content: '→'; font-family: 'IBM Plex Mono', monospace; font-weight: 600; }
.lftz-btn:hover { background: var(--lftz-yellow); }
.lftz-btn--orange { background: var(--lftz-orange); color: #fff; border-color: var(--lftz-orange-deep); }
.lftz-btn--orange:hover { background: var(--lftz-orange-deep); color: var(--lftz-yellow); }
.lftz-btn--ink { background: var(--lftz-ink); color: var(--lftz-paper); border-color: var(--lftz-ink); }
.lftz-btn--ink:hover { background: var(--lftz-orange); border-color: var(--lftz-orange-deep); color: #fff; }

/* Brand badge above name */
.lftz-brand-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 10px;
  background: var(--lftz-ink);
  color: var(--lftz-yellow);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  width: fit-content;
}
.lftz-brand-badge[data-brand="independent"] {
  background: var(--lftz-paper);
  color: var(--lftz-ink);
  border: 1.5px solid var(--lftz-ink);
}
.lftz-brand-badge[data-brand="independent"]::before { content: '◇ '; color: var(--lftz-orange); }

/* ==========================================================================
   Photo bay — Section 02
   ========================================================================== */

.lftz-photobay {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 12px;
  margin-bottom: 36px;
}
.lftz-photobay__cell {
  position: relative;
  border: 2px solid var(--lftz-ink);
  background: var(--lftz-putty-pale);
  overflow: hidden;
  aspect-ratio: 4/3;
}
.lftz-photobay__cell--lead { grid-row: span 2; aspect-ratio: 5/6; }
.lftz-photobay__cell img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.lftz-photobay__cell::after {
  content: attr(data-tag);
  position: absolute;
  top: 8px; left: 8px;
  background: var(--lftz-yellow);
  color: var(--lftz-ink);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.14em;
  padding: 3px 8px;
  text-transform: uppercase;
}

/* Adaptive photo-count variants for lagos-ftz */
.lftz-photobay--single { grid-template-columns: minmax(0, 1fr); }
.lftz-photobay--single .lftz-photobay__cell { aspect-ratio: 16/9; }
.lftz-photobay--pair { grid-template-columns: 1fr 1fr; }
.lftz-photobay--pair .lftz-photobay__cell { aspect-ratio: 4/3; }
.lftz-photobay--trio { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lftz-photobay--trio .lftz-photobay__cell { aspect-ratio: 4/3; }

.lftz-photobay--empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  background: var(--lftz-putty-pale);
  border: 2px solid var(--lftz-rule-soft);
  padding: 56px 32px;
  margin-bottom: 36px;
  text-align: center;
}
.lftz-photobay--empty svg { opacity: 0.55; }
.lftz-photobay__empty-eyebrow {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--lftz-orange-deep);
  font-weight: 600;
}
.lftz-photobay__empty-copy {
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--lftz-ink-soft);
  max-width: 52ch;
  margin: 0;
}

/* ==========================================================================
   Section primitives — head, body, prose
   ========================================================================== */

.lftz-section {
  background: var(--lftz-paper);
  border: 2px solid var(--lftz-ink);
  margin-bottom: 36px;
  position: relative;
}
.lftz-section__head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  padding: 14px 28px;
  border-bottom: 2px solid var(--lftz-ink);
  background: var(--lftz-putty-deep);
}
.lftz-section__num {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.16em;
  background: var(--lftz-ink);
  color: var(--lftz-yellow);
  padding: 4px 10px;
}
.lftz-section__title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.lftz-section__sub {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--lftz-ink-fade);
  justify-self: end;
}
.lftz-section__body { padding: 28px 32px; }
.lftz-section__body p { font-size: 16px; color: var(--lftz-ink-soft); margin-bottom: 14px; line-height: 1.6; }
.lftz-section__body p:last-child { margin-bottom: 0; }
.lftz-section__body p strong { color: var(--lftz-ink); }
.lftz-section__body a { color: var(--lftz-orange-deep); }

/* Limited-record callout */
.lftz-limited {
  background: var(--lftz-yellow-soft);
  border: 2px dashed var(--lftz-orange-deep);
  padding: 18px 24px;
  margin-bottom: 36px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 18px;
  align-items: center;
}
.lftz-limited::before {
  content: 'TIER C';
  font-family: 'IBM Plex Mono', monospace;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.2em;
  background: var(--lftz-ink);
  color: var(--lftz-yellow);
  padding: 8px 12px;
  white-space: nowrap;
}
.lftz-limited p {
  font-size: 14px;
  color: var(--lftz-ink-soft);
  margin: 0;
}

/* ==========================================================================
   Capability stamp grid — Section 04
   ========================================================================== */

.lftz-stamps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  padding: 28px 32px;
}
.lftz-stamp {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  padding: 16px;
  background: var(--lftz-putty-pale);
  border: 1.5px solid var(--lftz-rule);
  position: relative;
}
.lftz-stamp[data-detected="1"] {
  background: var(--lftz-paper);
  border-color: var(--lftz-ink);
  border-width: 2px;
}
.lftz-stamp[data-detected="1"]::after {
  content: '✓';
  position: absolute;
  top: 8px;
  right: 8px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--lftz-orange);
  color: #fff;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.lftz-stamp__icon {
  width: 56px; height: 56px;
  border: 2px solid var(--lftz-ink);
  background: var(--lftz-paper);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: var(--lftz-ink);
  text-transform: uppercase;
}
.lftz-stamp[data-detected="0"] .lftz-stamp__icon {
  color: var(--lftz-rule);
  background: transparent;
  border-color: var(--lftz-rule);
  border-style: dashed;
}
.lftz-stamp__body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.lftz-stamp__title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 17px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  line-height: 1.05;
}
.lftz-stamp[data-detected="0"] .lftz-stamp__title { color: var(--lftz-ink-fade); }
.lftz-stamp__src {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--lftz-ink-fade);
}
.lftz-stamp__desc {
  font-size: 13px;
  line-height: 1.45;
  color: var(--lftz-ink-soft);
  margin-top: 4px;
}
.lftz-stamp[data-detected="0"] .lftz-stamp__desc { color: var(--lftz-ink-fade); }

/* ==========================================================================
   Carrier strip — Section 05
   ========================================================================== */

.lftz-carriers {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  padding: 28px 32px;
}
.lftz-carrier {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  aspect-ratio: 5/3;
  border: 2.5px solid var(--lftz-ink);
  background: var(--lftz-paper);
  font-family: 'Barlow Condensed', sans-serif;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.lftz-carrier__name {
  font-size: 22px;
  font-weight: 700;
}
.lftz-carrier__status {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.18em;
  color: var(--lftz-orange-deep);
}
.lftz-carrier[data-on="0"] {
  background: var(--lftz-putty-pale);
  border-color: var(--lftz-rule);
  border-style: dashed;
  color: var(--lftz-ink-fade);
}
.lftz-carrier[data-on="0"] .lftz-carrier__status { color: var(--lftz-ink-fade); }

/* Brand-specific tints when on (tasteful, not trying to mimic real logos) */
.lftz-carrier[data-on="1"][data-name="UPS"] { background: #4b2e0f; color: #fbe8a3; }
.lftz-carrier[data-on="1"][data-name="UPS"] .lftz-carrier__status { color: var(--lftz-yellow); }
.lftz-carrier[data-on="1"][data-name="FedEx"] { background: #4d1e6a; color: #ffe6f0; }
.lftz-carrier[data-on="1"][data-name="FedEx"] .lftz-carrier__status { color: #f7a3c8; }
.lftz-carrier[data-on="1"][data-name="USPS"] { background: #1a3464; color: #ffe2c8; }
.lftz-carrier[data-on="1"][data-name="USPS"] .lftz-carrier__status { color: #ffb27a; }
.lftz-carrier[data-on="1"][data-name="DHL"] { background: var(--lftz-yellow); color: var(--lftz-ink); border-color: var(--lftz-ink); }
.lftz-carrier[data-on="1"][data-name="DHL"] .lftz-carrier__status { color: var(--lftz-orange-deep); }
.lftz-carrier[data-on="1"][data-name="Amazon"] { background: var(--lftz-ink); color: var(--lftz-orange-bright); }
.lftz-carrier[data-on="1"][data-name="Amazon"] .lftz-carrier__status { color: var(--lftz-yellow); }

/* ==========================================================================
   Map — Section 06
   ========================================================================== */

.lftz-pickup { padding: 28px 32px; display: grid; grid-template-columns: 7fr 5fr; gap: 24px; align-items: stretch; }
.lftz-map {
  border: 2.5px solid var(--lftz-ink);
  background: var(--lftz-putty-pale);
  position: relative;
  min-height: 320px;
  overflow: hidden;
}
.lftz-map iframe { display: block; width: 100%; height: 100%; min-height: 320px; border: 0; }
.lftz-map__tag {
  position: absolute;
  top: 12px; left: 12px;
  background: var(--lftz-yellow);
  color: var(--lftz-ink);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.16em;
  padding: 4px 10px;
  text-transform: uppercase;
  border: 1.5px solid var(--lftz-ink);
}
.lftz-pickup__card {
  background: var(--lftz-paper);
  border: 2px solid var(--lftz-ink);
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.lftz-pickup__card dt {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--lftz-ink-fade);
  margin-bottom: 4px;
}
.lftz-pickup__card dd { font-size: 15px; color: var(--lftz-ink); margin-bottom: 12px; line-height: 1.5; }
.lftz-pickup__card dd:last-child { margin-bottom: 0; }
.lftz-pickup__card a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--lftz-orange-deep);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: var(--lftz-orange);
}

/* ==========================================================================
   Evidence ledger — Section 07 (officialSiteEvidence quotes)
   ========================================================================== */

.lftz-ledger { padding: 28px 32px; display: flex; flex-direction: column; gap: 14px; }
.lftz-ledger__row {
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr);
  gap: 18px;
  padding: 16px 18px;
  background: var(--lftz-putty-pale);
  border-left: 4px solid var(--lftz-orange);
  border-top: 1px solid var(--lftz-rule-soft);
  border-right: 1px solid var(--lftz-rule-soft);
  border-bottom: 1px solid var(--lftz-rule-soft);
}
.lftz-ledger__no {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: var(--lftz-ink-fade);
  border-right: 1px dashed var(--lftz-rule-soft);
  padding-right: 12px;
}
.lftz-ledger__quote {
  font-size: 15px;
  line-height: 1.5;
  color: var(--lftz-ink);
  font-style: italic;
}
.lftz-ledger__src {
  display: inline-block;
  margin-top: 6px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--lftz-ink-fade);
  font-style: normal;
}

/* ==========================================================================
   Source attribution table — Section 08
   ========================================================================== */

.lftz-attribution { padding: 28px 32px; }
.lftz-attribution table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.lftz-attribution thead th {
  text-align: left;
  padding: 10px 14px;
  background: var(--lftz-ink);
  color: var(--lftz-yellow);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.lftz-attribution tbody td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--lftz-rule-soft);
  vertical-align: top;
  color: var(--lftz-ink-soft);
}
.lftz-attribution tbody tr:nth-child(odd) td { background: var(--lftz-putty-pale); }
.lftz-attribution tbody td:first-child {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--lftz-ink);
}
.lftz-attribution__src {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.lftz-attribution__src[data-conf="high"] { color: var(--lftz-green); }
.lftz-attribution__src[data-conf="medium"] { color: var(--lftz-orange-deep); }
.lftz-attribution__src[data-conf="low"], .lftz-attribution__src[data-conf=""] { color: var(--lftz-ink-fade); }

/* ==========================================================================
   Coverage tags — Section 09
   ========================================================================== */

.lftz-coverage { padding: 28px 32px; display: flex; flex-wrap: wrap; gap: 8px; }
.lftz-coverage__tag {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.06em;
  padding: 6px 12px;
  background: var(--lftz-paper);
  border: 1.5px solid var(--lftz-ink);
}

/* ==========================================================================
   Routing decision — Section 10 (3-column comparison)
   ========================================================================== */

.lftz-routing { padding: 28px 32px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.lftz-routing__lane {
  border: 2px solid var(--lftz-ink);
  background: var(--lftz-paper);
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.lftz-routing__lane-no {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.18em;
  color: var(--lftz-orange-deep);
  font-weight: 600;
}
.lftz-routing__lane-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 22px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1;
}
.lftz-routing__lane-best {
  font-size: 13px;
  color: var(--lftz-ink-soft);
  border-bottom: 1px dashed var(--lftz-rule-soft);
  padding-bottom: 10px;
}
.lftz-routing__lane-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.lftz-routing__lane-list li {
  font-size: 14px;
  color: var(--lftz-ink-soft);
  padding-left: 18px;
  position: relative;
  line-height: 1.45;
}
.lftz-routing__lane-list li::before {
  content: '→';
  font-family: 'IBM Plex Mono', monospace;
  font-weight: 700;
  color: var(--lftz-orange);
  position: absolute;
  left: 0;
  top: 0;
}

/* ==========================================================================
   State rules paragraph — Section 11
   ========================================================================== */

.lftz-stateblock { padding: 28px 32px; }
.lftz-stateblock h3 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 19px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--lftz-ink);
  margin-bottom: 8px;
  padding-left: 14px;
  border-left: 4px solid var(--lftz-orange);
}
.lftz-stateblock p { font-size: 15px; line-height: 1.6; color: var(--lftz-ink-soft); margin-bottom: 16px; }

/* ==========================================================================
   DIY spectrum — Section 12 (4 colored rows)
   ========================================================================== */

.lftz-diy { padding: 28px 32px; display: flex; flex-direction: column; gap: 8px; }
.lftz-diy__row {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  padding: 12px 18px;
  border-left: 6px solid var(--lftz-rule-soft);
  background: var(--lftz-putty-pale);
}
.lftz-diy__row[data-tier="diy"] { border-left-color: var(--lftz-green); }
.lftz-diy__row[data-tier="sometimes"] { border-left-color: var(--lftz-yellow); }
.lftz-diy__row[data-tier="counter"] { border-left-color: var(--lftz-orange); }
.lftz-diy__row[data-tier="counter-only"] { border-left-color: var(--lftz-ink); background: var(--lftz-paper); }
.lftz-diy__label {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 17px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--lftz-ink);
}
.lftz-diy__copy { font-size: 14px; color: var(--lftz-ink-soft); line-height: 1.5; }

/* ==========================================================================
   FAQ — Section 13 (<details> collapsibles)
   ========================================================================== */

.lftz-faq { padding: 14px 32px 28px; }
.lftz-faq details {
  border-bottom: 1.5px solid var(--lftz-rule-soft);
  padding: 14px 0;
}
.lftz-faq summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 19px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--lftz-ink);
}
.lftz-faq summary::-webkit-details-marker { display: none; }
.lftz-faq summary::after {
  content: '+';
  font-family: 'IBM Plex Mono', monospace;
  font-size: 24px;
  color: var(--lftz-orange);
  width: 28px;
  text-align: center;
}
.lftz-faq details[open] summary::after { content: '−'; }
.lftz-faq details > p {
  margin-top: 10px;
  font-size: 15px;
  color: var(--lftz-ink-soft);
  line-height: 1.6;
}

/* ==========================================================================
   Other shipping centers — Section 14 (2x2 nearby)
   ========================================================================== */

.lftz-nearby { padding: 28px 32px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.lftz-nearby__card {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 14px;
  padding: 14px;
  background: var(--lftz-putty-pale);
  border: 2px solid var(--lftz-ink);
  text-decoration: none;
  color: var(--lftz-ink);
  transition: transform 0.16s ease;
}
.lftz-nearby__card:hover { transform: translate(-2px, -2px); box-shadow: 4px 4px 0 0 var(--lftz-orange); }
.lftz-nearby__thumb {
  aspect-ratio: 1 / 1;
  border: 1.5px solid var(--lftz-ink);
  background-size: cover;
  background-position: center;
  background-color: var(--lftz-putty);
}
.lftz-nearby__name {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 18px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.05;
}
.lftz-nearby__meta {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.1em;
  color: var(--lftz-ink-fade);
  margin-top: 6px;
  text-transform: uppercase;
}

/* ==========================================================================
   Sidebar (4/12) — sticky aside
   ========================================================================== */

.lftz-aside-stack { display: flex; flex-direction: column; gap: 24px; position: sticky; top: 100px; }
.lftz-card {
  background: var(--lftz-paper);
  border: 2px solid var(--lftz-ink);
  padding: 22px 22px 22px;
  position: relative;
}
.lftz-card__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding-bottom: 12px;
  margin-bottom: 14px;
  border-bottom: 1.5px dashed var(--lftz-rule-soft);
}
.lftz-card__title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 18px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.lftz-card__tag {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--lftz-ink-fade);
}

.lftz-card__row {
  display: grid;
  grid-template-columns: 100px minmax(0, 1fr);
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px dashed var(--lftz-rule-soft);
  font-size: 14px;
}
.lftz-card__row:last-child { border-bottom: 0; }
.lftz-card__row dt {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--lftz-ink-fade);
  align-self: center;
}
.lftz-card__row dd { color: var(--lftz-ink); line-height: 1.45; word-break: break-word; }
.lftz-card__row dd a { color: var(--lftz-orange-deep); }

.lftz-card__hours {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 8px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  letter-spacing: 0.04em;
  padding: 6px 0;
  border-bottom: 1px dashed var(--lftz-rule-soft);
  text-transform: uppercase;
}
.lftz-card__hours:last-child { border-bottom: 0; }
.lftz-card__hours strong { color: var(--lftz-ink); font-weight: 600; }
.lftz-card__hours span { color: var(--lftz-ink-soft); }

.lftz-card__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.lftz-card__list li {
  position: relative;
  padding-left: 22px;
  font-size: 14px;
  line-height: 1.45;
  color: var(--lftz-ink-soft);
}
.lftz-card__list li::before {
  content: counter(item);
  counter-increment: item;
  position: absolute;
  left: 0; top: 0;
  width: 16px; height: 16px;
  background: var(--lftz-ink);
  color: var(--lftz-yellow);
  border-radius: 50%;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
}
.lftz-card__list { counter-reset: item; }

.lftz-card--ink {
  background: var(--lftz-ink);
  color: var(--lftz-paper);
  border-color: var(--lftz-ink);
}
.lftz-card--ink .lftz-card__title { color: var(--lftz-yellow); }
.lftz-card--ink .lftz-card__tag { color: var(--lftz-paper); opacity: 0.7; }
.lftz-card--ink .lftz-card__head { border-bottom-color: rgba(255,255,255,0.18); }
.lftz-card--ink .lftz-card__row { border-bottom-color: rgba(255,255,255,0.16); }
.lftz-card--ink .lftz-card__row dt { color: var(--lftz-yellow); }
.lftz-card--ink .lftz-card__row dd { color: var(--lftz-paper); }
.lftz-card--ink .lftz-card__row dd a { color: var(--lftz-orange-bright); }
.lftz-card--ink .lftz-card__list li { color: var(--lftz-paper); }
.lftz-card--ink .lftz-card__list li::before { background: var(--lftz-yellow); color: var(--lftz-ink); }

/* Sidebar blog story card */
.lftz-card__cover {
  margin: -22px -22px 14px;
  height: 160px;
  background-size: cover;
  background-position: center;
  border-bottom: 2px solid var(--lftz-ink);
}
.lftz-card__cover-empty {
  margin: -22px -22px 14px;
  height: 100px;
  background: var(--lftz-putty-deep);
  border-bottom: 2px solid var(--lftz-ink);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--lftz-ink-fade);
}

/* ==========================================================================
   Footer (state grid + service grid + copyright)
   ========================================================================== */

.lftz-footer {
  background: var(--lftz-ink);
  color: var(--lftz-paper);
  margin-top: 64px;
  padding: 64px 0 32px;
}
.lftz-footer h3 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--lftz-yellow);
  margin-bottom: 16px;
}
.lftz-footer__grid {
  display: grid;
  grid-template-columns: 2fr 1.2fr 1fr;
  gap: 56px;
  align-items: start;
}
.lftz-footer__states {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px 18px;
}
.lftz-footer__states a {
  font-size: 13px;
  color: var(--lftz-paper);
  text-decoration: none;
  padding: 4px 0;
  font-family: 'DM Sans', sans-serif;
}
.lftz-footer__states a:hover { color: var(--lftz-orange-bright); }

.lftz-footer__services { list-style: none; padding: 0; }
.lftz-footer__services li { margin-bottom: 6px; }
.lftz-footer__services a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--lftz-paper);
  text-decoration: none;
}
.lftz-footer__services a::before {
  content: '◇';
  color: var(--lftz-orange-bright);
}
.lftz-footer__services a:hover { color: var(--lftz-yellow); }

.lftz-footer__about p {
  font-size: 14px;
  color: var(--lftz-paper);
  opacity: 0.75;
  line-height: 1.6;
  margin-bottom: 12px;
}
.lftz-footer__about a { color: var(--lftz-orange-bright); }

.lftz-footer__bottom {
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,0.18);
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--lftz-paper);
  opacity: 0.7;
}
.lftz-footer__bottom a { color: var(--lftz-paper); text-decoration: underline; text-decoration-color: var(--lftz-orange); }

/* ==========================================================================
   Listing / destinations / city pages
   ========================================================================== */

.lftz-listing-hero {
  padding: 48px 0 36px;
  border-bottom: 2px solid var(--lftz-ink);
}
.lftz-listing-hero h1 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(40px, 6vw, 76px);
  font-weight: 700;
  line-height: 0.95;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  margin: 14px 0 12px;
}
.lftz-listing-hero p {
  font-size: 16px;
  max-width: 70ch;
  color: var(--lftz-ink-soft);
  line-height: 1.55;
}
.lftz-listing-hero__strip {
  margin-top: 22px;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.lftz-listing-hero__strip span {
  background: var(--lftz-ink);
  color: var(--lftz-yellow);
  padding: 6px 12px;
}
.lftz-listing-hero__strip span:nth-child(2n) { background: var(--lftz-yellow); color: var(--lftz-ink); }
.lftz-listing-hero__strip span:nth-child(3n) { background: var(--lftz-orange); color: #fff; }

.lftz-listing { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 36px; padding: 36px 0 88px; }
.lftz-filter-rail { position: sticky; top: 100px; align-self: start; }
.lftz-filter-rail__group { margin-bottom: 24px; }
.lftz-filter-rail__group summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--lftz-ink);
  padding: 8px 0;
  border-bottom: 1.5px solid var(--lftz-ink);
  margin-bottom: 12px;
}
.lftz-filter-rail__group summary::-webkit-details-marker { display: none; }
.lftz-filter-rail__group summary::after { content: '+'; font-family: 'IBM Plex Mono', monospace; color: var(--lftz-orange); }
.lftz-filter-rail__group[open] summary::after { content: '−'; }

.lftz-filter-rail__list { display: flex; flex-direction: column; gap: 6px; max-height: 280px; overflow-y: auto; padding-right: 4px; }
.lftz-filter-rail__list a {
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  text-decoration: none;
  color: var(--lftz-ink-soft);
  padding: 4px 0;
  display: flex;
  justify-content: space-between;
}
.lftz-filter-rail__list a:hover { color: var(--lftz-orange); }
.lftz-filter-rail__list a[data-on="1"] {
  font-weight: 600;
  color: var(--lftz-orange-deep);
  border-left: 3px solid var(--lftz-orange);
  padding-left: 8px;
  margin-left: -8px;
}
.lftz-filter-rail__list a span {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  color: var(--lftz-ink-fade);
}

.lftz-results { display: flex; flex-direction: column; gap: 14px; }
.lftz-results__head {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  align-items: baseline;
  margin-bottom: 8px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--lftz-ink);
}
.lftz-results__head h2 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 28px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.lftz-results__head .lftz-mono { color: var(--lftz-ink-fade); font-size: 12px; }

.lftz-result-card {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr) auto;
  gap: 22px;
  padding: 18px;
  background: var(--lftz-paper);
  border: 2px solid var(--lftz-ink);
  text-decoration: none;
  color: var(--lftz-ink);
  transition: box-shadow 0.16s ease, transform 0.16s ease;
}
.lftz-result-card:hover {
  transform: translate(-2px, -2px);
  box-shadow: 4px 4px 0 0 var(--lftz-orange);
}
.lftz-result-card__thumb {
  aspect-ratio: 5/4;
  background-color: var(--lftz-putty);
  border: 1.5px solid var(--lftz-ink);
  overflow: hidden;
}
.lftz-result-card__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.lftz-result-card__thumb-placeholder {
  object-fit: contain !important;
  background: var(--lftz-ink);
}
.lftz-result-card__body { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.lftz-result-card__name {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 22px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.05;
}
.lftz-result-card__loc {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--lftz-ink-fade);
}
.lftz-result-card__caps {
  font-size: 13px;
  color: var(--lftz-ink-soft);
  line-height: 1.4;
}
.lftz-result-card__chips { display: flex; flex-wrap: wrap; gap: 4px; margin-top: auto; padding-top: 6px; }
.lftz-result-card__chips span {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: var(--lftz-putty-pale);
  border: 1px solid var(--lftz-rule);
  padding: 3px 7px;
}
.lftz-result-card__action {
  align-self: center;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--lftz-orange-deep);
  white-space: nowrap;
}

.lftz-result-card[data-thin="1"] {
  background: var(--lftz-putty-pale);
  border-style: dashed;
}

.lftz-pagination {
  margin-top: 28px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.lftz-pagination a, .lftz-pagination span {
  padding: 8px 14px;
  border: 2px solid var(--lftz-ink);
  text-decoration: none;
  color: var(--lftz-ink);
}
.lftz-pagination a:hover { background: var(--lftz-yellow); }
.lftz-pagination span { background: var(--lftz-ink); color: var(--lftz-yellow); }

/* ==========================================================================
   Home page
   ========================================================================== */

.lftz-home-hero {
  padding: 64px 0 56px;
  border-bottom: 2px solid var(--lftz-ink);
  background:
    radial-gradient(ellipse at top right, rgba(244, 197, 38, 0.18), transparent 60%),
    radial-gradient(ellipse at bottom left, rgba(217, 74, 22, 0.12), transparent 50%);
}
.lftz-home-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  gap: 56px;
  align-items: stretch;
}
.lftz-home-hero h1 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(56px, 9vw, 120px);
  font-weight: 700;
  line-height: 0.92;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  margin: 18px 0 22px;
}
.lftz-home-hero h1 em {
  font-style: italic;
  color: var(--lftz-orange-deep);
  font-family: 'Barlow Condensed', sans-serif;
}
.lftz-home-hero p {
  font-size: 17px;
  max-width: 56ch;
  color: var(--lftz-ink-soft);
  line-height: 1.6;
  margin-bottom: 20px;
}
.lftz-home-hero__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.lftz-home-hero__board {
  background: var(--lftz-paper);
  border: 2.5px solid var(--lftz-ink);
  padding: 24px;
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 100%;
}
.lftz-home-hero__board::before {
  content: '';
  position: absolute;
  inset: 8px;
  border: 1px dashed var(--lftz-rule);
  pointer-events: none;
}
.lftz-home-hero__board h3 {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--lftz-ink-fade);
  margin-bottom: 16px;
}
.lftz-home-hero__board ul { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 0; flex: 1; }
.lftz-home-hero__board li {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  gap: 12px;
  padding: 14px 0;
  border-bottom: 1px dashed var(--lftz-rule-soft);
  font-size: 14px;
  align-items: center;
  flex: 1;
}
.lftz-home-hero__board li:last-child { border-bottom: 0; }
.lftz-home-hero__board li strong {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 16px;
  color: var(--lftz-orange-deep);
  font-weight: 700;
}
.lftz-home-hero__board li span:nth-child(2) {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.lftz-home-hero__board li span:nth-child(3) {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  color: var(--lftz-ink-fade);
}

.lftz-home-strip { padding: 36px 0; border-bottom: 2px solid var(--lftz-ink); background: var(--lftz-paper); }
.lftz-home-strip__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
.lftz-home-strip__cell { display: flex; flex-direction: column; gap: 4px; }
.lftz-home-strip__cell strong {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 56px;
  font-weight: 700;
  line-height: 0.95;
  color: var(--lftz-orange-deep);
  letter-spacing: 0.02em;
}
.lftz-home-strip__cell span {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--lftz-ink-fade);
}

.lftz-section-block { padding: 64px 0; border-bottom: 2px solid var(--lftz-ink); }
.lftz-section-block__head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 32px;
}
.lftz-section-block__head h2 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(32px, 4.5vw, 48px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1;
}
.lftz-section-block__head a {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--lftz-orange-deep);
}

.lftz-state-board { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.lftz-state-board a {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  text-decoration: none;
  color: var(--lftz-ink);
  padding: 10px 14px;
  background: var(--lftz-paper);
  border: 1.5px solid var(--lftz-ink);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.lftz-state-board a:hover { background: var(--lftz-yellow); }
.lftz-state-board a span {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  color: var(--lftz-ink-fade);
  font-weight: 500;
}

.lftz-service-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.lftz-service-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 22px;
  background: var(--lftz-paper);
  border: 2px solid var(--lftz-ink);
  text-decoration: none;
  color: var(--lftz-ink);
  position: relative;
}
.lftz-service-card::before {
  content: attr(data-no);
  position: absolute;
  top: -2px;
  right: 16px;
  background: var(--lftz-ink);
  color: var(--lftz-yellow);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.16em;
  padding: 4px 10px;
}
.lftz-service-card:hover { background: var(--lftz-yellow); }
.lftz-service-card h3 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 21px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  margin-top: 18px;
}
.lftz-service-card p { font-size: 14px; color: var(--lftz-ink-soft); line-height: 1.5; }

/* Static page (about / contact / 404 / policy) shells */
.lftz-static {
  padding: 56px 0 88px;
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 2fr);
  gap: 56px;
  align-items: start;
}
.lftz-static__sidebar {
  position: sticky; top: 100px;
  align-self: start;
  border: 2px solid var(--lftz-ink);
  background: var(--lftz-paper);
  padding: 22px;
}
.lftz-static__sidebar dt {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.16em;
  color: var(--lftz-ink-fade);
  text-transform: uppercase;
  margin-top: 12px;
}
.lftz-static__sidebar dt:first-child { margin-top: 0; }
.lftz-static__sidebar dd { font-size: 14px; color: var(--lftz-ink); line-height: 1.5; margin-top: 4px; }
.lftz-static__main h1 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(40px, 6vw, 72px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 0.95;
  margin-bottom: 24px;
}
.lftz-static__main h2 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 24px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin: 32px 0 12px;
  padding-bottom: 6px;
  border-bottom: 1.5px solid var(--lftz-ink);
}
.lftz-static__main p { font-size: 16px; line-height: 1.65; color: var(--lftz-ink-soft); margin-bottom: 14px; }

/* Blog list / detail */
.lftz-blog-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.lftz-blog-card {
  display: flex;
  flex-direction: column;
  background: var(--lftz-paper);
  border: 2px solid var(--lftz-ink);
  text-decoration: none;
  color: var(--lftz-ink);
  transition: transform 0.16s ease;
}
.lftz-blog-card:hover { transform: translate(-2px, -2px); box-shadow: 4px 4px 0 0 var(--lftz-orange); }
.lftz-blog-card__cover { aspect-ratio: 16/9; background-size: cover; background-position: center; background-color: var(--lftz-putty-deep); }
.lftz-blog-card__body { padding: 18px 20px 22px; }
.lftz-blog-card__cat {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.16em;
  color: var(--lftz-orange-deep);
  text-transform: uppercase;
}
.lftz-blog-card h3 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 22px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  margin: 8px 0 10px;
  line-height: 1.05;
}
.lftz-blog-card p { font-size: 13px; color: var(--lftz-ink-soft); line-height: 1.5; }

.lftz-blog-detail { padding: 56px 0 88px; display: grid; grid-template-columns: minmax(0, 2fr) 320px; gap: 48px; align-items: start; }
.lftz-blog-detail h1 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(40px, 6vw, 64px);
  font-weight: 700;
  line-height: 0.95;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  margin-bottom: 24px;
}
.lftz-blog-detail__cover { aspect-ratio: 16/8; background-size: cover; background-position: center; border: 2px solid var(--lftz-ink); margin-bottom: 32px; }
.lftz-blog-detail__body p { font-size: 17px; line-height: 1.65; color: var(--lftz-ink-soft); margin-bottom: 16px; }
.lftz-blog-detail__body h2 { font-family: 'Barlow Condensed', sans-serif; font-size: 28px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin: 32px 0 14px; }
.lftz-blog-detail__body h3 { font-family: 'Barlow Condensed', sans-serif; font-size: 22px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin: 24px 0 10px; }
.lftz-blog-detail__body ul, .lftz-blog-detail__body ol { padding-left: 24px; margin-bottom: 16px; }
.lftz-blog-detail__body li { font-size: 16px; line-height: 1.6; color: var(--lftz-ink-soft); margin-bottom: 6px; }

/* ==========================================================================
   404
   ========================================================================== */

.lftz-404 {
  padding: 88px 0;
  text-align: center;
}
.lftz-404 .lftz-eyebrow { color: var(--lftz-orange-deep); }
.lftz-404 h1 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(72px, 14vw, 180px);
  font-weight: 700;
  line-height: 0.9;
  letter-spacing: 0.02em;
  margin: 20px 0;
}
.lftz-404 h1 strong { color: var(--lftz-orange); }
.lftz-404 p { font-size: 17px; max-width: 56ch; margin: 0 auto 24px; color: var(--lftz-ink-soft); }

/* ==========================================================================
   Mobile responsive
   ========================================================================== */

@media (max-width: 1080px) {
  .lftz-detail { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .lftz-aside-stack { position: static; }
  .lftz-listing { grid-template-columns: minmax(0, 1fr); }
  .lftz-filter-rail { position: static; }
  .lftz-filter-rail__list { max-height: none; }
  .lftz-stamps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lftz-routing { grid-template-columns: minmax(0, 1fr); }
  .lftz-pickup { grid-template-columns: minmax(0, 1fr); }
  .lftz-home-hero__grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .lftz-state-board { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .lftz-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lftz-blog-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lftz-blog-detail { grid-template-columns: minmax(0, 1fr); }
  .lftz-static { grid-template-columns: minmax(0, 1fr); }
  .lftz-static__sidebar { position: static; }
  .lftz-footer__grid { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .lftz-photobay { grid-template-columns: 2fr 1fr; }
  .lftz-photobay__cell--lead { grid-row: auto; aspect-ratio: 16/9; grid-column: span 2; }
  .lftz-nearby { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 760px) {
  .lftz-shell { width: calc(100% - 32px); }
  .lftz-nav { display: none; }
  .lftz-burger { display: flex; }
  .lftz-header__strip { font-size: 9px; letter-spacing: 0.16em; }
  .lftz-header__strip-row span:nth-child(2) { display: none; }
  .lftz-manifest__body { grid-template-columns: minmax(0, 1fr); padding: 24px 22px 28px; }
  .lftz-manifest__cta { min-width: 0; }
  .lftz-manifest__name { font-size: clamp(34px, 9vw, 52px); }
  .lftz-photobay { grid-template-columns: minmax(0, 1fr); }
  .lftz-photobay__cell--lead { aspect-ratio: 4/3; grid-column: auto; }
  .lftz-section__head { grid-template-columns: minmax(0, 1fr); padding: 12px 18px; }
  .lftz-section__sub { justify-self: start; }
  .lftz-section__body, .lftz-stamps, .lftz-carriers, .lftz-pickup, .lftz-ledger, .lftz-attribution, .lftz-coverage, .lftz-routing, .lftz-stateblock, .lftz-diy, .lftz-faq, .lftz-nearby { padding: 22px 18px; }
  .lftz-stamps { grid-template-columns: minmax(0, 1fr); }
  .lftz-carriers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lftz-attribution { overflow-x: auto; }
  .lftz-attribution table { min-width: 480px; }
  .lftz-diy__row { grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 10px 14px; }
  .lftz-state-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lftz-service-grid { grid-template-columns: minmax(0, 1fr); }
  .lftz-blog-list { grid-template-columns: minmax(0, 1fr); }
  .lftz-result-card { grid-template-columns: 100px minmax(0, 1fr); }
  .lftz-result-card__action { display: none; }
  .lftz-home-strip__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
  .lftz-home-strip__cell strong { font-size: 38px; }
  .lftz-home-hero h1 { font-size: clamp(40px, 12vw, 64px); }
  .lftz-listing-hero h1 { font-size: clamp(34px, 10vw, 52px); }
  .lftz-section-block__head h2 { font-size: 28px; }
  .lftz-footer { padding: 48px 0 24px; }
  .lftz-footer__states { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lftz-blog-detail__body p { font-size: 16px; }
}

/* Print: utility — keeps manifest hero readable on paper */
@media print {
  body::before { display: none; }
  .lftz-header, .lftz-footer, .lftz-aside, .lftz-burger, .lftz-drawer, .lftz-drawer-backdrop { display: none !important; }
  .lftz-detail { grid-template-columns: minmax(0, 1fr); }
}