/* ============================================================
   SECURA SENSE — AI Security Platform
   Design system: tactical olive-drab on near-black.
   Display: Rajdhani (uppercase) · Body: Inter · Data: JetBrains Mono
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@400;500;600;700&family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap');

:root {
  --olive:        #E6BC00;
  --olive-bright: #FFD400;
  --olive-light:  #FFE04D;
  --olive-dim:    #4A3D08;
  --olive-glow:   rgba(230,188,0,0.25);

  --bg:   #050505;
  --bg-1: #0d0d0d;
  --bg-2: #141414;
  --bg-3: #1c1c1c;

  --border:        rgba(230,188,0,0.20);
  --border-bright: rgba(230,188,0,0.50);
  --border-soft:   rgba(255,255,255,0.07);

  --text:       #f0f0f0;
  --text-dim:   #a0a0a0;
  --text-muted: #6a6a6a;

  --radius:    6px;
  --radius-lg: 12px;
  --shadow:        0 4px 24px rgba(0,0,0,0.6);
  --shadow-green:  0 0 30px rgba(230,188,0,0.15);
  --transition: all 0.25s cubic-bezier(0.4,0,0.2,1);

  --font-display: 'Rajdhani', sans-serif;
  --font-body:    'Inter', sans-serif;
  --font-mono:    'JetBrains Mono', monospace;
  --nav-h: 58px;

  --maxw: 1240px;
}

/* ---- Reset ---- */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body { font-family:var(--font-body); font-size:16px; line-height:1.6; color:var(--text); background:var(--bg); overflow-x:hidden; }
img { max-width:100%; height:auto; display:block; }
a { color:inherit; text-decoration:none; }
button { font-family:inherit; }
.container { width:100%; max-width:var(--maxw); margin:0 auto; padding:0 28px; }
.text-left { text-align:left !important; }

/* ============================================================
   NAVBAR
   ============================================================ */
.navbar {
  background: rgba(5,5,5,0.94);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  position: fixed; width:100%; top:0; z-index:900;
  border-bottom: 1px solid var(--border);
  transition: border-color 0.25s, box-shadow 0.25s;
}
.navbar.scrolled { border-bottom-color:var(--border-bright); box-shadow:0 4px 30px rgba(0,0,0,0.8); }
.nav-container {
  max-width: var(--maxw); margin:0 auto; padding:0 24px;
  display:flex; justify-content:space-between; align-items:center; height:var(--nav-h);
}
.logo-container { display:flex; align-items:center; gap:9px; flex-shrink:0; min-width:0; }
.site-logo { width:34px; height:34px; object-fit:contain; flex-shrink:0; display:block; background:#f6f4ee; border-radius:9px; padding:2px; }
.logo-text {
  font-family:var(--font-display); font-size:1.12rem; font-weight:700;
  color:var(--text); letter-spacing:0.05em; text-transform:uppercase; white-space:nowrap;
}
.logo-text b { color:var(--olive-bright); font-weight:700; }

.nav-right { display:flex; align-items:center; gap:14px; }
.nav-toggle { display:none; flex-direction:column; justify-content:center; gap:5px; width:38px; height:38px; cursor:pointer; background:none; border:none; padding:4px; flex-shrink:0; }
.nav-toggle span { display:block; width:23px; height:2px; background:var(--text); border-radius:2px; transition:var(--transition); }
.nav-toggle.active span:nth-child(1){ transform:rotate(45deg) translate(5px,5px); }
.nav-toggle.active span:nth-child(2){ opacity:0; }
.nav-toggle.active span:nth-child(3){ transform:rotate(-45deg) translate(5px,-5px); }

.nav-menu { display:flex; gap:1.9rem; align-items:center; }
.nav-link {
  font-family:var(--font-display); font-size:0.92rem; font-weight:600;
  letter-spacing:0.05em; text-transform:uppercase;
  color:var(--text-dim); transition:color 0.2s; position:relative;
  background:none; border:none; cursor:pointer; padding:0; display:inline-flex; align-items:center; gap:5px;
}
.nav-link::after { content:''; position:absolute; bottom:-6px; left:0; width:0; height:2px; background:var(--olive-bright); transition:width 0.25s; }
.nav-link:hover, .nav-link.active { color:var(--text); }
.nav-link:hover::after, .nav-link.active::after { width:100%; }
.nav-link .caret { font-size:0.6rem; transition:transform 0.2s; opacity:0.7; }

/* Dropdown */
.nav-item { position:relative; }
.nav-dropdown {
  position:absolute; top:calc(100% + 16px); left:50%; transform:translateX(-50%) translateY(8px);
  min-width:230px; background:var(--bg-2); border:1px solid var(--border-bright);
  border-radius:var(--radius-lg); padding:8px; box-shadow:0 20px 50px rgba(0,0,0,0.7);
  opacity:0; visibility:hidden; transition:opacity 0.2s, transform 0.2s, visibility 0.2s; z-index:950;
}
.nav-item:hover .nav-dropdown { opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.nav-item:hover .nav-link .caret { transform:rotate(180deg); }
.nav-dropdown::before { content:''; position:absolute; top:-16px; left:0; right:0; height:16px; } /* hover bridge */
.nav-dropdown a {
  display:block; padding:8px 12px; border-radius:var(--radius);
  font-family:var(--font-body); font-size:0.82rem; font-weight:500; color:var(--text-dim);
  letter-spacing:0; text-transform:none; transition:var(--transition);
}
.nav-dropdown a small { display:block; font-size:0.68rem; color:var(--text-muted); margin-top:2px; }
.nav-dropdown a:hover { background:var(--bg-3); color:var(--text); }
.nav-dropdown a:hover small { color:var(--olive-light); }

.login-btn {
  font-family:var(--font-display); font-size:0.76rem; font-weight:600; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--olive-light); background:transparent; padding:0.38rem 0.95rem;
  border:1px solid var(--border-bright); border-radius:var(--radius); transition:var(--transition); white-space:nowrap;
}
.login-btn:hover { background:var(--olive); color:#fff; border-color:var(--olive-bright); }

/* Flash */
.flash-messages { display:none; }
.flash-messages.flash-toast { display:block; position:fixed; top:calc(var(--nav-h) + 14px); right:16px; left:16px; z-index:1200; max-width:460px; margin:0 0 0 auto; box-shadow:0 12px 40px rgba(0,0,0,0.5); }
.flash-messages.flash-toast .flash { background:var(--bg-2); }
.flash-messages.flash-toast .flash.success { background:rgba(230,188,0,0.18); }
.flash-messages.flash-toast .flash.error { background:rgba(139,0,0,0.18); }
.flash-messages.flash-toast .flash.warning { background:rgba(139,139,0,0.18); }
.flash { padding:0.875rem 1rem; font-size:0.875rem; border-left:3px solid; border-radius:var(--radius); margin-bottom:0.75rem; }
.flash.success { background:rgba(230,188,0,0.12); border-color:var(--olive-bright); color:#E8D060; }
.flash.error   { background:rgba(139,0,0,0.12);   border-color:#c0392b; color:#e74c3c; }
.flash.warning { background:rgba(139,139,0,0.12); border-color:#c0a000; color:#f1c40f; }

/* ============================================================
   BUTTONS
   ============================================================ */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:0.78rem 1.8rem; border-radius:var(--radius); border:none; cursor:pointer;
  font-family:var(--font-display); font-size:0.98rem; font-weight:600; letter-spacing:0.06em; text-transform:uppercase;
  text-decoration:none; transition:var(--transition); white-space:nowrap;
}
.btn-primary { background:var(--olive); color:#fff; border:1px solid var(--olive-bright); }
.btn-primary:hover { background:var(--olive-bright); box-shadow:0 0 30px var(--olive-glow),0 4px 15px rgba(0,0,0,0.4); transform:translateY(-2px); }
.btn-ghost { background:transparent; color:var(--text-dim); border:1px solid rgba(255,255,255,0.16); }
.btn-ghost:hover { background:rgba(255,255,255,0.05); color:var(--text); border-color:rgba(255,255,255,0.32); transform:translateY(-2px); }
.btn-secondary { background:transparent; color:var(--text-dim); border:1px solid rgba(255,255,255,0.12); }
.btn-secondary:hover { background:rgba(255,255,255,0.05); color:var(--text); }
.btn-large { padding:1.05rem 2.4rem; font-size:1.08rem; }
.btn-full  { width:100%; }
.btn:disabled { opacity:0.6; cursor:not-allowed; pointer-events:none; }

/* ============================================================
   SECTION HEADERS  +  shared section rhythm
   ============================================================ */
section { position:relative; }
.section-header { text-align:center; margin-bottom:3.25rem; max-width:760px; margin-left:auto; margin-right:auto; }
.section-header.left { text-align:left; margin-left:0; }
.section-label {
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--font-mono); font-size:0.7rem; font-weight:500; letter-spacing:0.22em; text-transform:uppercase;
  color:var(--olive-light); margin-bottom:0.9rem;
}
.section-label::before { content:''; width:22px; height:1px; background:var(--olive); }
.section-header.center .section-label::before { display:none; }
.section-title {
  font-family:var(--font-display); font-size:clamp(1.9rem,4vw,2.9rem); font-weight:700;
  letter-spacing:0.03em; text-transform:uppercase; color:var(--text); line-height:1.1; margin-bottom:1.1rem;
}
.section-title em { font-style:normal; color:var(--olive-bright); }
.section-desc { font-size:1.02rem; font-weight:400; color:var(--text-dim); line-height:1.75; }

/* ============================================================
   HERO (home)
   ============================================================ */
.hero {
  position:relative; min-height:100vh; display:flex; align-items:center; justify-content:center;
  padding:calc(var(--nav-h) + 60px) 24px 80px; background:var(--bg); overflow:hidden;
}
.hero::before {
  content:''; position:absolute; inset:0;
  background-image:linear-gradient(rgba(230,188,0,0.045) 1px,transparent 1px),linear-gradient(90deg,rgba(230,188,0,0.045) 1px,transparent 1px);
  background-size:62px 62px;
  mask-image:radial-gradient(ellipse 80% 62% at 50% 45%,black 40%,transparent 100%);
  -webkit-mask-image:radial-gradient(ellipse 80% 62% at 50% 45%,black 40%,transparent 100%);
  pointer-events:none;
}
.hero::after {
  content:''; position:absolute; width:620px; height:620px; border-radius:50%;
  background:radial-gradient(circle,rgba(230,188,0,0.12) 0%,transparent 70%);
  top:46%; left:50%; transform:translate(-50%,-50%); pointer-events:none;
}
.hero-content { position:relative; z-index:1; text-align:center; max-width:820px; }
.hero-eyebrow {
  display:inline-flex; align-items:center; gap:9px;
  font-family:var(--font-mono); font-size:0.72rem; font-weight:500; letter-spacing:0.16em; text-transform:uppercase;
  color:var(--olive-light); border:1px solid var(--border-bright); padding:7px 16px; border-radius:100px;
  margin-bottom:1.75rem; background:rgba(230,188,0,0.08); animation:fadeInDown 0.6s ease forwards;
}
.pulse-dot { width:6px; height:6px; border-radius:50%; background:var(--olive-bright); animation:pulse 2s infinite; flex-shrink:0; }
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:0.45;transform:scale(0.8)} }
@keyframes fadeInUp   { from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeInDown { from{opacity:0;transform:translateY(-10px)} to{opacity:1;transform:translateY(0)} }

.hero-content h1 {
  font-family:var(--font-display); font-size:clamp(2.6rem,6.4vw,5rem); font-weight:700; line-height:1.05;
  letter-spacing:0.01em; text-transform:uppercase; color:var(--text); margin-bottom:1.6rem;
  animation:fadeInUp 0.6s ease 0.1s both;
}
.hero-content h1 em { font-style:normal; color:var(--olive-bright); }
.hero-description {
  font-size:clamp(1rem,2vw,1.18rem); color:var(--text-dim); max-width:600px; margin:0 auto 2.6rem;
  line-height:1.8; font-weight:300; animation:fadeInUp 0.6s ease 0.2s both;
}
.hero-buttons { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; animation:fadeInUp 0.6s ease 0.3s both; }
.hero-stats { display:flex; gap:3.2rem; justify-content:center; margin-top:4.2rem; padding-top:3rem; border-top:1px solid var(--border); animation:fadeInUp 0.6s ease 0.4s both; flex-wrap:wrap; }
.stat { text-align:center; }
.stat-number { font-family:var(--font-display); font-size:2.1rem; font-weight:700; color:var(--olive-bright); line-height:1; }
.stat-label  { font-family:var(--font-mono); font-size:0.66rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.12em; margin-top:6px; }

/* ============================================================
   AI DEMO
   ============================================================ */
.ai-demo-section { padding:100px 0; background:var(--bg-1); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.ai-demo-layout { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:start; }
.ai-demo-desc { font-size:0.98rem; color:var(--text-dim); line-height:1.78; margin:1rem 0 2rem; }
.ai-capability-list { display:flex; flex-direction:column; gap:1rem; }
.ai-capability { display:flex; gap:1rem; align-items:flex-start; padding:1.1rem 1.25rem; background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius); transition:var(--transition); }
.ai-capability:hover { border-color:var(--border-bright); transform:translateX(4px); }
.ai-cap-icon { font-size:1.4rem; flex-shrink:0; margin-top:2px; }
.ai-capability strong { display:block; font-family:var(--font-display); font-size:1.02rem; font-weight:600; text-transform:uppercase; letter-spacing:0.04em; color:var(--text); margin-bottom:0.3rem; }
.ai-capability p { font-size:0.85rem; color:var(--text-dim); line-height:1.6; margin:0; }

.ai-chat-demo { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; box-shadow:0 20px 60px rgba(0,0,0,0.5); position:sticky; top:90px; }
.chat-header { display:flex; align-items:center; gap:10px; padding:0.95rem 1.3rem; background:var(--bg-3); border-bottom:1px solid var(--border); font-family:var(--font-display); font-size:0.95rem; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; }
.chat-header-dot { width:8px; height:8px; border-radius:50%; background:var(--olive-bright); box-shadow:0 0 8px var(--olive-bright); animation:pulse 2s infinite; }
.chat-status { margin-left:auto; font-family:var(--font-mono); font-size:0.7rem; color:var(--olive-light); letter-spacing:0.04em; }
.chat-messages { padding:1.3rem; display:flex; flex-direction:column; gap:1rem; max-height:420px; overflow-y:auto; scrollbar-width:thin; scrollbar-color:var(--olive-dim) transparent; }
.chat-msg { display:flex; flex-direction:column; gap:4px; }
.chat-bubble { padding:0.78rem 1rem; border-radius:var(--radius); font-size:0.875rem; line-height:1.6; }
.ai-msg .chat-bubble { background:var(--bg-3); border:1px solid var(--border); color:var(--text-dim); border-radius:4px 12px 12px 12px; max-width:92%; }
.ai-msg .chat-bubble strong { color:var(--text); font-weight:600; }
.user-msg { align-items:flex-end; }
.user-msg .chat-bubble { background:var(--olive); border:1px solid var(--olive-bright); color:#fff; border-radius:12px 12px 4px 12px; max-width:80%; }
.highlight-msg .chat-bubble { background:rgba(230,188,0,0.15); border-color:var(--olive-bright); color:var(--text); }
.chat-time { font-family:var(--font-mono); font-size:0.66rem; color:var(--text-muted); padding:0 4px; }
.user-msg .chat-time { text-align:right; }
.chat-input-bar { display:flex; align-items:center; justify-content:space-between; padding:0.95rem 1.3rem; background:var(--bg-3); border-top:1px solid var(--border); font-size:0.85rem; color:var(--text-muted); }
.chat-send-btn { width:30px; height:30px; border-radius:50%; background:var(--olive); color:#fff; display:flex; align-items:center; justify-content:center; font-size:0.85rem; flex-shrink:0; }

/* ============================================================
   FEATURES
   ============================================================ */
.features { padding:100px 0; background:var(--bg); border-bottom:1px solid var(--border); }
.features-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5px; background:var(--border); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; }
.feature-card { background:var(--bg-1); padding:2.5rem; transition:var(--transition); position:relative; overflow:hidden; }
.feature-card::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:linear-gradient(90deg,transparent,var(--olive),transparent); transform:scaleX(0); transition:var(--transition); }
.feature-card:hover { background:var(--bg-2); }
.feature-card:hover::before { transform:scaleX(1); }
.feature-icon { font-size:2rem; margin-bottom:1rem; display:block; }
.feature-card h3 { font-family:var(--font-display); font-size:1.08rem; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; color:var(--text); margin-bottom:0.75rem; }
.feature-card p { font-size:0.875rem; color:var(--text-dim); line-height:1.65; }

/* ============================================================
   HOW IT WORKS
   ============================================================ */
.how-it-works-section { padding:100px 0; background:var(--bg-1); border-bottom:1px solid var(--border); }
.how-steps { display:flex; align-items:stretch; gap:0; margin-top:1rem; }
.how-step { flex:1; background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-lg); padding:2rem 1.5rem; text-align:center; transition:var(--transition); }
.how-step:hover { border-color:var(--border-bright); transform:translateY(-4px); box-shadow:var(--shadow-green); }
.how-step-number { font-family:var(--font-mono); font-size:0.72rem; font-weight:700; letter-spacing:0.1em; color:var(--olive-light); margin-bottom:0.75rem; }
.how-step-icon { font-size:2rem; margin-bottom:0.75rem; display:block; }
.how-step h3 { font-family:var(--font-display); font-size:1.05rem; font-weight:600; text-transform:uppercase; letter-spacing:0.04em; color:var(--text); margin-bottom:0.75rem; }
.how-step p { font-size:0.85rem; color:var(--text-dim); line-height:1.65; margin:0; }
.how-step-arrow { display:flex; align-items:center; justify-content:center; padding:0 0.5rem; color:var(--olive-bright); font-size:1.25rem; flex-shrink:0; }

/* ============================================================
   USE CASES (logos strip / mini grid on home)
   ============================================================ */
.usecase-teaser { padding:100px 0; background:var(--bg); border-bottom:1px solid var(--border); }
.usecase-mini-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-bottom:2.5rem; }
.usecase-mini { display:flex; align-items:center; gap:12px; background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius); padding:1rem 1.1rem; transition:var(--transition); }
.usecase-mini:hover { border-color:var(--border-bright); background:var(--bg-3); }
.usecase-mini .uc-ic { font-size:1.3rem; flex-shrink:0; }
.usecase-mini span { font-family:var(--font-display); font-size:0.92rem; font-weight:600; letter-spacing:0.02em; color:var(--text); text-transform:uppercase; }
.usecase-teaser .center-cta { text-align:center; }

/* ============================================================
   USE CASES PAGE — 17 cards + filter
   ============================================================ */
.usecase-section { padding:70px 0 90px; background:var(--bg); }
.uc-filter { display:flex; flex-wrap:wrap; gap:0.6rem; justify-content:center; margin-bottom:3rem; }
.uc-chip {
  font-family:var(--font-mono); font-size:0.72rem; font-weight:500; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--text-dim); background:var(--bg-2); border:1px solid var(--border); padding:0.5rem 1.05rem; border-radius:100px; cursor:pointer; transition:var(--transition);
}
.uc-chip:hover { border-color:var(--border-bright); color:var(--text); }
.uc-chip.active { background:var(--olive); border-color:var(--olive-bright); color:#fff; }

.usecase-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.uc-card { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.9rem; transition:var(--transition); position:relative; overflow:hidden; }
.uc-card::after { content:''; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--olive); transform:scaleY(0); transform-origin:top; transition:transform 0.3s; }
.uc-card:hover { border-color:var(--border-bright); transform:translateY(-4px); box-shadow:var(--shadow-green); }
.uc-card:hover::after { transform:scaleY(1); }
.uc-card .uc-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:1.1rem; }
.uc-card .uc-icon { font-size:1.9rem; }
.uc-card .uc-tag { font-family:var(--font-mono); font-size:0.62rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--olive-light); border:1px solid var(--border); padding:3px 9px; border-radius:100px; }
.uc-card h3 { font-family:var(--font-display); font-size:1.16rem; font-weight:600; text-transform:uppercase; letter-spacing:0.03em; color:var(--text); margin-bottom:0.6rem; }
.uc-card p { font-size:0.86rem; color:var(--text-dim); line-height:1.65; margin-bottom:1.1rem; }
.uc-card .uc-meta { display:flex; gap:14px; font-family:var(--font-mono); font-size:0.66rem; color:var(--text-muted); letter-spacing:0.04em; text-transform:uppercase; border-top:1px solid var(--border-soft); padding-top:0.9rem; }
.uc-card .uc-meta b { color:var(--olive-light); font-weight:500; }

/* ============================================================
   HARDWARE PAGE
   ============================================================ */
.hardware-section { padding:70px 0 60px; background:var(--bg); }
.device-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.device-card { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; transition:var(--transition); display:flex; flex-direction:column; }
.device-card:hover { border-color:var(--border-bright); transform:translateY(-5px); box-shadow:var(--shadow-green); }
.device-visual { height:190px; display:flex; align-items:center; justify-content:center; background:radial-gradient(circle at 50% 40%,rgba(230,188,0,0.12),var(--bg-3)); border-bottom:1px solid var(--border); position:relative; }
.device-visual .dv-glyph { font-size:4rem; filter:drop-shadow(0 0 18px rgba(230,188,0,0.4)); }
.device-visual .dv-rating { position:absolute; top:12px; right:12px; font-family:var(--font-mono); font-size:0.62rem; letter-spacing:0.08em; color:var(--olive-light); border:1px solid var(--border-bright); background:rgba(5,5,5,0.6); padding:3px 9px; border-radius:100px; }
.device-body { padding:1.8rem; flex:1; display:flex; flex-direction:column; }
.device-body .dv-kind { font-family:var(--font-mono); font-size:0.68rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--olive-light); margin-bottom:0.5rem; }
.device-body h3 { font-family:var(--font-display); font-size:1.5rem; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; color:var(--text); margin-bottom:0.7rem; }
.device-body > p { font-size:0.88rem; color:var(--text-dim); line-height:1.65; margin-bottom:1.3rem; }
.device-body ul { list-style:none; margin-bottom:1.5rem; }
.device-body ul li { font-size:0.84rem; color:var(--text-dim); padding:0.4rem 0; display:flex; gap:9px; align-items:flex-start; border-bottom:1px solid var(--border-soft); }
.device-body ul li::before { content:'✓'; color:var(--olive-bright); font-weight:700; flex-shrink:0; }
.device-body .dv-foot { margin-top:auto; }

/* Spec comparison table */
.spec-table-section { padding:60px 0 90px; background:var(--bg-1); border-top:1px solid var(--border); }
.spec-table-wrap { overflow-x:auto; border:1px solid var(--border); border-radius:var(--radius-lg); }
table.spec-table { width:100%; border-collapse:collapse; min-width:640px; font-size:0.85rem; }
table.spec-table th, table.spec-table td { padding:0.95rem 1.2rem; text-align:left; border-bottom:1px solid var(--border-soft); }
table.spec-table thead th { font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.05em; font-size:0.85rem; color:var(--text); background:var(--bg-3); }
table.spec-table thead th:first-child { color:var(--text-muted); }
table.spec-table tbody th { font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.04em; text-transform:uppercase; color:var(--text-muted); font-weight:500; }
table.spec-table td { color:var(--text-dim); }
table.spec-table tbody tr:hover { background:var(--bg-2); }
table.spec-table td b { color:var(--olive-light); font-weight:600; }

/* ============================================================
   RESEARCH PAGE
   ============================================================ */
.research-section { padding:70px 0 60px; background:var(--bg); }
.research-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.research-card { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-lg); padding:2rem; transition:var(--transition); }
.research-card:hover { border-color:var(--border-bright); transform:translateY(-4px); }
.research-card .rc-num { font-family:var(--font-mono); font-size:0.7rem; letter-spacing:0.1em; color:var(--olive-light); margin-bottom:0.8rem; }
.research-card h3 { font-family:var(--font-display); font-size:1.2rem; font-weight:600; text-transform:uppercase; letter-spacing:0.03em; color:var(--text); margin-bottom:0.7rem; }
.research-card p { font-size:0.86rem; color:var(--text-dim); line-height:1.7; }
.research-metrics { padding:60px 0; background:var(--bg-1); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.metric-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5px; background:var(--border); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; }
.metric { background:var(--bg-2); padding:2.2rem 1.5rem; text-align:center; }
.metric .m-val { font-family:var(--font-display); font-size:2.6rem; font-weight:700; color:var(--olive-bright); line-height:1; }
.metric .m-label { font-family:var(--font-mono); font-size:0.68rem; text-transform:uppercase; letter-spacing:0.1em; color:var(--text-muted); margin-top:0.6rem; }

/* ============================================================
   PAPERS & CASE STUDIES
   ============================================================ */
.papers-section { padding:70px 0 60px; background:var(--bg); }
.papers-list { display:flex; flex-direction:column; gap:1rem; margin-bottom:4rem; }
.paper-row { display:grid; grid-template-columns:90px 1fr auto; gap:1.5rem; align-items:center; background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.4rem 1.6rem; transition:var(--transition); }
.paper-row:hover { border-color:var(--border-bright); background:var(--bg-3); }
.paper-row .pr-type { font-family:var(--font-mono); font-size:0.64rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--olive-light); border:1px solid var(--border); border-radius:100px; padding:4px 0; text-align:center; }
.paper-row h3 { font-family:var(--font-display); font-size:1.1rem; font-weight:600; text-transform:uppercase; letter-spacing:0.02em; color:var(--text); margin-bottom:0.3rem; }
.paper-row p { font-size:0.82rem; color:var(--text-dim); line-height:1.55; }
.paper-row .pr-meta { font-family:var(--font-mono); font-size:0.68rem; color:var(--text-muted); margin-top:0.4rem; letter-spacing:0.04em; }
.paper-row .pr-link { font-family:var(--font-display); font-size:0.82rem; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; color:var(--olive-light); white-space:nowrap; }
.paper-row:hover .pr-link { color:var(--text); }

.case-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.case-card { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; transition:var(--transition); }
.case-card:hover { border-color:var(--border-bright); transform:translateY(-4px); box-shadow:var(--shadow-green); }
.case-banner { padding:1.5rem; background:linear-gradient(135deg,rgba(230,188,0,0.18),var(--bg-3)); border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; }
.case-banner .cb-ic { font-size:2rem; }
.case-banner .cb-stat { font-family:var(--font-display); font-size:1.7rem; font-weight:700; color:var(--olive-bright); line-height:1; text-align:right; }
.case-banner .cb-stat small { display:block; font-family:var(--font-mono); font-size:0.6rem; color:var(--text-muted); letter-spacing:0.08em; text-transform:uppercase; margin-top:3px; font-weight:400; }
.case-body { padding:1.6rem; }
.case-body .cs-sector { font-family:var(--font-mono); font-size:0.66rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--olive-light); margin-bottom:0.5rem; }
.case-body h3 { font-family:var(--font-display); font-size:1.14rem; font-weight:600; text-transform:uppercase; letter-spacing:0.02em; color:var(--text); margin-bottom:0.6rem; }
.case-body p { font-size:0.85rem; color:var(--text-dim); line-height:1.65; }

/* ============================================================
   DATASETS
   ============================================================ */
.datasets-section { padding:70px 0 90px; background:var(--bg); }
.dataset-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.5rem; }
.dataset-card { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.9rem; transition:var(--transition); }
.dataset-card:hover { border-color:var(--border-bright); transform:translateY(-3px); }
.dataset-card .ds-head { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.dataset-card h3 { font-family:var(--font-display); font-size:1.22rem; font-weight:600; text-transform:uppercase; letter-spacing:0.02em; color:var(--text); }
.dataset-card .ds-license { font-family:var(--font-mono); font-size:0.62rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--olive-light); border:1px solid var(--border); border-radius:100px; padding:4px 10px; white-space:nowrap; }
.dataset-card > p { font-size:0.86rem; color:var(--text-dim); line-height:1.65; margin-bottom:1.3rem; }
.ds-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; margin-bottom:1.4rem; }
.ds-stat { background:var(--bg-3); padding:0.85rem 0.5rem; text-align:center; }
.ds-stat b { display:block; font-family:var(--font-display); font-size:1.1rem; font-weight:700; color:var(--olive-bright); }
.ds-stat span { font-family:var(--font-mono); font-size:0.6rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-muted); }
.ds-foot { display:flex; gap:0.8rem; align-items:center; }
.dataset-note { margin-top:2.5rem; padding:1.5rem 1.8rem; background:var(--bg-1); border:1px solid var(--border); border-left:3px solid var(--olive); border-radius:var(--radius); font-size:0.85rem; color:var(--text-dim); line-height:1.7; }

/* ============================================================
   TEAM
   ============================================================ */
.team-section { padding:70px 0 60px; background:var(--bg); }
.team-values { padding:70px 0; background:var(--bg-1); border-top:1px solid var(--border); }
.values-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.value-card { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius); padding:1.7rem 1.4rem; transition:var(--transition); }
.value-card:hover { border-color:var(--border-bright); }
.value-card .vc-ic { font-size:1.6rem; margin-bottom:0.8rem; }
.value-card h3 { font-family:var(--font-display); font-size:1.02rem; font-weight:600; text-transform:uppercase; letter-spacing:0.03em; color:var(--text); margin-bottom:0.5rem; }
.value-card p { font-size:0.82rem; color:var(--text-dim); line-height:1.6; }
.values-section { padding:70px 0; background:var(--bg-1); border-top:1px solid var(--border); }
.placeholder-note { text-align:center; margin-top:2rem; font-family:var(--font-mono); font-size:0.78rem; letter-spacing:0.04em; color:var(--text-muted); }
.placeholder-note a { color:var(--olive-light); }
.placeholder-note a:hover { color:var(--text); }

/* ============================================================
   CONTACT
   ============================================================ */
.contact-section { padding:70px 0 90px; background:var(--bg); }
.contact-layout { display:grid; grid-template-columns:1fr 1.2fr; gap:3.5rem; align-items:start; }
.contact-info h2 { font-family:var(--font-display); font-size:1.7rem; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; margin-bottom:1rem; }
.contact-info > p { font-size:0.95rem; color:var(--text-dim); line-height:1.75; margin-bottom:2rem; }
.contact-channels { display:flex; flex-direction:column; gap:1rem; }
.contact-channel { display:flex; gap:1rem; align-items:flex-start; background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius); padding:1.1rem 1.25rem; transition:var(--transition); }
.contact-channel:hover { border-color:var(--border-bright); }
.contact-channel .cc-ic { font-size:1.4rem; flex-shrink:0; }
.contact-channel .cc-label { font-family:var(--font-mono); font-size:0.66rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-muted); margin-bottom:3px; }
.contact-channel .cc-val { font-size:0.92rem; color:var(--text); }
.contact-channel .cc-val a { color:var(--olive-light); }
.contact-channel .cc-val a:hover { color:var(--text); }
.contact-form-wrap { background:var(--bg-2); border:1px solid var(--border-bright); border-radius:var(--radius-lg); padding:2.5rem; }
.contact-form-wrap h2 { font-family:var(--font-display); font-size:1.5rem; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; margin-bottom:1.6rem; }

/* ============================================================
   FORMS  (shared: modal, contact, careers)
   ============================================================ */
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-group { margin-bottom:1.1rem; }
.form-group label { display:block; margin-bottom:0.4rem; font-family:var(--font-mono); font-size:0.68rem; font-weight:500; color:var(--text-dim); letter-spacing:0.06em; text-transform:uppercase; }
.form-group input, .form-group textarea, .form-group select {
  width:100%; padding:0.7rem 0.95rem; background:var(--bg-3); border:1px solid rgba(255,255,255,0.08); border-radius:var(--radius);
  font-family:var(--font-body); font-size:0.9rem; color:var(--text); transition:var(--transition); -webkit-appearance:none; appearance:none;
}
.form-group select {
  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 fill='%236a6a6a' d='M6 8L0 0h12z'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 12px center; background-color:var(--bg-3); padding-right:36px; cursor:pointer;
}
.form-group input:focus, .form-group textarea:focus, .form-group select:focus { outline:none; border-color:var(--border-bright); box-shadow:0 0 0 3px rgba(230,188,0,0.12); background:var(--bg-1); }
.form-group textarea { height:120px; resize:vertical; }
.form-group select option { background:var(--bg-2); color:var(--text); }
.form-group input::placeholder, .form-group textarea::placeholder { color:var(--text-muted); }

.terms-row { display:flex; align-items:flex-start; gap:12px; padding:0.875rem 1rem; background:var(--bg-3); border:1px solid rgba(255,255,255,0.08); border-radius:var(--radius); transition:border-color 0.2s; cursor:pointer; }
.terms-row:hover { border-color:var(--border-bright); }
.terms-row input[type="checkbox"] { -webkit-appearance:checkbox; appearance:checkbox; width:16px; height:16px; min-width:16px; margin:0; margin-top:2px; flex-shrink:0; cursor:pointer; accent-color:var(--olive-bright); padding:0; background:none; border:none; box-shadow:none; }
.terms-row + label, .terms-row label { all:unset; font-family:var(--font-body); font-size:0.85rem; font-weight:400; color:var(--text-dim); line-height:1.55; cursor:pointer; display:inline; pointer-events:auto; }
.terms-row label a { color:var(--olive-light); text-decoration:underline; pointer-events:auto; }
.terms-row label a:hover { color:var(--text); }
.form-divider { height:1px; background:var(--border); margin:1.25rem 0; }
#form-messages { margin-bottom:0.75rem; }
#form-messages:empty { display:none; }
.recaptcha-notice { font-size:0.72rem; color:var(--text-muted); text-align:center; margin-top:0.75rem; line-height:1.5; }
.recaptcha-notice a { color:var(--olive-light); text-decoration:underline; }
.grecaptcha-badge { visibility:hidden !important; }
.direct-contact { text-align:center; margin-top:1.25rem; font-size:0.85rem; color:var(--text-muted); }
.direct-contact a { color:var(--olive-light); }
.direct-contact a:hover { color:var(--text); }
.form-actions { display:flex; gap:1rem; margin-top:1.5rem; }
.form-actions small, .form-group small { font-size:0.74rem; color:var(--text-muted); display:block; margin-top:6px; }

/* ============================================================
   MODAL
   ============================================================ */
.modal-overlay { position:fixed; inset:0; z-index:2000; background:rgba(0,0,0,0.78); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); display:flex; align-items:flex-start; justify-content:center; padding:40px 16px; overflow-y:auto; opacity:0; pointer-events:none; transition:opacity 0.3s ease; }
.modal-overlay.open { opacity:1; pointer-events:all; }
.modal-box { background:var(--bg-2); border:1px solid var(--border-bright); border-radius:var(--radius-lg); width:100%; max-width:700px; box-shadow:0 24px 80px rgba(0,0,0,0.8); position:relative; transform:translateY(24px); transition:transform 0.35s cubic-bezier(0.4,0,0.2,1); }
.modal-overlay.open .modal-box { transform:translateY(0); }
.modal-close { position:absolute; top:14px; right:16px; background:var(--bg-3); border:1px solid var(--border); border-radius:50%; width:32px; height:32px; font-size:1.2rem; line-height:1; color:var(--text-dim); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:var(--transition); z-index:10; }
.modal-close:hover { background:var(--bg-1); color:var(--text); border-color:var(--border-bright); }
.modal-header { padding:2rem 2rem 1.25rem; border-bottom:1px solid var(--border); }
.modal-header h2 { font-family:var(--font-display); font-size:1.8rem; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; color:var(--text); margin-bottom:0.35rem; }
.modal-header p { font-size:0.9rem; color:var(--text-dim); }
.modal-body { padding:1.5rem 2rem 2rem; }

/* ============================================================
   PAGE HEADER (inner pages)
   ============================================================ */
.page-header { background:var(--bg); padding:calc(var(--nav-h) + 70px) 24px 64px; text-align:center; border-bottom:1px solid var(--border); position:relative; overflow:hidden; }
.page-header::before { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(230,188,0,0.04) 1px,transparent 1px),linear-gradient(90deg,rgba(230,188,0,0.04) 1px,transparent 1px); background-size:42px 42px; mask-image:radial-gradient(ellipse 90% 85% at 50% 40%,black,transparent); -webkit-mask-image:radial-gradient(ellipse 90% 85% at 50% 40%,black,transparent); pointer-events:none; }
.page-header .ph-eyebrow { display:inline-flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:0.7rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--olive-light); margin-bottom:1rem; position:relative; }
.page-header h1 { font-family:var(--font-display); font-size:clamp(2.1rem,5vw,3.6rem); font-weight:700; text-transform:uppercase; letter-spacing:0.04em; color:var(--text); margin-bottom:0.85rem; position:relative; line-height:1.08; }
.page-header h1 em { font-style:normal; color:var(--olive-bright); }
.page-header p { font-size:1.05rem; color:var(--text-dim); position:relative; max-width:640px; margin:0 auto; line-height:1.7; }

/* ============================================================
   PRIVACY / TERMS / RICH CONTENT
   ============================================================ */
.privacy-content, .terms-content { padding:80px 0; background:var(--bg); }
.content-section { max-width:820px; margin:0 auto; }
.content-section h2 { font-family:var(--font-display); color:var(--olive-bright); margin-bottom:1.5rem; font-size:1.8rem; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; border-bottom:1px solid var(--border); padding-bottom:0.75rem; }
.content-section h3 { font-family:var(--font-display); color:var(--text); margin:2.5rem 0 1rem; font-size:1.1rem; font-weight:600; text-transform:uppercase; letter-spacing:0.04em; }
.content-section p { color:var(--text-dim); line-height:1.8; margin-bottom:1.25rem; font-size:0.95rem; }
.content-section ul { margin:1rem 0 1.5rem 1.5rem; color:var(--text-dim); }
.content-section li { margin-bottom:0.6rem; line-height:1.6; font-size:0.95rem; }
.content-section strong { color:var(--text); font-weight:600; }
.content-section a { color:var(--olive-light); }
.content-section a:hover { color:var(--text); text-decoration:underline; }

/* ============================================================
   CAREERS
   ============================================================ */
.careers { padding:70px 0 60px; background:var(--bg); }
.careers-intro { margin-bottom:3.5rem; }
.careers-intro h2 { font-family:var(--font-display); font-size:1.9rem; font-weight:700; text-transform:uppercase; margin-bottom:1rem; }
.careers-intro > p { color:var(--text-dim); margin-bottom:2rem; max-width:680px; line-height:1.75; }
.benefits-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.benefit-card { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius); padding:1.6rem; transition:var(--transition); }
.benefit-card:hover { border-color:var(--border-bright); transform:translateY(-3px); }
.benefit-card h3 { font-family:var(--font-display); font-size:1.02rem; font-weight:600; margin-bottom:0.5rem; text-transform:uppercase; letter-spacing:0.02em; }
.benefit-card p { font-size:0.84rem; color:var(--text-dim); line-height:1.6; }
.open-positions { padding-top:1rem; }
.open-positions h2 { font-family:var(--font-display); font-size:1.9rem; font-weight:700; text-transform:uppercase; margin-bottom:2rem; }
.position-card { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-lg); padding:2rem; margin-bottom:1.5rem; transition:var(--transition); }
.position-card:hover { border-color:var(--border-bright); }
.position-card h3 { font-family:var(--font-display); font-size:1.4rem; font-weight:700; text-transform:uppercase; margin-bottom:0.5rem; }
.position-card .location, .position-card .department { font-family:var(--font-mono); font-size:0.74rem; color:var(--text-muted); margin-bottom:0.25rem; letter-spacing:0.03em; }
.position-card > p { margin:1rem 0; color:var(--text-dim); font-size:0.9rem; line-height:1.65; }
.position-card h4 { font-family:var(--font-mono); font-size:0.7rem; font-weight:600; text-transform:uppercase; letter-spacing:0.08em; color:var(--olive-light); margin:1.25rem 0 0.75rem; }
.position-card ul { list-style:none; }
.position-card ul li { font-size:0.875rem; color:var(--text-dim); padding:0.3rem 0; display:flex; gap:8px; align-items:flex-start; }
.position-card ul li::before { content:'—'; color:var(--olive); flex-shrink:0; }
.application-form { background:var(--bg-2); border:1px solid var(--border-bright); border-radius:var(--radius-lg); padding:2.5rem; margin:3rem 0; }
.application-form h2 { font-family:var(--font-display); font-size:1.7rem; font-weight:700; text-transform:uppercase; margin-bottom:2rem; }
.culture-section { margin-top:5rem; }
.culture-section h2 { font-family:var(--font-display); font-size:1.9rem; font-weight:700; text-transform:uppercase; margin-bottom:2rem; }
.culture-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.culture-item { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius); padding:1.5rem; }
.culture-item h3 { font-family:var(--font-display); font-size:1rem; font-weight:600; margin-bottom:0.5rem; text-transform:uppercase; letter-spacing:0.02em; }
.culture-item p { font-size:0.82rem; color:var(--text-dim); line-height:1.6; }

/* ============================================================
   TRUST + CTA BANNER (shared)
   ============================================================ */
.trust-section { padding:80px 0; background:var(--bg-2); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.trust-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5px; background:var(--border); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; }
.trust-item { background:var(--bg-2); padding:2rem 1.5rem; text-align:center; transition:var(--transition); }
.trust-item:hover { background:var(--bg-3); }
.trust-icon { font-size:2rem; margin-bottom:0.875rem; }
.trust-item strong { display:block; font-family:var(--font-display); font-size:1rem; font-weight:600; text-transform:uppercase; letter-spacing:0.04em; color:var(--text); margin-bottom:0.6rem; }
.trust-item p { font-size:0.85rem; color:var(--text-dim); line-height:1.65; margin:0; }

.cta-banner { padding:90px 0; background:var(--bg); border-top:1px solid var(--border); }
.cta-banner-inner { display:flex; align-items:center; justify-content:space-between; gap:2rem; background:linear-gradient(135deg,rgba(230,188,0,0.10),var(--bg-2)); border:1px solid var(--border-bright); border-radius:var(--radius-lg); padding:2.8rem 3rem; }
.cta-banner-inner h2 { font-family:var(--font-display); font-size:1.9rem; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; margin-bottom:0.4rem; }
.cta-banner-inner p { font-size:0.97rem; color:var(--text-dim); }
.cta-section { padding:90px 0; background:var(--bg-1); text-align:center; border-top:1px solid var(--border); }
.cta-section h2 { font-family:var(--font-display); font-size:2.1rem; font-weight:700; text-transform:uppercase; margin-bottom:1rem; }
.cta-section p { color:var(--text-dim); margin-bottom:2rem; max-width:560px; margin-left:auto; margin-right:auto; line-height:1.7; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer { background:var(--bg); border-top:1px solid var(--border); padding:3.5rem 0 1.5rem; }
.footer-content { display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr 1.1fr; gap:2.2rem; margin-bottom:2.5rem; }
.footer-logo-container { display:flex; align-items:center; gap:10px; margin-bottom:1rem; }
.footer-logo { width:34px; height:34px; object-fit:contain; background:#f6f4ee; border-radius:9px; padding:2px; }
.footer-logo-container h3 { font-family:var(--font-display); color:var(--text); font-size:1.2rem; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; margin:0; }
.footer-logo-container h3 b { color:var(--olive-bright); }
.footer-section > h3 { font-family:var(--font-mono); font-size:0.7rem; font-weight:500; letter-spacing:0.16em; text-transform:uppercase; color:var(--text-muted); margin-bottom:1.1rem; }
.footer-section p { font-size:0.85rem; color:var(--text-dim); line-height:1.7; }
.footer-section a { display:block; font-size:0.85rem; color:var(--text-dim); margin-bottom:0.55rem; transition:color 0.2s; }
.footer-section a:hover { color:var(--olive-light); }
.footer-bottom { padding-top:1.5rem; border-top:1px solid rgba(255,255,255,0.05); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; }
.footer-bottom p { font-size:0.78rem; color:var(--text-muted); }
.footer-bottom .fb-links { display:flex; gap:1.5rem; }
.footer-bottom .fb-links a { font-size:0.78rem; color:var(--text-muted); }
.footer-bottom .fb-links a:hover { color:var(--olive-light); }

/* ============================================================
   SCROLL REVEAL
   ============================================================ */
.anim-ready { opacity:0; transform:translateY(18px); transition:opacity 0.55s ease, transform 0.55s ease; }
.anim-ready.visible { opacity:1; transform:translateY(0); }

/* ============================================================
   BANNER PLACEHOLDERS (swap with real product/use-case/device art)
   ============================================================ */
.banner-ph {
  position:relative;
  width:100%;
  border:2px dashed var(--border-bright);
  border-radius:var(--radius-lg);
  background:
    repeating-linear-gradient(45deg, rgba(230,188,0,0.05) 0 12px, transparent 12px 24px),
    radial-gradient(circle at 50% 50%, rgba(230,188,0,0.10), var(--bg-1));
  min-height:240px;
  display:flex; align-items:center; justify-content:center;
  text-align:center; padding:2.5rem 1.5rem; overflow:hidden;
}
.banner-ph.wide   { min-height:300px; }
.banner-ph.short  { min-height:170px; }
.banner-ph::after {
  content:''; position:absolute; inset:0;
  background-image:linear-gradient(rgba(230,188,0,0.06) 1px,transparent 1px),linear-gradient(90deg,rgba(230,188,0,0.06) 1px,transparent 1px);
  background-size:40px 40px; pointer-events:none;
}
.banner-ph__inner { position:relative; z-index:1; max-width:680px; }
.banner-ph__tag {
  font-family:var(--font-mono); font-size:0.66rem; letter-spacing:0.18em; text-transform:uppercase;
  color:var(--olive-light); border:1px solid var(--border-bright); border-radius:100px;
  padding:5px 14px; display:inline-block; margin-bottom:1rem;
}
.banner-ph__label { font-family:var(--font-display); font-size:1.35rem; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; color:var(--text); margin-bottom:0.4rem; }
.banner-ph__dim { font-family:var(--font-mono); font-size:0.74rem; color:var(--text-muted); letter-spacing:0.05em; }
.banner-ph__icon { font-size:2.2rem; margin-bottom:0.9rem; opacity:0.85; }
.banner-section { padding:46px 0; background:var(--bg); }
.banner-section.tight { padding:24px 0; }

/* ============================================================
   MANIFESTO — bold privacy / ethics / vision
   ============================================================ */
.manifesto {
  position:relative; padding:120px 0; background:var(--bg);
  border-top:1px solid var(--border); border-bottom:1px solid var(--border); overflow:hidden;
}
.manifesto::before {
  content:''; position:absolute; top:-40%; left:50%; transform:translateX(-50%);
  width:900px; height:900px; background:radial-gradient(circle, rgba(230,188,0,0.16), transparent 62%);
  pointer-events:none;
}
.manifesto .container { position:relative; z-index:1; }
.manifesto-eyebrow {
  font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.22em; text-transform:uppercase;
  color:var(--olive-light); display:inline-flex; align-items:center; gap:10px; margin-bottom:1.6rem;
}
.manifesto-eyebrow::before { content:''; width:34px; height:1px; background:var(--olive-bright); }
.manifesto h2 {
  font-family:var(--font-display); font-weight:700; text-transform:uppercase;
  font-size:clamp(2.4rem,6vw,4.6rem); line-height:0.98; letter-spacing:-0.01em; color:var(--text); margin-bottom:1.8rem;
}
.manifesto h2 em { color:var(--olive-light); font-style:normal; }
.manifesto-lines { max-width:760px; }
.manifesto-lines p { font-size:1.12rem; line-height:1.7; color:var(--text-dim); margin-bottom:1.1rem; }
.manifesto-lines p strong { color:var(--text); font-weight:600; }
.manifesto-lines .punch {
  font-family:var(--font-display); text-transform:uppercase; font-weight:700; letter-spacing:0.01em;
  font-size:clamp(1.4rem,3vw,2rem); color:var(--text); line-height:1.15; margin:1.8rem 0;
  border-left:4px solid var(--olive-bright); padding-left:1.2rem;
}
.manifesto-creed { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; margin-top:3rem; }
.creed-item { background:var(--bg-1); padding:2rem 1.6rem; }
.creed-item .ci-val { font-family:var(--font-display); font-size:1.9rem; font-weight:700; text-transform:uppercase; color:var(--olive-light); line-height:1; margin-bottom:0.6rem; }
.creed-item .ci-label { font-family:var(--font-mono); font-size:0.74rem; letter-spacing:0.06em; color:var(--text-dim); line-height:1.5; }

/* URGENCY BAND */
.urgency-band { background:var(--olive-dim); border-top:1px solid var(--olive-bright); border-bottom:1px solid var(--olive-bright); padding:30px 0; }
.urgency-band .container { display:flex; align-items:center; gap:1.4rem; justify-content:center; text-align:center; flex-wrap:wrap; }
.urgency-band .ub-dot { width:10px; height:10px; border-radius:50%; background:#fff; box-shadow:0 0 12px #fff; animation:pulse 2s infinite; flex-shrink:0; }
.urgency-band p { font-family:var(--font-display); font-size:clamp(1.1rem,2.6vw,1.7rem); font-weight:700; text-transform:uppercase; letter-spacing:0.02em; color:#f4f4f4; margin:0; }
.urgency-band p em { color:#0d0d0d; background:#f4f4f4; font-style:normal; padding:0 8px; }

/* ============================================================
   FRONTIER — Moon & Mars visionary (concept, for fun)
   ============================================================ */
.frontier { position:relative; padding:110px 0; background:radial-gradient(circle at 75% 10%, rgba(230,188,0,0.14), var(--bg) 55%); border-top:1px solid var(--border); overflow:hidden; }
.frontier::before { content:''; position:absolute; inset:0; background-image:radial-gradient(1px 1px at 20% 30%, rgba(255,255,255,0.4) 1px, transparent 0),radial-gradient(1px 1px at 70% 60%, rgba(255,255,255,0.3) 1px, transparent 0),radial-gradient(1px 1px at 45% 80%, rgba(255,255,255,0.25) 1px, transparent 0),radial-gradient(1px 1px at 85% 25%, rgba(255,255,255,0.35) 1px, transparent 0),radial-gradient(1px 1px at 30% 65%, rgba(255,255,255,0.2) 1px, transparent 0); background-size:300px 300px,360px 360px,420px 420px,500px 500px,260px 260px; opacity:0.7; pointer-events:none; }
.frontier .container { position:relative; z-index:1; }
.frontier-badge { font-family:var(--font-mono); font-size:0.7rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--olive-light); border:1px solid var(--border-bright); border-radius:100px; padding:6px 16px; display:inline-flex; align-items:center; gap:8px; margin-bottom:1.5rem; }
.frontier h2 { font-family:var(--font-display); font-weight:700; text-transform:uppercase; font-size:clamp(2.1rem,5vw,3.8rem); line-height:1; letter-spacing:-0.01em; margin-bottom:1.2rem; }
.frontier h2 em { color:var(--olive-light); font-style:normal; }
.frontier > .container > p.frontier-lead { max-width:680px; font-size:1.08rem; line-height:1.7; color:var(--text-dim); margin-bottom:3rem; }
.mission-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.5rem; }
.mission-card { background:rgba(13,13,13,0.7); backdrop-filter:blur(4px); border:1px solid var(--border-bright); border-radius:var(--radius-lg); padding:2.2rem; transition:var(--transition); }
.mission-card:hover { border-color:var(--olive-light); transform:translateY(-5px); box-shadow:var(--shadow-green); }
.mission-card .mc-glyph { font-size:2.6rem; margin-bottom:1rem; }
.mission-card .mc-code { font-family:var(--font-mono); font-size:0.68rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--olive-light); margin-bottom:0.5rem; }
.mission-card h3 { font-family:var(--font-display); font-size:1.55rem; font-weight:700; text-transform:uppercase; letter-spacing:0.02em; margin-bottom:0.9rem; }
.mission-card p { font-size:0.92rem; color:var(--text-dim); line-height:1.65; margin-bottom:1.2rem; }
.mission-specs { display:flex; flex-wrap:wrap; gap:0.5rem; }
.mission-specs span { font-family:var(--font-mono); font-size:0.66rem; letter-spacing:0.04em; text-transform:uppercase; color:var(--text-dim); background:var(--bg-2); border:1px solid var(--border); border-radius:100px; padding:4px 11px; }
.frontier-note { margin-top:2.5rem; font-family:var(--font-mono); font-size:0.8rem; line-height:1.7; color:var(--text-muted); border-left:2px solid var(--olive-dim); padding-left:1rem; max-width:760px; }
.frontier-note strong { color:var(--olive-light); }


@media (max-width:1024px){
  .ai-demo-layout { grid-template-columns:1fr; gap:3rem; }
  .ai-chat-demo { position:static; }
  .how-steps { flex-direction:column; gap:1rem; }
  .how-step-arrow { transform:rotate(90deg); align-self:center; }
  .features-grid { grid-template-columns:repeat(2,1fr); }
  .usecase-grid { grid-template-columns:repeat(2,1fr); }
  .usecase-mini-grid { grid-template-columns:repeat(2,1fr); }
  .device-grid { grid-template-columns:1fr; max-width:480px; margin:0 auto; }
  .research-grid { grid-template-columns:repeat(2,1fr); }
  .metric-grid { grid-template-columns:repeat(2,1fr); }
  .case-grid { grid-template-columns:repeat(2,1fr); }
  .values-grid { grid-template-columns:repeat(2,1fr); }
  .trust-grid { grid-template-columns:repeat(2,1fr); }
  .benefits-grid, .culture-grid { grid-template-columns:repeat(2,1fr); }
  .contact-layout { grid-template-columns:1fr; gap:2.5rem; }
  .footer-content { grid-template-columns:1fr 1fr; }
  .cta-banner-inner { flex-direction:column; text-align:center; }
}

@media (max-width:768px){
  .hero { min-height:auto; padding:calc(var(--nav-h) + 40px) 24px 60px; }
  .hero-stats { gap:1.6rem; }
  .features-grid { grid-template-columns:1fr; background:none; border:none; gap:1rem; }
  .feature-card { border-radius:var(--radius-lg); border:1px solid var(--border); }
  .usecase-grid { grid-template-columns:1fr; }
  .usecase-mini-grid { grid-template-columns:1fr; }
  .research-grid { grid-template-columns:1fr; }
  .metric-grid { grid-template-columns:repeat(2,1fr); background:none; border:none; gap:1rem; }
  .metric { border:1px solid var(--border); border-radius:var(--radius); }
  .case-grid { grid-template-columns:1fr; }
  .dataset-grid { grid-template-columns:1fr; }
  .values-grid { grid-template-columns:1fr 1fr; }
  .trust-grid { grid-template-columns:1fr 1fr; background:none; border:none; gap:1rem; }
  .trust-item { border-radius:var(--radius); border:1px solid var(--border); }
  .benefits-grid, .culture-grid { grid-template-columns:1fr 1fr; }
  .manifesto { padding:80px 0; }
  .manifesto-creed { grid-template-columns:1fr; }
  .mission-grid { grid-template-columns:1fr; }
  .frontier { padding:80px 0; }
  .paper-row { grid-template-columns:1fr; gap:0.7rem; }
  .paper-row .pr-type { justify-self:start; padding:4px 12px; }
  .modal-overlay { padding:0; align-items:flex-end; }
  .modal-box { border-radius:var(--radius-lg) var(--radius-lg) 0 0; max-width:100%; max-height:92vh; overflow-y:auto; }
  .modal-header { padding:1.5rem 1.5rem 1rem; }
  .modal-body { padding:1rem 1.5rem 2rem; }
  .modal-header h2 { font-size:1.4rem; }
  .form-row { grid-template-columns:1fr; }
  .form-actions { flex-direction:column; }
  .contact-form-wrap { padding:1.8rem; }
  .footer-content { grid-template-columns:1fr; gap:2rem; }
  .footer-bottom { justify-content:center; text-align:center; }
}

@media (max-width:480px){
  .container { padding:0 18px; }
  .logo-text { font-size:1.15rem; }
  .hero-stats { gap:1.2rem; }
  .stat-number { font-size:1.6rem; }
  .values-grid, .benefits-grid, .culture-grid, .trust-grid, .metric-grid { grid-template-columns:1fr; }
  .uc-filter { gap:0.4rem; }
  .uc-chip { font-size:0.66rem; padding:0.4rem 0.8rem; }
  .cta-banner-inner { padding:2rem 1.5rem; }
}

/* ============================================================
   UTILITIES
   ============================================================ */
::-webkit-scrollbar { width:7px; height:7px; }
::-webkit-scrollbar-track { background:var(--bg); }
::-webkit-scrollbar-thumb { background:var(--olive-dim); border-radius:3px; }
::-webkit-scrollbar-thumb:hover { background:var(--olive); }
::selection { background:var(--olive); color:#fff; }
:focus-visible { outline:2px solid var(--olive-bright); outline-offset:3px; }
@media (prefers-reduced-motion:reduce){ *,*::before,*::after { animation-duration:0.01ms !important; transition-duration:0.01ms !important; scroll-behavior:auto !important; } }

/* ════════════════════════════════════════════════════════════════
   SPECTIVA-STYLE REDESIGN LAYER
   Menu · HUD ticker · hero · marquee · intelligence flow · pricing
   ════════════════════════════════════════════════════════════════ */

/* ---- NAV: brand left · centered links · actions right ---- */
.navbar { background:rgba(5,5,5,0.72); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); }
.nav-container { display:flex; align-items:center; justify-content:space-between; gap:1.25rem; }
.logo-text { font-family:var(--font-display); font-weight:700; letter-spacing:0.14em; font-size:1.12rem; }
.logo-text b { color:var(--olive-light); font-weight:700; }
.nav-center { display:flex; align-items:center; gap:0.1rem; }
.nav-center .nav-link { font-family:var(--font-display); font-size:0.82rem; font-weight:600; letter-spacing:0.05em; text-transform:uppercase; color:var(--text-dim); padding:0.42rem 0.72rem; border-radius:var(--radius); background:none; border:none; cursor:pointer; transition:var(--transition); position:relative; display:inline-flex; align-items:center; gap:5px; }
.nav-center .nav-link:hover, .nav-center .nav-link.active { color:var(--text); }
.nav-center .nav-link.active::after { content:''; position:absolute; left:0.85rem; right:0.85rem; bottom:2px; height:1px; background:var(--olive-bright); }
.nav-actions { display:flex; align-items:center; gap:0.7rem; }
.lang-pill { font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.06em; color:var(--text-dim); background:none; border:1px solid var(--border); border-radius:100px; padding:5px 12px; display:inline-flex; align-items:center; gap:7px; cursor:pointer; transition:var(--transition); }
.lang-pill:hover { border-color:var(--border-bright); color:var(--text); }
.lang-pill .globe { color:var(--olive-light); font-size:0.8rem; }
.login-btn .lb-arrow { transition:transform 0.2s; display:inline-block; }
.login-btn:hover .lb-arrow { transform:translateX(3px); }

/* ---- HUD TICKER ---- */
.hud-bar { position:sticky; top:var(--nav-h); z-index:900; background:var(--bg-1); border-bottom:1px solid var(--border); }
.hud-inner { max-width:var(--maxw); margin:0 auto; padding:7px 24px; display:flex; align-items:center; gap:0.9rem; font-family:var(--font-mono); font-size:0.7rem; letter-spacing:0.08em; color:var(--text-dim); text-transform:uppercase; overflow-x:auto; }
.hud-inner::-webkit-scrollbar{ display:none; }
.hud-k { color:var(--olive-light); }
.hud-div { color:var(--olive-dim); }
.hud-seg { white-space:nowrap; }
.hud-live { color:var(--text); display:inline-flex; align-items:center; gap:7px; margin-left:auto; }
.hud-pulse { width:7px; height:7px; border-radius:50%; background:#FFD400; box-shadow:0 0 8px #FFD400; animation:hudPulse 1.6s infinite; }
@keyframes hudPulse { 0%,100%{opacity:1; transform:scale(1);} 50%{opacity:0.4; transform:scale(0.7);} }

/* ---- HERO ---- */
.sp-hero { position:relative; padding:110px 0 120px; min-height:660px; display:flex; align-items:center; text-align:center; overflow:hidden; border-bottom:1px solid var(--border); background:var(--bg); }
.hero-anim { position:absolute; inset:0; z-index:0; }
.hero-anim #hero-map { width:100%; height:100%; display:block; opacity:0; transition:opacity 1.2s ease; }
.hero-anim #hero-map.ready { opacity:1; }
.hero-anim::after { content:''; position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse 64% 58% at 50% 47%, rgba(5,5,5,0.52), rgba(5,5,5,0.34) 58%, rgba(5,5,5,0.76)); }
.sp-hero .container { position:relative; z-index:2; }
.sp-hero .hud-line { display:inline-flex; align-items:center; gap:0.85rem; font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.06em; color:var(--text-dim); text-transform:uppercase; margin-bottom:2rem; flex-wrap:wrap; justify-content:center; }
.sp-hero .hud-line .hk { color:var(--text-muted); }
.sp-hero .hud-line .hv { color:#e8e8e8; }
.sp-hero .hud-line .hbar { width:1px; height:13px; background:var(--olive-dim); display:inline-block; }
.sp-hero .hud-line .hlive { color:var(--olive-light); display:inline-flex; align-items:center; gap:7px; }
.sp-hero .hud-line .hlive .hdot { width:7px; height:7px; border-radius:50%; background:var(--olive-bright); box-shadow:0 0 9px var(--olive-bright); animation:hudPulse 1.5s infinite; }
.sp-hero h1 { font-family:var(--font-display); font-weight:700; text-transform:uppercase; font-size:clamp(1.85rem,4.4vw,3.2rem); line-height:1.05; letter-spacing:0.005em; margin-bottom:1.6rem; color:#fff; text-shadow:0 0 46px rgba(255,212,0,0.55), 0 0 90px rgba(255,212,0,0.28), 0 2px 22px rgba(0,0,0,0.65); }
.sp-hero h1 .l2, .sp-hero h1 em { color:var(--olive-light); font-style:normal; }
.sp-hero .hero-sub { max-width:560px; margin:1.6rem auto 0; font-size:1rem; line-height:1.7; color:var(--text-dim); }
.sp-hero .hero-actions { display:flex; gap:0.9rem; justify-content:center; flex-wrap:wrap; margin-top:0.4rem; }
/* explore button (olive brand) */
.btn-explore { font-family:var(--font-mono); font-size:0.8rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--olive-light); background:rgba(5,5,5,0.55); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); border:1px solid var(--border-bright); border-radius:8px; padding:13px 24px; display:inline-flex; align-items:center; gap:11px; transition:var(--transition); }
.btn-explore:hover { background:rgba(230,188,0,0.16); border-color:var(--olive-bright); color:var(--text); }
.btn-explore .be-arrow { transition:transform 0.2s; }
.btn-explore:hover .be-arrow { transform:translateX(4px); }

/* ---- MARQUEE ---- */
.marquee-wrap { margin-top:2.5rem; border-top:1px solid var(--border); border-bottom:1px solid var(--border); background:var(--bg-1); padding:18px 0; overflow:hidden; position:relative; }
.marquee-label { text-align:center; font-family:var(--font-mono); font-size:0.68rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--text-muted); margin-bottom:14px; }
.marquee { display:flex; width:max-content; animation:marquee 38s linear infinite; }
.marquee-wrap:hover .marquee { animation-play-state:paused; }
.marquee .m-item { font-family:var(--font-display); font-weight:600; text-transform:uppercase; letter-spacing:0.05em; font-size:1.15rem; color:var(--text-dim); padding:0 1.6rem; display:inline-flex; align-items:center; gap:1.6rem; white-space:nowrap; }
.marquee .m-item .star { color:var(--olive-bright); }
.marquee .m-item:hover { color:var(--olive-light); }
@keyframes marquee { from{transform:translateX(0);} to{transform:translateX(-50%);} }
.marquee-wrap::before, .marquee-wrap::after { content:''; position:absolute; top:0; bottom:0; width:120px; z-index:2; pointer-events:none; }
.marquee-wrap::before { left:0; background:linear-gradient(90deg,var(--bg-1),transparent); }
.marquee-wrap::after { right:0; background:linear-gradient(270deg,var(--bg-1),transparent); }

/* ---- STAT QUAD ---- */
.stat-quad { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border); border-bottom:1px solid var(--border); }
.stat-quad .sq { background:var(--bg); padding:2.4rem 1.6rem; text-align:center; transition:var(--transition); }
.stat-quad .sq:hover { background:var(--bg-1); }
.stat-quad .sq-val { font-family:var(--font-display); font-size:2.1rem; font-weight:700; text-transform:uppercase; color:var(--olive-light); line-height:1; margin-bottom:0.5rem; }
.stat-quad .sq-label { font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-dim); }

/* ---- SECTION HEADS (spectiva style) ---- */
.sp-eyebrow { font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--olive-light); display:block; text-align:center; margin-bottom:1rem; }
.sp-title { font-family:var(--font-display); font-weight:700; text-transform:uppercase; font-size:clamp(1.9rem,4.5vw,3rem); line-height:1.05; text-align:center; margin-bottom:1rem; }
.sp-title em { color:var(--olive-light); font-style:normal; }
.sp-lead { text-align:center; max-width:640px; margin:0 auto 3.4rem; color:var(--text-dim); line-height:1.7; }

/* ---- INTELLIGENCE FLOW SCHEMA ---- */
.flow { padding:100px 0; background:var(--bg); border-bottom:1px solid var(--border); }
.flow-grid { display:grid; grid-template-columns:1fr auto 1fr auto 1fr; align-items:center; gap:1rem; }
.flow-col { }
.flow-colhead { font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--olive-light); margin-bottom:1.1rem; text-align:center; }
.flow-node { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius); padding:1rem 1.1rem; margin-bottom:0.7rem; transition:var(--transition); }
.flow-node:hover { border-color:var(--border-bright); transform:translateX(3px); }
.flow-node h4 { font-size:0.9rem; font-weight:600; color:var(--text); margin-bottom:0.2rem; }
.flow-node p { font-family:var(--font-mono); font-size:0.68rem; color:var(--text-muted); line-height:1.5; letter-spacing:0.02em; }
.flow-engine { display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; background:radial-gradient(circle,rgba(230,188,0,0.22),var(--bg-2)); border:1px solid var(--border-bright); border-radius:var(--radius-lg); padding:2rem 1.4rem; min-height:180px; position:relative; box-shadow:var(--shadow-green); }
.flow-engine::before { content:''; position:absolute; inset:-1px; border-radius:var(--radius-lg); border:1px solid var(--olive-bright); opacity:0; animation:enginePulse 2.6s ease-out infinite; }
@keyframes enginePulse { 0%{opacity:0.7; transform:scale(1);} 100%{opacity:0; transform:scale(1.12);} }
.flow-engine .fe-glyph { font-size:2rem; margin-bottom:0.6rem; }
.flow-engine .fe-title { font-family:var(--font-display); font-size:1.25rem; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; color:var(--text); line-height:1.05; }
.flow-engine .fe-sub { font-family:var(--font-mono); font-size:0.66rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--olive-light); margin-top:0.4rem; }
.flow-conn { display:flex; align-items:center; justify-content:center; min-width:56px; height:2px; position:relative; }
.flow-conn::before { content:''; position:absolute; left:0; right:0; height:1px; background:repeating-linear-gradient(90deg,var(--olive-bright) 0 6px,transparent 6px 12px); background-size:200% 100%; animation:flowDash 1s linear infinite; }
.flow-conn::after { content:'▸'; position:absolute; right:-4px; color:var(--olive-bright); font-size:0.8rem; }
@keyframes flowDash { from{background-position:0 0;} to{background-position:24px 0;} }

/* ---- REPORT SHOWCASE (reuses chat demo styling; wrapper) ---- */
.report-showcase { padding:100px 0; background:var(--bg-1); border-bottom:1px solid var(--border); }

/* ---- EDITORIAL CARDS ---- */
.editorial { padding:100px 0; background:var(--bg); border-bottom:1px solid var(--border); }
.editorial-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; }
.ed-card { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.9rem; transition:var(--transition); display:flex; flex-direction:column; }
.ed-card:hover { border-color:var(--border-bright); transform:translateY(-4px); }
.ed-tag { font-family:var(--font-mono); font-size:0.66rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--olive-light); margin-bottom:0.9rem; display:inline-flex; align-items:center; gap:7px; }
.ed-card h3 { font-family:var(--font-display); font-size:1.3rem; font-weight:700; text-transform:uppercase; letter-spacing:0.02em; margin-bottom:0.7rem; }
.ed-card p { font-size:0.9rem; color:var(--text-dim); line-height:1.6; flex-grow:1; }
.ed-card .ed-src { font-family:var(--font-mono); font-size:0.66rem; color:var(--text-muted); margin-top:1.2rem; letter-spacing:0.04em; }

/* ---- VISION / FOUNDER QUOTE ---- */
.vision { padding:110px 0; background:radial-gradient(circle at 80% 0%,rgba(230,188,0,0.12),var(--bg) 55%); border-bottom:1px solid var(--border); }
.vision-quote { font-family:var(--font-display); font-weight:700; text-transform:uppercase; font-size:clamp(1.6rem,4vw,2.6rem); line-height:1.15; letter-spacing:0.01em; max-width:880px; margin:0 auto 2rem; text-align:center; }
.vision-quote em { color:var(--olive-light); font-style:normal; }
.vision-attr { text-align:center; font-family:var(--font-mono); font-size:0.74rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-dim); margin-bottom:3.5rem; }
.vision-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; }
.vision-stats .vs { background:var(--bg-1); padding:2rem 1.4rem; text-align:center; }
.vision-stats .vs-val { font-family:var(--font-display); font-size:1.9rem; font-weight:700; text-transform:uppercase; color:var(--olive-light); line-height:1; margin-bottom:0.5rem; }
.vision-stats .vs-label { font-family:var(--font-mono); font-size:0.7rem; letter-spacing:0.05em; text-transform:uppercase; color:var(--text-dim); }

/* ---- QUICK START 3 STEPS ---- */
.steps { padding:100px 0; background:var(--bg-1); border-bottom:1px solid var(--border); }
.steps-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.step-card { position:relative; background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-lg); padding:2.4rem 2rem 2rem; transition:var(--transition); overflow:hidden; text-align:center; }
.step-card:hover { border-color:var(--border-bright); transform:translateY(-4px); }
.step-num { font-family:var(--font-display); font-size:4.2rem; font-weight:700; line-height:1; color:var(--olive-dim); opacity:0.5; margin-bottom:0.8rem; }
.step-card h3 { font-family:var(--font-display); font-size:1.35rem; font-weight:700; text-transform:uppercase; letter-spacing:0.02em; margin-bottom:0.7rem; }
.step-card p { font-size:0.9rem; color:var(--text-dim); line-height:1.6; }

/* ---- PRICING ---- */
.pricing { padding:100px 0; background:var(--bg); border-bottom:1px solid var(--border); }
.pricing-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; align-items:stretch; }
.price-card { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-lg); padding:2.2rem; display:flex; flex-direction:column; transition:var(--transition); position:relative; }
.price-card:hover { border-color:var(--border-bright); transform:translateY(-5px); }
.price-card.popular { border-color:var(--olive-bright); box-shadow:var(--shadow-green); }
.price-badge { position:absolute; top:-11px; left:50%; transform:translateX(-50%); font-family:var(--font-mono); font-size:0.64rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--bg); background:var(--olive-bright); border-radius:100px; padding:4px 14px; }
.price-name { font-family:var(--font-display); font-size:1.4rem; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; margin-bottom:0.3rem; }
.price-for { font-family:var(--font-mono); font-size:0.72rem; color:var(--text-muted); letter-spacing:0.03em; margin-bottom:1.4rem; }
.price-val { font-family:var(--font-display); font-size:2.6rem; font-weight:700; color:var(--text); line-height:1; margin-bottom:0.3rem; }
.price-val .price-unit { font-family:var(--font-mono); font-size:0.8rem; color:var(--text-muted); letter-spacing:0.02em; }
.price-feats { list-style:none; margin:1.6rem 0; padding:0; flex-grow:1; }
.price-feats li { font-size:0.86rem; color:var(--text-dim); padding:0.5rem 0; display:flex; gap:9px; align-items:flex-start; border-bottom:1px solid var(--border-soft); }
.price-feats li::before { content:'✦'; color:var(--olive-bright); flex-shrink:0; }
.price-note { font-family:var(--font-mono); font-size:0.64rem; letter-spacing:0.04em; color:var(--text-muted); text-align:center; margin-top:2.5rem; }

/* ---- FINAL CTA ---- */
.final-cta { padding:120px 0; text-align:center; position:relative; overflow:hidden; }
.final-cta::before { content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:700px; height:700px; background:radial-gradient(circle,rgba(230,188,0,0.16),transparent 62%); pointer-events:none; }
.final-cta .container { position:relative; z-index:1; }
.final-cta .fc-eyebrow { font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--olive-light); margin-bottom:1rem; }
.final-cta h2 { font-family:var(--font-display); font-weight:700; text-transform:uppercase; font-size:clamp(2.2rem,5.5vw,4rem); line-height:1; margin-bottom:1.2rem; }
.final-cta h2 em { color:var(--olive-light); font-style:normal; }
.final-cta p { color:var(--text-dim); margin-bottom:2rem; font-size:1.05rem; }
.final-cta .fc-actions { display:flex; gap:0.9rem; justify-content:center; flex-wrap:wrap; }

/* ---- RESPONSIVE (spectiva layer) ---- */
@media (max-width:1024px){
  .flow-grid { grid-template-columns:1fr; gap:1.4rem; }
  .flow-conn { transform:rotate(90deg); margin:0 auto; height:40px; }
  .stat-quad { grid-template-columns:repeat(2,1fr); }
  .vision-stats { grid-template-columns:repeat(2,1fr); }
  .editorial-grid { grid-template-columns:1fr; }
  .pricing-grid { grid-template-columns:1fr; max-width:460px; margin:0 auto; }
  .steps-grid { grid-template-columns:1fr; }
}
@media (max-width:900px){
  .nav-toggle { display:flex; }
  .nav-center {
    position:fixed; top:var(--nav-h); left:0; right:0;
    flex-direction:column; align-items:stretch; gap:0;
    background:rgba(8,9,7,0.98); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
    border-bottom:1px solid var(--border-bright);
    padding:0.5rem 20px 1.4rem;
    transform:translateY(-150%); transition:transform 0.35s cubic-bezier(0.4,0,0.2,1);
    max-height:calc(100vh - var(--nav-h)); overflow-y:auto; z-index:80;
    box-shadow:0 24px 50px rgba(0,0,0,0.75);
  }
  .nav-center.open { transform:translateY(0); }
  .nav-center > .nav-link,
  .nav-center .nav-item > .nav-link {
    font-size:1.05rem; padding:0.95rem 0.2rem; width:100%; text-align:left;
    justify-content:space-between; display:flex; border-bottom:1px solid var(--border-soft);
  }
  .nav-center .nav-link.active::after { display:none; }
  .nav-center .nav-item { width:100%; }
  .nav-center .nav-dropdown {
    position:static; transform:none; opacity:1; visibility:visible; min-width:0;
    background:transparent; border:none; box-shadow:none; margin:0; padding:0;
    max-height:0; overflow:hidden; transition:max-height 0.32s ease, padding 0.32s ease;
  }
  .nav-center .nav-item.open .nav-dropdown { max-height:520px; padding:0.3rem 0 0.7rem; }
  .nav-center .nav-item.open .nav-link .caret { transform:rotate(180deg); }
  .nav-center .nav-dropdown::before { display:none; }
  .nav-center .nav-dropdown a { padding:0.7rem 0.9rem; font-size:0.96rem; }
  .nav-center .nav-dropdown a small { font-size:0.78rem; }
  .lang-pill { display:none; }
  .login-btn { padding:0.5rem 1rem; }
  .login-btn .lb-arrow { display:none; }
}
@media (max-width:600px){
  .stat-quad { grid-template-columns:1fr 1fr; }
  .vision-stats { grid-template-columns:1fr 1fr; }
  .hud-live { margin-left:1rem; }
  .sp-hero { padding:80px 0 50px; }
}

/* ════════════════════════════════════════════════════════════════
   HERO MAP CONSOLE — world → India → live monitoring
   ════════════════════════════════════════════════════════════════ */
.hero-map-stage { margin-top:3.2rem; padding:0 24px; }
.map-frame { position:relative; max-width:var(--maxw); margin:0 auto; aspect-ratio:16 / 9; border:1px solid var(--border-bright); border-radius:var(--radius-lg); background:radial-gradient(ellipse 60% 55% at 50% 42%, rgba(230,188,0,0.10), var(--bg-1) 70%), var(--bg); overflow:hidden; box-shadow:var(--shadow-green), inset 0 0 60px rgba(0,0,0,0.6); }
#hero-map { width:100%; height:100%; display:block; }

/* HUD frame chrome */
.map-frame .corner { position:absolute; width:16px; height:16px; border:2px solid var(--olive-bright); opacity:0.55; z-index:3; }
.map-frame .corner.tl { top:10px; left:10px; border-right:0; border-bottom:0; }
.map-frame .corner.tr { top:10px; right:10px; border-left:0; border-bottom:0; }
.map-frame .corner.bl { bottom:10px; left:10px; border-right:0; border-top:0; }
.map-frame .corner.br { bottom:10px; right:10px; border-left:0; border-top:0; }
.map-hud-label { position:absolute; z-index:3; font-family:var(--font-mono); font-size:0.6rem; letter-spacing:0.13em; text-transform:uppercase; color:var(--olive-light); pointer-events:none; }
.map-hud-label.mh-tl { top:16px; left:34px; }
.map-hud-label.mh-tr { top:16px; right:34px; color:#FFD400; display:flex; align-items:center; gap:6px; }
.map-hud-label.mh-tr .mh-dot { width:6px; height:6px; border-radius:50%; background:#FFD400; box-shadow:0 0 8px #FFD400; animation:hudPulse 1.4s infinite; }
.map-hud-label.mh-bl { bottom:16px; left:34px; color:var(--text-muted); }
.map-legend { position:absolute; z-index:3; bottom:14px; right:14px; display:flex; gap:14px; align-items:center; font-family:var(--font-mono); font-size:0.62rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-dim); background:rgba(5,5,5,0.55); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); padding:7px 13px; border:1px solid var(--border); border-radius:100px; opacity:0; transition:opacity 0.6s ease; }
.map-legend.show { opacity:1; }
.map-legend span { display:flex; align-items:center; gap:6px; }
.map-legend .lg-ic { font-size:0.92rem; }

/* SVG geo layers */
.geo-country { fill:#0f1409; stroke:rgba(230,188,0,0.28); stroke-width:0.5; vector-effect:non-scaling-stroke; }
.geo-graticule { fill:none; stroke:rgba(230,188,0,0.10); stroke-width:0.5; vector-effect:non-scaling-stroke; }
.geo-sphere { fill:transparent; stroke:rgba(230,188,0,0.22); stroke-width:0.6; vector-effect:non-scaling-stroke; }
.geo-india { fill:#1c1407; stroke:#FFD400; stroke-width:1.7; vector-effect:non-scaling-stroke; opacity:0; transition:opacity 0.9s ease, fill 0.9s ease; filter:drop-shadow(0 0 5px rgba(255,212,0,0.6)); }
.geo-india.active { opacity:1; }

/* cities */
.city { opacity:0; transition:opacity 0.55s ease; }
.city.show { opacity:1; }
.city-dot { fill:#FFD400; }
.city-dot.hq { fill:#ffffff; stroke:#FFD400; stroke-width:1.4; vector-effect:non-scaling-stroke; }
.city-ring { fill:none; stroke:#FFD400; stroke-width:1; vector-effect:non-scaling-stroke; }
.city-label { font-family:var(--font-mono); fill:#eaeaea; letter-spacing:0.03em; paint-order:stroke; stroke:rgba(5,5,5,0.85); stroke-width:2.4px; }
.city-label.hq { fill:#FFD400; }

/* monitoring flow */
.arc { fill:none; stroke:url(#arcGrad); stroke-width:0.9; vector-effect:non-scaling-stroke; opacity:0; transition:opacity 0.6s ease; }
.arc.show { opacity:0.75; }
.pulse { fill:#FFD400; filter:drop-shadow(0 0 3px #FFD400); }
.veh { paint-order:stroke; }
.radar { opacity:0; transition:opacity 1.1s ease; }
.radar.show { opacity:1; }
.scope-ring { fill:none; stroke:rgba(255,212,0,0.28); stroke-width:0.6; vector-effect:non-scaling-stroke; }

.map-failed #hero-map { display:none; }

@media (max-width:768px){
  .map-frame { aspect-ratio:4 / 5; }
  .map-legend { gap:9px; font-size:0.56rem; padding:6px 10px; bottom:10px; right:10px; }
  .hero-map-stage { padding:0 14px; }
}

/* graph-network SVG elements (orange = live edge-monitoring layer) */
#hero-map .gn-grid { stroke:rgba(230,188,0,0.08); stroke-width:0.6; vector-effect:non-scaling-stroke; }
#hero-map .gn-link { stroke:rgba(255,212,0,0.22); stroke-width:1; vector-effect:non-scaling-stroke; }
#hero-map .gn-link.bb { stroke:rgba(255,212,0,0.34); stroke-dasharray:6 7; }
#hero-map .gn-pulse { fill:#FFF1A8; filter:drop-shadow(0 0 4px #FFD400); }
#hero-map .gn-scan { fill:none; stroke:rgba(255,212,0,0.45); stroke-width:1; vector-effect:non-scaling-stroke; }
#hero-map .gn-remote { fill:var(--bg-2); stroke:#FFD400; stroke-width:1.6; vector-effect:non-scaling-stroke; }
#hero-map .gn-infra { fill:var(--bg-2); stroke:#FFD400; stroke-width:1.6; vector-effect:non-scaling-stroke; }
#hero-map .gn-scope { fill:none; stroke:rgba(255,212,0,0.16); stroke-width:0.9; vector-effect:non-scaling-stroke; }
#hero-map .gn-sweep { fill:#FFD400; opacity:0.18; }
#hero-map .gn-scan-core { fill:rgba(255,212,0,0.18); stroke:#FFD400; stroke-width:2; vector-effect:non-scaling-stroke; filter:drop-shadow(0 0 6px rgba(255,212,0,0.6)); }
#hero-map .gn-zlabel { font-family:var(--font-mono); fill:#FFD400; letter-spacing:0.08em; opacity:0.9; paint-order:stroke; stroke:rgba(5,5,5,0.85); stroke-width:3px; }
#hero-map .gn-mob-dot { fill:#fff; filter:drop-shadow(0 0 5px #FFD400); }
#hero-map .gn-mob-halo { fill:none; stroke:rgba(255,212,0,0.6); stroke-width:1.2; vector-effect:non-scaling-stroke; }
#hero-map .gn-mob-coord { font-family:var(--font-mono); fill:#FFF1A8; letter-spacing:0.04em; paint-order:stroke; stroke:rgba(5,5,5,0.9); stroke-width:3px; }

/* ════ LAYERED STACK (SecuraSense architecture) ════ */
.flow .container { max-width:1320px; }
.layerstack { max-width:680px; margin:2.5rem auto 0; display:flex; flex-direction:column; align-items:stretch; gap:0.45rem; }
.ls-layer { background:var(--bg-2); border:1px solid var(--border); border-radius:12px; padding:1.05rem 1.5rem; text-align:center; transition:var(--transition); }
.ls-layer:hover { border-color:var(--border-bright); transform:translateY(-2px); }
.ls-name { font-family:var(--font-display); font-weight:700; text-transform:uppercase; letter-spacing:0.05em; color:var(--text); font-size:1.02rem; }
.ls-desc { font-size:0.8rem; color:var(--text-dim); margin-top:0.25rem; line-height:1.5; }
.ls-layer.ls-stack { border-color:var(--border-bright); background:radial-gradient(circle at 50% 0%,rgba(230,188,0,0.14),var(--bg-2)); box-shadow:0 0 26px rgba(230,188,0,0.12); }
.ls-layer.ls-stack .ls-name { color:var(--olive-bright); }
.ls-arrow { text-align:center; color:var(--olive-light); font-size:0.9rem; line-height:1; animation:lsPulse 2.2s ease-in-out infinite; }
@keyframes lsPulse { 0%,100%{opacity:0.45;} 50%{opacity:1;} }

/* hero graph legend (box-less, overlaid) */
.hero-legend { position:absolute; z-index:2; left:0; right:0; bottom:20px; text-align:center; font-family:var(--font-mono); font-size:0.66rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-muted); pointer-events:none; }
.hero-legend .lg-hex, .hero-legend .lg-cir, .hero-legend .lg-sq, .hero-legend .lg-dot { color:#FFD400; margin:0 3px 0 10px; }
.hero-legend .lg-sep { color:var(--olive-dim); margin:0 4px; }
@media (max-width:600px){ .hero-legend { font-size:0.56rem; bottom:12px; } }

/* base street-map layer (grey, below the graph) */
#hero-map .gn-basegrid { stroke:rgba(200,205,210,0.045); stroke-width:0.6; vector-effect:non-scaling-stroke; }
#hero-map .gn-street { stroke:rgba(205,210,215,0.10); stroke-width:1.5; vector-effect:non-scaling-stroke; }
#hero-map .gn-street.diag { stroke:rgba(205,210,215,0.07); }
#hero-map .gn-block { fill:none; stroke:rgba(205,210,215,0.06); stroke-width:0.8; vector-effect:non-scaling-stroke; }


/* nav underline — consistent, text-width, no odd active line */
.nav-center .nav-link::after { content:''; position:absolute; left:0.72rem; right:0.72rem; bottom:3px; width:auto; height:2px; background:var(--olive-bright); border-radius:2px; transform:scaleX(0); transform-origin:center; transition:transform 0.24s ease; }
.nav-center .nav-link:hover::after, .nav-center .nav-link.active::after { left:0.72rem; right:0.72rem; bottom:3px; height:2px; width:auto; transform:scaleX(1); }
@media (max-width:900px){ .nav-center .nav-link::after { display:none; } }

/* local map roads / river / locale */
#hero-map .gn-road { fill:none; stroke:rgba(200,206,212,0.09); stroke-width:1.6; vector-effect:non-scaling-stroke; }
#hero-map .gn-road.sec { stroke:rgba(200,206,212,0.055); stroke-width:1; }
#hero-map .gn-river { fill:none; stroke:rgba(120,150,172,0.16); stroke-width:7; stroke-linecap:round; vector-effect:non-scaling-stroke; }
#hero-map .gn-loc { font-family:var(--font-mono); fill:rgba(180,190,168,0.42); letter-spacing:0.14em; text-transform:uppercase; }
/* mobile asset scanner + detection/alert */
#hero-map .gn-mscan { fill:none; stroke:rgba(255,212,0,0.5); stroke-width:1.1; vector-effect:non-scaling-stroke; }
#hero-map .gn-sig { fill:none; stroke:#e0483a; stroke-width:1.7; vector-effect:non-scaling-stroke; filter:drop-shadow(0 0 4px rgba(224,72,58,0.7)); }
#hero-map .gn-mobile.alert .gn-mob-dot { fill:#e0483a; filter:drop-shadow(0 0 7px #e0483a); }
#hero-map .gn-mobile.alert .gn-mob-halo { stroke:rgba(224,72,58,0.75); }
#hero-map .gn-mobile.alert .gn-mscan { stroke:rgba(224,72,58,0.55); }
#hero-map .gn-mobile.alert .gn-mob-coord { fill:#f0a99f; }

/* ===== hero overlap fix: opaque nav + animation starts below nav ===== */
.navbar { background:rgba(5,5,5,0.96); }
.hero-anim { inset:var(--nav-h) 0 0 0; }
.hero-anim::after { background:radial-gradient(ellipse 66% 60% at 50% 47%, rgba(5,5,5,0.46), rgba(5,5,5,0.30) 58%, rgba(5,5,5,0.60)); }

/* ===== local map — made visible ===== */
#hero-map .gn-basegrid { stroke:rgba(200,206,212,0.07); }
#hero-map .gn-road { stroke:rgba(200,210,216,0.20); stroke-width:1.8; }
#hero-map .gn-road.sec { stroke:rgba(200,210,216,0.11); stroke-width:1.1; }
#hero-map .gn-river { stroke:rgba(110,165,190,0.32); stroke-width:8; }
#hero-map .gn-block { stroke:rgba(200,210,216,0.13); }
#hero-map .gn-loc { fill:rgba(190,200,175,0.62); }

/* ===== sensor array ===== */
#hero-map .gn-link.sen { stroke:rgba(255,212,0,0.22); stroke-dasharray:2 6; }
#hero-map .sens-bg { fill:rgba(9,11,7,0.55); stroke:rgba(255,212,0,0.28); stroke-width:1; vector-effect:non-scaling-stroke; }
#hero-map .sens-label { font-family:var(--font-mono); fill:var(--olive-light); letter-spacing:0.10em; opacity:0.85; paint-order:stroke; stroke:rgba(5,5,5,0.85); stroke-width:3px; }
#hero-map .sens-line { fill:none; stroke:rgba(255,224,77,0.8); stroke-width:1.4; vector-effect:non-scaling-stroke; }
#hero-map .sens-dot { fill:var(--olive-bright); }
#hero-map .sens-fov { fill:rgba(255,212,0,0.14); stroke:rgba(255,224,77,0.4); stroke-width:1; vector-effect:non-scaling-stroke; }
#hero-map .sens-ring { fill:none; stroke:rgba(255,224,77,0.5); stroke-width:1; stroke-dasharray:3 4; vector-effect:non-scaling-stroke; }
#hero-map .sens-spoke { stroke:rgba(255,224,77,0.45); stroke-width:1; vector-effect:non-scaling-stroke; }
#hero-map .sens-pt { fill:var(--olive-bright); }
#hero-map .sens-arc { fill:none; stroke:rgba(255,224,77,0.55); stroke-width:1.3; vector-effect:non-scaling-stroke; }
#hero-map .sens-wedge { fill:rgba(255,224,77,0.22); }
#hero-map .sens-bar { fill:var(--olive-bright); }
#hero-map .sens-wave { fill:none; stroke:var(--olive-bright); stroke-width:1.6; vector-effect:non-scaling-stroke; }
#hero-map .sens-signal { fill:none; stroke:rgba(255,224,77,0.7); stroke-width:1.4; vector-effect:non-scaling-stroke; }

/* ===== live site-video tile ===== */
#hero-map .vid-frame { fill:rgba(7,9,5,0.9); stroke:var(--olive-bright); stroke-width:1.2; vector-effect:non-scaling-stroke; }
#hero-map .vid-screen { fill:rgba(18,24,14,0.55); }
#hero-map .vid-scan { stroke:rgba(255,212,0,0.09); stroke-width:1; vector-effect:non-scaling-stroke; }
#hero-map .vid-beam { fill:rgba(255,224,77,0.16); }
#hero-map .vid-box rect { fill:none; stroke:var(--olive-bright); stroke-width:1.4; vector-effect:non-scaling-stroke; }
#hero-map .vid-tag { font-family:var(--font-mono); fill:var(--olive-light); letter-spacing:0.08em; }
#hero-map .vid-rec { fill:#e0483a; filter:drop-shadow(0 0 4px rgba(224,72,58,0.8)); }
#hero-map .vid-txt { font-family:var(--font-mono); fill:var(--olive-light); letter-spacing:0.14em; }

/* ===== real map background (CARTO dark tiles, olive-tinted) ===== */
#hero-mapbg { position:absolute; inset:0; overflow:hidden; z-index:0; filter:brightness(0.55) contrast(1.12) sepia(0.5) hue-rotate(40deg) saturate(0.85); }
#hero-mapbg img { position:absolute; pointer-events:none; }
.hero-anim::after { z-index:1; }
.hero-anim #hero-map { position:absolute; inset:0; z-index:2; }
.sp-hero .container { z-index:3; }
.map-attrib { position:absolute; z-index:3; bottom:8px; left:14px; font-family:var(--font-mono); font-size:0.56rem; letter-spacing:0.08em; color:rgba(185,195,170,0.45); pointer-events:none; text-transform:uppercase; }

/* ===== language switch (EN / हिं) ===== */
.lang-switch { display:inline-flex; border:1px solid var(--border-bright); border-radius:100px; overflow:hidden; background:rgba(255,255,255,0.02); }
.lang-opt { font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.04em; color:var(--text-dim); background:none; border:none; padding:5px 11px; cursor:pointer; transition:var(--transition); line-height:1.2; }
.lang-opt.active { background:var(--olive); color:#fff; }
.lang-opt:not(.active):hover { color:var(--text); }
@media (max-width:600px){ .lang-opt { padding:5px 9px; font-size:0.68rem; } }

/* ===== mobile dropdown: force in-flow accordion (never off to the left) ===== */
@media (max-width:900px){
  .nav-center .nav-item .nav-dropdown { position:static !important; left:auto !important; right:auto !important; top:auto !important; transform:none !important; min-width:0 !important; width:100%; }
}

/* ===== node colour states (amber warning / red alert) ===== */
#hero-map .gn-node.warn .gn-remote, #hero-map .gn-node.warn .gn-infra { fill:#d98a2e; stroke:#e6a75a; filter:drop-shadow(0 0 6px rgba(217,138,46,0.75)); }
#hero-map .gn-node.warn .gn-scan { stroke:rgba(217,138,46,0.6); }
#hero-map .gn-node.alert .gn-remote, #hero-map .gn-node.alert .gn-infra { fill:#e0483a; stroke:#f28c80; filter:drop-shadow(0 0 6px rgba(224,72,58,0.75)); }
#hero-map .gn-node.alert .gn-scan { stroke:rgba(224,72,58,0.6); }

/* ===== scatter burst from mobile assets ===== */
#hero-map .gn-scatter { fill:#FFF1A8; filter:drop-shadow(0 0 3px rgba(255,224,77,0.85)); }

/* ===== refined sensor glyphs ===== */
#hero-map .sens-bg { fill:rgba(9,11,7,0.58); stroke:rgba(255,212,0,0.3); stroke-width:1; vector-effect:non-scaling-stroke; }
#hero-map .sens-body { fill:rgba(28,36,18,0.92); stroke:var(--olive-bright); stroke-width:1.3; vector-effect:non-scaling-stroke; }
#hero-map .sens-fov { stroke:rgba(255,224,77,0.3); stroke-width:0.8; vector-effect:non-scaling-stroke; }
#hero-map .sens-ring { fill:none; stroke:var(--olive-bright); stroke-width:1.4; vector-effect:non-scaling-stroke; }
#hero-map .sens-dot { fill:var(--olive-light); }
#hero-map .sens-live { fill:#FFF1A8; filter:drop-shadow(0 0 3px rgba(255,224,77,0.8)); }
#hero-map .sens-range { fill:none; stroke:rgba(255,224,77,0.32); stroke-width:0.8; stroke-dasharray:2 4; vector-effect:non-scaling-stroke; }
#hero-map .sens-sweep { stroke:none; }
#hero-map .sens-beam { stroke:var(--olive-bright); stroke-width:1.2; vector-effect:non-scaling-stroke; }
#hero-map .sens-pt { fill:var(--olive-light); }
#hero-map .sens-hub { fill:rgba(28,36,18,0.95); stroke:var(--olive-bright); stroke-width:1.3; vector-effect:non-scaling-stroke; }
#hero-map .sens-arc { fill:none; stroke:rgba(255,224,77,0.6); stroke-width:1.3; vector-effect:non-scaling-stroke; }
#hero-map .sens-blip { fill:#e0483a; filter:drop-shadow(0 0 3px rgba(224,72,58,0.8)); }
#hero-map .sens-grille { stroke:rgba(255,224,77,0.6); stroke-width:1; vector-effect:non-scaling-stroke; }
#hero-map .sens-frame { fill:rgba(12,16,8,0.72); stroke:var(--olive); stroke-width:1.2; vector-effect:non-scaling-stroke; }
#hero-map .sens-mid { stroke:rgba(255,224,77,0.26); stroke-width:0.8; vector-effect:non-scaling-stroke; }
#hero-map .sens-wave { fill:none; stroke:var(--olive-bright); stroke-width:1.6; vector-effect:non-scaling-stroke; }
#hero-map .sens-mast { fill:none; stroke:var(--olive-bright); stroke-width:1.4; stroke-linejoin:round; vector-effect:non-scaling-stroke; }
#hero-map .sens-signal { fill:none; stroke:rgba(255,224,77,0.7); stroke-width:1.4; vector-effect:non-scaling-stroke; }

/* ===== mobile nav: prevent overflow so the hamburger always shows ===== */
.nav-dash-mobile { display:none; }
@media (max-width:900px){
  .login-btn { display:none; }              /* hidden in top bar; available in the drawer */
  .nav-actions { gap:10px; }
  .nav-center { z-index:895; }
  .nav-center .nav-dash-mobile { display:flex !important; font-size:1.05rem; padding:0.95rem 0.2rem; width:100%; color:var(--olive-light); }
}
@media (max-width:400px){ .logo-text { font-size:1.12rem; } }

/* ===== banner image (shows when present; styled placeholder is the fallback) ===== */
.banner-ph .banner-img { display:block; width:100%; height:auto; border-radius:var(--radius-lg); position:relative; z-index:2; }
.banner-ph.has-image { border:none; background:none; min-height:0; padding:0; }
.banner-ph.has-image::after { display:none; }
.banner-ph.has-image .banner-ph__inner { display:none; }

/* ===== staging environment badge ===== */

/* hide the drawer-only Dashboard on desktop (fixes it showing twice) */
@media (min-width:901px){ .nav-center .nav-dash-mobile { display:none !important; } }

/* ===== coverage product cards — contained, centred, rounded-rectangle images ===== */
.coverage-wrap { padding:2.8rem 0 0.4rem; }
.coverage-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 330px)); gap:2rem; justify-content:center; margin-top:1.4rem; }
.coverage-card { text-align:center; }
.coverage-card .banner-ph.cov {
  width:100%; max-width:330px; margin:0 auto 1.1rem;
  min-height:200px; aspect-ratio:1000 / 1560;
  border-radius:20px; overflow:hidden;
}
.coverage-card .banner-ph.cov.has-image {
  min-height:0;
  border:1px solid var(--border-bright);
  box-shadow:0 12px 32px rgba(0,0,0,0.45);
}
.coverage-card .banner-ph.cov .banner-img { width:100%; height:100%; object-fit:cover; border-radius:0; }
.coverage-card h3 { font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.03em; font-size:1.1rem; margin-bottom:0.4rem; color:var(--text); }
.coverage-card p { color:var(--text-dim); font-size:0.95rem; max-width:34ch; margin:0 auto; }
.coverage-card { display:flex; flex-direction:column; align-items:center; }
@media (max-width:820px){ .coverage-grid { grid-template-columns:minmax(0, 330px); } }

/* ===== generic section + grid system (used by new pages) ===== */
.section { padding:5rem 0; position:relative; }
.section.alt { background:var(--bg-1); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.section > .container > .ph-eyebrow { display:inline-flex; align-items:center; justify-content:center; gap:8px; width:100%; font-family:var(--font-mono); font-size:0.7rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--olive-light); margin-bottom:0.7rem; }
.section > .container > h2 { text-align:center; font-family:var(--font-display); font-size:clamp(1.6rem,3.2vw,2.25rem); font-weight:700; text-transform:uppercase; letter-spacing:0.03em; color:var(--text); margin-bottom:0.9rem; }
.section > .container > h2 em { font-style:normal; color:var(--olive-bright); }
.section-lead { font-size:1.05rem; color:var(--text-dim); max-width:700px; margin:0 auto 2.6rem; line-height:1.7; text-align:center; }
.section-cta { text-align:center; margin-top:2.6rem; }

.grid-2, .grid-3, .grid-4 { display:grid; gap:1.4rem; }
.grid-2 { grid-template-columns:repeat(2,1fr); }
.grid-3 { grid-template-columns:repeat(3,1fr); }
.grid-4 { grid-template-columns:repeat(4,1fr); }
/* stand-alone cards (outside the joined features-grid) get their own border */
.grid-2 .feature-card, .grid-3 .feature-card, .grid-4 .feature-card { background:var(--bg-1); border:1px solid var(--border); border-radius:var(--radius-lg); }
.grid-2 .feature-card:hover, .grid-3 .feature-card:hover, .grid-4 .feature-card:hover { border-color:var(--border-bright); transform:translateY(-3px); }
.feature-card .feature-icon { font-size:1.8rem; display:block; margin-bottom:0.9rem; }
.feature-card .fc-cta { display:inline-block; margin-top:1rem; font-family:var(--font-mono); font-size:0.78rem; letter-spacing:0.06em; color:var(--olive-light); }

/* simple stat row */
.stat-row { display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; text-align:center; margin-top:2.4rem; }
.stat-row .stat b { display:block; font-family:var(--font-display); font-size:2rem; font-weight:700; color:var(--olive-bright); line-height:1; }
.stat-row .stat span { font-family:var(--font-mono); font-size:0.7rem; text-transform:uppercase; letter-spacing:0.1em; color:var(--text-muted); }

/* checklist (two-column feature lists) */
.check-list { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:1fr 1fr; gap:0.7rem 2rem; max-width:820px; margin:1.5rem auto 0; }
.check-list li { position:relative; padding-left:1.7rem; color:var(--text-dim); font-size:0.98rem; line-height:1.55; }
.check-list li::before { content:'▪'; position:absolute; left:0.2rem; color:var(--olive-bright); }

@media (max-width:900px){ .grid-3, .grid-4, .stat-row { grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .grid-2, .grid-3, .grid-4, .stat-row, .check-list { grid-template-columns:1fr; } .section { padding:3.4rem 0; } }

/* ===== use-case categories (Solutions page) ===== */
.uc-category { margin-bottom:3.6rem; }
.uc-category:last-child { margin-bottom:0; }
.uc-cat-head { text-align:center; max-width:640px; margin:0 auto 1.8rem; }
.uc-cat-head h2 { font-family:var(--font-display); font-size:clamp(1.35rem,2.8vw,1.85rem); font-weight:700; text-transform:uppercase; letter-spacing:0.03em; color:var(--text); margin-bottom:0.35rem; }
.uc-cat-head h2::after { content:''; display:block; width:44px; height:2px; background:var(--olive-bright); margin:0.6rem auto 0; }
.uc-cat-head p { color:var(--text-dim); font-size:0.98rem; }

/* ===== mobile render safety (Opera/older mobile shows SVG filters &
   backdrop-filter as white blobs) — disable them on touch devices;
   desktop keeps the full look ===== */
@media (pointer: coarse) {
  #hero-map * { filter: none !important; }
  .site-logo, .device-visual .dv-glyph { filter: none !important; }
  .navbar { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background: rgba(5,5,5,0.96) !important; }
  .nav-center { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
  .btn-explore { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background: rgba(10,10,10,0.9) !important; }
  .map-legend { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background: rgba(5,5,5,0.9) !important; }
  .mission-card { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background: #101010 !important; }
  .modal-overlay { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background: rgba(0,0,0,0.9) !important; }
}

/* ===== bright-yellow theme: dark text on filled (yellow) elements ===== */
.btn-primary, .btn-primary:hover { color:#0f0f0f; }
.login-btn:hover { color:#0f0f0f; }
.uc-chip.active { color:#0f0f0f; }
.user-msg .chat-bubble { color:#0f0f0f; }
.chat-send-btn { color:#0f0f0f; }
::selection { color:#0f0f0f; }

/* ===== journey timeline ===== */
.timeline { position:relative; max-width:820px; margin:2.5rem auto 0; }
.timeline::before { content:''; position:absolute; left:14px; top:6px; bottom:6px; width:2px; background:linear-gradient(var(--olive-bright),var(--olive-dim)); }
.tl-item { position:relative; padding-left:52px; padding-bottom:2.2rem; }
.tl-item:last-child { padding-bottom:0; }
.tl-item::before { content:''; position:absolute; left:6px; top:3px; width:18px; height:18px; border-radius:50%; background:var(--bg); border:2px solid var(--olive-bright); box-shadow:0 0 10px var(--olive-glow); }
.tl-phase { font-family:var(--font-mono); font-size:0.7rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--olive-light); margin-bottom:0.3rem; }
.tl-item h3 { font-family:var(--font-display); font-size:1.15rem; text-transform:uppercase; letter-spacing:0.02em; color:var(--text); margin-bottom:0.4rem; }
.tl-item p { color:var(--text-dim); line-height:1.65; }
@media (max-width:640px){ .tl-item { padding-left:44px; } }

/* =================================================================
   XO ATMOSPHERE — bright-yellow warmth · sensors · X·O motif · intelligence
   ================================================================= */
/* ambient yellow wash + faint X·O / sensor-ring texture across the whole site */
body {
  background-color: var(--bg);
  background-image:
    radial-gradient(1200px 640px at 90% -12%, rgba(255,212,0,0.10), transparent 60%),
    radial-gradient(1000px 640px at -10% 112%, rgba(230,188,0,0.07), transparent 60%),
    url("../images/xo-texture.png");
  background-repeat: no-repeat, no-repeat, repeat;
  background-position: right top, left bottom, top left;
  background-attachment: fixed, fixed, scroll;
}
/* let the texture read on opaque alternating sections too */
.section.alt { position:relative; }
.section.alt::before { content:''; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:0.55; background:url("../images/xo-texture.png") repeat; background-size:170px 170px; }
.section.alt > .container { position:relative; z-index:1; }

/* intelligence: soft yellow glow on accent words */
.page-header h1 em,
.section > .container > h2 em { text-shadow:0 0 24px rgba(255,212,0,0.35); }
.sp-hero h1, .hero-content h1 { text-shadow:0 0 34px rgba(255,212,0,0.16); }

/* sensors: faint radar-ring sweep in every page header */
.page-header { position:relative; overflow:hidden; }
.page-header::after { content:''; position:absolute; top:-90px; right:-90px; width:340px; height:340px; pointer-events:none; z-index:0;
  background:
    radial-gradient(circle, transparent 37%, rgba(255,212,0,0.07) 38.5%, transparent 40%),
    radial-gradient(circle, transparent 57%, rgba(255,212,0,0.055) 58.5%, transparent 60%),
    radial-gradient(circle, transparent 77%, rgba(255,212,0,0.04) 78.5%, transparent 80%); }
.page-header .container { position:relative; z-index:1; }

/* sensor "live" pulse dot before every eyebrow */
.ph-eyebrow::before { content:''; display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--olive-bright); box-shadow:0 0 9px var(--olive-bright); margin-right:0; vertical-align:middle; animation:pulse 2s infinite; }

/* X·O list markers */
.check-list li::before { font-size:0.82em; top:0.2em; }
.check-list li:nth-child(odd)::before  { content:'\25CB'; }   /* ○ */
.check-list li:nth-child(even)::before { content:'\2715'; }   /* ✕ */

/* ══════════════════════════════════════════════════════════════
   OTP / MODAL SUCCESS / BRAND LINKS — appended
   (Team-page CSS lives inline in templates/team.html — not here.)
   ══════════════════════════════════════════════════════════════ */

/* ── Brand links (SecuraSense → securasense.com) ───────────── */
.brand-link { color:var(--olive-light); text-decoration:none; border-bottom:1px solid rgba(230,188,0,0.32); transition:var(--transition); }
.brand-link:hover { color:var(--olive-bright); border-bottom-color:var(--olive-bright); }

/* ── Email OTP block ───────────────────────────────────────── */
.otp-block { background:var(--bg-3); border:1px solid var(--border); border-radius:var(--radius); padding:1rem 1.1rem; margin-bottom:1.1rem; transition:var(--transition); }
.otp-row { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.otp-label { font-size:0.85rem; color:var(--text); }
.otp-req { color:var(--olive-light); }
.btn-sm { padding:0.42rem 0.95rem; font-size:0.72rem; letter-spacing:0.05em; }
.otp-code-wrap { margin-top:0.85rem; }
.otp-code-wrap input { width:100%; font-family:var(--font-mono); font-size:1.15rem; letter-spacing:0.4em; text-align:center; padding:0.7rem; }
.otp-code-wrap input[readonly] { opacity:0.7; cursor:default; }
.otp-status { margin-top:0.6rem; font-size:0.78rem; min-height:1.1em; color:var(--text-muted); line-height:1.5; }
.otp-status.ok  { color:#4caf7d; }
.otp-status.err { color:#e2685c; }
.otp-verified .otp-block { border-color:rgba(76,175,125,0.55); background:rgba(76,175,125,0.06); }

/* ── Modal success panel ───────────────────────────────────── */
.modal-success { text-align:center; padding:3rem 2rem 2.6rem; }
.ms-tick svg { width:66px; height:66px; margin-bottom:1.3rem; }
.ms-tick circle { fill:none; stroke:#4caf7d; stroke-width:2; opacity:0.4; }
.ms-tick path { fill:none; stroke:#4caf7d; stroke-width:3.5; stroke-linecap:round; stroke-linejoin:round;
  stroke-dasharray:40; stroke-dashoffset:40; animation:msTick 0.55s 0.15s forwards cubic-bezier(0.4,0,0.2,1); }
@keyframes msTick { to { stroke-dashoffset:0; } }
.modal-success h2 { font-family:var(--font-display); font-size:1.5rem; text-transform:uppercase; letter-spacing:0.03em; color:var(--text); margin-bottom:0.75rem; }
.modal-success p { color:var(--text-dim); line-height:1.7; margin-bottom:1.9rem; font-size:0.92rem; }

/* ── Messages pinned to the top of the modal form ──────────── */
#form-messages-top:empty { display:none; }
#form-messages-top { margin-bottom:1.2rem; }
#form-messages-top .flash { display:flex; align-items:center; gap:8px; padding:0.85rem 1rem; border-radius:var(--radius); font-size:0.86rem; line-height:1.5; }

@media (max-width: 640px) {
  .otp-row { flex-direction:column; align-items:stretch; }
  .otp-row .btn-sm { width:100%; }
}

/* ══════════════════════════════════════════════════════════════
   MERGED PAGES — Research / About Us / Made in India / Partners
   ══════════════════════════════════════════════════════════════ */

/* ── Sticky in-page jump nav ───────────────────────────────── */
.research-jump { position:sticky; top:var(--nav-h); z-index:800; background:rgba(13,13,12,0.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--border-soft); }
.rj-nav { display:flex; gap:0.4rem; overflow-x:auto; padding:0.7rem 0; scrollbar-width:none; justify-content:center; flex-wrap:wrap; }
.rj-nav::-webkit-scrollbar { display:none; }
.rj-nav a { flex:0 0 auto; font-family:var(--font-mono); font-size:0.68rem; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--text-muted); text-decoration:none; padding:0.42rem 0.85rem; border:1px solid transparent; border-radius:100px; transition:var(--transition); white-space:nowrap; }
.rj-nav a:hover { color:var(--olive-bright); border-color:var(--border-bright); background:var(--bg-2); }
section[id], .section[id] { scroll-margin-top:calc(var(--nav-h) + 70px); }

/* ── Field report downloads ────────────────────────────────── */
.downloads-section { padding:70px 0; background:var(--bg-1); }
.dl-list { display:flex; flex-direction:column; gap:0.7rem; }
.dl-row { display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap;
  background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius); padding:1rem 1.2rem; transition:var(--transition); }
.dl-row:hover { border-color:var(--border-bright); }
.dl-name { color:var(--text); font-size:0.92rem; word-break:break-word; }
.dl-note { margin-top:1.2rem; color:var(--text-dim); font-size:0.86rem; }
.dl-note a { color:var(--olive-light); }

/* ── Join our research ─────────────────────────────────────── */
.join-research { padding:80px 0; background:var(--bg); border-top:1px solid var(--border-soft); }
.jr-reasons { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-bottom:2.6rem; }
.jr-reason { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius); padding:1.4rem 1.3rem; }
.jr-reason h3 { font-family:var(--font-display); font-size:1rem; font-weight:600; text-transform:uppercase; letter-spacing:0.03em; color:var(--olive-light); margin-bottom:0.5rem; }
.jr-reason p { font-size:0.84rem; color:var(--text-dim); line-height:1.6; margin:0; }
.jr-form-wrap { max-width:780px; margin:0 auto; background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-lg); padding:2rem 2rem 1.8rem; }
.jr-form .form-group { margin-bottom:1.1rem; }
.jr-alt { margin-top:1.1rem; color:var(--text-dim); font-size:0.85rem; }
.jr-alt a { color:var(--olive-light); }

/* ── Journey timeline on About Us ──────────────────────────── */
.journey-section { padding:70px 0; background:var(--bg-1); }
.believe-section { padding:70px 0; background:var(--bg); }

/* ── Regulatory cards ──────────────────────────────────────── */
.reg-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.2rem; }
.reg-card { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius); padding:1.7rem 1.6rem; transition:var(--transition); }
.reg-card:hover { border-color:var(--border-bright); }
.reg-card h3 { font-family:var(--font-display); font-size:1.05rem; font-weight:600; text-transform:uppercase; letter-spacing:0.03em; color:var(--olive-light); margin-bottom:0.6rem; }
.reg-card p { font-size:0.86rem; color:var(--text-dim); line-height:1.65; margin:0; }

/* 3-across variant of the discipline grid */
.disc-grid-3 { grid-template-columns:repeat(3,1fr); }

@media (max-width: 1024px) {
  .jr-reasons { grid-template-columns:1fr; }
  .disc-grid-3 { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 768px) {
  .reg-grid { grid-template-columns:1fr; }
  .research-jump { top:var(--nav-h); }
}
@media (max-width: 640px) {
  .disc-grid-3 { grid-template-columns:1fr; }
  .jr-form-wrap { padding:1.4rem 1.2rem 1.2rem; }
  .dl-row { flex-direction:column; align-items:stretch; }
}

/* ══════════════════════════════════════════════════════════════
   PROMOTED FROM templates/team.html — these are used by
   made-in-india.html and partners.html too, so they must be global.
   ══════════════════════════════════════════════════════════════ */
/* ══════════════════════════════════════════════════════════════
   TEAM PAGE — page-scoped styles.
   Loads after style.css, so these override the earlier .team-*
   rules (style.css ~408-415) by cascade. No global CSS edit needed.
   ══════════════════════════════════════════════════════════════ */

/* ── Quick facts strip ─────────────────────────────────────── */
.team-stats { padding:2.6rem 0; background:var(--bg-1); border-bottom:1px solid var(--border-soft); }
.ts-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; text-align:center; }
.ts-item { padding:0 0.5rem; }
.ts-num { font-family:var(--font-display); font-size:1.9rem; font-weight:700; color:var(--olive-bright); letter-spacing:0.02em; line-height:1.1; margin-bottom:0.35rem; }
.ts-label { font-family:var(--font-mono); font-size:0.68rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-muted); line-height:1.5; }

/* ── Leadership grid — centered, square photos ─────────────── */
.team-grid {
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 320px));
  gap:2rem;
  justify-content:center;
}
.team-card {
  background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-lg);
  padding:1.6rem 1.5rem 1.5rem; text-align:center; transition:var(--transition);
  display:flex; flex-direction:column; align-items:center;
}
.team-card:hover { border-color:var(--border-bright); transform:translateY(-4px); box-shadow:0 18px 45px rgba(0,0,0,0.55); }

.team-avatar {
  width:100%; aspect-ratio:1 / 1; height:auto;
  border-radius:var(--radius); margin:0 auto 1.3rem;
  overflow:hidden; position:relative;
  background:radial-gradient(circle at 40% 30%,rgba(230,188,0,0.35),var(--bg-3));
  border:1px solid var(--border-bright);
}
.team-avatar img { width:100%; height:100%; object-fit:cover; object-position:center 12%; display:block; transition:transform 0.4s cubic-bezier(0.4,0,0.2,1); }
.team-card:hover .team-avatar img { transform:scale(1.04); }

.team-card h3 { font-family:var(--font-display); font-size:1.25rem; font-weight:600; text-transform:uppercase; letter-spacing:0.03em; color:var(--text); margin-bottom:0.25rem; }
.team-card .tc-role { font-family:var(--font-mono); font-size:0.68rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--olive-light); margin-bottom:0.85rem; }
.team-card p { font-size:0.85rem; color:var(--text-dim); line-height:1.65; margin-bottom:1.1rem; }

/* expertise tags */
.tc-tags { display:flex; flex-wrap:wrap; gap:0.4rem; justify-content:center; margin-bottom:1.2rem; }
.tc-tags span {
  font-family:var(--font-mono); font-size:0.62rem; letter-spacing:0.05em; text-transform:uppercase;
  color:var(--text-muted); background:var(--bg-3); border:1px solid var(--border-soft);
  border-radius:100px; padding:0.28rem 0.7rem;
}

/* social icons */
.tc-social { margin-top:auto; display:flex; gap:0.6rem; justify-content:center; }
.tc-social a {
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:50%;
  border:1px solid var(--border); color:var(--text-dim);
  transition:var(--transition);
}
.tc-social a:hover { border-color:var(--olive-bright); color:var(--olive-bright); background:rgba(230,188,0,0.08); transform:translateY(-2px); }
.tc-social svg { width:16px; height:16px; fill:currentColor; }

/* ── Disciplines ───────────────────────────────────────────── */
.disciplines-section { padding:70px 0; background:var(--bg-1); }
.disc-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.disc-card { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius); padding:1.7rem 1.4rem; transition:var(--transition); text-align:center; }
.disc-card:hover { border-color:var(--border-bright); transform:translateY(-3px); }
.disc-num { font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.12em; color:var(--olive); margin-bottom:0.9rem; }
.disc-card h3 { font-family:var(--font-display); font-size:1.02rem; font-weight:600; text-transform:uppercase; letter-spacing:0.03em; color:var(--text); margin-bottom:0.5rem; }
.disc-card p { font-size:0.82rem; color:var(--text-dim); line-height:1.6; }

/* ── Where we build ────────────────────────────────────────── */
.location-section { padding:70px 0; background:var(--bg); }
.loc-inner { display:grid; grid-template-columns:1.15fr 0.85fr; gap:3rem; align-items:center; }
.loc-copy .section-label { margin-bottom:1rem; }
.loc-copy .section-title { margin-bottom:0.9rem; }
.loc-copy .section-desc { margin-bottom:1.6rem; }
.loc-facts { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.6rem 1.7rem; }
.lf-row { display:flex; justify-content:space-between; align-items:baseline; gap:1rem; padding:0.75rem 0; border-bottom:1px solid var(--border-soft); }
.lf-row:last-child { border-bottom:none; }
.lf-k { font-family:var(--font-mono); font-size:0.68rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-muted); white-space:nowrap; }
.lf-v { font-size:0.88rem; color:var(--text); text-align:right; }
.lf-v a { color:var(--olive-light); }
.lf-v a:hover { color:var(--olive-bright); }

/* ── Responsive ────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .team-grid { grid-template-columns:repeat(2, minmax(0, 320px)); }
  .disc-grid { grid-template-columns:repeat(2,1fr); }
  .ts-grid   { grid-template-columns:repeat(2,1fr); gap:1.8rem; }
}
@media (max-width: 768px) {
  .loc-inner { grid-template-columns:1fr; gap:2rem; }
  .loc-copy  { text-align:center; }
  .loc-copy .section-label { justify-content:center; }
}
@media (max-width: 640px) {
  .team-grid { grid-template-columns:minmax(0, 340px); }
  .disc-grid { grid-template-columns:1fr; }
  .ts-grid   { grid-template-columns:1fr; gap:1.5rem; }
  .team-avatar { max-width:280px; }
}

/* ══════════════════════════════════════════════════════════════
   MISSING SHARED CLASSES — referenced by templates but never
   defined. Forms and page-header leads were rendering unstyled.
   ══════════════════════════════════════════════════════════════ */

/* Form wrapper used by contact, register, apply, partners, research */
.contact-form { display:block; }
.contact-form .form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.contact-form .form-group { margin-bottom:1.1rem; }
.contact-form textarea { min-height:120px; resize:vertical; }
.contact-form > .btn { margin-top:0.4rem; }
.beta-form .form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }

/* Page-header lead paragraph — used on 8 pages, previously unstyled */
.ph-lead { max-width:680px; margin:0 auto; color:var(--text-dim); font-size:1.02rem; line-height:1.7; position:relative; }

/* Standalone form pages need to breathe */
.contact-form-page { max-width:760px; margin:0 auto; }

@media (max-width: 640px) {
  .contact-form .form-row,
  .beta-form .form-row { grid-template-columns:1fr; gap:0; }
}

/* ── Partners page: centred 3-card grids + centred form actions ───────────
   .disc-grid (4 cols) is declared after .disc-grid-3, so the 3-card grids were
   rendering as 3 of 4 columns and hugging the left edge. */
.disc-grid.disc-grid-3 { grid-template-columns:repeat(3,1fr); }
@media (max-width:820px){ .disc-grid.disc-grid-3 { grid-template-columns:minmax(0, 440px); justify-content:center; } }
body[data-page="partners"] .jr-form > .btn { display:flex; width:fit-content; margin:0.6rem auto 0; }
body[data-page="partners"] .jr-alt { text-align:center; }


/* ===== product cards: poster text now lives in HTML ===== */
.coverage-grid { grid-template-columns:repeat(3, minmax(0, 360px)); }
.coverage-card .banner-ph.cov { max-width:360px; }
.cov-tagline { font-family:var(--font-display); font-weight:600; font-size:1.05rem; letter-spacing:0.02em; color:var(--olive-bright); margin:0.1rem 0 0.55rem; }
.cov-block { width:100%; margin-top:1.1rem; }
.cov-label { font-family:var(--font-mono); font-size:0.62rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--text-muted); margin-bottom:0.55rem; }
.cov-chips { display:flex; flex-wrap:wrap; justify-content:center; gap:0.4rem; }
.cov-chip { font-family:var(--font-display); font-weight:600; font-size:0.86rem; letter-spacing:0.05em; color:var(--olive-light); border:1px solid var(--border-bright); background:rgba(230,188,0,0.06); padding:4px 12px; border-radius:100px; }
.cov-specs { display:flex; flex-wrap:wrap; justify-content:center; gap:0.5rem 1.1rem; margin-top:1rem; width:100%; }
.cov-spec { font-size:0.8rem; color:var(--text-dim); }
.cov-spec b { color:var(--text); font-family:var(--font-display); font-weight:700; letter-spacing:0.04em; font-size:0.92rem; }
.cov-ideal { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:0.5rem; }
.cov-ideal-item { display:flex; align-items:center; gap:0.5rem; text-align:left; font-size:0.82rem; color:var(--text); background:var(--bg-3); border:1px solid var(--border-soft); border-radius:8px; padding:0.5rem 0.7rem; }
.cov-ideal-item i { font-style:normal; font-size:1.05rem; }
@media (max-width:1024px){ .coverage-grid { grid-template-columns:repeat(3, minmax(0, 1fr)); gap:1.2rem; } }
@media (max-width:900px){ .coverage-grid { grid-template-columns:minmax(0, 360px); } }


/* ===== use-case meta: always ONE line per card (e.g. "XO Node · Indoor + Outdoor   Sensing · Full fusion") ===== */
.uc-card { container-type:inline-size; padding:1.9rem 1.6rem; }
.uc-card .uc-meta {
  display:flex; flex-wrap:nowrap; align-items:baseline; justify-content:space-between; gap:0.9em;
  white-space:nowrap; overflow:hidden;
  font-size:clamp(0.46rem, 3.35cqw, 0.66rem); letter-spacing:0.02em;
}
.uc-card .uc-meta > span { white-space:nowrap; min-width:0; }
@media (max-width:640px){ .uc-card .uc-meta { justify-content:flex-start; } }


/* ===== Community login / register — sleek two-panel layout ===== */
.auth-page { min-height:100vh; padding:calc(var(--nav-h) + 56px) 0 72px; background:
  radial-gradient(ellipse 70% 55% at 85% 0%, rgba(255,212,0,0.07), transparent 60%),
  radial-gradient(ellipse 60% 50% at 0% 100%, rgba(255,212,0,0.04), transparent 60%), var(--bg); }
.auth-shell { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,0.95fr); gap:3.2rem; align-items:center; max-width:1080px; }
.auth-eyebrow { font-family:var(--font-mono); font-size:0.7rem; letter-spacing:0.22em; text-transform:uppercase; color:var(--olive-light); margin-bottom:1rem; }
.auth-title { font-family:var(--font-display); font-size:clamp(2rem,4vw,3rem); font-weight:700; text-transform:uppercase; letter-spacing:0.03em; line-height:1.08; color:var(--text); margin:0 0 0.9rem; }
.auth-title em { font-style:normal; color:var(--olive-bright); text-shadow:0 0 24px rgba(255,212,0,0.3); }
.auth-sub { color:var(--text-dim); font-size:1rem; line-height:1.7; max-width:46ch; margin-bottom:1.6rem; }
.auth-benefits { list-style:none; margin:0 0 1.6rem; padding:0; display:grid; gap:0.9rem; }
.auth-benefits li { display:flex; gap:0.9rem; align-items:flex-start; }
.auth-benefits .ab-ico { flex:0 0 auto; width:38px; height:38px; display:grid; place-items:center; border:1px solid var(--border-bright); border-radius:10px; background:rgba(230,188,0,0.07); font-size:1.05rem; }
.auth-benefits b { display:block; font-family:var(--font-display); font-size:1.02rem; letter-spacing:0.03em; color:var(--text); }
.auth-benefits small { display:block; color:var(--text-dim); font-size:0.84rem; line-height:1.5; }
.auth-trial-note { border:1px dashed var(--border-bright); border-radius:var(--radius-lg); padding:1.1rem 1.2rem; background:rgba(255,255,255,0.02); max-width:46ch; }
.atn-head { display:flex; align-items:center; gap:0.6rem; flex-wrap:wrap; margin-bottom:0.45rem; }
.atn-head b { font-family:var(--font-display); font-size:1rem; letter-spacing:0.03em; color:var(--text); }
.atn-badge { font-family:var(--font-mono); font-size:0.58rem; letter-spacing:0.14em; text-transform:uppercase; color:#0f0f0f; background:var(--olive-bright); border-radius:100px; padding:2px 9px; }
.auth-trial-note p { color:var(--text-dim); font-size:0.84rem; line-height:1.6; margin:0 0 0.8rem; }
.auth-card { background:linear-gradient(180deg, var(--bg-2), var(--bg-1)); border:1px solid var(--border-bright); border-radius:18px; padding:2.2rem 2.1rem; box-shadow:0 24px 70px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,212,0,0.04) inset; }
.auth-pill { display:inline-block; font-family:var(--font-mono); font-size:0.6rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--olive-light); border:1px solid var(--border-bright); border-radius:100px; padding:4px 12px; margin-bottom:0.9rem; background:rgba(230,188,0,0.06); }
.auth-card-head h2 { font-family:var(--font-display); font-size:1.7rem; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; margin:0 0 0.3rem; color:var(--text); }
.auth-card-head p { color:var(--text-dim); font-size:0.9rem; margin:0 0 1.5rem; }
.auth-form .form-row { display:grid; grid-template-columns:1fr 1fr; gap:0.9rem; }
.auth-form .form-group { margin-bottom:1rem; }
.auth-form .form-group input { background:var(--bg); border-color:rgba(255,255,255,0.09); padding:0.8rem 1rem; border-radius:10px; }
.auth-form .btn-full { width:100%; justify-content:center; margin-top:0.4rem; }
.pw-wrap { position:relative; }
.pw-wrap input { padding-right:4.6rem !important; }
.pw-toggle { position:absolute; right:8px; top:50%; transform:translateY(-50%); background:none; border:0; color:var(--olive-light); font-family:var(--font-mono); font-size:0.64rem; letter-spacing:0.12em; text-transform:uppercase; cursor:pointer; padding:6px 8px; border-radius:6px; }
.pw-toggle:hover { background:rgba(230,188,0,0.1); }
.auth-alt { margin:1.1rem 0 0; text-align:center; color:var(--text-dim); font-size:0.88rem; }
.auth-alt a { color:var(--olive-bright); }
.auth-alt-dim { margin-top:0.5rem; font-size:0.8rem; color:var(--text-muted); }
.auth-alt-dim a { color:var(--olive-light); }
@media (max-width:900px){
  .auth-shell { grid-template-columns:1fr; gap:2rem; }
  .auth-side { order:2; } .auth-card { order:1; }
}
@media (max-width:560px){ .auth-card { padding:1.6rem 1.2rem; } .auth-form .form-row { grid-template-columns:1fr; gap:0; } }


/* trial modal: make it unmistakably the hardware trial */
.modal-kicker { display:inline-block; font-family:var(--font-mono); font-size:0.6rem; letter-spacing:0.16em; text-transform:uppercase; color:#0f0f0f; background:var(--olive-bright); border-radius:100px; padding:3px 11px; margin-bottom:0.7rem; }
.modal-note { margin-top:0.8rem; font-size:0.78rem; color:var(--text-muted); line-height:1.55; border-left:2px solid var(--border-bright); padding-left:0.7rem; }
.modal-note a { color:var(--olive-light); white-space:nowrap; }

/* ═══════════════ Signal to Decision — HUD signal bus ═══════════════ */
.sd2 { position:relative; overflow:hidden; padding:96px 0 90px; background:#040404; }
.sd2 .container { position:relative; z-index:1; max-width:1320px; }
.sd2-bg { position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(ellipse 60% 40% at 50% 0%, rgba(255,212,0,.13), transparent 70%),
    radial-gradient(ellipse 50% 40% at 90% 85%, rgba(255,212,0,.07), transparent 70%),
    linear-gradient(rgba(255,212,0,.045) 1px, transparent 1px) 0 0/44px 44px,
    linear-gradient(90deg, rgba(255,212,0,.045) 1px, transparent 1px) 0 0/44px 44px;
  -webkit-mask-image:linear-gradient(180deg,#000 55%,transparent); mask-image:linear-gradient(180deg,#000 55%,transparent); }
.sd2 .ic { width:1.2em; height:1.2em; fill:none; stroke:currentColor; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; flex:0 0 auto; }

/* telemetry bar */
.sd2-tele { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); margin:2.2rem auto 3.2rem; max-width:1080px; border:1px solid rgba(255,212,0,.22); border-radius:16px; background:linear-gradient(180deg,rgba(255,212,0,.06),rgba(255,255,255,.015)); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); overflow:hidden; }
.sd2-tele > div { padding:1.1rem .6rem 1rem; text-align:center; position:relative; }
.sd2-tele > div + div::before { content:''; position:absolute; left:0; top:22%; bottom:22%; width:1px; background:linear-gradient(180deg,transparent,rgba(255,212,0,.35),transparent); }
.sd2-tele .ic { width:22px; height:22px; color:var(--olive-bright); filter:drop-shadow(0 0 6px rgba(255,212,0,.6)); }
.sd2-tele b { display:block; font-family:var(--font-display); font-size:clamp(1.25rem,2.2vw,1.75rem); line-height:1.15; color:#fff; letter-spacing:.02em; margin-top:.25rem; }
.sd2-tele b small { font-size:.55em; color:var(--olive-bright); margin-left:2px; letter-spacing:.08em; text-transform:uppercase; }
.sd2-tele span { display:block; font-family:var(--font-mono); font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; color:var(--text-muted); margin-top:.2rem; }

/* the bus */
.sd2-bus { position:relative; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.1rem; padding-top:30px; }
.sd2-line { position:absolute; left:0; right:0; top:22px; height:2px; z-index:0;
  background:linear-gradient(90deg,transparent,rgba(255,212,0,.65) 8%,rgba(255,212,0,.65) 92%,transparent);
  box-shadow:0 0 14px rgba(255,212,0,.55); }
.sd2-line .pk { position:absolute; top:-3px; left:-6%; width:64px; height:8px; border-radius:8px; background:linear-gradient(90deg,transparent,#fff 80%); box-shadow:0 0 14px 3px rgba(255,212,0,.9); opacity:0; animation:sd2Run 6s linear infinite; }
.sd2-line .pk:nth-child(2){ animation-delay:1.5s } .sd2-line .pk:nth-child(3){ animation-delay:3s } .sd2-line .pk:nth-child(4){ animation-delay:4.5s }
.sd2-st { position:relative; z-index:1; display:flex; flex-direction:column; align-items:stretch; min-width:0; }
.sd2-pin { align-self:center; width:46px; height:46px; margin-top:-30px; margin-bottom:.9rem; display:grid; place-items:center; border-radius:50%; background:#060606; border:1.5px solid var(--olive-bright); box-shadow:0 0 0 5px rgba(255,212,0,.08), 0 0 22px rgba(255,212,0,.55); position:relative; }
.sd2-pin::after { content:''; position:absolute; inset:-9px; border-radius:50%; border:1px solid rgba(255,212,0,.45); animation:sd2Ping 2.8s ease-out infinite; }
.sd2-pin span { font-family:var(--font-mono); font-weight:700; font-size:.78rem; letter-spacing:.06em; color:var(--olive-bright); }

.sd2-card { position:relative; flex:1; display:flex; flex-direction:column; gap:.85rem; padding:1.25rem 1.15rem 1.1rem; border-radius:16px; border:1px solid rgba(255,212,0,.2);
  background:linear-gradient(165deg,rgba(255,212,0,.08),rgba(255,255,255,.02) 38%,rgba(0,0,0,.45));
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); transition:border-color .3s, box-shadow .3s, transform .3s; }
.sd2-card::before, .sd2-card::after { content:''; position:absolute; width:16px; height:16px; border:2px solid var(--olive-bright); opacity:.85; pointer-events:none; }
.sd2-card::before { top:-1px; left:-1px; border-right:0; border-bottom:0; border-top-left-radius:16px; }
.sd2-card::after { bottom:-1px; right:-1px; border-left:0; border-top:0; border-bottom-right-radius:16px; }
.sd2-st:hover .sd2-card { border-color:rgba(255,212,0,.55); box-shadow:0 0 34px rgba(255,212,0,.14); transform:translateY(-3px); }
.sd2-core .sd2-card { border-color:rgba(255,212,0,.5); background:radial-gradient(ellipse at 50% 0%,rgba(255,212,0,.2),rgba(255,255,255,.02) 55%,rgba(0,0,0,.5)); box-shadow:0 0 40px rgba(255,212,0,.16); }
.sd2-code { font-family:var(--font-mono); font-size:.58rem; letter-spacing:.2em; color:var(--olive-light); opacity:.8; }
.sd2-card h3 { font-family:var(--font-display); font-size:1.6rem; line-height:1; text-transform:uppercase; letter-spacing:.05em; color:#fff; margin:-.35rem 0 0; }
.sd2-sub { margin:-.55rem 0 0; font-size:.78rem; color:var(--olive-light); letter-spacing:.02em; }
.sd2-text { margin:0; font-size:.82rem; line-height:1.6; color:var(--text-dim); }
.sd2-tags { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:auto; }
.sd2-tags span { display:inline-flex; align-items:center; gap:.4rem; font-size:.7rem; color:var(--olive-light); border:1px solid rgba(255,212,0,.25); background:rgba(255,212,0,.06); border-radius:100px; padding:4px 10px 4px 8px; }
.sd2-tags .ic { width:13px; height:13px; }
.sd2-tags i { font-style:normal; }

/* photos */
.sd2-photos { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.5rem; }
.sd2-photos figure { position:relative; margin:0; aspect-ratio:3/4; border-radius:10px; overflow:hidden; border:1px solid rgba(255,212,0,.25); background:#0a0a0a; }
.sd2-photos img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s ease; }
.sd2-st:hover .sd2-photos img { transform:scale(1.07); }
.sd2-photos figure::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.85)); }
.sd2-photos figcaption { position:absolute; z-index:1; left:0; right:0; bottom:.35rem; text-align:center; font-family:var(--font-mono); font-size:.52rem; letter-spacing:.14em; text-transform:uppercase; color:#fff; }

/* networks */
.sd2-nets { list-style:none; margin:0; padding:0; display:grid; gap:.5rem; }
.sd2-nets li { display:flex; align-items:center; gap:.65rem; padding:.55rem .65rem; border-radius:11px; border:1px solid rgba(255,255,255,.07); background:rgba(0,0,0,.35); }
.sd2-ico { width:34px; height:34px; flex:0 0 34px; display:grid; place-items:center; border-radius:9px; border:1px solid rgba(255,212,0,.4); background:rgba(255,212,0,.08); color:var(--olive-bright); }
.sd2-ico .ic { width:18px; height:18px; }
.sd2-nets div { min-width:0; flex:1; }
.sd2-nets b { display:block; font-size:.84rem; color:#fff; font-weight:600; }
.sd2-nets em { display:block; font-style:normal; font-size:.7rem; color:var(--text-muted); }
.sd2-led { width:8px; height:8px; border-radius:50%; background:#5ee08a; box-shadow:0 0 8px #5ee08a; animation:sd2Blink 2.4s ease-in-out infinite; }
.sd2-nets li:nth-child(2) .sd2-led{ animation-delay:.5s } .sd2-nets li:nth-child(3) .sd2-led{ animation-delay:1s }

/* reactor */
.sd2-reactor { position:relative; width:100%; max-width:300px; aspect-ratio:1; margin:.2rem auto; }
.sd2-reactor svg { width:100%; height:100%; display:block; overflow:visible; }
.sd2-reactor .r { transform-box:fill-box; transform-origin:center; }
.sd2-reactor .r1 { animation:sd2Spin 36s linear infinite; }
.sd2-reactor .r2 { animation:sd2Spin 22s linear infinite reverse; }
.sd2-reactor .r3 { animation:sd2Spin 16s linear infinite; }
.sd2-reactor .beat { transform-box:fill-box; transform-origin:center; animation:sd2Beat 2.4s ease-out infinite; }
.sd2-reactor .rt { position:absolute; display:inline-flex; align-items:center; gap:.3rem; font-family:var(--font-mono); font-size:.55rem; letter-spacing:.12em; text-transform:uppercase; color:#fff; background:rgba(0,0,0,.7); border:1px solid rgba(255,212,0,.45); border-radius:100px; padding:3px 8px 3px 6px; white-space:nowrap; backdrop-filter:blur(4px); }
.sd2-reactor .rt .ic { width:12px; height:12px; color:var(--olive-bright); }
.sd2-reactor .rt i { font-style:normal; }
.sd2-reactor .t1 { top:2%; left:50%; transform:translateX(-50%); }
.sd2-reactor .t2 { top:50%; right:-2%; transform:translateY(-50%); }
.sd2-reactor .t3 { bottom:2%; left:50%; transform:translateX(-50%); }
.sd2-reactor .t4 { top:50%; left:-2%; transform:translateY(-50%); }
.sd2-where { display:grid; gap:.4rem; margin-top:auto; }
.sd2-where span { display:flex; align-items:center; gap:.5rem; font-size:.72rem; color:var(--olive-light); border:1px solid rgba(255,212,0,.3); border-radius:10px; padding:.45rem .65rem; background:rgba(255,212,0,.05); }
.sd2-where span.on { background:var(--olive-bright); color:#0b0b0b; font-weight:700; border-color:var(--olive-bright); }
.sd2-where i { font-style:normal; }

/* alert */
.sd2-alert { border:1px solid rgba(255,212,0,.4); border-radius:14px; overflow:hidden; background:#070707; box-shadow:0 10px 30px rgba(0,0,0,.6), 0 0 24px rgba(255,212,0,.08); }
.sd2-alert .top { display:flex; align-items:center; gap:.5rem; padding:.5rem .75rem; background:rgba(255,212,0,.1); border-bottom:1px solid rgba(255,212,0,.2); }
.sd2-alert .top b { font-family:var(--font-display); font-size:.86rem; letter-spacing:.06em; text-transform:uppercase; color:var(--olive-bright); }
.sd2-alert .top em { margin-left:auto; font-style:normal; font-family:var(--font-mono); font-size:.5rem; letter-spacing:.14em; text-transform:uppercase; color:var(--text-muted); border:1px solid rgba(255,255,255,.12); border-radius:100px; padding:1px 7px; }
.sd2-alert .live { width:9px; height:9px; border-radius:50%; background:#ff5d4d; animation:sd2Live 1.8s ease-out infinite; }
.sd2-alert p { margin:0; padding:.75rem .8rem .5rem; font-size:.82rem; line-height:1.55; color:#fff; }
.sd2-alert .meter { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:.5rem; padding:.2rem .8rem .5rem; font-family:var(--font-mono); font-size:.55rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text-muted); }
.sd2-alert .bar { height:6px; border-radius:6px; background:#1a1a1a; overflow:hidden; }
.sd2-alert .bar i { display:block; width:94%; height:100%; border-radius:6px; background:linear-gradient(90deg,var(--olive),#fff3a0); animation:sd2Fill 2.6s ease-out both; box-shadow:0 0 10px rgba(255,212,0,.7); }
.sd2-alert .meter b { font-family:var(--font-display); font-size:1rem; color:var(--olive-bright); letter-spacing:.03em; }
.sd2-alert .row { display:flex; align-items:center; gap:.5rem; padding:.45rem .8rem; font-size:.74rem; color:var(--text-dim); border-top:1px solid rgba(255,255,255,.06); }
.sd2-alert .row .ic { width:15px; height:15px; color:var(--olive-light); }
.sd2-alert .row.act { color:var(--olive-light); background:rgba(255,212,0,.05); }

/* latency */
.sd2-lat { margin-top:2.4rem; padding:1.15rem 1.3rem 1rem; border:1px solid rgba(255,212,0,.2); border-radius:16px; background:linear-gradient(180deg,rgba(255,212,0,.05),rgba(255,255,255,.01)); }
.sd2-lat .head { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:.4rem 1rem; margin-bottom:.85rem; }
.sd2-lat .head span { display:inline-flex; align-items:center; gap:.5rem; color:var(--olive-bright); }
.sd2-lat .head b { font-family:var(--font-display); font-size:1.05rem; letter-spacing:.05em; text-transform:uppercase; color:#fff; }
.sd2-lat .head em { font-style:normal; font-size:.7rem; color:var(--text-muted); }
.sd2-lat .bar { position:relative; display:flex; gap:4px; height:46px; overflow:hidden; border-radius:10px; }
.sd2-lat .seg { display:grid; place-items:center; padding:0 .3rem; text-align:center; font-family:var(--font-mono); font-size:.62rem; letter-spacing:.08em; text-transform:uppercase; font-weight:700; color:var(--olive-light); background:repeating-linear-gradient(135deg,rgba(255,212,0,.18) 0 6px,rgba(255,212,0,.08) 6px 12px); border:1px solid rgba(255,212,0,.3); border-radius:8px; }
.sd2-lat .seg.hot { background:linear-gradient(180deg,#FFE04D,#E6BC00); color:#0b0b0b; border-color:#FFD400; box-shadow:0 0 22px rgba(255,212,0,.5); }
.sd2-lat .run { position:absolute; top:0; bottom:0; left:-60px; width:60px; background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent); animation:sd2Sweep 3s ease-in-out infinite; pointer-events:none; }
.sd2-lat .foot { display:flex; justify-content:space-between; align-items:center; margin-top:.5rem; font-family:var(--font-mono); font-size:.6rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text-muted); }
.sd2-lat .foot b { color:var(--olive-light); font-weight:600; }

/* topologies */
.sd2-th { text-align:center; margin:3.2rem 0 1.3rem; }
.sd2-th h3 { font-family:var(--font-display); font-size:clamp(1.5rem,3vw,1.9rem); text-transform:uppercase; letter-spacing:.05em; color:#fff; margin:0 0 .2rem; }
.sd2-th p { margin:0; font-size:.9rem; color:var(--text-dim); }
.sd2-topos { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.1rem; }
.sd2-topo { display:flex; flex-direction:column; gap:.9rem; padding:1.1rem; border-radius:16px; border:1px solid rgba(255,212,0,.2); background:linear-gradient(165deg,rgba(255,212,0,.07),rgba(0,0,0,.4)); transition:border-color .3s, transform .3s; }
.sd2-topo:hover { border-color:rgba(255,212,0,.55); transform:translateY(-3px); }
.sd2-topo .who { display:flex; align-items:center; gap:.85rem; }
.sd2-topo .who img { width:60px; height:76px; flex:0 0 60px; object-fit:cover; border-radius:10px; border:1px solid rgba(255,212,0,.3); }
.sd2-topo .who b { display:block; font-family:var(--font-display); font-size:1.12rem; line-height:1.15; color:#fff; letter-spacing:.03em; }
.sd2-topo .who small { display:block; margin-top:.25rem; font-family:var(--font-mono); font-size:.58rem; letter-spacing:.1em; text-transform:uppercase; color:var(--olive-light); }
.sd2-topo .path { display:flex; align-items:center; gap:.3rem; padding:.8rem .7rem .6rem; border-radius:11px; background:#060606; border:1px solid rgba(255,255,255,.07); }
.sd2-topo .n { display:flex; flex-direction:column; align-items:center; gap:.25rem; color:var(--olive-bright); min-width:0; }
.sd2-topo .n .ic { width:26px; height:26px; filter:drop-shadow(0 0 6px rgba(255,212,0,.6)); }
.sd2-topo .n i { font-style:normal; font-family:var(--font-mono); font-size:.55rem; letter-spacing:.1em; text-transform:uppercase; color:var(--text-dim); }
.sd2-topo .a { flex:1; min-width:10px; height:2px; margin-bottom:1rem; background:repeating-linear-gradient(90deg,var(--olive-bright) 0 5px,transparent 5px 10px); background-size:200% 100%; animation:flowDash 1s linear infinite; }
.sd2-topo p { margin:0; font-size:.8rem; line-height:1.55; color:var(--text-dim); }

@keyframes sd2Run { 0%{ left:-6%; opacity:0 } 6%{ opacity:1 } 94%{ opacity:1 } 100%{ left:104%; opacity:0 } }
@keyframes sd2RunV { 0%{ top:-3%; opacity:0 } 6%{ opacity:1 } 88%{ opacity:1 } 100%{ top:93%; opacity:0 } }
@keyframes sd2Ping { 0%{ transform:scale(.85); opacity:.9 } 80%,100%{ transform:scale(1.35); opacity:0 } }
@keyframes sd2Spin { to { transform:rotate(360deg) } }
@keyframes sd2Beat { 0%{ transform:scale(1); opacity:.9 } 100%{ transform:scale(1.55); opacity:0 } }
@keyframes sd2Blink { 0%,100%{ opacity:1 } 50%{ opacity:.35 } }
@keyframes sd2Live { 0%{ box-shadow:0 0 0 0 rgba(255,93,77,.7) } 80%,100%{ box-shadow:0 0 0 9px rgba(255,93,77,0) } }
@keyframes sd2Fill { from { width:0 } }
@keyframes sd2Sweep { 0%{ left:-60px } 70%,100%{ left:100% } }

/* ── laptop: 4-up with tighter cards ── */
@media (max-width:1280px) { .sd2-card { padding:1.1rem .95rem 1rem; } .sd2-card h3 { font-size:1.45rem; } .sd2-text { font-size:.78rem; } }

/* ── tablet & phone: vertical timeline ── */
@media (max-width:1099px) {
  .sd2 { padding:78px 0 70px; }
  .sd2-tele { grid-template-columns:repeat(5,minmax(0,1fr)); }
  .sd2-bus { grid-template-columns:1fr; gap:1.4rem; padding:0 0 0 62px; max-width:760px; margin:0 auto; }
  .sd2-line { left:22px; right:auto; top:0; bottom:0; width:2px; height:auto; background:linear-gradient(180deg,transparent,rgba(255,212,0,.65) 5%,rgba(255,212,0,.65) 95%,transparent); }
  .sd2-line .pk { left:-3px; top:-6%; width:8px; height:64px; background:linear-gradient(180deg,transparent,#fff 80%); animation-name:sd2RunV; }
  .sd2-pin { position:absolute; left:-62px; top:.8rem; margin:0; align-self:auto; }
  .sd2-card h3 { font-size:1.55rem; }
  .sd2-photos { max-width:380px; }
  .sd2-topos { grid-template-columns:1fr; max-width:760px; margin:0 auto; }
  .sd2-lat { max-width:760px; margin-left:auto; margin-right:auto; }
}
@media (max-width:700px) {
  .sd2-tele { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .sd2-tele > div:nth-child(4)::before { display:none; }
  .sd2-tele > div:nth-child(n+4) { border-top:1px solid rgba(255,212,0,.15); }
}
@media (max-width:560px) {
  .sd2-tele { grid-template-columns:repeat(2,minmax(0,1fr)); margin-bottom:2.4rem; }
  .sd2-tele > div:nth-child(n+3) { border-top:1px solid rgba(255,212,0,.15); }
  .sd2-tele > div:nth-child(odd)::before { display:none; }
  .sd2-tele > div:last-child { grid-column:1 / -1; }
  .sd2-bus { padding-left:50px; }
  .sd2-line { left:16px; }
  .sd2-pin { left:-50px; width:36px; height:36px; }
  .sd2-pin span { font-size:.66rem; }
  .sd2-lat .seg { font-size:.5rem; letter-spacing:.02em; padding:0 .1rem; }
  .sd2-lat .bar { height:54px; }
  .sd2-reactor { max-width:250px; }
  .sd2-reactor .rt { font-size:.5rem; padding:2px 6px 2px 5px; }
}
@media (prefers-reduced-motion: reduce) {
  .sd2-line .pk, .sd2-pin::after, .sd2-reactor .r, .sd2-reactor .beat, .sd2-led, .sd2-alert .live, .sd2-alert .bar i, .sd2-lat .run, .sd2-topo .a { animation:none !important; }
  .sd2-line .pk { opacity:0; }
}

/* live readouts that keep the four cards balanced */
.sd2-viz { margin-top:auto; padding:.7rem .75rem .75rem; border-radius:11px; border:1px solid rgba(255,255,255,.07); background:rgba(0,0,0,.4); }
.sd2-viz + .sd2-tags { margin-top:0; }
.sd2-viz .lbl { display:block; font-family:var(--font-mono); font-size:.52rem; letter-spacing:.18em; text-transform:uppercase; color:var(--text-muted); margin-bottom:.5rem; }
.sd2-viz .eq { display:flex; align-items:flex-end; gap:3px; height:34px; }
.sd2-viz .eq i { flex:1; min-width:2px; height:100%; border-radius:2px; background:linear-gradient(180deg,#FFE04D,rgba(255,212,0,.25)); transform-origin:bottom; animation:sd2Eq 1.6s ease-in-out infinite; }
.sd2-viz .eq i:nth-child(3n){ animation-duration:1.1s; animation-delay:-.4s } .sd2-viz .eq i:nth-child(3n+1){ animation-duration:1.9s; animation-delay:-.9s } .sd2-viz .eq i:nth-child(5n){ animation-duration:1.35s; animation-delay:-.2s }
.sd2-viz .fo { display:flex; align-items:center; gap:.4rem; }
.sd2-viz .fo b { width:12px; height:12px; border-radius:50%; flex:0 0 12px; border:2px solid var(--olive-bright); }
.sd2-viz .fo b.on { background:var(--olive-bright); box-shadow:0 0 10px rgba(255,212,0,.8); }
.sd2-viz .fo b.off { border-style:dashed; opacity:.7; }
.sd2-viz .fo u { flex:0 0 22px; height:2px; background:repeating-linear-gradient(90deg,var(--olive-bright) 0 4px,transparent 4px 8px); background-size:200% 100%; animation:flowDash 1s linear infinite; }
.sd2-viz .fo em { margin-left:auto; font-style:normal; font-size:.68rem; color:var(--olive-light); text-align:right; }
.sd2-viz .dl { list-style:none; margin:0; padding:0; display:flex; align-items:center; }
.sd2-viz .dl li { flex:1; display:flex; align-items:center; gap:.4rem; position:relative; font-size:.68rem; color:var(--text-dim); min-width:0; }
.sd2-viz .dl li i { width:12px; height:12px; flex:0 0 12px; border-radius:50%; background:var(--olive-bright); box-shadow:0 0 10px rgba(255,212,0,.8); z-index:1; }
.sd2-viz .dl li:not(.last)::after { content:''; flex:1; height:2px; margin:0 .35rem; background:repeating-linear-gradient(90deg,var(--olive-bright) 0 4px,transparent 4px 8px); background-size:200% 100%; animation:flowDash 1s linear infinite; }
.sd2-viz .dl li.last { flex:0 0 auto; }
.sd2-viz .dl li span { white-space:nowrap; }
.sd2-viz .dl li:not(.last) span { position:absolute; top:16px; left:0; }
.sd2-viz .dl { padding-bottom:1rem; }
@keyframes sd2Eq { 0%,100%{ transform:scaleY(.2) } 50%{ transform:scaleY(1) } }
@media (prefers-reduced-motion: reduce) { .sd2-viz .eq i, .sd2-viz .fo u, .sd2-viz .dl li::after { animation:none !important; } .sd2-viz .eq i { transform:scaleY(.6); } }

@media (max-width:560px){ .sd2-lat .head b{ font-size:.95rem } .sd2-lat{ margin-top:2rem } }

/* ── Join / community page ─────────────────────────────────── */
.join-brand { display:flex; align-items:center; gap:0.8rem; margin-bottom:1rem; }
.join-brand img { width:56px; height:56px; object-fit:contain; filter:drop-shadow(0 0 14px rgba(254,203,3,0.35)); }
.join-brand .auth-eyebrow { margin:0; }
.join-steps { display:flex; flex-wrap:wrap; gap:0.6rem; margin:0 0 1.5rem; }
.join-steps div { display:flex; align-items:center; gap:0.55rem; font-size:0.82rem; color:var(--text-dim); border:1px solid var(--border-bright); border-radius:100px; padding:0.35rem 0.9rem 0.35rem 0.4rem; background:rgba(255,255,255,0.02); }
.join-steps b { width:22px; height:22px; display:grid; place-items:center; border-radius:50%; background:#FECB03; color:#0E0E0E; font-size:0.72rem; }
.auth-logo { display:block; width:52px; height:52px; object-fit:contain; margin:0 0 0.8rem; }
.auth-tabs { display:grid; grid-template-columns:1fr 1fr; gap:4px; padding:4px; margin:0 0 1.5rem; border:1px solid var(--border-bright); border-radius:12px; background:var(--bg); }
.auth-tabs button { font:inherit; font-family:var(--font-display); letter-spacing:0.05em; text-transform:uppercase; font-size:0.9rem; padding:0.65rem; border:0; border-radius:9px; background:transparent; color:var(--text-dim); cursor:pointer; transition:all .2s; }
.auth-tabs button.on { background:#FECB03; color:#0E0E0E; font-weight:700; }
.auth-pane { display:none; }
#join-card[data-tab="register"] .auth-pane[data-pane="register"], #join-card[data-tab="login"] .auth-pane[data-pane="login"] { display:block; }

/* Join — last item in the main menu, bright yellow */
.nav-join { background:#FECB03 !important; color:#0E0E0E !important; font-weight:700; border-radius:100px; padding:0.5rem 1.2rem !important; box-shadow:0 0 0 0 rgba(254,203,3,0.5); transition:transform .2s, box-shadow .2s; }
.nav-join:hover { transform:translateY(-1px); box-shadow:0 6px 22px rgba(254,203,3,0.45); color:#0E0E0E !important; }
.nav-join.active { box-shadow:0 0 0 2px rgba(254,203,3,0.45); }
.nav-signout { opacity:0.85; }
@media (max-width:900px){ .nav-center .nav-join { display:inline-flex !important; width:auto; margin:0.9rem 0.2rem 0.4rem; justify-content:center; } }

/* Modal / login brand mark */
.modal-logo { display:block; width:54px; height:54px; object-fit:contain; margin:0 0 0.7rem; filter:drop-shadow(0 0 14px rgba(254,203,3,0.35)); }

/* SecuraSense brand mark */
.ss-brand { display:flex; align-items:center; gap:0.9rem; margin:0 0 1rem; }
.ss-brand img { height:44px; width:auto; display:block; }
.footer-social { display:flex; gap:0.6rem; margin-top:1rem; }
.footer-social a { display:inline-flex; align-items:center; gap:0.45rem; font-size:0.78rem; padding:0.4rem 0.8rem; border:1px solid var(--border-bright); border-radius:100px; color:var(--text-dim); transition:all .2s; }
.footer-social a:hover { color:#0E0E0E; background:#FECB03; border-color:#FECB03; }
.footer-social svg { width:14px; height:14px; fill:currentColor; }

/* ── About Us: vision, company, capability ─────────────────── */
.about-vision { padding:4.5rem 0 3rem; }
.about-vision .container { max-width:1120px; }
.av-lead { max-width:820px; margin:0 auto 2.6rem; text-align:center; }
.av-lead .section-title { margin-bottom:1.2rem; }
.av-lead p { color:var(--text-dim); font-size:1.08rem; line-height:1.8; margin:0 0 1rem; }
.av-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.3rem; }
.av-card { position:relative; border:1px solid var(--border-bright); border-radius:var(--radius-lg,16px); padding:1.8rem 1.6rem; background:linear-gradient(180deg,var(--bg-2),var(--bg-1)); transition:transform .25s, border-color .25s; }
.av-card:hover { transform:translateY(-3px); border-color:#FECB03; }
.av-ico { width:46px; height:46px; display:grid; place-items:center; font-size:1.3rem; border-radius:12px; background:rgba(254,203,3,0.1); border:1px solid var(--border-bright); margin-bottom:1rem; }
.av-card h3 { font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.04em; font-size:1.2rem; margin:0 0 0.6rem; color:var(--text); }
.av-card p { color:var(--text-dim); font-size:0.95rem; line-height:1.75; margin:0; }
.av-ss { display:inline-block; margin-top:1rem; padding:0.5rem 0.9rem; border:1px solid var(--border-bright); border-radius:10px; background:rgba(255,255,255,0.03); }
.av-ss img { display:block; height:26px; width:auto; }
.av-points { list-style:none; margin:2rem 0 0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; }
.av-points li { border-left:2px solid #FECB03; padding:0.2rem 0 0.2rem 0.9rem; }
.av-points b { display:block; font-family:var(--font-display); letter-spacing:0.03em; color:var(--text); margin-bottom:0.2rem; }
.av-points span { color:var(--text-dim); font-size:0.86rem; line-height:1.55; }
@media (max-width:900px){ .av-grid { grid-template-columns:1fr; } .av-points { grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .av-points { grid-template-columns:1fr; } .about-vision { padding:3rem 0 2rem; } }

/* ── Tagline: One Intelligence. Every Space. ───────────────── */
.hero-tagline { display:flex; align-items:center; justify-content:center; gap:1rem; margin:1.4rem auto 0; font-family:var(--font-mono); font-size:clamp(0.68rem,1.5vw,0.86rem); font-weight:600; letter-spacing:0.34em; text-transform:uppercase; color:#FECB03; text-shadow:0 0 18px rgba(254,203,3,0.45); }
.hero-tagline .ht-line { display:block; width:clamp(28px,7vw,84px); height:1px; background:linear-gradient(90deg,transparent,#FECB03); }
.hero-tagline .ht-line:last-child { background:linear-gradient(90deg,#FECB03,transparent); }
.footer-tagline { margin:0.2rem 0 0.9rem; font-family:var(--font-mono); font-size:0.7rem; font-weight:600; letter-spacing:0.22em; text-transform:uppercase; color:#FECB03; }
.ph-tagline { font-family:var(--font-mono); font-size:0.72rem; font-weight:600; letter-spacing:0.3em; text-transform:uppercase; color:#FECB03; margin:0 0 0.9rem; opacity:0.9; }
@media (max-width:560px){ .hero-tagline { letter-spacing:0.2em; gap:0.6rem; } }
.av-ss-text { font-family:var(--font-display); letter-spacing:0.04em; font-weight:700; color:#FECB03; }
.av-ss-text i { font-style:normal; margin-left:0.3rem; }
.av-ss img { height:30px; width:auto; }

/* ── How It Works: simple four-step flow ───────────────────── */
.flow-simple { padding:4.5rem 0; border-top:1px solid var(--border); }
.fs-row { position:relative; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.4rem; margin-top:2.4rem; }
.fs-row::before { content:""; position:absolute; left:12%; right:12%; top:34px; height:2px; background:linear-gradient(90deg,rgba(254,203,3,.15),rgba(254,203,3,.55),rgba(254,203,3,.15)); }
.fs-row::after { content:""; position:absolute; top:30px; left:12%; width:10px; height:10px; border-radius:50%; background:#FECB03; box-shadow:0 0 14px #FECB03; animation:fs-dot 5s ease-in-out infinite; }
@keyframes fs-dot { 0%{left:12%;opacity:0} 10%{opacity:1} 90%{opacity:1} 100%{left:calc(88% - 10px);opacity:0} }
.fs-step { position:relative; text-align:center; padding:0 0.4rem; }
.fs-ic { position:relative; width:70px; height:70px; margin:0 auto 1.1rem; display:grid; place-items:center; font-size:1.7rem; border-radius:50%; background:var(--bg-2); border:1.5px solid #FECB03; z-index:1; }
.fs-n { position:absolute; right:-6px; top:-6px; width:24px; height:24px; display:grid; place-items:center; font-family:var(--font-mono); font-size:0.72rem; font-weight:700; border-radius:50%; background:#FECB03; color:#0E0E0E; }
.fs-step h3 { font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.05em; font-size:1.25rem; margin:0 0 0.2rem; color:var(--text); }
.fs-sub { font-family:var(--font-mono); font-size:0.7rem; letter-spacing:0.1em; text-transform:uppercase; color:#FECB03; margin:0 0 0.7rem !important; }
.fs-step p { color:var(--text-dim); font-size:0.92rem; line-height:1.65; margin:0; }
.fs-notes { list-style:none; margin:2.6rem 0 0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.fs-notes li { text-align:center; border:1px solid var(--border-bright); border-radius:14px; padding:1rem; background:rgba(255,255,255,0.02); }
.fs-notes b { display:block; font-family:var(--font-display); letter-spacing:0.04em; color:#FECB03; font-size:1.1rem; }
.fs-notes span { color:var(--text-dim); font-size:0.84rem; }
@media (max-width:900px){
  .fs-row { grid-template-columns:1fr; gap:1.8rem; }
  .fs-row::before { left:35px; right:auto; top:20px; bottom:20px; width:2px; height:auto; background:linear-gradient(180deg,rgba(254,203,3,.15),rgba(254,203,3,.5),rgba(254,203,3,.15)); }
  .fs-row::after { display:none; }
  .fs-step { display:grid; grid-template-columns:70px 1fr; column-gap:1.1rem; text-align:left; align-items:start; }
  .fs-ic { grid-row:1 / span 3; margin:0; }
  .fs-notes { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce){ .fs-row::after { animation:none; opacity:0; } }

/* ── Leadership highlight band ─────────────────────────────── */
.lead-band { display:grid; grid-template-columns:1.1fr repeat(3,1fr); gap:1px; margin:0 0 2.6rem; border:1px solid var(--border-bright); border-radius:18px; overflow:hidden; background:var(--border-bright); }
.lead-band > div { background:linear-gradient(180deg,var(--bg-2),var(--bg-1)); padding:1.5rem 1.3rem; }
.lb-main { text-align:center; background:linear-gradient(135deg,rgba(254,203,3,0.16),var(--bg-1)) !important; display:flex; flex-direction:column; justify-content:center; }
.lb-num { font-family:var(--font-display); font-weight:700; font-size:clamp(3.2rem,6vw,4.6rem); line-height:1; color:#FECB03; text-shadow:0 0 30px rgba(254,203,3,0.35); }
.lb-num sup { font-size:0.5em; vertical-align:top; margin-left:2px; }
.lb-lab { font-family:var(--font-mono); font-size:0.68rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--text-dim); margin-top:0.5rem; }
.lb-item b { display:block; font-family:var(--font-display); letter-spacing:0.04em; text-transform:uppercase; color:var(--text); margin-bottom:0.35rem; font-size:1.05rem; }
.lb-item span { color:var(--text-dim); font-size:0.86rem; line-height:1.55; }
@media (max-width:900px){ .lead-band { grid-template-columns:1fr 1fr; } .lb-main { grid-column:1 / -1; } }
@media (max-width:520px){ .lead-band { grid-template-columns:1fr; } }

/* ═══ Community dashboard ═══════════════════════════════════════ */
.cm-page { min-height:100vh; padding:calc(var(--nav-h) + 38px) 0 80px; background:radial-gradient(circle at 85% 0%,rgba(254,203,3,0.07),transparent 45%); }
.cm-shell { max-width:1120px; }
.cm-head { display:flex; justify-content:space-between; align-items:flex-end; gap:1rem; margin-bottom:1.2rem; }
.cm-eyebrow { font-family:var(--font-mono); font-size:0.7rem; letter-spacing:0.22em; text-transform:uppercase; color:#FECB03; margin-bottom:0.4rem; }
.cm-head h1 { font-family:var(--font-display); text-transform:uppercase; font-size:clamp(1.7rem,3.6vw,2.5rem); letter-spacing:0.03em; margin:0; color:var(--text); }
.cm-head h1 em { font-style:normal; color:#FECB03; }
.cm-out { font-size:0.82rem; color:var(--text-dim); border:1px solid var(--border-bright); border-radius:100px; padding:0.4rem 1rem; }
.cm-out:hover { color:#0E0E0E; background:#FECB03; border-color:#FECB03; }
.cm-tabs { display:flex; gap:0.3rem; overflow-x:auto; padding:0.3rem; margin:0 0 1.6rem; border:1px solid var(--border-bright); border-radius:14px; background:var(--bg-1); -webkit-overflow-scrolling:touch; }
.cm-tabs a { flex:0 0 auto; padding:0.6rem 1.1rem; border-radius:10px; font-family:var(--font-display); letter-spacing:0.04em; text-transform:uppercase; font-size:0.86rem; color:var(--text-dim); white-space:nowrap; }
.cm-tabs a.on { background:#FECB03; color:#0E0E0E; font-weight:700; }
.cm-tabs a:not(.on):hover { color:var(--text); background:rgba(255,255,255,0.05); }
.cm-stats { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:0.8rem; margin-bottom:1.2rem; }
.cm-stat { border:1px solid var(--border-bright); border-radius:14px; padding:1rem; text-align:center; background:linear-gradient(180deg,var(--bg-2),var(--bg-1)); }
.cm-stat b { display:block; font-family:var(--font-display); font-size:2rem; color:#FECB03; line-height:1.1; }
.cm-stat span { font-family:var(--font-mono); font-size:0.64rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-dim); }
.cm-nudge { display:flex; align-items:center; gap:1rem; border:1px dashed #FECB03; border-radius:14px; padding:0.9rem 1.1rem; margin-bottom:1.2rem; background:rgba(254,203,3,0.05); }
.cm-nudge b { display:block; color:var(--text); } .cm-nudge small { color:var(--text-dim); } .cm-go { margin-left:auto; color:#FECB03; font-size:1.3rem; }
.cm-ring { --p:0; width:54px; height:54px; border-radius:50%; display:grid; place-items:center; background:conic-gradient(#FECB03 calc(var(--p)*1%), rgba(255,255,255,0.1) 0); flex:0 0 auto; position:relative; }
.cm-ring::before { content:""; position:absolute; inset:5px; border-radius:50%; background:var(--bg-1); }
.cm-ring span { position:relative; font-family:var(--font-mono); font-size:0.7rem; color:var(--text); }
.cm-ring.big { width:110px; height:110px; margin:0.4rem auto 0.6rem; } .cm-ring.big::before { inset:9px; } .cm-ring.big span { font-size:1.1rem; }
.cm-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.1rem; }
.cm-card { border:1px solid var(--border-bright); border-radius:16px; padding:1.3rem; background:linear-gradient(180deg,var(--bg-2),var(--bg-1)); }
.cm-wide { grid-column:1 / -1; }
.cm-card-h { display:flex; justify-content:space-between; align-items:baseline; gap:1rem; margin-bottom:0.9rem; }
.cm-card-h h2 { font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.04em; font-size:1.1rem; margin:0; color:var(--text); }
.cm-card-h a { font-size:0.8rem; color:#FECB03; }
.cm-list { display:grid; gap:0.5rem; }
.cm-row { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:0.8rem 0.9rem; border:1px solid rgba(255,255,255,0.07); border-radius:12px; transition:border-color .2s, transform .2s; }
.cm-row:hover { border-color:#FECB03; transform:translateX(2px); }
.cm-row b { display:block; color:var(--text); font-size:0.95rem; } .cm-row small { color:var(--text-dim); font-size:0.8rem; }
.cm-row.slim { padding:0.6rem 0.8rem; }
.cm-meta { display:flex; gap:0.4rem; flex-wrap:wrap; justify-content:flex-end; }
.chip { display:inline-block; font-family:var(--font-mono); font-size:0.64rem; letter-spacing:0.08em; text-transform:uppercase; padding:0.22rem 0.6rem; border-radius:100px; border:1px solid var(--border-bright); color:var(--text-dim); white-space:nowrap; }
.chip.gold { color:#0E0E0E; background:#FECB03; border-color:#FECB03; font-weight:700; }
.cm-empty { color:var(--text-dim); font-size:0.9rem; line-height:1.6; margin:0; } .cm-empty.big { text-align:center; padding:2.5rem 1rem; border:1px dashed var(--border-bright); border-radius:16px; }
.cm-note { color:var(--text-dim); font-size:0.9rem; line-height:1.6; margin:0 0 1rem; } .cm-note.center { text-align:center; margin:0; }
.cm-mini { display:grid; grid-template-columns:repeat(4,1fr); gap:0.5rem; text-align:center; }
.cm-mini b { display:block; font-family:var(--font-display); font-size:1.6rem; color:#FECB03; } .cm-mini span { font-size:0.7rem; color:var(--text-dim); }
.cm-intro { max-width:760px; margin:0 0 1.6rem; } .cm-intro h2 { font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.04em; margin:0 0 0.4rem; } .cm-intro p { color:var(--text-dim); line-height:1.7; margin:0; }
.cm-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(310px,1fr)); gap:1.1rem; }
.cm-ch { display:flex; flex-direction:column; gap:0.6rem; border:1px solid var(--border-bright); border-radius:16px; padding:1.3rem; background:linear-gradient(180deg,var(--bg-2),var(--bg-1)); transition:transform .25s,border-color .25s; }
.cm-ch:hover { transform:translateY(-3px); border-color:#FECB03; } .cm-ch.done { opacity:0.72; }
.cm-ch-top { display:flex; gap:0.4rem; flex-wrap:wrap; }
.cm-ch h3 { font-family:var(--font-display); font-size:1.25rem; margin:0.2rem 0 0; color:var(--text); } .cm-ch p { color:var(--text-dim); font-size:0.9rem; line-height:1.6; margin:0; flex:1; }
.cm-ch-foot { display:flex; flex-direction:column; gap:0.3rem; border-top:1px solid rgba(255,255,255,0.08); padding-top:0.7rem; } .reward { color:#FECB03; font-weight:600; } .sub { color:var(--text-dim); font-size:0.78rem; }
.cm-back { display:inline-block; margin-bottom:1rem; color:var(--text-dim); font-size:0.88rem; } .cm-back:hover { color:#FECB03; }
.cm-detail { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:1.6rem; align-items:start; }
.cm-main h2 { font-family:var(--font-display); font-size:clamp(1.6rem,3vw,2.2rem); margin:0.6rem 0; color:var(--text); } .cm-main .lead { color:var(--text); font-size:1.05rem; line-height:1.7; }
.cm-prose { white-space:pre-wrap; color:var(--text-dim); line-height:1.8; }
.cm-win { margin-top:1.4rem; border:1px solid #FECB03; border-radius:14px; padding:1rem 1.2rem; background:rgba(254,203,3,0.07); } .cm-win p { margin:0.4rem 0 0; color:var(--text-dim); }
.cm-side { display:grid; gap:1rem; position:sticky; top:calc(var(--nav-h) + 16px); }
.cm-reward { border:1px solid #FECB03; border-radius:14px; padding:1rem 1.2rem; background:linear-gradient(135deg,rgba(254,203,3,0.16),var(--bg-1)); } .cm-reward small { font-family:var(--font-mono); font-size:0.64rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--text-dim); } .cm-reward b { display:block; font-family:var(--font-display); font-size:1.4rem; color:#FECB03; }
.cm-facts { display:grid; grid-template-columns:1fr 1fr; gap:0.8rem; } .cm-facts small { display:block; font-family:var(--font-mono); font-size:0.62rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--text-dim); } .cm-facts b { color:var(--text); font-weight:600; font-size:0.9rem; word-break:break-word; } .cm-facts i { font-style:normal; color:var(--text-dim); }
.cm-form { border:1px solid var(--border-bright); border-radius:16px; padding:1.4rem; background:linear-gradient(180deg,var(--bg-2),var(--bg-1)); }
.cm-form h3 { font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.04em; margin:0 0 0.8rem; font-size:1.15rem; }
.cm-form label { display:block; font-family:var(--font-mono); font-size:0.66rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--text-dim); margin:0.9rem 0 0.35rem; } .cm-form label span, .cm-form label small { color:#FECB03; text-transform:none; letter-spacing:0; }
.cm-form input, .cm-form select, .cm-form textarea { width:100%; background:var(--bg); border:1px solid rgba(255,255,255,0.1); border-radius:10px; padding:0.75rem 0.9rem; color:var(--text); font:inherit; }
.cm-form input:focus, .cm-form select:focus, .cm-form textarea:focus { outline:none; border-color:#FECB03; }
.cm-form button { margin-top:1rem; } .cm-form .btn-full { width:100%; justify-content:center; }
.cm-form .row2 { display:grid; grid-template-columns:1fr 1fr; gap:0.9rem; } .cm-form label.check { display:flex; gap:0.6rem; align-items:flex-start; text-transform:none; letter-spacing:0; font-family:var(--font-body,inherit); font-size:0.88rem; } .cm-form label.check input { width:auto; margin-top:0.25rem; }
.cm-status { margin:0 0 0.6rem; color:var(--text-dim); font-size:0.88rem; } .cm-status b { color:#FECB03; text-transform:capitalize; }
.cm-two { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:1.4rem; align-items:start; } .cm-sub { font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.04em; margin:0 0 0.8rem; }
.cm-idea { border:1px solid var(--border-bright); border-radius:14px; padding:1rem 1.1rem; margin-bottom:0.8rem; background:var(--bg-1); } .cm-idea .top { display:flex; justify-content:space-between; gap:1rem; align-items:center; } .cm-idea small { color:var(--text-dim); } .cm-idea p { color:var(--text-dim); font-size:0.9rem; line-height:1.6; white-space:pre-wrap; margin:0.5rem 0 0; }
.cm-reply { border-left:3px solid #FECB03; padding:0.5rem 0.8rem; margin-top:0.7rem; background:rgba(254,203,3,0.06); border-radius:0 10px 10px 0; } .cm-reply small { font-family:var(--font-mono); font-size:0.62rem; letter-spacing:0.12em; text-transform:uppercase; color:#FECB03; } .cm-reply p { margin:0.2rem 0 0; color:var(--text); font-size:0.9rem; }
/* brainstorm */
.cm-board-h h2 { font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.04em; margin:0 0 0.4rem; } .cm-board-h p { color:var(--text-dim); max-width:720px; line-height:1.7; margin:0 0 1.2rem; }
.cm-compose { border:1px solid #FECB03; border-radius:16px; padding:1.1rem; margin-bottom:1.4rem; background:rgba(254,203,3,0.04); display:grid; gap:0.8rem; }
.cm-compose .kinds { display:grid; grid-template-columns:repeat(4,1fr); gap:0.5rem; } .kind input { position:absolute; opacity:0; }
.kind span { display:grid; gap:0.1rem; padding:0.6rem 0.7rem; border:1px solid var(--border-bright); border-radius:12px; cursor:pointer; background:var(--bg-1); height:100%; } .kind i { font-style:normal; font-size:1.15rem; } .kind b { font-size:0.85rem; color:var(--text); } .kind small { font-size:0.7rem; color:var(--text-dim); }
.kind input:checked + span { border-color:#FECB03; background:rgba(254,203,3,0.12); } .kind input:focus-visible + span { outline:2px solid #FECB03; }
.cm-compose textarea, .buildf textarea { width:100%; background:var(--bg); border:1px solid rgba(255,255,255,0.1); border-radius:10px; padding:0.7rem 0.9rem; color:var(--text); font:inherit; } .cm-compose textarea:focus, .buildf textarea:focus { outline:none; border-color:#FECB03; } .cm-compose .btn { justify-self:start; }
.cm-filter { display:flex; gap:0.4rem; flex-wrap:wrap; margin-bottom:1rem; } .cm-filter button { font:inherit; font-size:0.8rem; padding:0.35rem 0.85rem; border-radius:100px; border:1px solid var(--border-bright); background:transparent; color:var(--text-dim); cursor:pointer; } .cm-filter button.on { background:#FECB03; color:#0E0E0E; border-color:#FECB03; font-weight:700; }
.cm-sparks { display:grid; gap:1rem; grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); align-items:start; }
.spark { border:1px solid var(--border-bright); border-radius:16px; padding:1.1rem; background:linear-gradient(180deg,var(--bg-2),var(--bg-1)); } .spark:target { border-color:#FECB03; box-shadow:0 0 0 1px #FECB03; }
.spark-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:0.6rem; } .kindtag { font-family:var(--font-mono); font-size:0.66rem; letter-spacing:0.1em; text-transform:uppercase; color:#FECB03; } .kindtag.small { font-size:0.6rem; } .mom { font-family:var(--font-mono); font-size:0.7rem; color:var(--text-dim); }
.spark-body { color:var(--text); line-height:1.65; margin:0 0 0.6rem; white-space:pre-wrap; } .spark-by { color:var(--text-dim); font-size:0.76rem; }
.spark-act { display:flex; gap:0.6rem; align-items:flex-start; flex-wrap:wrap; margin-top:0.8rem; } .backf { margin:0; } .backf.inline { display:inline; margin-left:0.5rem; }
.back { font:inherit; font-size:0.8rem; display:inline-flex; gap:0.35rem; align-items:center; padding:0.35rem 0.8rem; border-radius:100px; border:1px solid var(--border-bright); background:transparent; color:var(--text-dim); cursor:pointer; } .back em { font-style:normal; } .back.on { background:#FECB03; color:#0E0E0E; border-color:#FECB03; font-weight:700; } .back.mini { padding:0.1rem 0.5rem; font-size:0.7rem; }
.build { flex:1 1 100%; } .build summary { cursor:pointer; list-style:none; display:inline-block; font-size:0.8rem; padding:0.35rem 0.8rem; border-radius:100px; border:1px solid var(--border-bright); color:var(--text-dim); } .build summary::-webkit-details-marker { display:none; } .build[open] summary { border-color:#FECB03; color:#FECB03; }
.buildf { display:grid; gap:0.6rem; margin-top:0.7rem; } .buildf .bk { display:flex; gap:0.4rem; flex-wrap:wrap; } .buildf .bk input { position:absolute; opacity:0; } .buildf .bk span { display:inline-block; font-size:0.78rem; padding:0.3rem 0.7rem; border:1px solid var(--border-bright); border-radius:100px; cursor:pointer; color:var(--text-dim); } .buildf .bk input:checked + span { border-color:#FECB03; color:#FECB03; background:rgba(254,203,3,0.1); } .buildf .btn { justify-self:start; }
.chain { margin-top:0.9rem; border-left:2px solid rgba(254,203,3,0.45); padding-left:0.9rem; display:grid; gap:0.8rem; } .chain .link p { margin:0.15rem 0 0.2rem; color:var(--text); font-size:0.9rem; line-height:1.55; white-space:pre-wrap; }
@media (max-width:900px){ .cm-stats { grid-template-columns:repeat(2,1fr); } .cm-grid, .cm-detail, .cm-two { grid-template-columns:1fr; } .cm-side { position:static; } .cm-compose .kinds { grid-template-columns:1fr 1fr; } .cm-form .row2 { grid-template-columns:1fr; } .cm-sparks { grid-template-columns:1fr; } }

/* ===== XO Series showcase — tall image left, story right, stacked vertically ===== */
.xs-jump { display:flex; flex-wrap:wrap; justify-content:center; gap:0.6rem; margin-top:1.8rem; position:relative; }
.xs-jump a { font-family:var(--font-mono); font-size:0.74rem; letter-spacing:0.08em; text-transform:uppercase; padding:0.5rem 1rem; border:1px solid var(--border-bright); border-radius:100px; color:var(--text-dim); transition:var(--transition); }
.xs-jump a i { font-style:normal; color:var(--olive-bright); margin-right:0.35rem; }
.xs-jump a:hover { color:#0e0e0e; background:#FECB03; border-color:#FECB03; } .xs-jump a:hover i { color:#0e0e0e; }
.xs-wrap { padding:4rem 0 2rem; }
.xs-item { display:grid; grid-template-columns:minmax(260px, 400px) minmax(0, 1fr); gap:4rem; align-items:start; padding:3.5rem 0; border-bottom:1px solid var(--border-soft); scroll-margin-top:calc(var(--nav-h) + 10px); }
.xs-item:first-child { padding-top:0; }
.xs-media { position:sticky; top:calc(var(--nav-h) + 22px); margin:0; border-radius:22px; overflow:hidden; border:1px solid var(--border-bright); box-shadow:0 18px 48px rgba(0,0,0,0.55), 0 0 40px rgba(254,203,3,0.08); background:var(--bg-2); aspect-ratio:988 / 2048; max-height:calc(100vh - var(--nav-h) - 44px); justify-self:center; width:100%; }
.xs-media picture, .xs-media img { display:block; width:100%; height:100%; object-fit:cover; }
.xs-badge { position:absolute; left:14px; bottom:14px; background:rgba(5,5,5,0.78); backdrop-filter:blur(8px); border:1px solid var(--border-bright); border-radius:100px; padding:0.4rem 0.95rem; font-family:var(--font-display); font-weight:700; letter-spacing:0.06em; text-transform:uppercase; font-size:0.95rem; color:var(--text); }
.xs-badge i { font-style:normal; color:#FECB03; margin-right:0.5rem; font-family:var(--font-mono); font-size:0.75rem; }
.xs-eyebrow { font-family:var(--font-mono); font-size:0.7rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--olive-light); margin-bottom:0.7rem; }
.xs-body h2 { font-family:var(--font-display); font-size:clamp(1.9rem,3.6vw,2.7rem); font-weight:700; line-height:1.1; text-transform:uppercase; letter-spacing:0.02em; margin-bottom:0.6rem; }
.xs-tag { font-family:var(--font-display); font-size:1.15rem; letter-spacing:0.08em; text-transform:uppercase; color:#FECB03; margin-bottom:1.1rem; }
.xs-lead { font-size:1.08rem; color:var(--text-dim); line-height:1.8; max-width:62ch; margin-bottom:1.8rem; }
.xs-points { list-style:none; display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-bottom:1.9rem; }
.xs-points li { display:flex; gap:0.85rem; align-items:flex-start; background:var(--bg-1); border:1px solid var(--border-soft); border-radius:14px; padding:1rem 1.05rem; transition:var(--transition); }
.xs-points li:hover { border-color:var(--border-bright); transform:translateY(-2px); }
.xs-ic { flex:0 0 auto; width:40px; height:40px; display:grid; place-items:center; font-size:1.25rem; border-radius:12px; background:rgba(254,203,3,0.1); border:1px solid var(--border); }
.xs-points h3 { font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.04em; font-size:1rem; margin-bottom:0.25rem; color:var(--text); }
.xs-points p { font-size:0.86rem; color:var(--text-dim); line-height:1.6; }
.xs-day { border:1px solid var(--border-bright); border-radius:16px; padding:1.2rem 1.3rem; margin-bottom:1.7rem; background:linear-gradient(135deg, rgba(254,203,3,0.07), var(--bg-1) 70%); }
.xs-day-h { font-family:var(--font-mono); font-size:0.68rem; letter-spacing:0.18em; text-transform:uppercase; color:#FECB03; margin-bottom:0.8rem; }
.xs-day ol { list-style:none; display:grid; gap:0.75rem; }
.xs-day li { display:grid; grid-template-columns:86px 1fr; gap:0.9rem; align-items:baseline; font-size:0.92rem; color:var(--text-dim); line-height:1.55; }
.xs-day time { font-family:var(--font-mono); font-size:0.78rem; color:var(--text); letter-spacing:0.05em; position:relative; padding-left:14px; white-space:nowrap; }
.xs-day time::before { content:''; position:absolute; left:0; top:0.45em; width:6px; height:6px; border-radius:50%; background:#FECB03; box-shadow:0 0 10px rgba(254,203,3,0.6); }
.xs-meta { display:grid; grid-template-columns:1fr 1fr; gap:1.4rem; margin-bottom:1.8rem; }
.xs-meta-l { display:block; font-family:var(--font-mono); font-size:0.64rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--text-muted); margin-bottom:0.55rem; }
.xs-meta .cov-chips, .xs-meta .cov-ideal { justify-content:flex-start; text-align:left; }
.xs-cta { display:flex; flex-wrap:wrap; gap:0.8rem; }
.xs-bridge { display:flex; align-items:center; justify-content:space-between; gap:2rem; margin:3.5rem 0 1rem; padding:2.2rem 2.4rem; border:1px solid var(--border-bright); border-radius:18px; background:linear-gradient(135deg, rgba(254,203,3,0.1), var(--bg-2)); }
.xs-bridge h2 { font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.03em; font-size:1.6rem; margin-bottom:0.4rem; }
.xs-bridge p { color:var(--text-dim); max-width:60ch; }
@media (max-width:1000px){
  .xs-item { grid-template-columns:minmax(220px, 300px) minmax(0,1fr); gap:2rem; }
  .xs-points, .xs-meta { grid-template-columns:1fr; }
}
@media (max-width:760px){
  .xs-item { grid-template-columns:1fr; gap:1.6rem; padding:2.6rem 0; }
  .xs-media { position:relative; top:0; max-width:340px; max-height:none; }
  .xs-day li { grid-template-columns:78px 1fr; }
  .xs-bridge { flex-direction:column; text-align:center; align-items:center; padding:1.8rem 1.3rem; }
  .xs-cta { justify-content:flex-start; } .xs-bridge .xs-cta { justify-content:center; }
}

/* accessibility: skip link */
.skip-link { position:absolute; left:-999px; top:8px; z-index:2000; background:#FECB03; color:#0e0e0e; padding:0.6rem 1rem; border-radius:8px; font-weight:600; }
.skip-link:focus { left:8px; }

/* ===== Let's build together ===== */
.bt-smile { display:inline-flex; align-items:center; gap:0.9rem; margin:1.6rem 0 0; font-family:var(--font-mono); font-size:0.78rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--olive-light); position:relative; }
.bt-smile i { width:clamp(60px,12vw,150px); height:2px; background:linear-gradient(90deg,#FECB03,rgba(254,203,3,0.15)); border-radius:2px; }
.bt-hero-cta { justify-content:center; margin-top:1.8rem; position:relative; }
.bt-steps { list-style:none; max-width:900px; margin:2.4rem auto 0; position:relative; display:grid; gap:1.4rem; }
.bt-steps::before { content:''; position:absolute; left:146px; top:10px; bottom:10px; width:2px; background:linear-gradient(180deg,#FECB03,rgba(254,203,3,0.12)); }
.bt-step { display:grid; grid-template-columns:110px 74px 1fr; align-items:start; }
.bt-when { font-family:var(--font-mono); font-size:0.78rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-dim); text-align:right; padding-top:1.05rem; }
.bt-dot { width:40px; height:40px; border-radius:50%; background:#0e0e0e; border:2px solid #FECB03; color:#FECB03; display:grid; place-items:center; font-family:var(--font-display); font-weight:700; margin:0.6rem auto 0; position:relative; z-index:1; box-shadow:0 0 0 6px var(--bg-1), 0 0 18px rgba(254,203,3,0.25); }
.bt-final .bt-dot { background:#FECB03; color:#0e0e0e; }
.bt-card { background:var(--bg-2); border:1px solid var(--border); border-radius:16px; padding:1.2rem 1.4rem; transition:var(--transition); }
.bt-card:hover { border-color:var(--border-bright); transform:translateX(3px); }
.bt-final .bt-card { border-color:#FECB03; background:linear-gradient(135deg, rgba(254,203,3,0.12), var(--bg-2)); }
.bt-card h3 { font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.05em; font-size:1.2rem; margin-bottom:0.35rem; }
.bt-card p { color:var(--text-dim); font-size:0.94rem; line-height:1.65; margin-bottom:0.6rem; }
.bt-out { display:inline-block; font-family:var(--font-mono); font-size:0.7rem; letter-spacing:0.06em; color:#FECB03; background:rgba(254,203,3,0.08); border:1px solid var(--border); border-radius:100px; padding:0.25rem 0.75rem; }
.bt-principles { list-style:none; display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; max-width:980px; margin:2rem auto 0; }
.bt-principles li { background:var(--bg-2); border:1px solid var(--border); border-radius:14px; padding:1.2rem 1.4rem; display:grid; gap:0.35rem; }
.bt-principles b { font-family:var(--font-display); font-size:1.1rem; letter-spacing:0.04em; text-transform:uppercase; color:var(--text); }
.bt-principles span { color:var(--text-dim); font-size:0.93rem; line-height:1.6; }
.bt-faq { max-width:820px; margin:2rem auto 0; display:grid; gap:0.8rem; }
.bt-faq details { background:var(--bg-1); border:1px solid var(--border); border-radius:12px; padding:0 1.2rem; }
.bt-faq summary { cursor:pointer; list-style:none; padding:1rem 0; font-weight:600; color:var(--text); display:flex; justify-content:space-between; gap:1rem; }
.bt-faq summary::-webkit-details-marker { display:none; }
.bt-faq summary::after { content:'+'; color:#FECB03; font-size:1.3rem; line-height:1; }
.bt-faq details[open] summary::after { content:'–'; }
.bt-faq details[open] { border-color:var(--border-bright); }
.bt-faq p { color:var(--text-dim); padding:0 0 1.1rem; line-height:1.7; }
@media (max-width:760px){
  .bt-steps::before { left:19px; }
  .bt-step { grid-template-columns:40px 1fr; grid-template-areas:"dot card"; column-gap:0.9rem; }
  .bt-when { grid-area:card; text-align:left; padding:0 0 0.35rem; order:-1; }
  .bt-step { display:grid; grid-template-columns:40px 1fr; }
  .bt-dot { grid-column:1; grid-row:1 / span 2; margin-top:0.2rem; }
  .bt-when { grid-column:2; grid-row:1; } .bt-card { grid-column:2; grid-row:2; }
  .bt-principles { grid-template-columns:1fr; }
}

/* ===== consistent step numbers (01, 02, 03…) — large, solid brand yellow ===== */
.step-num, .disc-num, .how-step-number, .rc-num {
  font-family:var(--font-display); font-size:3.6rem; font-weight:700; line-height:1; letter-spacing:0.02em;
  color:#FECB03; opacity:1; margin-bottom:0.8rem; text-shadow:0 0 24px rgba(254,203,3,0.25);
}
.fs-n { width:32px; height:32px; font-size:1rem; right:-10px; top:-10px; }
@media (max-width:640px){ .step-num, .disc-num, .how-step-number, .rc-num { font-size:2.8rem; } }

/* ===== landing hero sub-line — brighter and more present ===== */
.sp-hero .hero-sub { max-width:760px; font-size:1.2rem; line-height:1.75; font-weight:500; color:#f0f0f0; text-shadow:0 2px 18px rgba(0,0,0,0.85); }
@media (max-width:640px){ .sp-hero .hero-sub { font-size:1.05rem; } }

/* ===== join page: richer side, single login panel + register button ===== */
.auth-how { margin-top:1.4rem; padding:1.1rem 1.2rem; border:1px solid var(--border-bright); border-radius:14px; background:linear-gradient(135deg, rgba(254,203,3,0.08), var(--bg-1) 70%); }
.auth-how-h { font-family:var(--font-mono); font-size:0.68rem; letter-spacing:0.18em; text-transform:uppercase; color:#FECB03; margin-bottom:0.8rem; }
.auth-how ol { list-style:none; display:grid; gap:0.6rem; padding:0; margin:0; }
.auth-how li { display:flex; gap:0.8rem; align-items:center; color:var(--text-dim); font-size:0.9rem; }
.auth-how li b { flex:0 0 auto; width:28px; height:28px; border-radius:50%; display:grid; place-items:center; background:#FECB03; color:#0e0e0e; font-family:var(--font-display); font-size:0.95rem; }
.auth-or { display:flex; align-items:center; gap:0.8rem; margin:1.4rem 0 0.9rem; color:var(--text-muted); font-size:0.8rem; text-transform:uppercase; letter-spacing:0.12em; font-family:var(--font-mono); }
.auth-or::before, .auth-or::after { content:''; flex:1; height:1px; background:var(--border-soft); }
.auth-note { color:var(--text-dim); font-size:0.84rem; line-height:1.55; margin:0.9rem 0 0; text-align:center; }

/* team: plain vision cards, media links */
.av-plain { grid-template-columns:repeat(3,minmax(0,1fr)); }
.av-plain .av-card { background:transparent; border:0; border-top:2px solid var(--border-bright); border-radius:0; padding:1.1rem 0.2rem 0; }
.av-plain .av-card h3 { font-family:var(--font-display); text-transform:uppercase; letter-spacing:0.05em; font-size:1.1rem; margin-bottom:0.5rem; color:var(--text); }
.av-plain .av-card p { color:var(--text-dim); font-size:0.95rem; line-height:1.7; }
.brand-link { color:var(--olive-light); border-bottom:1px solid var(--border-bright); }
.brand-link:hover { color:#FECB03; }
@media (max-width:760px){ .av-plain { grid-template-columns:1fr; } }
.tc-media { display:flex; flex-wrap:wrap; gap:0.4rem 0.7rem; align-items:center; margin:0.9rem 0 0; font-size:0.8rem; }
.tc-media-l { font-family:var(--font-mono); font-size:0.62rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--text-muted); width:100%; }
.tc-media a { color:var(--olive-light); border-bottom:1px solid var(--border); }
.tc-media a:hover { color:#FECB03; border-color:#FECB03; }
.tc-media-txt { color:var(--text-dim); }