/* ===== Light theme overrides (dark stays the default). Loaded last. ===== */
html{color-scheme:dark}
html[data-theme=light]{color-scheme:light;--bg:#f3f4f9;--surface:#fff;--surface-2:#eaecf4;--line:rgba(14,18,36,.11);--text:#0d1020;--muted:#555d75}
body{transition:background .4s,color .4s}
/* theme toggle button (in every navbar style) */
.theme-btn{flex:none;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--text);cursor:pointer;font-size:17px;line-height:1;display:grid;place-items:center;transition:transform .4s cubic-bezier(.22,1,.36,1),background .3s;margin-left:2px}
.theme-btn:hover{transform:rotate(25deg)}
html[data-theme=light] .theme-btn{background:rgba(14,18,36,.05)}
.nav.ns-notch .theme-btn{border-color:rgba(255,255,255,.18);color:#eef0f6}
html[data-theme=light] .nav.ns-notch .theme-btn{background:rgba(14,18,36,.06);color:#0d1020;border-color:rgba(14,18,36,.14)}

html[data-theme=light]{
}
html[data-theme=light] .snk-bar{color:#eef0f6}
html[data-theme=light] .aurora i{opacity:.2}
html[data-theme=light] .btn{background:rgba(14,18,36,.05)}
html[data-theme=light] .btn:hover{background:rgba(14,18,36,.09)}
html[data-theme=light] .btn-primary,html[data-theme=light] .btn-offer{color:#fff}
html[data-theme=light] .pill{background:rgba(14,18,36,.05);color:#3d4560}
html[data-theme=light] .chip{background:#fff;color:#3d4560}
html[data-theme=light] .chip.on,html[data-theme=light] .chip:hover{color:#0d1020;background:rgba(124,92,255,.14);border-color:rgba(124,92,255,.5)}
html[data-theme=light] .skills span{background:rgba(14,18,36,.05);color:#3d4560}
html[data-theme=light] .foot nav a:hover{color:var(--text)}
html[data-theme=light] .pv-top{background:rgba(255,255,255,.85)}
html[data-theme=light] .seg button{color:#3d4560}
html[data-theme=light] .seg button.on{color:#fff}
html[data-theme=light] .offer,html[data-theme=light] .offer h2,html[data-theme=light] .offer p,html[data-theme=light] .offer .price b{color:#fff}
html[data-theme=light] .offer s{color:#cfd4ea}
html[data-theme=light] .stats div span,html[data-theme=light] .pf-stats div span{color:var(--muted)}
html[data-theme=light] .pfacts b{background:linear-gradient(90deg,#0d1020,#4a56a6);-webkit-background-clip:text;background-clip:text}
html[data-theme=light] .steps-line::before{background:rgba(14,18,36,.1)}
html[data-theme=light] .marquee{background:#fff}
html[data-theme=light] .hs-tab{color:#3d4560;background:rgba(14,18,36,.05)}
html[data-theme=light] .hs-tab.on{color:#fff}
html[data-theme=light] .hs-glow{opacity:.35}
html[data-theme=light] .card,html[data-theme=light] .dcard{box-shadow:0 18px 40px -30px rgba(30,40,90,.35)}
html[data-theme=light] .pf-copy .pf-stats span{color:#cdd3ea}
/* navbar */
html[data-theme=light] .nav .wrap{background:rgba(255,255,255,.72);border-color:rgba(14,18,36,.1);box-shadow:0 18px 50px -28px rgba(30,40,90,.45),0 0 0 1px rgba(255,255,255,.6) inset}
html[data-theme=light] .nav.scrolled .wrap{background:rgba(255,255,255,.92);box-shadow:0 22px 50px -26px rgba(30,40,90,.5)}
html[data-theme=light] .nav-links{background:rgba(14,18,36,.04);border-color:rgba(14,18,36,.07)}
html[data-theme=light] .nav-links a{color:#4b5270}
html[data-theme=light] .nav-links a:hover,html[data-theme=light] .nav-links a.on{color:#0d1020}
html[data-theme=light] .nav-ind{background:linear-gradient(120deg,rgba(124,92,255,.2),rgba(0,212,255,.16));border-color:rgba(14,18,36,.08);box-shadow:0 6px 18px -10px var(--a1)}
html[data-theme=light] .burger{background:rgba(14,18,36,.05);border-color:rgba(14,18,36,.12)}
html[data-theme=light] .burger i{background:#0d1020}
html[data-theme=light] .burger.open i{background:#fff}
html[data-theme=light] .nav.ns-glass .wrap{background:rgba(255,255,255,.72);border-bottom-color:rgba(14,18,36,.1)}
html[data-theme=light] .nav.ns-glass.scrolled .wrap{background:rgba(255,255,255,.93)}
html[data-theme=light] .nav.ns-notch .wrap{--nbg:#fff;border-color:rgba(14,18,36,.1)}
html[data-theme=light] .nav.ns-notch .nav-links a{color:#d7dcf0}
html[data-theme=light] .nav.ns-notch .nav-links a:hover,html[data-theme=light] .nav.ns-notch .nav-links a.on{color:#fff}
html[data-theme=light] .nav.ns-notch .nav-links{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.16)}
@media(max-width:860px){
  html[data-theme=light] .nav .wrap,html[data-theme=light] .nav.scrolled .wrap{background:rgba(255,255,255,.95)}
  html[data-theme=light] .nav-links{background:radial-gradient(900px 500px at 80% 0%,rgba(124,92,255,.2),transparent 60%),radial-gradient(700px 500px at 0% 100%,rgba(0,212,255,.16),transparent 60%),rgba(243,244,249,.97)}
  html[data-theme=light] .nav-links a{color:#0d1020;border-bottom-color:rgba(14,18,36,.09)}
  html[data-theme=light] .nav-links a.on{color:transparent}
  html[data-theme=light] .nav-links .nav-cta{color:#fff}
}
/* gradient buttons keep their colours in light mode */
html[data-theme=light] .btn.btn-primary,html[data-theme=light] .btn.btn-primary:hover{background:linear-gradient(120deg,var(--a1),var(--a2));color:#fff}
html[data-theme=light] .btn.btn-offer,html[data-theme=light] .btn.btn-offer:hover{background:linear-gradient(120deg,var(--warm),#ff3d81);color:#fff}
html[data-theme=light] .pv-buy{background:rgba(255,255,255,.92);border-color:var(--line);color:var(--text)}
html[data-theme=light] .pv-buy s{color:var(--muted)}
