/* Repair Process and Terms: "Where to send your equipment" as one block you can act on (design log S1).
   Pale ship-to label (panel grey, orange rule, navy serif address; owner 2026-10-01: "a little lighter") beside an icon list (the furnace need-list pattern).
   The packing rule gets a drawn box: unit in the middle, 2-inch margin marked in orange on every side. */
.ship { container-type: inline-size; }
.ship-card { display: grid; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: var(--paper); box-shadow: var(--shadow); margin-bottom: 8px; }

.ship-label { margin: 0; background: var(--panel); color: var(--navy); border-top: 4px solid var(--accent); padding: 20px 22px 22px; }
.ship-to { display: flex; align-items: center; gap: 8px; font: 600 .78rem/1.3 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-bottom: 8px; }
.ship-pin { width: 18px; flex: none; fill: none; stroke: var(--navy); stroke-width: 1.8; stroke-linejoin: round; }
.ship-pin .acc { stroke: var(--accent); }
/* One click or long-press selects the whole address for pasting into a carrier form */
.ship-addr { display: block; font: 600 clamp(1.2rem, 1.05rem + .6vw, 1.4rem)/1.35 var(--serif); color: var(--navy); user-select: all; -webkit-user-select: all; cursor: text; }

/* The Home "Where to send it" route graphic in its own navy/orange colours; static here (one moving thing per site is enough) */
.ship-route { display: none; }
.ship-route .route { animation: none; stroke-width: 2.6; }
.ship-route .box path { stroke: var(--navy-line); stroke-width: 2.2; }
.ship-route .pin path { fill: var(--navy-line); }

.ship-list { list-style: none; margin: 0; padding: 4px 22px; }
.ship-list li { display: grid; grid-template-columns: 44px 1fr; column-gap: 14px; align-items: center; padding: 12px 0; }
.ship-list li + li { border-top: 1px solid var(--panel); }
.ship-list span { color: var(--ink-2); }
.ship-icon { width: 32px; justify-self: center; fill: none; stroke: var(--navy-line); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ship-icon .acc { stroke: var(--accent); }
/* Icons ~5% lighter than the furnace list (owner 2026-10-01): stroke --navy-line #3B4466 and thinner lines; orange colour kept
   (already near 3:1 on white, so it is thinned, not paled). */
/* Packing rule: the one drawn graphic, a size up so it is the thing the eye lands on */
.ship-box { width: 44px; stroke-width: 1.8; }
.ship-box .fill { fill: rgb(221 107 44 / .12); }
.ship-box .unit { fill: var(--navy-line); }
.ship-box .dim, .ship-box .tick { stroke: var(--accent); stroke-width: 1.5; }
.ship-row-pack span { font-weight: 600; color: var(--navy); }

@container (min-width: 620px) {
  .ship-card { grid-template-columns: 300px minmax(0, 1fr); }
  .ship-label { display: flex; flex-direction: column; justify-content: center; border-top: 0; border-left: 4px solid var(--accent); padding: 22px 24px; }
  .ship-route { display: block; width: 170px; margin: 0; padding-top: 22px; }
  .ship-list { padding: 6px 26px; }
  .ship-addr { font-size: 1.2rem; }
}

/* Review fix: from 1200 the hazard note starts level with the card, not with the heading above it (h2 block + gap = 57px) */
@media (min-width: 1200px) { .send-grid > .depth { margin-top: 57px; } }
