/* SEONINJA — light "white & blue" world theme for subpages (loads last) */
:root{--red:#1fb4f7;--red-bright:#4cc6ff;--red-deep:#0d7fc0;--red-glow:rgba(36,180,247,.55);
--text:#0e1b30;--text-soft:#3d4f6b;--text-dim:#64748f;--line:rgba(13,34,66,.16);--line-2:rgba(13,34,66,.3);
--panel:rgba(255,255,255,.66);--panel-2:rgba(255,255,255,.85);--black:#eef2f9;--black-2:rgba(255,255,255,.55);--chrome-lo:#5d6d86;--chrome:#31415c;--chrome-hi:#0e1b30}
html{background:#e9eef7}
body{color:var(--text)}
#bg3d{background:#e9eef7}
.world-vignette{background:radial-gradient(130% 100% at 50% 0%,transparent 55%,rgba(190,205,228,.5) 100%),radial-gradient(100% 120% at 50% 120%,rgba(36,180,247,.08),transparent 60%) !important}
/* glass pill nav */
.nav{position:fixed;top:calc(12px + env(safe-area-inset-top));left:50%;transform:translateX(-50%);width:min(1140px,calc(100% - 24px));border-radius:999px;border:1px solid rgba(255,255,255,.45);background:rgba(10,14,24,.42);-webkit-backdrop-filter:blur(18px) saturate(1.7);backdrop-filter:blur(18px) saturate(1.7);box-shadow:0 2px 6px rgba(0,0,0,.12),0 12px 32px -12px rgba(10,25,50,.35),inset 1px 1px 1px -0.5px rgba(255,255,255,.5),inset -1px -1px 1px -0.5px rgba(255,255,255,.45),inset 0 0 6px 6px rgba(255,255,255,.06);overflow:visible}
.nav::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,0) 46%);pointer-events:none}
.nav.scrolled{background:rgba(8,10,16,.62);border-color:rgba(255,255,255,.3)}
.nav-inner{height:58px;padding:0 12px 0 24px;gap:20px}
.nav .logo img{height:26px}
.nav-links > a{white-space:nowrap}
.nav-links > a::after{bottom:15px}
.nav .nav-icon{border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
@media(max-width:860px){.nav-inner{height:52px;padding:0 8px 0 18px}.nav .logo img{height:22px}.nav.nav-hidden{transform:translate(-50%,calc(-100% - 20px))}}
@media(min-width:861px){.nav.nav-hidden{transform:translateX(-50%)}}
body{padding-top:84px}
/* light scrims replace the dark immersive ones */
.block .wrap::before,.cta-band .inner::before{background:radial-gradient(110% 100% at 50% 50%,rgba(238,243,250,.66) 0%,rgba(238,243,250,.4) 48%,transparent 80%) !important}
.page-head:not(.built-head)::after{background:linear-gradient(90deg,rgba(238,243,250,.72) 0%,rgba(238,243,250,.34) 44%,rgba(238,243,250,.05) 72%,transparent 88%),linear-gradient(0deg,rgba(238,243,250,.9) 0%,transparent 42%) !important}
.built-head::after{background:radial-gradient(82% 92% at 50% 42%,rgba(240,245,252,.6),rgba(240,245,252,.35) 60%,transparent 86%) !important}
.seo-band{background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,.25)) !important;backdrop-filter:blur(2px)}
.ticker{background:rgba(255,255,255,.5) !important;border-color:var(--line)}
.ticker .track span{color:#4a5a75}
.cta-band{background:radial-gradient(70% 130% at 50% 0%,rgba(36,180,247,.16),transparent 60%),transparent !important}
footer{background:rgba(255,255,255,.55) !important;border-top:1px solid var(--line);backdrop-filter:blur(6px)}
/* cards & panels frost white */
.card{background:rgba(255,255,255,.72) !important;backdrop-filter:blur(6px)}
.card.featured{background:linear-gradient(180deg,rgba(230,245,255,.9),rgba(255,255,255,.75) 40%) !important}
.seo-card{background:rgba(255,255,255,.7) !important}
.value-card,.step{background:rgba(255,255,255,.62) !important;backdrop-filter:blur(5px)}
.form-card{background:rgba(255,255,255,.78) !important;backdrop-filter:blur(8px)}
/* dark-on-light text for hard-coded whites */
h1,h2,h3,h4,.card .name,.card .price .amt,.card .price .custom,.step h3,.value-card h3{color:#0e1b30 !important}
.card li{color:#22334d}
.btn-ghost{color:#16263f;background:rgba(255,255,255,.4)}
.btn-ghost:hover{color:#0e1b30;background:rgba(255,255,255,.75);box-shadow:inset 0 0 0 1.5px var(--chrome-lo)}
.btn-primary,.btn-primary span{color:#fff !important}
.nav-links > a:hover,.nav-item:hover > button{color:#fff}
.faq summary{color:#0e1b30}
.faq summary:hover{color:#0d9fe8}
.faq details[open] summary .q-ic{background:rgba(36,180,247,.1)}
.hero h1{text-shadow:0 2px 40px rgba(255,255,255,.65)}
.intro-lead,.sec-head p,.about-block p,.faq .ans,.step p,.value-card p{color:#3d4f6b}
.intro-lead a,.faq .ans a,.sec-head p a,.about-block p a{color:#0b86c8;border-bottom-color:rgba(36,180,247,.45)}
.intro-lead a:hover,.faq .ans a:hover,.sec-head p a:hover,.about-block p a:hover{color:#0d9fe8;border-color:#0d9fe8}
a{color:inherit}
.mega-card .t{color:#0e1b30}
.mega-card:hover .ic{color:#fff}
.foot-brand p{color:#3d4f6b}
.foot-col a{color:#31415c}
.foot-col a:hover{color:#0e1b30}
.foot-bottom .copy,.foot-status{color:#5d6d86}
.foot-social a:hover,.foot-social .soc-btn:hover,.foot-social .soc.open .soc-btn{color:#0e1b30;background:rgba(36,180,247,.1)}
.chrome-text{color:#31415c;-webkit-text-fill-color:initial;background:none}
/* built cards (Websites Built) */
.built-card{background:rgba(255,255,255,.75);border-color:rgba(13,34,66,.14);backdrop-filter:blur(6px)}
.built-card:hover{border-color:rgba(36,180,247,.6);box-shadow:0 30px 70px -28px rgba(36,180,247,.45),0 0 0 1px rgba(36,180,247,.25)}
.built-card:hover::after{box-shadow:inset 0 0 60px -10px rgba(36,180,247,.3)}
.bc-meta h3{color:#0e1b30}
.bc-dom,.bc-cat{color:#5d6d86}
/* forms & inputs */
input,textarea,select{color:#0e1b30 !important}
input::placeholder,textarea::placeholder{color:#8494ad !important}
.scan-bar{background:rgba(255,255,255,.72)}
.scan-bar input{color:#0e1b30}
.chip{color:#31415c;background:rgba(255,255,255,.5)}
.chip:hover{color:#0e1b30;background:rgba(36,180,247,.12);box-shadow:inset 0 0 0 1px var(--red)}
.cursor-glow{background:radial-gradient(circle closest-side,rgba(76,198,255,.4) 0%,rgba(36,180,247,.18) 38%,rgba(36,180,247,.06) 62%,transparent 78%);mix-blend-mode:multiply}
.cursor-glow.hot{background:radial-gradient(circle closest-side,rgba(76,198,255,.5) 0%,rgba(36,180,247,.22) 40%,rgba(36,180,247,.07) 64%,transparent 80%)}
.verse-cue{color:#31415c}
.verse-cue .bar::after{background:#0d9fe8}
.scanlines::after{opacity:.12}

/* ---- glass pill buttons ---- */
.btn{border-radius:999px !important;clip-path:none !important;border:1px solid rgba(255,255,255,.45);-webkit-backdrop-filter:blur(14px) saturate(1.6);backdrop-filter:blur(14px) saturate(1.6);position:relative;overflow:hidden}
.btn::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0) 50%);pointer-events:none}
.btn-primary{background:rgba(13,159,232,.55) !important;color:#fff !important;box-shadow:0 2px 6px rgba(10,25,50,.15),0 12px 30px -12px rgba(36,180,247,.6),inset 1px 1px 1px -0.5px rgba(255,255,255,.6),inset -1px -1px 1px -0.5px rgba(255,255,255,.4) !important;text-shadow:0 1px 2px rgba(10,40,70,.35)}
.btn-primary:hover{background:rgba(13,159,232,.72) !important;filter:none;box-shadow:0 2px 8px rgba(10,25,50,.2),0 0 34px -6px rgba(36,180,247,.75),inset 1px 1px 1px -0.5px rgba(255,255,255,.65) !important}
.btn-ghost{background:rgba(255,255,255,.35) !important;box-shadow:0 2px 6px rgba(10,25,50,.08),0 10px 26px -14px rgba(10,25,50,.3),inset 1px 1px 1px -0.5px rgba(255,255,255,.6),inset -1px -1px 1px -0.5px rgba(255,255,255,.45) !important}
.btn-ghost:hover{background:rgba(255,255,255,.6) !important;box-shadow:0 2px 8px rgba(10,25,50,.12),0 12px 30px -14px rgba(10,25,50,.35),inset 1px 1px 1px -0.5px rgba(255,255,255,.7) !important}
.btn-chrome{border-radius:999px !important;clip-path:none !important}
.card .btn,.scan-bar .btn{border-radius:999px !important}

/* nav text: white, crisp, lifts on hover */
.nav-links > a,.nav-item > button,.nav-login{color:#fff;text-shadow:0 1px 3px rgba(5,15,30,.55);transition:transform .18s ease,color .16s,text-shadow .18s}
.nav-links > a:hover,.nav-item:hover > button,.nav-login:hover{color:#fff;transform:translateY(-2px);text-shadow:0 2px 6px rgba(5,15,30,.6),0 0 14px rgba(76,198,255,.55)}
.nav .nav-icon{color:#fff}

/* centered nav links, no login */
.nav-inner{justify-content:space-between}
.nav-links{margin:0 auto;justify-content:center;flex:1}
.nav-spacer{display:none}

/* ---- custom cursor: blue dot + ring ---- */
@media (hover:hover) and (pointer:fine){
body{cursor:none}
a,button,.btn,.chip,.nav-icon,summary,input,textarea,select,label{cursor:none}
.cur-dot{position:fixed;top:0;left:0;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:#1fb4f7;box-shadow:0 0 10px rgba(36,180,247,.8);pointer-events:none;z-index:9999}
.cur-ring{position:fixed;top:0;left:0;width:38px;height:38px;margin:-19px 0 0 -19px;border-radius:50%;border:1.5px solid rgba(36,180,247,.75);pointer-events:none;z-index:9999;transition:width .18s ease,height .18s ease,margin .18s ease,border-color .18s ease,opacity .25s}
.cur-ring.hot{width:56px;height:56px;margin:-28px 0 0 -28px;border-color:#4cc6ff;box-shadow:0 0 18px -4px rgba(36,180,247,.6)}
.cur-dot.hidden,.cur-ring.hidden{opacity:0}
}