/* ============================================================================
 * track-parcel.desktop.css — DESKTOP / TABLET light-2026 layer (>=768px)
 * ----------------------------------------------------------------------------
 * Loads only via the media-gated <link>, applies only beside the AppShell
 * sidebar (body.ptshell, set by ptcargo-shell.js). The MOBILE Source-of-Truth
 * (track-parcel.css + the page's inline <style>) is NEVER touched — phone view
 * stays byte-equal. On desktop the shell topbar/sidebar replaces the in-body
 * .hd header (appshell.css hides it); here we only: set the neutral canvas
 * (#F4F5F7), centre every section at ONE width (1080), turn the hero into a
 * premium white card, and give the cards the light-2026 surface (soft shadow +
 * radius 20). Accent PRESERVED = the page's OWN orange (shared --color-primary
 * / #EF5F06) — this page never used the shipping red, so it stays orange to
 * keep phone + desktop identical. All figures/timeline stay demo DATA (mock
 * search flow; real tracking = GET /api/tracking/{no}, flagged in the HTML).
 * ========================================================================== */
@media (min-width:768px){
  /* neutral light-2026 canvas beside the shell sidebar */
  body.ptshell{background:#F4F5F7}

  /* ONE centred column — every section shares width + edges (max 1080) */
  body.ptshell main.page.boxed{max-width:1080px;margin-inline:auto;padding:6px 0 48px}
  body.ptshell main.page .stack{gap:20px}

  /* ── HERO — premium white card, 2-col (text + route image) ── */
  body.ptshell .tp-hero{
    padding:40px 44px;border-radius:22px;
    box-shadow:0 22px 48px -30px rgba(20,25,35,.28)}
  body.ptshell .tp-hero h1{font-size:34px}
  body.ptshell .tp-hero .lead{font-size:15.5px;max-width:48ch}
  body.ptshell .tp-search .tp-ip{height:54px}
  /* keep the search row from stretching across the whole column */
  body.ptshell .tp-search{max-width:560px}

  /* ── CARDS — light-2026 surface (radius 20 · soft shadow) ──
     border-color is left to the page SoT (regular cards #E7E9EE; the .tp-contact
     card keeps its intentional warm #FBD9C4 border), so only radius+shadow here. */
  body.ptshell main.page .card{
    border-radius:20px;
    box-shadow:0 18px 44px -30px rgba(20,25,35,.26)}

  /* empty state a touch airier on the wide canvas */
  body.ptshell .tp-empty{padding:40px 24px}

  /* quick-action cards — subtle hover lift (they are links) */
  body.ptshell .tp-quick{transition:transform .15s, box-shadow .15s}
  body.ptshell .tp-quick:hover{transform:translateY(-2px);
    box-shadow:0 16px 34px -22px rgba(20,25,35,.4)}
}