/* Futuristic theme with MODE toggle; Hindi line under brand */
:root{ --blue-900:#0a1b3d; --blue-700:#123f7a; --blue-500:#1e63c1; --saffron:#ff7b00; --white:#ffffff;
  --glass-bg: rgba(255,255,255,0.08); --glass-border: rgba(255,255,255,0.18); --text:#0a1633; --muted:#425b83; --shadow: 0 10px 30px rgba(0,0,0,0.25); }
*{box-sizing:border-box} html,body{height:100%}
body{ margin:0; font-family:"Source Sans 3",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; line-height:1.6; color:var(--text); background:#ffffff; overflow-x:hidden; }
h1,h2,h3,h4{font-family:Rajdhani,system-ui,Arial,sans-serif; letter-spacing:.5px; margin:0 0 .5rem}
h1{font-size:clamp(2rem,2.2rem + 1.8vw,3.6rem); line-height:1.1} h2{font-size:clamp(1.6rem,1.2rem + 1vw,2.4rem)} h3{font-size:clamp(1.25rem,1rem + .7vw,1.6rem)}
p{margin:.5rem 0 1rem} small,.small{font-size:.875rem; color:var(--muted)} .tiny{font-size:.75rem; color:var(--muted)}
.container{max-width:1200px; margin:0 auto; padding:0 1rem}

/* NDA bar */
.nda-bar{ position:sticky; top:0; z-index:60; display:flex; gap:.75rem; align-items:center; justify-content:center;
  padding:.5rem 1rem; background:#f8fbff; border-bottom:1px solid #e1e7f5; font-weight:600; }
.btn-link{ background:none; border:none; color:var(--saffron); font-weight:700; cursor:pointer; }
.btn-link:hover{ text-decoration:underline; }

/* Header */
.site-header{ position:sticky; top:2.5rem; z-index:50; background:linear-gradient(transparent,#ffffffcc);
  backdrop-filter: blur(6px); border-bottom:1px solid #e1e7f5; }
.nav{ display:flex; align-items:center; justify-content:space-between; padding:.75rem 0;}
.logo{display:flex; gap:.6rem; align-items:center; text-decoration:none; color:var(--text)}
.logo .logo-img{width:60px; height:60px; border-radius:6px}
.brand{font-family:Rajdhani; font-weight:800; letter-spacing:1px; font-size:1.3rem}
.subbrand{opacity:.85; font-size:.9rem; margin-left:.0rem}
.subbrand-hi{ font-family: Rajdhani, "Noto Sans Devanagari", system-ui, sans-serif; font-size:.9rem; opacity:.9; line-height:1.1 }
.logo .brand, .logo .subbrand, .logo .subbrand-hi{ display:block; }

.nav-links a{color:var(--text); text-decoration:none; margin-left:1rem; padding:.4rem .8rem; border-radius:999px; font-weight:600;}
.nav-links a:hover{ background:#f1f6ff; }
.mode-toggle{ margin-left:.75rem; padding:.4rem .8rem; border-radius:999px; border:1px solid #dbe6ff; background:#f7faff; cursor:pointer; font-weight:700}
.mode-toggle:hover{ background:#eef5ff }

/* Hero */
.hero{ position:relative; min-height:78vh; display:grid; align-items:center; }
.hero-bg{ position:absolute; inset:0; overflow:hidden }
.hero-bg .grid{ position:absolute; inset:-50% -50% -50% -50%; background-image: linear-gradient(rgba(26,70,150,.12) 1px, transparent 1px),
  linear-gradient(90deg, rgba(26,70,150,.12) 1px, transparent 1px); background-size:40px 40px; transform:rotate(5deg) scale(1.2); animation: drift 30s linear infinite; }
.hero-bg .tricolor{ position:absolute; inset:auto 0 0 0; height:6px; background: linear-gradient(90deg, #ff7b00, #ffffff, #1e63c1);
  box-shadow: 0 -10px 30px rgba(30,99,193,.25); animation: slide 8s linear infinite; opacity:.9; }
@keyframes slide{ 0%{ transform: translateX(-30%);} 100%{ transform: translateX(30%);} }
@keyframes drift{ 0%{ transform: rotate(5deg) scale(1.2) translateY(0);} 50%{ transform: rotate(5deg) scale(1.2) translateY(-12px);} 100%{ transform: rotate(5deg) scale(1.2) translateY(0);} }
.hero-inner{ position:relative; z-index:1 }
.hero-copy.glass{ background:#ffffffd0; border:1px solid #e1e7f5; border-left:3px solid var(--saffron); border-radius:16px; padding:2rem; box-shadow: var(--shadow); }
.lede{ font-size:1.1rem; color:#374f7c } .accent{ color:var(--saffron) }
.cta-row{ display:flex; gap:.75rem; flex-wrap:wrap; margin:1rem 0 1rem }
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.8rem 1.1rem; border-radius:12px; border:1px solid #dbe6ff; font-weight:800; letter-spacing:.3px; text-decoration:none; cursor:pointer; box-shadow: 0 8px 20px rgba(0,0,0,.08); }
.btn.primary{ background: linear-gradient(180deg, var(--saffron), #d16800); color:#181818 }
.btn.secondary{ background:#f5f8ff; color:#0a1633 } .btn.secondary:hover{ background:#eef5ff }
.hero-facts{ display:flex; gap:1rem; flex-wrap:wrap; padding:0; margin:1rem 0 0}
.hero-facts li{ list-style:none; background:#f6f9ff; padding:.5rem .75rem; border:1px solid #e1e7f5; border-radius:999px }
.scroll-indicator{ position:absolute; bottom:1rem; left:50%; transform:translateX(-50%); color:#6a84b3; text-decoration:none; font-size:1.2rem;}

/* Sections & components */
.section{ padding:4rem 0 5rem } .section-head{ margin-bottom:1.25rem } .section-tag{ color:#5a749f }
.two-col{ display:grid; grid-template-columns: 1.2fr 1fr; gap:2rem } @media (max-width: 900px){ .two-col{ grid-template-columns: 1fr; } .site-header{ top:3rem } }
.glass{ background:#ffffffd0; border:1px solid #e1e7f5; border-radius:16px; box-shadow: var(--shadow) }
.callout{ border-left:4px solid var(--saffron); padding:1rem; border-radius:10px; background:#fff7ef } .callout.blue{ border-left-color: var(--blue-500); background:#edf4ff }
.pill-grid{ display:flex; flex-wrap:wrap; gap:.6rem; padding:0; margin:.75rem 0 1rem }
.pill-grid li{ list-style:none; padding:.5rem .8rem; border-radius:999px; background:#f6f9ff; border:1px solid #e1e7f5 }
.stat-card{ display:grid; grid-template-columns: repeat(3,1fr); gap:.5rem; padding:1rem; margin:0 0 1rem }
.stat-card .stat{ background:#f6f9ff; border:1px solid #e1e7f5; border-radius:12px; padding:1rem; text-align:center }
.stat-card .stat span{ display:block; font-family: Rajdhani; font-size:1.8rem; font-weight:800; color:#0a1633 } .stat-card .stat small{ color:#5a749f }

/* Cards & grid */
.grid-cards{ display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:1rem; }
@media (max-width: 1024px){ .grid-cards{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 640px){ .grid-cards{ grid-template-columns: 1fr; } }
.card{ position:relative; overflow:hidden; border-radius:16px; border:1px solid #e1e7f5; background:#fefeff; box-shadow: var(--shadow); display:flex; flex-direction:column; transition: transform .25s ease, box-shadow .25s ease; }
.card:hover{ transform: translateY(-4px); box-shadow: 0 16px 40px rgba(0,0,0,.15) }
.card .thumb{ background:#0f1f3e; position:relative; }
.card .thumb img{ width:100%; height:220px; object-fit:contain; display:block; transition: transform .5s ease }
.card:hover .thumb img{ transform: scale(1.03) rotate(.2deg) }
.card .guard{ position:absolute; inset:0; background:transparent }
.card .body{ padding:1rem 1rem 1.25rem; display:flex; flex-direction:column; gap:.5rem }
.card h3{ margin:0 } .card p{ margin:0 0 .5rem } .card .btn{ align-self:flex-start }

/* Product hero */
.product-hero{ display:grid; grid-template-columns: 1.1fr 1fr; gap:2rem; align-items:center }
.product-hero img{ width:100%; height:auto; max-height:460px; object-fit:contain; border-radius:16px; border:1px solid #e1e7f5; background:#fefeff }
@media (max-width: 900px){ .product-hero{ grid-template-columns: 1fr; } }

/* Footer */
.site-footer{ border-top:1px solid #e1e7f5; background:#f5f8ff } .footer-inner{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.25rem 0 }
.footer-inner a{ color:#5a749f; text-decoration:none; } .footer-inner a:hover{ color:#0a1633 }

/* Dialog (NDA) */
.nda-modal{ border:none; padding:0; background:transparent; } .modal-card{ width:min(620px, 92vw); padding:1.25rem 1.25rem 1rem; }
.modal-card header{ display:flex; align-items:center; gap:.5rem } .icon-lock{ width:20px; height:20px; fill:currentColor; margin-right:.25rem }
.field{ display:flex; flex-direction:column; gap:.25rem; margin:.75rem 0 }
.field input, .field textarea, .field select{ background:#f6f9ff; border:1px solid #e1e7f5; border-radius:10px; padding:.75rem .9rem; color:#0a1633 }
menu{ display:flex; gap:.5rem; justify-content:flex-end; margin:1rem 0 0; padding:0 }

/* MODE theme */
.theme-blue body{ background: radial-gradient(1400px 700px at 80% -10%, rgba(30,99,193,0.12), transparent), #eaf2ff; }

/* Reveal animations */
.reveal{ opacity:0; transform: translateY(10px); transition: opacity .6s ease, transform .6s ease } .reveal.on{ opacity:1; transform:none }

/* Smartphone optimizations */
@media (max-width: 768px){
  .container{ padding: 0 14px; } .site-header{ top: 2rem; } .hero{ min-height: 68vh; } .hero-copy.glass{ padding: 1.25rem; }
  .cta-row{ flex-direction: column; } .btn{ width: 100%; } .hero-facts{ flex-direction: column; gap:.5rem }
  .grid-cards{ grid-template-columns: 1fr; } .card .thumb img{ height: 180px; } .two-col{ grid-template-columns: 1fr; gap: 1.25rem; } .stat-card{ grid-template-columns: repeat(3,1fr); }
  .nda-bar{ padding: .5rem .75rem; }

  /* Off-canvas nav */
  .nav .menu-toggle{ display:inline-flex; align-items:center; justify-content:center; width:42px; height:38px; border-radius:10px; border:1px solid #dbe6ff; background:#f7faff; margin-left:.5rem; }
  .nav .menu-toggle:active{ transform: translateY(1px); }
  .nav .nav-links{
    position: fixed; top: 0; right: 0; height: 100vh; width: min(86vw, 340px); background: #ffffff; border-left:1px solid #e1e7f5; padding: 4.5rem 1rem 2rem;
    display:flex; flex-direction: column; gap:.5rem; transform: translateX(100%); transition: transform .3s ease; box-shadow: -20px 0 40px rgba(0,0,0,.10);
  }
  .nav .nav-links a, .nav .nav-links button.mode-toggle{ margin:0; padding:.9rem 1rem; }
  body.nav-open .nav .nav-links{ transform: translateX(0); }
  body.nav-open::before{ content:""; position: fixed; inset:0; background: rgba(0,0,0,.35); backdrop-filter: blur(2px); z-index:49; }
}
@media (min-width: 769px){ .nav .menu-toggle{ display:none } }
* { -webkit-tap-highlight-color: transparent; } html, body { overscroll-behavior: none; }

/* Protected images (deterrent only) */
img.protected{ -webkit-user-drag:none; user-select:none; }