:root { --ink: #172033; --muted: #627087; --surface: #fff; --canvas: #f4f7fb; --accent: #ff5a42; --accent-dark: #e94732; }
main { background: var(--canvas); }
.shipping-hero { display:flex; justify-content:space-between; gap:2rem; align-items:end; max-width:1020px; margin:0 auto 1.5rem; }
.shipping-hero h1 { color:var(--ink); font-size:clamp(2.2rem, 5vw, 4.25rem); font-weight:800; line-height:1; letter-spacing:-.055em; margin:.25rem 0 .8rem; }
.shipping-hero .lead { color:var(--muted); font-size:1.1rem; max-width:580px; margin:0; }
.eyebrow { color:var(--accent); font-size:.74rem; font-weight:800; letter-spacing:.1em; margin:0 0 .35rem; text-transform:uppercase; }
.shipping-hero__steps { display:flex; flex-direction:column; gap:.45rem; color:var(--muted); font-size:.85rem; font-weight:700; padding-bottom:.5rem; }
.shipping-hero__steps span:before { content:""; display:inline-block; height:.55rem; width:.55rem; margin-right:.5rem; border-radius:50%; background:var(--accent); }
#shippingWizard { max-width:1020px; margin:auto; }
.wizard-card { background:var(--surface); border:1px solid #e4e9f1; border-radius:1.25rem; box-shadow:0 12px 35px rgba(24, 39, 75, .07); margin:1rem 0; padding:clamp(1.25rem, 3vw, 2.5rem); }
.wizard-card__heading { display:flex; align-items:center; gap:1rem; margin-bottom:1.4rem; }
.wizard-card__heading > span { align-items:center; background:#fff0ed; border-radius:50%; color:var(--accent); display:flex; font-size:1.1rem; font-weight:800; height:2.55rem; justify-content:center; width:2.55rem; }
.wizard-card h2 { color:var(--ink); font-size:1.55rem; font-weight:800; margin:0; }
.wizard-grid, .address-columns, .extras-grid, .cod-details { display:grid; gap:1rem; }
.wizard-grid--route { grid-template-columns:repeat(4, 1fr); }
.wizard-card label, .package-row label { color:var(--ink); display:grid; font-size:.88rem; font-weight:700; gap:.42rem; }
.wizard-card input, .wizard-card select { background:#fff; border:1px solid #cfd8e5; border-radius:.65rem; color:var(--ink); min-height:2.85rem; padding:.55rem .7rem; width:100%; }
.wizard-card input:focus, .wizard-card select:focus { border-color:var(--accent); box-shadow:0 0 0 .22rem rgba(255,90,66,.13); outline:0; }
.shipment-types { display:grid; gap:1rem; grid-template-columns:repeat(3, 1fr); }
.shipment-type { border:1px solid #dbe3ee; border-radius:1rem; cursor:pointer; display:block !important; min-height:8.4rem; padding:1.15rem; transition:all .15s ease; }
.shipment-type input { height:1px; opacity:0; position:absolute; width:1px; }
.shipment-type strong { color:var(--ink); display:block; font-size:1.08rem; margin-bottom:.5rem; }
.shipment-type small { color:var(--muted); display:block; font-weight:500; line-height:1.35; }
.shipment-type.is-selected { background:#fff5f3; border-color:var(--accent); box-shadow:0 0 0 2px rgba(255,90,66,.13); }
.package-rows { margin-top:1.5rem; }
.package-row { align-items:end; background:#f8faff; border:1px solid #e2e9f4; border-radius:.9rem; display:grid; gap:.75rem; grid-template-columns:1.15fr repeat(4, 1fr) auto; margin:.7rem 0; padding:1rem; position:relative; }
.package-row__title { color:var(--ink); font-size:.92rem; font-weight:800; grid-column:1 / -1; }
.package-row label { font-size:.78rem; }
.package-row input { min-height:2.55rem; }
.remove-package { background:transparent; border:0; color:#b33424; font-size:1.65rem; line-height:1; padding:.4rem .2rem; }
.btn-add { margin-top:.4rem; }
.pallet-options { background:#f8faff; border-radius:.75rem; display:flex; flex-wrap:wrap; gap:1rem 1.75rem; margin-top:1.25rem; padding:1rem; }
.pallet-options label, .checkbox-label { align-items:center; display:flex !important; gap:.5rem; }
.pallet-options input, .checkbox-label input { min-height:auto; padding:0; width:auto; }
.wizard-actions { margin-top:1.65rem; text-align:right; }
.btn-primary { font-weight:700; }
.form-hint { color:var(--muted); font-size:.86rem; margin:.9rem 0 0; }
.quote-results { display:grid; gap:1rem; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); }
.quote-option { border:2px solid var(--accent); border-radius:1rem; padding:1.3rem; }
.quote-option h3 { color:var(--ink); font-size:1.2rem; font-weight:800; }
.quote-price { color:var(--accent); font-size:2.1rem; font-weight:800; letter-spacing:-.04em; margin:.8rem 0; }
.quote-timing, .quote-message { color:var(--muted); line-height:1.5; }
.quote-message { background:#f7f9fc; border-radius:.75rem; padding:1rem; }
.address-columns { grid-template-columns:1fr 1fr; }
.invoice-address { grid-template-columns:1fr; margin-top:1rem; }
.address-columns fieldset { border:1px solid #e2e9f4; border-radius:.9rem; padding:1.15rem; }
.address-columns legend { color:var(--ink); float:none; font-size:1rem; font-weight:800; padding:0 .25rem; width:auto; }
.address-columns label { margin-top:.75rem; }
.extras-grid { align-items:end; grid-template-columns:repeat(4, 1fr); margin-top:1.4rem; }
.cod-details { grid-template-columns:repeat(3, 1fr); margin-top:1rem; }
@media (max-width: 850px) { .shipping-hero { align-items:start; flex-direction:column; }.shipping-hero__steps { flex-direction:row; flex-wrap:wrap; }.wizard-grid--route { grid-template-columns:1fr 1fr; }.extras-grid { grid-template-columns:1fr 1fr; }.package-row { grid-template-columns:repeat(3, 1fr); }.remove-package { position:absolute; right:.7rem; top:.35rem; } }
@media (max-width: 575px) {
    .shipping-hero { gap:1rem; margin-bottom:1rem; }
    .shipping-hero h1 { font-size:2rem; letter-spacing:-.04em; }
    .shipping-hero .lead { font-size:1rem; }
    .shipping-hero__steps { display:none; }
    .wizard-card { border-radius:1rem; margin:.75rem 0; padding:1.1rem; }
    .wizard-card__heading { align-items:flex-start; gap:.75rem; margin-bottom:1.1rem; }
    .wizard-card__heading > span { flex:0 0 2.25rem; height:2.25rem; width:2.25rem; }
    .wizard-card h2 { font-size:1.3rem; line-height:1.2; }
    .wizard-grid--route, .shipment-types, .address-columns, .extras-grid, .cod-details, .package-row { grid-template-columns:1fr; }
    .shipment-types { gap:.7rem; }
    .shipment-type { min-height:auto; padding:1rem; }
    .package-rows { margin-top:1rem; }
    .package-row { gap:.7rem; padding:.9rem; }
    .package-row__title { grid-column:auto; padding-right:2rem; }
    .pallet-options { align-items:stretch; flex-direction:column; gap:.75rem; padding:.9rem; }
    .pallet-options label { align-items:flex-start; }
    .quote-option { padding:1.05rem; }
    .quote-price { font-size:1.85rem; }
    .address-columns fieldset { padding:1rem; }
    .wizard-actions { text-align:stretch; }
    .wizard-actions .btn { min-height:3rem; width:100%; }
}