/* CGL's existing identity, with a quieter layout and a single shipment story. */
:root {
  --sc-canvas: #fffaf2; --sc-surface: #faf4e8; --sc-ink: #2b0f2b;
  --sc-ink-soft: #6b5b6b; --sc-accent: #e89a5e; --sc-accent-ink: #2b0f2b;
  --sc-font-display: "Fraunces", Georgia, serif;
  --sc-font-text: "Manrope", sans-serif;
  --sc-track-tight: 0; --sc-track-snug: 0; --sc-track-normal: 0;
  --sc-track-wide: 0; --sc-t-base: 16px;
}
body { line-height: 1.6; }
* { letter-spacing: 0 !important; }
[hidden] { display: none !important; }
section[id], .shipment-chapter { scroll-margin-top: 100px; }
h1, h2, h3 { text-wrap: balance; }
p { text-wrap: pretty; }
.container { width: min(1280px, calc(100% - 96px)); }
.section { padding: 96px 0; }
.section-paper { background: #fffaf6; }
.section-stone { background: #f3f1ed; }
.section-dark, .footer, .topbar { background: var(--aubergine); }
.section-dark::before, .footer::before, .section-stone::before { display: none; }
.section-head { align-items: end; grid-template-columns: 1.2fr 1fr; }
.section-head h2, .split h2, #network-title { font-size: 44px; line-height: 1.14; }
h2 em { color: var(--teal); font-weight: inherit; }
.section-dark h2 em { color: var(--apricot-2); }
.section-head p, .lead, .split p { font-size: 16px; line-height: 1.8; }
.section-head > p { max-width: 46ch; }
.site-header { background: #fffaf6; }
.nav, .site-header.scrolled .nav { height: 88px; transition: none; }
.nav-links { gap: 24px; }
.brand-logo { width: 130px; }
.brand-since { border: none; border-left: 1px solid var(--line); border-radius: 0; padding: 0 0 0 16px; font-size: 11px; }
.brand-since::before { display: none; }
.btn, .icon-btn { transition: transform 160ms ease-out, background 160ms ease-out, color 160ms ease-out; }
.btn::before, .btn::after { display: none; }
.btn-primary { background: var(--apricot); color: var(--plum); box-shadow: none; }
.btn-primary:hover { background: #f2b584; box-shadow: none; }
.btn-secondary { background: var(--aubergine); color: #fffaf6; border-color: var(--aubergine); }
.btn-secondary:hover { background: var(--plum); color: #fffaf6; }
:is(button, a, input, select, textarea):focus-visible { outline: 3px solid var(--teal); outline-offset: 5px; }
.section-dark :focus-visible, .shipment-section :focus-visible, .hero :focus-visible { outline-color: var(--apricot-2); }
button:active, .btn:active { transform: translateY(1px); }
button:disabled { cursor: wait; }

/* Hero: a scroll-craft scrub act. On desktop and tablet the stage pins and the
   clip of the same vessel advances under the visitor's scroll; the poster is the
   clip's first frame, so the hand-over is invisible. Phones, reduced motion and
   no-JS get the still photograph in a normal-height hero. */
.hero { overflow: visible; height: auto; min-height: 0; display: block; isolation: isolate; background: #143b4b; animation: none; }
.hero::before, .hero::after { display: none; }
.hero-stage { overflow: hidden; display: flex; align-items: center; }
.hero:not(.sc-act--pinned) .hero-stage { position: relative; height: min(760px, calc(100svh - 158px)); min-height: 540px; }
.hero.sc-act--pinned .hero-stage { height: 100svh; align-items: flex-start; }
.hero-stage picture { display: contents; }
.hero-photo, .hero-clip { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% 55%; }
.hero:not(.sc-act--pinned) .hero-photo { object-position: 64% 53%; }
.plane-scrim { position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, rgba(32,16,34,.97), rgba(32,16,34,.84) 24%, rgba(32,16,34,.32) 48%, transparent 72%); }
.hero-inner { position: relative; z-index: 2; padding: 45px 0 65px; }
.hero.sc-act--pinned .hero-inner { padding-top: clamp(150px, 24svh, 230px); }
.hero-copy { width: 550px; max-width: 100%; }
.hero h1 { font-size: 82px; line-height: 1.02; text-wrap: nowrap; }
.hero h1 em::after { display: none; }
.hero p.hero-kicker { font-size: 12px; font-weight: 600; margin: 0 0 24px; color: #fff4e8; }
.hero p.hero-promise { margin: 27px 0 0; width: auto; font-size: 21px; line-height: 1.5; color: #fffaf6; }
.hero-actions { gap: 14px; margin-top: 30px; }
.hero .btn-ghost { background: transparent; border-color: rgba(255,250,246,.6); box-shadow: none; }
.hero .btn-ghost:hover { background: var(--aubergine); }

/* Real facts only, restored from the original site. */
.proof-band { background: var(--aubergine); color: #fffaf6; border-top: 1px solid rgba(242,181,132,.3); }
.proof-grid { list-style: none; margin: 0 auto; padding: 24px 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.proof-grid li { display: flex; flex-direction: column; gap: 3px; padding: 2px 28px; border-left: 1px solid rgba(255,250,246,.16); }
.proof-grid li:first-child { border-left: 0; padding-left: 0; }
.proof-grid strong { font: 400 30px/1.15 "Fraunces", serif; color: var(--apricot-2); font-variant-numeric: lining-nums; }
.proof-grid span { font-size: 13px; line-height: 1.5; color: #eadbe5; }
/* Two-by-two on tablets and phones. */
@media (max-width: 900px) {
  .proof-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 18px; padding: 22px 0; }
  .proof-grid li { padding: 2px 18px; }
  .proof-grid li:nth-child(3) { border-left: 0; padding-left: 0; }
  .proof-grid strong { font-size: 25px; }
}

.care-section .split { grid-template-columns: 1.25fr .75fr; gap: 70px; }
.care-section h2 { margin-bottom: 22px; }
.care-grid { grid-template-columns: 1fr; gap: 0; margin-top: 26px; }
.care-card { display: grid; grid-template-columns: 44px 1fr; column-gap: 18px; padding: 16px 0; background: transparent; border: 0; border-top: 1px solid var(--line); border-radius: 0; box-shadow: none; }
.care-card h3 { font-family: "Manrope", sans-serif; font-size: 16px; font-weight: 700; margin: 0 0 4px; }
.care-card p { grid-column: 2; font-size: 13px; line-height: 1.65; }
.care-card .chip-icon { grid-row: span 2; }
.chip-icon { color: var(--teal-dark); background: #e1efeb; border: none; box-shadow: none; }
.chip-icon svg { width: 24px; height: 24px; }
.care-card::before, .service-card::before, .industry-card::before, .standard-card::before, .route-card::before { display: none; }
.care-section .image-frame { margin: 0; height: 570px; box-shadow: none; border-radius: 0; }
.care-section .image-frame img { object-position: 64% center; height: 100%; }
.image-frame figcaption { border-radius: 0; backdrop-filter: none; background: rgba(43,15,43,.93); }

/* Native sticky sequence; the copy remains normal, selectable document flow. */
.shipment-section { background: var(--aubergine); color: #fffaf6; }
.shipment-heading { max-width: 760px; margin-bottom: 55px; }
.shipment-heading .eyebrow { color: var(--apricot-2); text-transform: none; }
.shipment-heading h2 { font-family: "Fraunces", serif; font-size: 56px; font-weight: 400; line-height: 1.13; margin: 0; }
.shipment-heading em { color: var(--apricot-2); }
.shipment-story { display: grid; grid-template-columns: 1.1fr .9fr; gap: 80px; align-items: start; }
.shipment-visual { position: sticky; top: 122px; }
.shipment-photos { position: relative; aspect-ratio: 1.23; max-height: calc(100svh - 260px); overflow: hidden; background: #1f4445; }
.shipment-photos img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.035); transition: opacity 450ms ease-out, transform 900ms ease-out; }
.shipment-photos img.is-current { opacity: 1; transform: scale(1); }
.shipment-track { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); padding-top: 30px; gap: 12px; }
.shipment-track a { display: flex; flex-direction: column; gap: 10px; align-items: center; color: #ddcbd9; font-size: 12px; padding-top: 6px; }
.shipment-track a svg { width: 40px; height: 40px; padding: 9px; border: 1px solid #8d7489; border-radius: 50%; background: var(--aubergine); z-index: 1; transition: background 180ms ease-out, color 180ms ease-out; }
.shipment-track a[aria-current] { color: var(--apricot-2); }
.shipment-track a[aria-current] svg { background: var(--apricot); color: var(--plum); border-color: var(--apricot); }
.shipment-thread { position: absolute; top: 55px; left: 12%; right: 12%; height: 1px; background: #8d7489; }
.shipment-thread span { display: block; width: 100%; height: 2px; background: var(--apricot-2); transform: scaleX(var(--shipment-progress, 0)); transform-origin: left; }
.shipment-chapter { min-height: 60svh; display: flex; flex-direction: column; justify-content: center; padding: 45px 0; }
.shipment-chapter:last-child { padding-bottom: 0; }
.stage-label { color: var(--apricot-2); font-size: 12px; margin-bottom: 18px; }
.shipment-chapter h3 { margin: 0 0 22px; font: 400 39px/1.18 "Fraunces", serif; }
.shipment-chapter p { font-size: 16px; line-height: 1.8; color: #e7d9e2; margin: 0; }
.shipment-chapter ul { padding-left: 18px; font-size: 13px; line-height: 2; color: #f4e7ef; margin-top: 24px; }
.shipment-chapter li::marker { color: var(--apricot); }
.shipment-chapter .btn { align-self: start; margin-top: 24px; }
.chapter-photo { display: none; }

/* An index instead of a wall of identical floating cards. */
.service-tools { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin: 36px 0 25px; }
.service-tools p { color: var(--plum-soft); font-size: 12px; white-space: nowrap; }
.service-filters { display: flex; gap: 4px; flex-wrap: wrap; border-bottom: 1px solid #b9afba; }
.service-filters button { border: 0; background: transparent; padding: 12px 18px; min-height: 48px; font-size: 13px; color: #614f61; border-bottom: 2px solid transparent; }
.service-filters button[aria-pressed="true"] { color: var(--plum); border-color: var(--teal); font-weight: 700; }
.service-filters button:hover { background: #e5e9e5; }
.service-filters span { margin-left: 5px; font-size: 10px; }
.service-index { display: grid; grid-template-columns: minmax(0, 1.22fr) minmax(0, .92fr); gap: 56px; align-items: start; }
.service-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid #cfc6cf; }
.service-row { border-bottom: 1px solid #cfc6cf; }
.service-open { width: 100%; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto 26px; align-items: center; gap: 18px; padding: 17px 10px 17px 6px; border: 0; border-radius: 0; background: transparent; color: var(--plum); font: inherit; text-align: left; cursor: pointer; transition: background 160ms ease-out; }
.service-thumb { display: none; }
.service-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; color: var(--teal-dark); background: #e1ebe8; transition: background 160ms ease-out, color 160ms ease-out; }
.service-icon svg { width: 20px; height: 20px; }
.service-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.service-name { font: 600 17px/1.35 "Manrope", sans-serif; color: var(--plum); }
.service-desc { font-size: 13px; line-height: 1.55; color: #5c4c5c; }
.service-cat { font-size: 11px; font-weight: 600; color: #6b5b6b; white-space: nowrap; }
.service-go { display: grid; place-items: center; color: var(--teal-dark); opacity: .45; transition: transform 160ms ease-out, opacity 160ms ease-out; }
.service-go svg { width: 18px; height: 18px; }
@media (hover: hover) and (pointer: fine) { .service-open:hover { background: #ebe7e0; } }
.service-row.is-active .service-open { background: #e8e3da; }
.service-row.is-active .service-icon { background: var(--teal-dark); color: #fffaf6; }
.service-row.is-active .service-go { opacity: 1; transform: translate(2px, -2px); }
.service-open:focus-visible { outline-offset: -3px; }
.service-preview { position: sticky; top: 116px; }
.service-preview-media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: #d9d3c9; }
.sp-layer, .sp-layer img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.sp-layer { opacity: 0; transition: opacity 380ms cubic-bezier(.23,1,.32,1); }
.sp-layer.is-current { opacity: 1; }
.sp-layer img { object-fit: cover; transform: scale(1.035); transition: transform 1100ms cubic-bezier(.23,1,.32,1); }
.sp-layer.is-current img { transform: none; }
.service-preview-caption { padding-top: 22px; }
.sp-cat { margin: 0 0 6px; font-size: 12px; font-weight: 700; color: var(--teal-dark); }
.sp-title { margin: 0 0 10px; font: 400 28px/1.2 "Fraunces", serif; color: var(--plum); }
.sp-desc { margin: 0; max-width: 52ch; font-size: 14px; line-height: 1.7; color: #4f404f; }
.sp-hint { margin: 14px 0 0; font-size: 12px; color: #6b5b6b; }
.chapter-photo img, .dialog-media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.dialog-media { position: relative; overflow: hidden; background: #d9d3c9; }
.dialog-media picture { position: absolute; inset: 0; }
.care-section .image-frame img { width: 100%; }

.route-wrap { grid-template-columns: 1.1fr .9fr; gap: 80px; }
#network-title { font-size: 43px !important; }
.route-card { background: transparent; border: none; border-bottom: 1px solid var(--line); border-radius: 0; padding: 17px 0; box-shadow: none; }
.route-card h3 { font: 700 15px/1.4 "Manrope", sans-serif; }
.route-card p { font-size: 13px; }
.route-composer { background: var(--teal-dark); color: #fffaf6; padding: 36px; border-radius: 8px; }
.route-composer h3 { font: 400 31px/1.2 "Fraunces", serif; margin: 0 0 30px; }
.route-endpoints { position: relative; display: grid; gap: 20px; }
.route-endpoints .field label { color: #eaf4ef; }
.route-endpoints input { border: 1px solid #7eaaa1; background: #fffaf6; color: var(--plum); min-height: 52px; }
.route-swap { position: absolute; right: 12px; top: 65px; z-index: 2; width: 38px; height: 38px; min-height: 0; border: 1px solid #7eaaa1; color: var(--teal-dark); background: #fffaf6; border-radius: 50%; }
.route-swap:hover { background: var(--apricot-2); }
.freight-modes { margin: 24px 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; border: none; }
.freight-modes legend { font-size: 12px; margin-bottom: 10px; }
.freight-modes label { cursor: pointer; position: relative; }
.freight-modes input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.freight-modes span { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 10px 4px; min-height: 44px; font-size: 12px; border: 1px solid #70948b; border-radius: 4px; }
.freight-modes svg { width: 16px; height: 16px; }
.freight-modes input:checked + span { color: var(--teal-dark); background: #edf4ed; border-color: #edf4ed; }
.freight-modes input:focus-visible + span { outline: 3px solid var(--apricot-2); outline-offset: 3px; }
.route-preview { display: grid; grid-template-columns: minmax(0, 1fr) 1fr minmax(0, 1fr); align-items: center; gap: 12px; margin: 30px 0; font-size: 12px; }
.route-preview > span { overflow-wrap: anywhere; }
.route-preview > span:last-child { text-align: right; }
.route-preview-line { border-top: 1px dashed #91bab0; position: relative; }
.route-preview-line svg { position: absolute; width: 24px; height: 24px; left: calc(50% - 12px); top: -12px; background: var(--teal-dark); color: var(--apricot-2); padding: 3px; }
.route-composer > .btn { width: 100%; }
.route-note { font-size: 11px; color: #d2e5df; text-align: center; margin: 15px 0 0; }
.route-composer :focus-visible { outline-color: var(--apricot-2); }

.industries-head { max-width: 780px; margin-bottom: 40px; }
.industries-head h2 { margin: 0 0 16px; font-family: "Fraunces", Georgia, serif; font-weight: 400; font-size: 44px; line-height: 1.14; color: var(--plum); }
.industries-head p { margin: 0; max-width: 62ch; font-size: 16px; line-height: 1.8; color: #5c4c5c; }
.industry-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 44px; }
.industry-card { display: grid; grid-template-columns: 44px 1fr; column-gap: 18px; align-content: start; min-height: 0; padding: 26px 0 30px; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none; }
.industry-card .chip-icon { grid-row: span 2; }
.industry-card h3 { margin: 2px 0 8px; font: 400 21px/1.3 "Fraunces", serif; }
.industry-card p { grid-column: 2; margin: 0; font-size: 14px; line-height: 1.65; }
.industry-card:hover { transform: none; box-shadow: none; }
#about .split { gap: 64px; }
.story-panel h2 { font-size: 38px; margin-bottom: 22px; }
.story-panel .lead { font-size: 14px; margin-top: 16px; }
.story-gallery { gap: 10px; }
.story-gallery figure { border-radius: 0; }
.story-caption { color: #675366; font-size: 12px !important; }
.quote { background: transparent; padding: 20px 0; border: none; border-top: 1px solid var(--line); border-radius: 0; font-size: 20px; }
.standards { gap: 30px; }
.standard-card { border: 0; border-top: 1px solid #80687e; border-radius: 0; padding: 28px 0; background: transparent; box-shadow: none; }
.standard-card .chip-icon { background: var(--apricot-2); color: var(--plum); width: 50px; height: 50px; box-shadow: none; }
.standard-card h3 { font: 500 22px/1.3 "Fraunces", serif; }
.standard-card p { font-size: 13px; color: #e3d4df; }
.standard-card:hover { transform: none; box-shadow: none; }
.contact-wrap { gap: 70px; grid-template-columns: .8fr 1.2fr; }
.contact-card { padding: 0; background: transparent; border: 0; box-shadow: none; }
.contact-card h3 { font: 400 40px/1.18 "Fraunces", serif; }
.contact-lines { margin-top: 30px; }
.contact-panel { padding: 0; background: transparent; border: 0; border-radius: 0; box-shadow: none; overflow: visible; }
.contact-panel h2 { margin-bottom: 30px; font-size: 38px; }
.contact-panel::before { display: none; }
.contact-line { font-size: 13px; }
.contact-line a { overflow-wrap: anywhere; }
.contact-line .chip-icon { color: var(--teal-dark); background: #e1efeb; }
.contact-panel .form-grid { gap: 20px; }
.field textarea { min-height: 165px; }
.helper-chips { gap: 8px; }
.helper-chip { border-radius: 4px; font-size: 11px; padding: 8px 10px; min-height: 35px; }
.footer { padding-top: 60px; }
.footer-logo { width: 175px; }
.footer-grid { gap: 45px; }
.footer p, .footer li { font-size: 13px; }
.dialog-media { background-image: none; }
.dialog { max-height: calc(100svh - 40px); }
.dialog-close { background: #fffaf6; color: var(--plum); }
/* Sentence case throughout: labels read, they don't shout. */
.eyebrow, .brand-since, .field label { text-transform: none; }
.field label { font-size: 13px; font-weight: 600; color: var(--plum); }
.brand-since { font-size: 12px; font-weight: 600; }
/* Static content does not pretend to be clickable. */
.care-card::after, .industry-card::after, .standard-card::after { display: none; }
.industry-card:hover .chip-icon { background: #e1efeb; color: var(--teal-dark); transform: none; }
.story-gallery figure:hover img { transform: none; }
.fade-up { animation: none; }
.js-disabled-note { font-size: 13px; }

@media (min-width: 1600px) { .hero h1 { font-size: 94px; } }
@media (max-width: 1100px) {
  .container { width: calc(100% - 64px); }
  .nav-links { gap: 15px; font-size: 12px; }
  .brand-since { display: none; }
  .hero h1 { font-size: 68px; }
  .hero-copy { width: 480px; }
  .service-index { gap: 36px; }
  .service-cat { display: none; }
  .service-open { grid-template-columns: 42px minmax(0, 1fr) 26px; }
  .industry-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .care-section .split, .route-wrap, .shipment-story, #about .split, .contact-wrap { gap: 40px; }
  .shipment-heading h2 { font-size: 48px; }
  .shipment-chapter h3 { font-size: 33px; }
  .route-composer { padding: 26px; }
}
@media (max-width: 800px) {
  .container { width: calc(100% - 40px); }
  .section { padding: 64px 0; }
  .topbar { display: none; }
  .nav, .site-header.scrolled .nav { height: 74px; }
  .brand-logo { width: 108px; }
  .nav-links { display: none; }
  .menu-toggle { display: grid; }
  .nav-actions .btn { display: inline-flex; padding: 9px 13px; min-height: 42px; font-size: 12px; }
  .site-header { position: sticky; top: 0; }
  .mobile-menu { max-height: calc(100svh - 74px); overflow-y: auto; }
  .hero h1 { font-size: 62px; }
  .hero-inner { padding: 50px 0 85px; align-self: start; }
    .plane-scrim { background: linear-gradient(90deg, rgba(32,16,34,.95), rgba(32,16,34,.64) 48%, transparent 90%); }
  .hero p.hero-promise { font-size: 19px; }
  .service-index { display: block; }
  .service-preview { display: none; }
  .service-open { grid-template-columns: 76px minmax(0, 1fr) 22px; gap: 14px; padding: 14px 0; }
  .service-thumb { display: block; width: 76px; height: 76px; overflow: hidden; background: #ddd6cc; }
  .service-thumb picture, .service-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
  .service-icon { display: none; }
  .service-row.is-active .service-open { background: transparent; }
  .service-row.is-active .service-go { opacity: .45; transform: none; }
  .industries-head h2 { font-size: 36px; }
  .care-section .split, .route-wrap, #about .split, .contact-wrap { grid-template-columns: 1fr; }
  .section-head { display: block; }
  .section-head h2, .split h2, #network-title { font-size: 36px !important; }
  .section-head > p { margin-top: 20px; max-width: 60ch; }
  .care-section .image-frame { height: 370px; min-height: 0; }
  .shipment-story { gap: 28px; grid-template-columns: 1fr 1fr; }
  .shipment-visual { top: 100px; }
  .shipment-photos { aspect-ratio: .85; }
  .shipment-chapter h3 { font-size: 28px; }
  .shipment-chapter p { font-size: 14px; }
  .shipment-track a { font-size: 10px; }
  .shipment-track { gap: 3px; }
  .service-tools { align-items: start; }
  .service-filters button { padding: 10px 12px; }
  .service-tools p { display: none; }
  .standards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contact-wrap { gap: 45px; }
  .contact-card { max-width: 580px; }
  .contact-lines { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
  .contact-line { margin: 0; }
  .footer-grid { grid-template-columns: 1.3fr 1fr; gap: 35px; }
}
@media (max-width: 560px) {
  .hero h1 { font-size: 54px; }
  .hero-inner { padding: 36px 0 0; }
  .hero p.hero-kicker { font-size: 11px; margin-bottom: 18px; }
  .hero p.hero-promise { font-size: 17px; margin-top: 20px; }
  .hero-actions { gap: 10px; margin-top: 24px; }
  .hero-actions .btn { font-size: 12px; padding: 10px 12px; min-height: 44px; }
  .hero-actions svg { width: 16px; height: 16px; }
  .hero:not(.sc-act--pinned) .hero-stage { height: min(650px, calc(100svh - 140px)); min-height: 500px; align-items: flex-start; }
  .hero:not(.sc-act--pinned) .hero-photo { object-position: 59% bottom; }
  .plane-scrim { background: linear-gradient(180deg, rgba(32,16,34,.98), rgba(32,16,34,.92) 36%, rgba(32,16,34,.12) 61%, transparent 78%); }
  .proof-grid strong { font-size: 22px; }
  .proof-grid span { font-size: 12px; }
  .industries-head h2 { font-size: 32px; }
  .industries-head p { font-size: 14px; }
  .industry-grid { grid-template-columns: 1fr; }
      .section { padding: 52px 0; }
  .section-head h2, .split h2, #network-title { font-size: 32px !important; }
  .section-head p, .lead, .split p { font-size: 14px; }
  .care-section .image-frame { height: 320px; }
  .care-section .image-frame img { min-height: 0; }
  .image-frame figcaption { font-size: 11px; left: 12px; right: 12px; bottom: 12px; }
  .shipment-heading { margin-bottom: 30px; }
  .shipment-heading h2 { font-size: 37px; }
  .shipment-heading .eyebrow { font-size: 11px; }
  /* Phones: a compact panel (photo + stage track) sticks under the header and
     the same thread advances through the four stages as the chapters scroll
     beneath it. Reduced motion keeps the plain list (see the block below). */
  .shipment-story { display: block; }
  .shipment-visual { position: sticky; top: 74px; z-index: 2; margin: 0 -20px; padding: 0 20px 14px; background: var(--aubergine); }
  .shipment-photos { aspect-ratio: auto; height: 32svh; max-height: none; }
  .shipment-track { padding-top: 14px; gap: 2px; }
  .shipment-track a { gap: 6px; padding-top: 0; font-size: 10px; }
  .shipment-track a svg { width: 32px; height: 32px; padding: 7px; }
  .shipment-thread { top: 30px; }
  .shipment-chapter { min-height: 54svh; padding: 30px 0; border-top: 0; }
  .shipment-chapter h3 { font-size: 28px; }
  .shipment-chapter .stage-label { margin-bottom: 10px; }
  .chapter-photo { display: none; }
  .service-filters { flex-wrap: nowrap; width: 100%; }
  .service-filters button { font-size: 11px; padding: 10px 9px; flex: 1; white-space: nowrap; }
  .service-filters span { display: none; }
  .service-open { grid-template-columns: 68px minmax(0, 1fr) 20px; }
  .service-thumb { width: 68px; height: 68px; }
  .service-name { font-size: 15px; }
  .service-desc { font-size: 12px; }
  .industry-card h3 { font-size: 15px; }
  .route-wrap { gap: 32px; }
  .route-composer { padding: 26px 20px; }
  .route-composer h3 { font-size: 29px; }
  .standards { gap: 20px; }
  .standard-card h3 { font-size: 20px; }
  .standard-card p { font-size: 12px; }
  .standard-card .chip-icon { width: 44px; height: 44px; }
  .contact-card h3 { font-size: 32px; }
  .contact-lines { grid-template-columns: 1fr; }
  .contact-panel h2 { font-size: 32px; }
  .form-grid { grid-template-columns: 1fr; }
  .form-actions .btn { width: 100%; }
  .field input, .field select, .field textarea { font-size: 16px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 26px; }
  .footer-grid > div:first-child { grid-column: 1 / -1; }
  .footer-grid > div:last-child { grid-column: 1 / -1; }
  .dialog-content { padding: 25px; }
  .dialog-panel h3 { font-size: 27px; }
}
@media (max-width: 380px) {
  .hero h1 { font-size: 48px; }
  .hero-actions .btn { padding: 10px; font-size: 11px; }
  .service-filters button { padding-inline: 6px; }
  .freight-modes span { gap: 3px; font-size: 11px; }
}
/* Phones and small portrait tablets: the vertical clip (cgl-hero-phone) and its
   first frame. The ship holds the middle of the frame, so the headline sits in
   the sky above it and the promise and actions on the sea below it. */
@media (max-width: 760px) {
  .hero-photo, .hero-clip, .hero:not(.sc-act--pinned) .hero-photo { object-position: 50% 50%; }
  /* The stage pins just under the 74px header, so the actions are on screen
     from the first paint and the frame never slides under the header. */
  .hero:not(.sc-act--pinned) .hero-stage { height: calc(100svh - 74px); min-height: 540px; max-height: 920px; }
  .hero.sc-act--pinned .hero-stage { top: 74px; height: calc(100svh - 74px); }
  .hero .hero-inner, .hero.sc-act--pinned .hero-inner { align-self: stretch; display: flex; padding: 24px 0 calc(22px + env(safe-area-inset-bottom)); }
  .hero-copy { display: flex; flex-direction: column; }
  .hero h1 { text-shadow: 0 1px 22px rgba(10,20,40,.4); }
  .hero p.hero-promise { margin-top: auto; }
  .plane-scrim { background:
    linear-gradient(180deg, rgba(14,26,46,.68), rgba(14,26,46,.52) 26%, rgba(14,26,46,.2) 36%, transparent 47%),
    linear-gradient(0deg, rgba(10,22,40,.72), rgba(10,22,40,.34) 20%, transparent 34%); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .hero-photo, .hero-clip { transform: none !important; }
      .reveal, [data-sc-in] { opacity: 1 !important; transform: none !important; }
  .shipment-story { display: block; }
  .shipment-visual { display: none; }
  .shipment-chapters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px; }
  .shipment-chapter { min-height: 0; justify-content: start; padding: 0; }
  .chapter-photo { display: block; width: 100%; aspect-ratio: 1.45; margin-bottom: 24px; }
}
@media (prefers-reduced-motion: reduce) and (max-width: 560px) { .shipment-chapters { grid-template-columns: 1fr; } }