:root {
  color-scheme: dark;
  --background: #11101b;
  --surface: #1c1929;
  --edge: #423852;
  --text: #faf7ff;
  --muted: #c9c0d8;
  --accent: #dfff4e;
  --focus: #74eaff;
  --card-bg: #faf8fc;
  --card-ink: #211829;
  --card-price: #415b35;
  --card-line: #e5e0eb;
  --card-media: #eae5ee;
  --field-bg: #faf8ff;
  --field-ink: #201728;
  --field-border: #b8aac9;
  --paper: var(--text);
  --ink: var(--background);
  --lime: var(--accent);
  --line: var(--edge);
  color: var(--text);
  background: var(--background);
}

body {
  color: var(--text);
  background: radial-gradient(ellipse at 85% 5%, #29203e 0%, transparent 34%), var(--background);
}

:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
.top {
  background: linear-gradient(110deg, #19182e, #10101a 57%, #20152f);
  border-bottom-color: #9571eb;
}
.logo > span, .brand > span, .footer .logo > span {
  background: var(--accent);
  color: #17111c;
}
.skip, .button.lime, .button.solid {
  background: var(--accent);
  color: #17111c;
}
.button.lime:hover, .button.solid:hover { background: #eeff98; }
.button.outline, .button.secondary {
  background: var(--surface);
  border-color: var(--edge);
  color: var(--text);
}
.button.outline:hover, .button.secondary:hover { border-color: var(--accent); background: var(--surface); }
.hero:has(.hero-media) {
  color: var(--text);
  background: linear-gradient(120deg,#1c1929,#241c35);
  border: 1px solid var(--edge);
}
.hero-copy > p, .hero-note { color: var(--muted); }
.hero-media { background: #251c35; }
.hero-media-note {
  background: #161020;
  border-color: var(--edge);
  color: var(--text);
}
.hero-media-note strong, .text-link, .method a, .catalog-note a { color: var(--accent); }
.filters, .calculator {
  background: var(--surface);
  color: var(--text);
}
.filters input, .filters select, .controls input, .controls select, .calculator input {
  color-scheme: light;
  background: var(--field-bg);
  color: var(--field-ink);
  border-color: var(--field-border);
}
.product, .item {
  background: var(--card-bg);
  color: var(--card-ink);
  border-color: var(--card-line);
}
.product:hover, .item:hover { border-color: var(--accent); }
.product-image, .item img { background: var(--card-media); }
.product-category, .product-cost span, .product-budget { color: #574a62; }
.product-budget:hover { color: var(--card-ink); }
.product-cost strong, .item-price { color: var(--card-price); }
.shipping { background: #251c35; border: 1px solid var(--edge); }
.method h2 { color: var(--text); }
.footer { background: #191426; border-top: 1px solid var(--edge); color: var(--text); }
.footer p, .footer-inner > a:last-child { color: var(--muted); }

.hero h1 { letter-spacing: -.07em; }
.hero h1 em { font-size: .83em; }
.order-section { padding-block: 50px 39px; }
.order-section .section-heading p { max-width: 760px; }
.journey { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; list-style:none; counter-reset:step; padding:0; margin:0; }
.journey li { counter-increment:step; padding:15px; border:1px solid var(--edge); border-radius:9px; background:var(--surface); }
.journey li::before { display:block; content:counter(step) "."; font-weight:800; color:var(--accent); margin-bottom:6px; }
.journey strong { display:block; margin-bottom:6px; }
.journey p { color:var(--muted); font-size:14px; }
.shipping + .catalog-section { padding-bottom:30px; }
.editorial { padding-top:19px; }
@media (max-width:760px) {
  .order-section{padding-block:34px 29px}
  .journey{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .journey li{padding:11px}
}
@media (max-width:380px) {
  .journey{grid-template-columns:1fr}
}
