/* ==========================================================================
   Theme: Luxury Mono, black, ivory, serif, and room to breathe.
   Boutique restraint: no boxes where a hairline will do, no motion
   where a fade will do.
   ========================================================================== */

[data-theme="luxe"] {
  --bg: #101010;
  --bg-soft: #161514;
  --surface: #181715;
  --ink: #ece5d3;
  --muted: #a59e8c;
  --accent: #ece5d3;
  --accent-ink: #101010;
  --accent-2: #6f6a5e;
  --line: #2e2c27;
  --border-w: 1px;
  --radius: 0px;
  --radius-lg: 0px;
  --shadow: none;
  --shadow-strong: none;

  --font-display: "Cormorant Garamond", Georgia, serif;
  --h-weight: 500;
  --h-tracking: 0.005em;
  --h-transform: none;
  --kicker-font: "Inter", sans-serif;
  --btn-radius: 0px;
  --tk-speed: 32;
}

/* Vast pacing */
[data-theme="luxe"] .section { padding-block: clamp(5rem, 11vw, 8.5rem); }
[data-theme="luxe"] .hero { padding-block: clamp(5rem, 12vw, 9.5rem); }
[data-theme="luxe"] .hero-title { font-size: clamp(2.5rem, 6.4vw, 4.6rem); line-height: 1.04; }
[data-theme="luxe"] .hero-title em { font-style: italic; color: var(--ink); }
[data-theme="luxe"] .section-title { font-size: clamp(1.9rem, 4vw, 3rem); }

[data-theme="luxe"] .kicker {
  color: var(--muted);
  font-size: 0.66rem;
  letter-spacing: 0.42em;
  font-weight: 500;
}
[data-theme="luxe"] .kicker::after { content: ""; display: block; width: 2.4rem; height: 1px; background: var(--accent-2); margin-top: 0.8rem; }

[data-theme="luxe"] .btn {
  border: 1px solid var(--ink);
  font-weight: 500;
  font-size: 0.78rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  padding: 0.95rem 2rem;
  transition-duration: 0.35s;
}
[data-theme="luxe"] .btn--primary { background: var(--ink); color: var(--bg); }
[data-theme="luxe"] .btn--primary:hover { background: transparent; border-color: var(--ink); color: var(--ink); }
[data-theme="luxe"] .btn--ghost { border-color: var(--accent-2); }
[data-theme="luxe"] .btn--ghost:hover { background: var(--ink); color: var(--bg); border-color: var(--ink); }

[data-theme="luxe"] .site-header { border-bottom: 1px solid var(--line); padding-block: 0.9rem; }
[data-theme="luxe"] .brand-name { font-family: var(--font-display); font-weight: 500; font-size: 1.3rem; letter-spacing: 0.04em; }
[data-theme="luxe"] .brand-name i { color: var(--muted); font-style: italic; }
/* Keep the wide-tracked luxe nav from crowding the language selector before the
   nav collapses to the mobile menu; the boutique character stays at 0.08em. */
[data-theme="luxe"] .nav-link { font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; }
[data-theme="luxe"] .lang-btn { border-color: var(--line); }

[data-theme="luxe"] .hp {
  border: none;
  border-bottom: 1px solid var(--accent-2);
  background: transparent;
  border-radius: 0;
  font-weight: 500;
  font-size: 0.74rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  padding-inline: 0.2rem;
}

/* Hero: a thin frame, a serif numeral, nothing else */
[data-theme="luxe"] .ha-1 {
  opacity: 1; inset: 4% 16% 10% -4%;
  width: auto; height: auto;
  border: 1px solid var(--line);
}
[data-theme="luxe"] .ha-3 {
  opacity: 1;
  top: -4%; right: 8%;
  font-family: var(--font-display);
  font-style: italic;
  font-size: 5.5rem;
  color: transparent;
  -webkit-text-stroke: 1px var(--accent-2);
}
[data-theme="luxe"] .ha-3::before { content: "№1"; }
[data-theme="luxe"] .win {
  background: var(--surface);
  border: 1px solid var(--line);
}
[data-theme="luxe"] .win--hero { inset: 14% 0 auto 12%; }
[data-theme="luxe"] .win-bar { border-bottom: 1px solid var(--line); color: var(--muted); }
[data-theme="luxe"] .win-dots i { background: var(--accent-2); width: 0.4rem; height: 0.4rem; }
[data-theme="luxe"] .ha-line { background: #242220; }
[data-theme="luxe"] .ha-chip { background: var(--ink); }
[data-theme="luxe"] .ha-chip--alt { border: 1px solid var(--accent-2); }

/* Ticker: an engraved line of small caps */
[data-theme="luxe"] .ticker {
  background: var(--bg);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding-block: 0.85rem;
}
[data-theme="luxe"] .tk-item {
  font-family: "Inter", sans-serif;
  color: var(--muted);
  font-size: 0.64rem;
  letter-spacing: 0.38em;
}
[data-theme="luxe"] .tk-sep { color: var(--accent-2); margin-inline: 2.4rem; }
[data-theme="luxe"] .tk-sep::before { content: "·"; }

/* Surfaces: hairlines, not boxes */
[data-theme="luxe"] .svc-card, [data-theme="luxe"] .why-card,
[data-theme="luxe"] .step, [data-theme="luxe"] .demo-card,
[data-theme="luxe"] .price-card, [data-theme="luxe"] .form,
[data-theme="luxe"] .win--admin, [data-theme="luxe"] .mode-panel {
  background: transparent;
  border: 1px solid var(--line);
}
[data-theme="luxe"] .svc-card:hover, [data-theme="luxe"] .demo-card:hover {
  transform: none;
  border-color: var(--accent-2);
  background: var(--bg-soft);
}
[data-theme="luxe"] .svc-icon { color: var(--muted); }
[data-theme="luxe"] .svc-card h3, [data-theme="luxe"] .why-card h3,
[data-theme="luxe"] .step h3, [data-theme="luxe"] .sys-item h3 {
  font-size: 1.3rem;
}
[data-theme="luxe"] .demo-thumb { background: var(--bg-soft); border-color: var(--line); }
[data-theme="luxe"] .dt-a { background: var(--ink); opacity: 0.7; }
[data-theme="luxe"] .dt-b { background: var(--accent-2); }
[data-theme="luxe"] .dt-c { background: var(--ink); opacity: 0.18; }

[data-theme="luxe"] .why-num {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1.6rem;
  color: var(--accent-2);
}
[data-theme="luxe"] .step-num {
  border: 1px solid var(--accent-2);
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1rem;
}
[data-theme="luxe"] .demo-status { border-color: var(--line); letter-spacing: 0.22em; }
[data-theme="luxe"] .demo-status--prod { border-color: var(--muted); color: var(--ink); }

[data-theme="luxe"] .price-amount { font-family: var(--font-display); font-weight: 500; font-size: clamp(2.6rem, 4.6vw, 3.4rem); }
[data-theme="luxe"] .price-badge {
  background: transparent;
  border: 1px solid var(--ink);
  color: var(--ink);
  letter-spacing: 0.26em;
}
[data-theme="luxe"] .price-card--featured { border-color: var(--ink); background: var(--bg-soft); }
[data-theme="luxe"] .price-list li::before { content: "·"; color: var(--ink); }

[data-theme="luxe"] .field input, [data-theme="luxe"] .field select, [data-theme="luxe"] .field textarea {
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--accent-2);
  border-radius: 0;
  color: var(--ink);
  padding-inline: 0.1rem;
}
[data-theme="luxe"] .field select option { background: #161514; color: var(--ink); }
[data-theme="luxe"] .field input:focus, [data-theme="luxe"] .field select:focus, [data-theme="luxe"] .field textarea:focus {
  border-bottom-color: var(--ink);
}
[data-theme="luxe"] .form { padding: clamp(1.8rem, 4vw, 2.6rem); }
[data-theme="luxe"] .site-footer { border-top: 1px solid var(--line); }
[data-theme="luxe"] .car-btn { background: transparent; border: 1px solid var(--accent-2); border-radius: 50%; }
[data-theme="luxe"] .car-btn:hover { background: var(--ink); color: var(--bg); }
[data-theme="luxe"] .mp-title { font-size: 1.6rem; font-style: italic; }
[data-theme="luxe"] .mp-label { color: var(--muted); letter-spacing: 0.3em; }
[data-theme="luxe"] .mp-dot { border-color: rgba(236, 229, 211, 0.35); }
[data-theme="luxe"] .palette-pop { background: #1c1a18; }
[data-theme="luxe"] .pp-option:hover { background: #242220; }
[data-theme="luxe"] ::selection { background: var(--ink); color: var(--bg); }
[data-theme="luxe"] :focus-visible { outline-color: var(--ink); }

/* Motion: nothing moves, things appear */
[data-theme="luxe"] .reveal { transform: none; transition-duration: 1s; }

/* --------------------------------------------------------------------------
   Self-preview
   -------------------------------------------------------------------------- */
.mode-card[data-mode="luxe"] .mc-prev {
  background: #101010;
  border: 1px solid #2e2c27;
  border-radius: 0;
}
.mode-card[data-mode="luxe"] .mp-a {
  inset: 0.5rem; width: auto; height: auto;
  border: 1px solid #2e2c27;
  background: none;
}
.mode-card[data-mode="luxe"] .mp-b {
  width: 1.8rem; height: 1px;
  background: #6f6a5e;
  left: 1rem; bottom: 1.1rem;
}
.mode-card[data-mode="luxe"] .mp-c { display: none; }
.mode-card[data-mode="luxe"] .mc-aa {
  font-family: "Cormorant Garamond", serif; font-style: italic; font-weight: 500;
  color: #ece5d3; left: 1rem; top: 0.8rem; font-size: 1.7rem;
}