/* ============================================================
   CARRIER PAGES — /carriers/{dot}-{slug}
   Generated by tools/carrier-pages/build_carriers.py.

   Ground rhythm (v3 §32): masthead + hero BONE -> calculator CARBON
   (worth.css .wv-carbon, unchanged) -> profile BONE -> footer CARBON.
   Signal budget: the calculator band carries the h2 phrase and the
   headline figure (two ranked marks). Bone bands carry none as text —
   Signal Moss only, for the active-tab rule.
   Small-type floor: 11px, .12em, Slate on Bone / Steel+ on Carbon.
   ============================================================ */

body.cx{background:var(--nv-bone);color:var(--nv-carbon);margin:0}
.cx *,.cx *::before,.cx *::after{box-sizing:border-box}
.cx .container{max-width:var(--nv-container,1280px);margin:0 auto;padding:0 32px}
@media(max-width:768px){ .cx .container{padding:0 16px} }

/* ---- masthead ---- */
.cx-mast{background:var(--nv-bone);border-bottom:1px solid var(--nv-fog)}
.cx-mast-in{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:68px}
.cx-logo{display:inline-flex;align-items:center}
.cx .btn.cx-btn{background:var(--nv-carbon);color:var(--nv-bone);border-color:var(--nv-carbon);
  min-height:40px;padding:0 18px}
.cx .btn.cx-btn:hover{background:var(--nv-slate);border-color:var(--nv-slate)}

/* ---- hero ---- */
.cx-hero{background:var(--nv-bone);padding:40px 0 0}
.cx-crumb{display:flex;flex-wrap:wrap;gap:8px;font-family:var(--nv-font-mono);font-size:.75rem;
  letter-spacing:.02em;color:var(--nv-slate);margin-bottom:36px}
.cx-crumb a{color:var(--nv-slate);text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:var(--nv-fog)}
.cx-crumb a:hover{color:var(--nv-carbon)}
.cx-k{font-family:var(--nv-font-mono);font-weight:500;font-size:.6875rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--nv-slate)}
.cx-hero h1{margin:14px 0 0;font-weight:600;font-size:3.5rem;line-height:1.08;
  letter-spacing:-.026em;color:var(--nv-carbon);max-width:20ch;text-wrap:balance}
.cx-sub{margin:18px 0 0;font-size:1.125rem;line-height:1.6;color:var(--nv-slate);max-width:62ch}

.cx-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:40px;
  border-top:1px solid var(--nv-fog);border-bottom:1px solid var(--nv-fog)}
.cx-fact{padding:18px 20px 18px 0;min-width:0}
.cx-fact + .cx-fact{padding-left:20px;border-left:1px solid var(--nv-fog)}
.cx-fact .l{font-family:var(--nv-font-mono);font-weight:500;font-size:.6875rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--nv-slate)}
.cx-fact .v{margin-top:8px;font-family:var(--nv-font-mono);font-weight:500;font-size:1.375rem;
  line-height:1.2;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--nv-carbon);
  overflow-wrap:anywhere}

/* ---- tabs: real links, sitting on the seam into the Carbon band ---- */
.cx-tabs{display:flex;gap:4px;margin-top:40px}
.cx-tab{font-family:var(--nv-font-mono);font-weight:500;font-size:.75rem;letter-spacing:.12em;
  text-transform:uppercase;text-decoration:none;color:var(--nv-slate);
  padding:14px 20px;border:1px solid transparent;border-bottom:0;
  border-radius:var(--nv-radius,4px) var(--nv-radius,4px) 0 0;min-height:44px;
  display:inline-flex;align-items:center}
.cx-tab:hover{color:var(--nv-carbon)}
.cx-tab[aria-current="page"]{background:var(--nv-carbon);color:var(--nv-bone);
  box-shadow:inset 0 2px 0 var(--nv-signal)}
.cx-tab:focus-visible{outline:2px solid var(--nv-carbon);outline-offset:2px}

/* the calculator band sits flush under the tabs */
.cx #whats-it-worth{border-top:0;padding-top:64px}

/* ---- calculator additions (worth.css itself is untouched) ---- */
.cx-reset{margin-top:22px;width:100%;min-height:40px;padding:0 14px;cursor:pointer;
  font-family:var(--nv-font-mono);font-weight:500;font-size:.6875rem;letter-spacing:.12em;
  text-transform:uppercase;background:transparent;color:var(--nv-fog);
  border:1px solid rgba(242,240,233,.18);border-radius:var(--nv-radius-sm,3px)}
.cx-reset:hover{color:var(--nv-bone);border-color:var(--nv-bone)}
.cx-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:4px}
.cx-more{font-size:.9375rem;color:var(--nv-fog);text-decoration:underline;text-underline-offset:4px;
  text-decoration-color:rgba(242,240,233,.3)}
.cx-more:hover{color:var(--nv-bone)}

/* ---- profile ---- */
.cx-profile{background:var(--nv-bone);padding:96px 0}
.cx-profile-in{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:24px 64px}
.cx-profile-head h2{margin:14px 0 0;font-weight:600;font-size:2.375rem;line-height:1.15;
  letter-spacing:-.02em;color:var(--nv-carbon)}
.cx-profile-head p{margin:14px 0 0;color:var(--nv-slate)}
.cx-dl{margin:0;border-top:1px solid var(--nv-carbon)}
.cx-row{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:24px;
  padding:14px 0;border-bottom:1px solid var(--nv-fog)}
.cx-row dt{font-family:var(--nv-font-mono);font-weight:500;font-size:.6875rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--nv-slate);padding-top:4px}
.cx-row dd{margin:0;font-size:1rem;line-height:1.55;color:var(--nv-carbon);overflow-wrap:anywhere}
.cx-row dd a{color:var(--nv-carbon);text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:var(--nv-steel)}
.cx-source{grid-column:2;margin:8px 0 0;font-size:.875rem;line-height:1.6;color:var(--nv-ash);max-width:70ch}
.cx-source a{color:var(--nv-slate);text-decoration:underline;text-underline-offset:3px}

/* ---- footer ---- */
.cx-foot{display:flex;flex-wrap:wrap;align-items:center;gap:16px 40px;padding:40px 0}
.cx-foot-links{display:flex;flex-wrap:wrap;gap:4px 24px}
.cx-foot-c{margin-left:auto;font-size:.8125rem;color:var(--nv-steel)}

/* ---- responsive ---- */
@media(max-width:1024px){
  .cx-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cx-fact:nth-child(3){padding-left:0;border-left:0}
  .cx-fact:nth-child(n+3){border-top:1px solid var(--nv-fog)}
  .cx-profile-in{grid-template-columns:1fr}
  .cx-source{grid-column:1}
}
@media(max-width:768px){
  .cx-hero{padding-top:24px}
  .cx-crumb{margin-bottom:24px}
  .cx-hero h1{font-size:2.25rem}
  .cx-sub{font-size:1rem}
  .cx-fact .v{font-size:1.125rem}
  .cx-tabs{margin-top:28px}
  .cx-tab{padding:12px 14px}
  .cx-profile{padding:64px 0}
  .cx-profile-head h2{font-size:1.75rem}
  .cx-row{grid-template-columns:1fr;gap:4px}
  .cx-foot-c{margin-left:0}
  .cx .btn.cx-btn{padding:0 14px}
}

/* ---- /carriers/ directory ---- */
.cx-dir{padding:40px 0 96px;background:var(--nv-bone)}
.cx-dir h1{margin:14px 0 0;font-weight:600;font-size:3.5rem;line-height:1.08;letter-spacing:-.026em}
.cx-jump{display:flex;flex-wrap:wrap;gap:6px;margin:36px 0 12px;padding:16px 0;
  border-top:1px solid var(--nv-fog);border-bottom:1px solid var(--nv-fog)}
.cx-jump a{font-family:var(--nv-font-mono);font-weight:500;font-size:.75rem;letter-spacing:.06em;
  color:var(--nv-carbon);text-decoration:none;padding:6px 8px;border:1px solid var(--nv-fog);
  border-radius:var(--nv-radius-sm,3px);min-width:40px;text-align:center}
.cx-jump a:hover{border-color:var(--nv-carbon)}
.cx-st{padding-top:40px;scroll-margin-top:16px}
.cx-st h2{font-weight:600;font-size:1.5rem;letter-spacing:-.012em;margin:0 0 12px;
  padding-bottom:10px;border-bottom:1px solid var(--nv-carbon)}
.cx-st h2 span{font-family:var(--nv-font-mono);font-weight:500;font-size:.75rem;letter-spacing:.06em;
  color:var(--nv-slate);margin-left:8px}
.cx-st ul{list-style:none;margin:0;padding:0;columns:3 300px;column-gap:40px}
.cx-st li{break-inside:avoid;padding:8px 0;border-bottom:1px solid var(--nv-mist,#E4E1D8);font-size:.9375rem}
.cx-st li a{color:var(--nv-carbon);text-decoration:none;font-weight:500}
.cx-st li a:hover{text-decoration:underline;text-underline-offset:3px}
.cx-st li span{display:block;font-family:var(--nv-font-mono);font-size:.75rem;letter-spacing:.02em;
  color:var(--nv-slate);margin-top:2px}
@media(max-width:768px){ .cx-dir{padding:24px 0 64px} .cx-dir h1{font-size:2.25rem} }

/* ---- first screen: carrier + estimate + the form (2026-09-29) ----------------
   Approved from the Miller Transporters mockup. The form sits beside the
   number so a reader who arrives from an email sees where to answer without
   scrolling. On a phone: name and number, then the form, then the facts. */
.cx-mast{position:sticky;top:0;z-index:50}
.cx-hero2{padding:24px 0 0}
.cx-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:0 48px;align-items:start;
  grid-template-areas:"intro form" "rest form";grid-template-rows:auto 1fr}
.cx-intro{grid-area:intro}.cx-rest{grid-area:rest}.cx-form{grid-area:form}
/* nivio-v3 gives every <a> a 44px touch target; in a breadcrumb that is what
   opened the gap above the name. */
.cx-hero2 .cx-crumb{margin:0}
.cx-hero2 .cx-crumb a,.cx-basis a{min-height:0 !important;display:inline}
.cx-hero2 h1{margin:10px 0 0;font-size:3.25rem;line-height:1.04;letter-spacing:-.03em}
.cx-est{margin:14px 0 0;font-size:1.75rem;line-height:1.25;font-weight:600;letter-spacing:-.02em;
  color:var(--nv-carbon);max-width:24ch}
.cx-num{color:var(--nv-signal-moss,#41630F);white-space:nowrap}
.cx-basis{margin:14px 0 0;font-size:1rem;line-height:1.55;color:var(--nv-slate)}
.cx-basis a{color:var(--nv-signal-moss,#41630F);text-underline-offset:3px;margin-left:6px}
.cx-rest .cx-facts{margin-top:28px}
.cx-note{margin:18px 0 0;font-size:.875rem;line-height:1.55;color:var(--nv-ash,#5F6461);max-width:58ch}
.cx-hero2 .cx-tabs{margin-top:36px}
@media(max-width:1320px){
  .cx-rest .cx-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cx-rest .cx-fact:nth-child(3){padding-left:0;border-left:0}
  .cx-rest .cx-fact:nth-child(n+3){border-top:1px solid var(--nv-fog)}
}
@media(max-width:1000px){
  .cx-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"intro" "form" "rest";
    grid-template-rows:auto;gap:22px}
  .cx-hero2 h1{font-size:2.25rem}
  .cx-est{font-size:1.375rem}
}
@media(max-width:640px){ .cx .btn.cx-btn{white-space:nowrap;font-size:.6875rem;padding:0 14px} }

/* ---- how Nivio gets there (2026-09-29) --------------------------------------
   Last block of the first section, above the tabs (which must stay on the seam
   into the Carbon calculator band): the number says how much, this says how. */
.cx-how{padding:44px 0 4px;margin-top:40px;border-top:1px solid var(--nv-fog)}
.cx-how-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:18px}
.cx-how-item{border-top:2px solid var(--nv-signal-moss,#41630F);padding-top:16px}
.cx-how-item h3{margin:0;font-size:1.25rem;line-height:1.3;font-weight:600;letter-spacing:-.012em;color:var(--nv-carbon)}
.cx-how-item p{margin:10px 0 0;font-size:.9375rem;line-height:1.6;color:var(--nv-slate)}
.cx-how-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;
  margin-top:32px;padding-top:20px;border-top:1px solid var(--nv-fog)}
.cx-proof{margin:0;font-size:.9375rem;color:var(--nv-slate)}
.cx-proof b{color:var(--nv-carbon);font-weight:600}
.cx-how-link{font-family:var(--nv-font-mono);font-weight:500;font-size:.75rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--nv-signal-moss,#41630F);text-decoration:underline;text-underline-offset:4px;
  min-height:0 !important}
@media(max-width:900px){ .cx-how-grid{grid-template-columns:minmax(0,1fr);gap:24px} .cx-how{padding:32px 0 0;margin-top:28px} }
/* narrow phones: keep the lockup and the header button on one line inside the gutter */
@media(max-width:480px){
  .cx-mast-in{gap:10px}
  .cx .btn.cx-btn{padding:8px 12px;letter-spacing:.08em;white-space:normal;text-align:center;
    line-height:1.3;max-width:190px;min-height:40px;height:auto}
}

/* ---- one-line summary under the H1 (built from the carrier's own record) ---- */
.cx-lede{margin:14px 0 0;font-size:1.0625rem;line-height:1.55;color:var(--nv-slate);max-width:62ch}

/* ---- questions (also emitted as FAQPage JSON-LD) ---- */
.cx-faq{background:var(--nv-bone);padding:64px 0 24px;border-top:1px solid var(--nv-fog)}
.cx-faq-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:18px}
.cx-faq-q h3{margin:0 0 8px;font-weight:600;font-size:1.0625rem;line-height:1.35;color:var(--nv-carbon)}
.cx-faq-q p{margin:0;font-size:.9375rem;line-height:1.6;color:var(--nv-slate)}

/* ---- nearest fleets in the same state ---- */
.cx-related{background:var(--nv-bone);padding:40px 0 72px}
.cx-rel-list{list-style:none;margin:16px 0 20px;padding:0;display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));gap:0 32px}
.cx-rel-list li{padding:10px 0;border-bottom:1px solid var(--nv-mist,#E4E1D8);min-width:0}
.cx-rel-list a{color:var(--nv-carbon);text-decoration:none;font-weight:500}
.cx-rel-list a:hover{text-decoration:underline;text-underline-offset:3px}
.cx-rel-list span{display:block;font-family:var(--nv-font-mono);font-size:.75rem;letter-spacing:.02em;
  color:var(--nv-slate);margin-top:2px}
.cx-st h2 a{color:inherit;text-decoration:none}
.cx-st h2 a:hover{text-decoration:underline;text-underline-offset:4px}
@media(max-width:900px){ .cx-faq-grid,.cx-rel-list{grid-template-columns:1fr} }
