/* ==========================================
   GLOBAL
   ========================================== */
[hidden] { display: none !important; }

/* ==========================================
   FONTS
   ========================================== */
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 400; font-display: swap; src: url('./fonts/cormorant-garamond-v21-latin-regular.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 400; font-display: swap; src: url('./fonts/cormorant-garamond-v21-latin-italic.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 500; font-display: swap; src: url('./fonts/cormorant-garamond-v21-latin-500.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 600; font-display: swap; src: url('./fonts/cormorant-garamond-v21-latin-600.woff2') format('woff2'); }
@font-face { font-family: 'DM Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('./fonts/dm-sans-v17-latin-regular.woff2') format('woff2'); }
@font-face { font-family: 'DM Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url('./fonts/dm-sans-v17-latin-500.woff2') format('woff2'); }
@font-face { font-family: 'DM Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url('./fonts/dm-sans-v17-latin-600.woff2') format('woff2'); }
@font-face { font-family: 'DM Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url('./fonts/dm-mono-v16-latin-regular.woff2') format('woff2'); }
@font-face { font-family: 'DM Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url('./fonts/dm-mono-v16-latin-500.woff2') format('woff2'); }

/* ==========================================
   VARIABLES
   ========================================== */
:root {
  --navy-950: #07111f;
  --navy-900: #0c1c30;
  --navy-800: #122640;
  --navy-700: #1a3050;
  --navy-500: #2a4e7a;

  --cream-50:  #faf7f3;
  --cream-100: #f3ede3;
  --cream-200: #e8ddd0;
  --cream-300: #d5c8b5;

  --gold-300: #e8c97a;
  --gold-400: #d4a84a;
  --gold-500: #c4903a;
  --gold-600: #a67530;
  --gold-700: #7c5010;
  --gold-bg:  #fdf5e6;

  --text:      #15100b;
  --text-mid:  #3a2e22;
  --text-muted:#7a6e60;
  --border:    #e0d8cc;
  --white:     #ffffff;

  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'DM Sans', system-ui, sans-serif;
  --font-mono:    'DM Mono', monospace;

  --mockup-bg:     #1a2435;
  --mockup-card:   #243044;
  --mockup-border: rgba(255,255,255,0.07);
}

/* ==========================================
   RESET + BASE
   ========================================== */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; }
body { background: var(--cream-50); color: var(--text); font-family: var(--font-body); font-size: 17px; line-height: 1.7; overflow-x: hidden; }
.container       { max-width: 1200px; margin: 0 auto; padding: 0 40px; }
.container-narrow{ max-width: 860px;  margin: 0 auto; padding: 0 40px; }
@keyframes fadeUp   { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
@keyframes pulse    { 0%,100%{opacity:1;transform:scale(1);} 50%{opacity:.5;transform:scale(.85);} }
@keyframes spin     { to { transform: rotate(360deg); } }

/* ==========================================
   NAV
   ========================================== */
nav { position: sticky; top: 0; z-index: 100; background: rgba(12,28,48,.97); backdrop-filter: blur(16px); border-bottom: 0.5px solid rgba(255,255,255,.08); }
.nav-inner { padding: 0 48px; height: 64px; display: flex; align-items: center; justify-content: space-between; }
.logo { font-family: var(--font-body); font-size: 18px; font-weight: 600; color: var(--white); text-decoration: none; letter-spacing: .3px; }
.nav-right { display: flex; align-items: center; gap: 24px; }
.nav-link { font-size: 14px; color: rgba(255,255,255,.6); text-decoration: none; font-weight: 500; transition: color .2s; }
.nav-link:hover { color: var(--white); }
.nav-dropdown { position: relative; }
.nav-dropdown-toggle { cursor: pointer; }
.nav-dropdown-menu { position: absolute; top: calc(100% + 16px); left: 50%; transform: translateX(-50%); background: var(--navy-800); border: 0.5px solid rgba(255,255,255,.12); border-radius: 12px; padding: 8px; min-width: 260px; display: none; box-shadow: 0 20px 48px rgba(0,0,0,.4); z-index: 200; }
.nav-dropdown:hover .nav-dropdown-menu { display: block; }
.nav-dropdown-item { display: block; padding: 12px 14px; border-radius: 8px; text-decoration: none; transition: background .15s; }
.nav-dropdown-item:hover { background: rgba(255,255,255,.06); }
.nav-dropdown-item-name { font-size: 14px; color: var(--white); font-weight: 500; }
.nav-dropdown-item-price { font-size: 12px; color: var(--gold-400); font-family: var(--font-mono); margin-top: 3px; }
.service-price { font-family: var(--font-display); font-size: 32px; font-weight: 500; color: var(--gold-400); line-height: 1; margin-bottom: 12px; }
.nav-signin { font-size: 14px; color: rgba(255,255,255,.55); text-decoration: none; font-weight: 500; border: 0.5px solid rgba(255,255,255,.2); padding: 8px 16px; border-radius: 6px; transition: all .2s; }
.nav-signin:hover { color: var(--white); border-color: rgba(255,255,255,.4); }
.btn-nav { font-family: var(--font-body); font-size: 14px; font-weight: 600; background: var(--gold-500); color: var(--white); padding: 10px 20px; border-radius: 6px; text-decoration: none; border: none; cursor: pointer; transition: background .2s; }
.btn-nav:hover { background: var(--gold-600); }

/* ==========================================
   HERO — SPLIT LAYOUT
   ========================================== */
.hero { background: #F5F2EE; padding: 100px 64px 100px; display: flex; align-items: center; justify-content: flex-start; gap: 80px; min-height: 680px; }
.hero-left { flex: 0 0 440px; }
.hero-right { flex: 1; align-self: stretch; display: flex; flex-direction: column; min-width: 0; padding: 20px 0; }
.ai-mockup { flex: 1; min-height: 0; background: rgba(8,16,30,.92); border: 1px solid rgba(255,255,255,.12); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 40px 100px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.08); }
.ai-mockup-chrome { padding: 12px 16px; border-bottom: 0.5px solid rgba(255,255,255,.08); display: flex; align-items: center; gap: 12px; background: rgba(255,255,255,.04); flex-shrink: 0; }
.ai-mockup-traffic { display: flex; gap: 6px; align-items: center; flex-shrink: 0; }
.ai-mockup-traffic span { width: 11px; height: 11px; border-radius: 50%; }
.ai-mockup-traffic span:first-child { background: #FF5F57; }
.ai-mockup-traffic span:nth-child(2) { background: #FFBD2E; }
.ai-mockup-traffic span:last-child { background: #28C840; }
.ai-mockup-urlbar { flex: 1; background: rgba(255,255,255,.07); border: 0.5px solid rgba(255,255,255,.1); border-radius: 6px; padding: 5px 12px; }
.ai-mockup-urlbar-text { font-family: var(--font-mono); font-size: 11px; color: rgba(255,255,255,.4); letter-spacing: .2px; }
.ai-mockup-engine { display: flex; align-items: center; gap: 7px; font-family: var(--font-mono); font-size: 11px; font-weight: 700; color: rgba(255,255,255,.55); letter-spacing: .5px; flex-shrink: 0; white-space: nowrap; }
.ai-mockup-engine-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; transition: background .5s; }
.ai-mockup-body-wrap { flex: 1; min-height: 0; position: relative; overflow: hidden; }
.ai-frame { position: absolute; inset: 0; padding: 20px 22px; display: flex; flex-direction: column; gap: 12px; opacity: 0; transition: opacity .6s ease; pointer-events: none; overflow: hidden; }
.ai-frame.active { opacity: 1; pointer-events: auto; }
/* Scene-specific */
.px-searchbar { background: rgba(255,255,255,.07); border: 0.5px solid rgba(255,255,255,.13); border-radius: 8px; padding: 11px 14px; display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.mockup-caption { font-family: var(--font-display); font-size: 31px; font-weight: 500; color: var(--gold-700); line-height: 1.2; letter-spacing: -.4px; flex-shrink: 0; padding-bottom: 18px; transition: opacity .4s ease; }
.px-search-icon { font-size: 13px; opacity: .5; }
.px-search-query { font-size: 13px; color: rgba(255,255,255,.7); }
.px-answer-header { display: flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 10px; color: rgba(255,255,255,.3); letter-spacing: 1px; text-transform: uppercase; flex-shrink: 0; }
.px-pulse { width: 6px; height: 6px; border-radius: 50%; background: #20B8CD; animation: pulse 2s infinite; flex-shrink: 0; }
.px-answer-body { font-size: 14px; color: rgba(255,255,255,.8); line-height: 1.85; flex: 1; }
.px-result-chip { display: inline-flex; align-items: center; gap: 5px; background: rgba(255,255,255,.06); border: 0.5px solid rgba(255,255,255,.1); border-radius: 6px; padding: 3px 9px; font-size: 12px; color: rgba(255,255,255,.55); font-weight: 500; margin-bottom: 4px; }
.px-competitor { color: rgba(147,197,253,.9); font-weight: 600; }
.px-your-hotel { color: rgba(255,255,255,.9); font-weight: 600; }
.ai-mockup-query { background: rgba(255,255,255,.06); border: 0.5px solid rgba(255,255,255,.09); border-radius: 10px; padding: 13px 16px; }
.ai-mockup-query-label { font-family: var(--font-mono); font-size: 10px; color: rgba(255,255,255,.28); letter-spacing: 1px; text-transform: uppercase; margin-bottom: 6px; }
.ai-mockup-query-text { font-size: 13px; color: rgba(255,255,255,.65); font-style: italic; line-height: 1.5; }
.ai-mockup-response-label { display: flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 10px; color: rgba(255,255,255,.3); letter-spacing: .8px; text-transform: uppercase; margin-bottom: 11px; }
.ai-mockup-response-pulse { width: 6px; height: 6px; border-radius: 50%; background: #20B8CD; animation: pulse 2s infinite; flex-shrink: 0; }
.ai-mockup-response-text { font-size: 14px; color: rgba(255,255,255,.82); line-height: 1.75; }
.ai-highlight { background: rgba(239,68,68,.2); color: rgba(252,165,165,.95); border-radius: 3px; padding: 1px 5px; font-style: normal; }
.ai-mockup-sources-label { font-family: var(--font-mono); font-size: 10px; color: rgba(255,255,255,.25); letter-spacing: .8px; text-transform: uppercase; margin-bottom: 8px; }
.ai-mockup-sources-row { display: flex; gap: 6px; flex-wrap: wrap; }
.ai-source-chip { font-family: var(--font-mono); font-size: 10px; padding: 4px 10px; border-radius: 20px; background: rgba(255,255,255,.05); border: 0.5px solid rgba(255,255,255,.1); color: rgba(255,255,255,.38); }
.ai-mockup-annotation { background: rgba(196,144,58,.12); border-left: 3px solid var(--gold-400); border-radius: 0 8px 8px 0; padding: 14px 18px; flex-shrink: 0; }
.ai-annotation-eyebrow { font-family: var(--font-mono); font-size: 11px; font-weight: 700; color: var(--gold-400); letter-spacing: 1.2px; text-transform: uppercase; margin-bottom: 8px; }
.ai-annotation-text { font-size: 14px; color: rgba(255,255,255,.75); line-height: 1.65; }
.ai-annotation-text strong { color: var(--gold-300); font-weight: 700; }
.px-rank { font-size: 9px; color: rgba(255,255,255,.3); font-family: var(--font-mono); vertical-align: super; margin-left: 1px; }
.ai-mockup-footer-bar { padding: 10px 20px; border-top: 0.5px solid rgba(255,255,255,.07); display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; }
.ai-mockup-dots { display: flex; gap: 6px; align-items: center; }
.ai-mockup-dot { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.2); cursor: pointer; transition: all .35s; }
.ai-mockup-dot.active { background: var(--gold-400); width: 18px; border-radius: 3px; }
.ai-mockup-footer-note { font-family: var(--font-mono); font-size: 10px; color: rgba(255,255,255,.4); }

/* ── Scene 2: Source review ── */
.s2-breadcrumb { display: flex; align-items: center; gap: 5px; flex-shrink: 0; margin-bottom: -4px; }
.s2-crumb { font-family: var(--font-mono); font-size: 10px; color: rgba(255,255,255,.25); letter-spacing: .5px; }
.s2-crumb-sep { color: rgba(255,255,255,.15); font-size: 11px; }
.s2-crumb-active { color: #00AF87; }

.s2-mobile-wrap { flex: 1; min-height: 0; display: flex; flex-direction: column; background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 8px 32px rgba(0,0,0,.4); }
.s2-mobile-chrome { background: #F2F2F7; border-bottom: 0.5px solid rgba(0,0,0,.08); padding: 8px 12px; flex-shrink: 0; }
.s2-mobile-bar { background: #fff; border-radius: 8px; padding: 5px 10px; }
.s2-mobile-url { font-family: var(--font-mono); font-size: 10px; color: #555; }
.s2-mobile-body { flex: 1; min-height: 0; overflow: hidden; padding: 14px; display: flex; flex-direction: column; gap: 10px; }

.s2-hotel-row { display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; }
.s2-hotel-name { font-family: var(--font-display); font-size: 15px; font-weight: 600; color: #1a1a1a; }
.s2-ta-rating { display: flex; align-items: center; gap: 3px; }
.s2-ta-bubble { width: 11px; height: 11px; border-radius: 50%; background: #d4d4d4; }
.s2-ta-bubble.filled { background: #00AF87; }
.s2-ta-bubble.half { background: linear-gradient(90deg, #00AF87 50%, #d4d4d4 50%); }
.s2-ta-score { font-size: 11px; font-weight: 600; color: #333; margin-left: 4px; }

.s2-review-card { background: #fff; border: 0.5px solid #e5e5e5; border-radius: 10px; padding: 14px; display: flex; flex-direction: column; gap: 8px; flex-shrink: 0; }
.s2-review-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.s2-review-stars { display: flex; gap: 2px; }
.s2-star { font-size: 9px; color: #d4d4d4; }
.s2-star.filled { color: #00AF87; }
.s2-reviewer { font-family: var(--font-mono); font-size: 10px; color: #666; }
.s2-review-date { font-family: var(--font-mono); font-size: 10px; color: #aaa; margin-left: auto; }
.s2-review-title { font-size: 13px; font-weight: 600; color: #1a1a1a; }
.s2-review-body { font-size: 13px; color: #444; line-height: 1.7; }
.s2-highlight { background: rgba(239,68,68,.18); color: #991b1b; border-radius: 3px; padding: 1px 4px; font-style: normal; }

.s2-review-age { display: flex; align-items: flex-start; gap: 8px; padding: 10px 12px; background: rgba(239,68,68,.06); border-radius: 8px; font-size: 12px; color: #666; line-height: 1.5; flex-shrink: 0; }
.s2-review-age strong { color: #b91c1c; }
.s2-age-dot { width: 7px; height: 7px; border-radius: 50%; background: #ef4444; flex-shrink: 0; margin-top: 3px; }
.s2-annotation { flex-shrink: 0; }

/* ── Scene 3: Scored report ── */
#frame-3, #frame-4 { gap: 8px; }
.s3-header { flex-shrink: 0; padding-bottom: 8px; border-bottom: 0.5px solid rgba(255,255,255,.08); }
.s3-hotel { font-family: var(--font-display); font-size: 14px; font-weight: 600; color: rgba(255,255,255,.9); display: flex; align-items: center; gap: 10px; }
.s3-hotel-tag { font-family: var(--font-mono); font-size: 9px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; color: var(--gold-400); background: rgba(196,144,58,.12); border: 0.5px solid rgba(196,144,58,.25); border-radius: 4px; padding: 2px 7px; }
.s3-meta { font-family: var(--font-mono); font-size: 10px; color: rgba(255,255,255,.28); letter-spacing: .4px; margin-top: 4px; }
.s3-score-row { display: flex; align-items: center; gap: 16px; flex-shrink: 0; padding: 7px 10px; background: rgba(255,255,255,.04); border-radius: 8px; border: 0.5px solid rgba(255,255,255,.07); }
.s3-score-box { display: flex; align-items: baseline; gap: 2px; flex-wrap: wrap; flex-shrink: 0; }
.s3-score-num { font-family: var(--font-display); font-size: 32px; font-weight: 600; color: var(--gold-400); line-height: 1; }
.s3-score-denom { font-family: var(--font-mono); font-size: 12px; color: rgba(255,255,255,.3); }
.s3-score-label { font-family: var(--font-mono); font-size: 9px; color: rgba(255,255,255,.3); letter-spacing: .5px; text-transform: uppercase; width: 100%; margin-top: 2px; }
.s3-score-legend { display: flex; flex-direction: column; gap: 4px; }
.s3-leg-item { font-family: var(--font-mono); font-size: 10px; letter-spacing: .3px; }
.s3-leg-issue { color: #fca5a5; } .s3-leg-monitor { color: #fcd34d; } .s3-leg-strong { color: #86efac; }
.s3-themes { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 3px; }
.s3-row { display: flex; align-items: flex-start; gap: 10px; padding: 6px 8px; border-radius: 8px; background: rgba(255,255,255,.025); border-left: 3px solid transparent; }
.s3-row-issue { border-left-color: #ef4444; background: rgba(239,68,68,.06); }
.s3-row-monitor { border-left-color: #f59e0b; background: rgba(245,158,11,.04); }
.s3-row-strong { border-left-color: #22c55e; }
.s3-icon-box { width: 24px; height: 24px; border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: 12px; flex-shrink: 0; }
.s3-row-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.s3-row-top { display: flex; align-items: center; justify-content: space-between; }
.s3-name { font-size: 12px; font-weight: 600; color: rgba(255,255,255,.85); }
.s3-badge { font-family: var(--font-mono); font-size: 9px; font-weight: 700; letter-spacing: .7px; text-transform: uppercase; padding: 2px 6px; border-radius: 4px; flex-shrink: 0; }
.s3-badge-issue { background: rgba(239,68,68,.15); color: #fca5a5; }
.s3-badge-monitor { background: rgba(245,158,11,.15); color: #fcd34d; }
.s3-badge-strong { background: rgba(34,197,94,.1); color: #86efac; }
.s3-bar-row { display: flex; align-items: center; gap: 8px; }
.s3-bar-track { flex: 1; height: 4px; background: rgba(255,255,255,.07); border-radius: 2px; overflow: hidden; }
.s3-bar-fill { height: 100%; border-radius: 2px; }
.s3-pct { font-family: var(--font-mono); font-size: 10px; font-weight: 700; flex-shrink: 0; width: 28px; text-align: right; }
.s3-row-note { font-size: 10px; color: rgba(255,255,255,.3); }

/* ── Scene 4: Fix tracker ── */
.s4-frame { background: rgba(10,14,22,.97); }
.s4-header { flex-shrink: 0; padding-bottom: 8px; border-bottom: 0.5px solid rgba(255,255,255,.07); }
.s4-hotel { font-family: var(--font-display); font-size: 14px; font-weight: 600; color: rgba(255,255,255,.9); display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.s4-hotel-tag { font-family: var(--font-mono); font-size: 9px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; color: #60a5fa; background: rgba(96,165,250,.1); border: 0.5px solid rgba(96,165,250,.25); border-radius: 4px; padding: 2px 7px; }
.s4-stats-row { display: flex; gap: 8px; }
.s4-stat { flex: 1; border-radius: 8px; padding: 6px 8px; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.s4-stat-active { background: rgba(245,158,11,.1); border: 0.5px solid rgba(245,158,11,.25); }
.s4-stat-done { background: rgba(34,197,94,.08); border: 0.5px solid rgba(34,197,94,.2); }
.s4-stat-watch { background: rgba(96,165,250,.06); border: 0.5px solid rgba(96,165,250,.15); }
.s4-stat-num { font-family: var(--font-display); font-size: 22px; font-weight: 600; line-height: 1; }
.s4-stat-active .s4-stat-num { color: #fbbf24; }
.s4-stat-done .s4-stat-num { color: #4ade80; }
.s4-stat-watch .s4-stat-num { color: #93c5fd; }
.s4-stat-lbl { font-family: var(--font-mono); font-size: 9px; letter-spacing: .5px; text-transform: uppercase; color: rgba(255,255,255,.35); }
.s4-items { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 4px; }
.s4-card { background: rgba(255,255,255,.03); border: 0.5px solid rgba(255,255,255,.07); border-radius: 8px; padding: 7px 10px; display: flex; flex-direction: column; gap: 4px; }
.s4-card-active { background: rgba(245,158,11,.06); border-color: rgba(245,158,11,.2); }
.s4-card-done { background: rgba(34,197,94,.04); border-color: rgba(34,197,94,.15); }
.s4-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.s4-card-left { display: flex; align-items: flex-start; gap: 8px; flex: 1; min-width: 0; }
.s4-icon { width: 20px; height: 20px; border-radius: 5px; display: flex; align-items: center; justify-content: center; font-size: 11px; flex-shrink: 0; }
.s4-icon-progress { background: rgba(245,158,11,.15); color: #fbbf24; }
.s4-icon-done { background: rgba(34,197,94,.15); color: #4ade80; }
.s4-icon-watch { background: rgba(96,165,250,.1); color: #93c5fd; }
.s4-card-theme { font-size: 12px; font-weight: 600; color: rgba(255,255,255,.85); }
.s4-card-action { font-size: 10px; color: rgba(255,255,255,.35); line-height: 1.5; margin-top: 1px; }
.s4-pill { font-family: var(--font-mono); font-size: 9px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; padding: 3px 7px; border-radius: 4px; display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
.s4-pill-progress { background: rgba(245,158,11,.15); color: #fcd34d; }
.s4-pill-done { background: rgba(34,197,94,.12); color: #86efac; }
.s4-pill-watch { background: rgba(96,165,250,.08); color: #93c5fd; }
.s4-pulse { width: 5px; height: 5px; border-radius: 50%; background: #f59e0b; animation: pulse 1.5s infinite; flex-shrink: 0; }
.s4-progress-row { display: flex; align-items: center; gap: 8px; }
.s4-track { flex: 1; height: 4px; background: rgba(255,255,255,.06); border-radius: 2px; overflow: hidden; }
.s4-fill { height: 100%; border-radius: 2px; }
.s4-pct { font-family: var(--font-mono); font-size: 10px; font-weight: 700; flex-shrink: 0; width: 32px; text-align: right; }
.s4-card-time { font-family: var(--font-mono); font-size: 9px; color: rgba(255,255,255,.2); letter-spacing: .3px; }

.hero-for-pill { display: inline-flex; align-items: center; gap: 8px; background: rgba(196,144,58,.12); border: 0.5px solid rgba(196,144,58,.45); border-radius: 20px; padding: 6px 14px; font-size: 12px; font-weight: 600; color: var(--gold-600); letter-spacing: .5px; font-family: var(--font-mono); text-transform: uppercase; margin-bottom: 28px; width: fit-content; }
.hero-pill-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--gold-500); animation: pulse 2.5s ease-in-out infinite; }
.hero-headline { font-family: var(--font-display); font-size: 58px; font-weight: 500; line-height: 1.08; letter-spacing: -.5px; color: var(--navy-900); margin-bottom: 24px; }
.hero-headline em { font-style: italic; color: var(--gold-500); }
.hero-sub { font-size: 17px; color: rgba(12,28,48,.6); line-height: 1.7; margin-bottom: 40px; max-width: 400px; }
.hero-proof { display: flex; gap: 32px; padding-top: 32px; border-top: 0.5px solid rgba(12,28,48,.12); }
.hero-proof-item span { display: block; font-family: var(--font-display); font-size: 30px; font-weight: 500; color: var(--gold-500); line-height: 1; margin-bottom: 4px; }
.hero-proof-item p { font-size: 13px; color: rgba(12,28,48,.45); font-family: var(--font-mono); }
.hero-early-access { font-size: 13px; color: rgba(12,28,48,.45); font-family: var(--font-mono); margin: 0; line-height: 1.6; }
.btn-hero-cta { display: inline-block; font-family: var(--font-body); font-size: 17px; font-weight: 700; background: var(--gold-500); color: var(--white); padding: 18px 44px; border-radius: 8px; text-decoration: none; transition: background .2s; margin-bottom: 36px; }
.btn-hero-cta:hover { background: var(--gold-600); }

/* Form (right side) */
.hero-form-label { font-family: var(--font-mono); font-size: 11px; font-weight: 600; color: var(--text-muted); letter-spacing: 1.2px; text-transform: uppercase; margin-bottom: 20px; display: block; }
.scan-card { background: var(--white); border: 1px solid var(--border); border-radius: 14px; padding: 28px; box-shadow: 0 12px 40px rgba(0,0,0,.06); }
.form-fields { display: flex; flex-direction: column; gap: 10px; }
input[type="text"], input[type="email"] { width: 100%; font-family: var(--font-body); font-size: 15px; color: var(--text); background: var(--cream-50); border: 1px solid var(--border); border-radius: 7px; height: 48px; padding: 0 16px; outline: none; transition: all .2s; }
input::placeholder { color: var(--text-muted); }
input:focus { border-color: var(--gold-500); box-shadow: 0 0 0 3px rgba(196,144,58,.12); background: var(--white); }
.form-step-2 { display: none; flex-direction: column; gap: 10px; animation: fadeUp .3s ease; }
.form-step-2.visible { display: flex; }
.btn-scan { width: 100%; margin-top: 10px; font-family: var(--font-body); font-size: 16px; font-weight: 600; background: var(--navy-800); color: var(--white); border: none; border-radius: 7px; height: 52px; cursor: pointer; transition: all .2s; }
.btn-scan:hover { background: var(--navy-700); }
.form-trust { font-size: 12px; color: var(--text-muted); text-align: center; margin-top: 14px; display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap; font-family: var(--font-mono); }
.form-trust span + span::before { content: '·'; margin-right: 10px; color: var(--cream-300); }

/* ==========================================
   PROOF STRIP
   ========================================== */
.proof-strip { background: var(--navy-950); padding: 28px 0; border-bottom: 0.5px solid rgba(255,255,255,.06); }
.proof-strip-inner { max-width: 1200px; margin: 0 auto; padding: 0 40px; display: flex; align-items: center; justify-content: center; gap: 0; }
.proof-stat { flex: 1; text-align: center; padding: 0 24px; border-right: 0.5px solid rgba(255,255,255,.08); }
.proof-stat:last-child { border-right: none; }
.proof-stat-num { font-family: var(--font-display); font-size: 36px; font-weight: 500; color: var(--gold-300); line-height: 1; margin-bottom: 4px; }
.proof-stat-label { font-size: 13px; color: rgba(255,255,255,.4); font-family: var(--font-mono); letter-spacing: .3px; }

/* ==========================================
   SHARED SECTION STYLES
   ========================================== */
.section { padding: 100px 0; border-bottom: 1px solid var(--border); }
.section.alt { background: var(--white); }
.section.deep-cream { background: var(--cream-100); }
.section.gold-wash { background: linear-gradient(170deg, rgba(196,144,58,.07) 0%, var(--cream-50) 45%); position: relative; }
.section.gold-wash::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, transparent 0%, rgba(196,144,58,.35) 30%, rgba(196,144,58,.5) 50%, rgba(196,144,58,.35) 70%, transparent 100%); }
.section-tag { font-family: var(--font-mono); font-size: 11px; font-weight: 600; color: var(--gold-500); letter-spacing: 1.5px; text-transform: uppercase; margin-bottom: 16px; display: inline-flex; align-items: center; gap: 8px; }
.section-tag::before { content: ''; width: 20px; height: 1px; background: var(--gold-400); }
.section-title { font-family: var(--font-display); font-size: 46px; font-weight: 500; color: var(--text); line-height: 1.15; margin-bottom: 20px; }
.section-title em { font-style: italic; color: var(--gold-500); }
.section-desc { font-size: 17px; color: var(--text-mid); line-height: 1.7; margin-bottom: 16px; }
.section-header-left { margin-bottom: 40px; }

/* ── Two-column section layouts ── */
.section-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.section-two-col.col-55-45 { grid-template-columns: 55fr 45fr; }
.section-two-col .section-header-left { margin-bottom: 0; }

/* ── Problem section right column: mini AI response ── */
.prob-ai-card { background: var(--navy-900, #08101e); border-radius: 14px; padding: 24px; box-shadow: 0 24px 60px rgba(0,0,0,.22), 0 0 0 1px rgba(255,255,255,.06); }
.prob-ai-searchbar { display: flex; align-items: center; gap: 10px; background: rgba(255,255,255,.06); border: 0.5px solid rgba(255,255,255,.1); border-radius: 8px; padding: 10px 14px; margin-bottom: 16px; }
.prob-ai-icon { font-size: 16px; color: rgba(255,255,255,.4); }
.prob-ai-query { font-family: var(--font-mono); font-size: 12px; color: rgba(255,255,255,.6); }
.prob-ai-answer-label { font-family: var(--font-mono); font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: rgba(255,255,255,.3); margin-bottom: 10px; display: flex; align-items: center; gap: 6px; }
.prob-ai-answer-label::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #20B8CD; display: inline-block; animation: pulse 2s ease-in-out infinite; }
.prob-ai-body { font-size: 13px; color: rgba(255,255,255,.55); line-height: 1.7; }
.prob-ai-body mark { background: rgba(239,68,68,.18); color: #fca5a5; border-radius: 3px; padding: 1px 3px; }
.prob-ai-source { margin-top: 14px; padding-top: 14px; border-top: 0.5px solid rgba(255,255,255,.07); display: flex; align-items: center; gap: 8px; }
.prob-ai-source-dot { width: 8px; height: 8px; border-radius: 50%; background: #00AF87; flex-shrink: 0; }
.prob-ai-source-text { font-family: var(--font-mono); font-size: 10px; color: rgba(255,255,255,.25); }
.prob-ai-source-text strong { color: rgba(255,255,255,.45); }

/* ── Methodology section two-column header ── */
.meth-header-two-col { display: grid; grid-template-columns: 55fr 45fr; gap: 80px; align-items: start; margin-bottom: 48px; }
.meth-stats-card { background: var(--white); border: 1px solid var(--border); border-radius: 14px; padding: 28px 28px 20px; box-shadow: 0 8px 32px rgba(0,0,0,.05); }
.meth-stats-title { font-family: var(--font-mono); font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--gold-500); margin-bottom: 20px; display: flex; align-items: center; gap: 8px; }
.meth-stats-title::before { content: ''; width: 16px; height: 1px; background: var(--gold-400); }
.meth-stat-row { display: flex; align-items: center; justify-content: space-between; padding: 12px 0; border-bottom: 0.5px solid var(--border); }
.meth-stat-row:last-child { border-bottom: none; padding-bottom: 0; }
.meth-stat-label { font-size: 14px; color: var(--text-mid); }
.meth-stat-val { font-family: var(--font-display); font-size: 22px; font-weight: 500; color: var(--text); }
.meth-stat-val em { font-style: normal; color: var(--gold-500); }

/* ── Source stack (how-ai-decides) ── */
.src-stack { display: flex; flex-direction: column; gap: 8px; }
.src-chip { display: flex; align-items: center; gap: 12px; background: var(--cream-50); border: 1px solid var(--border); border-radius: 10px; padding: 12px 16px; }
.src-chip-dot { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; }
.src-chip-name { font-size: 14px; font-weight: 600; color: var(--text); flex: 1; }
.src-chip-age { font-family: var(--font-mono); font-size: 11px; color: var(--text-muted); }
.src-note { font-family: var(--font-mono); font-size: 11px; color: var(--text-muted); margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border); letter-spacing: .3px; }

/* ── Blind spots stat column ── */
.blind-stat-col { display: flex; flex-direction: column; gap: 16px; justify-content: center; }
.blind-stat-card { padding: 24px 28px; background: var(--cream-50); border: 1px solid var(--border); border-radius: 12px; }
.blind-stat-num { font-family: var(--font-display); font-size: 52px; font-weight: 500; color: var(--text); line-height: 1; margin-bottom: 8px; }
.blind-stat-num em { color: var(--gold-500); font-style: normal; }
.blind-stat-label { font-size: 14px; color: var(--text-mid); line-height: 1.5; }

/* ── How it works two-column ── */
.how-two-col { display: grid; grid-template-columns: 45fr 55fr; gap: 80px; align-items: start; }
.how-two-col .section-header-left { margin-bottom: 0; }
.how-two-col .how-flow { margin-top: 0; max-width: none; }

/* ── Delivery / promise card (report preview, services, faq) ── */
.promise-card { background: var(--white); border: 1px solid var(--border); border-radius: 14px; padding: 28px 28px 20px; box-shadow: 0 8px 32px rgba(0,0,0,.05); }
.promise-card-title { font-family: var(--font-mono); font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--gold-500); margin-bottom: 20px; display: flex; align-items: center; gap: 8px; }
.promise-card-title::before { content: ''; width: 16px; height: 1px; background: var(--gold-400); }
.promise-item { display: flex; align-items: flex-start; gap: 12px; padding: 13px 0; border-bottom: 0.5px solid var(--border); }
.promise-item:last-child { border-bottom: none; padding-bottom: 4px; }
.promise-icon { font-size: 14px; color: var(--gold-500); flex-shrink: 0; margin-top: 2px; }
.promise-text { font-size: 14px; color: var(--text-mid); line-height: 1.55; }
.promise-text strong { color: var(--text); font-weight: 600; }

/* ── FAQ contact card ── */
.faq-contact-card { background: var(--navy-900, #08101e); border-radius: 14px; padding: 32px; }
.faq-contact-tag { font-family: var(--font-mono); font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--gold-400); margin-bottom: 16px; }
.faq-contact-hed { font-family: var(--font-display); font-size: 24px; font-weight: 500; color: rgba(255,255,255,.9); line-height: 1.2; margin-bottom: 12px; }
.faq-contact-body { font-size: 14px; color: rgba(255,255,255,.45); line-height: 1.65; margin-bottom: 24px; }
.faq-contact-cta { display: inline-block; font-size: 14px; font-weight: 600; color: var(--gold-400); border: 1px solid rgba(196,144,58,.35); border-radius: 8px; padding: 12px 20px; text-decoration: none; transition: border-color .2s, color .2s; }
.faq-contact-cta:hover { color: var(--gold-300); border-color: rgba(196,144,58,.6); }

/* Responsive: stack two-col layouts on tablet */
@media (max-width: 960px) {
  .section-two-col, .how-two-col, .meth-header-two-col { grid-template-columns: 1fr; gap: 40px; }
  .section-two-col.col-55-45 { grid-template-columns: 1fr; }
}

/* ==========================================
   REPORT MOCKUP
   ========================================== */
.report-preview-section { padding: 88px 0; border-bottom: 1px solid var(--border); background: var(--cream-50); overflow: hidden; }
.report-mockup-wrapper { margin-top: 48px; position: relative; }
.report-mockup-wrapper::after { content:''; position:absolute; bottom:0; left:0; right:0; height:140px; background:linear-gradient(to bottom, transparent, var(--cream-50)); pointer-events:none; z-index:2; }
.report-mockup { background: var(--mockup-bg); border-radius: 14px; max-width: 820px; margin: 0 auto; overflow: hidden; box-shadow: 0 32px 80px rgba(0,0,0,.22), 0 0 0 1px var(--mockup-border); max-height: 780px; position: relative; }
.rpt-header { padding: 18px 32px 14px; border-bottom: 1px solid var(--mockup-border); display: flex; align-items: center; justify-content: space-between; }
.rpt-brand { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--gold-300); }
.rpt-brand-sep { color: rgba(255,255,255,.2); margin: 0 8px; }
.rpt-brand-label { color: rgba(255,255,255,.4); font-weight: 400; }
.rpt-date { font-family: var(--font-mono); font-size: 11px; color: rgba(255,255,255,.3); }
.rpt-hotel-block { padding: 22px 32px 18px; }
.rpt-hotel-name { font-family: var(--font-display); font-size: 26px; font-weight: 500; color: #f0ece6; margin-bottom: 4px; }
.rpt-hotel-meta { font-family: var(--font-mono); font-size: 12px; color: rgba(255,255,255,.35); }
.rpt-intro { padding: 0 32px 22px; font-size: 14px; line-height: 1.7; color: rgba(255,255,255,.5); }
.rpt-intro strong { color: rgba(255,255,255,.75); font-weight: 500; }
.rpt-finding { margin: 0 24px 16px; border: 1px solid var(--mockup-border); border-radius: 10px; padding: 22px 26px; background: var(--mockup-card); }
.rpt-finding-label { font-family: var(--font-mono); font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: #e8b97d; margin-bottom: 8px; }
.rpt-finding-query { font-size: 13px; color: rgba(255,255,255,.4); margin-bottom: 10px; }
.rpt-finding-query span { color: rgba(255,255,255,.65); }
.rpt-citing { font-family: var(--font-mono); font-size: 11px; font-weight: 600; color: #f87171; margin-bottom: 10px; display: flex; align-items: center; gap: 6px; }
.rpt-citing-dot { width: 6px; height: 6px; border-radius: 50%; background: #f87171; animation: pulse 2s ease-in-out infinite; }
.rpt-finding-body { font-size: 14px; line-height: 1.65; color: rgba(255,255,255,.5); margin-bottom: 14px; }
.rpt-quote-block { border-left: 3px solid #e8b97d; padding: 10px 16px; background: rgba(232,185,125,.07); border-radius: 0 6px 6px 0; margin-bottom: 14px; }
.rpt-quote-text { font-family: var(--font-display); font-size: 17px; font-style: italic; color: #e8b97d; line-height: 1.5; }
.rpt-finding-source { font-family: var(--font-mono); font-size: 11px; color: rgba(255,255,255,.25); margin-top: 10px; }
.rpt-callout { margin: 8px 24px 20px; padding: 16px 20px; background: rgba(232,185,125,.07); border-left: 3px solid #e8b97d; border-radius: 0 8px 8px 0; font-size: 13px; line-height: 1.65; color: rgba(255,255,255,.65); }
.rpt-callout strong { color: #e8b97d; font-weight: 600; }

/* ==========================================
   BLIND SPOTS TABS
   ========================================== */
.tab-container { border: 1px solid var(--border); border-radius: 12px; overflow: hidden; box-shadow: 0 8px 28px rgba(0,0,0,.04); }
.tab-nav { display: flex; background: var(--cream-50); border-bottom: 1px solid var(--border); }
.tab-btn { flex: 1; padding: 18px 16px; text-align: center; background: transparent; border: none; font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--text-muted); cursor: pointer; position: relative; transition: all .2s; border-right: 1px solid var(--border); }
.tab-btn:last-child { border-right: none; }
.tab-btn.active { color: var(--navy-800); background: var(--white); }
.tab-btn.active::after { content:''; position:absolute; bottom:-1px; left:0; right:0; height:2px; background:var(--gold-500); }
.tab-content-wrap { padding: 40px; background: var(--white); }
.tab-pane { display: none; }
.tab-pane.active { display: block; animation: fadeUp .35s ease; }
.tab-tag-box { display: flex; justify-content: space-between; align-items: start; margin-bottom: 24px; gap: 20px; }
.tab-tag { font-family: var(--font-mono); font-size: 11px; font-weight: 600; color: var(--gold-600); background: var(--gold-bg); padding: 4px 10px; border-radius: 4px; border: 0.5px solid rgba(196,144,58,.25); }
.tab-stat-num { font-family: var(--font-display); font-size: 42px; font-weight: 500; color: var(--text); line-height: 1; }
.tab-threat-title { font-family: var(--font-display); font-size: 30px; font-weight: 500; color: var(--text); margin-bottom: 16px; line-height: 1.2; }
.tab-pane em { font-style: italic; color: var(--gold-500); }

/* ==========================================
   AI SHIFT CALLOUT (new)
   ========================================== */
.shift-callout { background: var(--navy-900); padding: 88px 0; border-bottom: 1px solid rgba(255,255,255,.06); }
.shift-callout .section-tag { color: var(--gold-400); }
.shift-callout .section-tag::before { background: var(--gold-400); }
.shift-callout .section-title { color: var(--white); }
.shift-callout .section-title em { color: var(--gold-300); }
.shift-callout .section-desc { color: rgba(255,255,255,.55); }
.shift-before-after { display: grid; grid-template-columns: 1fr auto 1fr; gap: 0; margin-top: 48px; align-items: stretch; }
.shift-panel { border-radius: 12px; overflow: hidden; }
.shift-panel-label { font-family: var(--font-mono); font-size: 10px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; padding: 12px 20px; }
.shift-panel-label.before { background: rgba(248,113,113,.12); color: #f87171; }
.shift-panel-label.after  { background: rgba(74,222,128,.1);  color: #4ade80; }
.shift-panel-body { padding: 20px; background: var(--mockup-card); border: 1px solid var(--mockup-border); border-top: none; }
.shift-panel.before .shift-panel-body { border-radius: 0 0 12px 12px; }
.shift-panel.after  .shift-panel-body { border-radius: 0 0 12px 12px; }
.shift-quote { font-family: var(--font-display); font-size: 18px; font-style: italic; color: rgba(255,255,255,.7); line-height: 1.55; }
.shift-quote.negative { color: #fca5a5; }
.shift-quote.positive { color: rgba(255,255,255,.5); font-size: 15px; font-style: normal; }
.shift-meta { font-size: 12px; color: rgba(255,255,255,.25); margin-top: 12px; font-family: var(--font-mono); }
.shift-arrow { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 0 28px; gap: 10px; }
.shift-arrow-line { font-size: 28px; color: var(--gold-400); }
.shift-metric { text-align: center; }
.shift-metric-num { font-family: var(--font-display); font-size: 44px; font-weight: 500; color: var(--gold-300); line-height: 1; }
.shift-metric-label { font-family: var(--font-mono); font-size: 10px; color: rgba(255,255,255,.35); letter-spacing: 1px; text-transform: uppercase; margin-top: 4px; }
.shift-fix-log { margin-top: 16px; padding: 12px 16px; background: rgba(196,144,58,.1); border: 0.5px solid rgba(196,144,58,.25); border-radius: 8px; }
.shift-fix-label { font-family: var(--font-mono); font-size: 10px; font-weight: 600; color: var(--gold-400); letter-spacing: 1px; text-transform: uppercase; margin-bottom: 4px; }
.shift-fix-text { font-size: 13px; color: rgba(255,255,255,.5); }

/* ==========================================
   HOW IT WORKS
   ========================================== */
.steps-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; margin-top: 8px; }
.how-flow { display: flex; flex-direction: column; gap: 0; margin-top: 40px; max-width: 640px; }
.how-step { display: flex; gap: 24px; align-items: flex-start; }
.how-step-num { font-family: var(--font-mono); font-size: 11px; font-weight: 700; color: var(--gold-500); letter-spacing: 1.5px; padding-top: 3px; min-width: 24px; }
.how-step-body { background: var(--cream-50); border: 1px solid var(--border); border-radius: 12px; padding: 22px 24px; flex: 1; }
.how-step-title { font-family: var(--font-display); font-size: 20px; font-weight: 500; color: var(--text); margin-bottom: 8px; line-height: 1.2; }
.how-step-desc { font-size: 14px; color: var(--text-muted); line-height: 1.65; margin-bottom: 12px; }
.how-step-tag { display: inline-block; font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: 1px; color: var(--gold-600); background: rgba(196,144,58,.1); border: 0.5px solid rgba(196,144,58,.3); border-radius: 20px; padding: 4px 12px; }
.how-step-tag--paid { color: var(--navy-800); background: rgba(12,28,48,.08); border-color: rgba(12,28,48,.15); }
.how-connector { font-size: 18px; color: var(--gold-400); padding: 6px 0 6px 11px; opacity: .5; }
.step-card { background: var(--white); border: 1px solid var(--border); border-radius: 12px; padding: 28px 24px; transition: box-shadow .2s, border-color .2s, transform .2s; }
.step-card:hover { box-shadow: 0 8px 32px rgba(0,0,0,.07); border-color: rgba(196,144,58,.3); transform: translateY(-2px); }
.gold-wash .step-card { border-top: 2px solid rgba(196,144,58,.2); }
.gold-wash .step-card:hover { border-top-color: rgba(196,144,58,.5); }
.step-num { font-family: var(--font-mono); font-size: 11px; font-weight: 600; color: var(--gold-500); letter-spacing: 1px; margin-bottom: 14px; }
.step-title { font-family: var(--font-display); font-size: 22px; font-weight: 500; color: var(--text); margin-bottom: 10px; line-height: 1.2; }
.step-desc { font-size: 14px; color: var(--text-muted); line-height: 1.65; }
.steps-timeline { margin-top: 28px; padding: 16px 20px; background: var(--gold-bg); border: 0.5px solid rgba(196,144,58,.3); border-radius: 8px; font-size: 14px; color: var(--text-mid); display: flex; align-items: center; gap: 10px; }
.steps-timeline strong { color: var(--gold-600); }

/* ==========================================
   LEDGER MOCKUP
   ========================================== */
.ledger-mockup { background: var(--mockup-bg); border-radius: 14px; max-width: 820px; margin: 48px auto 0; overflow: hidden; box-shadow: 0 32px 80px rgba(0,0,0,.22), 0 0 0 1px var(--mockup-border); }
.ldg-topbar { padding: 14px 28px; border-bottom: 1px solid var(--mockup-border); display: flex; align-items: center; justify-content: space-between; }
.ldg-topbar-left { display: flex; align-items: center; gap: 12px; }
.ldg-topbar-brand { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--gold-300); }
.ldg-topbar-sep { width: 1px; height: 16px; background: rgba(255,255,255,.1); }
.ldg-topbar-hotel { font-size: 13px; color: rgba(255,255,255,.5); font-weight: 500; }
.ldg-topbar-btn { font-family: var(--font-mono); font-size: 11px; font-weight: 600; background: var(--gold-500); color: var(--white); padding: 7px 14px; border-radius: 5px; border: none; cursor: pointer; }
.ldg-tabs { display: flex; border-bottom: 1px solid var(--mockup-border); padding: 0 28px; }
.ldg-tab-btn { background: transparent; border: none; padding: 14px 18px; font-size: 13px; font-weight: 500; color: rgba(255,255,255,.35); position: relative; font-family: var(--font-body); cursor: pointer; transition: color .2s; }
.ldg-tab-btn.active { color: var(--gold-300); }
.ldg-tab-btn.active::after { content:''; position:absolute; bottom:-1px; left:12px; right:12px; height:2px; background:var(--gold-500); border-radius:1px; }
.ldg-ui-pane { display:none; animation: fadeUp .3s ease; }
.ldg-ui-pane.active { display:block; }
.ldg-view-toggle { display:flex; background:rgba(255,255,255,.05); padding:4px; border-radius:6px; width:max-content; margin:24px 24px 0; }
.ldg-toggle-btn { padding:6px 14px; font-size:11px; font-family:var(--font-mono); font-weight:600; color:rgba(255,255,255,.4); background:transparent; border:none; border-radius:4px; cursor:pointer; transition:all .2s; text-transform:uppercase; letter-spacing:.5px; }
.ldg-toggle-btn.active { background:rgba(255,255,255,.1); color:var(--white); }
.ldg-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--mockup-border); margin:20px 24px 0; border-radius:10px; overflow:hidden; }
.ldg-stat-card { background:var(--mockup-card); padding:18px; }
.ldg-stat-label { font-family:var(--font-mono); font-size:10px; font-weight:600; color:rgba(255,255,255,.3); text-transform:uppercase; letter-spacing:1px; margin-bottom:6px; }
.ldg-stat-value { font-family:var(--font-display); font-size:26px; font-weight:500; color:#f0ece6; line-height:1; }
.ldg-stat-value.green { color:#4ade80; }
.ldg-stat-value.amber { color:#fbbf24; }
.ldg-entries { padding: 16px 24px 24px; }
.ldg-entry-row { display:grid; grid-template-columns:110px 1fr 100px 80px 160px; gap:16px; align-items:center; padding:14px 0; border-bottom:1px solid var(--mockup-border); }
.ldg-entry-row:last-child { border-bottom:none; }
.ldg-entry-theme { font-family:var(--font-mono); font-size:11px; font-weight:600; padding:3px 8px; border-radius:4px; text-align:center; text-transform:uppercase; letter-spacing:.5px; }
.ldg-entry-theme.green { background:rgba(74,222,128,.12); color:#4ade80; }
.ldg-entry-theme.amber { background:rgba(251,191,36,.12); color:#fbbf24; }
.ldg-entry-desc { font-size:13px; color:rgba(255,255,255,.55); line-height:1.5; }
.ldg-entry-date { font-family:var(--font-mono); font-size:11px; color:rgba(255,255,255,.25); text-align:right; }
.ldg-status-pill { font-family:var(--font-mono); font-size:10px; font-weight:700; padding:4px 10px; border-radius:20px; text-transform:uppercase; letter-spacing:.5px; text-align:center; }
.ldg-status-pill.resolved  { background:rgba(74,222,128,.12);  color:#4ade80; }
.ldg-status-pill.monitoring{ background:rgba(251,191,36,.12);  color:#fbbf24; }
.ldg-ai-track { display:flex; align-items:center; gap:8px; }
.ldg-ai-track-label { font-family:var(--font-mono); font-size:10px; color:rgba(255,255,255,.25); white-space:nowrap; }
.ldg-ai-track-bar { flex:1; height:4px; background:rgba(255,255,255,.07); border-radius:2px; overflow:hidden; min-width:40px; }
.ldg-ai-track-fill { height:100%; border-radius:2px; }
.ldg-ai-track-fill.green { background:#4ade80; }
.ldg-ai-track-fill.amber { background:#fbbf24; }
.ldg-ai-track-pct { font-family:var(--font-mono); font-size:11px; color:rgba(255,255,255,.4); }
.ldg-edit-input { display:none; width:100%; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); border-radius:5px; color:rgba(255,255,255,.7); font-family:var(--font-body); font-size:13px; padding:8px 10px; resize:vertical; min-height:60px; }
.ldg-edit-select { display:none; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); border-radius:5px; color:rgba(255,255,255,.6); font-family:var(--font-mono); font-size:11px; padding:6px 8px; width:100%; }
.is-editing .read-element { display:none; }
.is-editing .edit-element { display:block; }

/* ==========================================
   CASE STUDY (new)
   ========================================== */
.case-study-section { background: var(--navy-950); padding: 88px 0; border-bottom: 0.5px solid rgba(255,255,255,.06); }
.case-study-section .section-tag { color: var(--gold-400); }
.case-study-section .section-tag::before { background: var(--gold-400); }
.case-study-card { background: var(--navy-800); border: 1px solid rgba(255,255,255,.08); border-radius: 16px; padding: 48px; margin-top: 40px; display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; }
.cs-label { font-family: var(--font-mono); font-size: 11px; font-weight: 600; color: var(--gold-400); letter-spacing: 1px; text-transform: uppercase; margin-bottom: 12px; }
.cs-property { font-family: var(--font-display); font-size: 28px; font-weight: 500; color: var(--white); margin-bottom: 6px; }
.cs-location { font-family: var(--font-mono); font-size: 12px; color: rgba(255,255,255,.35); margin-bottom: 28px; }
.cs-pull-quote { font-family: var(--font-display); font-size: 22px; font-style: italic; color: rgba(255,255,255,.75); line-height: 1.5; margin-bottom: 24px; border-left: 3px solid var(--gold-500); padding-left: 20px; }
.cs-narrative { font-size: 15px; color: rgba(255,255,255,.5); line-height: 1.75; }
.cs-metrics { display: flex; flex-direction: column; gap: 20px; padding-top: 4px; }
.cs-metric-card { background: rgba(255,255,255,.04); border: 0.5px solid rgba(255,255,255,.08); border-radius: 10px; padding: 20px 24px; }
.cs-metric-label { font-family: var(--font-mono); font-size: 10px; font-weight: 600; color: rgba(255,255,255,.3); letter-spacing: 1px; text-transform: uppercase; margin-bottom: 6px; }
.cs-metric-value { font-family: var(--font-display); font-size: 34px; font-weight: 500; color: var(--gold-300); line-height: 1; margin-bottom: 4px; }
.cs-metric-sub { font-size: 13px; color: rgba(255,255,255,.35); }
.cs-outcome { padding: 16px 20px; background: rgba(74,222,128,.07); border: 0.5px solid rgba(74,222,128,.2); border-radius: 8px; font-size: 14px; color: rgba(255,255,255,.6); line-height: 1.6; }
.cs-outcome strong { color: #4ade80; }

/* ==========================================
   TESTIMONIALS
   ========================================== */
.testimonial-strip { padding: 88px 0; border-bottom: 1px solid var(--border); background: var(--white); }
.testimonial-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; margin-top: 8px; }
.testimonial-card { background: var(--cream-50); border: 1px solid var(--border); border-radius: 12px; padding: 28px; display: flex; flex-direction: column; }
.testimonial-stars { color: var(--gold-400); font-size: 14px; letter-spacing: 2px; margin-bottom: 16px; }
.testimonial-quote { font-family: var(--font-display); font-size: 19px; font-style: italic; color: var(--text); line-height: 1.6; flex: 1; margin-bottom: 20px; }
.testimonial-author { font-weight: 600; font-size: 14px; color: var(--text); }
.testimonial-role { font-size: 13px; color: var(--text-muted); margin-top: 2px; }
.testimonial-location { font-family: var(--font-mono); font-size: 11px; color: var(--gold-500); margin-top: 6px; letter-spacing: .3px; }

/* ==========================================
   FAQ
   ========================================== */
.faq-section { padding: 88px 0; border-bottom: 1px solid var(--border); }
.faq-list { margin-top: 8px; display: flex; flex-direction: column; gap: 0; border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
details { border-bottom: 1px solid var(--border); background: var(--white); }
details:last-child { border-bottom: none; }
details[open] { background: var(--cream-50); }
summary { font-size: 16px; font-weight: 600; color: var(--text); padding: 22px 24px; cursor: pointer; list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; transition: color .2s; }
summary::-webkit-details-marker { display: none; }
summary:hover { color: var(--navy-800); }
summary::after { content: '+'; font-size: 20px; font-weight: 300; color: var(--text-muted); flex-shrink: 0; transition: transform .25s; }
details[open] summary::after { transform: rotate(45deg); }
.faq-answer { padding: 0 24px 22px; font-size: 15px; color: var(--text-mid); line-height: 1.75; }
.faq-answer a { color: var(--gold-600); text-decoration: underline; text-underline-offset: 2px; }

/* ==========================================
   PRICING
   ========================================== */
.pricing-section { padding: 88px 0; border-bottom: 1px solid var(--border); }
.pricing-header { text-align: center; margin-bottom: 40px; }
.pricing-header .section-tag { justify-content: center; }
.pricing-header .section-title { margin-bottom: 12px; }
.pricing-header .section-desc { text-align: center; max-width: 500px; margin: 0 auto 28px; }
.price-toggle { display: inline-flex; background: var(--cream-100); border: 1px solid var(--border); border-radius: 8px; padding: 4px; margin-bottom: 0; }
.toggle-btn { font-family: var(--font-body); font-size: 14px; font-weight: 500; color: var(--text-muted); background: transparent; border: none; padding: 8px 20px; border-radius: 5px; cursor: pointer; transition: all .2s; display: flex; align-items: center; gap: 8px; }
.toggle-btn.active { background: var(--white); color: var(--text); box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.save-badge { font-size: 11px; font-weight: 700; background: rgba(196,144,58,.15); color: var(--gold-600); padding: 2px 7px; border-radius: 10px; font-family: var(--font-mono); }
.pricing-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; max-width: 820px; margin: 32px auto 0; }
.price-card { border: 1px solid var(--border); border-radius: 14px; padding: 36px; background: var(--white); position: relative; }
.price-card.featured { border-color: var(--navy-800); box-shadow: 0 16px 48px rgba(12,28,48,.12); }
.price-tier-badge { display: inline-block; font-family: var(--font-mono); font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; padding: 4px 10px; border-radius: 4px; margin-bottom: 20px; }
.free-badge { background: var(--cream-100); color: var(--text-muted); border: 0.5px solid var(--border); }
.pro-badge  { background: var(--navy-900); color: var(--gold-300); }
.price-amount { font-family: var(--font-display); font-size: 52px; font-weight: 500; color: var(--text); line-height: 1; margin-bottom: 8px; }
.price-amount span { font-size: 18px; color: var(--text-muted); font-family: var(--font-body); font-weight: 400; }
.price-amount.pro { color: var(--navy-800); }
.price-period { font-size: 13px; color: var(--text-muted); margin-bottom: 8px; font-family: var(--font-mono); }
.price-annual-note { display: none; font-size: 12px; color: var(--gold-600); font-family: var(--font-mono); margin-bottom: 8px; }
body.show-annual .price-annual-note { display: block; }
body.show-annual .price-monthly-amount { display: none; }
body.show-annual .price-annual-amount { display: block; }
.price-monthly-amount { display: block; }
.price-annual-amount { display: none; }
.price-roi { font-size: 13px; color: var(--gold-600); background: var(--gold-bg); border: 0.5px solid rgba(196,144,58,.25); border-radius: 6px; padding: 8px 12px; margin: 12px 0 16px; font-family: var(--font-mono); }
.price-desc { font-size: 15px; color: var(--text-muted); margin-bottom: 24px; line-height: 1.5; }
.price-features { list-style: none; display: flex; flex-direction: column; gap: 10px; margin-bottom: 28px; }
.price-features li { font-size: 14px; color: var(--text-mid); display: flex; align-items: flex-start; gap: 10px; }
.price-features li.dim { color: var(--text-muted); text-decoration: line-through; }
.feat-check { color: var(--gold-500); font-size: 14px; margin-top: 2px; flex-shrink: 0; }
.feat-check.dim { color: var(--cream-300); }
.btn-price { display: block; width: 100%; text-align: center; padding: 14px; border-radius: 8px; font-family: var(--font-body); font-size: 15px; font-weight: 600; text-decoration: none; transition: all .2s; cursor: pointer; border: none; }
.btn-price.outline { background: transparent; border: 1.5px solid var(--border); color: var(--text-mid); }
.btn-price.outline:hover { border-color: var(--navy-800); color: var(--navy-800); }
.btn-price.solid  { background: var(--navy-900); color: var(--white); }
.btn-price.solid:hover  { background: var(--navy-700); }

/* ==========================================
   FINAL CTA
   ========================================== */
.cta-section { background: var(--navy-900); padding: 96px 0; text-align: center; border-top: 0.5px solid rgba(255,255,255,.06); }
.cta-scan-wrap { max-width: 480px; margin: 0 auto; text-align: left; }
.cta-headline { font-family: var(--font-display); font-size: 48px; font-weight: 500; color: var(--white); line-height: 1.15; margin-bottom: 16px; }
.cta-headline em { font-style: italic; color: var(--gold-300); }
.cta-sub { font-size: 17px; color: rgba(255,255,255,.55); margin: 0 auto 36px; max-width: 520px; line-height: 1.7; }
.cta-urgency { font-family: var(--font-mono); font-size: 12px; color: rgba(255,255,255,.3); margin-top: 20px; letter-spacing: .3px; }
.btn-cta-gold { display: inline-block; font-family: var(--font-body); font-size: 16px; font-weight: 600; background: var(--gold-500); color: var(--white); padding: 16px 40px; border-radius: 8px; text-decoration: none; border: none; cursor: pointer; transition: background .2s; }
.btn-cta-gold:hover { background: var(--gold-600); }

/* ==========================================
   FOOTER
   ========================================== */
footer { background: var(--navy-950); border-top: 0.5px solid rgba(255,255,255,.06); }
.footer-inner { max-width: 1200px; margin: 0 auto; padding: 24px 40px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.footer-text { font-size: 13px; color: rgba(255,255,255,.3); font-family: var(--font-mono); }
.footer-links { display: flex; gap: 20px; }
.footer-links a { font-size: 13px; color: rgba(255,255,255,.35); text-decoration: none; transition: color .2s; }
.footer-links a:hover { color: rgba(255,255,255,.7); }

/* ==========================================
   AUTH PAGES (login, scan-confirmed)
   ========================================== */
.auth-page { min-height: calc(100vh - 64px); display: flex; align-items: center; justify-content: center; padding: 40px 24px; background: var(--navy-900); }
.auth-card { background: var(--white); border: 1px solid var(--border); border-radius: 14px; padding: 44px 40px; max-width: 480px; width: 100%; box-shadow: 0 24px 64px rgba(0,0,0,.2); }
.auth-card--success { text-align: center; }
.auth-eyebrow { display: flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; color: var(--text-muted); margin-bottom: 20px; }
.eyebrow-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--gold-500); }
.auth-title { font-family: var(--font-display); font-size: 28px; font-weight: 500; color: var(--text); line-height: 1.2; margin-bottom: 10px; }
.auth-desc { font-size: 15px; color: var(--text-muted); line-height: 1.6; margin-bottom: 28px; }
.auth-form { display: flex; flex-direction: column; gap: 12px; }
.auth-label { display: block; font-size: 13px; font-weight: 600; color: var(--text-mid); margin-bottom: 6px; }
.btn-auth { width: 100%; font-family: var(--font-body); font-size: 15px; font-weight: 600; background: var(--navy-900); color: var(--white); border: none; border-radius: 8px; padding: 14px; cursor: pointer; transition: background .2s; }
.btn-auth:hover { background: var(--navy-700); }
.btn-auth:disabled { opacity: .6; cursor: not-allowed; }
.auth-error { font-size: 13px; color: #c0392b; margin-top: 4px; }
.auth-success-icon { font-size: 32px; margin-bottom: 16px; }
.auth-hint { font-size: 14px; color: var(--text-muted); margin-top: 16px; }
.auth-link-btn { background: none; border: none; color: var(--gold-600); font-family: var(--font-body); font-size: 14px; cursor: pointer; text-decoration: underline; padding: 0; }

/* ==========================================
   DASHBOARD
   ========================================== */
.d-loading { display: flex; align-items: center; justify-content: center; min-height: calc(100vh - 64px); }
.d-spinner { width: 30px; height: 30px; border: 2.5px solid var(--border); border-top-color: var(--gold-500); border-radius: 50%; animation: spin .8s linear infinite; }

.nav-email { font-size: 13px; color: rgba(255,255,255,.45); font-family: var(--font-mono); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 200px; }
.nav-signout { font-size: 13px; color: rgba(255,255,255,.5); background: none; border: 0.5px solid rgba(255,255,255,.2); padding: 7px 14px; border-radius: 6px; cursor: pointer; font-family: var(--font-body); transition: all .2s; white-space: nowrap; }
.nav-signout:hover { color: var(--white); border-color: rgba(255,255,255,.4); }

.d-onboard { position: fixed; inset: 0; background: var(--navy-900); z-index: 200; display: flex; align-items: center; justify-content: center; padding: 24px; overflow-y: auto; }
.d-onboard-card { background: var(--white); border: 1px solid var(--border); border-radius: 16px; padding: 48px 40px; max-width: 520px; width: 100%; box-shadow: 0 24px 64px rgba(0,0,0,.3); }
.d-onboard-tag { font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase; color: var(--gold-500); margin-bottom: 14px; }
.d-onboard-title { font-family: var(--font-display); font-size: 36px; font-weight: 500; color: var(--text); line-height: 1.15; margin-bottom: 8px; }
.d-onboard-desc { font-size: 15px; color: var(--text-muted); margin-bottom: 32px; line-height: 1.6; }
.d-form-group { margin-bottom: 14px; }
.d-label { display: block; font-size: 13px; font-weight: 600; color: var(--text-mid); margin-bottom: 6px; }
.d-label-opt { font-weight: 400; color: var(--text-muted); }
.d-input, .d-select { width: 100%; font-family: var(--font-body); font-size: 15px; color: var(--text); background: var(--cream-50); border: 1px solid var(--border); border-radius: 8px; height: 48px; padding: 0 16px; outline: none; transition: all .2s; }
.d-input::placeholder { color: var(--text-muted); }
.d-input:focus, .d-select:focus { border-color: var(--gold-500); box-shadow: 0 0 0 3px rgba(196,144,58,.1); background: var(--white); }
.d-select { cursor: pointer; -webkit-appearance: none; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237a6e60' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; padding-right: 40px; }
.d-btn-primary { width: 100%; font-family: var(--font-body); font-size: 16px; font-weight: 600; background: var(--navy-900); color: var(--white); border: none; border-radius: 8px; padding: 15px 24px; cursor: pointer; transition: background .2s; margin-top: 8px; }
.d-btn-primary:hover { background: var(--navy-700); }
.d-btn-primary:disabled { opacity: .6; cursor: not-allowed; }
.d-form-error { font-size: 13px; color: #c0392b; margin-top: 10px; }

.d-header { background: var(--navy-900); padding: 28px 0; }
.d-header-inner { max-width: 1200px; margin: 0 auto; padding: 0 40px; display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.d-hotel-name { font-family: var(--font-display); font-size: 26px; font-weight: 500; color: var(--white); line-height: 1.2; }
.d-hotel-meta { font-size: 13px; color: rgba(255,255,255,.45); font-family: var(--font-mono); margin-top: 4px; }
.d-trial-pill { font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: .5px; padding: 6px 12px; border-radius: 20px; white-space: nowrap; }
.d-trial-pill.active { background: rgba(196,144,58,.15); color: var(--gold-300); border: 0.5px solid rgba(196,144,58,.3); }
.d-trial-pill.expired { background: rgba(192,57,43,.12); color: #e57368; border: 0.5px solid rgba(192,57,43,.25); }

.d-tabs { background: var(--white); border-bottom: 1px solid var(--border); position: sticky; top: 64px; z-index: 50; }
.d-tabs-inner { max-width: 1200px; margin: 0 auto; padding: 0 40px; display: flex; overflow-x: auto; }
.d-tab-btn { font-family: var(--font-body); font-size: 14px; font-weight: 500; color: var(--text-muted); background: none; border: none; border-bottom: 2px solid transparent; padding: 15px 20px; cursor: pointer; transition: all .2s; white-space: nowrap; flex-shrink: 0; }
.d-tab-btn:hover { color: var(--text); }
.d-tab-btn.active { color: var(--navy-800); border-bottom-color: var(--gold-500); font-weight: 600; }

.d-content { max-width: 1200px; margin: 0 auto; padding: 36px 40px 60px; }
.d-pane { display: none; }
.d-pane.active { display: block; animation: fadeUp .25s ease; }

.d-scan-prop-row { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 20px; }
.d-prop-chip { font-family: var(--font-mono); font-size: 12px; color: var(--text-mid); background: var(--cream-100); border: 0.5px solid var(--border); border-radius: 20px; padding: 5px 12px; }
.d-scan-meter { display: flex; align-items: center; gap: 14px; margin-bottom: 28px; }
.d-scan-bar-bg { flex: 1; height: 5px; background: var(--cream-200); border-radius: 3px; max-width: 160px; }
.d-scan-bar-fill { height: 100%; background: var(--gold-500); border-radius: 3px; transition: width .4s; }
.d-scan-meter-text { font-family: var(--font-mono); font-size: 12px; color: var(--text-muted); }
.d-run-btn { display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-body); font-size: 15px; font-weight: 600; background: var(--navy-900); color: var(--white); border: none; border-radius: 8px; padding: 14px 28px; cursor: pointer; transition: background .2s; }
.d-run-btn:hover:not(:disabled) { background: var(--navy-700); }
.d-run-btn:disabled { opacity: .55; cursor: not-allowed; }
.d-scan-note { font-size: 13px; color: var(--text-muted); margin-top: 14px; font-family: var(--font-mono); }
.d-scan-ok { background: rgba(42,122,80,.07); border: 1px solid rgba(42,122,80,.2); border-radius: 8px; padding: 14px 18px; margin-top: 16px; font-size: 14px; color: #2a7a50; font-weight: 500; }

.d-scan-date-header { font-family: var(--font-mono); font-size: 11px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--text-muted); padding-bottom: 12px; margin-bottom: 16px; border-bottom: 1px solid var(--border); }
.d-ai-disclaimer { font-size: 11px; color: var(--text-muted); margin-bottom: 20px; line-height: 1.5; }

.d-card { background: var(--white); border: 1px solid var(--border); border-radius: 12px; padding: 22px 26px; margin-bottom: 12px; transition: opacity .2s; }
.d-card-fixed { opacity: 0.55; }
.d-card-fixed .d-finding-title { text-decoration: line-through; color: var(--text-muted); }
.d-card-gated { opacity: 0.35; pointer-events: none; }

.d-finding-meta { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.d-finding-number { font-family: var(--font-mono); font-size: 11px; font-weight: 700; color: var(--text-muted); }
.d-priority-badge { font-family: var(--font-mono); font-size: 10px; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; padding: 2px 7px; border-radius: 4px; }
.d-priority-badge.high   { background: rgba(220,38,38,.1);  color: #dc2626; }
.d-priority-badge.medium { background: rgba(255,149,0,.1);  color: #c0600a; }
.d-priority-badge.low    { background: rgba(99,102,241,.1); color: #5856d6; }
.d-user-status { font-family: var(--font-mono); font-size: 10px; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; padding: 2px 7px; border-radius: 4px; margin-left: auto; }
.d-user-status.open  { background: rgba(42,122,80,.08);   color: #2a7a50; }
.d-user-status.fixed { background: rgba(99,102,241,.1);   color: #5856d6; }

.d-theme-tag { font-family: var(--font-mono); font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; padding: 3px 8px; border-radius: 4px; margin-bottom: 10px; display: inline-block; background: rgba(0,0,0,.06); color: var(--text-mid); }
.d-finding-title { font-size: 16px; font-weight: 600; color: var(--text); margin-bottom: 6px; }
.d-finding-body { font-size: 14px; color: var(--text-muted); line-height: 1.65; margin-bottom: 14px; }
.d-finding-quote { font-size: 14px; font-style: italic; color: var(--text); line-height: 1.65; margin-bottom: 10px; }
.d-finding-citation { font-size: 11px; color: var(--text-muted); margin-bottom: 8px; }
.d-citation-link { color: #6366f1; text-decoration: none; }
.d-citation-link:hover { text-decoration: underline; }
.d-finding-freq { font-size: 12px; color: var(--text-muted); margin-bottom: 14px; }
.d-finding-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.d-blurred-text { color: transparent; background: rgba(0,0,0,.08); border-radius: 4px; user-select: none; margin-bottom: 8px; }

.d-gated-section { border: 1px dashed var(--border); border-radius: 12px; padding: 24px; margin-top: 8px; }
.d-gated-header { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 16px; }
.d-gated-lock { font-size: 22px; flex-shrink: 0; margin-top: 2px; }
.d-gated-title { font-size: 15px; font-weight: 600; color: var(--text); margin-bottom: 4px; }
.d-gated-desc { font-size: 13px; color: var(--text-muted); line-height: 1.55; }
.d-btn-upgrade { display: block; width: 100%; text-align: center; background: var(--navy-900); color: var(--white); font-size: 14px; font-weight: 500; padding: 12px; border-radius: 8px; text-decoration: none; margin-top: 16px; transition: background .2s; }
.d-btn-upgrade:hover { background: var(--navy-700); }

.d-btn-sm { font-family: var(--font-body); font-size: 13px; font-weight: 500; background: none; border: 1px solid var(--border); border-radius: 6px; padding: 7px 14px; color: var(--text-mid); cursor: pointer; transition: all .2s; }
.d-btn-sm:hover { border-color: var(--navy-800); color: var(--navy-800); }
.d-btn-sm:disabled { opacity: 0.5; cursor: default; }
.d-btn-sm.accent { background: var(--navy-900); color: var(--white); border-color: var(--navy-900); }
.d-btn-sm.accent:hover { background: var(--navy-700); }

/* ── Voice Modal ──────────────────────────────────────────── */
.d-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 20px; }
.d-modal { background: var(--white); border-radius: 16px; padding: 36px 32px; max-width: 560px; width: 100%; max-height: 90vh; overflow-y: auto; position: relative; box-shadow: 0 24px 64px rgba(0,0,0,.25); }
.d-modal-close { position: absolute; top: 16px; right: 18px; background: none; border: none; font-size: 22px; color: var(--text-muted); cursor: pointer; line-height: 1; padding: 4px 8px; }
.d-modal-close:hover { color: var(--text); }
.d-modal-finding { background: var(--surface); border-radius: 8px; padding: 12px 16px; margin-bottom: 20px; }
.d-modal-finding-label { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted); margin-bottom: 4px; }
.d-modal-finding-text { font-size: 13px; color: var(--text-mid); line-height: 1.5; font-style: italic; }
.d-modal-title { font-size: 20px; font-weight: 700; color: var(--text); margin-bottom: 20px; }
.d-modal-paths { display: flex; flex-direction: column; gap: 12px; }
.d-path-btn { display: flex; align-items: center; gap: 16px; background: var(--white); border: 1.5px solid var(--border); border-radius: 10px; padding: 18px 20px; cursor: pointer; text-align: left; transition: border-color .2s, background .2s; width: 100%; }
.d-path-btn:hover { border-color: var(--navy-800); background: var(--surface); }
.d-path-icon { font-size: 20px; flex-shrink: 0; width: 28px; text-align: center; }
.d-path-label { font-size: 15px; font-weight: 600; color: var(--text); margin-bottom: 2px; }
.d-path-desc { font-size: 13px; color: var(--text-muted); }
.d-modal-textarea { width: 100%; min-height: 120px; resize: vertical; margin-top: 8px; }
.d-modal-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }

.d-history-item { display: flex; align-items: center; justify-content: space-between; gap: 16px; background: var(--white); border: 1px solid var(--border); border-radius: 10px; padding: 16px 20px; margin-bottom: 10px; flex-wrap: wrap; }
.d-history-hotel { font-size: 15px; font-weight: 600; color: var(--text); }
.d-history-date { font-family: var(--font-mono); font-size: 12px; color: var(--text-muted); margin-top: 2px; }
.d-status-pill { font-family: var(--font-mono); font-size: 10px; font-weight: 700; padding: 4px 8px; border-radius: 4px; text-transform: uppercase; }
.d-status-pill.sent { background: rgba(42,122,80,.1); color: #2a7a50; }
.d-status-pill.confirmed { background: rgba(99,102,241,.1); color: #5856d6; }
.d-status-pill.pending { background: rgba(255,149,0,.1); color: #c0600a; }
.d-status-pill.running { background: rgba(99,102,241,.1); color: #5856d6; }

.d-voice-public-bar { display: flex; align-items: center; gap: 12px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 10px; padding: 11px 16px; margin-bottom: 20px; }
.d-voice-public-label { font-size: 12px; font-weight: 600; color: #166534; white-space: nowrap; }
.d-voice-public-url { font-size: 12px; color: #16a34a; text-decoration: none; font-family: var(--font-mono); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.d-voice-public-url:hover { text-decoration: underline; }
.d-compose { background: var(--white); border: 1px solid var(--border); border-radius: 12px; padding: 22px 26px; margin-bottom: 28px; }
.d-compose-title { font-size: 15px; font-weight: 600; color: var(--text); margin-bottom: 4px; }
.d-compose-desc { font-size: 13px; color: var(--text-muted); margin-bottom: 14px; }
.d-compose-hint { font-size: 12px; color: var(--gold-600); background: var(--gold-bg); border: 0.5px solid rgba(196,144,58,.25); border-radius: 6px; padding: 8px 12px; margin-bottom: 10px; font-family: var(--font-mono); }
.d-textarea { width: 100%; font-family: var(--font-body); font-size: 15px; color: var(--text); background: var(--cream-50); border: 1px solid var(--border); border-radius: 8px; padding: 14px 16px; outline: none; resize: vertical; min-height: 96px; line-height: 1.6; transition: all .2s; }
.d-textarea:focus { border-color: var(--gold-500); box-shadow: 0 0 0 3px rgba(196,144,58,.1); background: var(--white); }
.d-textarea::placeholder { color: var(--text-muted); }
.d-compose-actions { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.d-btn-publish { font-family: var(--font-body); font-size: 14px; font-weight: 600; background: var(--navy-900); color: var(--white); border: none; border-radius: 7px; padding: 10px 20px; cursor: pointer; transition: background .2s; }
.d-btn-publish:hover { background: var(--navy-700); }
.d-btn-publish:disabled { opacity: .6; cursor: not-allowed; }
.d-btn-draft { font-family: var(--font-body); font-size: 14px; font-weight: 500; background: none; color: var(--text-muted); border: 1px solid var(--border); border-radius: 7px; padding: 10px 20px; cursor: pointer; transition: all .2s; }
.d-btn-draft:hover { color: var(--text); border-color: var(--text-mid); }
.d-btn-draft:disabled { opacity: .6; cursor: not-allowed; }
.d-section-label { font-size: 12px; font-weight: 700; color: var(--text-muted); font-family: var(--font-mono); letter-spacing: .8px; text-transform: uppercase; margin: 24px 0 12px; padding-bottom: 10px; border-bottom: 1px solid var(--border); }
.d-voice-entry { background: var(--white); border: 1px solid var(--border); border-radius: 10px; padding: 18px 22px; margin-bottom: 10px; }
.d-voice-entry-meta { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; flex-wrap: wrap; }
.d-voice-date { font-family: var(--font-mono); font-size: 11px; color: var(--text-muted); }
.d-voice-status { font-family: var(--font-mono); font-size: 10px; font-weight: 700; text-transform: uppercase; padding: 3px 8px; border-radius: 4px; }
.d-voice-status.draft { background: var(--cream-100); color: var(--text-muted); }
.d-voice-status.published { background: rgba(42,122,80,.1); color: #2a7a50; }
.d-voice-text { font-size: 14px; color: var(--text-mid); line-height: 1.65; margin-bottom: 12px; }
.d-voice-entry-actions { display: flex; gap: 8px; }

.d-empty { text-align: center; padding: 60px 24px; }
.d-empty-icon { font-size: 28px; color: var(--cream-300); margin-bottom: 14px; }
.d-empty-title { font-size: 16px; font-weight: 600; color: var(--text); margin-bottom: 6px; }
.d-empty-desc { font-size: 14px; color: var(--text-muted); line-height: 1.6; max-width: 360px; margin: 0 auto; }

/* ==========================================
   RESPONSIVE
   ========================================== */
@media (max-width: 1200px) {
  .mockup-caption { font-size: 25px; }
}
@media (max-width: 960px) {
  .container, .container-narrow { padding: 0 24px; }
  .hero { flex-direction: column; gap: 0; min-height: auto; padding: 64px 24px 48px; }
  .hero-left { flex: none; }
  .hero-right { display: none; }
  .hero-headline { font-size: 46px; }
  .steps-grid { grid-template-columns: 1fr 1fr; }
  .testimonial-grid { grid-template-columns: 1fr 1fr; }
  .case-study-card { grid-template-columns: 1fr; gap: 32px; padding: 32px; }
  .shift-before-after { grid-template-columns: 1fr; }
  .shift-arrow { flex-direction: row; padding: 12px 0; }
  .pricing-grid { grid-template-columns: 1fr; max-width: 460px; }
}
@media (max-width: 640px) {
  .hero-headline { font-size: 38px; }
  .hero-proof { flex-direction: column; gap: 16px; }
  .proof-strip-inner { flex-wrap: wrap; gap: 20px; }
  .proof-stat { border-right: none; flex: 0 0 40%; }
  .steps-grid { grid-template-columns: 1fr; }
  .testimonial-grid { grid-template-columns: 1fr; }
  .section-title { font-size: 32px; }
  .cta-headline { font-size: 34px; }
  .tab-nav { flex-direction: column; }
  .tab-btn { border-right: none; border-bottom: 1px solid var(--border); }
  .nav-right .nav-link { display: none; }
  .d-onboard-card { padding: 32px 22px; }
  .d-onboard-title { font-size: 28px; }
  .d-header-inner { flex-direction: column; align-items: flex-start; }
  .d-content { padding: 28px 20px 48px; }
  .d-tab-btn { padding: 13px 14px; font-size: 13px; }
  .auth-card { padding: 32px 24px; }
}