*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { background: #241E17; color: #EDE5D8; -webkit-font-smoothing: antialiased; }
a { cursor: pointer; }
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

.th-snap { scroll-snap-type: y proximity; }
.th-room { scroll-snap-align: start; scroll-snap-stop: normal; min-height: 100vh; }

@keyframes th-placardIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }

input:focus, button:focus, a:focus { outline: 1px solid #C8A04A; outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

@media (max-width: 768px) {
  .three-doors { grid-template-columns: 1fr !important; }
  .three-doors > div { border-left: none !important; border-top: 1px solid #332C22 !important; }
  .collection-grid { grid-template-columns: 1fr 1fr !important; }
  .editorial-grid { grid-template-columns: 1fr !important; }
  .footer-grid { grid-template-columns: 1fr 1fr !important; }
  .hero-cta { flex-direction: column !important; }
  .nav-links { display: none !important; }
  .nav-burger { display: flex !important; }
  .toggle-label { display: none; }
  .visualiser-layout { grid-template-columns: 1fr !important; }
  .visualiser-layout > div:first-child { border-right: none !important; border-bottom: 1px solid #332C22; }
  .audience-grid { grid-template-columns: 1fr !important; }
  .special-grid { grid-template-columns: 1fr 1fr !important; }
  .th-rail { display: none !important; }
}

@media (max-width: 480px) {
  .collection-grid { grid-template-columns: 1fr !important; }
  .footer-grid { grid-template-columns: 1fr !important; }
  .special-grid { grid-template-columns: 1fr !important; }
}

.th-slider {
  width: 100%; height: 2px; background: #332C22;
  outline: none; -webkit-appearance: none; appearance: none; margin: 0;
}
.th-slider::-webkit-slider-thumb {
  -webkit-appearance: none; width: 14px; height: 14px; border-radius: 50%;
  background: var(--th-accent, #C8A04A); cursor: pointer; margin-top: 0;
  box-shadow: 0 0 0 4px rgba(0,0,0,0.25);
}
.th-slider::-moz-range-thumb {
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--th-accent, #C8A04A); border: none; cursor: pointer;
}
.th-slider::-moz-range-track { height: 2px; background: #332C22; }
