/* Techno Door white-theme accessibility and conversion layer - 2026-09 */
:root {
  --td-ink: #122433;
  --td-muted: #52606b;
  --td-line: #dce3e8;
  --td-soft: #f4f7f9;
  --td-white: #ffffff;
  --td-accent: #a66c12;
  --td-accent-dark: #7b4d08;
  --td-focus: #005fcc;
}

html { color-scheme: light; scroll-behavior: smooth; }
body { background: var(--td-white) !important; color: var(--td-ink) !important; }
a { text-underline-offset: .18em; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 3px solid var(--td-focus) !important;
  outline-offset: 3px !important;
}

.nav { background: rgba(255,255,255,.97) !important; border-bottom: 1px solid var(--td-line) !important; box-shadow: 0 8px 30px rgba(18,36,51,.07) !important; }
.nav a, .brand-text, .nav-toggle { color: var(--td-ink) !important; }
.nav-links a:hover, .nav-links a[aria-current="page"] { color: var(--td-accent-dark) !important; }
.nav-toggle span, .nav-toggle::before, .nav-toggle::after { background: var(--td-ink) !important; }
.drawer { background: var(--td-white) !important; color: var(--td-ink) !important; }

.hero { background: linear-gradient(135deg,#fff 0%,#f4f7f9 58%,#e9eef2 100%) !important; color: var(--td-ink) !important; }
.hero::before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 82% 30%,rgba(166,108,18,.12),transparent 28%); }
.hero h1, .page-hero h1, h1, h2, h3, h4 { color: var(--td-ink) !important; }
.gradient-text { background: none !important; -webkit-text-fill-color: var(--td-accent-dark) !important; color: var(--td-accent-dark) !important; }
.hero-lede, .muted, .body, p { color: var(--td-muted); }
.eyebrow, .tag, .badge { color: var(--td-accent-dark) !important; border-color: #d8b271 !important; background:#fff8ec !important; }
.logo3d-stage { background: url('/img/products/techno-door-full-metal-works-hero.png') center/cover no-repeat !important; border:1px solid var(--td-line); border-radius:22px; box-shadow:0 24px 64px rgba(18,36,51,.16); min-height:440px; }
.logo3d-stage .logo3d { display:none !important; }
.scroll-cue { border-color: var(--td-ink) !important; }

.section, .section--graphite, .page-hero { background: var(--td-white) !important; color: var(--td-ink) !important; }
.section:nth-of-type(even), .section--graphite, .trust { background: var(--td-soft) !important; }
.product-card, .feature, .tile, .split-img { background:var(--td-white) !important; color:var(--td-ink) !important; border:1px solid var(--td-line) !important; box-shadow:0 12px 34px rgba(18,36,51,.08) !important; }
.product-card:hover, .tile:hover { transform:translateY(-4px); box-shadow:0 18px 42px rgba(18,36,51,.14) !important; }
.product-card img, .tile img { background:#eef2f4; }
.trust, .trust-item { color:var(--td-ink) !important; border-color:var(--td-line) !important; }

.btn-primary { background:var(--td-accent-dark) !important; color:#fff !important; border-color:var(--td-accent-dark) !important; }
.btn-primary:hover { background:#5d3905 !important; }
.btn-ghost, .btn-dark { background:#fff !important; color:var(--td-ink) !important; border:2px solid var(--td-ink) !important; }
.btn-ghost:hover, .btn-dark:hover { background:var(--td-ink) !important; color:#fff !important; }

.cta-band { background:var(--td-ink) !important; color:#fff !important; }
.cta-band h2, .cta-band p { color:#fff !important; }
.footer { background:#eef2f4 !important; color:var(--td-ink) !important; border-top:1px solid var(--td-line) !important; }
.footer a, .footer p, .footer li, .footer-bottom { color:#42515c !important; }
.footer a:hover { color:var(--td-accent-dark) !important; }

.td-generated-section { background:#fff; padding:clamp(56px,8vw,104px) 0; }
.td-generated-head { max-width:760px; margin:0 auto 34px; text-align:center; }
.td-generated-head p { margin-top:10px; }
.td-generated-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.td-product-visual { position:relative; overflow:hidden; border:1px solid var(--td-line); border-radius:16px; background:#fff; box-shadow:0 12px 34px rgba(18,36,51,.09); }
.td-product-visual img { display:block; width:100%; aspect-ratio:3/2; object-fit:cover; background:#eef2f4; }
.td-product-copy { padding:18px; }
.td-product-copy h3 { margin:0 0 7px; font-size:1.08rem; }
.td-product-copy p { margin:0; font-size:.9rem; line-height:1.55; }
.td-visual-label { position:absolute; top:12px; left:12px; z-index:2; padding:7px 10px; border-radius:999px; background:rgba(18,36,51,.92); color:#fff; font-size:.72rem; font-weight:700; letter-spacing:.03em; }

.gallery-grid { gap:20px !important; }
.gallery-grid .tile { border-radius:14px; overflow:hidden; }
.gallery-grid .tile img { width:100%; aspect-ratio:3/2; object-fit:cover; }
.filter-bar button { background:#fff !important; color:var(--td-ink) !important; border:1px solid var(--td-line) !important; }
.filter-bar button.active, .filter-bar button:hover { background:var(--td-ink) !important; color:#fff !important; }

input, textarea, select { background:#fff !important; color:var(--td-ink) !important; border:1px solid #9aa8b2 !important; }
::placeholder { color:#65737d !important; opacity:1; }

@media (max-width: 980px) {
  .td-generated-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .logo3d-stage { min-height:330px; }
}
@media (max-width: 640px) {
  .td-generated-grid { grid-template-columns:1fr; }
  .logo3d-stage { min-height:250px; margin-top:24px; }
  .hero { padding-top:110px !important; }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}
@media (forced-colors: active) {
  .btn,.tile,.product-card,.feature { border:1px solid CanvasText !important; }
}
