:root {
  --ink: #14231f;
  --ink-2: #243b35;
  --green: #166b4b;
  --green-bright: #19a66e;
  --lime: #d7f35b;
  --orange: #ff7849;
  --cream: #f5f2e9;
  --paper: #fbfaf6;
  --line: #dfe4df;
  --muted: #6d7974;
  --white: #fff;
}

* { box-sizing: border-box; }
[hidden],.filter-hidden { display: none !important; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: Arial, Helvetica, sans-serif; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; }

.brand { display: inline-flex; align-items: center; gap: 11px; width: fit-content; }
.corporate-logo { width: 190px; height: 58px; object-fit: cover; object-position: center; display: block; }
.brand-light .corporate-logo { filter: none; }
.brand-mark { display: grid; grid-template-columns: 1fr 1fr; align-items: center; width: 44px; height: 35px; border: 2px solid var(--ink); transform: skew(-8deg); overflow: hidden; }
.brand-mark i { display: grid; place-items: center; height: 100%; font-size: 17px; font-weight: 950; font-style: normal; letter-spacing: -2px; transform: skew(8deg); }
.brand-mark i:last-child { color: white; background: var(--orange); }
.brand-words { display: grid; line-height: 1; gap: 3px; }
.brand-words b { letter-spacing: 1.6px; font-size: 17px; }
.brand-words small { font-size: 8px; letter-spacing: 2.15px; }
.brand-light { color: white; }
.brand-light .brand-mark { border-color: white; }
.brand-compact .brand-mark { width: 38px; height: 30px; }
.hidden { display: none !important; }

.button { border: 0; border-radius: 3px; min-height: 48px; padding: 0 20px; display: inline-flex; align-items: center; justify-content: center; gap: 18px; font-weight: 800; font-size: 14px; transition: transform .2s, background .2s; }
.button:hover { transform: translateY(-2px); }
.button span { font-size: 19px; }
.button-primary { background: var(--lime); color: var(--ink); box-shadow: 0 8px 20px rgba(0,0,0,.09); }
.button-primary:hover { background: #e5ff6d; }
.button-dark { background: var(--ink); color: white; }
.button-light { background: #edf0ed; color: var(--ink); }
.text-link { font-size: 14px; font-weight: 800; border-bottom: 1px solid rgba(255,255,255,.4); padding: 12px 2px; }
.section-kicker, .eyebrow { font-size: 11px; letter-spacing: 2.2px; font-weight: 900; }
.form-error { color: #c34631 !important; font-size: 13px !important; font-weight: 700; }

/* Landing */
.landing-shell { background: var(--ink); }
.top-nav { height: 86px; padding: 0 max(5vw, 32px); display: flex; align-items: center; justify-content: space-between; color: white; border-bottom: 1px solid rgba(255,255,255,.11); }
.nav-actions { display: flex; align-items: center; gap: 32px; font-size: 13px; font-weight: 700; }
.nav-order { background: var(--lime); color: var(--ink); padding: 13px 18px; border-radius: 2px; display: flex; gap: 20px; }
.hero { min-height: 670px; padding: 68px max(5vw, 32px) 78px; display: grid; grid-template-columns: 1.03fr .97fr; gap: 8vw; color: white; position: relative; overflow: hidden; }
.hero::before { content:""; width: 420px; height: 420px; border: 1px solid rgba(255,255,255,.06); border-radius: 50%; position: absolute; left: -180px; top: 180px; box-shadow: 0 0 0 70px rgba(255,255,255,.015), 0 0 0 140px rgba(255,255,255,.012); }
.hero-copy { position: relative; z-index: 1; max-width: 660px; }
.eyebrow { color: #c7d3ce; display: flex; align-items: center; gap: 11px; }
.pulse-dot { display: block; width: 8px; height: 8px; background: var(--lime); border-radius: 50%; box-shadow: 0 0 0 5px rgba(215,243,91,.12); }
.hero h1 { font-size: clamp(64px, 6.3vw, 100px); line-height: .91; letter-spacing: -6px; margin: 42px 0 30px; font-weight: 850; }
.hero h1 em { color: var(--lime); font-family: Georgia, serif; font-weight: 400; }
.hero-lead { max-width: 570px; color: #becbc6; font-size: 18px; line-height: 1.65; margin: 0; }
.hero-ctas { display: flex; align-items: center; gap: 30px; margin-top: 38px; }
.trust-row { display: flex; gap: 40px; margin-top: 60px; }
.trust-row div { display: grid; gap: 6px; padding-left: 14px; border-left: 2px solid var(--orange); }
.trust-row strong { font-size: 13px; }
.trust-row span { font-size: 11px; color: #8ca098; }
.hero-panel { position: relative; align-self: center; padding: 20px 0 45px; }
.route-card { background: var(--cream); color: var(--ink); border-radius: 6px; box-shadow: 0 35px 90px rgba(0,0,0,.35); transform: rotate(1.5deg); overflow: hidden; }
.route-card-head { padding: 19px 22px; display: flex; justify-content: space-between; align-items: center; font-size: 11px; letter-spacing: 1.2px; font-weight: 900; border-bottom: 1px solid #d9ded8; }
.route-card-head b { color: var(--green); background: #d9eadf; padding: 6px 8px; border-radius: 2px; }
.route-map { height: 330px; background: #dce4dd; position: relative; overflow: hidden; }
.route-map::before, .route-map::after { content:""; position: absolute; background: #ccd7ce; border-radius: 50%; }
.route-map::before { width: 230px; height: 180px; left: -50px; top: 160px; }
.route-map::after { width: 250px; height: 250px; right: -80px; top: -90px; }
.map-road { position: absolute; height: 22px; width: 120%; left: -10%; background: #f5f4eb; border: 1px solid #d2d8d1; transform: rotate(-12deg); z-index: 1; }
.road-one { top: 90px; } .road-two { top: 220px; transform: rotate(15deg); } .road-three { width: 24px; height: 120%; left: 47%; top: -10%; transform: rotate(12deg); }
.route-line { position: absolute; width: 290px; height: 150px; border: 5px dashed var(--green); border-left: 0; border-bottom: 0; border-radius: 50%; left: 80px; top: 100px; transform: rotate(14deg); z-index: 3; }
.route-pin { position: absolute; width: 33px; height: 33px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); display: grid; place-items: center; color: white; background: var(--ink); z-index: 4; font-weight: 900; }
.route-pin::after { content: attr(class); display: none; }
.route-pin.pin-a { left: 68px; top: 214px; } .route-pin.pin-b { right: 81px; top: 84px; background: var(--orange); }
.route-pin { text-indent: 0; } .route-pin::first-letter { transform: rotate(45deg); }
.van { position: absolute; width: 42px; height: 30px; background: var(--lime); color: var(--ink); left: 52%; top: 47%; display: grid; place-items: center; font-weight: 950; font-size: 11px; z-index: 6; border-radius: 5px 5px 3px 3px; box-shadow: 0 7px 12px rgba(0,0,0,.22); }
.route-details { display: grid; grid-template-columns: 1fr 34px 1fr; padding: 22px; align-items: center; }
.route-details div { display: grid; gap: 5px; }
.route-details span { font-size: 9px; color: var(--muted); letter-spacing: 1.4px; font-weight: 900; }
.route-details strong { font-size: 13px; }
.route-details small { font-size: 11px; color: var(--muted); }
.route-details i { height: 1px; background: #c5cdc6; margin: 0 8px; }
.delivery-chip { position: absolute; right: -25px; bottom: 0; background: white; color: var(--ink); min-width: 250px; padding: 15px; border-radius: 4px; box-shadow: 0 16px 35px rgba(0,0,0,.3); display: flex; align-items: center; gap: 13px; }
.delivery-chip > span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--green); color: white; font-weight: 900; }
.delivery-chip div { display: grid; gap: 3px; }
.delivery-chip b { font-size: 12px; } .delivery-chip small { color: var(--muted); font-size: 10px; }
.service-strip { background: var(--cream); color: var(--ink); padding: 80px max(5vw, 32px); display: grid; grid-template-columns: .72fr repeat(3, 1fr); gap: 1px; }
.service-intro { padding: 26px 42px 0 0; }
.service-intro > span { font-size: 10px; letter-spacing: 2px; font-weight: 900; color: var(--orange); }
.service-intro h2 { font-size: 42px; line-height: 1; margin: 18px 0; letter-spacing: -2px; }
.service-card { background: #faf9f4; border: 1px solid #dedfd8; padding: 24px; min-height: 310px; position: relative; display: flex; flex-direction: column; transition: transform .25s, background .25s; }
.service-card:hover { transform: translateY(-7px); background: white; z-index: 2; }
.service-card.featured { background: var(--ink); color: white; border-color: var(--ink); }
.service-index { align-self: flex-end; font-size: 10px; color: #89938f; }
.service-icon { margin-top: 25px; width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; background: #e7eee8; color: var(--green); font-size: 22px; }
.featured .service-icon { background: var(--lime); color: var(--ink); }
.service-card h3 { font-size: 20px; margin: 24px 0 10px; }
.service-card p { color: #727e78; font-size: 13px; line-height: 1.6; margin: 0; }
.featured p { color: #aebcb6; }
.service-card b { margin-top: auto; font-size: 12px; color: var(--green); }
.featured b { color: var(--lime); }
.office-section { background: white; padding: 90px max(8vw, 40px); display: grid; grid-template-columns: 1fr 430px; gap: 12vw; align-items: center; }
.office-copy .section-kicker { color: var(--orange); }
.office-copy h2 { font-size: 57px; line-height: 1; letter-spacing: -3px; margin: 18px 0 24px; }
.office-copy > p { max-width: 570px; line-height: 1.7; color: var(--muted); font-size: 16px; }
.office-points { display: flex; flex-wrap: wrap; gap: 14px 28px; margin-top: 30px; font-size: 12px; font-weight: 800; }
.office-points span::first-letter { color: var(--green); }
.login-card { background: var(--paper); border: 1px solid var(--line); padding: 32px; box-shadow: 0 18px 50px rgba(20,35,31,.08); display: grid; gap: 18px; border-radius: 5px; }
.login-head { display: flex; align-items: center; gap: 15px; margin-bottom: 7px; }
.lock-mark { width: 45px; height: 45px; background: var(--ink); color: var(--lime); display: grid; place-items: center; font-weight: 950; }
.login-head h3 { margin: 0 0 4px; font-size: 19px; }
.login-head p, .demo-hint { color: var(--muted); margin: 0; font-size: 11px; }
.login-card label, .form-grid label, .package-row label { display: grid; gap: 8px; font-size: 11px; font-weight: 850; color: #4b5954; }
.login-card input, .form-grid input, .form-grid select, .form-grid textarea, .package-row input { width: 100%; border: 1px solid #d3d9d4; background: white; min-height: 46px; padding: 0 13px; outline: 0; border-radius: 3px; color: var(--ink); }
input:focus, select:focus, textarea:focus { border-color: var(--green) !important; box-shadow: 0 0 0 3px rgba(22,107,75,.1); }
.demo-hint { text-align: center; }
footer { min-height: 100px; background: var(--cream); display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: center; padding: 0 max(5vw, 32px); font-size: 11px; color: var(--muted); border-top: 1px solid #dfe0d8; }
footer p { text-align: center; } footer > span { text-align: right; }

/* Shared headers */
.light-header { height: 82px; padding: 0 max(5vw, 32px); display: flex; align-items: center; justify-content: space-between; background: white; border-bottom: 1px solid var(--line); }
.light-header > div { display: flex; align-items: center; gap: 28px; font-size: 12px; font-weight: 800; }
.staff-link { background: var(--ink); color: white; padding: 12px 16px; border-radius: 2px; }

/* Order form */
.order-page { background: var(--paper); min-height: 100vh; }
.order-hero { background: var(--ink); color: white; padding: 62px max(8vw, 60px); display: grid; grid-template-columns: 1fr auto; gap: 80px; align-items: end; }
.order-hero .section-kicker { color: var(--lime); }
.order-hero h1 { font-size: 62px; line-height: .95; letter-spacing: -4px; margin: 16px 0 22px; }
.order-hero p { max-width: 610px; color: #aebcb6; line-height: 1.6; margin: 0; }
.order-hero ol { list-style: none; display: flex; padding: 0; margin: 0 0 10px; counter-reset: x; }
.order-hero li { display: grid; gap: 8px; font-size: 9px; color: #7f9189; min-width: 118px; position: relative; }
.order-hero li:not(:last-child)::after { content:""; height: 1px; background: #43554f; position: absolute; left: 27px; right: 8px; top: 12px; }
.order-hero li span { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 50%; background: #40524c; color: white; font-size: 10px; z-index: 1; }
.order-hero li.active { color: white; }.order-hero li.active span { background: var(--lime); color: var(--ink); }
.order-form { max-width: 1080px; margin: 0 auto; padding: 55px 30px 90px; }
.form-section { background: white; border: 1px solid var(--line); padding: 34px; margin-bottom: 22px; border-radius: 4px; box-shadow: 0 5px 18px rgba(20,35,31,.03); }
.form-section-title { display: flex; align-items: center; gap: 14px; padding-bottom: 25px; border-bottom: 1px solid #edf0ed; margin-bottom: 26px; }
.form-section-title > span { width: 33px; height: 33px; display: grid; place-items: center; border-radius: 50%; background: var(--ink); color: white; font-size: 12px; font-weight: 900; }
.form-section-title h2 { margin: 0 0 4px; font-size: 19px; }.form-section-title p { margin: 0; font-size: 11px; color: var(--muted); }
.service-options { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.service-options label { border: 1px solid #dfe4df; padding: 18px; display: flex; min-height: 165px; flex-direction: column; gap: 8px; position: relative; cursor: pointer; border-radius: 3px; transition: border .2s, background .2s; }
.service-options label.selected { border: 2px solid var(--green); background: #f0f8f3; padding: 17px; }
.service-options input { position: absolute; opacity: 0; }.option-icon { width: 37px; height: 37px; display: grid; place-items: center; background: #edf1ed; color: var(--green); border-radius: 50%; font-size: 18px; margin-bottom: 7px; }
.service-options label strong { font-size: 13px; }.service-options label small { color: var(--muted); line-height: 1.5; font-size: 10px; }
.service-options label i { display: none; position: absolute; right: 12px; top: 12px; width: 20px; height: 20px; place-items: center; border-radius: 50%; background: var(--green); color: white; font-style: normal; font-size: 10px; }
.service-options label.selected i { display: grid; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.form-grid label.span-2 { grid-column: span 2; }.form-grid label small, .package-row label small { color: #9aa39f; font-weight: 500; }
.form-grid select { appearance: none; background: white linear-gradient(45deg, transparent 50%, #6d7974 50%) calc(100% - 16px) 20px/5px 5px no-repeat; }
.form-grid textarea { padding-top: 13px; min-height: 88px; resize: vertical; }
.order-form input,.order-form select,.order-form textarea { font-weight: 400; }
.order-form input::placeholder,.order-form textarea::placeholder { font-weight: 400; }
.package-title > b { margin-left: auto; font-size: 10px; color: var(--green); background: #e9f3ed; padding: 7px 9px; border-radius: 2px; }
.package-list { display: grid; gap: 10px; }
.package-row { display: grid; grid-template-columns: 64px 1.3fr .55fr 1fr 25px; gap: 14px; align-items: end; background: #f6f7f3; padding: 15px; border-radius: 3px; }
.package-number { display: grid; place-items: center; height: 58px; background: var(--ink); color: white; border-radius: 2px; }.package-number span { font-size: 7px; letter-spacing: 1px; color: #aebbb6; }.package-number strong { font-size: 17px; }
.dimensions > span { display: block; font-size: 11px; font-weight: 850; color: #4b5954; margin-bottom: 8px; }.dimensions small { color: #9aa39f; font-weight: 500; }
.dimensions > div { display: grid; grid-template-columns: 1fr 8px 1fr 8px 1fr; gap: 5px; align-items: center; }
.dimensions input { min-width: 0; height: 46px; border: 1px solid #d3d9d4; padding: 0 6px; text-align: center; }.dimensions i { font-style: normal; font-size: 11px; color: var(--muted); }
.remove-package { height: 32px; width: 25px; border: 0; background: transparent; color: #a3aaa6; font-size: 20px; margin-bottom: 7px; }
.add-package { background: transparent; border: 1px dashed #bdc8c1; color: var(--green); width: 100%; height: 44px; margin-top: 13px; font-weight: 800; font-size: 11px; }
.submit-bar { background: var(--ink); color: white; padding: 22px 25px; display: flex; justify-content: space-between; align-items: center; border-radius: 4px; box-shadow: 0 15px 35px rgba(20,35,31,.18); }
.submit-bar > div { display: grid; gap: 5px; }.submit-bar > div span { font-size: 12px; font-weight: 800; }.submit-bar > div small { color: #98aaa2; font-size: 10px; }
.submit-bar .button { min-width: 190px; }.submit-error { text-align: center; }
.success-page { min-height: 100vh; background: var(--ink); display: grid; place-items: center; padding: 30px; }
.success-card { width: min(520px, 100%); background: white; padding: 45px; text-align: center; box-shadow: 0 30px 80px rgba(0,0,0,.3); }
.success-card .brand { margin: 0 auto 40px; }.success-check { margin: 0 auto 25px; display: grid; place-items: center; width: 62px; height: 62px; border-radius: 50%; background: var(--green); color: white; font-size: 27px; }
.success-card .section-kicker { color: var(--orange); }.success-card h1 { font-family: Georgia, serif; font-size: 52px; margin: 8px 0 15px; }.success-card > p { color: var(--muted); line-height: 1.6; font-size: 13px; }
.tracking-ticket { border: 1px dashed #b9c2bc; background: var(--cream); padding: 21px; display: grid; gap: 7px; margin: 28px 0; }
.tracking-ticket span { font-size: 8px; letter-spacing: 1.8px; font-weight: 900; }.tracking-ticket strong { font-size: 24px; letter-spacing: 2px; }.tracking-ticket small { color: var(--muted); font-size: 9px; }
.success-card .button { width: 100%; }.text-button { background: transparent; border: 0; margin-top: 16px; color: var(--green); font-size: 11px; font-weight: 800; }

/* Tracking */
.track-page { min-height: 100vh; display: flex; flex-direction: column; background: var(--paper); }
.track-search { flex: 1; text-align: center; padding: 120px 30px; background: radial-gradient(circle at center 30%, #fff 0, var(--paper) 55%); }
.track-search .section-kicker { color: var(--orange); }.track-search h1 { font-size: 60px; margin: 16px 0 12px; letter-spacing: -3px; }.track-search > p { color: var(--muted); }
.track-search form { max-width: 600px; margin: 35px auto 17px; display: grid; grid-template-columns: 1fr auto; background: white; padding: 7px; border: 1px solid #d9dfda; box-shadow: 0 15px 35px rgba(20,35,31,.08); }
.track-search input { border: 0; outline: 0; padding: 0 15px; letter-spacing: 1px; font-weight: 800; }.track-search > small { color: #8c9692; font-size: 10px; }
.track-result { width: min(1180px, calc(100% - 50px)); margin: 0 auto; padding: 50px 0 80px; flex: 1; }
.track-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 28px; }.back-link { border: 0; background: transparent; padding: 0; color: var(--green); font-size: 11px; font-weight: 800; margin-bottom: 25px; }
.track-heading .section-kicker { display: block; color: var(--orange); }.track-heading h1 { font-size: 42px; margin: 9px 0 7px; letter-spacing: -2px; }.track-heading h1 em { font-family: Georgia,serif; color: var(--green); font-weight: 400; }.track-heading p { margin: 0; color: var(--muted); font-size: 11px; }
.status-pill { padding: 8px 12px; border-radius: 20px; text-transform: uppercase; font-size: 8px; letter-spacing: 1.2px; font-weight: 900; background: #e8ece9; color: #596661; }
.status-pending { background: #fff0d4; color: #a55e12; }.status-quoted { background: #e4edff; color: #3f63aa; }.status-confirmed { background: #dff3e6; color: #197248; }.status-assigned,.status-collected { background: #def0f4; color: #24768a; }.status-delivered { background: var(--green); color: white; }
.progress-card { background: white; border: 1px solid var(--line); padding: 28px; display: grid; grid-template-columns: repeat(6, 1fr); margin-bottom: 20px; }
.progress-card div { display: grid; justify-items: center; gap: 9px; position: relative; color: #adb5b1; }.progress-card div:not(:last-child)::after { content:""; height: 2px; background: #e3e8e4; left: calc(50% + 17px); right: calc(-50% + 17px); top: 14px; position: absolute; }
.progress-card div.done:not(:last-child)::after { background: var(--green); }.progress-card span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: #edf0ed; font-size: 10px; font-weight: 900; z-index: 1; }.progress-card b { font-size: 9px; }
.progress-card .done { color: var(--ink); }.progress-card .done span { background: var(--green); color: white; }
.notice-card { display: flex; gap: 18px; background: #fff7e8; border: 1px solid #f0d7ae; padding: 22px; align-items: flex-start; }.notice-card > span { font-size: 24px; }.notice-card b { font-size: 13px; }.notice-card p { margin: 6px 0 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.quote-card { background: var(--ink); color: white; padding: 34px; display: flex; justify-content: space-between; align-items: center; margin-bottom: 22px; }.quote-card span { color: var(--lime); font-size: 9px; letter-spacing: 2px; font-weight: 900; }.quote-card h2 { font-size: 42px; margin: 8px 0 5px; }.quote-card p { color: #a5b5ae; font-size: 11px; margin: 0; }
.label-release { background: white; border: 1px solid var(--line); padding: 32px; margin-bottom: 22px; }.label-release-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; }.label-release-head .section-kicker { color: var(--orange); }.label-release-head h2 { margin: 7px 0; }.label-release-head p { margin: 0; font-size: 11px; color: var(--muted); }
.label-print-page { min-height: 100vh; padding: 34px 20px 60px; background: #eef1ed; }
.label-print-toolbar { width: min(900px, 100%); margin: 0 auto 24px; padding: 22px 26px; display: flex; align-items: center; justify-content: space-between; gap: 24px; background: white; border: 1px solid var(--line); }
.label-print-toolbar h1 { margin: 5px 0; font-size: 30px; }.label-print-toolbar p { margin: 0; color: var(--muted); font-size: 11px; }.label-print-toolbar > div:last-child { display: flex; gap: 8px; flex: none; }
.label-sheet-list { display: grid; justify-items: center; gap: 24px; }
.shipping-label { box-sizing: border-box; width: 100mm; min-height: 150mm; padding: 3mm; border: .5mm solid #111; background: white; color: #111; font-family: Arial, sans-serif; break-inside: avoid; box-shadow: 0 8px 28px rgba(15,30,25,.13); page: shipping-label; }
.label-brand { height: 13mm; display: flex; align-items: center; gap: 2mm; border-bottom: .5mm solid #111; }.label-brand > img { width: 24mm; height: 10mm; object-fit: cover; object-position: center; }.label-brand > div { display: grid; }.label-brand > div b { font-size: 9pt; }.label-brand > div small { font-size: 5pt; letter-spacing: 1px; }.label-brand > span { margin-left: auto; font-weight: 900; font-size: 7pt; }
.label-barcode { height: 13mm; margin: 3mm 8mm 0; background: repeating-linear-gradient(90deg,#111 0 1px,transparent 1px 2px,#111 2px 4px,transparent 4px 5px,#111 5px 6px,transparent 6px 9px,#111 9px 12px,transparent 12px 14px); }.label-id { display: block; text-align: center; font-size: 10pt; letter-spacing: 2px; line-height: 1.2; }.label-account { display: block; text-align: center; font-size: 5.5pt; font-weight: 700; margin: 1mm 0 2mm; }
.label-body { min-height: 76mm; display: grid; grid-template-columns: 32mm 1fr; border: .35mm solid #111; }.label-routing { display: flex; flex-direction: column; align-items: center; border-right: .35mm solid #111; text-align: center; }.label-routing > strong { align-self: stretch; padding: 2mm 1mm; background: #111; color: white; font-size: 11pt; }.label-routing > span { margin: 2mm 0 1mm; font-size: 6pt; font-weight: 800; }.label-routing > p { margin: 1mm 0 0; font-size: 5pt; font-weight: 700; }
.label-qr { width: 27mm; height: 27mm; display: grid; place-items: center; overflow: hidden; background: white; }.label-qr canvas,.label-qr img { width: 27mm !important; height: 27mm !important; image-rendering: pixelated; }.label-qr > small { padding: 8mm 1mm; font-size: 5pt; overflow-wrap: anywhere; }
.label-parties { display: grid; grid-template-rows: 1fr 1.25fr; }.label-parties section { padding: 2.5mm; }.label-parties section + section { border-top: .35mm solid #111; }.label-parties span,.label-package span { display: block; margin-bottom: 1mm; font-size: 5.5pt; font-weight: 900; letter-spacing: .8px; }.label-parties b { font-size: 8.5pt; }.label-parties p { margin: 1.5mm 0; font-size: 7.5pt; line-height: 1.35; text-align: left; }.label-parties small { font-size: 6.5pt; font-weight: 700; line-height: 1.35; }
.label-package { min-height: 26mm; display: grid; grid-template-columns: 1fr 1fr; border: .35mm solid #111; border-top: 0; }.label-package > div { padding: 2mm; }.label-package > div:nth-child(2) { border-left: .35mm solid #111; }.label-package > div:nth-child(3) { grid-column: 1 / -1; border-top: .35mm solid #111; }.label-package b { font-size: 6.5pt; }.label-package > strong { grid-column: 1 / -1; padding-top: 1.5mm; border-top: .35mm solid #111; text-align: center; font-size: 8pt; letter-spacing: 1.5px; }
.order-summary-grid { display: grid; grid-template-columns: 1fr 1fr .7fr; background: white; border: 1px solid var(--line); }.order-summary-grid > div { padding: 25px; }.order-summary-grid > div + div { border-left: 1px solid var(--line); }.order-summary-grid span { display: block; font-size: 8px; letter-spacing: 1.4px; color: var(--orange); font-weight: 900; margin-bottom: 8px; }.order-summary-grid b { font-size: 13px; }.order-summary-grid p { font-size: 11px; line-height: 1.5; color: var(--muted); }.order-summary-grid small { font-size: 10px; font-weight: 700; }

/* Office auth */
.office-login-page { min-height: 100vh; display: grid; grid-template-columns: 1.1fr .9fr; background: white; }
.office-login-visual { background: var(--ink); color: white; padding: 50px 7vw; display: flex; flex-direction: column; justify-content: space-between; position: relative; overflow: hidden; }.office-login-visual::after { content:"MZ"; position: absolute; right: -25px; bottom: 20px; font-size: 230px; line-height: .8; font-weight: 950; color: rgba(255,255,255,.025); transform: rotate(-8deg); }
.office-login-visual .section-kicker { color: var(--lime); }.office-login-visual h1 { font-size: 68px; letter-spacing: -4px; line-height: .95; margin: 18px 0; }.office-login-visual p { color: #a6b7b0; max-width: 510px; line-height: 1.6; }.office-login-visual > small { color: #71857c; }
.office-login-card { align-self: center; width: min(410px, calc(100% - 60px)); justify-self: center; box-shadow: none; background: white; }.office-login-card > a { text-align: center; font-size: 11px; color: var(--green); font-weight: 700; margin-top: 8px; }

/* Office */
.office-app { min-height: 100vh; background: #f0f2ee; display: grid; grid-template-columns: 225px 1fr; }
.office-app > aside { height: 100vh; position: sticky; top: 0; background: var(--ink); color: white; padding: 27px 18px 18px; display: flex; flex-direction: column; }
.office-app aside .brand { margin: 0 10px 40px; }.office-app aside nav { display: grid; gap: 5px; }.office-app aside nav button { border: 0; background: transparent; color: #91a59c; display: flex; align-items: center; gap: 12px; padding: 12px; text-align: left; border-radius: 3px; font-size: 11px; font-weight: 800; }.office-app aside nav button span { width: 20px; font-size: 16px; }.office-app aside nav button b { margin-left: auto; background: var(--orange); color: white; min-width: 20px; height: 20px; display: grid; place-items: center; border-radius: 10px; font-size: 8px; }.office-app aside nav button.active { background: #2b4039; color: white; }
.sidebar-card { margin-top: auto; background: #263b34; padding: 14px; border-radius: 4px; }.sidebar-card > span { color: var(--lime); font-size: 8px; letter-spacing: 1.6px; font-weight: 900; }.sidebar-card p { font-size: 9px; line-height: 1.5; color: #9aada5; }.sidebar-card button { border: 0; width: 100%; padding: 10px; display: flex; justify-content: space-between; background: white; color: var(--ink); font-size: 9px; font-weight: 800; }.sidebar-card a { display: block; color: #d5e1dc; font-size: 8px; margin-top: 10px; text-align: center; }
.share-order-card label { display: block; margin: 11px 0 5px; color: #c8d5d0; font-size: 9px; font-weight: 700; }
.share-order-card input { width: 100%; height: 36px; border: 1px solid #4b6259; border-radius: 2px; background: #f8faf8; color: var(--ink); padding: 0 9px; font-size: 11px; outline: none; }
.share-order-card input:focus { border-color: var(--lime) !important; box-shadow: 0 0 0 3px rgba(215,243,91,.14); }
.share-order-card button { margin-top: 8px; min-height: 36px; }
.share-order-card #share-order-whatsapp { background: #25d366; color: #0b3b1f; }
.share-order-card .copy-order-link { background: #ffffff; color: var(--ink); }
.share-phone-error { display: block; min-height: 12px; padding-top: 4px; color: #ffb69f; font-size: 8px; }
.staff-profile { display: flex; align-items: center; gap: 9px; margin-top: 16px; border-top: 1px solid #30473e; padding: 16px 6px 0; }.staff-profile > span { width: 31px; height: 31px; display: grid; place-items: center; background: var(--lime); color: var(--ink); border-radius: 50%; font-size: 9px; font-weight: 900; }.staff-profile div { display: grid; gap: 2px; }.staff-profile b { font-size: 9px; }.staff-profile small { font-size: 7px; color: #81958c; }.staff-profile button { margin-left: auto; border: 0; background: transparent; color: #83978e; }
.office-main { padding: 28px 34px; min-width: 0; }.office-main > header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 25px; }.office-main > header .section-kicker { color: #8a9691; font-size: 8px; }.office-main > header h1 { margin: 5px 0 0; font-size: 28px; letter-spacing: -1px; }.office-main > header h1 em { color: var(--green); font-family: Georgia,serif; font-weight: 400; }
.header-tools { display: flex; gap: 10px; }.header-tools > button { width: 42px; border: 1px solid #d7ddd8; background: white; font-size: 18px; }.header-tools .button { min-height: 42px; font-size: 10px; padding: 0 14px; }
.kpi-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 11px; margin-bottom: 16px; }.kpi-grid > a { background: white; border: 1px solid #dfe4df; padding: 16px; display: grid; grid-template-columns: 1fr auto; text-align: left; min-height: 100px; position: relative; }.kpi-grid > a:hover,.kpi-grid > a.active { border-color: var(--green); }.kpi-grid > a > span { grid-column: span 2; font-size: 7px; letter-spacing: 1.2px; color: #7f8c87; font-weight: 900; }.kpi-grid > a strong { font-size: 29px; align-self: end; }.kpi-grid > a small { position: absolute; left: 53px; bottom: 21px; font-size: 8px; color: #8d9894; }.kpi-grid > a i { width: 28px; height: 28px; align-self: end; display: grid; place-items: center; background: #edf0ee; color: #61706a; border-radius: 50%; font-style: normal; font-size: 11px; }.kpi-grid > a i.amber { background: #fff0d5; color: #bf741e; }.kpi-grid > a i.green { background: #dff3e6; color: var(--green); }.kpi-grid > a i.blue { background: #dceff4; color: #2a7688; }
.orders-workspace { background: white; border: 1px solid #dde2de; height: calc(100vh - 250px); min-height: 540px; display: grid; grid-template-columns: 360px 1fr; }.order-list-panel { border-right: 1px solid #e1e5e2; min-width: 0; display: flex; flex-direction: column; }.panel-head { height: 61px; display: flex; align-items: center; justify-content: space-between; padding: 0 18px; border-bottom: 1px solid #e9ece9; }.panel-head > div { display: flex; align-items: baseline; gap: 8px; }.panel-head h2 { margin: 0; font-size: 16px; }.panel-head span { font-size: 8px; color: #8c9893; }.panel-head button { border: 0; background: transparent; color: var(--green); font-size: 8px; font-weight: 800; }
.list-toolbar { display: grid; grid-template-columns: 1fr 105px; gap: 7px; padding: 10px; background: #f8f9f7; border-bottom: 1px solid #e7ebe8; }.list-toolbar label { border: 1px solid #dce2dd; background: white; display: flex; align-items: center; padding: 0 9px; gap: 6px; color: #85928c; }.list-toolbar input,.list-toolbar select { border: 0; outline: 0; width: 100%; height: 31px; background: white; font-size: 9px; }.list-toolbar select { border: 1px solid #dce2dd; padding: 0 5px; color: #56645f; }
.order-list { overflow-y: auto; flex: 1; }.order-list > a { display: block; width: 100%; border: 0; border-bottom: 1px solid #ecefec; background: white; padding: 13px 16px; text-align: left; position: relative; }.order-list > a.selected { background: #f1f7f3; }.order-list > a.selected::before { content:""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--green); }.list-top { display: flex; align-items: center; gap: 7px; }.status-dot { width: 6px; height: 6px; border-radius: 50%; background: #a5aeaa; }.dot-pending { background: #e39b35; }.dot-quoted { background: #4d74bf; }.dot-confirmed { background: var(--green); }.dot-assigned,.dot-collected { background: #31889b; }.list-top b { font-size: 8px; letter-spacing: .4px; }.list-top > span:last-child { margin-left: auto; color: #9aa39f; font-size: 7px; }.order-list > a > strong { display: block; font-size: 11px; margin: 8px 0 6px; }.route-mini { display: flex; gap: 6px; align-items: center; color: #6c7974; font-size: 8px; }.route-mini i { color: #9da8a3; font-style: normal; }.list-bottom { display: flex; align-items: center; margin-top: 8px; }.list-bottom small { font-size: 8px; color: #89948f; }.list-bottom em { margin-left: auto; font-size: 6px; letter-spacing: .7px; text-transform: uppercase; font-style: normal; font-weight: 900; padding: 5px 7px; border-radius: 10px; background: #edf0ee; }.tag-pending { color: #a96013; background: #fff0d4 !important; }.tag-quoted { color: #3f63aa; background: #e6eeff !important; }.tag-confirmed { color: #197248; background: #dff3e6 !important; }
.empty-list { text-align: center; color: #8f9995; font-size: 10px; padding: 35px; }
.order-detail-panel { min-width: 0; display: flex; flex-direction: column; }.empty-detail { margin: auto; text-align: center; color: #7b8983; }.empty-detail > span { font-size: 35px; }.empty-detail h3 { color: var(--ink); margin-bottom: 6px; }.empty-detail p { font-size: 10px; }
.detail-head { height: 75px; display: flex; align-items: center; padding: 0 22px; border-bottom: 1px solid #e7ebe8; }.detail-head .section-kicker { font-size: 7px; color: #87928e; }.detail-head h2 { font-size: 16px; margin: 4px 0 2px; }.detail-head p { font-size: 7px; margin: 0; color: #96a09c; }.detail-head > .status-pill { margin-left: auto; }
.detail-scroll { overflow-y: auto; flex: 1; }.route-detail { display: grid; grid-template-rows: auto 24px auto; padding: 20px 25px; border-bottom: 1px solid #edf0ed; }.route-detail > div { display: grid; grid-template-columns: 29px 1fr; gap: 11px; }.route-letter { width: 27px; height: 27px; display: grid; place-items: center; background: var(--green); color: white; border-radius: 50%; font-size: 8px; font-weight: 900; }.route-letter.orange { background: var(--orange); }.route-detail > i { margin-left: 13px; border-left: 1px dashed #aab6b0; }.route-detail section { display: grid; gap: 3px; }.route-detail section small { font-size: 6px; letter-spacing: 1px; color: #89958f; font-weight: 900; }.route-detail section b { font-size: 10px; }.route-detail section p { margin: 0; font-size: 8px; line-height: 1.4; color: #6f7c77; }.route-detail section em { font-style: normal; font-size: 7px; font-weight: 700; }
.detail-section { padding: 18px 25px; border-bottom: 1px solid #edf0ed; }.detail-title { display: flex; justify-content: space-between; align-items: center; }.detail-title h3,.activity h3 { font-size: 11px; margin: 0; }.detail-title span { font-size: 7px; background: #edf1ee; padding: 4px 6px; }
.detail-section table { border-collapse: collapse; width: 100%; margin: 10px 0; }.detail-section th { text-align: left; font-size: 6px; letter-spacing: .8px; color: #96a09c; padding: 7px; border-bottom: 1px solid #e9ece9; }.detail-section td { font-size: 8px; padding: 8px 7px; border-bottom: 1px solid #eef1ef; }.detail-section td:first-child { display: flex; align-items: center; gap: 8px; }.detail-section td div { display: grid; gap: 2px; }.detail-section td b { font-size: 8px; }.detail-section td small { font-size: 6px; color: #929c98; }.pkg-cube { width: 24px; height: 24px; display: grid; place-items: center; background: #edf1ee; color: var(--green); font-size: 14px; }
.pickup-note { display: flex; gap: 9px; align-items: center; background: #f3f6f3; padding: 9px; }.pickup-note > span { width: 24px; height: 24px; display: grid; place-items: center; background: white; color: var(--green); }.pickup-note div { display: grid; gap: 2px; }.pickup-note small,.customer-note small { font-size: 6px; color: #8d9893; letter-spacing: .8px; font-weight: 900; }.pickup-note b { font-size: 8px; }.customer-note { padding: 9px; margin-top: 7px; border-left: 2px solid var(--orange); background: #fff9f2; }.customer-note p { margin: 4px 0 0; font-size: 8px; color: #6d7974; }
.activity { padding: 18px 25px; display: grid; gap: 12px; }.activity > div { display: flex; gap: 9px; align-items: center; }.activity > div > span { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 50%; background: #e6f2ea; color: var(--green); font-size: 7px; font-weight: 900; }.activity p { display: grid; gap: 2px; margin: 0; }.activity b { font-size: 8px; }.activity small { font-size: 6px; color: #8d9894; }
.action-dock { min-height: 70px; padding: 12px 18px; border-top: 1px solid #dfe4e0; box-shadow: 0 -7px 20px rgba(20,35,31,.04); display: flex; gap: 9px; align-items: center; }.action-dock .button { min-height: 42px; font-size: 9px; flex: 1; padding: 0 13px; }.quote-input { display: flex; align-items: center; height: 42px; border: 1px solid #ced6d0; width: 175px; background: #fff; }.quote-input span { align-self: stretch; display: grid; place-items: center; padding: 0 11px; font-size: 10px; font-weight: 900; color: #52615b; background: #edf1ee; border-right: 1px solid #d7ddd8; }.quote-input input { border: 0; outline: 0; width: 100%; min-width: 0; padding: 0 12px; font-family: Arial, Helvetica, sans-serif; font-size: 18px; font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: .4px; text-align: right; color: var(--ink); }.whatsapp-button { background: #25d366; color: #0b3b1f; }.action-dock select { height: 42px; border: 1px solid #d2d9d4; padding: 0 9px; flex: 1; font-size: 9px; }.assigned-driver { display: flex; align-items: center; gap: 8px; flex: 1; }.assigned-driver > span { width: 34px; height: 34px; display: grid; place-items: center; background: #dff0f3; color: #2b7f91; border-radius: 50%; }.assigned-driver div { display: grid; gap: 2px; }.assigned-driver small { font-size: 6px; color: #84918b; }.assigned-driver b { font-size: 9px; }.full-action { width: 100%; }.complete-message { margin: auto; color: var(--green); font-size: 11px; font-weight: 900; }
.dock-form { display: flex; gap: 9px; align-items: center; width: 100%; }
.panel-head a { border: 0; background: transparent; color: var(--green); font-size: 8px; font-weight: 800; }
.staff-profile > a { margin-left: auto; color: #83978e; }
.label-brand > img { background: #078c46; }

/* Office readability */
.office-app,.orders-workspace { font-family: Arial, Helvetica, sans-serif; font-size: 14px; }
.panel-head span,.panel-head a { font-size: 11px; }
.list-toolbar input,.list-toolbar select { font-size: 12px; height: 38px; }
.order-list > a { padding: 16px 18px; }
.list-top b { font-size: 11px; }
.list-top > span:last-child { font-size: 10px; }
.order-list > a > strong { font-size: 14px; margin: 10px 0 8px; }
.route-mini { font-size: 12px; }
.list-bottom small { font-size: 11px; }
.list-bottom em { font-size: 9px; padding: 6px 9px; }
.detail-head { min-height: 86px; height: auto; }
.detail-head .section-kicker { font-size: 10px; }
.detail-head h2 { font-size: 20px; }
.detail-head p { font-size: 11px; }
.route-letter { width: 32px; height: 32px; font-size: 11px; }
.route-detail > div { grid-template-columns: 34px 1fr; }
.route-detail section { gap: 5px; }
.route-detail section small { font-size: 10px; }
.route-detail section b { font-size: 14px; }
.route-detail section p { font-size: 12px; line-height: 1.55; }
.route-detail section em { font-size: 11px; }
.detail-title h3,.activity h3 { font-size: 15px; }
.detail-title span { font-size: 10px; }
.detail-section th { font-size: 10px; padding: 10px 8px; }
.detail-section td { font-size: 12px; padding: 11px 8px; }
.detail-section td b { font-size: 12px; }
.detail-section td small { font-size: 10px; }
.pickup-note small,.customer-note small { font-size: 9px; }
.pickup-note b,.customer-note p { font-size: 12px; }
.activity b { font-size: 12px; }
.activity small { font-size: 10px; }
.activity > div > span { width: 30px; height: 30px; font-size: 9px; }
.action-dock .button,.action-dock select { font-size: 12px; }
.assigned-driver small { font-size: 9px; }
.assigned-driver b { font-size: 12px; }

/* Invoice */
.invoice-page { min-height: 100vh; padding: 28px; background: #eef1ef; font-family: Arial, Helvetica, sans-serif; color: #17231f; }
.invoice-actions { max-width: 980px; margin: 0 auto 14px; display: flex; justify-content: flex-end; gap: 8px; }
.invoice-sheet { max-width: 980px; margin: 0 auto; background: white; padding: 38px 42px; box-shadow: 0 10px 30px rgba(20,35,31,.1); }
.invoice-header { display: flex; justify-content: space-between; gap: 35px; padding-bottom: 24px; border-bottom: 2px solid #18352c; }
.invoice-company { display: flex; align-items: flex-start; gap: 18px; }
.invoice-company img { width: 125px; height: 78px; object-fit: cover; object-position: center; }
.invoice-company h1 { margin: 4px 0 8px; font-size: 24px; }
.invoice-company p { margin: 3px 0; color: #5c6a65; font-size: 12px; line-height: 1.45; }
.invoice-title { text-align: right; display: grid; gap: 7px; }
.invoice-title span,.invoice-meta span,.invoice-note span { color: #178052; font-size: 10px; letter-spacing: 1.7px; font-weight: 900; }
.invoice-title strong { font-size: 25px; }
.invoice-title small { font-size: 12px; color: #6c7974; }
.invoice-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin: 28px 0; }
.invoice-meta > div { padding: 18px; border: 1px solid #dce2dd; background: #fbfcfa; }
.invoice-meta h2 { margin: 8px 0; font-size: 16px; }
.invoice-meta p { margin: 4px 0; color: #5f6d68; font-size: 12px; line-height: 1.5; }
.invoice-table { width: 100%; border-collapse: collapse; margin: 18px 0 28px; }
.invoice-table th { padding: 12px 10px; background: #18352c; color: white; text-align: left; font-size: 10px; letter-spacing: .7px; }
.invoice-table td { padding: 14px 10px; border-bottom: 1px solid #e2e6e3; font-size: 13px; }
.invoice-table td small { display: block; margin-top: 4px; color: #77837e; }
.invoice-table th:nth-last-child(-n+3),.invoice-table td:nth-last-child(-n+3) { text-align: right; }
.invoice-bottom { display: grid; grid-template-columns: 1fr 340px; gap: 45px; align-items: start; }
.invoice-note p { color: #68756f; font-size: 12px; }
.invoice-totals p { display: flex; justify-content: space-between; margin: 0; padding: 10px 12px; border-bottom: 1px solid #e2e6e3; font-size: 13px; }
.invoice-totals .grand-total { background: #d7f35b; border: 0; font-size: 18px; }
.invoice-totals > small { display: block; text-align: right; margin-top: 10px; color: #65716c; }
.invoice-footer { display: block; min-height: 0; margin-top: 40px; padding: 18px 0 0; border-top: 1px solid #dfe4e0; background: white; text-align: center; color: #7b8782; font-size: 10px; }

@media (max-width: 700px) {
  .invoice-page { padding: 10px; }
  .invoice-actions { flex-wrap: wrap; }
  .invoice-sheet { padding: 24px 18px; }
  .invoice-header,.invoice-company { flex-direction: column; }
  .invoice-title { text-align: left; }
  .invoice-meta,.invoice-bottom { grid-template-columns: 1fr; }
  .invoice-table { display: block; overflow-x: auto; }
}

@media (max-width: 1050px) {
  .hero { grid-template-columns: 1fr; }.hero-panel { max-width: 680px; margin: 0 auto; }.service-strip { grid-template-columns: 1fr 1fr; }.service-intro { grid-column: span 2; }.office-section { grid-template-columns: 1fr 390px; gap: 50px; }
  .service-options { grid-template-columns: 1fr 1fr; }.office-app { grid-template-columns: 72px 1fr; }.office-app > aside { padding: 25px 10px; }.office-app aside .brand { margin-left: 7px; }.office-app aside .brand-words,.office-app aside nav button:not(.active) b,.office-app aside nav button { font-size: 0; }.office-app aside nav button span { font-size: 16px; }.office-app aside nav button { justify-content: center; }.sidebar-card,.staff-profile div,.staff-profile button { display: none; }.staff-profile { justify-content: center; }.orders-workspace { grid-template-columns: 320px 1fr; }
}

@media (max-width: 760px) {
  .top-nav { height: 72px; padding: 0 18px; }.nav-actions > a:not(.nav-order) { display: none; }.hero { padding: 50px 22px 65px; min-height: auto; }.hero h1 { font-size: 58px; letter-spacing: -4px; }.hero-lead { font-size: 15px; }.trust-row { gap: 15px; flex-wrap: wrap; }.route-map { height: 260px; }.delivery-chip { right: 10px; }.service-strip { grid-template-columns: 1fr; padding: 55px 20px; gap: 10px; }.service-intro { grid-column: auto; }.service-card { min-height: 250px; }.office-section { grid-template-columns: 1fr; padding: 60px 22px; }.office-copy h2 { font-size: 43px; }.light-header { padding: 0 18px; }.light-header > div > a:first-child { display: none; }.order-hero { padding: 45px 22px; grid-template-columns: 1fr; gap: 35px; }.order-hero h1 { font-size: 48px; }.order-hero ol { overflow-x: auto; }.order-form { padding: 30px 14px 60px; }.form-section { padding: 22px 17px; }.service-options,.form-grid { grid-template-columns: 1fr; }.form-grid label.span-2 { grid-column: auto; }.package-row { grid-template-columns: 48px 1fr 25px; }.package-desc { grid-column: span 1; }.package-row > label:not(.package-desc),.dimensions { grid-column: span 2; }.submit-bar { flex-direction: column; align-items: stretch; gap: 18px; }.success-card { padding: 32px 21px; }.track-search { padding: 85px 18px; }.track-search h1 { font-size: 45px; }.track-search form { grid-template-columns: 1fr; gap: 7px; }.track-search input { min-height: 50px; }.track-result { width: calc(100% - 28px); }.track-heading,.quote-card,.label-release-head { align-items: flex-start; flex-direction: column; gap: 20px; }.progress-card { grid-template-columns: repeat(3,1fr); gap: 18px 0; }.progress-card div:nth-child(3)::after { display: none; }.order-summary-grid { grid-template-columns: 1fr; }.order-summary-grid > div + div { border-left: 0; border-top: 1px solid var(--line); }.label-print-page { padding: 20px 0 40px; overflow-x: auto; }.label-print-toolbar { width: calc(100% - 28px); align-items: flex-start; flex-direction: column; }.office-login-page { grid-template-columns: 1fr; }.office-login-visual { min-height: 43vh; padding: 35px 25px; }.office-login-visual h1 { font-size: 47px; }.office-login-card { margin: 45px 0; }.office-app { grid-template-columns: 1fr; }.office-app > aside { display: none; }.office-main { padding: 18px 12px; }.kpi-grid { grid-template-columns: 1fr 1fr; }.orders-workspace { height: auto; grid-template-columns: 1fr; }.order-list-panel { min-height: 480px; border-right: 0; }.order-detail-panel { min-height: 650px; border-top: 8px solid #f0f2ee; }
  footer { grid-template-columns: 1fr; justify-items: center; padding: 28px; gap: 14px; } footer p,footer > span { text-align: center; margin: 0; }
}

@media print {
  @page shipping-label { size: 100mm 150mm; margin: 0; }
  .invoice-page * { visibility: visible !important; }
  .invoice-page { position: absolute; inset: 0; padding: 0; background: white; }
  .invoice-page .no-print,.invoice-page + footer { display: none !important; }
  .invoice-sheet { box-shadow: none; max-width: none; margin: 0; padding: 10mm; }
  body * { visibility: hidden !important; }
  .label-print-page,.label-print-page * { visibility: visible !important; }
  .label-print-page { position: absolute; inset: 0; padding: 0; background: white; }
  .label-print-page .no-print,.label-print-page + footer { display: none !important; }
  .label-sheet-list { display: block; }
  .shipping-label { width: 100mm; min-height: 150mm; margin: 0; border: 0; box-shadow: none; page-break-after: always; }
  .shipping-label:last-child { page-break-after: auto; }
}