/*
 * css/tools.css — S99 round 3 · Event Cost Estimator + Delivery Cost Calculator (the revamp)
 * ============================================================================
 * Austin, 2026-10-03: "i want them popping and being spectacular and colored… premium and shiny… more functional
 * like the alibaba and aliexpress pages". Replaces the monochrome S99 skin (W99-5 closed by his newer words).
 *
 * COLOUR CARRIES MEANING: plum = Sherehe · gold = money (prices, totals, the main action) · teal = the road ·
 * coral = your venue · one colour per MOMENT of the event. Text contrast ≥ 4.5:1 everywhere (ink on cream/white).
 *
 * SCOPED: every rule sits under `.sht` (the tools' root) — nothing here can restyle the rest of the site, and no
 * Tailwind rebuild is needed (rules 2/3). Fonts are the site's own self-hosted Lora + Plus Jakarta Sans (rule 7:
 * no new font downloads). Mobile first; 44 px targets; works at 320 px; prefers-reduced-motion honoured below
 * (⚑ rule 9 asks for new animations to be listed in css/style.css's block too — flagged, that file is not mine).
 */

.sht {
  --plum-9:#1A0710; --plum-8:#2A0F1A; --plum-7:#3D1A27; --plum-6:#5C2A3B; --plum-5:#7B3C52; --plum-1:#F7EEF1;
  --gold-1:#FFF4D2; --gold-2:#F3D57E; --gold-3:#D9A92B; --gold-4:#8A6200;
  --gold-grad:linear-gradient(135deg,#FFF1BF 0%,#F1CF6B 24%,#C9971C 50%,#F7DE8C 74%,#B9850F 100%);
  --plum-grad:linear-gradient(140deg,#1A0710 0%,#3D1A27 52%,#6A2F45 100%);
  --teal:#13A08F; --teal-d:#0B6F63; --teal-s:#E3F6F3; --coral:#EF5B4C; --coral-d:#C2392B; --coral-s:#FDEBE8; --sky:#3B82F6; --sky-s:#E8F0FE;
  --cream:#FBF8F3; --cream-2:#F4EEE5; --line:#E9E1D6; --line-2:#D9CDBD; --ink:#24101A; --ink-2:#55424B; --muted:#6F5F66;
  --ok:#0E7F57; --ok-s:#E7F8F1; --warn:#9A4A06; --warn-s:#FFF4E5;
  --shadow:0 10px 30px rgba(42,15,26,.08); --shadow-lg:0 30px 70px rgba(42,15,26,.18); --ease:cubic-bezier(.2,.7,.2,1);
  color:var(--ink); font-family:"Plus Jakarta Sans",system-ui,sans-serif; font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased;
}
.sht *, .sht *::before, .sht *::after { box-sizing:border-box; }
:where(.sht) :where(button,input,select,textarea) { font:inherit; color:inherit; }
:where(.sht) :where(h1,h2,h3,p,ul,ol,figure) { margin:0; }
.sht h1, .sht h2, .sht h3 { font-family:Lora,Georgia,serif; letter-spacing:-.015em; color:var(--ink); font-weight:700; }
.sht [hidden] { display:none !important; }   /* the standard [hidden] reset — a component display rule must never un-hide it */
.sht :focus-visible { outline:3px solid var(--gold-3); outline-offset:2px; border-radius:10px; }
.sht .sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.sht .i { width:18px; height:18px; flex:none; }
.sht .wrap { max-width:1240px; margin:0 auto; padding:0 20px; }
@media (max-width:600px) { .sht .wrap { padding:0 16px; } }
.sht .num { font-variant-numeric:tabular-nums; }
.sht .tag-est { display:inline-block; border-radius:999px; padding:1px 8px; font:800 11px/1.6 "Plus Jakarta Sans",sans-serif; background:var(--sky-s); color:#1E40AF; vertical-align:middle; }
.sht .hint { font-size:13px; color:var(--muted); margin-top:8px; }
.sht .hint b { color:var(--ink-2); }

/* ── buttons ─────────────────────────────────────────────────────────── */
.sht .btn { display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:52px; padding:0 24px; border-radius:999px; border:0;
  font:800 15px/1.2 "Plus Jakarta Sans",sans-serif; cursor:pointer; text-decoration:none; transition:transform .15s var(--ease), box-shadow .2s; white-space:nowrap; -webkit-tap-highlight-color:transparent; }
.sht .btn:active { transform:scale(.98); }
.sht .btn[disabled], .sht .btn.dis { opacity:.45; pointer-events:none; }
.sht .btn.lux { background:var(--gold-grad); background-size:200% 100%; color:var(--plum-9); box-shadow:0 12px 28px rgba(201,151,28,.38), inset 0 1px 0 rgba(255,255,255,.65); position:relative; overflow:hidden; }
.sht .btn.lux::after { content:""; position:absolute; top:0; left:-60%; width:40%; height:100%; background:linear-gradient(100deg,transparent,rgba(255,255,255,.75),transparent); transform:skewX(-20deg); transition:left .8s var(--ease); }
.sht .btn.lux:hover::after { left:130%; }
.sht .btn.plum { background:var(--plum-7); color:#fff; box-shadow:0 8px 18px rgba(61,26,39,.28); }
.sht .btn.wa { background:#fff; color:#0F6E37; border:1.5px solid #25D366; }
.sht .btn.wa:hover { background:#EFFBF3; }
.sht .btn.ghost { background:#fff; color:var(--ink); border:1.5px solid var(--line-2); }
.sht .btn.ghost:hover { border-color:var(--gold-3); }
.sht .btn.sm { min-height:42px; padding:0 16px; font-size:13.5px; }
.sht .btn svg { width:18px; height:18px; flex:none; }

/* ── form bits ───────────────────────────────────────────────────────── */
.sht .inp { width:100%; min-height:50px; border:1.5px solid var(--line-2); border-radius:14px; padding:0 14px; font:700 15px "Plus Jakarta Sans",sans-serif; color:var(--ink); background:#fff; }
.sht textarea.inp { padding:12px 14px; min-height:110px; resize:vertical; font-weight:600; }
.sht .inp:focus { outline:0; border-color:var(--plum-5); box-shadow:0 0 0 4px var(--plum-1); }
.sht .inp[aria-invalid=true] { border-color:var(--coral); }
.sht .flabel { display:flex; justify-content:space-between; align-items:baseline; gap:8px; font:800 12.5px "Plus Jakarta Sans",sans-serif; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); margin-bottom:8px; }
.sht .flabel small { text-transform:none; letter-spacing:0; font-weight:600; }
.sht .step { display:inline-flex; align-items:center; border:1.5px solid var(--line-2); border-radius:999px; background:#fff; overflow:hidden; }
.sht .step button { width:42px; height:44px; border:0; background:transparent; cursor:pointer; display:grid; place-items:center; color:var(--ink); }
.sht .step button:hover { background:var(--cream-2); }
.sht .step input { width:62px; height:44px; border:0; text-align:center; font:800 17px "Plus Jakarta Sans",sans-serif; color:var(--ink); background:transparent; -moz-appearance:textfield; }
.sht .step input::-webkit-outer-spin-button, .sht .step input::-webkit-inner-spin-button { -webkit-appearance:none; }
.sht .chips { display:flex; flex-wrap:wrap; gap:8px; }
.sht .chip { border:1.5px solid var(--line); background:#fff; border-radius:999px; padding:8px 13px; min-height:38px; font:700 13.5px "Plus Jakarta Sans",sans-serif; color:var(--ink-2); cursor:pointer; display:inline-flex; gap:6px; align-items:center; }
.sht .chip:hover { border-color:var(--coral); color:var(--ink); }
.sht .chip[aria-pressed=true], .sht .chip[aria-checked=true], .sht .chip.on { background:var(--plum-7); border-color:var(--plum-7); color:#fff; }
.sht .chip i { font-style:normal; color:var(--plum-6); font-weight:800; }
.sht .chip.on i, .sht .chip[aria-pressed=true] i { color:var(--gold-2); }

/* ── hero (both pages) ───────────────────────────────────────────────── */
.sht .hero { position:relative; background:var(--plum-grad); color:#F3E7EC; overflow:hidden; isolation:isolate; padding:28px 0 64px; }
.sht .hero::before { content:""; position:absolute; inset:0; z-index:-1; background:radial-gradient(600px 300px at 85% 10%,rgba(243,213,126,.26),transparent 70%), radial-gradient(500px 260px at 8% 95%,rgba(19,160,143,.2),transparent 70%); }
.sht .hero .bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; opacity:.26; }
.sht .hero .crumbs { font-size:13px; color:#D9C6CE; }
.sht .hero .crumbs a { color:#fff; text-decoration:none; }
.sht .kick { display:inline-flex; align-items:center; gap:10px; font:800 12px "Plus Jakarta Sans",sans-serif; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-2); margin:16px 0 10px; }
.sht .kick::before { content:""; width:28px; height:2px; background:var(--gold-grad); }
.sht .hero h1 { color:#fff; font-size:clamp(30px,4.6vw,56px); line-height:1.06; max-width:780px; }
.sht .hero h1 em { font-style:normal; background:var(--gold-grad); -webkit-background-clip:text; background-clip:text; color:transparent; background-size:200% 100%; animation:sht-sheen 7s linear infinite; }
@keyframes sht-sheen { to { background-position:200% 0; } }
.sht .hero .lead { font-size:17px; color:#E8D9DF; max-width:620px; margin-top:12px; }
.sht .hero .facts { display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; }
.sht .hero .facts span { background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.18); border-radius:999px; padding:7px 13px; font-size:13.5px; color:#fff; }
.sht .hero .facts b { color:var(--gold-2); }
.sht .hgrid { display:grid; gap:24px; align-items:end; }
@media (min-width:960px) { .sht .hgrid { grid-template-columns:1.1fr .9fr; gap:40px; } .sht .hero { padding:44px 0 72px; } }
@media (max-width:600px) { .sht .hero .facts { display:none; } .sht .hero .lead { font-size:15.5px; } }
.sht .glass { background:rgba(22,8,14,.55); border:1px solid rgba(255,255,255,.18); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-radius:26px; padding:22px; box-shadow:0 30px 60px rgba(0,0,0,.35); }
.sht .glass .lbl { font:800 11px "Plus Jakarta Sans",sans-serif; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-1); }
.sht .glass .chip { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.25); color:#fff; }
.sht .glass .chip.on { background:var(--gold-grad); color:var(--plum-9); border-color:transparent; }
.sht .glass .row { display:flex; align-items:center; justify-content:space-between; gap:10px; color:#E8D5DD; font-weight:700; margin:14px 0; }
.sht .glass .big { font:700 clamp(30px,3.6vw,40px)/1.05 Lora,serif; background:var(--gold-grad); -webkit-background-clip:text; background-clip:text; color:transparent; background-size:200% 100%; animation:sht-sheen 7s linear infinite; }
.sht .glass .sub { font-size:13px; color:#E3D3DA; margin-top:4px; }
.sht .glass .btn { width:100%; margin-top:14px; }

/* ── the four doors ──────────────────────────────────────────────────── */
.sht .doors { display:grid; grid-template-columns:1fr; gap:12px; margin-top:-30px; position:relative; z-index:5; }
@media (min-width:560px) { .sht .doors { grid-template-columns:1fr 1fr; } }
@media (min-width:1000px) { .sht .doors { grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; } }
.sht .door { display:grid; grid-template-columns:auto 1fr auto; gap:2px 14px; align-items:center; text-align:left; background:#fff; border:1px solid var(--line); border-radius:22px; padding:14px 16px; cursor:pointer; box-shadow:var(--shadow); transition:transform .2s var(--ease), box-shadow .2s, border-color .2s; }
.sht .door:hover { transform:translateY(-3px); box-shadow:var(--shadow-lg); border-color:var(--dc); }
.sht .door .di { grid-row:1/3; width:50px; height:50px; border-radius:16px; display:grid; place-items:center; color:#fff; background:linear-gradient(135deg,var(--dc),color-mix(in srgb,var(--dc) 55%,#1A0710)); }
.sht .door .di .i { width:24px; height:24px; }
.sht .door b { font-size:15.5px; } .sht .door small { color:var(--muted); font-size:12.5px; line-height:1.35; grid-column:2; }
.sht .door .arr { grid-row:1/3; grid-column:3; color:var(--dc); font-weight:900; font-size:18px; }

/* ── estimator work area ─────────────────────────────────────────────── */
.sht .basics { background:rgba(251,248,243,.96); backdrop-filter:blur(12px); border-bottom:1px solid var(--line); margin-top:26px; padding:14px 0; }
@media (min-width:900px) { .sht .basics { position:sticky; top:var(--sht-top,0px); z-index:40; } }
.sht .occ { display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; padding:2px; }
.sht .occ .chip { flex:none; }
.sht .brow { display:flex; gap:14px; flex-wrap:wrap; align-items:flex-end; margin-top:12px; }
.sht .bfield { display:grid; gap:6px; min-width:0; }
.sht .bfield label { font:800 12px "Plus Jakarta Sans",sans-serif; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.sht .bfield label small { text-transform:none; letter-spacing:0; font-weight:600; }
.sht .bfield .inp { min-height:44px; }
@media (max-width:700px) { .sht .bfield.d { flex:1 1 40%; } .sht .bfield.g { flex:1 1 100%; } }
.sht .quick { display:flex; gap:4px; flex-wrap:wrap; } .sht .quick button { border:0; background:var(--cream-2); border-radius:999px; padding:6px 10px; font:800 12px "Plus Jakarta Sans",sans-serif; color:var(--ink-2); cursor:pointer; min-height:30px; }
.sht .quick button.on { background:var(--gold-2); color:var(--plum-9); }
.sht .parts { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:12px; font:700 13px "Plus Jakarta Sans",sans-serif; color:var(--ink-2); }
.sht .parts button { border:1.5px dashed var(--gold-3); background:#FFFBEB; border-radius:999px; padding:7px 12px; min-height:38px; font:800 13px "Plus Jakarta Sans",sans-serif; cursor:pointer; color:var(--ink); }
.sht .parts button.on { border-style:solid; background:var(--gold-2); }
.sht .work { display:grid; grid-template-columns:1fr; gap:24px; align-items:start; margin-top:20px; padding-bottom:110px; }
@media (min-width:1000px) { .sht .work { grid-template-columns:minmax(0,1fr) 380px; gap:28px; padding-bottom:40px; } }
.sht .tabs { display:flex; gap:6px; background:#fff; border:1px solid var(--line); border-radius:18px; padding:5px; overflow-x:auto; scrollbar-width:none; }
.sht .tabs button { flex:1 0 auto; display:inline-flex; align-items:center; justify-content:center; gap:8px; border:0; background:transparent; border-radius:14px; padding:11px 14px; min-height:44px; font:800 14px "Plus Jakarta Sans",sans-serif; color:var(--ink-2); cursor:pointer; white-space:nowrap; }
.sht .tabs button[aria-selected=true] { background:var(--plum-grad); color:#fff; box-shadow:0 8px 18px rgba(61,26,39,.3); }
.sht .tabs button[aria-selected=true] .i { color:var(--gold-2); }
.sht .jump { display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; background:rgba(251,248,243,.96); padding:10px 0; margin-top:8px; align-items:center; }
@media (min-width:900px) { .sht .jump { position:sticky; top:calc(var(--sht-top,0px) + var(--sht-basics,150px)); z-index:30; } }
.sht .jump a { flex:none; display:inline-flex; gap:7px; align-items:center; text-decoration:none; color:var(--ink-2); font:800 13px "Plus Jakarta Sans",sans-serif; background:#fff; border:1.5px solid var(--line); border-radius:999px; padding:5px 12px 5px 5px; min-height:38px; }
.sht .jump a .dot { width:26px; height:26px; border-radius:50%; background:var(--mc); color:#fff; display:grid; place-items:center; }
.sht .jump a .dot .i { width:14px; height:14px; }
.sht .jump a i { font-style:normal; background:var(--ok); color:#fff; border-radius:999px; font-size:11px; padding:1px 7px; }
.sht .jump a.on { border-color:var(--mc); color:var(--ink); }
.sht .jump .prog { flex:none; margin-left:auto; font:800 12.5px "Plus Jakarta Sans",sans-serif; color:var(--plum-6); padding:0 6px; }
.sht .view { margin-top:18px; }
.sht .ribbon { display:flex; gap:12px; align-items:center; background:var(--ok-s); border:1px solid #A6E3CB; color:#064E36; border-radius:16px; padding:10px 14px; font-size:14px; margin-top:14px; }

/* moment section */
.sht .em { margin-top:34px; scroll-margin-top:220px; }
.sht .em-h { display:grid; grid-template-columns:auto 1fr auto; gap:14px; align-items:center; margin-bottom:14px; }
.sht .em-ic { width:48px; height:48px; border-radius:16px; display:grid; place-items:center; color:#fff; background:linear-gradient(135deg,var(--mc),color-mix(in srgb,var(--mc) 60%,#1A0710)); box-shadow:0 8px 20px color-mix(in srgb,var(--mc) 35%,transparent); }
.sht .em-ic .i { width:24px; height:24px; }
.sht .em-h h2 { font-size:clamp(21px,2.4vw,28px); display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.sht .em-h p { margin-top:2px; color:var(--ink-2); font-size:14.5px; }
.sht .em-c { font:700 12.5px "Plus Jakarta Sans",sans-serif; color:var(--muted); background:#fff; border:1px solid var(--line); border-radius:999px; padding:5px 10px; }
.sht .ok-pill { display:inline-flex; align-items:center; gap:4px; font:800 12px "Plus Jakarta Sans",sans-serif; color:var(--ok); background:var(--ok-s); border-radius:999px; padding:4px 9px; }
@media (max-width:560px) { .sht .em-c { display:none; } .sht .em-h { grid-template-columns:auto 1fr; } .sht .em-ic { width:40px; height:40px; } }

/* product family card */
.sht .grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(228px,1fr)); gap:16px; }
@media (max-width:560px) { .sht .grid { grid-template-columns:1fr 1fr; gap:10px; } }
.sht .ec { background:#fff; border:1px solid var(--line); border-radius:22px; overflow:hidden; display:flex; flex-direction:column; transition:box-shadow .2s, transform .2s var(--ease), border-color .2s; }
.sht .ec:hover { box-shadow:var(--shadow); transform:translateY(-2px); }
.sht .ec.in { border-color:var(--gold-3); box-shadow:0 0 0 3px rgba(243,213,126,.45); }
.sht .ec-im { position:relative; aspect-ratio:4/3; background:var(--cream-2); overflow:hidden; }
.sht .ec-im img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s var(--ease); }
.sht .ec:hover .ec-im img { transform:scale(1.04); }
.sht .ec-flag { position:absolute; left:10px; top:10px; display:inline-flex; gap:5px; align-items:center; background:var(--ok); color:#fff; border-radius:999px; padding:5px 10px; font:800 12px "Plus Jakarta Sans",sans-serif; }
.sht .ec-n { position:absolute; right:10px; bottom:10px; background:rgba(26,7,16,.75); color:#fff; border-radius:999px; padding:4px 9px; font:700 11.5px "Plus Jakarta Sans",sans-serif; }
.sht .ec-bd { padding:12px 14px 14px; display:flex; flex-direction:column; gap:6px; flex:1; }
.sht .ec-fam { font:800 11px "Plus Jakarta Sans",sans-serif; letter-spacing:.12em; text-transform:uppercase; color:var(--mcd,var(--plum-6)); }
.sht .ec h3 { font:700 15px/1.3 "Plus Jakarta Sans",sans-serif; min-height:2.6em; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.sht .ec h3 a { color:inherit; text-decoration:none; } .sht .ec h3 a:hover { text-decoration:underline; }
.sht .ec-pr { display:flex; align-items:baseline; gap:6px; flex-wrap:wrap; }
.sht .ec-pr b { font:700 21px Lora,serif; color:var(--ink); }
.sht .ec-pr b small { font:700 12px "Plus Jakarta Sans",sans-serif; color:var(--muted); }
.sht .ec-pr span { font-size:12.5px; color:var(--muted); }
.sht .ec-un { font-size:12px; color:var(--warn); background:var(--warn-s); border-radius:8px; padding:3px 8px; }
.sht .sw { display:flex; gap:6px; flex-wrap:wrap; }
.sht .sw button { position:relative; width:38px; height:38px; border-radius:10px; padding:0; border:2px solid var(--line); background:var(--cream-2); cursor:pointer; }
.sht .sw button img { width:100%; height:100%; object-fit:cover; border-radius:8px; display:block; }
.sht .sw button[aria-checked=true] { border-color:var(--gold-3); box-shadow:0 0 0 3px rgba(243,213,126,.5); }
.sht .sw button i { position:absolute; right:-6px; top:-6px; min-width:18px; height:18px; border-radius:9px; background:var(--ok); color:#fff; font:800 10.5px/18px "Plus Jakarta Sans",sans-serif; font-style:normal; text-align:center; padding:0 4px; }
.sht .sw .more { font:800 12px "Plus Jakarta Sans",sans-serif; color:var(--ink-2); }
.sht .ec-act { margin-top:auto; display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding-top:4px; }
.sht .ec-act .btn.add { min-height:44px; padding:0 16px; background:var(--plum-7); color:#fff; font-size:14px; box-shadow:0 6px 16px rgba(61,26,39,.25); }
.sht .ec-why { font-size:11.5px; color:var(--muted); line-height:1.3; flex-basis:100%; }
.sht .ec-line { font:800 14px "Plus Jakarta Sans",sans-serif; color:var(--plum-6); margin-left:auto; }
@media (max-width:560px) { .sht .ec h3 { font-size:13.5px; } .sht .ec-pr b { font-size:18px; } .sht .sw button { width:32px; height:32px; } .sht .ec-act .btn.add { width:100%; padding:0 10px; font-size:13px; } .sht .ec-act .step button { width:34px; } .sht .ec-act .step input { width:42px; } .sht .ec-line { margin-left:0; } }

/* packages */
.sht .pk { display:grid; grid-template-columns:1fr; gap:12px; }
@media (min-width:900px) { .sht .pk { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border-radius:28px; overflow:hidden; background:linear-gradient(180deg,#EADFD3,#F4EEE7); box-shadow:var(--shadow); } }
.sht .pc { background:#fff; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:24px; overflow:hidden; }
@media (min-width:900px) { .sht .pc { border:0; border-right:1px solid var(--line); border-radius:0; } .sht .pc:last-child { border-right:0; } }
.sht .pc.most { background:linear-gradient(180deg,#FFF9E8,#fff 40%); box-shadow:inset 0 0 0 2px var(--gold-2); }
.sht .pc.on { box-shadow:inset 0 0 0 3px var(--ok); }
.sht .pc-im { position:relative; aspect-ratio:16/9; overflow:hidden; background:var(--cream-2); }
.sht .pc-im img { width:100%; height:100%; object-fit:cover; }
.sht .pc-crown { position:absolute; left:12px; top:12px; background:var(--gold-grad); color:var(--plum-9); font:800 12px "Plus Jakarta Sans",sans-serif; border-radius:999px; padding:6px 12px; }
.sht .pc-bd { padding:18px 20px 20px; display:flex; flex-direction:column; gap:8px; flex:1; }
.sht .pc h3 { font-size:26px; }
.sht .pc-tag { color:var(--ink-2); font-size:14px; }
.sht .pc-pr b { display:block; font:700 34px/1 Lora,serif; color:var(--gold-4); }
.sht .pc-pr span { font-size:13px; color:var(--muted); }
.sht .pc-round { font-size:12.5px; background:var(--sky-s); color:#1E3A8A; border-radius:10px; padding:6px 10px; }
.sht .pc-inc { list-style:none; padding:0; display:grid; gap:6px; font-size:13.5px; color:var(--ink-2); margin:6px 0 4px; }
.sht .pc-inc li { display:flex; gap:8px; align-items:flex-start; } .sht .pc-inc li .i { width:16px; height:16px; color:var(--ok); margin-top:2px; }
.sht .pc-inc summary { cursor:pointer; font-weight:800; color:var(--plum-6); min-height:32px; }
.sht .pc .btn { margin-top:auto; width:100%; }
.sht .pk-foot { font-size:13px; color:var(--muted); text-align:center; margin-top:14px; }
.sht .none { text-align:center; padding:36px 20px; background:#fff; border:1px dashed var(--line-2); border-radius:24px; }
.sht .none p { max-width:470px; margin:8px auto 16px; color:var(--ink-2); }
.sht .none .acts { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }

/* few items + custom */
.sht .fsearch { position:relative; } .sht .fsearch .i { position:absolute; left:16px; top:50%; translate:0 -50%; color:var(--muted); }
.sht .fsearch input { width:100%; min-height:56px; border-radius:18px; border:2px solid var(--line-2); padding:0 16px 0 46px; font:700 16px "Plus Jakarta Sans",sans-serif; background:#fff; }
.sht .fsearch input:focus { outline:0; border-color:var(--plum-5); box-shadow:0 0 0 4px var(--plum-1); }
.sht .mchips { display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; margin:12px 0 18px; padding-bottom:2px; }
.sht .mchips button { flex:none; display:inline-flex; gap:6px; align-items:center; border:1.5px solid var(--line); background:#fff; border-radius:999px; padding:8px 12px; min-height:40px; font:800 13px "Plus Jakarta Sans",sans-serif; color:var(--ink-2); cursor:pointer; }
.sht .mchips button .i { color:var(--mc); width:16px; height:16px; }
.sht .mchips button.on { background:var(--mc); border-color:var(--mc); color:#fff; } .sht .mchips button.on .i { color:#fff; }
.sht .cust { background:#fff; border:1px solid var(--line); border-radius:26px; padding:22px; display:grid; gap:16px; box-shadow:var(--shadow); }
.sht .cust .head { display:grid; grid-template-columns:auto 1fr; gap:14px; align-items:center; }
.sht .cust .head h2 { font-size:24px; } .sht .cust .head p { color:var(--ink-2); margin-top:4px; }
.sht .cust label.fl { display:grid; gap:7px; font:800 13px "Plus Jakarta Sans",sans-serif; }
.sht .cust label.fl small { font-weight:600; color:var(--muted); }
.sht .cust .two { display:grid; grid-template-columns:1fr; gap:12px; }
@media (min-width:560px) { .sht .cust .two { grid-template-columns:1fr 1fr; } }
.sht .cust .ph { display:flex; gap:8px; flex-wrap:wrap; } .sht .cust .ph img { width:72px; height:72px; object-fit:cover; border-radius:12px; }
.sht .cust .acts { display:flex; gap:10px; flex-wrap:wrap; }
.sht .okbox { background:var(--ok-s); border-radius:14px; padding:12px 14px; color:#064E36; font-size:14.5px; }
.sht .errbox { background:var(--coral-s); border-radius:14px; padding:12px 14px; color:#7A1C12; font-size:14.5px; }

/* the estimate panel */
.sht .plan { display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:26px; box-shadow:var(--shadow-lg); overflow:hidden; }
@media (min-width:1000px) { .sht .side { position:sticky; top:calc(var(--sht-top,0px) + 16px); } .sht .side .plan { max-height:calc(100vh - var(--sht-top,0px) - 32px); } }
@media (max-width:999px) { .sht .side { display:none; } }
.sht .pl-h { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; padding:18px 20px 12px; background:var(--plum-grad); color:#fff; }
.sht .pl-h .k { font:700 21px Lora,serif; color:#fff; } .sht .pl-h .ev { font-size:13px; color:#E8D5DD; }
.sht .pl-h button { border:1px solid rgba(255,255,255,.3); background:rgba(255,255,255,.1); color:#fff; border-radius:999px; padding:6px 10px; min-height:34px; font:700 12px "Plus Jakarta Sans",sans-serif; cursor:pointer; }
.sht .pl-body { flex:1; overflow:auto; padding:6px 16px 10px; overscroll-behavior:contain; }
.sht .pl-g { padding:10px 0; border-bottom:1px dashed var(--line); }
.sht .pl-gn { font:800 11px "Plus Jakarta Sans",sans-serif; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin:2px 0 8px; }
.sht .pl-l { display:grid; grid-template-columns:44px 1fr auto; grid-template-areas:"im n x" "im q t"; gap:2px 10px; align-items:center; padding:6px 0; }
.sht .pl-l .im { grid-area:im; width:44px; height:44px; border-radius:12px; object-fit:cover; background:var(--plum-1); display:grid; place-items:center; color:var(--plum-6); }
.sht .pl-l .n { grid-area:n; min-width:0; } .sht .pl-l .n b { display:block; font-size:13.5px; line-height:1.25; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sht .pl-l .n small { font-size:11.5px; color:var(--muted); }
.sht .pl-l .auto { color:var(--teal-d); font-weight:800; }
.sht .pl-l .q { grid-area:q; display:inline-flex; align-items:center; gap:2px; justify-self:start; }
.sht .pl-l .q button { width:30px; height:30px; border-radius:50%; border:1px solid var(--line-2); background:#fff; display:grid; place-items:center; cursor:pointer; padding:0; }
.sht .pl-l .q .i { width:13px; height:13px; } .sht .pl-l .q span { min-width:32px; text-align:center; font:800 13px "Plus Jakarta Sans",sans-serif; }
.sht .pl-l .t { grid-area:t; font:800 14px "Plus Jakarta Sans",sans-serif; text-align:right; }
.sht .pl-l .x { grid-area:x; justify-self:end; width:30px; height:30px; border:0; border-radius:50%; background:transparent; color:var(--muted); cursor:pointer; display:grid; place-items:center; }
.sht .pl-l .x:hover { background:var(--coral-s); color:var(--coral-d); } .sht .pl-l .x .i { width:14px; height:14px; }
.sht .pl-l.out .n b { text-decoration:line-through; color:var(--muted); }
.sht .pl-empty { text-align:center; padding:24px 10px; color:var(--ink-2); }
.sht .pl-empty .e { width:56px; height:56px; border-radius:18px; margin:0 auto 8px; background:var(--gold-1); color:var(--gold-4); display:grid; place-items:center; }
.sht .pl-empty p { font-size:13.5px; margin-top:6px; }
.sht .pl-del { padding:12px 0 4px; }
.sht .pl-notes p { font-size:12.5px; border-radius:12px; padding:8px 10px; margin-top:8px; background:var(--sky-s); color:#1E3A8A; }
.sht .pl-notes p.warn { background:var(--warn-s); color:var(--warn); }
.sht .pl-foot { border-top:1px solid var(--line); padding:12px 18px 16px; background:linear-gradient(180deg,#fff,#FFFBF2); }
.sht .pl-row { display:flex; justify-content:space-between; align-items:baseline; font-size:14px; color:var(--ink-2); padding:2px 0; }
.sht .pl-row b { color:var(--ink); } .sht .pl-row em { font-style:normal; color:var(--coral-d); font-weight:700; }
.sht .pl-tot { margin-top:6px; padding-top:8px; border-top:1px solid var(--line); }
.sht .pl-tot span { font:800 15px "Plus Jakarta Sans",sans-serif; color:var(--ink); }
.sht .pl-tot b { font:700 32px/1 Lora,serif; color:var(--gold-4); }
.sht .pl-foot .btn.lux { width:100%; margin-top:10px; }
.sht .pl-more { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin-top:10px; }
.sht .pl-more button { border:1px solid var(--line); background:#fff; border-radius:14px; padding:8px 4px; min-height:54px; display:grid; justify-items:center; gap:4px; font:700 11.5px "Plus Jakarta Sans",sans-serif; color:var(--ink-2); cursor:pointer; }
.sht .pl-more button:hover { border-color:var(--gold-3); color:var(--ink); }
.sht .pulse .pl-tot b { animation:sht-pop .45s var(--ease); }
@keyframes sht-pop { 40% { transform:scale(1.06); } }
.sht .pl-busy { opacity:.55; transition:opacity .2s; }

/* phone: bottom bar + sheet */
.sht .ebar { display:none; }
@media (max-width:999px) {
  .sht .ebar { display:flex; position:fixed; left:10px; right:10px; bottom:calc(10px + env(safe-area-inset-bottom)); z-index:70; background:var(--plum-8); color:#fff; border-radius:22px; padding:10px 10px 10px 18px; align-items:center; gap:12px; box-shadow:0 18px 40px rgba(26,7,16,.45); }
  .sht .ebar .t { flex:1; min-width:0; } .sht .ebar small { display:block; color:#D9C3CC; font-size:12px; }
  .sht .ebar b { font:700 22px Lora,serif; color:var(--gold-2); }
  .sht .ebar .btn { min-height:48px; padding:0 18px; }
}
.sht .sheet { position:fixed; inset:0; z-index:9000; background:rgba(26,7,16,.5); display:none; align-items:flex-end; }
.sht .sheet.on { display:flex; }
.sht .sheet .plan { width:100%; max-height:90vh; border-radius:26px 26px 0 0; animation:sht-up .3s var(--ease); }
@keyframes sht-up { from { transform:translateY(40px); opacity:.6; } }

/* toast */
.sht-toast { position:fixed; left:50%; bottom:24px; transform:translate(-50%,10px); z-index:99999; background:#151821; color:#fff; border-radius:999px; padding:10px 10px 10px 20px; font:700 14px "Plus Jakarta Sans",sans-serif; box-shadow:0 20px 50px rgba(0,0,0,.3); display:flex; align-items:center; gap:14px; opacity:0; pointer-events:none; transition:opacity .25s, transform .25s; max-width:calc(100vw - 24px); }
.sht-toast.on { opacity:1; transform:translate(-50%,0); pointer-events:auto; }
.sht-toast button { border:0; background:#F3D57E; color:#1A0710; border-radius:999px; padding:8px 12px; min-height:36px; font:800 13px "Plus Jakarta Sans",sans-serif; cursor:pointer; }
@media (max-width:999px) { .sht-toast { bottom:96px; } }

/* ── delivery calculator ─────────────────────────────────────────────── */
.sht .calc { position:relative; z-index:5; background:#fff; border-radius:28px; box-shadow:var(--shadow-lg); display:grid; grid-template-columns:1fr; overflow:hidden; border:1px solid var(--line); }
.sht .calc .ctl { padding:18px; }
.sht .calc .mapcol { position:relative; min-height:300px; order:-1; background:linear-gradient(160deg,#EEF7F5,#F7F0E8); }
@media (min-width:900px) { .sht .calc { grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); } .sht .calc .ctl { padding:26px 28px 28px; } .sht .calc .mapcol { min-height:600px; order:0; } }
.sht .calc.overlap { margin-top:-46px; }
.sht .mapc, .sht .mapcol > .mapc.maplibregl-map { position:absolute; inset:0; }
.sht .mapc .mapmsg { position:absolute; inset:0; display:grid; place-items:center; text-align:center; padding:20px; color:var(--muted); font-size:14px; }
.sht .modes { display:grid; grid-template-columns:repeat(3,1fr); background:var(--cream-2); border-radius:16px; padding:5px; gap:4px; }
.sht .modes button { border:0; background:transparent; border-radius:12px; padding:8px 4px; min-height:58px; font:800 13px "Plus Jakarta Sans",sans-serif; color:var(--ink-2); cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:4px; }
.sht .modes button svg { width:20px; height:20px; }
.sht .modes button[aria-pressed=true] { background:#fff; color:var(--plum-7); box-shadow:0 2px 10px rgba(42,15,26,.1); }
.sht .modes button[aria-pressed=true] svg { color:var(--coral); }
.sht .field { margin-top:16px; }
.sht .srch { position:relative; }
.sht .srch input { width:100%; min-height:60px; border:2px solid var(--line-2); border-radius:18px; padding:0 52px 0 52px; font:700 17px "Plus Jakarta Sans",sans-serif; color:var(--ink); background:#fff; }
.sht .srch input:focus { outline:0; border-color:var(--coral); box-shadow:0 0 0 5px var(--coral-s); }
.sht .srch .ico { position:absolute; left:17px; top:50%; translate:0 -50%; width:22px; height:22px; color:var(--coral); }
.sht .srch .clr { position:absolute; right:10px; top:50%; translate:0 -50%; width:40px; height:40px; border-radius:50%; border:0; background:var(--cream-2); cursor:pointer; font-size:18px; color:var(--ink-2); }
.sht .sugg { position:absolute; left:0; right:0; top:calc(100% + 8px); background:#fff; border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow-lg); list-style:none; margin:0; padding:6px; z-index:60; max-height:380px; overflow:auto; }
.sht .sugg li[role=option] { display:grid; grid-template-columns:36px 1fr auto; gap:12px; align-items:center; padding:10px; border-radius:12px; cursor:pointer; min-height:48px; }
.sht .sugg li[aria-selected=true], .sht .sugg li[role=option]:hover { background:var(--cream); }
.sht .sugg .pin { width:36px; height:36px; border-radius:12px; background:var(--coral-s); color:var(--coral-d); display:grid; place-items:center; }
.sht .sugg .pin svg { width:18px; height:18px; }
.sht .sugg b { display:block; font-size:15.5px; } .sht .sugg small { color:var(--muted); font-size:12.5px; }
.sht .sugg mark { background:none; color:var(--coral-d); font-weight:900; }
.sht .sugg .pr { font:800 14px "Plus Jakarta Sans",sans-serif; color:var(--plum-7); background:var(--gold-1); border-radius:999px; padding:5px 10px; white-space:nowrap; }
.sht .sugg .pr.q { background:var(--sky-s); color:#1E3A8A; }
.sht .sugg .msg { padding:12px; color:var(--ink-2); }
.sht .sugg .msg .row2 { margin-top:10px; }
.sht .row2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
@media (max-width:420px) { .sht .row2 { grid-template-columns:1fr; } }
.sht .kmbox { display:flex; align-items:center; gap:10px; } .sht .kmbox input { flex:1; min-height:60px; font-size:22px; text-align:center; border-radius:18px; } .sht .kmbox span { font:800 16px "Plus Jakarta Sans",sans-serif; color:var(--muted); }
.sht .gps { width:100%; display:grid; grid-template-columns:48px 1fr auto; gap:12px; align-items:center; text-align:left; border:0; border-radius:18px; padding:12px; background:linear-gradient(120deg,#E3F6F3,#F2FBF9); cursor:pointer; color:var(--ink); min-height:72px; }
.sht .gps > svg { width:48px; height:48px; padding:12px; border-radius:15px; background:var(--teal); color:#fff; }
.sht .gps > span > b { display:block; font-size:15.5px; } .sht .gps small { color:var(--teal-d); font-size:12.5px; } .sht .gps .go { font-weight:900; color:var(--teal-d); font-size:18px; }
.sht .gps.busy > svg { animation:sht-spin 1.2s linear infinite; }
.sht .or { display:flex; align-items:center; gap:10px; margin:14px 4px 10px; font:800 11.5px "Plus Jakarta Sans",sans-serif; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.sht .or::before, .sht .or::after { content:""; flex:1; height:1px; background:var(--line); }
.sht .calcing { margin-top:18px; border-radius:20px; background:linear-gradient(135deg,#FFFBF0,#F7F1FF); border:1px solid var(--line); padding:16px; }
.sht .calcing ol { list-style:none; padding:0; display:grid; gap:10px; }
.sht .calcing li { display:flex; gap:12px; align-items:center; font-weight:700; color:var(--muted); }
.sht .calcing li i { width:26px; height:26px; border-radius:50%; border:2px solid var(--line-2); display:grid; place-items:center; flex:none; font-style:normal; font-size:13px; }
.sht .calcing li.doing { color:var(--ink); } .sht .calcing li.doing i { border-color:var(--teal); border-top-color:transparent; animation:sht-spin .8s linear infinite; }
.sht .calcing li.done { color:var(--ink); } .sht .calcing li.done i { background:var(--teal); border-color:var(--teal); color:#fff; }
@keyframes sht-spin { to { transform:rotate(360deg); } }
.sht .calcing .bar { height:6px; border-radius:9px; background:var(--cream-2); overflow:hidden; margin-top:14px; }
.sht .calcing .bar div { height:100%; width:0; background:linear-gradient(90deg,var(--teal),var(--gold-3)); transition:width .4s var(--ease); }
.sht .result { margin-top:18px; animation:sht-rise .45s var(--ease); }
@keyframes sht-rise { from { opacity:0; transform:translateY(10px); } }
.sht .rtop { border-radius:22px; padding:18px 20px; background:var(--plum-grad); color:#F1E3E9; position:relative; overflow:hidden; }
.sht .rtop .to { font-size:14px; color:#D9C3CC; padding-right:90px; } .sht .rtop .to b { color:#fff; font-size:16px; }
.sht .rtop .big { font:700 clamp(40px,6vw,52px)/1 Lora,serif; margin:8px 0 2px; background:var(--gold-grad); -webkit-background-clip:text; background-clip:text; color:transparent; background-size:200% 100%; animation:sht-sheen 7s linear infinite; }
.sht .rtop .sub { font-size:13.5px; color:#E3D3DA; }
.sht .rtop .badge { position:absolute; right:16px; top:16px; font:800 11.5px "Plus Jakarta Sans",sans-serif; border-radius:999px; padding:5px 10px; background:rgba(255,255,255,.14); color:#fff; border:1px solid rgba(255,255,255,.25); }
.sht .rtop .badge.ok { background:rgba(14,159,110,.3); }
.sht .brk { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:12px; }
.sht .brk div { background:var(--cream); border:1px solid var(--line); border-radius:16px; padding:12px; font-size:12.5px; color:var(--muted); }
.sht .brk b { display:block; font:800 17px "Plus Jakarta Sans",sans-serif; color:var(--ink); }
.sht .brk .t b { color:var(--teal-d); } .sht .brk .g b { color:var(--gold-4); }
@media (max-width:420px) { .sht .brk { grid-template-columns:1fr 1fr; } .sht .brk div:last-child { grid-column:1/-1; } }
.sht .how { margin-top:12px; font-size:13.5px; color:var(--ink-2); background:#fff; border:1px dashed var(--line-2); border-radius:14px; padding:10px 12px; }
.sht .acts2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:14px; } .sht .acts2 .full { grid-column:1/-1; }
@media (max-width:420px) { .sht .acts2 { grid-template-columns:1fr; } }
.sht .quote { border-radius:22px; padding:16px 18px; background:linear-gradient(135deg,var(--sky-s),#fff); border:1px solid #CFE0FB; }
.sht .share { margin-top:14px; border:1px solid var(--line); border-radius:18px; padding:14px; background:#fff; }
.sht .share .row2 { margin-top:10px; }
.sht .maptop { position:absolute; left:12px; right:12px; top:12px; z-index:4; display:flex; justify-content:space-between; gap:8px; pointer-events:none; flex-wrap:wrap; }
.sht .maptop > * { pointer-events:auto; }
.sht .mpill { background:rgba(255,255,255,.95); border-radius:999px; padding:7px 12px; font:800 12.5px "Plus Jakarta Sans",sans-serif; box-shadow:0 4px 14px rgba(0,0,0,.12); display:flex; gap:8px; align-items:center; }
.sht .mpill .dot { width:10px; height:10px; border-radius:50%; }
.sht .mapfoot { position:absolute; left:12px; bottom:12px; right:12px; z-index:4; display:flex; justify-content:space-between; align-items:end; gap:10px; pointer-events:none; }
.sht .dist { background:var(--plum-8); color:#fff; border-radius:18px; padding:10px 14px; box-shadow:0 10px 30px rgba(0,0,0,.25); pointer-events:auto; }
.sht .dist b { display:block; font:700 26px/1 Lora,serif; color:var(--gold-2); } .sht .dist small { color:#D6C2CB; font-size:12px; }
.sht .pinhint { position:absolute; left:50%; top:62px; translate:-50% 0; z-index:5; background:var(--coral-d); color:#fff; border-radius:999px; padding:8px 16px; font:800 13px "Plus Jakarta Sans",sans-serif; box-shadow:0 8px 24px rgba(239,91,76,.4); }
.sht .mk-yard { width:42px; height:42px; border-radius:50%; background:var(--plum-grad); border:3px solid var(--gold-2); display:grid; place-items:center; color:var(--gold-2); font:700 17px Lora,serif; box-shadow:0 6px 18px rgba(42,15,26,.4); }
.sht .mk-dest { width:40px; height:52px; cursor:grab; } .sht .mk-dest svg { width:40px; height:52px; filter:drop-shadow(0 6px 10px rgba(239,91,76,.45)); }
.sht .radar { width:100%; height:100%; display:block; }
.sht .radar .rp circle { fill:#5C2A3B; opacity:.55; } .sht .radar .rp text { font:600 10.5px "Plus Jakarta Sans",sans-serif; fill:#55424B; opacity:.8; }
.sht .radar .rp { cursor:pointer; } .sht .radar .rp:hover circle, .sht .radar .rp.on circle { fill:#EF5B4C; opacity:1; } .sht .radar .rp.on text { font-weight:800; fill:#24101A; opacity:1; }
.sht .radar .rk { font:800 11px "Plus Jakarta Sans",sans-serif; fill:#5C2A3B; opacity:.6; }
.sht .radar .rline { stroke-dasharray:1 9; }

/* areas browser + rules (delivery page) */
.sht .sec { padding:56px 0; } .sht .sec.alt { background:#fff; }
.sht .sh { display:flex; justify-content:space-between; align-items:end; gap:16px; flex-wrap:wrap; margin-bottom:20px; }
.sht .sh h2 { font-size:clamp(24px,3vw,38px); line-height:1.12; } .sht .sh p { margin-top:8px; color:var(--ink-2); max-width:640px; }
.sht .ctabs { display:flex; gap:8px; flex-wrap:wrap; }
.sht .ctabs button { border:0; border-radius:999px; padding:10px 16px; min-height:42px; font:800 14px "Plus Jakarta Sans",sans-serif; cursor:pointer; background:#fff; color:var(--ink-2); box-shadow:inset 0 0 0 1.5px var(--line); }
.sht .ctabs button[aria-selected=true] { background:var(--plum-7); color:#fff; box-shadow:none; }
.sht .ctabs button span { opacity:.75; font-weight:700; margin-left:4px; }
.sht .areas { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:16px; }
@media (min-width:700px) { .sht .areas { grid-template-columns:repeat(3,minmax(0,1fr)); } } @media (min-width:1000px) { .sht .areas { grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; } }
.sht .area { background:#fff; border:1px solid var(--line); border-radius:18px; padding:12px; cursor:pointer; text-align:left; display:grid; grid-template-columns:auto 1fr; gap:10px; align-items:center; transition:transform .15s var(--ease), box-shadow .2s, border-color .2s; min-height:64px; }
.sht .area:hover { transform:translateY(-2px); box-shadow:var(--shadow); border-color:var(--gold-2); }
.sht .area .ring { width:44px; height:44px; } .sht .area b { display:block; font-size:14.5px; line-height:1.2; } .sht .area small { color:var(--muted); font-size:12px; }
.sht .area .p { display:inline-block; margin-top:3px; font:800 13px "Plus Jakarta Sans",sans-serif; color:var(--plum-6); } .sht .area .p.q { color:#1E40AF; }
.sht .rules { display:grid; grid-template-columns:1fr 1fr; gap:12px; } @media (min-width:900px) { .sht .rules { grid-template-columns:repeat(4,1fr); gap:14px; } }
.sht .rule { border-radius:22px; padding:18px; background:#fff; border:1px solid var(--line); position:relative; overflow:hidden; }
.sht .rule::before { content:""; position:absolute; left:0; top:0; right:0; height:5px; }
.sht .rule.t::before { background:var(--teal); } .sht .rule.g::before { background:var(--gold-grad); } .sht .rule.c::before { background:var(--coral); } .sht .rule.s::before { background:var(--sky); }
.sht .rule .n { font:700 28px/1 Lora,serif; color:var(--plum-7); } .sht .rule h3 { font:800 15px "Plus Jakarta Sans",sans-serif; margin:10px 0 4px; } .sht .rule p { font-size:14px; color:var(--ink-2); }
.sht .marker { display:inline-block; background:var(--gold-1); color:#6B4A00; border:1px dashed var(--gold-3); border-radius:999px; padding:0 8px; font:700 11.5px/1.6 "Plus Jakarta Sans",sans-serif; white-space:nowrap; }
.sht .faq details { background:#fff; border:1px solid var(--line); border-radius:16px; padding:2px 18px; margin-top:10px; }
.sht .faq summary { cursor:pointer; font-weight:800; padding:14px 0; min-height:44px; }
.sht .faq p { padding-bottom:16px; color:var(--ink-2); }

/* compact picker (buy boxes · Quote List) — no map */
.sht.cp { position:relative; }
.sht .cp-trig { width:100%; min-height:58px; display:flex; align-items:center; gap:10px; padding:8px 12px; border:2px solid var(--line-2); border-radius:16px; background:#fff; cursor:pointer; text-align:left; font:700 15px "Plus Jakarta Sans",sans-serif; color:var(--ink); }
.sht .cp-trig[aria-expanded=true] { border-color:var(--coral); box-shadow:0 0 0 4px var(--coral-s); }
.sht .cp-trig .pin { width:36px; height:36px; border-radius:12px; background:var(--coral-s); color:var(--coral-d); display:grid; place-items:center; flex:none; } .sht .cp-trig .pin svg { width:18px; height:18px; }
.sht .cp-trig .v { flex:1; min-width:0; } .sht .cp-trig small { display:block; color:var(--muted); font-weight:600; font-size:12px; }
.sht .cp-trig .pr { font:800 14px "Plus Jakarta Sans",sans-serif; color:var(--plum-7); background:var(--gold-1); border-radius:999px; padding:4px 10px; white-space:nowrap; }
.sht .cp-panel { position:absolute; left:0; right:0; top:calc(100% + 6px); z-index:9500; background:#fff; border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow-lg); padding:10px; }
.sht .cp-panel ul { list-style:none; margin:6px 0 0; padding:0; max-height:250px; overflow:auto; }
.sht .cp-panel li[data-pid] { display:flex; justify-content:space-between; gap:10px; padding:10px; border-radius:12px; cursor:pointer; font-size:14.5px; min-height:44px; align-items:center; }
.sht .cp-panel li[data-pid]:hover, .sht .cp-panel li[aria-selected=true] { background:var(--cream); }
.sht .cp-panel li small { color:var(--muted); } .sht .cp-panel li b { color:var(--plum-7); white-space:nowrap; }
.sht .cp-panel .h { font:800 11px "Plus Jakarta Sans",sans-serif; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); padding:6px 10px; }
.sht .cp-foot { display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; border-top:1px solid var(--line); margin-top:6px; padding-top:10px; font-size:13.5px; font-weight:700; }
.sht .cp-foot input { width:84px; min-height:40px; border:1.5px solid var(--line-2); border-radius:10px; padding:0 8px; font-weight:700; margin-left:6px; }
.sht .cp-meas { display:flex; gap:10px; align-items:center; margin-top:8px; color:var(--teal-d); font-weight:700; font-size:14px; }
.sht .spin { width:18px; height:18px; border-radius:50%; border:3px solid var(--teal); border-top-color:transparent; animation:sht-spin .8s linear infinite; }
.sht .cp-line { display:flex; justify-content:space-between; gap:10px; align-items:center; font-size:14.5px; }
.sht .cp-line button { border:0; background:none; color:var(--plum-6); font-weight:800; text-decoration:underline; cursor:pointer; min-height:36px; }

/* pop-up calculator (checkout) */
.sht.pop { position:fixed; inset:0; z-index:99000; background:rgba(26,7,16,.55); backdrop-filter:blur(4px); display:grid; place-items:center; padding:20px; }
.sht.pop .box { width:min(1100px,100%); height:min(740px,100%); background:#fff; border-radius:28px; overflow:hidden; display:flex; flex-direction:column; box-shadow:0 40px 100px rgba(0,0,0,.4); animation:sht-rise .3s var(--ease); }
.sht.pop header { display:flex; justify-content:space-between; align-items:center; padding:12px 16px 12px 20px; background:var(--plum-grad); color:#fff; }
.sht.pop header b { font:700 19px Lora,serif; }
.sht.pop .x { width:44px; height:44px; border-radius:50%; border:0; background:rgba(255,255,255,.15); color:#fff; font-size:24px; cursor:pointer; }
.sht.pop .body { flex:1; display:grid; grid-template-columns:1fr; grid-template-rows:36vh 1fr; min-height:0; }
.sht.pop .body .ctl { padding:16px; overflow:auto; } .sht.pop .body .mapcol { position:relative; min-height:0; order:-1; }
@media (min-width:820px) { .sht.pop .body { grid-template-columns:420px 1fr; grid-template-rows:none; } .sht.pop .body .mapcol { order:0; } .sht.pop .body .ctl { padding:20px; } }
@media (max-width:819px) { .sht.pop { padding:0; } .sht.pop .box { height:100%; border-radius:0; } }

/* link page (/where/{code}) */
.sht .where { max-width:560px; margin:0 auto; }
.sht .where .card { background:#fff; border-radius:26px; box-shadow:var(--shadow-lg); padding:22px; margin-top:-40px; position:relative; z-index:5; }
.sht .where .big-gps { width:100%; display:grid; justify-items:center; gap:8px; text-align:center; border:0; border-radius:24px; padding:26px 18px; background:linear-gradient(135deg,#13A08F,#0B6F63); color:#fff; cursor:pointer; box-shadow:0 16px 36px rgba(19,160,143,.35); }
.sht .where .big-gps svg { width:56px; height:56px; } .sht .where .big-gps b { font-size:20px; } .sht .where .big-gps small { color:#D7F4EF; font-size:14px; }

@media (prefers-reduced-motion:reduce) {
  .sht *, .sht *::before, .sht *::after, .sht-toast { animation:none !important; transition:none !important; }
  .sht .btn.lux::after { display:none; }
}
@media print {
  body * { visibility:hidden; }
  .sht .side .plan, .sht .side .plan * { visibility:visible; }
  .sht .side { display:block !important; position:absolute; left:0; top:0; width:100%; }
  .sht .side .plan { box-shadow:none; border:0; max-height:none; }
  .sht .pl-more, .sht .pl-foot .btn, .sht .pl-l .x, .sht .pl-l .q button, .sht .pl-h button, .sht .cp-panel { display:none !important; }
}

/* the Atlas layout (delivery page, decision D-30): on desktop the map IS the card, the controls float over it */
@media (min-width:900px) {
  .sht .calc.atlas { display:block; height:min(780px, calc(100vh - 130px)); min-height:620px; }
  .sht .calc.atlas .mapcol { position:absolute; inset:0; min-height:0; }
  .sht .calc.atlas .ctl { position:absolute; left:20px; top:20px; bottom:20px; width:440px; z-index:10; overflow:auto; overscroll-behavior:contain;
    background:rgba(255,255,255,.95); backdrop-filter:blur(18px) saturate(1.3); -webkit-backdrop-filter:blur(18px) saturate(1.3); border:1px solid rgba(255,255,255,.7); border-radius:26px; box-shadow:0 30px 80px rgba(21,24,33,.22); padding:22px; }
  .sht .calc.atlas .maptop { left:auto; right:14px; flex-direction:column; align-items:flex-end; }
  .sht .calc.atlas .mapfoot { left:auto; right:14px; justify-content:flex-end; }
  .sht .calc.atlas .pinhint { left:calc(50% + 230px); }
}
/* the site paints every scrollbar green; inside the tools a quiet one reads better */
.sht .ctl, .sht .pl-body, .sht .sugg, .sht .cp-panel ul { scrollbar-width:thin; scrollbar-color:#D9CDBD transparent; }
.sht .ctl::-webkit-scrollbar, .sht .pl-body::-webkit-scrollbar, .sht .sugg::-webkit-scrollbar { width:8px; }
.sht .ctl::-webkit-scrollbar-thumb, .sht .pl-body::-webkit-scrollbar-thumb, .sht .sugg::-webkit-scrollbar-thumb { background:#D9CDBD; border-radius:8px; }
.sht .ctl::-webkit-scrollbar-track, .sht .pl-body::-webkit-scrollbar-track, .sht .sugg::-webkit-scrollbar-track { background:transparent; }
/* phones: all four doors visible at once (a swiped tab bar hid "Something custom" off-screen at 375 px) */
@media (max-width:600px) {
  .sht .tabs { display:grid; grid-template-columns:1fr 1fr; overflow:visible; }
  .sht .tabs button { white-space:normal; font-size:13px; padding:10px 8px; min-height:48px; flex:none; }
}
/* the work area must never be widened by its nowrap bars (tabs, moments): minmax(0,1fr) + min-width:0.
   Found on a 375 px phone where cards ran off the right edge — hidden by the site's overflow-x:clip, so no scrollbar showed it. */
.sht .work { grid-template-columns:minmax(0,1fr); }
@media (min-width:1000px) { .sht .work { grid-template-columns:minmax(0,1fr) 380px; } }
.sht .main, .sht .view, .sht .em, .sht .basics .wrap, .sht .brow > * { min-width:0; }
.sht .occ, .sht .jump, .sht .tabs { max-width:100%; }
@media (max-width:600px) {
  .sht .mpill { font-size:11.5px; padding:6px 10px; }
  .sht .maptop .mpill:last-child { display:none; }   /* "Your venue" legend: the coral pin explains itself on a small map */
  .sht .dist { padding:8px 12px; } .sht .dist b { font-size:20px; }
}