/* NoLaundry design system v3 (home, /start, portal). Layered after nl.css. Sage #3A695A main, #254A3D text/hover, #4C7E6E decorative, gold #B39B5A accent, yellow highlights. */
:root{--g:#3A695A;--g2:#254A3D;--g3:#4C7E6E;--gold:#B39B5A;--y:#FEE136;--y2:#FFF4B8;--s:#EEF5E3;--c:#FBFAF4;--card:#fff;--r:22px;--r2:14px;--sh1:0 1px 2px rgba(37,74,61,.06),0 8px 24px -12px rgba(37,74,61,.18);--sh2:0 2px 4px rgba(37,74,61,.05),0 24px 48px -24px rgba(37,74,61,.35)}
.ds-w{max-width:1180px;margin:0 auto;padding:0 24px}
.ds-eye{display:inline-flex;align-items:center;gap:8px;font:800 12.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--g2)}
.ds-eye:before{content:"";width:22px;height:2px;border-radius:2px;background:var(--gold)}
.ds-h{font-family:var(--disp);text-transform:uppercase;font-weight:400;line-height:.95;letter-spacing:.01em;color:var(--g2);font-size:clamp(34px,4.6vw,58px);margin:12px 0 0}
.ds-h em{font-style:normal;background:linear-gradient(transparent 60%,var(--y) 60%,var(--y) 92%,transparent 92%);padding:0 .06em}
.ds-lede{font-size:clamp(17px,1.5vw,19px);color:#3F5249;max-width:620px;margin-top:14px;line-height:1.55}
.ds-hand{font-family:var(--hand);color:var(--g2);font-size:24px;line-height:1.1}
.ds-sec{padding:clamp(64px,8vw,104px) 0}
.ds-sec.alt{background:#fff}
.ds-sec.sage{background:var(--s)}
.ds-c{text-align:center}.ds-c .ds-lede{margin-left:auto;margin-right:auto}
.ds-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 30px;border-radius:999px;border:2px solid var(--g);background:var(--g);color:#fff;font:800 15px/1 var(--sans);letter-spacing:.04em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background .2s,border-color .2s,transform .16s,box-shadow .2s;white-space:nowrap}
.ds-btn:hover{background:var(--g2);border-color:var(--g2);transform:translateY(-1px);box-shadow:0 12px 26px -14px rgba(37,74,61,.7)}
.ds-btn:focus-visible,.ds-in:focus-visible,.ds-chip:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.ds-btn.ghost{background:transparent;color:var(--g2)}.ds-btn.ghost:hover{background:var(--g2);color:#fff}
.ds-btn.y{background:var(--y);border-color:var(--y);color:var(--g2)}.ds-btn.y:hover{background:#fff;border-color:#fff}
.ds-btn.block{width:100%}.ds-btn.sm{min-height:44px;padding:0 20px;font-size:13px}
.ds-btn .ar{transition:transform .2s}.ds-btn:hover .ar{transform:translateX(3px)}
.ds-card{background:var(--card);border-radius:var(--r);box-shadow:var(--sh1);border:1px solid rgba(37,74,61,.08)}
.ds-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:var(--s);color:var(--g2);font:800 12px/1.1 var(--sans);letter-spacing:.06em;text-transform:uppercase}
.ds-pill.y{background:var(--y)}.ds-pill.w{background:#fff}
.ds-trust{display:flex;flex-wrap:wrap;gap:10px 22px;list-style:none;padding:0;margin:18px 0 0;font-weight:700;font-size:15px;color:var(--g2)}
.ds-trust li{display:flex;align-items:center;gap:8px}
.ds-trust svg{width:20px;height:20px;flex:none;color:var(--g)}
.ds-ck{width:20px;height:20px;flex:none;border-radius:50%;background:var(--y);display:inline-grid;place-items:center}
.ds-ck:after{content:"";width:8px;height:4px;border:2.5px solid var(--g2);border-top:0;border-right:0;transform:rotate(-45deg) translate(1px,-1px)}
.ds-chip{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 16px;border-radius:999px;border:1.5px solid rgba(37,74,61,.25);background:#fff;color:var(--g2);font:700 15px var(--sans);cursor:pointer}
.ds-chip[aria-pressed=true],.ds-chip.on{background:var(--g);border-color:var(--g);color:#fff}
.ds-in{width:100%;min-height:56px;border-radius:999px;border:1.5px solid rgba(37,74,61,.25);background:#fff;padding:0 22px;font:700 17px var(--sans);color:var(--g2)}
.ds-in::placeholder{color:#5E6F67;font-weight:600}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* timeline (portal + order page) */
.ds-tl{list-style:none;margin:14px 0 4px;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:0;counter-reset:t}
.ds-tl li{position:relative;text-align:center;font:700 12px/1.2 var(--sans);color:#5E6F67;padding-top:34px}
.ds-tl li:before{content:"";position:absolute;top:13px;left:-50%;right:50%;height:3px;background:rgba(37,74,61,.14)}
.ds-tl li:first-child:before{display:none}
.ds-tl li:after{content:"";position:absolute;top:4px;left:50%;width:20px;height:20px;margin-left:-10px;border-radius:50%;background:#fff;border:3px solid rgba(37,74,61,.22);box-sizing:border-box}
.ds-tl li.done{color:var(--g2)}.ds-tl li.done:before,.ds-tl li.now:before{background:var(--g)}
.ds-tl li.done:after{background:var(--g);border-color:var(--g)}
.ds-tl li.now{color:var(--g2);font-weight:900}.ds-tl li.now:after{background:var(--y);border-color:var(--g2);box-shadow:0 0 0 5px rgba(254,225,54,.45)}
@media (max-width:520px){.ds-tl{grid-template-columns:1fr;gap:0}.ds-tl li{text-align:left;padding:0 0 16px 36px;font-size:14px}.ds-tl li:before{top:-50%;bottom:50%;left:9px;right:auto;width:3px;height:auto}.ds-tl li:after{top:0;left:0;margin:0}}
@media (prefers-reduced-motion:reduce){.ds-btn,.ds-btn .ar{transition:none}}