/* ---- pannier (Pannier — Same-day courier & errand runs 242) -----------------
   STRUCTURAL MOVE: one centre axis held the whole way down and broken exactly
   ONCE, at the tracking split. Everything else is a contained, gapped column on
   warm paper; the only gapless full-bleed run on the page is the eight-tile
   photograph band near the foot, and the ground goes to asphalt at exactly two
   points — the video and the closing band. Amber is spent three times and no
   more: the solid slabs, the step numerals, and the rule welded under each
   price. Sections are reached by CLASS only, never :nth-of-type, because the
   hero is the first section element and would swallow the match. Nothing here
   positions or reorders anything inside the header — only the bar itself. */
body.t-pannier.ws-body {
  --bg: #f7f6f3; --fg: #4a4a46; --heading: #141414; --text: #4a4a46; --muted: #6b6b68;
  --pn-amber: #ff8a1f; --pn-line: #e2e0da; --pn-asphalt: #1b1b1d; --pn-card: #ffffff;
  --hero-a: rgba(12, 12, 13, .46); --hero-b: rgba(12, 12, 13, .74);
}
body.t-pannier { background: var(--bg); }

/* the BAR rides transparent on the photograph — its items are left alone */
body.t-pannier .ws-nav { position: absolute; top: 0; left: 0; right: 0; padding: 10px 0; background: transparent; backdrop-filter: none; border-bottom: 0; color: #f7f6f3; }
body.t-pannier .ws-nav-links a { color: #f7f6f3; opacity: .8; text-transform: uppercase; letter-spacing: .15em; font-size: 10.5px; font-weight: 600; }

/* hero — one whole viewport of motion, copy dead centre, nothing else in frame */
body.t-pannier .ws-hero { min-height: 100vh; }
body.t-pannier .ws-hero h1 { font-size: clamp(38px, 6.6vw, 82px); font-weight: 700; letter-spacing: -.045em; line-height: 1; max-width: 17ch; text-shadow: none; }
/* amber 1 of 3 — every solid slab on the page, flat and borderless */
body.t-pannier.ws-body .btn.brand, body.t-pannier.ws-body .ws-hero-cta.btn.brand:hover, body.t-pannier.ws-body .ws-cta .btn.brand { background: var(--pn-amber); color: #141414; border-radius: 0; box-shadow: none; text-transform: uppercase; letter-spacing: .17em; font-size: 10.5px; font-weight: 700; padding: 16px 32px; }

/* the axis: contained, gapped, and no zebra wash anywhere on the paper */
body.t-pannier .ws-section { padding: 104px 0; }
body.t-pannier.ws-body .ws-section:nth-child(even):not(.ws-cta):not(.ws-shoplink) { background: transparent; }
body.t-pannier .ws-h2 { color: var(--heading); font-size: clamp(26px, 3.6vw, 42px); font-weight: 700; letter-spacing: -.04em; line-height: 1.06; margin: 0 0 14px; }
body.t-pannier .ws-sub, body.t-pannier .ws-feature p, body.t-pannier .ws-plan li { color: var(--muted); font-size: 14px; line-height: 1.72; }
body.t-pannier .ws-story-copy p, body.t-pannier .ws-quote blockquote, body.t-pannier .ws-list li { color: var(--text); font-size: 15px; line-height: 1.76; }
body.t-pannier .ws-features-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 52px 40px; margin-top: 18px; }

/* THE ONE BREAK IN THE AXIS — square photograph hard left, nothing else on the
   page is asymmetric. The video frame is squared off in the same breath. */
body.t-pannier .ws-story-media img, body.t-pannier .ws-video-frame { border-radius: 0; box-shadow: none; }

/* amber 2 of 3 — the step numerals, and nothing else in this band */
body.t-pannier .ws-list { list-style: none; padding-left: 0; counter-reset: pn; }
body.t-pannier .ws-list li { counter-increment: pn; position: relative; margin: 0; padding: 22px 0 22px 62px; border-top: 1px solid var(--pn-line); }
body.t-pannier .ws-list li::before { content: counter(pn, decimal-leading-zero); position: absolute; left: 0; top: 23px; color: var(--pn-amber); font-size: 13px; font-weight: 700; letter-spacing: .08em; }

/* dark moment one — the poster band, one control on it and not a word beside it */
body.t-pannier.ws-body .ws-section.ws-video { background-image: linear-gradient(rgba(27, 27, 29, .70), rgba(27, 27, 29, .84)), url("/media/samples/pnr_video.jpg"); background-size: cover; background-position: center; padding: 128px 0; }

/* four equal cards in one row; amber 3 of 3 is the rule welded under the rand */
body.t-pannier .ws-pricing-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; max-width: none; }
body.t-pannier .ws-plan { background: var(--pn-card); border: 0; border-radius: 0; padding: 34px 26px 30px; text-align: left; }
body.t-pannier .ws-plan-price { margin: 0 0 20px; padding-bottom: 15px; border-bottom: 2px solid var(--pn-amber); }
body.t-pannier .ws-plan-amt { color: var(--heading); font-size: 44px; font-weight: 700; letter-spacing: -.05em; }
body.t-pannier .ws-plan li::before { content: '—'; color: var(--pn-line); font-weight: 400; }

/* the only gapless run on the page — eight tiles, four across, edge to edge */
body.t-pannier .ws-photogrid, body.t-pannier .ws-photogrid .ws-container { padding: 0; max-width: none; }
body.t-pannier .ws-photogrid-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; }

/* quotes read two by two as bare type, never as cards */
body.t-pannier .ws-testimonials-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 46px 60px; max-width: 900px; margin: 0 auto; }
body.t-pannier .ws-quote { background: transparent; border: 0; border-radius: 0; box-shadow: none; padding: 0; }
body.t-pannier .ws-quote blockquote::before { content: none; }

/* dark moment two, then the page closes the way it opened — centred and small */
body.t-pannier.ws-body .ws-cta { background: var(--pn-asphalt); color: #f7f6f3; padding: 116px 0; }
body.t-pannier .ws-contact { border-top: 1px solid var(--pn-line); padding: 92px 0 104px; }
body.t-pannier .ws-field input, body.t-pannier .ws-field textarea, body.t-pannier .ws-field select { background: transparent; border: 0; border-bottom: 1px solid var(--pn-line); border-radius: 0; color: var(--heading); padding: 12px 2px; }

@media (max-width: 760px) {
  body.t-pannier .ws-nav-links a, body.t-pannier .ws-nav-links .theme-toggle { color: var(--heading); opacity: 1; }
  body.t-pannier .ws-features-grid, body.t-pannier .ws-pricing-grid, body.t-pannier .ws-photogrid-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.t-pannier .ws-testimonials-grid { grid-template-columns: 1fr; }
}

/* night — the paper goes to ink, the asphalt one stop deeper, the amber warmer */
html[data-theme="dark"] body.t-pannier.ws-body {
  --bg: #141414; --fg: #a4a39d; --heading: #f6f4ef; --text: #a4a39d; --muted: #86857e;
  --pn-amber: #ff9a3c; --pn-line: #2c2b28; --pn-asphalt: #0c0c0d; --pn-card: #1d1d1b;
  --hero-a: rgba(7, 7, 8, .50); --hero-b: rgba(7, 7, 8, .78);
}
html[data-theme="dark"] body.t-pannier { background: var(--bg); }