:root {
    --bg: #191127;
    --bg2: #23133a;
    --bg3: #1f1232;
    --amber: #883CF0;
    --amber2: #7c3aed;
    --green: #b29dce;
    --red: #af62c8;
    --blue: #883CF0;
    --muted: #d6d6d6;
    --text: #eeeff0;
    --dim: #e6e6e6;
    --border: #3a1c63;
    --border2: #5e309d;
  }

  * { margin:0; padding:0; box-sizing:border-box; }

  html { scroll-behavior: smooth; }

  body {
    background: var(--bg);
    color: var(--text);
    font-family: 'IBM Plex Sans', sans-serif;
    overflow-x: hidden;
    cursor: crosshair;
  }

  /* SCANLINE OVERLAY */
  body::before {
    content:'';
    position:fixed; inset:0;
    background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,0,0,0.04) 2px, rgba(0,0,0,0.04) 4px);
    pointer-events:none;
    z-index:9999;
  }

  /* NOISE TEXTURE */
  body::after {
    content:'';
    position:fixed; inset:0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");
    pointer-events:none; z-index:9998; opacity:0.4;
  }

  /* ── NAV ── */
  nav {
    position: fixed; top:0; left:0; right:0; z-index:1000;
    display:flex; align-items:center; justify-content:space-between;
    padding: 14px 40px;
    background: #180f26;
    border-bottom: 1px solid var(--border);
    backdrop-filter: blur(12px);
  }

  .nav-logo {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.4rem;
    letter-spacing: 3px;
    color: var(--amber);
    display:flex; align-items:center; gap:10px;
  }

  .nav-logo .dot {
    width:8px; height:8px; border-radius:50%;
    background: var(--green);
    animation: pulse-dot 1.4s ease-in-out infinite;
  }

  @keyframes pulse-dot {
    0%,100% { box-shadow: 0 0 0 0 rgba(136, 0, 255, 0.6); }
    50% { box-shadow: 0 0 0 6px rgba(0,255,157,0); }
  }

  .nav-links { display:flex; gap:28px; }
  .nav-links a {
    font-family: 'Share Tech Mono', monospace;
    font-size: 0.72rem; letter-spacing:2px;
    color: var(--dim); text-decoration:none;
    text-transform:uppercase;
    transition: color 0.2s;
  }
  .nav-links a:hover { color: var(--amber); }

  .nav-status {
    font-family: 'Share Tech Mono', monospace;
    font-size:0.68rem; color: var(--green);
    letter-spacing:1px;
    display:flex; align-items:center; gap:6px;
  }
  .nav-status::before {
    content:''; width:6px; height:6px; border-radius:50%;
    background: var(--green);
    animation: pulse-dot 1.4s ease-in-out infinite;
  }

  /* ── HERO ── */
  .hero {
    min-height: 100vh;
    padding: 120px 40px 60px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center;
    position: relative;
    overflow: hidden;
  }

  /* Radial bg glow */
  .hero::before {
    content:'';
    position:absolute;
    top:-20%; left:-10%;
    width:70%; height:100%;
    background: radial-gradient(ellipse, rgba(162, 0, 255, 0.05) 0%, transparent 70%);
    pointer-events:none;
  }
  .hero::after {
    content:'';
    position:absolute;
    bottom:-20%; right:-10%;
    width:60%; height:80%;
    background: radial-gradient(ellipse, rgba(128, 0, 255, 0.04) 0%, transparent 70%);
    pointer-events:none;
  }

  .hero-left { position:relative; z-index:1; }

  .hero-eyebrow {
    font-family:'Share Tech Mono', monospace;
    font-size:0.7rem; letter-spacing:4px;
    color: var(--amber); text-transform:uppercase;
    margin-bottom:16px;
    display:flex; align-items:center; gap:10px;
  }
  .hero-eyebrow::before { content:''; flex:0 0 30px; height:1px; background:var(--amber); }

  .hero-title {
    font-family:'Bebas Neue', sans-serif;
    font-size: clamp(3.5rem, 7vw, 6rem);
    line-height:0.92;
    letter-spacing:2px;
    margin-bottom:24px;
  }

  .hero-title .line1 { color: var(--text); display:block; }
  .hero-title .line2 { color: var(--amber); display:block; }
  .hero-title .line3 { 
    color: transparent;
    -webkit-text-stroke: 1px rgba(174, 0, 255, 0.4);
    display:block;
  }

  .hero-desc {
    font-size:0.95rem; line-height:1.7;
    color: var(--dim); max-width:420px;
    margin-bottom:36px;
  }

  .hero-ctas { display:flex; gap:14px; flex-wrap:wrap; }

  .btn-primary {
    font-family:'Share Tech Mono', monospace;
    font-size:0.75rem; letter-spacing:2px;
    text-transform:uppercase;
    padding:12px 28px;
    background: var(--amber);
    color: var(--bg);
    border:none; cursor:pointer;
    clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
    transition: all 0.2s;
    font-weight:700;
  }
  .btn-primary:hover { background: var(--amber2); transform:translateY(-2px); }

  .btn-ghost {
    font-family:'Share Tech Mono', monospace;
    font-size:0.75rem; letter-spacing:2px;
    text-transform:uppercase;
    padding:12px 28px;
    background: transparent;
    color: var(--amber);
    border: 1px solid var(--amber);
    cursor:pointer;
    clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
    transition: all 0.2s;
  }
  .btn-ghost:hover { background: #1f1232; transform:translateY(-2px); }

  /* Hero Stats Row */
  .hero-stats {
    display:flex; gap:0; margin-top:48px;
    border-top: 1px solid var(--border);
    padding-top:28px;
  }

  .stat {
    flex:1; padding:0 24px 0 0;
    border-right: 1px solid var(--border);
  }
  .stat:first-child { padding-left:0; }
  .stat:last-child { border-right:none; }

  .stat-val {
    font-family:'Bebas Neue', sans-serif;
    font-size:2.2rem; color: var(--amber);
    letter-spacing:1px;
  }
  .stat-label { font-size:0.68rem; color:var(--dim); letter-spacing:1px; margin-top:2px; }

  /* ── HERO RIGHT: LIVE TERMINAL ── */
  .hero-terminal {
    position:relative; z-index:1;
    background: var(--bg2);
    border: 1px solid var(--border);
    clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 20px 100%, 0 calc(100% - 20px));
    overflow:hidden;
  }

  .term-header {
    background: #2a1647;
    border-bottom: 1px solid var(--border);
    padding:10px 16px;
    display:flex; align-items:center; gap:10px;
  }

  .term-dots { display:flex; gap:6px; }
  .term-dot { width:10px; height:10px; border-radius:50%; }
  .term-dot.red { background:#ff3b30; }
  .term-dot.yellow { background:#ffcc00; }
  .term-dot.green { background:#28cd41; }

  .term-title {
    font-family:'Share Tech Mono', monospace;
    font-size:0.68rem; color:var(--dim); letter-spacing:2px;
    flex:1; text-align:center;
  }

  .term-body {
    padding: 20px;
    font-family:'Share Tech Mono', monospace;
    font-size:0.76rem; line-height:1.8;
    min-height:320px;
    max-height:420px;
    overflow-y:auto;
  }

  .term-body::-webkit-scrollbar { width:3px; }
  .term-body::-webkit-scrollbar-track { background:transparent; }
  .term-body::-webkit-scrollbar-thumb { background:var(--muted); }

  .term-line { display:flex; gap:8px; margin-bottom:2px; }
  .term-prompt { color: var(--amber); flex-shrink:0; }
  .term-cmd { color: var(--text); }
  .term-out { color: var(--dim); padding-left:16px; }
  .term-warn { color: var(--amber); padding-left:16px; }
  .term-alert { color: var(--red); padding-left:16px; }
  .term-ok { color: var(--green); padding-left:16px; }

  .term-cursor {
    display:inline-block; width:8px; height:14px;
    background: var(--amber); vertical-align:middle;
    animation: blink 0.9s step-end infinite;
  }
  @keyframes blink { 50% { opacity:0; } }

  /* ── LIVE SESSIONS TICKER ── */
  .ticker-bar {
    background: var(--bg2);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    padding: 10px 0;
    overflow:hidden;
    position:relative;
  }
  .ticker-bar::before, .ticker-bar::after {
    content:''; position:absolute; top:0; width:80px; height:100%;
    z-index:2; pointer-events:none;
  }
  .ticker-bar::before { left:0; background:linear-gradient(to right, var(--bg2), transparent); }
  .ticker-bar::after { right:0; background:linear-gradient(to left, var(--bg2), transparent); }

  .ticker-inner {
    display:flex; gap:60px;
    animation: ticker 30s linear infinite;
    width:max-content;
  }
  @keyframes ticker { from { transform:translateX(0); } to { transform:translateX(-50%); } }

  .tick-item {
    font-family:'Share Tech Mono', monospace;
    font-size:0.68rem; letter-spacing:1px;
    white-space:nowrap; display:flex; gap:10px;
  }
  .tick-user { color: var(--amber); }
  .tick-action { color: var(--dim); }
  .tick-time { color: var(--muted); }
  .tick-status-ok { color: var(--green); }
  .tick-status-warn { color: var(--amber); }
  .tick-status-alert { color: var(--red); }

  /* ── SECTION WRAPPER ── */
  section { padding: 100px 40px; position:relative; }

  .section-tag {
    font-family:'Share Tech Mono', monospace;
    font-size:0.68rem; letter-spacing:4px; text-transform:uppercase;
    color: var(--amber); margin-bottom:12px;
    display:flex; align-items:center; gap:10px;
  }
  .section-tag::after { content:''; flex:1; height:1px; background:var(--border); max-width:80px; }

  .section-title {
    font-family:'Bebas Neue', sans-serif;
    font-size: clamp(2.5rem, 5vw, 3.8rem);
    letter-spacing:2px; line-height:1;
    margin-bottom:16px;
  }

  .section-sub { font-size:0.9rem; color:var(--dim); max-width:500px; line-height:1.7; }

  /* ── THREAT RADAR ── */
  #radar-section {
    background: var(--bg2);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
  }

  .radar-layout {
    display:grid;
    grid-template-columns: 1fr 420px;
    gap:60px; align-items:start;
  }

  /* Canvas radar */
  .radar-canvas-wrap {
    position:relative;
    display:flex; align-items:center; justify-content:center;
  }

  #radarCanvas {
    border: 1px solid var(--border);
    border-radius:50%;
    background: var(--bg);
    display:block;
  }

  .radar-label {
    position:absolute; bottom:-30px; left:50%; transform:translateX(-50%);
    font-family:'Share Tech Mono', monospace;
    font-size:0.65rem; letter-spacing:3px; color:var(--dim);
  }

  .threat-log-header {
    font-family:'Share Tech Mono', monospace;
    font-size:0.7rem; letter-spacing:3px; text-transform:uppercase;
    color: var(--dim); margin-bottom:16px;
    border-bottom: 1px solid var(--border); padding-bottom:8px;
    display:flex; justify-content:space-between;
  }

  .threat-log { display:flex; flex-direction:column; gap:8px; }

  .threat-entry {
    background: var(--bg3);
    border: 1px solid var(--border);
    border-left: 3px solid var(--muted);
    padding:12px 16px;
    transition: border-color 0.3s;
    animation: slideIn 0.4s ease;
  }
  @keyframes slideIn {
    from { opacity:0; transform:translateY(-8px); }
    to { opacity:1; transform:translateY(0); }
  }

  .threat-entry.critical { border-left-color: var(--red); }
  .threat-entry.high { border-left-color: var(--amber2); }
  .threat-entry.medium { border-left-color: var(--amber); }
  .threat-entry.low { border-left-color: var(--blue); }

  .threat-entry-top {
    display:flex; justify-content:space-between; align-items:center;
    margin-bottom:4px;
  }

  .threat-type {
    font-family:'Share Tech Mono', monospace;
    font-size:0.7rem; letter-spacing:1px;
    color: var(--text);
  }

  .threat-badge {
    font-family:'Share Tech Mono', monospace;
    font-size:0.6rem; padding:2px 8px;
    text-transform:uppercase; letter-spacing:1px;
  }
  .threat-badge.critical { background:rgba(255,51,102,0.15); color:var(--red); border:1px solid rgba(255,51,102,0.3); }
  .threat-badge.high { background:rgba(255,122,0,0.15); color:var(--amber2); border:1px solid rgba(255,122,0,0.3); }
  .threat-badge.medium { background:rgba(255,170,0,0.1); color:var(--amber); border:1px solid rgba(255,170,0,0.25); }
  .threat-badge.low { background:rgba(0,212,255,0.08); color:var(--blue); border:1px solid rgba(0,212,255,0.2); }

  .threat-detail {
    font-size:0.72rem; color:var(--dim);
    font-family:'Share Tech Mono', monospace;
  }

  .threat-time {
    font-family:'Share Tech Mono', monospace;
    font-size:0.6rem; color:var(--muted); margin-top:4px;
  }

  .pillars-grid {
    display:grid;
    grid-template-columns: repeat(5, 1fr);
    gap:2px;
    margin-top:60px;
  }

  .pillar-card {
    background: var(--bg2);
    border: 1px solid var(--border);
    padding: 28px 20px;
    cursor:pointer;
    transition: all 0.3s;
    position:relative; overflow:hidden;
    text-align:center;
  }

  .pillar-card::before {
    content:'';
    position:absolute; bottom:0; left:0; right:0;
    height:2px;
    background: var(--amber);
    transform:scaleX(0); transform-origin:left;
    transition: transform 0.3s;
  }

  .pillar-card:hover::before, .pillar-card.active::before { transform:scaleX(1); }
  .pillar-card:hover, .pillar-card.active {
    background: #1f1232;
    border-color: #5e309d;
  }

  .pillar-icon {
    font-size:1.8rem; margin-bottom:10px; display:block;
  }

  .pillar-name {
    font-family:'Bebas Neue', sans-serif;
    font-size:0.85rem; letter-spacing:2px;
    color: var(--text);
  }

  .pillar-detail {
    margin-top:40px;
    background: var(--bg2);
    border: 1px solid var(--border);
    padding:40px;
    display:none;
  }
  .pillar-detail.visible { display:grid; grid-template-columns:1fr 1fr; gap:40px; }

  .pillar-detail-title {
    font-family:'Bebas Neue', sans-serif;
    font-size:2rem; letter-spacing:2px;
    color: var(--amber); margin-bottom:12px;
  }

  .pillar-detail-text { font-size:0.88rem; color:var(--dim); line-height:1.8; margin-bottom:20px; }

  .pillar-features { list-style:none; display:flex; flex-direction:column; gap:8px; }
  .pillar-features li {
    font-family:'Share Tech Mono', monospace;
    font-size:0.72rem; color:var(--text);
    padding-left:16px; position:relative;
  }
  .pillar-features li::before {
    content:'▸'; position:absolute; left:0;
    color: var(--amber);
  }

  .pillar-visual {
    display:flex; align-items:center; justify-content:center;
    background: var(--bg3);
    border: 1px solid var(--border);
    font-size:5rem;
  }

  /* ── SIMULATOR ── */
  #simulator { background: var(--bg); }

  .sim-layout {
    display:grid;
    grid-template-columns:300px 1fr;
    gap:24px; margin-top:60px;
  }

  .scenario-list { display:flex; flex-direction:column; gap:4px; }

  .scenario-btn {
    background: var(--bg2);
    border: 1px solid var(--border);
    border-left: 3px solid transparent;
    padding:16px 20px;
    cursor:pointer;
    transition: all 0.2s;
    text-align:left;
  }
  .scenario-btn:hover, .scenario-btn.active {
    background: #1f1232;
    border-left-color: var(--amber);
  }

  .scenario-icon { font-size:1.2rem; margin-bottom:4px; }

  .scenario-name {
    font-family:'Share Tech Mono', monospace;
    font-size:0.72rem; letter-spacing:1px;
    color: var(--text); text-transform:uppercase;
  }

  .sim-screen {
    background: var(--bg2);
    border: 1px solid var(--border);
    clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%);
    overflow:hidden;
  }

  .sim-header {
    background: #2a1647;
    border-bottom: 1px solid var(--border);
    padding:14px 24px;
    display:flex; gap:20px; align-items:center;
  }

  .sim-badge {
    font-family:'Share Tech Mono', monospace;
    font-size:0.7rem; letter-spacing:2px;
    padding:4px 12px;
  }

  .sim-badge.critical { background:rgba(255,51,102,0.2); color:var(--red); border:1px solid rgba(255,51,102,0.3); animation:flash-badge 0.8s ease-in-out infinite alternate; }
  @keyframes flash-badge { from {opacity:1;} to {opacity:0.5;} }
  .sim-badge.high { background:rgba(255,122,0,0.2); color:var(--amber2); border:1px solid rgba(255,122,0,0.3); }
  .sim-badge.medium { background:rgba(255,170,0,0.15); color:var(--amber); border:1px solid rgba(255,170,0,0.3); }

  .sim-title-area { flex:1; }
  .sim-scenario-title {
    font-family:'Bebas Neue', sans-serif;
    font-size:1.3rem; letter-spacing:2px; color:var(--text);
  }

  .sim-body { padding:24px; display:grid; grid-template-columns:1fr 1fr; gap:24px; min-height:400px; }

  .sim-log {
    font-family:'Share Tech Mono', monospace;
    font-size:0.72rem; line-height:1.9;
    background: var(--bg);
    border: 1px solid var(--border);
    padding:16px; overflow-y:auto; max-height:380px;
  }
  .sim-log::-webkit-scrollbar { width:2px; }
  .sim-log::-webkit-scrollbar-thumb { background:var(--muted); }

  .log-step { color: var(--dim); }
  .log-detect { color: var(--amber); }
  .log-alert { color: var(--red); }
  .log-block { color: var(--green); }
  .log-timestamp { color: var(--muted); margin-right:8px; }

  .sim-info { display:flex; flex-direction:column; gap:16px; }

  .sim-metric {
    background: var(--bg);
    border: 1px solid var(--border);
    padding:16px;
  }

  .sim-metric-label {
    font-family:'Share Tech Mono', monospace;
    font-size:0.6rem; letter-spacing:3px; text-transform:uppercase;
    color: var(--dim); margin-bottom:6px;
  }

  .sim-metric-value {
    font-family:'Bebas Neue', sans-serif;
    font-size:1.6rem; letter-spacing:1px; color:var(--amber);
  }

  .progress-bar {
    height:4px; background:var(--bg3);
    margin-top:8px; overflow:hidden;
  }
  .progress-fill {
    height:100%; background:var(--amber);
    transition: width 2s ease;
  }

  .sim-desc {
    font-size:0.82rem; line-height:1.7; color:var(--dim);
    background: var(--bg);
    border: 1px solid var(--border);
    padding:16px;
  }

  .sim-cta {
    display:flex; gap:12px; margin-top:16px;
  }

  /* ── CHAPTERS ── */
  #chapters { background: var(--bg2); border-top: 1px solid var(--border); }

  .chapters-grid {
    display:grid;
    grid-template-columns: repeat(7, 1fr);
    gap:0;
    margin-top:60px;
    border: 1px solid var(--border);
  }

  .chapter-card {
    border-right: 1px solid var(--border);
    padding:32px 20px;
    cursor:pointer;
    transition: all 0.3s;
    position:relative;
  }
  .chapter-card:last-child { border-right:none; }

  .chapter-num {
    font-family:'Bebas Neue', sans-serif;
    font-size:3rem; color:#873cf053;
    line-height:1;
    transition: color 0.3s;
  }

  .chapter-title {
    font-family:'Share Tech Mono', monospace;
    font-size:0.68rem; letter-spacing:1px;
    text-transform:uppercase;
    color: var(--dim);
    margin-top:8px; margin-bottom:12px;
    transition: color 0.3s;
  }

  .chapter-preview {
    font-size:0.72rem; color: transparent;
    line-height:1.6;
    transition: all 0.3s;
    max-height:0; overflow:hidden;
  }

  .chapter-arrow {
    font-family:'Share Tech Mono', monospace;
    font-size:0.7rem; color: transparent;
    margin-top:8px; transition: all 0.3s;
  }

  .chapter-card:hover {
    background: #1f1232;
    border-bottom: 2px solid var(--amber);
  }
  .chapter-card:hover .chapter-num { color: #873cf09d; }
  .chapter-card:hover .chapter-title { color: var(--amber); }
  .chapter-card:hover .chapter-preview { color: var(--dim); max-height:100px; }
  .chapter-card:hover .chapter-arrow { color: var(--amber); }

  .practices-layout {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap:2px; margin-top:60px;
  }

  .practice-card {
    background: var(--bg2);
    border: 1px solid var(--border);
    padding:36px 28px;
    position:relative; overflow:hidden;
    transition: all 0.3s;
  }

  .practice-card::before {
    content:'';
    position:absolute; top:0; left:0; right:0; height:3px;
    background: linear-gradient(to right, var(--amber), var(--amber2));
    transform:scaleX(0); transform-origin:left;
    transition: transform 0.4s;
  }
  .practice-card:hover::before { transform:scaleX(1); }
  .practice-card:hover { transform:translateY(-4px); box-shadow:0 20px 60px rgba(0,0,0,0.4); }

  .practice-icon { font-size:2rem; margin-bottom:16px; }

  .practice-title {
    font-family:'Bebas Neue', sans-serif;
    font-size:1.3rem; letter-spacing:2px;
    color: var(--text); margin-bottom:12px;
  }

  .practice-text { font-size:0.82rem; color:var(--dim); line-height:1.7; }

  /* ── FOOTER ── */
  footer {
    background: var(--bg2);
    border-top: 1px solid var(--border);
    padding: 60px 40px 40px;
  }

  .footer-top {
    display:grid; grid-template-columns:2fr 1fr 1fr;
    gap:60px; margin-bottom:48px;
  }

  .footer-brand {
    font-family:'Bebas Neue', sans-serif;
    font-size:1.8rem; letter-spacing:3px;
    color: var(--amber); margin-bottom:12px;
  }

  .footer-tagline { font-size:0.82rem; color:var(--dim); line-height:1.7; max-width:320px; }

  .footer-heading {
    font-family:'Share Tech Mono', monospace;
    font-size:0.65rem; letter-spacing:3px; text-transform:uppercase;
    color: var(--amber); margin-bottom:16px;
  }

  .footer-links { list-style:none; display:flex; flex-direction:column; gap:8px; }
  .footer-links a {
    font-size:0.8rem; color:var(--dim); text-decoration:none;
    transition: color 0.2s;
  }
  .footer-links a:hover { color: var(--amber); }

  .footer-bottom {
    border-top:1px solid var(--border); padding-top:24px;
    display:flex; justify-content:space-between; align-items:center;
  }

  .footer-copy {
    font-family:'Share Tech Mono', monospace;
    font-size:0.62rem; color:var(--muted); letter-spacing:1px;
  }

  .footer-tags {
    display:flex; gap:12px;
  }
  .footer-tag {
    font-family:'Share Tech Mono', monospace;
    font-size:0.6rem; letter-spacing:2px; text-transform:uppercase;
    color: var(--muted); padding:4px 10px;
    border:1px solid var(--muted);
  }

  /* RESPONSIVE */
  @media (max-width:1100px) {
    .hero { grid-template-columns:1fr; }
    .hero-terminal { display:none; }
    .radar-layout { grid-template-columns:1fr; }
    .pillars-grid { grid-template-columns:repeat(3,1fr); }
    .chapters-grid { grid-template-columns:repeat(4,1fr); }
    .practices-layout { grid-template-columns:1fr 1fr; }
    .footer-top { grid-template-columns:1fr 1fr; }
  }
  @media (max-width:700px) {
    nav { padding:12px 20px; }
    .nav-links { display:none; }
    section { padding:60px 20px; }
    .hero { padding:100px 20px 40px; }
    .pillars-grid { grid-template-columns:repeat(2,1fr); }
    .sim-layout { grid-template-columns:1fr; }
    .sim-body { grid-template-columns:1fr; }
    .chapters-grid { grid-template-columns:repeat(2,1fr); }
    .practices-layout { grid-template-columns:1fr; }
    .footer-top { grid-template-columns:1fr; }
    .footer-bottom { flex-direction:column; gap:12px; }
  }

  /* FADE IN ANIMATION */
  .fade-in { opacity:0; transform:translateY(24px); transition: opacity 0.6s ease, transform 0.6s ease; }
  .fade-in.visible { opacity:1; transform:translateY(0); }