/* v2.css — Auto-generated by v2-bundle.mjs. DO NOT EDIT. */
/* --- tailwind/themes/tech-product/obsidian.css --- */
/* ═══════════════════════════════════════════════════════════════════
   OBSIDIAN — T3 Gemstone tech-product dark theme (tokens)
   Ported from Gamestone Web Yeni 2 / styles.css v3 (2026-06-26).
   Palette: bg #07070b, surface #11111c, cyan #22e0ff (signature),
            purple #a78bfa, iridescent gradient #22e0ff→#60a5fa→#a78bfa→#c4b5fd.
   Fonts: Space Grotesk (display) + Inter (body) + JetBrains Mono — loaded via _Layout.
   Token layer only — layout/composition lives in
   tailwind/templates/tech-product/obsidian.css
   ═══════════════════════════════════════════════════════════════════ */

[data-sector="tech-product"] {
  /* ── Color surfaces ── */
  --c-bg:            #07070b;
  --c-bg-2:          #0c0c14;
  --c-bg-3:          #11111c;
  --c-surface:       #11111c;
  --c-surface-2:     #161624;
  --c-surface-3:     #1c1c2e;
  --c-border:        rgba(255, 255, 255, 0.08);
  --c-border-strong: rgba(255, 255, 255, 0.16);
  --c-divider:       rgba(255, 255, 255, 0.06);

  /* ── Color text ── */
  --c-text:          #f2f2f7;
  --c-text-strong:   #ffffff;
  --c-text-muted:    #a1a1b5;
  --c-text-dim:      #6b6b80;

  /* ── Iridescent accents (signature) ── */
  --c-accent:        #a78bfa;
  --c-accent-soft:   #c4b5fd;
  --c-cyan:          #22e0ff;
  --c-cyan-soft:     #67e8f9;
  --c-blue:          #60a5fa;

  /* ── Signature gradients ── */
  --grad-iridescent:     linear-gradient(135deg, #22e0ff 0%, #60a5fa 35%, #a78bfa 70%, #c4b5fd 100%);
  --grad-iridescent-rev: linear-gradient(135deg, #c4b5fd 0%, #a78bfa 30%, #60a5fa 65%, #22e0ff 100%);
  --grad-text:           linear-gradient(135deg, #22e0ff 0%, #a78bfa 60%, #c4b5fd 100%);
  --grad-text-soft:      linear-gradient(135deg, #67e8f9 0%, #c4b5fd 60%, #ddd6fe 100%);
  --grad-purple:         linear-gradient(135deg, #8b5cf6, #c4b5fd);
  --grad-cyan:           linear-gradient(135deg, #22e0ff, #67e8f9);

  /* ── Legacy "dark zone" tokens ── */
  --c-dark-bg:           #07070b;
  --c-dark-bg-2:         #0c0c14;
  --c-dark-surface:      #11111c;
  --c-dark-surface-2:    #161624;
  --c-dark-border:       rgba(255, 255, 255, 0.08);
  --c-dark-border-strong:rgba(255, 255, 255, 0.18);
  --c-dark-text:         #f6f6fb;
  --c-dark-text-muted:   #a1a1c0;
  --c-dark-text-dim:     #6b6b88;

  /* ── Font stacks ── */
  --f-display: "Space Grotesk", "Inter", system-ui, sans-serif;
  --f-body:    "Inter", system-ui, -apple-system, sans-serif;
  --f-mono:    "JetBrains Mono", "SF Mono", Menlo, monospace;

  /* ── V1-compat font aliases (used by _base-components.css) ── */
  --font-heading:  var(--f-display);
  --font-body:     var(--f-body);
  --font-mono:     var(--f-mono);
  --font-display:  var(--f-display);
  --font-sans:     var(--f-body);
  --font-accent:   var(--f-mono);

  /* ── Spacing tokens ── */
  --sp-1: 4px;  --sp-2: 8px;   --sp-3: 12px;  --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px;  --sp-7: 32px;  --sp-8: 40px;
  --sp-9: 48px; --sp-10: 64px; --sp-11: 80px; --sp-12: 120px;

  /* ── Layout ── */
  --radius-sm:   8px;
  --radius-md:   14px;
  --radius-lg:   20px;
  --radius-xl:   28px;
  --radius-full: 9999px;

  --container: 1240px;
  --maxw:      1240px;

  /* ── Shadows ── */
  --shadow-glow: 0 0 60px -10px rgba(34, 224, 255, 0.35);
  --shadow-card: 0 1px 0 0 rgba(255,255,255,0.04) inset, 0 30px 60px -20px rgba(0,0,0,0.6);
  --shadow-elev: 0 1px 0 0 rgba(255,255,255,0.04) inset, 0 30px 60px -12px rgba(0,0,0,0.65), 0 0 40px -10px rgba(167,139,250,0.25);
  --shadow-sm:   0 1px 4px rgb(0 0 0 / 0.40);
  --shadow-md:   0 2px 24px rgb(0 0 0 / 0.38);
  --shadow-lg:   0 8px 40px rgb(0 0 0 / 0.45);
  --shadow-xl:   0 16px 56px rgb(0 0 0 / 0.55);

  /* ── Motion ── */
  --t-fast:  160ms cubic-bezier(.4,0,.2,1);
  --t-med:   280ms cubic-bezier(.4,0,.2,1);
  --t-slow:  480ms cubic-bezier(.4,0,.2,1);

  --ease-precise:   cubic-bezier(0.4, 0, 0.2, 1);
  --ease-editorial: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --dur-glacier:    1200ms;
  --dur-smooth:     400ms;
  --dur-snap:       150ms;

  --transition-fast:   var(--dur-snap)    var(--ease-precise);
  --transition-base:   var(--dur-smooth)  var(--ease-editorial);
  --transition-slow:   var(--dur-glacier) var(--ease-editorial);
  --transition-smooth: var(--dur-glacier) var(--ease-editorial);

  /* ── V1-compat color aliases (used by _base-components.css) ── */
  --color-bg:            7 7 11;
  --color-surface:       17 17 28;
  --color-surface-alt:   12 12 20;
  --color-text:          242 242 247;
  --color-text-muted:    161 161 181;
  --color-heading:       255 255 255;
  --color-primary:       34 224 255;
  --color-primary-fg:    6 6 10;
  --color-accent:        167 139 250;
  --color-border:        38 38 50;
  --color-border-strong: 60 60 80;
  --color-overlay:        4  4  8;

  --color-success:  88 162 100;
  --color-warning: 210 158 48;
  --color-error:   210 78 62;
  --color-info:    100 148 208;

  --color-primary-light:  103 232 249;
  --color-primary-dark:   14 158 179;
  --color-secondary:      167 139 250;
  --color-secondary-light:196 181 253;
  --color-secondary-dark:  109 40 217;
  --color-accent-light:   196 181 253;
  --color-accent-dark:    109 40 217;
  --color-surface-dark:     7  7 11;
  --color-text-light:     161 161 181;
  --color-text-inverse:     6  6 10;

  /* ── Space ── */
  --space-section: 7.5rem;
  --space-block:   3rem;
  --space-element: 1rem;

  /* ── Obsidian bespoke shorthand tokens ── */
  --bg:   var(--c-bg);
  --bg2:  var(--c-bg-2);
  --card: var(--c-surface);
  --t1:   var(--c-text-strong);
  --t2:   var(--c-text);
  --t3:   #d4d4e8;
  --t4:   var(--c-text-muted);
  --t5:   #8a8aaa;
  --t6:   var(--c-text-dim);
  --line: var(--c-border);

  --teal:        var(--c-cyan);
  --teal-bright: var(--c-cyan-soft);
  --purple:      var(--c-accent);
}


/* --- tailwind/templates/_base-components.css --- */
/* =============================================================================
   Base Components — Shared across all templates
   All colors via rgb(var(--color-X)) pattern.
   Design reference: McKinsey.com · Aman.com · Linear.app
   Templates override individual properties; they never duplicate these rules.
   ============================================================================= */

/* ---------------------------------------------------------------------------
   1. HERO SECTION  — Aman-style: content anchored to bottom, dramatic overlay
   --------------------------------------------------------------------------- */

.hero-section {
  position: relative;
  overflow: hidden;
  min-height: 100vh;
  display: flex;
  align-items: flex-end;
  background-color: rgb(var(--color-surface-dark));
  color: rgb(var(--color-text-inverse));
}

/* Multi-stop cinematic gradient — transparent top, heavy at bottom */
.hero-section::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      to bottom,
      transparent 0%,
      rgb(var(--color-surface-dark) / 0.05) 15%,
      rgb(var(--color-surface-dark) / 0.15) 35%,
      rgb(var(--color-surface-dark) / 0.60) 65%,
      rgb(var(--color-surface-dark) / 0.88) 85%,
      rgb(var(--color-surface-dark) / 0.96) 100%
    ),
    radial-gradient(
      ellipse at center,
      transparent 40%,
      rgb(var(--color-surface-dark) / 0.35) 100%
    );
  pointer-events: none;
  z-index: 1;
}

.hero-content {
  position: relative;
  z-index: 2;
  padding-bottom: 12vh;
  width: 100%;
}

.hero-title {
  font-family: var(--font-heading);
  font-size: clamp(2.5rem, 6vw, 5rem);
  font-weight: 300;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: rgb(var(--color-text-inverse));
  text-shadow: 0 2px 24px rgb(0 0 0 / 0.25);
}

.hero-subtitle {
  font-family: var(--font-accent, var(--font-body));
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: rgb(var(--color-text-inverse) / 0.80);
  margin-bottom: 1.5rem;
}

/* ---------------------------------------------------------------------------
   2. BUTTONS  — minimal, typographic, editorial
   --------------------------------------------------------------------------- */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  font-family: var(--font-accent, var(--font-body));
  font-weight: 500;
  font-size: 0.75rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.875rem 2rem;
  border-radius: var(--radius-sm);
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  transition:
    background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1),
    border-color 0.4s cubic-bezier(0.4, 0, 0.2, 1),
    color 0.4s cubic-bezier(0.4, 0, 0.2, 1),
    transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
    box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-primary {
  background-color: rgb(var(--color-primary));
  color: rgb(var(--color-text-inverse));
  border-color: rgb(var(--color-primary));
}

.btn-primary:hover {
  background-color: rgb(var(--color-primary-dark));
  border-color: rgb(var(--color-primary-dark));
  transform: translateY(-1px) scale(1.01);
  box-shadow: 0 8px 28px rgb(var(--color-primary) / 0.30), var(--shadow-md);
}

/* For dark/image backgrounds */
.btn-outline {
  background-color: transparent;
  color: rgb(var(--color-text-inverse));
  border-color: rgb(var(--color-text-inverse) / 0.30);
}

.btn-outline:hover {
  background-color: rgb(var(--color-text-inverse) / 0.10);
  border-color: rgb(var(--color-text-inverse) / 0.60);
}

/* For light backgrounds */
.btn-outline-light {
  background-color: transparent;
  color: rgb(var(--color-primary));
  border-color: rgb(var(--color-primary));
}

.btn-outline-light:hover {
  background-color: rgb(var(--color-primary));
  color: rgb(var(--color-text-inverse));
  transform: translateY(-1px);
}

/* ---------------------------------------------------------------------------
   3. CARDS  — borderless, shadow-led, slow elegant hover
   --------------------------------------------------------------------------- */

.card {
  background-color: rgb(var(--color-surface));
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition:
    transform 0.5s cubic-bezier(0.4, 0, 0.2, 1),
    box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.card:hover {
  transform: translateY(-8px) scale(1.01);
  box-shadow: var(--shadow-xl);
}

.card img {
  width: 100%;
  display: block;
  object-fit: cover;
  transition: transform 1.2s ease-out;
}

.card:hover img {
  transform: scale(1.04);
}

.card-content {
  padding: 1.5rem;
}

@media (min-width: 1024px) {
  .card-content {
    padding: 2rem;
  }
}

/* ---------------------------------------------------------------------------
   4. SECTIONS  — generous vertical rhythm, centered editorial headings
   --------------------------------------------------------------------------- */

.section {
  padding-top: var(--space-section);
  padding-bottom: var(--space-section);
}

.section-heading {
  text-align: center;
  margin-bottom: 4rem;
}

.section-heading h2 {
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 3.5vw, 2.75rem);
  font-weight: 300;
  letter-spacing: -0.01em;
  color: rgb(var(--color-text));
  line-height: 1.15;
}

.section-heading p {
  max-width: 600px;
  margin-inline: auto;
  margin-top: 1.25rem;
  color: rgb(var(--color-text-light));
  font-size: 1rem;
  line-height: 1.8;
}

/* Centered accent rule beneath heading block */
.section-heading::after {
  content: "";
  display: block;
  width: 48px;
  height: 1px;
  background-color: rgb(var(--color-accent));
  margin: 2rem auto 0;
}

/* ---------------------------------------------------------------------------
   5. NAVIGATION  — micro-typography, centered underline animation
   --------------------------------------------------------------------------- */

.nav-link {
  position: relative;
  font-family: var(--font-accent, var(--font-body));
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: inherit;
  text-decoration: none;
  padding: 0.5rem 0;
  transition: color var(--transition-base);
}

.nav-link::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 1px;
  background-color: rgb(var(--color-accent));
  transition:
    width var(--transition-base),
    left var(--transition-base);
}

.nav-link:hover::after,
.nav-link.active::after {
  width: 100%;
  left: 0;
}

/* ---------------------------------------------------------------------------
   6. STATS  — ultra-light numerals, vertical dividers
   --------------------------------------------------------------------------- */

.stats-section {
  background-color: rgb(var(--color-primary-dark));
  color: rgb(var(--color-text-inverse));
  text-align: center;
  padding-top: var(--space-section);
  padding-bottom: var(--space-section);
}

.stat-value {
  font-family: var(--font-heading);
  font-size: clamp(2.5rem, 5vw, 4rem);
  font-weight: 200;
  line-height: 1;
  color: rgb(var(--color-accent));
  font-variant-numeric: tabular-nums;
}

.stat-label {
  font-family: var(--font-accent, var(--font-body));
  font-size: 0.65rem;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgb(var(--color-text-inverse) / 0.60);
  margin-top: 0.75rem;
}

/* Vertical divider between stat columns */
.stat-divider {
  width: 1px;
  height: 60px;
  background-color: rgb(var(--color-text-inverse) / 0.10);
  align-self: center;
}

/* ---------------------------------------------------------------------------
   7. TESTIMONIALS  — large ghost quote mark, italic editorial quote
   --------------------------------------------------------------------------- */

.testimonial-card {
  position: relative;
  text-align: center;
  padding: 3rem 2.5rem;
  background-color: rgb(var(--color-surface));
  border-radius: var(--radius-xl);
  overflow: hidden;
}

/* Ghost opening quote mark */
.testimonial-card::before {
  content: '\201C';
  position: absolute;
  top: -0.25rem;
  left: 1.5rem;
  font-family: var(--font-heading);
  font-size: 5rem;
  line-height: 1;
  color: rgb(var(--color-accent) / 0.08);
  pointer-events: none;
  user-select: none;
}

.testimonial-card blockquote {
  position: relative;
  font-family: var(--font-heading);
  font-size: 1.25rem;
  font-style: italic;
  font-weight: 300;
  line-height: 1.9;
  color: rgb(var(--color-text));
  margin: 0;
}

.testimonial-card .author {
  display: block;
  font-family: var(--font-accent, var(--font-body));
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgb(var(--color-accent));
  margin-top: 2rem;
}

/* ---------------------------------------------------------------------------
   8. CTA BLOCK  — full-bleed gradient, restrained type
   --------------------------------------------------------------------------- */

.cta-section {
  background: linear-gradient(
    135deg,
    rgb(var(--color-primary-dark)) 0%,
    rgb(var(--color-primary)) 100%
  );
  color: rgb(var(--color-text-inverse));
  text-align: center;
  padding: 7rem 2rem;
}

.cta-section h2 {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3.5vw, 2.75rem);
  font-weight: 300;
  letter-spacing: -0.01em;
  color: rgb(var(--color-text-inverse));
}

.cta-section p {
  max-width: 500px;
  margin-inline: auto;
  margin-top: 1.25rem;
  color: rgb(var(--color-text-inverse) / 0.80);
  font-size: 1rem;
  line-height: 1.75;
}

/* ---------------------------------------------------------------------------
   9. GALLERY  — slow-zoom hover, no crop artifacts
   --------------------------------------------------------------------------- */

.gallery-item {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-lg);
  background-color: rgb(var(--color-surface-alt));
}

.gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 1.2s ease-out;
}

.gallery-item:hover img {
  transform: scale(1.06);
}

/* Subtle gradient reveal on hover */
.gallery-item::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgb(var(--color-surface-dark) / 0.50) 0%,
    transparent 60%
  );
  opacity: 0;
  transition: opacity var(--transition-base);
  pointer-events: none;
}

.gallery-item:hover::after {
  opacity: 1;
}

/* ---------------------------------------------------------------------------
   10. FOOTER  — dark, editorial column headers, restrained links
   --------------------------------------------------------------------------- */

footer {
  /* Virgüllü rgb + var yedeği: inline style yokken bile geçerli değer */
  background-color: rgb(var(--color-primary-dark, 8 47 73));
  color: rgb(var(--color-text-inverse, 253 250 245) / 0.80);
  font-family: var(--font-body);
  font-size: 0.875rem;
  line-height: 1.75;
  padding-top: 5rem;
  padding-bottom: 2rem;
}

footer h3,
footer h4 {
  font-family: var(--font-accent, var(--font-body));
  font-size: 0.65rem;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgb(var(--color-accent));
  margin-bottom: 1.5rem;
}

footer a {
  color: rgb(var(--color-text-inverse, 253 250 245) / 0.50);
  text-decoration: none;
  transition: color var(--transition-fast);
}

footer a:hover {
  /* İç içe var() rgb() içinde geçersiz sayılabiliyor; üçlü yedek kullan */
  color: rgb(var(--color-accent-light, 236 130 108));
}

.footer-bottom {
  border-top: 1px solid rgb(var(--color-text-inverse, 253 250 245) / 0.08);
  padding-top: 2rem;
  margin-top: 3rem;
  font-size: 0.75rem;
  color: rgb(var(--color-text-inverse, 253 250 245) / 0.40);
}

/* ---------------------------------------------------------------------------
   11. PROSE / RICH TEXT  — reading-optimized, light headings
   --------------------------------------------------------------------------- */

.prose h2 {
  font-family: var(--font-heading);
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  font-weight: 300;
  letter-spacing: -0.01em;
  color: rgb(var(--color-text));
  margin-top: 2.5rem;
  margin-bottom: 1.5rem;
}

.prose p {
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.9;
  color: rgb(var(--color-text-light));
  margin-bottom: 1.25rem;
}

.prose strong {
  font-weight: 500;
  color: rgb(var(--color-text));
}

/* ---------------------------------------------------------------------------
   12. UTILITY CLASSES
   --------------------------------------------------------------------------- */

/* Site-wide max-width container */
.container-site {
  max-width: 1400px;
  margin-inline: auto;
  padding-inline: 1.25rem;
}

@media (min-width: 640px) {
  .container-site {
    padding-inline: 2rem;
  }
}

@media (min-width: 1024px) {
  .container-site {
    padding-inline: 3rem;
  }
}

/* Narrow reading container */
.container-narrow {
  max-width: 720px;
  margin-inline: auto;
}

/* Micro-label — category, eyebrow text */
.label {
  font-family: var(--font-accent, var(--font-heading));
  font-size: 0.65rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

/* Scroll-reveal animation */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition:
    opacity 0.9s cubic-bezier(0.4, 0, 0.2, 1),
    transform 0.9s cubic-bezier(0.4, 0, 0.2, 1);
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ---------------------------------------------------------------------------
   Footer — sütun menü linkleri (KEŞFET / DAHA FAZLA)
   Başlıklar <p> üzerinde text-white/* ile görünür; <a> ise çoğunlukla footer a +
   --color-text-inverse ile boyanıyordu. Panel temasında inverse koyu seçilince veya
   Tailwind opacity utility pakette yoksa linkler arka planla aynı tona düşüyordu.
   Özgüllük: footer a.cw-footer-nav-link, tek sınıflı color utility’lerini geçer.
   --------------------------------------------------------------------------- */

footer a.cw-footer-nav-link {
  color: rgba(255, 255, 255, 0.78);
  text-decoration: none;
  transition: color 0.2s ease;
}

footer a.cw-footer-nav-link:hover {
  color: rgb(var(--color-accent-light, 236 130 108));
}

footer a.cw-footer-legal-link {
  color: rgba(255, 255, 255, 0.72);
  text-decoration: none;
}

footer a.cw-footer-legal-link:hover {
  color: rgba(255, 255, 255, 0.92);
}


/* --- tailwind/templates/sector-signatures.css --- */
/* =============================================
   Sector Signature Design System
   Her sektörün kendine özgü atmosferi — token tabanlı, sabit hex minimum
   ============================================= */

/* ---- Shared cinematic helpers ---- */
[data-sector] .spotlight-layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
  mix-blend-mode: screen;
}

[data-sector] .hero-grid-noise {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.18;
  background-image:
    linear-gradient(to right, rgb(255 255 255 / 0.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgb(255 255 255 / 0.06) 1px, transparent 1px);
  background-size: 56px 56px;
}

[data-sector] .section-glass {
  background: rgb(255 255 255 / 0.05);
  border: 1px solid rgb(255 255 255 / 0.14);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

/* ---- Tourism: kıyı editoryal, sıcak–soğuk gradient mesh ---- */
[data-sector="tourism"] body {
  background:
    radial-gradient(1200px 520px at 8% 0%, rgb(var(--color-accent) / 0.14), transparent 58%),
    radial-gradient(1000px 480px at 92% 4%, rgb(var(--color-primary) / 0.12), transparent 55%),
    radial-gradient(900px 400px at 50% 100%, rgb(var(--color-secondary) / 0.06), transparent 60%),
    rgb(var(--color-surface));
}

[data-sector="tourism"] #site-navbar {
  border-bottom: 1px solid rgb(255 255 255 / 0.12);
}

[data-sector="tourism"] #site-navbar.navbar-scrolled {
  /* Parchment (light) scrolled navbar — green nav-link text needs a light bg.
     Sets the --nav-scroll-bg token consumed by the layered base rule in site.css.
     (Token override crosses @layers; a direct !important here would be out-cascaded.) */
  --nav-scroll-bg: 245 240 228;
  box-shadow: 0 16px 40px rgb(var(--color-primary-dark) / 0.12);
}

[data-sector="tourism"] .overlay {
  background:
    linear-gradient(178deg, rgb(var(--color-surface-dark) / 0.12) 0%, rgb(var(--color-surface-dark) / 0.45) 52%, rgb(var(--color-surface-dark) / 0.78) 100%),
    radial-gradient(720px 340px at 50% 100%, rgb(var(--color-accent) / 0.2), transparent 72%);
}

[data-sector="tourism"] .reservation-widget {
  border-radius: 14px;
  border: 1px solid rgb(255 255 255 / 0.22);
  background: linear-gradient(150deg, rgb(255 255 255 / 0.14), rgb(255 255 255 / 0.04));
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  box-shadow: 0 24px 48px rgb(var(--color-primary-dark) / 0.32);
  overflow: hidden;
  gap: 0;
}

[data-sector="tourism"] .reservation-field {
  background: rgb(255 255 255 / 0.05);
  border-right: 1px solid rgb(255 255 255 / 0.12);
  border-bottom: 1px solid rgb(255 255 255 / 0.08);
  min-height: 92px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

[data-sector="tourism"] .reservation-field label {
  color: rgb(255 255 255 / 0.65);
  letter-spacing: 0.14em;
}

[data-sector="tourism"] .reservation-field input,
[data-sector="tourism"] .reservation-field select {
  color: rgb(255 255 255 / 0.96);
  font-size: 15px;
  font-weight: 450;
}

[data-sector="tourism"] .reservation-field input::placeholder {
  color: rgb(255 255 255 / 0.55);
}

[data-sector="tourism"] .reservation-field select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.7)' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
}

[data-sector="tourism"] .reservation-btn {
  border-radius: 0;
  box-shadow: none;
  min-height: 100%;
  border-left: 1px solid rgb(255 255 255 / 0.14);
  padding-inline: 26px;
}

@media (max-width: 767px) {
  [data-sector="tourism"] .reservation-field {
    border-right: none;
  }

  [data-sector="tourism"] .reservation-btn {
    border-left: none;
    border-top: 1px solid rgb(255 255 255 / 0.14);
    min-height: 60px;
  }
}

[data-sector="tourism"] .menu-nav-link {
  font-size: clamp(18px, 2.1vw, 30px);
  letter-spacing: 0.01em;
}

/* ---- Corporate: kağıt üzerinde ızgara, mürekkep navbar ---- */
[data-sector="corporate"] body {
  background:
    linear-gradient(180deg, rgb(255 255 255 / 0.92), rgb(250 250 249)),
    rgb(var(--color-surface));
}

[data-sector="corporate"] .section,
[data-sector="corporate"] .section-lg {
  position: relative;
}

[data-sector="corporate"] .section::before,
[data-sector="corporate"] .section-lg::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(to right, rgb(24 24 27 / 0.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgb(24 24 27 / 0.04) 1px, transparent 1px);
  background-size: 48px 48px;
}

[data-sector="corporate"] #site-navbar {
  border-bottom: 1px solid rgb(228 228 231 / 0.35);
  background: linear-gradient(180deg, rgb(var(--color-surface-dark) / 0.94), rgb(39 39 42 / 0.88));
}

[data-sector="corporate"] #site-navbar.navbar-scrolled {
  background: linear-gradient(180deg, rgb(var(--color-surface-dark) / 0.98), rgb(39 39 42 / 0.96)) !important;
  box-shadow: 0 14px 36px rgb(0 0 0 / 0.22);
}

[data-sector="corporate"] .overlay {
  background:
    linear-gradient(180deg, rgb(var(--color-surface-dark) / 0.38), rgb(var(--color-surface-dark) / 0.78)),
    radial-gradient(820px 320px at 58% 12%, rgb(var(--color-accent) / 0.22), transparent 72%);
}

[data-sector="corporate"] .nav-link {
  font-weight: 600;
  letter-spacing: 0.08em;
}

[data-sector="corporate"] .btn {
  border-radius: var(--radius-md);
  font-weight: 600;
  letter-spacing: 0.04em;
}

[data-sector="corporate"] .btn-outline-white {
  border-color: rgb(255 255 255 / 0.65);
  color: white !important;
}

[data-sector="corporate"] .btn-outline-white:hover {
  background: white;
  color: rgb(var(--color-text)) !important;
}

[data-sector="corporate"] .card,
[data-sector="corporate"] .feature-card {
  border-radius: var(--radius-lg);
  border: 1px solid rgb(var(--color-border));
  background: linear-gradient(180deg, rgb(255 255 255), rgb(250 250 249));
  box-shadow: 0 16px 40px rgb(24 24 27 / 0.08);
}

[data-sector="corporate"] .card:hover,
[data-sector="corporate"] .feature-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 26px 52px rgb(24 24 27 / 0.12);
}

[data-sector="corporate"] .section-heading h2 {
  font-weight: 600;
}

[data-sector="corporate"] .inner-cta::before {
  background:
    linear-gradient(125deg, rgb(var(--color-surface-dark) / 0.86), rgb(var(--color-primary) / 0.55)),
    radial-gradient(680px 280px at 82% 18%, rgb(var(--color-accent) / 0.28), transparent 76%);
}

[data-sector="corporate"] .inner-cta-content .label {
  color: rgb(255 255 255 / 0.72) !important;
}

[data-sector="corporate"] .inner-cta-content p {
  color: rgb(255 255 255 / 0.9);
}

[data-sector="corporate"] .form-label {
  color: rgb(var(--color-text-light));
}

[data-sector="corporate"] .form-input {
  border-bottom: 1px solid rgb(var(--color-border));
  color: rgb(var(--color-text));
  background: rgb(255 255 255 / 0.75);
  padding-inline: 10px;
  border-radius: 8px 8px 0 0;
}

[data-sector="corporate"] .form-input::placeholder {
  color: rgb(var(--color-text-light) / 0.85);
}

[data-sector="corporate"] .form-input:focus {
  border-bottom-color: rgb(var(--color-accent));
  background: rgb(255 255 255 / 0.95);
}

[data-sector="corporate"] .footer-newsletter-input {
  background: rgb(255 255 255 / 0.1);
  border-color: rgb(255 255 255 / 0.22);
  color: rgb(255 255 255 / 0.95);
}

[data-sector="corporate"] .footer-newsletter-input::placeholder {
  color: rgb(255 255 255 / 0.65);
}

[data-sector="corporate"] .footer-newsletter-input:focus {
  border-color: rgb(var(--color-accent) / 0.65);
}

[data-sector="corporate"] .footer-newsletter-btn {
  border-radius: var(--radius-md);
  min-height: 52px;
  min-width: 164px;
  box-shadow: 0 10px 24px rgb(0 0 0 / 0.2);
}

/* ---- Landing: koyu funnel (varsayılan tema) ---- */
[data-sector="landing"] body {
  color: rgb(var(--color-text));
  background:
    radial-gradient(1100px 520px at 4% -6%, rgb(var(--color-primary) / 0.16), transparent 56%),
    radial-gradient(980px 460px at 98% 2%, rgb(var(--color-accent) / 0.09), transparent 58%),
    radial-gradient(880px 400px at 50% 112%, rgb(var(--color-primary) / 0.05), transparent 64%),
    rgb(var(--color-surface-dark));
}

[data-sector="landing"] #site-navbar {
  border-bottom: 1px solid rgb(63 63 70 / 0.35);
}

[data-sector="landing"] #site-navbar.navbar-scrolled {
  background: linear-gradient(
    180deg,
    rgb(var(--color-surface-dark) / 0.96),
    rgb(var(--color-surface) / 0.94)
  ) !important;
  box-shadow: 0 18px 44px rgb(0 0 0 / 0.45);
}

[data-sector="landing"] .overlay {
  background:
    linear-gradient(
      180deg,
      rgb(var(--color-surface-dark) / 0.12),
      rgb(var(--color-surface-dark) / 0.78)
    ),
    radial-gradient(560px 280px at 72% 8%, rgb(var(--color-primary) / 0.16), transparent 72%);
}

[data-sector="landing"] h1,
[data-sector="landing"] h2 {
  letter-spacing: -0.03em;
  font-weight: 600;
}

[data-sector="landing"] .btn {
  border-radius: var(--radius-md);
  font-weight: 600;
  letter-spacing: 0.02em;
  box-shadow: 0 10px 28px rgb(var(--color-primary) / 0.22);
}

[data-sector="landing"] .btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 34px rgb(var(--color-primary) / 0.28);
}

[data-sector="landing"] .stats-bar,
[data-sector="landing"] .feature-card,
[data-sector="landing"] .countdown-item {
  border: 1px solid rgb(63 63 70 / 0.35);
  background: linear-gradient(145deg, rgb(var(--color-surface-alt) / 0.92), rgb(var(--color-surface) / 0.75));
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

[data-sector="landing"] .menu-nav-link {
  font-size: clamp(22px, 2.8vw, 40px);
  letter-spacing: 0.01em;
}

[data-sector="landing"] .home-cinematic {
  border-top: 1px solid rgb(63 63 70 / 0.3);
  border-bottom: 1px solid rgb(63 63 70 / 0.3);
}

/* Landing + açık tema: gövde ve tipografi luxury-light tokenlarına döner */
[data-sector="landing"][data-theme="luxury-light"] body {
  color: rgb(var(--color-text));
  background:
    radial-gradient(900px 420px at 12% -6%, rgb(var(--color-primary) / 0.08), transparent 55%),
    radial-gradient(800px 380px at 88% 4%, rgb(var(--color-accent) / 0.06), transparent 58%),
    rgb(var(--color-surface));
}

[data-sector="landing"][data-theme="luxury-light"] #site-navbar {
  border-bottom: 1px solid rgb(var(--color-border));
  background: rgb(255 255 255 / 0.88);
}

[data-sector="landing"][data-theme="luxury-light"] #site-navbar.navbar-scrolled {
  background: rgb(255 255 255 / 0.95) !important;
  box-shadow: 0 12px 32px rgb(15 23 42 / 0.08);
}

[data-sector="landing"][data-theme="luxury-light"] .stats-bar,
[data-sector="landing"][data-theme="luxury-light"] .feature-card,
[data-sector="landing"][data-theme="luxury-light"] .countdown-item {
  border: 1px solid rgb(var(--color-border));
  background: rgb(var(--color-surface));
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

[data-sector="landing"][data-theme="luxury-light"] .overlay {
  background:
    linear-gradient(180deg, rgb(15 23 42 / 0.2), rgb(15 23 42 / 0.55)),
    radial-gradient(520px 260px at 70% 10%, rgb(var(--color-primary) / 0.15), transparent 70%);
}


/* --- tailwind/templates/_blockgrid-tuning.css --- */
/* =============================================================================
   Block grid & sayfa bileşenleri — ince ayar (token uyumu, ritim, hover)
   ============================================================================= */

/* Ortak blok başlığı — alt çizgi section-heading kadar baskın değil */
@layer components {
  .block-heading-wrap {
    @apply text-center mb-12 md:mb-14;
  }

  .block-overline {
    font-family: var(--font-heading);
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: rgb(var(--color-text-light));
    margin-bottom: 0.75rem;
  }

  .block-heading-wrap h2,
  .block-heading-wrap h3 {
    font-family: var(--font-heading);
    font-weight: 400;
    letter-spacing: -0.02em;
    line-height: 1.12;
    color: rgb(var(--color-text));
    text-wrap: balance;
  }

  .block-heading-wrap h2::after {
    content: "";
    display: block;
    width: 2.5rem;
    height: 2px;
    margin: 1.25rem auto 0;
    background: linear-gradient(
      90deg,
      transparent,
      rgb(var(--color-accent)),
      transparent
    );
    border-radius: 1px;
  }

  /* CTA: görsel yokken düz renk (inner-cta ::before çakışmasın) */
  .cw-cta-solid {
    position: relative;
    overflow: hidden;
    background: linear-gradient(
      125deg,
      rgb(var(--color-primary-dark)) 0%,
      rgb(var(--color-primary)) 48%,
      rgb(var(--color-accent) / 0.85) 100%
    );
    color: rgb(var(--color-text-inverse));
  }

  .cw-cta-solid::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.12;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    background-size: 180px 180px;
  }

  /* Testimonial grid — büyük tırnak (::before) olmadan temiz panel */
  .block-testimonial-panel {
    position: relative;
    height: 100%;
    padding: 2rem 1.75rem;
    background: rgb(var(--color-surface));
    border: 1px solid rgb(var(--color-border));
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    transition:
      box-shadow var(--transition-base),
      border-color var(--transition-base),
      transform var(--transition-base);
  }

  .block-testimonial-panel:hover {
    border-color: rgb(var(--color-accent) / 0.35);
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
  }

  .block-testimonial-panel .block-quote {
    font-family: var(--font-heading);
    font-size: 1.0625rem;
    line-height: 1.65;
    color: rgb(var(--color-text));
    margin: 0 0 1.5rem;
  }

  @media (min-width: 768px) {
    .block-testimonial-panel .block-quote {
      font-size: 1.125rem;
    }
  }

  .block-testimonial-panel .block-author-row {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgb(var(--color-border));
  }

  .block-testimonial-panel .block-avatar {
    width: 2.75rem;
    height: 2.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.875rem;
    font-weight: 600;
    color: rgb(var(--color-text-inverse));
    background: linear-gradient(
      145deg,
      rgb(var(--color-primary)),
      rgb(var(--color-accent))
    );
    border-radius: var(--radius-md);
    flex-shrink: 0;
  }

  /* Inline CTA kartı */
  .cw-cta-inline {
    border-radius: var(--radius-xl);
    border: 1px solid rgb(var(--color-border));
    background: linear-gradient(
      180deg,
      rgb(var(--color-surface)),
      rgb(var(--color-surface-alt) / 0.85)
    );
    box-shadow: var(--shadow-sm);
  }

  /* Floating CTA — kontrastlı çerçeve */
  .cw-cta-floating {
    border-radius: var(--radius-xl);
    background: linear-gradient(
      135deg,
      rgb(var(--color-primary)) 0%,
      rgb(var(--color-primary-dark)) 100%
    );
    color: rgb(var(--color-text-inverse));
    box-shadow:
      var(--shadow-lg),
      0 0 0 1px rgb(255 255 255 / 0.08) inset;
  }

  /* Güven rozetleri — tüm şablonlarda yumuşak hover */
  .trust-badges {
    opacity: 0.48;
    filter: grayscale(1);
    transition:
      opacity var(--transition-base),
      filter var(--transition-slow);
  }

  .trust-badges:hover {
    opacity: 0.82;
    filter: grayscale(0);
  }

  /* Hero scroll göstergesi */
  .hero-scroll-hint {
    border: 1px solid rgb(255 255 255 / 0.35);
    border-radius: 9999px;
    opacity: 0.85;
    transition: opacity var(--transition-base);
  }

  .hero-scroll-hint:hover {
    opacity: 1;
  }

  /* =========================================================================
     Umbraco BlockGrid — layout primitives
     Umbraco sadece DOM iskeletini ve inline custom property'leri yayar
     (--umb-block-grid--grid-columns, --umb-block-grid--item-column-span).
     CSS grid kurallarını biz sağlamalıyız. Bu olmadan tüm blok'lar tek sütun
     (full width) olarak stack olur — stats/pricing/feature grid'leri kırılır.
     ========================================================================= */
  .umb-block-grid {
    display: block;
  }

  .umb-block-grid__layout-container {
    display: grid;
    grid-template-columns: repeat(
      var(--umb-block-grid--grid-columns, 12),
      minmax(0, 1fr)
    );
    gap: 1.5rem;
    width: 100%;
  }

  .umb-block-grid__layout-item {
    min-width: 0;
    grid-column: span
      min(
        var(--umb-block-grid--item-column-span, 12),
        var(--umb-block-grid--grid-columns, 12)
      );
    grid-row: span var(--umb-block-grid--item-row-span, 1);
  }

  /* İç area'lar (nested blockgrid) */
  .umb-block-grid__area-container {
    display: grid;
    grid-template-columns: repeat(
      var(--umb-block-grid--area-grid-columns, 1),
      minmax(0, 1fr)
    );
    gap: 1.25rem;
  }

  .umb-block-grid__area {
    min-width: 0;
    grid-column: span var(--umb-block-grid--area-column-span, 1);
    grid-row: span var(--umb-block-grid--area-row-span, 1);
  }

  /* Mobilde 6 sütundan küçük olmayan blok'lar full-width'e iner */
  @media (max-width: 768px) {
    .umb-block-grid__layout-container {
      gap: 1.25rem;
    }
    .umb-block-grid__layout-item {
      grid-column: 1 / -1;
    }
  }

  /* Tablet: 3 veya 4 sütunluk kartlar 2'li düzene iner, 6+ full-width */
  @media (min-width: 769px) and (max-width: 1023px) {
    .umb-block-grid__layout-item {
      grid-column: span
        min(
          calc(var(--umb-block-grid--item-column-span, 12) * 2),
          var(--umb-block-grid--grid-columns, 12)
        );
    }
  }
}

/* Sektör bazlı ince dokunuşlar */
[data-sector="tourism"] .block-testimonial-panel .block-quote {
  font-style: italic;
  font-weight: 400;
}

.block-heading-wrap.text-left {
  text-align: left;
}

.block-heading-wrap.text-left h2::after {
  margin-left: 0;
  margin-right: auto;
}

[data-sector="landing"] .block-testimonial-panel {
  background: linear-gradient(
    165deg,
    rgb(var(--color-surface-alt) / 0.95),
    rgb(var(--color-surface) / 0.88)
  );
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

[data-sector="landing"][data-theme="luxury-light"] .block-testimonial-panel {
  background: rgb(var(--color-surface));
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* ============================================================
   Block Appearance Settings (Faz 3.5 — blockAppearanceSettings)
   items.cshtml layout-item div'ine koşullu uygulanır:
   .cw-pad-{compact|spacious|flush} + .cw-bg-{sand|dark} + anchor id.
   Settings boşken class eklenmez (mevcut çıktı bayt-bayt korunur).
   !important şart: template CSS'leri (örn. [data-template] .section, 0,2,0)
   v2 bundle'da bu dosyadan SONRA gelir; editörün açık seçimi her zaman kazanmalı.
   ============================================================ */

/* Dikey boşluk — layout-item'ın doğrudan çocuğuna (blok kök elemanı) */
.cw-pad-compact > * {
  padding-top: 48px !important;
  padding-bottom: 48px !important;
}

.cw-pad-spacious > * {
  padding-top: 100px !important;
  padding-bottom: 100px !important;
}

@media (min-width: 960px) {
  .cw-pad-spacious > * {
    padding-top: 140px !important;
    padding-bottom: 140px !important;
  }
}

.cw-pad-flush > * {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Bölüm arka planı */
.cw-bg-sand > * {
  background-color: var(--cw-bg-sand, #faf8f5) !important;
}

.cw-bg-dark > * {
  background-color: var(--cw-bg-dark, #1d1f1e) !important;
  color: var(--cw-bg-dark-text, #f5f2ec);
}

.cw-bg-dark > * :is(h1, h2, h3, h4, .block-overline) {
  color: var(--cw-bg-dark-text, #f5f2ec);
}

/* Anchor hedefi: sabit navbar altında kalmasın */
.umb-block-grid__layout-item[id] {
  scroll-margin-top: 96px;
}


/* --- tailwind/templates/tech-product/obsidian.css --- */
/* =============================================================================
   OBSIDIAN TEMPLATE — Layout & Components (T3 Gemstone tech-product)
   Ported from Gamestone Web Yeni 2 / styles.css v3 (2026-06-26).
   ALL rules scoped under [data-template="obsidian"] — Gate 6 compliant.
   Tokens come from tailwind/themes/tech-product/obsidian.css.
   ============================================================================= */

/* ── Keyframes (global names, safe — only consumed inside scope) ── */
@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: 0.5; transform: scale(1.4); }
}
@keyframes float {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50%       { transform: translate(20px, -20px) scale(1.06); }
}
@keyframes floatBoard {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50%       { transform: translateY(-12px) rotate(0.6deg); }
}
@keyframes chipFloat {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-8px); }
}
@keyframes chipFloatCenter {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50%       { transform: translateX(-50%) translateY(-8px); }
}
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@keyframes reveal-in {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Scoped base ── */
html[data-template="obsidian"] { scroll-behavior: smooth; }

[data-template="obsidian"] body {
  margin: 0; min-height: 100vh;
  background: var(--c-bg); color: var(--c-text);
  font-family: var(--f-body); font-size: 16px; line-height: 1.55;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
[data-template="obsidian"] *, [data-template="obsidian"] *::before, [data-template="obsidian"] *::after { box-sizing: border-box; }
[data-template="obsidian"] img, [data-template="obsidian"] svg { display: block; max-width: 100%; }
[data-template="obsidian"] a { color: inherit; text-decoration: none; }
[data-template="obsidian"] button { font-family: inherit; background: transparent; border: none; cursor: pointer; color: inherit; }
[data-template="obsidian"] ul { margin: 0; padding: 0; list-style: none; }
[data-template="obsidian"] h1, [data-template="obsidian"] h2, [data-template="obsidian"] h3,
[data-template="obsidian"] h4, [data-template="obsidian"] h5, [data-template="obsidian"] h6,
[data-template="obsidian"] p { margin: 0; }
[data-template="obsidian"] ::selection { background: rgba(34, 224, 255, 0.35); color: #fff; }

/* ── Background atmosphere ── */
[data-template="obsidian"] .bg-grid {
  position: fixed; inset: 0; z-index: -2; pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(ellipse at 50% 0%, #000 30%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse at 50% 0%, #000 30%, transparent 75%);
}
[data-template="obsidian"] .bg-glow {
  position: fixed; z-index: -1; pointer-events: none;
  width: 900px; height: 900px; border-radius: 50%;
  filter: blur(140px); opacity: 0.4; will-change: transform;
}
[data-template="obsidian"] .bg-glow--one {
  top: -300px; left: -250px;
  background: radial-gradient(circle, rgba(34,224,255,0.45), transparent 60%);
}
[data-template="obsidian"] .bg-glow--two {
  top: 30%; right: -300px;
  background: radial-gradient(circle, rgba(139,92,246,0.42), transparent 60%);
}

/* ── Layout ── */
[data-template="obsidian"] .container {
  width: 100%; max-width: var(--container);
  margin: 0 auto; padding: 0 var(--sp-6);
}

[data-template="obsidian"] section { position: relative; padding: var(--sp-12) 0; }

[data-template="obsidian"] .section-head { max-width: 760px; margin-bottom: var(--sp-10); }
[data-template="obsidian"] .section-head--center { margin-left: auto; margin-right: auto; text-align: center; }

[data-template="obsidian"] .section-kicker {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  padding: 6px 14px; border: 1px solid var(--c-border);
  border-radius: 999px; background: rgba(255,255,255,0.02);
  color: var(--c-accent); font-family: var(--f-mono);
  font-size: 12px; font-weight: 500; letter-spacing: 0.08em;
  text-transform: uppercase; margin-bottom: var(--sp-6);
}

[data-template="obsidian"] .section-title {
  font-family: var(--f-display);
  font-size: clamp(34px, 4.8vw, 56px);
  font-weight: 600; line-height: 1.05;
  letter-spacing: -0.03em; color: var(--c-text);
}
[data-template="obsidian"] .section-title > span { display: block; }

[data-template="obsidian"] .text-grad {
  background: var(--grad-text);
  background-clip: text; -webkit-background-clip: text; color: transparent;
}

[data-template="obsidian"] .section-lead {
  margin-top: var(--sp-6); max-width: 620px;
  color: var(--c-text-muted); font-size: 17px; line-height: 1.65;
}
[data-template="obsidian"] .section-head--center .section-lead { margin-left: auto; margin-right: auto; }

/* ── Buttons ── */
[data-template="obsidian"] .btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: var(--sp-2); padding: 14px 22px; border-radius: 999px;
  font-family: var(--f-body); font-size: 15px; font-weight: 500;
  line-height: 1; letter-spacing: -0.005em;
  transition: transform var(--t-fast), background var(--t-fast),
              color var(--t-fast), border-color var(--t-fast), box-shadow var(--t-med);
  white-space: nowrap; user-select: none;
}
[data-template="obsidian"] .btn svg { width: 16px; height: 16px; transition: transform var(--t-fast); }
[data-template="obsidian"] .btn:hover svg { transform: translateX(3px); }
[data-template="obsidian"] .btn--sm { padding: 10px 16px; font-size: 14px; }

[data-template="obsidian"] .btn--primary {
  color: #06060a; background: #fafaff;
  border: 1px solid #fafaff; position: relative; overflow: hidden;
}
[data-template="obsidian"] .btn--primary::before {
  content: ""; position: absolute; inset: 0;
  background: var(--grad-iridescent); opacity: 0;
  transition: opacity var(--t-med); z-index: -1;
}
[data-template="obsidian"] .btn--primary:hover {
  color: #fff; border-color: transparent;
  box-shadow: 0 14px 40px -10px rgba(34,224,255,0.55);
  transform: translateY(-1px);
}
[data-template="obsidian"] .btn--primary:hover::before { opacity: 1; }

[data-template="obsidian"] .btn--ghost {
  color: var(--c-text); background: rgba(255,255,255,0.04);
  border: 1px solid var(--c-border-strong); backdrop-filter: blur(8px);
}
[data-template="obsidian"] .btn--ghost:hover {
  background: rgba(255,255,255,0.08);
  border-color: var(--c-accent); color: var(--c-accent); transform: translateY(-1px);
}

[data-template="obsidian"] .btn--accent {
  color: #fff; background: var(--grad-iridescent);
  border: 1px solid transparent;
  box-shadow: 0 8px 24px -6px rgba(109,40,217,0.4);
}
[data-template="obsidian"] .btn--accent:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 32px -6px rgba(109,40,217,0.55);
}

/* ── Announcement bar ── */
[data-template="obsidian"] .announce {
  position: relative;
  background: linear-gradient(90deg, rgba(34,224,255,0.08), rgba(167,139,250,0.1), rgba(34,224,255,0.08));
  border-bottom: 1px solid var(--c-border);
  color: var(--c-text-muted); font-size: 13px;
}
[data-template="obsidian"] .announce::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(34,224,255,0.06), rgba(167,139,250,0.06), rgba(34,224,255,0.06));
  pointer-events: none;
}
[data-template="obsidian"] .announce__inner {
  max-width: var(--container); margin: 0 auto;
  padding: 10px var(--sp-6);
  display: flex; align-items: center; justify-content: center;
  gap: var(--sp-3); text-align: center; flex-wrap: wrap;
  position: relative; z-index: 1;
}
[data-template="obsidian"] .announce__dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--c-cyan); box-shadow: 0 0 12px var(--c-cyan);
  animation: pulse 2s ease-in-out infinite; position: relative; z-index: 1;
}
[data-template="obsidian"] .announce__sep { color: var(--c-text-dim); }
[data-template="obsidian"] .announce a { color: var(--c-text); border-bottom: 1px solid transparent; transition: border-color var(--t-fast); }
[data-template="obsidian"] .announce a:hover { border-bottom-color: var(--c-cyan); }

/* ── Header ── */
[data-template="obsidian"] .site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(7,7,11,0.7);
  backdrop-filter: blur(14px) saturate(150%);
  -webkit-backdrop-filter: blur(14px) saturate(150%);
  border-bottom: 1px solid transparent;
  transition: border-color var(--t-med), background var(--t-med);
}
[data-template="obsidian"] .site-header.is-scrolled {
  background: rgba(7,7,11,0.88);
  border-bottom-color: var(--c-border);
  box-shadow: 0 2px 24px -8px rgba(0,0,0,0.45);
}
[data-template="obsidian"] .site-header__inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--sp-6); padding-top: var(--sp-4); padding-bottom: var(--sp-4);
}

[data-template="obsidian"] .brand {
  display: inline-flex; align-items: center;
  gap: var(--sp-3); color: var(--c-text);
  font-family: var(--f-display); font-weight: 600;
}
[data-template="obsidian"] .brand__mark { width: 28px; height: 28px; color: var(--c-accent); }
[data-template="obsidian"] .brand__type {
  display: inline-flex; align-items: baseline; gap: 6px;
  font-size: 16px; letter-spacing: 0.04em;
}
[data-template="obsidian"] .brand__t3 {
  background: var(--grad-iridescent);
  background-clip: text; -webkit-background-clip: text;
  color: transparent; font-weight: 700;
}
[data-template="obsidian"] .brand__name { font-weight: 600; color: var(--c-text); }
[data-template="obsidian"] .brand--lg .brand__mark { width: 34px; height: 34px; }
[data-template="obsidian"] .brand--lg .brand__type { font-size: 18px; }

[data-template="obsidian"] .nav {
  display: flex; align-items: center; gap: var(--sp-7);
}
[data-template="obsidian"] .nav a {
  font-size: 14px; font-weight: 500; color: var(--c-text-muted);
  transition: color var(--t-fast); position: relative; padding: 8px 0;
}
[data-template="obsidian"] .nav a::after {
  content: ""; position: absolute; left: 50%; bottom: 0;
  width: 0; height: 2px; background: var(--grad-iridescent);
  border-radius: 2px; transform: translateX(-50%); transition: width var(--t-med);
}
[data-template="obsidian"] .nav a:hover { color: var(--c-text-strong); }
[data-template="obsidian"] .nav a:hover::after { width: 100%; }
[data-template="obsidian"] .nav a.is-active { color: var(--c-text-strong); }
[data-template="obsidian"] .nav a.is-active::after { width: 100%; }

[data-template="obsidian"] .header-actions { display: flex; align-items: center; gap: var(--sp-4); }

[data-template="obsidian"] .lang {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 6px 10px; border: 1px solid var(--c-border);
  border-radius: 999px; font-size: 12px; font-weight: 600;
  font-family: var(--f-mono); color: var(--c-text-dim);
  background: rgba(255,255,255,0.02);
}
[data-template="obsidian"] .lang__btn { padding: 2px 4px; border-radius: 999px; transition: color var(--t-fast); }
[data-template="obsidian"] .lang__btn.is-active { color: var(--c-text); }
[data-template="obsidian"] .lang__btn:hover { color: var(--c-text); }
[data-template="obsidian"] .lang__sep { color: var(--c-text-dim); }

[data-template="obsidian"] .menu-toggle {
  display: none; width: 40px; height: 40px;
  align-items: center; justify-content: center; flex-direction: column; gap: 5px;
  border: 1px solid var(--c-border); border-radius: 12px;
}
[data-template="obsidian"] .menu-toggle span {
  display: block; width: 18px; height: 1.5px;
  background: var(--c-text); transition: transform var(--t-fast), opacity var(--t-fast);
}
[data-template="obsidian"] .menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
[data-template="obsidian"] .menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
[data-template="obsidian"] .menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* ── Eyebrow ── */
[data-template="obsidian"] .eyebrow {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  padding: 7px 14px; border-radius: 999px;
  background: linear-gradient(90deg, rgba(34,224,255,0.1), rgba(167,139,250,0.14));
  border: 1px solid rgba(167,139,250,0.32); color: var(--c-accent);
  font-family: var(--f-mono); font-size: 12px; font-weight: 500;
  letter-spacing: 0.06em; text-transform: uppercase; margin-bottom: var(--sp-7);
}
[data-template="obsidian"] .eyebrow__pulse {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--c-cyan); box-shadow: 0 0 12px var(--c-cyan);
  animation: pulse 2s ease-in-out infinite;
}
[data-template="obsidian"] .eyebrow--center { align-self: center; }

/* ── Hero ── */
[data-template="obsidian"] .hero { padding-top: var(--sp-9); padding-bottom: var(--sp-7); overflow: hidden; }

[data-template="obsidian"] .hero__inner {
  display: grid; grid-template-columns: 1.05fr 0.95fr;
  gap: var(--sp-10); align-items: center;
  min-height: min(720px, calc(100vh - 180px));
}

[data-template="obsidian"] .hero__title {
  font-family: var(--f-display); font-weight: 600;
  font-size: clamp(48px, 7vw, 96px); line-height: 0.96;
  letter-spacing: -0.04em; color: var(--c-text);
}
[data-template="obsidian"] .hero__title-line { display: block; }
[data-template="obsidian"] .hero__title-line--accent {
  background: var(--grad-text); background-clip: text;
  -webkit-background-clip: text; color: transparent; padding-bottom: 0.05em;
}
[data-template="obsidian"] .hero__title-sub {
  display: block; margin-top: var(--sp-4);
  font-family: var(--f-body); font-size: clamp(20px, 2vw, 24px);
  font-weight: 400; color: var(--c-text-muted);
  letter-spacing: -0.01em; line-height: 1.3;
}

[data-template="obsidian"] .hero__lead {
  margin-top: var(--sp-7); max-width: 520px;
  color: var(--c-text-muted); font-size: 17px; line-height: 1.65;
}
[data-template="obsidian"] .hero__ctas {
  margin-top: var(--sp-8); display: flex; gap: var(--sp-3); flex-wrap: wrap;
}

[data-template="obsidian"] .trust {
  margin-top: var(--sp-10); display: flex; gap: var(--sp-8);
  padding-top: var(--sp-7); border-top: 1px solid var(--c-divider); flex-wrap: wrap;
}
[data-template="obsidian"] .trust li { display: flex; flex-direction: column; gap: 4px; }
[data-template="obsidian"] .trust strong {
  font-family: var(--f-display); font-size: 22px; font-weight: 600;
  color: var(--c-text); letter-spacing: -0.01em;
}
[data-template="obsidian"] .trust span { font-size: 13px; color: var(--c-text-muted); }

/* Hero visual */
[data-template="obsidian"] .hero__visual {
  position: relative; aspect-ratio: 1 / 1;
  display: flex; align-items: center; justify-content: center;
}
[data-template="obsidian"] .hero__visual-inner { position: relative; width: 100%; height: 100%; }
[data-template="obsidian"] .hero__visual::before {
  content: ""; position: absolute; z-index: 0; pointer-events: none;
  top: 5%; right: -10%; bottom: 5%; left: 25%;
  background: linear-gradient(135deg, rgba(167,139,250,0.32) 0%, rgba(34,224,255,0.22) 100%);
  transform: skewX(-12deg); border-radius: 0 var(--radius-xl) var(--radius-xl) 0; filter: blur(2px);
}
[data-template="obsidian"] .hero__visual::after {
  content: ""; position: absolute; z-index: 0; pointer-events: none;
  top: 18%; right: -5%; bottom: 18%; left: 45%;
  background: linear-gradient(135deg, rgba(139,92,246,0.32) 0%, rgba(34,224,255,0.22) 60%, transparent 100%);
  transform: skewX(-12deg); border-radius: 0 var(--radius-xl) var(--radius-xl) 0; filter: blur(2px);
}
[data-template="obsidian"] .hero__halo {
  position: absolute; inset: 15%; border-radius: 50%;
  background: radial-gradient(circle, rgba(34,224,255,0.4), transparent 60%);
  filter: blur(70px); animation: float 8s ease-in-out infinite; z-index: 1;
}
[data-template="obsidian"] .hero__board {
  position: relative; width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  animation: floatBoard 9s ease-in-out infinite; z-index: 2;
}
[data-template="obsidian"] .hero__board svg {
  width: min(100%, 520px); height: auto;
  filter: drop-shadow(0 30px 80px rgba(0,0,0,0.6));
}

/* Board photo */
[data-template="obsidian"] .board-photo {
  width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;
}
[data-template="obsidian"] .board-photo img {
  width: 100%; height: auto; max-width: 560px; border-radius: 14px;
  filter: drop-shadow(0 30px 60px rgba(0,0,0,0.55)) drop-shadow(0 16px 30px rgba(34,224,255,0.22));
  transition: transform var(--t-med);
}
[data-template="obsidian"] .hero__board .board-photo img { max-width: 540px; }
[data-template="obsidian"] .specs__board-img .board-photo img { max-width: 480px; }
[data-template="obsidian"] .page-hero__board .board-photo img { max-width: 600px; }
[data-template="obsidian"] .interfaces__board .board-photo img { max-width: 520px; }
[data-template="obsidian"] .prod-card__media .board-photo img { max-width: 460px; border-radius: 10px; }

/* Hero chips */
[data-template="obsidian"] .hero__chip {
  position: absolute; z-index: 3; padding: 10px 14px;
  background: rgba(17,17,28,0.85); border: 1px solid var(--c-border-strong);
  border-radius: 12px; font-family: var(--f-mono); font-size: 12px;
  backdrop-filter: blur(10px) saturate(150%); -webkit-backdrop-filter: blur(10px) saturate(150%);
  display: flex; flex-direction: column; gap: 2px;
  animation: chipFloat 6s ease-in-out infinite; box-shadow: 0 12px 24px rgba(0,0,0,0.45);
}
[data-template="obsidian"] .hero__chip-label { color: var(--c-text-dim); font-size: 10px; text-transform: uppercase; letter-spacing: 0.1em; }
[data-template="obsidian"] .hero__chip-value { color: var(--c-text); font-weight: 600; font-size: 13px; }
[data-template="obsidian"] .hero__chip--top-left  { top: 10%; left: -4%; animation-delay: 0s; }
[data-template="obsidian"] .hero__chip--top-right { top: 18%; right: -4%; animation-delay: 1s; }
[data-template="obsidian"] .hero__chip--bottom    { bottom: 14%; left: 50%; transform: translateX(-50%); animation-delay: 2s; animation-name: chipFloatCenter; }

/* Hero marquee */
[data-template="obsidian"] .hero__marquee {
  position: relative; margin-top: var(--sp-12);
  padding: var(--sp-5) 0; border-top: 1px solid var(--c-border);
  border-bottom: 1px solid var(--c-border);
  background: linear-gradient(180deg, transparent, rgba(34,224,255,0.04), transparent);
  overflow: hidden;
}
[data-template="obsidian"] .hero__marquee::before, [data-template="obsidian"] .hero__marquee::after {
  content: ""; position: absolute; top: 0; bottom: 0; width: 120px; z-index: 2; pointer-events: none;
}
[data-template="obsidian"] .hero__marquee::before { left: 0; background: linear-gradient(90deg, var(--c-bg), transparent); }
[data-template="obsidian"] .hero__marquee::after  { right: 0; background: linear-gradient(-90deg, var(--c-bg), transparent); }
[data-template="obsidian"] .hero__marquee-track {
  display: inline-flex; align-items: center; gap: var(--sp-7);
  font-family: var(--f-mono); font-size: 14px; font-weight: 500;
  color: var(--c-text-muted); letter-spacing: 0.15em; text-transform: uppercase;
  white-space: nowrap; animation: marquee 40s linear infinite;
}
[data-template="obsidian"] .hero__marquee-track > span:nth-child(odd) {
  background: var(--grad-text); background-clip: text; -webkit-background-clip: text; color: transparent;
}
[data-template="obsidian"] .hero__marquee-track > span:nth-child(even) { color: var(--c-text-dim); }

/* ── Specs (interactive) ── */
[data-template="obsidian"] .specs { padding-top: var(--sp-12); padding-bottom: var(--sp-12); }
[data-template="obsidian"] .specs__stage {
  display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--sp-10); align-items: start;
}
[data-template="obsidian"] .specs__board {
  position: sticky; top: 120px; aspect-ratio: 1 / 1;
  border-radius: var(--radius-xl);
  background:
    radial-gradient(circle at 25% 25%, rgba(34,224,255,0.15), transparent 55%),
    radial-gradient(circle at 75% 75%, rgba(167,139,250,0.18), transparent 55%),
    linear-gradient(180deg, var(--c-surface), var(--c-bg-2));
  border: 1px solid var(--c-border); overflow: hidden;
  display: flex; align-items: center; justify-content: center; padding: var(--sp-8);
}
[data-template="obsidian"] .specs__board-glow {
  position: absolute; inset: 20%; border-radius: 50%;
  background: radial-gradient(circle, rgba(34,224,255,0.3), transparent 60%);
  filter: blur(80px); z-index: 0;
}
[data-template="obsidian"] .specs__board-img {
  position: relative; z-index: 1; width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
}
[data-template="obsidian"] .specs__board-img svg { width: 100%; height: auto; max-width: 500px; }
[data-template="obsidian"] .specs__grid { display: grid; grid-template-columns: 1fr; gap: var(--sp-4); }

[data-template="obsidian"] .spec-card {
  position: relative; padding: var(--sp-7);
  background: var(--c-surface); border: 1px solid var(--c-border);
  border-radius: var(--radius-lg);
  transition: border-color var(--t-med), background var(--t-med), transform var(--t-fast);
  overflow: hidden;
}
[data-template="obsidian"] .spec-card::before {
  content: ""; position: absolute; top: 0; left: 0;
  width: 4px; height: 100%; background: var(--grad-iridescent);
  transform: scaleY(0); transform-origin: top; transition: transform var(--t-med);
}
[data-template="obsidian"] .spec-card:hover { border-color: var(--c-border-strong); background: var(--c-surface-2); transform: translateY(-2px); }
[data-template="obsidian"] .spec-card:hover::before { transform: scaleY(1); }
[data-template="obsidian"] .spec-card__num {
  position: absolute; top: var(--sp-5); right: var(--sp-6);
  font-family: var(--f-mono); font-size: 12px; font-weight: 600;
  background: var(--grad-iridescent); background-clip: text;
  -webkit-background-clip: text; color: transparent; letter-spacing: 0.1em;
}
[data-template="obsidian"] .spec-card__title {
  position: relative; font-family: var(--f-display); font-size: 22px; font-weight: 600;
  line-height: 1.25; letter-spacing: -0.015em; color: var(--c-text);
  margin-bottom: var(--sp-3); padding-right: var(--sp-7);
}
[data-template="obsidian"] .spec-card__body { position: relative; color: var(--c-text-muted); font-size: 15px; line-height: 1.6; }
[data-template="obsidian"] .spec-card__tags { position: relative; display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-5); }
[data-template="obsidian"] .spec-card__tags span {
  font-family: var(--f-mono); font-size: 11px; font-weight: 500;
  padding: 4px 10px; border: 1px solid var(--c-border-strong);
  border-radius: 999px; color: var(--c-text);
  background: rgba(255,255,255,0.02); letter-spacing: 0.04em;
}

/* ── Open Source ── */
[data-template="obsidian"] .opensource {
  position: relative; padding: var(--sp-12) 0;
  background:
    radial-gradient(ellipse at 50% 0%, rgba(139,92,246,0.22), transparent 60%),
    radial-gradient(ellipse at 30% 100%, rgba(34,224,255,0.12), transparent 50%);
  border-top: 1px solid var(--c-border); border-bottom: 1px solid var(--c-border);
  color: var(--c-text); overflow: hidden;
}
[data-template="obsidian"] .opensource::before {
  content: ""; position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(ellipse at 50% 50%, #000 30%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse at 50% 50%, #000 30%, transparent 75%);
  pointer-events: none;
}
[data-template="obsidian"] .opensource__inner { position: relative; z-index: 1; max-width: 980px; text-align: center; }
[data-template="obsidian"] .opensource__kicker {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  padding: 6px 14px; border-radius: 999px;
  border: 1px solid rgba(167,139,250,0.45); background: rgba(139,92,246,0.18);
  color: #c4b5fd; font-family: var(--f-mono); font-size: 12px;
  font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: var(--sp-7);
}
[data-template="obsidian"] .opensource__kicker .dot { width: 6px; height: 6px; background: #a78bfa; border-radius: 50%; box-shadow: 0 0 10px #a78bfa; }
[data-template="obsidian"] .opensource__title {
  font-family: var(--f-display); font-size: clamp(28px, 3.5vw, 44px);
  font-weight: 500; line-height: 1.2; letter-spacing: -0.02em;
  color: var(--c-text-muted); max-width: 920px; margin: 0 auto; position: relative; z-index: 1;
}
[data-template="obsidian"] .opensource__title > span { display: block; }
[data-template="obsidian"] .opensource__title-accent {
  background: var(--grad-text-soft); background-clip: text; -webkit-background-clip: text; color: transparent;
}
[data-template="obsidian"] .opensource__body {
  margin: var(--sp-8) auto 0; max-width: 720px;
  color: var(--c-text-muted); font-size: 16px; line-height: 1.7; position: relative; z-index: 1;
}
[data-template="obsidian"] .opensource__ctas {
  display: flex; justify-content: center; gap: var(--sp-3);
  margin-top: var(--sp-8); flex-wrap: wrap; position: relative; z-index: 1;
}
[data-template="obsidian"] .opensource__note {
  margin: var(--sp-10) auto 0; max-width: 720px;
  padding: var(--sp-5); border: 1px solid var(--c-border);
  border-radius: var(--radius-md); background: var(--c-surface);
  color: var(--c-text-dim); font-size: 13px; line-height: 1.6;
  text-align: left; position: relative; z-index: 1;
}
[data-template="obsidian"] .opensource__note-label {
  display: inline-block; margin-right: var(--sp-2); padding: 2px 8px;
  background: rgba(167,139,250,0.18); border: 1px solid rgba(167,139,250,0.4);
  border-radius: 4px; font-family: var(--f-mono); font-size: 10px;
  color: var(--c-accent); text-transform: uppercase; letter-spacing: 0.08em;
}

/* ── Use Cases ── */
[data-template="obsidian"] .usecases__grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--sp-4);
}
[data-template="obsidian"] .uc-card {
  position: relative; padding: var(--sp-7);
  background: var(--c-surface); border: 1px solid var(--c-border);
  border-radius: var(--radius-lg);
  transition: border-color var(--t-med), background var(--t-med), transform var(--t-fast); overflow: hidden;
}
[data-template="obsidian"] .uc-card::after {
  content: ""; position: absolute; top: 0; left: 0; right: 0;
  height: 3px; background: var(--grad-iridescent);
  transform: scaleX(0); transform-origin: left; transition: transform var(--t-med);
}
[data-template="obsidian"] .uc-card:hover { border-color: var(--c-border-strong); background: var(--c-surface-2); transform: translateY(-4px); }
[data-template="obsidian"] .uc-card:hover::after { transform: scaleX(1); }
[data-template="obsidian"] .uc-card__icon {
  display: flex; width: 56px; height: 56px; align-items: center; justify-content: center;
  background: var(--grad-iridescent); border-radius: var(--radius-md);
  color: #06060a; margin-bottom: var(--sp-6); box-shadow: 0 8px 24px -4px rgba(34,224,255,0.4);
}
[data-template="obsidian"] .uc-card__icon svg { width: 28px; height: 28px; }
[data-template="obsidian"] .uc-card__title { font-family: var(--f-display); font-size: 20px; font-weight: 600; letter-spacing: -0.015em; color: var(--c-text); margin-bottom: var(--sp-3); }
[data-template="obsidian"] .uc-card__body { color: var(--c-text-muted); font-size: 14px; line-height: 1.6; margin-bottom: var(--sp-5); }
[data-template="obsidian"] .uc-card__list { display: flex; flex-direction: column; gap: var(--sp-2); padding-top: var(--sp-4); border-top: 1px solid var(--c-divider); }
[data-template="obsidian"] .uc-card__list li { position: relative; padding-left: var(--sp-5); color: var(--c-text-muted); font-size: 13px; font-family: var(--f-mono); }
[data-template="obsidian"] .uc-card__list li::before { content: ""; position: absolute; left: 0; top: 50%; width: 8px; height: 1px; background: var(--c-accent); transform: translateY(-50%); }
[data-template="obsidian"] .usecases__cta { display: flex; justify-content: center; margin-top: var(--sp-10); }

/* ── SoC ── */
[data-template="obsidian"] .soc { background: var(--c-bg-2); }
[data-template="obsidian"] .soc__inner { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-10); align-items: start; }
[data-template="obsidian"] .soc__list { display: flex; flex-direction: column; gap: 0; border: 1px solid var(--c-border); border-radius: var(--radius-lg); background: var(--c-surface); overflow: hidden; }
[data-template="obsidian"] .soc__list li { display: grid; grid-template-columns: 140px 1fr; gap: var(--sp-5); padding: var(--sp-6); border-bottom: 1px solid var(--c-divider); transition: background var(--t-fast); }
[data-template="obsidian"] .soc__list li:last-child { border-bottom: none; }
[data-template="obsidian"] .soc__list li:hover { background: var(--c-surface-2); }
[data-template="obsidian"] .soc__list-label { font-family: var(--f-mono); font-size: 11px; font-weight: 600; color: var(--c-accent); letter-spacing: 0.1em; text-transform: uppercase; padding-top: 4px; }
[data-template="obsidian"] .soc__list li div { display: flex; flex-direction: column; gap: 4px; }
[data-template="obsidian"] .soc__list strong { font-family: var(--f-display); font-size: 16px; font-weight: 600; color: var(--c-text); letter-spacing: -0.01em; }
[data-template="obsidian"] .soc__list span { font-size: 14px; color: var(--c-text-muted); line-height: 1.5; }
[data-template="obsidian"] .soc__note { margin-top: var(--sp-5); color: var(--c-text-muted); font-size: 15px; line-height: 1.6; }
[data-template="obsidian"] .soc__copy .btn { margin-top: var(--sp-6); }

/* ── Origin ── */
[data-template="obsidian"] .origin__inner { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: var(--sp-10); align-items: center; }
[data-template="obsidian"] .origin__body { color: var(--c-text-muted); font-size: 16px; line-height: 1.7; margin-top: var(--sp-5); }
[data-template="obsidian"] .origin__body + .origin__body { margin-top: var(--sp-4); }
[data-template="obsidian"] .origin__partners { margin-top: var(--sp-9); display: flex; align-items: center; gap: var(--sp-5); flex-wrap: wrap; }
[data-template="obsidian"] .origin__partner { display: flex; align-items: center; gap: var(--sp-3); }
[data-template="obsidian"] .origin__partner-logo { display: flex; width: 56px; height: 56px; align-items: center; justify-content: center; border: 1px solid var(--c-border-strong); border-radius: var(--radius-md); color: var(--c-text); background: var(--c-surface); }
[data-template="obsidian"] .origin__partner-logo svg { width: 36px; height: 36px; }
[data-template="obsidian"] .origin__partner strong { display: block; font-family: var(--f-display); font-size: 17px; font-weight: 600; color: var(--c-text); }
[data-template="obsidian"] .origin__partner span { display: block; font-size: 12px; color: var(--c-text-dim); margin-top: 2px; }
[data-template="obsidian"] .origin__partner-divider { font-family: var(--f-display); font-size: 32px; font-weight: 300; color: var(--c-text-dim); }
[data-template="obsidian"] .origin__visual {
  position: relative; aspect-ratio: 1 / 1;
  background: radial-gradient(circle at 25% 25%, rgba(34,224,255,0.12), transparent 55%), radial-gradient(circle at 75% 75%, rgba(167,139,250,0.16), transparent 55%), var(--c-surface);
  border: 1px solid var(--c-border); border-radius: var(--radius-xl); padding: var(--sp-6); overflow: hidden;
}
[data-template="obsidian"] .origin__visual::before {
  content: ""; position: absolute; inset: 0;
  background-image: linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
  background-size: 32px 32px; pointer-events: none;
}
[data-template="obsidian"] .origin__visual-grid { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-3); height: 100%; }
[data-template="obsidian"] .origin__stat { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: var(--sp-6); background: rgba(7,7,11,0.55); border: 1px solid var(--c-border); border-radius: var(--radius-md); backdrop-filter: blur(10px); transition: border-color var(--t-fast), transform var(--t-fast); }
[data-template="obsidian"] .origin__stat:hover { border-color: var(--c-accent); transform: translateY(-2px); }
[data-template="obsidian"] .origin__stat-num { font-family: var(--f-display); font-size: clamp(40px, 4.5vw, 60px); font-weight: 700; line-height: 1; letter-spacing: -0.04em; background: var(--grad-iridescent); background-clip: text; -webkit-background-clip: text; color: transparent; }
[data-template="obsidian"] .origin__stat-num i { font-style: normal; font-size: 0.4em; font-weight: 500; color: var(--c-text-dim); -webkit-text-fill-color: var(--c-text-dim); margin-left: 4px; vertical-align: super; }
[data-template="obsidian"] .origin__stat-label { margin-top: var(--sp-3); font-family: var(--f-mono); font-size: 11px; color: var(--c-text-muted); text-transform: uppercase; letter-spacing: 0.08em; }

/* ── Resources ── */
[data-template="obsidian"] .resources__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--sp-3); }
[data-template="obsidian"] .res-card { position: relative; display: flex; flex-direction: column; padding: var(--sp-7); background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); transition: border-color var(--t-med), background var(--t-med), transform var(--t-fast); overflow: hidden; }
[data-template="obsidian"] .res-card:hover { border-color: var(--c-accent); background: var(--c-surface-2); transform: translateY(-2px); }
[data-template="obsidian"] .res-card__icon { display: flex; width: 48px; height: 48px; align-items: center; justify-content: center; background: var(--grad-iridescent); border-radius: var(--radius-sm); color: #06060a; margin-bottom: var(--sp-5); box-shadow: 0 8px 20px -6px rgba(34,224,255,0.4); }
[data-template="obsidian"] .res-card__icon svg { width: 22px; height: 22px; }
[data-template="obsidian"] .res-card__title { font-family: var(--f-display); font-size: 22px; font-weight: 600; color: var(--c-text); margin-bottom: var(--sp-1); }
[data-template="obsidian"] .res-card__sub { font-size: 13px; color: var(--c-text-dim); }
[data-template="obsidian"] .res-card__arrow { position: absolute; top: var(--sp-7); right: var(--sp-7); width: 32px; height: 32px; border: 1px solid var(--c-border); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--c-text-dim); transition: color var(--t-fast), border-color var(--t-fast), transform var(--t-fast); background: rgba(255,255,255,0.02); }
[data-template="obsidian"] .res-card__arrow svg { width: 12px; height: 12px; }
[data-template="obsidian"] .res-card:hover .res-card__arrow { color: var(--c-accent); border-color: var(--c-accent); transform: rotate(-15deg); }

/* ── Final CTA ── */
[data-template="obsidian"] .final-cta { padding-bottom: var(--sp-12); }
[data-template="obsidian"] .final-cta__panel {
  position: relative; display: grid; grid-template-columns: 1.2fr 0.8fr;
  gap: var(--sp-10); padding: clamp(var(--sp-9), 6vw, var(--sp-12));
  background: radial-gradient(circle at 0% 0%, rgba(34,224,255,0.18), transparent 50%), radial-gradient(circle at 100% 100%, rgba(167,139,250,0.2), transparent 50%), var(--c-surface);
  border: 1px solid var(--c-border); border-radius: var(--radius-xl); overflow: hidden; align-items: center;
}
[data-template="obsidian"] .final-cta__panel::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--grad-iridescent); opacity: 0.7; }
[data-template="obsidian"] .final-cta__title { margin-top: var(--sp-6); font-family: var(--f-display); font-size: clamp(32px, 4vw, 52px); font-weight: 600; line-height: 1.05; letter-spacing: -0.025em; color: var(--c-text); }
[data-template="obsidian"] .final-cta__title > span { display: block; }
[data-template="obsidian"] .final-cta__lead { margin-top: var(--sp-5); max-width: 480px; color: var(--c-text-muted); font-size: 16px; line-height: 1.65; }
[data-template="obsidian"] .final-cta__ctas { margin-top: var(--sp-7); display: flex; gap: var(--sp-3); flex-wrap: wrap; }
[data-template="obsidian"] .final-cta__price { padding: var(--sp-7); background: rgba(7,7,11,0.55); border: 1px solid var(--c-border); border-radius: var(--radius-lg); backdrop-filter: blur(10px); }
[data-template="obsidian"] .final-cta__price-label { display: inline-block; padding: 4px 10px; border: 1px solid var(--c-border-strong); border-radius: 999px; font-family: var(--f-mono); font-size: 11px; color: var(--c-accent); letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: var(--sp-4); background: rgba(255,255,255,0.02); }
[data-template="obsidian"] .final-cta__price-name { display: block; font-family: var(--f-display); font-size: 22px; font-weight: 600; letter-spacing: -0.015em; color: var(--c-text); margin-bottom: var(--sp-5); }
[data-template="obsidian"] .final-cta__price ul { display: flex; flex-direction: column; gap: var(--sp-3); padding-top: var(--sp-5); border-top: 1px solid var(--c-divider); }
[data-template="obsidian"] .final-cta__price li { position: relative; padding-left: var(--sp-5); font-size: 14px; color: var(--c-text-muted); }
[data-template="obsidian"] .final-cta__price li::before { content: ""; position: absolute; left: 0; top: 8px; width: 8px; height: 8px; border-radius: 50%; background: var(--grad-iridescent); }

/* ── Footer ── */
[data-template="obsidian"] .site-footer {
  background: var(--c-bg-2); color: var(--c-text);
  border-top: 1px solid var(--c-border); padding: var(--sp-11) 0 var(--sp-7);
  margin-top: var(--sp-11); position: relative; overflow: hidden;
}
[data-template="obsidian"] .site-footer::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: var(--grad-iridescent); opacity: 0.5; }
[data-template="obsidian"] .site-footer .brand__name { color: var(--c-text); }
[data-template="obsidian"] .site-footer__tag { color: var(--c-text-muted); }
[data-template="obsidian"] .site-footer__top { position: relative; display: grid; grid-template-columns: 1fr 2fr; gap: var(--sp-10); padding-bottom: var(--sp-10); border-bottom: 1px solid var(--c-border); }
[data-template="obsidian"] .site-footer__tag { margin-top: var(--sp-5); max-width: 280px; color: var(--c-text-dim); font-size: 14px; line-height: 1.6; }
[data-template="obsidian"] .site-footer__cols { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-7); }
[data-template="obsidian"] .site-footer__cols h4 { font-family: var(--f-display); font-size: 14px; font-weight: 600; color: var(--c-text); margin-bottom: var(--sp-5); letter-spacing: -0.01em; }
[data-template="obsidian"] .site-footer__cols a { display: block; padding: 6px 0; color: var(--c-text-dim); font-size: 14px; transition: color var(--t-fast); }
[data-template="obsidian"] .site-footer__cols a:hover { color: var(--c-text); }
[data-template="obsidian"] .site-footer__bottom { position: relative; display: flex; align-items: center; justify-content: space-between; padding-top: var(--sp-6); font-size: 13px; color: var(--c-text-dim); flex-wrap: wrap; gap: var(--sp-4); }

/* ── Scroll-in animations ── */
[data-template="obsidian"] .reveal {
  opacity: 0; transform: translateY(24px);
  transition: opacity 700ms cubic-bezier(.22,.61,.36,1), transform 700ms cubic-bezier(.22,.61,.36,1);
}
[data-template="obsidian"] .reveal.is-in { opacity: 1; transform: translateY(0); }
[data-template="obsidian"] .reveal:nth-child(2) { transition-delay: 80ms; }
[data-template="obsidian"] .reveal:nth-child(3) { transition-delay: 160ms; }
[data-template="obsidian"] .reveal:nth-child(4) { transition-delay: 240ms; }
[data-template="obsidian"] .reveal:nth-child(5) { transition-delay: 320ms; }
[data-template="obsidian"] .reveal:nth-child(6) { transition-delay: 400ms; }

/* ── Subpages — page-hero, breadcrumb ── */
[data-template="obsidian"] .page-hero { position: relative; padding: var(--sp-11) 0 var(--sp-9); text-align: center; overflow: hidden; }
[data-template="obsidian"] .page-hero::before {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(ellipse at 50% 0%, rgba(34,224,255,0.14), transparent 55%), radial-gradient(ellipse at 50% 100%, rgba(167,139,250,0.14), transparent 60%);
  pointer-events: none; z-index: -1;
}
[data-template="obsidian"] .page-hero__inner { max-width: 860px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; }
[data-template="obsidian"] .page-hero__title { font-family: var(--f-display); font-size: clamp(40px, 5.5vw, 72px); font-weight: 600; line-height: 1.02; letter-spacing: -0.035em; color: var(--c-text); margin-top: var(--sp-3); }
[data-template="obsidian"] .page-hero__title > span { display: block; }
[data-template="obsidian"] .page-hero__lead { margin-top: var(--sp-7); max-width: 680px; color: var(--c-text-muted); font-size: 17px; line-height: 1.65; }
[data-template="obsidian"] .page-hero__ctas { margin-top: var(--sp-8); display: flex; gap: var(--sp-3); flex-wrap: wrap; justify-content: center; }
[data-template="obsidian"] .page-hero__board {
  margin-top: var(--sp-10); width: 100%; max-width: 760px; aspect-ratio: 4 / 3;
  background: linear-gradient(135deg, rgba(34,224,255,0.16) 0%, transparent 35%), linear-gradient(225deg, rgba(167,139,250,0.22) 0%, transparent 40%), var(--c-surface);
  border: 1px solid var(--c-border); border-radius: var(--radius-xl); padding: var(--sp-7);
  display: flex; align-items: center; justify-content: center; overflow: hidden; position: relative;
}
[data-template="obsidian"] .page-hero__board::before { content: ""; position: absolute; top: -10%; right: -20%; width: 60%; height: 130%; background: linear-gradient(135deg, rgba(139,92,246,0.28) 0%, rgba(34,224,255,0.18) 70%, transparent 100%); transform: skewX(-15deg); border-radius: var(--radius-xl); z-index: 0; }
[data-template="obsidian"] .page-hero__board::after  { content: ""; position: absolute; top: 5%; right: -5%; width: 30%; height: 95%; background: linear-gradient(135deg, rgba(167,139,250,0.36) 0%, rgba(34,224,255,0.26) 100%); transform: skewX(-15deg); border-radius: var(--radius-xl); z-index: 0; }
[data-template="obsidian"] .page-hero__board svg { position: relative; z-index: 1; width: 100%; height: auto; max-width: 580px; filter: drop-shadow(0 25px 50px rgba(0,0,0,0.55)); }

[data-template="obsidian"] .breadcrumb { display: inline-flex; align-items: center; gap: var(--sp-2); margin-bottom: var(--sp-7); font-family: var(--f-mono); font-size: 12px; color: var(--c-text-dim); letter-spacing: 0.04em; }
[data-template="obsidian"] .breadcrumb a { color: var(--c-text-muted); transition: color var(--t-fast); }
[data-template="obsidian"] .breadcrumb a:hover { color: var(--c-accent); }
[data-template="obsidian"] .breadcrumb__sep { color: var(--c-text-dim); }
[data-template="obsidian"] .breadcrumb__current { color: var(--c-text); }

/* ── Key Features grid (Obsidyen page) ── */
[data-template="obsidian"] .kf-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-3); }
[data-template="obsidian"] .kf-grid li { display: flex; align-items: flex-start; gap: var(--sp-4); padding: var(--sp-5) var(--sp-6); background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-md); transition: border-color var(--t-fast), background var(--t-fast), transform var(--t-fast); }
[data-template="obsidian"] .kf-grid li:hover { border-color: var(--c-border-strong); background: var(--c-surface-2); transform: translateY(-1px); }
[data-template="obsidian"] .kf-num { font-family: var(--f-mono); font-size: 13px; font-weight: 700; background: var(--grad-iridescent); background-clip: text; -webkit-background-clip: text; color: transparent; flex-shrink: 0; padding-top: 2px; letter-spacing: 0.05em; }
[data-template="obsidian"] .kf-grid li > span:last-child { color: var(--c-text-strong); font-size: 15px; line-height: 1.5; }

/* ── For Whom (fw-card) ── */
[data-template="obsidian"] .fw-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-4); }
[data-template="obsidian"] .fw-card { display: flex; flex-direction: column; padding: var(--sp-7); background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); transition: border-color var(--t-med), transform var(--t-fast); position: relative; overflow: hidden; }
[data-template="obsidian"] .fw-card::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: var(--grad-iridescent); transform: scaleX(0); transform-origin: left; transition: transform var(--t-med); }
[data-template="obsidian"] .fw-card:hover { border-color: var(--c-border-strong); transform: translateY(-2px); }
[data-template="obsidian"] .fw-card:hover::before { transform: scaleX(1); }
[data-template="obsidian"] .fw-card__head { display: flex; align-items: center; gap: var(--sp-3); margin-bottom: var(--sp-4); }
[data-template="obsidian"] .fw-card__tag { font-family: var(--f-mono); font-size: 11px; font-weight: 700; color: #fff; padding: 4px 10px; background: var(--grad-iridescent); border-radius: 999px; letter-spacing: 0.05em; }
[data-template="obsidian"] .fw-card h3 { font-family: var(--f-display); font-size: 22px; font-weight: 600; letter-spacing: -0.015em; color: var(--c-text-strong); }
[data-template="obsidian"] .fw-card > p { color: var(--c-text-muted); font-size: 15px; line-height: 1.6; margin-bottom: var(--sp-5); }
[data-template="obsidian"] .fw-card ul { display: flex; flex-direction: column; gap: var(--sp-2); padding-top: var(--sp-4); margin-bottom: var(--sp-6); border-top: 1px solid var(--c-divider); flex: 1; }
[data-template="obsidian"] .fw-card ul li { position: relative; padding-left: var(--sp-5); font-family: var(--f-mono); font-size: 13px; color: var(--c-text-muted); }
[data-template="obsidian"] .fw-card ul li::before { content: ""; position: absolute; left: 0; top: 50%; width: 8px; height: 1px; background: var(--c-accent); transform: translateY(-50%); }

/* ── Interfaces ── */
[data-template="obsidian"] .interfaces__stage { display: grid; grid-template-columns: 1.4fr 1fr; gap: var(--sp-8); align-items: center; }
[data-template="obsidian"] .interfaces__board { aspect-ratio: 4 / 3; background: linear-gradient(135deg, rgba(34,224,255,0.16) 0%, transparent 35%), linear-gradient(225deg, rgba(167,139,250,0.22) 0%, transparent 40%), var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-xl); padding: var(--sp-8); display: flex; align-items: center; justify-content: center; overflow: hidden; position: relative; }
[data-template="obsidian"] .interfaces__board::before { content: ""; position: absolute; top: -10%; right: -25%; width: 70%; height: 130%; background: linear-gradient(135deg, rgba(139,92,246,0.28) 0%, rgba(34,224,255,0.18) 60%, transparent 100%); transform: skewX(-15deg); z-index: 0; }
[data-template="obsidian"] .interfaces__board svg { position: relative; z-index: 1; width: 100%; max-width: 540px; }
[data-template="obsidian"] .interfaces__legend h3 { font-family: var(--f-display); font-size: 22px; font-weight: 600; color: var(--c-text-strong); margin-bottom: var(--sp-5); letter-spacing: -0.015em; }
[data-template="obsidian"] .interfaces__legend ul { display: flex; flex-direction: column; gap: var(--sp-1); border: 1px solid var(--c-border); border-radius: var(--radius-lg); background: var(--c-surface); overflow: hidden; }
[data-template="obsidian"] .interfaces__legend li { display: flex; align-items: baseline; gap: var(--sp-3); padding: var(--sp-4) var(--sp-5); border-bottom: 1px solid var(--c-divider); }
[data-template="obsidian"] .interfaces__legend li:last-child { border-bottom: none; }
[data-template="obsidian"] .interfaces__legend .dot { width: 10px; height: 10px; background: var(--grad-iridescent); border-radius: 50%; flex-shrink: 0; align-self: center; }
[data-template="obsidian"] .interfaces__legend strong { font-family: var(--f-display); font-size: 14px; font-weight: 600; color: var(--c-text-strong); flex: 1; }
[data-template="obsidian"] .interfaces__legend li > span:last-child { font-family: var(--f-mono); font-size: 12px; color: var(--c-text-dim); }

/* ── Multi-OS / Download cards ── */
[data-template="obsidian"] .multios__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-4); }
[data-template="obsidian"] .dl-card { display: flex; flex-direction: column; gap: var(--sp-3); padding: var(--sp-7); background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); transition: border-color var(--t-med), background var(--t-med), transform var(--t-fast); }
[data-template="obsidian"] .dl-card:hover { border-color: var(--c-accent); background: var(--c-surface-2); transform: translateY(-2px); }
[data-template="obsidian"] .dl-card__os { display: flex; align-items: center; gap: var(--sp-3); font-family: var(--f-display); font-size: 18px; font-weight: 600; color: var(--c-text-strong); }
[data-template="obsidian"] .dl-card__os svg { width: 22px; height: 22px; color: var(--c-accent); border-radius: 6px; padding: 4px; box-sizing: content-box; }
[data-template="obsidian"] .dl-card__file { font-family: var(--f-mono); font-size: 12px; color: var(--c-text-muted); word-break: break-all; }
[data-template="obsidian"] .dl-card__size { font-family: var(--f-mono); font-size: 11px; color: var(--c-text-dim); }
[data-template="obsidian"] .dl-card__btn { margin-top: auto; display: inline-flex; align-items: center; align-self: flex-start; padding: 8px 14px; border: 1px solid var(--c-border-strong); border-radius: 999px; font-family: var(--f-mono); font-size: 12px; color: var(--c-text); letter-spacing: 0.04em; transition: background var(--t-fast), border-color var(--t-fast); }
[data-template="obsidian"] .dl-card:hover .dl-card__btn { background: rgba(34,224,255,0.1); border-color: var(--c-accent); }
[data-template="obsidian"] .multios__sub { text-align: center; margin-top: var(--sp-9); font-family: var(--f-mono); color: var(--c-text-dim); font-size: 13px; letter-spacing: 0.05em; }

/* ── Tech Specs table (spec-table / spec-row) ── */
[data-template="obsidian"] .spec-table { border: 1px solid var(--c-border); border-radius: var(--radius-lg); background: var(--c-surface); overflow: hidden; }
[data-template="obsidian"] .spec-row { display: grid; grid-template-columns: 220px 1fr; gap: var(--sp-5); padding: var(--sp-5) var(--sp-7); border-bottom: 1px solid var(--c-divider); transition: background var(--t-fast); }
[data-template="obsidian"] .spec-row:last-child { border-bottom: none; }
[data-template="obsidian"] .spec-row:hover { background: var(--c-surface-2); }
[data-template="obsidian"] .spec-row__label { font-family: var(--f-mono); font-size: 12px; font-weight: 600; color: var(--c-accent); letter-spacing: 0.08em; text-transform: uppercase; padding-top: 2px; }
[data-template="obsidian"] .spec-row__value { color: var(--c-text-strong); font-size: 15px; line-height: 1.5; }
[data-template="obsidian"] .spec-row__value strong { display: block; font-family: var(--f-display); font-size: 16px; font-weight: 600; }
[data-template="obsidian"] .spec-row__value span { display: block; color: var(--c-text-muted); font-size: 14px; margin-top: 2px; }
[data-template="obsidian"] .tech-specs__note { margin-top: var(--sp-7); padding: var(--sp-5); border: 1px solid var(--c-border); border-radius: var(--radius-md); background: var(--c-surface); color: var(--c-text-muted); font-size: 13px; line-height: 1.6; }
[data-template="obsidian"] .tech-specs__note .opensource__note-label { background: rgba(167,139,250,0.18); border-color: rgba(167,139,250,0.4); color: var(--c-accent); }

/* ── Example Projects ── */
[data-template="obsidian"] .projects__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--sp-4); }
[data-template="obsidian"] .proj-card { display: flex; flex-direction: column; background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); overflow: hidden; transition: border-color var(--t-med), transform var(--t-fast); }
[data-template="obsidian"] .proj-card:hover { border-color: var(--c-border-strong); transform: translateY(-2px); }
[data-template="obsidian"] .proj-card__media { aspect-ratio: 5 / 3; background: var(--c-surface-2); overflow: hidden; }
[data-template="obsidian"] .proj-card__media svg { width: 100%; height: 100%; }
[data-template="obsidian"] .proj-card__body { display: flex; flex-direction: column; gap: var(--sp-2); padding: var(--sp-5) var(--sp-6) var(--sp-6); }
[data-template="obsidian"] .proj-card__tag { display: inline-block; width: fit-content; font-family: var(--f-mono); font-size: 11px; font-weight: 600; color: var(--c-accent); letter-spacing: 0.05em; padding: 3px 8px; border: 1px solid rgba(109,40,217,0.25); background: rgba(167,139,250,0.1); border-radius: 4px; margin-bottom: var(--sp-2); }
[data-template="obsidian"] .proj-card h3 { font-family: var(--f-display); font-size: 17px; font-weight: 600; color: var(--c-text-strong); letter-spacing: -0.01em; line-height: 1.3; }
[data-template="obsidian"] .proj-card p { color: var(--c-text-muted); font-size: 14px; line-height: 1.5; }

/* ── FAQ ── */
[data-template="obsidian"] .faq__list { display: flex; flex-direction: column; gap: var(--sp-3); max-width: 880px; margin: 0 auto; }
[data-template="obsidian"] .faq__item { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-md); overflow: hidden; transition: border-color var(--t-fast), background var(--t-fast); }
[data-template="obsidian"] .faq__item[open] { border-color: var(--c-border-strong); background: var(--c-surface-2); }
[data-template="obsidian"] .faq__item summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: var(--sp-5); padding: var(--sp-5) var(--sp-7); font-family: var(--f-display); font-size: 17px; font-weight: 500; color: var(--c-text-strong); letter-spacing: -0.01em; transition: background var(--t-fast); }
[data-template="obsidian"] .faq__item summary::-webkit-details-marker { display: none; }
[data-template="obsidian"] .faq__item summary svg { flex-shrink: 0; width: 18px; height: 18px; color: var(--c-accent); transition: transform var(--t-med); }
[data-template="obsidian"] .faq__item[open] summary svg { transform: rotate(180deg); }
[data-template="obsidian"] .faq__item summary:hover { background: var(--c-surface-2); }
[data-template="obsidian"] .faq__item p { padding: 0 var(--sp-7) var(--sp-6); color: var(--c-text-muted); font-size: 15px; line-height: 1.65; }

/* ── Quick Start (Developers page) ── */
[data-template="obsidian"] .quickstart__inner { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: var(--sp-10); align-items: start; }
[data-template="obsidian"] .quickstart__copy .btn { margin-top: var(--sp-6); }
[data-template="obsidian"] .quickstart__steps { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-3); }
[data-template="obsidian"] .qs-step { display: flex; flex-direction: column; padding: var(--sp-6); background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-md); transition: border-color var(--t-fast); }
[data-template="obsidian"] .qs-step:hover { border-color: var(--c-accent); background: var(--c-surface-2); }
[data-template="obsidian"] .qs-step__num { font-family: var(--f-mono); font-size: 14px; font-weight: 700; background: var(--grad-iridescent); background-clip: text; -webkit-background-clip: text; color: transparent; letter-spacing: 0.05em; margin-bottom: var(--sp-3); }
[data-template="obsidian"] .qs-step h3 { font-family: var(--f-display); font-size: 16px; font-weight: 600; color: var(--c-text-strong); letter-spacing: -0.01em; margin-bottom: var(--sp-2); }
[data-template="obsidian"] .qs-step p { font-size: 13px; color: var(--c-text-muted); line-height: 1.5; }

/* ── SDK & Terminal ── */
[data-template="obsidian"] .sdk__grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: var(--sp-5); align-items: stretch; }
[data-template="obsidian"] .sdk-card { display: flex; flex-direction: column; padding: var(--sp-7); background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); transition: border-color var(--t-fast); }
[data-template="obsidian"] .sdk-card:hover { border-color: var(--c-border-strong); }
[data-template="obsidian"] .sdk-card__header { display: flex; align-items: center; gap: var(--sp-4); margin-bottom: var(--sp-5); }
[data-template="obsidian"] .sdk-card__icon { display: flex; width: 56px; height: 56px; align-items: center; justify-content: center; background: var(--grad-iridescent); border-radius: var(--radius-md); color: #fff; box-shadow: 0 8px 20px -6px rgba(109,40,217,0.35); }
[data-template="obsidian"] .sdk-card__icon svg { width: 26px; height: 26px; }
[data-template="obsidian"] .sdk-card h3 { font-family: var(--f-display); font-size: 20px; font-weight: 600; color: var(--c-text-strong); }
[data-template="obsidian"] .sdk-card__tag { display: inline-block; margin-top: 4px; font-family: var(--f-mono); font-size: 11px; font-weight: 600; color: var(--c-accent); letter-spacing: 0.05em; }
[data-template="obsidian"] .sdk-card > p { color: var(--c-text-muted); font-size: 14px; line-height: 1.6; margin-bottom: var(--sp-5); }
[data-template="obsidian"] .sdk-card ul { display: flex; flex-direction: column; gap: var(--sp-2); padding-top: var(--sp-4); margin-bottom: var(--sp-6); border-top: 1px solid var(--c-divider); flex: 1; }
[data-template="obsidian"] .sdk-card li { position: relative; padding-left: var(--sp-5); font-family: var(--f-mono); font-size: 13px; color: var(--c-text-muted); }
[data-template="obsidian"] .sdk-card li::before { content: ""; position: absolute; left: 0; top: 50%; width: 8px; height: 1px; background: var(--c-accent); transform: translateY(-50%); }
[data-template="obsidian"] .sdk-card__ctas { display: flex; gap: var(--sp-2); flex-wrap: wrap; }

[data-template="obsidian"] .sdk-terminal { border: 1px solid var(--c-border); border-radius: var(--radius-lg); background: #0a0a10; overflow: hidden; font-family: var(--f-mono); display: flex; flex-direction: column; }
[data-template="obsidian"] .sdk-terminal__head { display: flex; align-items: center; gap: 6px; padding: 10px 14px; background: rgba(255,255,255,0.03); border-bottom: 1px solid var(--c-border); }
[data-template="obsidian"] .sdk-terminal__dot { width: 10px; height: 10px; border-radius: 50%; }
[data-template="obsidian"] .sdk-terminal__title { margin-left: var(--sp-3); font-size: 12px; color: var(--c-text-dim); font-family: var(--f-mono); }
[data-template="obsidian"] .sdk-terminal__body { margin: 0; padding: var(--sp-5) var(--sp-6); color: var(--c-text); font-size: 13px; line-height: 1.65; flex: 1; white-space: pre-wrap; word-break: break-word; }
[data-template="obsidian"] .sdk-terminal .t-dim     { color: var(--c-text-dim); }
[data-template="obsidian"] .sdk-terminal .t-cmd     { color: var(--c-accent); }
[data-template="obsidian"] .sdk-terminal .t-arg     { color: #c4b5fd; }
[data-template="obsidian"] .sdk-terminal .t-out     { color: var(--c-text-muted); }
[data-template="obsidian"] .sdk-terminal .t-amp     { color: var(--c-text-dim); }
[data-template="obsidian"] .sdk-terminal .t-success { color: #4ade80; }

/* ── Blog cards ── */
[data-template="obsidian"] .blog__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--sp-4); }
[data-template="obsidian"] .blog-card { display: flex; flex-direction: column; background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); overflow: hidden; cursor: pointer; transition: border-color var(--t-fast), transform var(--t-fast); }
[data-template="obsidian"] .blog-card:hover { border-color: var(--c-border-strong); transform: translateY(-2px); }
[data-template="obsidian"] .blog-card__media { position: relative; aspect-ratio: 16 / 9; display: flex; align-items: flex-end; padding: var(--sp-4); }
[data-template="obsidian"] .blog-card__cat { font-family: var(--f-mono); font-size: 11px; font-weight: 500; color: #fff; letter-spacing: 0.05em; padding: 4px 10px; border: 1px solid rgba(255,255,255,0.3); border-radius: 999px; backdrop-filter: blur(8px); background: rgba(0,0,0,0.3); }
[data-template="obsidian"] .blog-card__date { display: block; padding: var(--sp-5) var(--sp-6) 0; font-family: var(--f-mono); font-size: 11px; color: var(--c-text-dim); letter-spacing: 0.05em; }
[data-template="obsidian"] .blog-card h3 { padding: var(--sp-2) var(--sp-6) 0; font-family: var(--f-display); font-size: 18px; font-weight: 600; color: var(--c-text-strong); letter-spacing: -0.015em; line-height: 1.3; }
[data-template="obsidian"] .blog-card p { padding: var(--sp-3) var(--sp-6); color: var(--c-text-muted); font-size: 14px; line-height: 1.55; flex: 1; }
[data-template="obsidian"] .blog-card__link { padding: 0 var(--sp-6) var(--sp-6); font-family: var(--f-mono); font-size: 13px; font-weight: 600; color: var(--c-accent); letter-spacing: 0.02em; }
[data-template="obsidian"] .dev-blog__cta { display: flex; justify-content: center; margin-top: var(--sp-9); }

/* ── Community page ── */
[data-template="obsidian"] .community__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-5); }
[data-template="obsidian"] .comm-card { display: flex; flex-direction: column; padding: var(--sp-9); background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-xl); transition: border-color var(--t-med), background var(--t-med), transform var(--t-fast); position: relative; overflow: hidden; }
[data-template="obsidian"] .comm-card::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--grad-iridescent); opacity: 0.6; transform: scaleX(0.3); transform-origin: left; transition: transform var(--t-med), opacity var(--t-med); }
[data-template="obsidian"] .comm-card:hover { border-color: var(--c-border-strong); background: var(--c-surface-2); transform: translateY(-3px); }
[data-template="obsidian"] .comm-card:hover::before { transform: scaleX(1); opacity: 1; }
[data-template="obsidian"] .comm-card__icon { display: flex; width: 64px; height: 64px; align-items: center; justify-content: center; background: var(--grad-iridescent); border-radius: var(--radius-lg); color: #fff; margin-bottom: var(--sp-6); box-shadow: 0 10px 24px -6px rgba(109,40,217,0.35); }
[data-template="obsidian"] .comm-card__icon svg { width: 32px; height: 32px; }
[data-template="obsidian"] .comm-card--github .comm-card__icon { color: #fff; background: #0d0d18; border: 1px solid var(--c-border-strong); box-shadow: 0 10px 24px -6px rgba(0,0,0,0.5); }
[data-template="obsidian"] .comm-card__kicker { font-family: var(--f-mono); font-size: 11px; color: var(--c-text-dim); letter-spacing: 0.08em; text-transform: uppercase; }
[data-template="obsidian"] .comm-card h2 { font-family: var(--f-mono); font-size: 18px; font-weight: 500; color: var(--c-text-strong); margin: var(--sp-2) 0 var(--sp-4); }
[data-template="obsidian"] .comm-card > p { color: var(--c-text-muted); font-size: 15px; line-height: 1.6; margin-bottom: var(--sp-7); }
[data-template="obsidian"] .comm-card__stats { display: flex; gap: var(--sp-7); padding: var(--sp-5) 0; border-top: 1px solid var(--c-divider); border-bottom: 1px solid var(--c-divider); margin-bottom: var(--sp-6); }
[data-template="obsidian"] .comm-card__stats li { display: flex; flex-direction: column; gap: 2px; }
[data-template="obsidian"] .comm-card__stats strong { font-family: var(--f-display); font-size: 28px; font-weight: 700; background: var(--grad-iridescent); background-clip: text; -webkit-background-clip: text; color: transparent; letter-spacing: -0.02em; }
[data-template="obsidian"] .comm-card__stats span { font-size: 12px; color: var(--c-text-dim); text-transform: lowercase; }
[data-template="obsidian"] .comm-card__cta { font-family: var(--f-mono); font-size: 14px; color: var(--c-accent); }

[data-template="obsidian"] .community__values { margin-top: var(--sp-12); }
[data-template="obsidian"] .values-grid { margin-top: var(--sp-9); display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-4); }
[data-template="obsidian"] .value-card { padding: var(--sp-7); background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); transition: border-color var(--t-fast); }
[data-template="obsidian"] .value-card:hover { border-color: var(--c-border-strong); }
[data-template="obsidian"] .value-card__icon { display: flex; width: 48px; height: 48px; align-items: center; justify-content: center; background: var(--grad-iridescent); border-radius: var(--radius-md); color: #fff; margin-bottom: var(--sp-5); box-shadow: 0 8px 18px -6px rgba(109,40,217,0.3); }
[data-template="obsidian"] .value-card__icon svg { width: 22px; height: 22px; }
[data-template="obsidian"] .value-card h3 { font-family: var(--f-display); font-size: 18px; font-weight: 600; color: var(--c-text-strong); margin-bottom: var(--sp-2); }
[data-template="obsidian"] .value-card p { color: var(--c-text-muted); font-size: 14px; line-height: 1.6; }

/* ── Shop page ── */
[data-template="obsidian"] .shop__grid { display: grid; grid-template-columns: 2fr 1fr 1fr; grid-auto-flow: row dense; gap: var(--sp-4); }
[data-template="obsidian"] .prod-card { display: flex; flex-direction: column; background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); overflow: hidden; transition: border-color var(--t-med), transform var(--t-fast); }
[data-template="obsidian"] .prod-card:hover { border-color: var(--c-border-strong); transform: translateY(-2px); }
[data-template="obsidian"] .prod-card--featured { grid-column: span 3; grid-row: span 2; display: grid; grid-template-columns: 1.1fr 1fr; align-items: stretch; }
[data-template="obsidian"] .prod-card__media { position: relative; aspect-ratio: 4 / 3; background: linear-gradient(135deg, rgba(34,224,255,0.14) 0%, transparent 40%), linear-gradient(225deg, rgba(167,139,250,0.2) 0%, transparent 45%), var(--c-surface); display: flex; align-items: center; justify-content: center; overflow: hidden; padding: var(--sp-6); }
[data-template="obsidian"] .prod-card--featured .prod-card__media { aspect-ratio: auto; height: 100%; min-height: 360px; }
[data-template="obsidian"] .prod-card__media::before { content: ""; position: absolute; top: -10%; right: -25%; width: 65%; height: 130%; background: linear-gradient(135deg, rgba(139,92,246,0.25), transparent 100%); transform: skewX(-15deg); z-index: 0; }
[data-template="obsidian"] .prod-card__media svg { position: relative; z-index: 1; width: 100%; max-width: 460px; }
[data-template="obsidian"] .prod-card__media--sm { min-height: 200px; }
[data-template="obsidian"] .prod-card__placeholder { position: relative; z-index: 1; width: 100%; height: 100%; border-radius: var(--radius-md); display: flex; align-items: center; justify-content: center; font-family: var(--f-mono); font-size: 13px; color: var(--c-text); letter-spacing: 0.1em; text-transform: uppercase; }
[data-template="obsidian"] .prod-card__body { display: flex; flex-direction: column; gap: var(--sp-4); padding: var(--sp-7); flex: 1; }
[data-template="obsidian"] .prod-card__head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); }
[data-template="obsidian"] .prod-card__badge { font-family: var(--f-mono); font-size: 10px; font-weight: 700; color: #ffffff; background: var(--grad-iridescent); padding: 5px 10px; border-radius: 999px; letter-spacing: 0.06em; text-transform: uppercase; }
[data-template="obsidian"] .prod-card__sku { font-family: var(--f-mono); font-size: 11px; color: var(--c-text-dim); }
[data-template="obsidian"] .prod-card h3 { font-family: var(--f-display); font-size: 22px; font-weight: 600; color: var(--c-text-strong); letter-spacing: -0.015em; line-height: 1.25; }
[data-template="obsidian"] .prod-card--featured h3 { font-size: 28px; }
[data-template="obsidian"] .prod-card > .prod-card__body > p { color: var(--c-text-muted); font-size: 14px; line-height: 1.6; }
[data-template="obsidian"] .prod-card__feats { display: flex; flex-direction: column; gap: var(--sp-2); padding: var(--sp-3) 0; margin: 0; border-top: 1px solid var(--c-divider); }
[data-template="obsidian"] .prod-card__feats li { position: relative; padding-left: var(--sp-5); font-size: 13px; color: var(--c-text-muted); }
[data-template="obsidian"] .prod-card__feats li::before { content: "✓"; position: absolute; left: 0; top: 0; color: var(--c-accent); font-size: 12px; font-weight: 600; }
[data-template="obsidian"] .prod-card__buy { margin-top: auto; padding-top: var(--sp-5); border-top: 1px solid var(--c-divider); display: flex; align-items: flex-end; justify-content: space-between; gap: var(--sp-5); flex-wrap: wrap; }
[data-template="obsidian"] .prod-card__buy--inline { align-items: center; }
[data-template="obsidian"] .prod-card__price { display: flex; flex-direction: column; gap: 2px; }
[data-template="obsidian"] .prod-card__price-label { font-family: var(--f-mono); font-size: 11px; color: var(--c-text-dim); letter-spacing: 0.06em; text-transform: uppercase; }
[data-template="obsidian"] .prod-card__price-amount { font-family: var(--f-display); font-size: 36px; font-weight: 700; background: var(--grad-iridescent); background-clip: text; -webkit-background-clip: text; color: transparent; letter-spacing: -0.025em; line-height: 1; }
[data-template="obsidian"] .prod-card__price-amount--sm { font-size: 22px; }
[data-template="obsidian"] .prod-card__price-note { font-size: 12px; color: var(--c-text-dim); }
[data-template="obsidian"] .prod-card__actions { display: flex; gap: var(--sp-2); flex-wrap: wrap; }

[data-template="obsidian"] .shop-info { padding-bottom: var(--sp-12); }
[data-template="obsidian"] .shop-info__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-4); }
[data-template="obsidian"] .shop-info-card { padding: var(--sp-7); background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); text-align: left; transition: border-color var(--t-fast); }
[data-template="obsidian"] .shop-info-card:hover { border-color: var(--c-accent); }
[data-template="obsidian"] .shop-info-card__icon { display: flex; width: 48px; height: 48px; align-items: center; justify-content: center; background: var(--grad-iridescent); border-radius: var(--radius-md); color: #fff; margin-bottom: var(--sp-5); box-shadow: 0 8px 18px -6px rgba(109,40,217,0.3); }
[data-template="obsidian"] .shop-info-card__icon svg { width: 22px; height: 22px; }
[data-template="obsidian"] .shop-info-card h3 { font-family: var(--f-display); font-size: 17px; font-weight: 600; color: var(--c-text-strong); margin-bottom: var(--sp-2); }
[data-template="obsidian"] .shop-info-card p { color: var(--c-text-muted); font-size: 13px; line-height: 1.6; }

/* ── About / Mission ── */
[data-template="obsidian"] .mission__inner { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-9); }
[data-template="obsidian"] .mission__copy .section-title { font-size: clamp(28px, 3vw, 36px); }
[data-template="obsidian"] .mission__copy > p { margin-top: var(--sp-6); color: var(--c-text-muted); font-size: 16px; line-height: 1.7; }
[data-template="obsidian"] .partners__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); }
[data-template="obsidian"] .partner-block { padding: var(--sp-9); background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-xl); transition: border-color var(--t-fast); }
[data-template="obsidian"] .partner-block:hover { border-color: var(--c-border-strong); }
[data-template="obsidian"] .partner-block__logo { display: flex; width: 80px; height: 80px; align-items: center; justify-content: center; border: 1px solid var(--c-border-strong); border-radius: var(--radius-lg); color: var(--c-text); background: var(--c-surface-2); margin-bottom: var(--sp-6); }
[data-template="obsidian"] .partner-block__logo svg { width: 48px; height: 48px; }
[data-template="obsidian"] .partner-block h3 { font-family: var(--f-display); font-size: 24px; font-weight: 600; color: var(--c-text-strong); margin-bottom: var(--sp-3); letter-spacing: -0.02em; }
[data-template="obsidian"] .partner-block p { color: var(--c-text-muted); font-size: 15px; line-height: 1.65; }

[data-template="obsidian"] .news__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--sp-4); }
[data-template="obsidian"] .news-item { padding: var(--sp-7); background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); display: flex; flex-direction: column; gap: var(--sp-3); transition: border-color var(--t-fast), transform var(--t-fast); }
[data-template="obsidian"] .news-item:hover { border-color: var(--c-border-strong); transform: translateY(-2px); }
[data-template="obsidian"] .news-item time { font-family: var(--f-mono); font-size: 11px; color: var(--c-text-dim); letter-spacing: 0.05em; }
[data-template="obsidian"] .news-item__tag { align-self: flex-start; font-family: var(--f-mono); font-size: 10px; font-weight: 700; color: var(--c-accent); padding: 3px 8px; border: 1px solid rgba(109,40,217,0.3); background: rgba(167,139,250,0.12); border-radius: 4px; letter-spacing: 0.06em; text-transform: uppercase; }
[data-template="obsidian"] .news-item h3 { font-family: var(--f-display); font-size: 18px; font-weight: 600; color: var(--c-text-strong); letter-spacing: -0.015em; line-height: 1.3; }
[data-template="obsidian"] .news-item p { color: var(--c-text-muted); font-size: 14px; line-height: 1.6; }

[data-template="obsidian"] .contact__inner { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-10); align-items: center; }
[data-template="obsidian"] .contact__copy > p { margin-top: var(--sp-5); color: var(--c-text-muted); font-size: 16px; line-height: 1.7; }
[data-template="obsidian"] .contact__list { display: flex; flex-direction: column; gap: 0; border: 1px solid var(--c-border); border-radius: var(--radius-lg); background: var(--c-surface); overflow: hidden; }
[data-template="obsidian"] .contact__list li { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4); padding: var(--sp-5) var(--sp-6); border-bottom: 1px solid var(--c-divider); transition: background var(--t-fast); }
[data-template="obsidian"] .contact__list li:last-child { border-bottom: none; }
[data-template="obsidian"] .contact__list li:hover { background: var(--c-surface-2); }
[data-template="obsidian"] .contact__list-label { font-family: var(--f-mono); font-size: 12px; font-weight: 600; color: var(--c-accent); letter-spacing: 0.04em; text-transform: uppercase; }
[data-template="obsidian"] .contact__list a { font-family: var(--f-mono); font-size: 14px; color: var(--c-text); font-weight: 500; transition: color var(--t-fast); }
[data-template="obsidian"] .contact__list a:hover { color: var(--c-accent); }

/* ── Responsive — main breakpoints ── */
@media (max-width: 1080px) {
  [data-template="obsidian"] .hero__inner { grid-template-columns: 1fr; min-height: auto; }
  [data-template="obsidian"] .hero__visual { max-width: 480px; margin: 0 auto; }
  [data-template="obsidian"] .specs__stage { grid-template-columns: 1fr; }
  [data-template="obsidian"] .specs__board { position: static; max-width: 520px; margin: 0 auto var(--sp-7); }
  [data-template="obsidian"] .soc__inner { grid-template-columns: 1fr; }
  [data-template="obsidian"] .origin__inner { grid-template-columns: 1fr; }
  [data-template="obsidian"] .origin__visual { max-width: 520px; margin: 0 auto; }
  [data-template="obsidian"] .final-cta__panel { grid-template-columns: 1fr; }
  [data-template="obsidian"] .site-footer__top { grid-template-columns: 1fr; }
  [data-template="obsidian"] .fw-grid { grid-template-columns: 1fr; }
  [data-template="obsidian"] .multios__grid { grid-template-columns: 1fr; }
  [data-template="obsidian"] .interfaces__stage { grid-template-columns: 1fr; }
  [data-template="obsidian"] .quickstart__inner { grid-template-columns: 1fr; }
  [data-template="obsidian"] .sdk__grid { grid-template-columns: 1fr; }
  [data-template="obsidian"] .community__grid { grid-template-columns: 1fr; }
  [data-template="obsidian"] .values-grid { grid-template-columns: 1fr; }
  [data-template="obsidian"] .shop__grid { grid-template-columns: 1fr 1fr; }
  [data-template="obsidian"] .prod-card--featured { grid-column: span 2; grid-template-columns: 1fr; }
  [data-template="obsidian"] .prod-card--featured .prod-card__media { min-height: 280px; }
  [data-template="obsidian"] .shop-info__grid { grid-template-columns: 1fr; }
  [data-template="obsidian"] .mission__inner { grid-template-columns: 1fr; }
  [data-template="obsidian"] .partners__grid { grid-template-columns: 1fr; }
  [data-template="obsidian"] .contact__inner { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
  [data-template="obsidian"] .nav,
  [data-template="obsidian"] .header-actions .btn,
  [data-template="obsidian"] .header-actions .lang { display: none; }
  [data-template="obsidian"] .menu-toggle { display: flex; }

  [data-template="obsidian"] .nav.is-open {
    display: flex; position: fixed; inset: 70px 0 0 0;
    flex-direction: column; gap: 0;
    background: rgba(7,7,11,0.96); backdrop-filter: blur(20px);
    padding: var(--sp-7) var(--sp-6); z-index: 40;
  }
  [data-template="obsidian"] .nav.is-open a { padding: var(--sp-4) 0; font-size: 20px; color: var(--c-text); border-bottom: 1px solid var(--c-border); }
  [data-template="obsidian"] .nav.is-open a::after { display: none; }

  [data-template="obsidian"] .hero__title { font-size: clamp(42px, 11vw, 60px); }
  [data-template="obsidian"] .hero__chip { font-size: 10px; padding: 8px 10px; }
  [data-template="obsidian"] .hero__chip-value { font-size: 11px; }
  [data-template="obsidian"] .hero__chip--top-left  { left: -2%; }
  [data-template="obsidian"] .hero__chip--top-right { right: -2%; }
  [data-template="obsidian"] .trust { gap: var(--sp-6); }
  [data-template="obsidian"] .trust strong { font-size: 18px; }
  [data-template="obsidian"] .opensource__title { font-size: 24px; }
  [data-template="obsidian"] .section-title { font-size: clamp(28px, 7vw, 40px); }
  [data-template="obsidian"] .soc__list li { grid-template-columns: 1fr; gap: var(--sp-2); }
  [data-template="obsidian"] .soc__list-label { padding-top: 0; }
  [data-template="obsidian"] .site-footer__cols { grid-template-columns: 1fr 1fr; gap: var(--sp-7); }
  [data-template="obsidian"] .final-cta__panel { padding: var(--sp-7); }
}

@media (max-width: 760px) {
  [data-template="obsidian"] .kf-grid { grid-template-columns: 1fr; }
  [data-template="obsidian"] .quickstart__steps { grid-template-columns: 1fr; }
  [data-template="obsidian"] .spec-row { grid-template-columns: 1fr; gap: var(--sp-2); }
  [data-template="obsidian"] .spec-row__label { padding-top: 0; }
  [data-template="obsidian"] .shop__grid { grid-template-columns: 1fr; }
  [data-template="obsidian"] .prod-card--featured { grid-column: span 1; }
  [data-template="obsidian"] .contact__list li { flex-direction: column; align-items: flex-start; gap: var(--sp-2); }
}

@media (max-width: 480px) {
  [data-template="obsidian"] .container { padding: 0 var(--sp-4); }
  [data-template="obsidian"] section { padding: var(--sp-11) 0; }
  [data-template="obsidian"] .specs__board { padding: var(--sp-5); }
  [data-template="obsidian"] .spec-card { padding: var(--sp-5); }
  [data-template="obsidian"] .uc-card { padding: var(--sp-5); }
  [data-template="obsidian"] .res-card { padding: var(--sp-5); }
}

/* ── prefers-reduced-motion ── */
@media (prefers-reduced-motion: reduce) {
  [data-template="obsidian"] *, [data-template="obsidian"] *::before, [data-template="obsidian"] *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}