/* Elite Trade & Rider Limited — Hallmark Dusk tokens */
:root{
  --paper: oklch(17.5% 0.014 268); --paper-2: oklch(21% 0.016 268); --paper-3: oklch(25% 0.017 268);
  --ink: oklch(96% 0.006 75); --ink-2: oklch(85% 0.010 262); --muted: oklch(70% 0.016 262);
  --rule: oklch(30% 0.016 266); --accent: oklch(77% 0.10 274); --accent-ink: oklch(19% 0.035 274);
  --accent-hi: oklch(84% 0.085 274); --apricot: oklch(83% 0.095 62); --fog: oklch(94% 0.012 70);
  --well: oklch(95.5% 0.008 75); --card: oklch(99.5% 0.003 75); --well-ink: oklch(21% 0.016 268);
  --well-muted: oklch(47% 0.016 265); --glass: oklch(22% 0.018 268 / 0.58);
  --font-display:"Wix Madefor Display",ui-sans-serif,system-ui,sans-serif;
  --font-body:"Wix Madefor Text",ui-sans-serif,system-ui,sans-serif;
  --radius-card:18px; --radius-inner:10px; --radius-pill:999px;
}
*{box-sizing:border-box}
html,body{overflow-x:clip}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font-body);font-size:17px;line-height:1.55}
h1,h2,h3{font-family:var(--font-display);font-weight:500;letter-spacing:-0.022em;line-height:1.08;margin:0 0 .5em}
h1{font-size:clamp(2.1rem,5.2vw,3.6rem)}
h2{font-size:clamp(1.6rem,3.4vw,2.4rem)}
h3{font-size:1.25rem}
p{margin:0 0 1em;color:var(--ink-2)}
a{color:var(--ink)}
a:hover{color:var(--accent-hi)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
section{padding:72px 0}
.muted{color:var(--muted)}
.btn{display:inline-block;min-height:48px;padding:13px 26px;border:0;border-radius:var(--radius-pill);background:var(--accent);color:var(--accent-ink);font:600 .95rem/1.2 var(--font-body);text-decoration:none;cursor:pointer;box-shadow:inset 0 1px 0 oklch(100% 0 0 / .35)}
.btn:hover{background:var(--accent-hi);color:var(--accent-ink)}
.btn.ghost{background:oklch(100% 0 0 / .06);color:var(--ink);box-shadow:inset 0 0 0 1px oklch(100% 0 0 / .18)}
.btn.ghost:hover{background:oklch(100% 0 0 / .12)}
/* header */
header.site{position:fixed;inset:0 0 auto 0;z-index:60;background:var(--glass);-webkit-backdrop-filter:blur(22px) saturate(1.35);backdrop-filter:blur(22px) saturate(1.35);box-shadow:inset 0 1px 0 oklch(100% 0 0 / .10);border-bottom:1px solid oklch(100% 0 0 / .07)}
header.site .bar{display:flex;align-items:center;gap:22px;max-width:1180px;margin:0 auto;padding:12px 20px}
.wordmark{font-family:var(--font-display);font-weight:600;font-size:1.06rem;color:var(--ink);text-decoration:none;white-space:nowrap}
.wordmark span{color:var(--accent)}
nav.main{display:flex;gap:4px;margin-left:auto;flex-wrap:wrap}
nav.main a{color:var(--ink-2);text-decoration:none;font-size:.95rem;padding:8px 12px;border-radius:var(--radius-pill)}
nav.main a:hover{background:oklch(100% 0 0 / .07);color:var(--ink)}
header.site .btn{min-height:42px;padding:10px 20px}
@media (max-width:760px){nav.main{display:none}}
/* hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;padding:130px 0 90px}
.hero-bg{position:absolute;inset:0;overflow:hidden}
.hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;animation:drift 48s ease-in-out infinite alternate}
@keyframes drift{from{transform:scale(1) translateX(0)}to{transform:scale(1.06) translateX(-1.5%)}}
@media (prefers-reduced-motion: reduce){.hero img.bg{animation:none}*{transition:none!important}}
.hero .scrim{position:absolute;inset:0;background:radial-gradient(ellipse 62% 58% at 18% 40%,oklch(94% 0.02 70 / .82),transparent 75%),linear-gradient(to top,var(--paper) 2%,transparent 34%)}
.hero .inner{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:44px;align-items:center;width:100%}
.hero h1{color:oklch(22% 0.022 268);overflow-wrap:break-word}
.hero .lede{color:oklch(34% 0.02 266);font-size:1.13rem;max-width:34ch}
@media (max-width:900px){.hero .inner{grid-template-columns:1fr}.hero .scrim{background:linear-gradient(oklch(94% 0.015 70 / .88),oklch(94% 0.015 70 / .55) 55%,transparent),linear-gradient(to top,var(--paper) 2%,transparent 40%)}}
.glass{background:var(--glass);-webkit-backdrop-filter:blur(22px) saturate(1.35);backdrop-filter:blur(22px) saturate(1.35);border-radius:var(--radius-card);box-shadow:inset 0 1px 0 oklch(100% 0 0 / .10),inset 0 0 0 1px oklch(100% 0 0 / .06),0 40px 80px -32px oklch(8% 0.02 268 / .7);padding:26px}
.glass h2,.glass h3{color:var(--ink)}
/* forms */
form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:640px){form .row{grid-template-columns:1fr}}
.field{margin-bottom:14px;position:relative}
label{display:block;font-size:.92rem;font-weight:500;margin-bottom:6px;color:inherit}
input,select,textarea{width:100%;padding:12px 14px;border-radius:var(--radius-inner);border:1px solid var(--rule);background:var(--paper-2);color:var(--ink);font:400 1rem var(--font-body)}
.well input,.well select,.well textarea{background:var(--card);color:var(--well-ink);border-color:oklch(80% 0.01 265)}
.glass select option{background-color:#232838;color:#f2efe6}
.well select option,.card-form select option{background-color:#ffffff;color:#20242e}
input::placeholder,textarea::placeholder{color:var(--muted)}
.well input::placeholder,.well textarea::placeholder{color:var(--well-muted)}
.ac-list{position:absolute;left:0;right:0;top:100%;z-index:80;background:#ffffff;color:#20242e;border-radius:var(--radius-inner);box-shadow:0 24px 48px -16px oklch(10% 0.02 268 / .55);overflow:hidden;margin-top:4px}
.ac-list button{display:block;width:100%;text-align:left;padding:11px 14px;border:0;background:none;font:400 .97rem var(--font-body);color:#20242e;cursor:pointer}
.ac-list button:hover,.ac-list button.active{background:oklch(91% 0.038 274)}
.ac-list .ac-state{padding:11px 14px;color:#5a6070;font-size:.93rem}
/* date & time pickers: button field + popover (explicit light surface and dark
   text, like .ac-list, so popover text can never inherit an unreadable colour) */
.picker{position:relative}
.picker-field{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:12px 14px;border-radius:var(--radius-inner);border:1px solid var(--rule);background:var(--paper-2);color:var(--ink);font:400 1rem var(--font-body);text-align:left;cursor:pointer}
.well .picker-field{background:var(--card);color:var(--well-ink);border-color:oklch(80% 0.01 265)}
.picker-field .is-placeholder{color:var(--muted)}
.well .picker-field .is-placeholder{color:var(--well-muted)}
.picker-chevron{color:var(--muted);font-size:.78rem;line-height:1;flex:none}
.well .picker-chevron{color:var(--well-muted)}
.picker-pop{position:absolute;left:0;top:calc(100% + 6px);z-index:90;background:#ffffff;color:#20242e;border-radius:var(--radius-inner);box-shadow:0 24px 48px -16px oklch(10% 0.02 268 / .55);padding:14px;width:302px;max-width:calc(100vw - 40px)}
.picker[data-picker="time"] .picker-pop{width:100%;min-width:190px;padding:6px}
.picker-chips{display:flex;gap:8px;margin-bottom:12px}
.picker-chip{padding:7px 16px;border:0;border-radius:var(--radius-pill);background:oklch(93% 0.02 274);color:#20242e;font:600 .9rem var(--font-body);cursor:pointer}
.picker-chip:hover{background:oklch(88% 0.035 274)}
.cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.cal-title{font:600 1.02rem var(--font-display);color:#20242e}
.cal-nav{width:34px;height:34px;border:0;border-radius:50%;background:none;color:#20242e;font-size:1.3rem;line-height:1;cursor:pointer}
.cal-nav:hover:not([disabled]){background:oklch(93% 0.02 274)}
.cal-nav[disabled]{color:#c3c7d1;cursor:default}
.cal-week{display:grid;grid-template-columns:repeat(7,1fr);margin-bottom:4px}
.cal-week span{text-align:center;font-size:.76rem;font-weight:600;color:#5a6070;padding:3px 0}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.cal-grid>span{min-height:1px}
.cal-day{padding:8px 0;border:0;border-radius:8px;background:none;color:#20242e;font:400 .95rem var(--font-body);cursor:pointer;text-align:center}
.cal-day:hover:not([disabled]){background:oklch(91% 0.038 274)}
.cal-day[disabled]{color:#c3c7d1;cursor:default}
.cal-day.today{box-shadow:inset 0 0 0 2px oklch(62% 0.13 274)}
.cal-day.sel,.cal-day.sel:hover{background:oklch(52% 0.15 274);color:#ffffff}
.time-list{max-height:240px;overflow-y:auto}
.time-opt{display:block;width:100%;text-align:left;padding:10px 12px;border:0;border-radius:8px;background:none;color:#20242e;font:400 1rem var(--font-body);cursor:pointer}
.time-opt:hover{background:oklch(91% 0.038 274)}
.time-opt.sel,.time-opt.sel:hover{background:oklch(52% 0.15 274);color:#ffffff}
.map{height:340px;border-radius:var(--radius-card);overflow:hidden;margin:6px 0 10px;z-index:1}
.form-note{font-size:.92rem}
.form-msg{border-radius:var(--radius-inner);padding:14px 16px;margin-top:14px;display:none}
.form-msg.ok{display:block;background:oklch(80% 0.07 160 / .18);color:var(--ink)}
.well .form-msg.ok{color:var(--well-ink)}
.form-msg.err{display:block;background:oklch(83% 0.095 62 / .22);color:var(--ink)}
.well .form-msg.err{color:var(--well-ink)}
/* services list + pane */
.svc-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:36px;align-items:start}
@media (max-width:860px){.svc-layout{grid-template-columns:1fr}}
.svc-list{list-style:none;margin:0;padding:0}
.svc-list li{border-bottom:1px solid var(--rule)}
.svc-list button{display:flex;align-items:baseline;gap:12px;width:100%;background:none;border:0;color:var(--ink);font:500 1.18rem var(--font-display);text-align:left;padding:17px 6px;cursor:pointer}
.svc-list button .dot{width:9px;height:9px;border-radius:50%;background:transparent;flex:none;align-self:center}
.svc-list button[aria-selected="true"] .dot{background:var(--accent)}
.svc-list button:hover{color:var(--accent-hi)}
.svc-pane p{color:var(--ink-2)}
/* areas, faq, steps */
.chips{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin:0}
.chips a{display:inline-block;padding:10px 18px;border-radius:var(--radius-pill);background:var(--paper-2);color:var(--ink);text-decoration:none}
.chips a:hover{background:var(--paper-3)}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:860px){.steps{grid-template-columns:1fr}}
.step{background:var(--paper-2);border-radius:var(--radius-card);padding:24px}
.step .n{font-family:var(--font-display);font-size:1.7rem;color:var(--accent)}
.band{background:var(--paper-3)}
.faq details{border-bottom:1px solid var(--rule);padding:16px 0}
.faq summary{font-family:var(--font-display);font-size:1.13rem;cursor:pointer;color:var(--ink)}
.faq details p{margin-top:8px;max-width:65ch}
.well{background:var(--well);color:var(--well-ink);border-radius:var(--radius-card);padding:30px}
.well p{color:var(--well-ink)}
.well .muted{color:var(--well-muted)}
.well h1,.well h2,.well h3{color:var(--well-ink)}
.pagehead{padding:150px 0 30px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.cardlink{display:block;background:var(--paper-2);border-radius:var(--radius-card);padding:22px;text-decoration:none}
.cardlink:hover{background:var(--paper-3)}
.cardlink h3{color:var(--ink)}
.cardlink p{font-size:.95rem;margin:0}
/* footer */
footer.site{background:oklch(11% 0.018 268);padding:64px 0 34px;margin-top:0}
footer.site .big{font-family:var(--font-display);font-size:clamp(1.9rem,5vw,3rem);color:var(--ink);margin-bottom:28px}
footer.site .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:26px}
footer.site h3{font-size:1rem;color:var(--ink)}
footer.site ul{list-style:none;margin:0;padding:0}
footer.site li{margin:7px 0}
footer.site a{color:var(--ink-2);text-decoration:none;font-size:.95rem}
footer.site a:hover{color:var(--accent-hi)}
footer.site .legal{border-top:1px solid var(--rule);margin-top:36px;padding-top:20px;font-size:.88rem;color:var(--muted)}
footer.site .legal a{font-size:.88rem;color:var(--muted);text-decoration:underline}
/* admin */
table.admin{width:100%;border-collapse:collapse;font-size:.93rem}
table.admin th,table.admin td{border-bottom:1px solid var(--rule);padding:9px 8px;text-align:left;vertical-align:top}
.badge{display:inline-block;padding:2px 10px;border-radius:var(--radius-pill);background:var(--apricot);color:oklch(30% 0.07 40);font-size:.8rem;font-weight:600}
.hidden{display:none!important}
