:root {
  --ink: #050806;
  --paper: #eaf0e8;
  --acid: #b7ff35;
  --green: #56f578;
  --violet: #a678ff;
  --blue: #165dff;
  --line: rgba(213, 255, 195, .18);
  --mx: 50vw;
  --my: 50vh;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--ink); }
body { margin: 0; background: var(--ink); color: var(--paper); font-family: Arial, Helvetica, sans-serif; overflow-x: hidden; }
button, a { font: inherit; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
::selection { background: var(--acid); color: #061006; }

.shell { width: min(1320px, calc(100% - 48px)); margin-inline: auto; }
.cursor-glow { position: fixed; z-index: 20; inset: 0; pointer-events: none; background: radial-gradient(280px circle at var(--mx) var(--my), rgba(183,255,53,.08), transparent 70%); mix-blend-mode: screen; }
.grain { position: fixed; z-index: 99; inset: 0; pointer-events: none; opacity: .13; background-image: radial-gradient(rgba(255,255,255,.24) .55px, transparent .75px), radial-gradient(rgba(183,255,53,.12) .55px, transparent .75px); background-size: 5px 5px, 7px 7px; background-position: 0 0, 2px 3px; }

.nav { height: 86px; position: absolute; z-index: 30; top: 0; left: 50%; transform: translateX(-50%); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; border-bottom: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: 11px; font-weight: 950; font-style: italic; font-size: 24px; letter-spacing: -1.5px; }
.brand > span:last-child > span { color: var(--acid); }
.brand-dot { width: 17px; height: 17px; display: inline-block; border: 4px solid var(--acid); border-radius: 50% 50% 50% 12%; rotate: -25deg; box-shadow: 0 0 22px rgba(183,255,53,.7); }
.nav-status { font: 700 10px/1 monospace; letter-spacing: 2px; color: #93a096; }
.nav-status i, .ca-label i { display: inline-block; width: 6px; height: 6px; margin-right: 8px; border-radius: 50%; background: var(--acid); box-shadow: 0 0 10px var(--acid); animation: blink 1.6s infinite; }
.nav-links { justify-self: end; display: flex; align-items: center; gap: 8px; }
.nav-links a { padding: 13px 16px; border: 1px solid var(--line); border-radius: 100px; font-size: 11px; font-weight: 800; letter-spacing: 1.2px; transition: .25s; }
.nav-links a:hover { background: var(--paper); color: var(--ink); transform: translateY(-2px); }
.nav-links .nav-buy { background: var(--acid); border-color: var(--acid); color: #071007; padding-inline: 22px; }

.hero { min-height: 880px; height: 100svh; max-height: 1080px; position: relative; isolation: isolate; overflow: hidden; background: #030605; }
.hero-bg { position: absolute; z-index: -3; inset: 0; background: linear-gradient(90deg, rgba(2,5,4,.1), transparent 47%), url('assets/frogiq-neural-lab.webp') 50% 50% / cover no-repeat; animation: breathe 8s ease-in-out infinite; }
.hero::before { content: ""; position: absolute; z-index: -2; inset: 0; background: linear-gradient(90deg, rgba(1,4,3,.88) 0%, rgba(1,4,3,.38) 43%, rgba(1,4,3,.03) 78%), linear-gradient(0deg, #050806 0%, transparent 28%); }
.hero::after { content: "FIQ"; position: absolute; z-index: -1; right: -2vw; bottom: -11vw; font-size: min(38vw, 600px); font-weight: 1000; line-height: .8; color: transparent; -webkit-text-stroke: 1px rgba(183,255,53,.06); letter-spacing: -4vw; }
.scan-lines { position: absolute; inset: 0; pointer-events: none; opacity: .12; background: repeating-linear-gradient(0deg, transparent 0 4px, rgba(190,255,163,.16) 5px); mix-blend-mode: overlay; }
.hero-content { height: 100%; position: relative; display: flex; align-items: center; }
.hero-copy { width: 58%; padding-top: 62px; }
.eyebrow { display: flex; gap: 13px; align-items: center; margin-bottom: 30px; font: 800 10px/1 monospace; letter-spacing: 2px; }
.eyebrow span { padding: 9px 11px; background: var(--acid); color: var(--ink); }
.eyebrow b { color: #7f8c82; }
.hero h1 { margin: 0; max-width: 850px; font-size: clamp(62px, 8.3vw, 132px); line-height: .81; letter-spacing: -.078em; font-weight: 1000; }
.hero h1 em { color: var(--acid); font-style: normal; text-shadow: 0 0 34px rgba(183,255,53,.22); }
.intro { max-width: 570px; margin: 31px 0 35px; color: #b8c2ba; font-size: clamp(16px, 1.4vw, 20px); line-height: 1.55; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.button { min-height: 58px; border: 1px solid rgba(229,255,219,.28); padding: 0 24px; display: inline-flex; align-items: center; justify-content: center; gap: 24px; cursor: pointer; font-size: 12px; font-weight: 900; letter-spacing: 1.3px; transition: .25s; clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px)); }
.button.primary { background: var(--acid); border-color: var(--acid); color: #071007; }
.button:hover { filter: brightness(1.12); transform: translateY(-3px); box-shadow: 0 10px 40px rgba(183,255,53,.12); }
.button.ghost { background: rgba(5,9,7,.62); backdrop-filter: blur(8px); }
.scan-icon { font-size: 24px; color: var(--acid); }
.specimen-data { position: absolute; width: 270px; right: 0; bottom: 132px; padding: 16px; border: 1px solid rgba(183,255,53,.25); background: rgba(3,8,5,.62); backdrop-filter: blur(13px); clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%); }
.data-head { display: flex; justify-content: space-between; color: var(--acid); font: 700 9px monospace; letter-spacing: 1.2px; }
.wave { height: 52px; display: flex; align-items: center; gap: 6px; border-bottom: 1px solid rgba(183,255,53,.16); }
.wave i { display: block; width: 3px; height: 15px; background: var(--acid); box-shadow: 0 0 8px rgba(183,255,53,.7); animation: wave 1.2s ease-in-out infinite alternate; }
.wave i:nth-child(2n) { animation-delay: -.4s; height: 30px; }.wave i:nth-child(3n) { animation-delay: -.7s; height: 42px; }.wave i:nth-child(5n) { height: 22px; }
.data-grid { display: grid; gap: 9px; margin-top: 13px; }
.data-grid span { display: flex; justify-content: space-between; color: #708077; font: 700 9px monospace; }.data-grid b { color: var(--paper); }
.ca-wrap { position: absolute; z-index: 3; bottom: 31px; left: 50%; transform: translateX(-50%); height: 66px; border: 1px solid var(--line); background: rgba(3,7,5,.74); backdrop-filter: blur(10px); display: grid; grid-template-columns: 190px 1fr 130px; align-items: center; }
.ca-label { padding-left: 20px; color: #7e8a81; font: 800 9px monospace; letter-spacing: 1.5px; }
.ca-wrap code { padding: 0 20px; color: #cbd4cc; font-size: 12px; overflow: hidden; text-overflow: ellipsis; border-left: 1px solid var(--line); border-right: 1px solid var(--line); white-space: nowrap; }
.ca-wrap button { height: 100%; border: 0; background: transparent; cursor: pointer; color: var(--acid); font: 900 10px monospace; letter-spacing: 1px; }.ca-wrap button:hover { background: var(--acid); color: var(--ink); }

.ticker { height: 54px; background: var(--acid); color: #071007; overflow: hidden; display: flex; align-items: center; transform: rotate(-1deg) scale(1.01); position: relative; z-index: 3; }
.ticker div { white-space: nowrap; font-weight: 1000; font-style: italic; font-size: 17px; letter-spacing: 1px; animation: ticker 24s linear infinite; }.ticker b { margin: 0 25px; }
.section-index { color: var(--acid); font: 800 10px monospace; letter-spacing: 2px; padding-bottom: 17px; border-bottom: 1px solid var(--line); }
.thesis { padding: 150px 0 170px; }
.thesis-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 9vw; padding-top: 62px; }
.thesis h2, .scanner-section h2, .portal h2 { margin: 0; font-size: clamp(52px, 6.4vw, 100px); line-height: .87; letter-spacing: -.07em; font-weight: 1000; }.thesis h2 span, .portal h2 span { color: transparent; -webkit-text-stroke: 1px var(--acid); }
.thesis-copy { padding-top: 5px; }.thesis-copy > p { max-width: 520px; margin: 0 0 25px; color: #9da9a0; font-size: 18px; line-height: 1.7; }
.lab-note { margin-top: 45px; border-left: 2px solid var(--acid); padding: 5px 0 5px 22px; display: grid; gap: 9px; }.lab-note span { color: var(--acid); font: 800 9px monospace; letter-spacing: 1.5px; }.lab-note strong { font-size: 14px; }

.scanner-section { min-height: 900px; position: relative; overflow: hidden; padding: 140px 0; border-block: 1px solid var(--line); background: #07100a; }
.scanner-bg { position: absolute; inset: 0; opacity: .32; background: linear-gradient(90deg,#050906 0%, transparent 60%), url('assets/frogiq-banner.webp') center/cover no-repeat; filter: saturate(.6); }

.is-hidden { display: none !important; }
.scanner-section::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 70% 55%, transparent 0 18%, rgba(3,7,4,.74) 55%), linear-gradient(90deg, rgba(3,8,5,.92) 0 40%, transparent 75%); }
.scanner-grid { position: relative; z-index: 2; display: grid; grid-template-columns: .9fr 1.1fr; gap: 12vw; align-items: center; }
.scanner-section h2 { margin: 44px 0 30px; }.scanner-section h2 em { color: var(--acid); font-style: italic; }
.scanner-section .scanner-grid > div:first-child > p { max-width: 470px; color: #95a198; line-height: 1.7; font-size: 17px; }
.scanner-card { justify-self: end; width: min(100%, 535px); min-height: 600px; border: 1px solid rgba(183,255,53,.34); padding: 20px; background: rgba(5,11,7,.82); backdrop-filter: blur(18px); box-shadow: 0 40px 100px rgba(0,0,0,.45), inset 0 0 90px rgba(183,255,53,.025); clip-path: polygon(0 0, calc(100% - 25px) 0, 100% 25px, 100% 100%, 0 100%); }
.scanner-top { display: flex; justify-content: space-between; color: #6f8174; font: 800 9px monospace; letter-spacing: 1.4px; }.scanner-top .blink { color: var(--acid); }
.scanner-orb { width: 250px; height: 250px; margin: 28px auto 13px; border-radius: 50%; position: relative; display: grid; place-items: center; background: radial-gradient(circle, rgba(21,106,255,.4), rgba(183,255,53,.08) 48%, transparent 68%); }
.scanner-orb img { width: 166px; height: 166px; border-radius: 50%; object-fit: cover; filter: saturate(1.25) contrast(1.05); z-index: 2; box-shadow: 0 0 44px rgba(22,93,255,.22); }
.scanner-orb i { position: absolute; inset: 8px; border: 1px solid rgba(183,255,53,.35); border-radius: 50%; animation: spin 12s linear infinite; }.scanner-orb i::before { content:""; position:absolute; width:7px; height:7px; border-radius:50%; background:var(--acid); top:12%; left:12%; box-shadow:0 0 14px var(--acid); }.scanner-orb i:nth-of-type(2){ inset:28px; animation-direction:reverse; animation-duration:8s; border-style:dashed }.scanner-orb i:nth-of-type(3){ inset:-8px; animation-duration:20s; opacity:.4 }
.is-scanning .scanner-orb { animation: scanPulse .7s ease-in-out infinite alternate; }.is-scanning .scanner-orb img { filter: saturate(2) contrast(1.3) hue-rotate(15deg); }
.result { text-align: center; min-height: 170px; display: flex; flex-direction: column; align-items: center; }.result > span { color: #768279; font: 800 9px monospace; letter-spacing: 1.5px; }.result strong { color: var(--acid); font-size: 70px; line-height: 1; letter-spacing: -.07em; text-shadow: 0 0 28px rgba(183,255,53,.25); }.result b { font-size: 14px; letter-spacing: 2px; margin-top: 4px; }.result p { margin: 9px 0 0; color: #87938a; font-size: 12px; }.result.waiting strong { margin: 11px 0; }
.scanner-card > button, .modal-core > button { width: 100%; height: 56px; border: 0; cursor: pointer; color: #061006; background: var(--acid); font: 950 11px monospace; letter-spacing: 1.2px; }.scanner-card > button:disabled, .modal-core > button:disabled { cursor: wait; opacity: .75; }

.portal { padding: 145px 0 125px; display: grid; grid-template-columns: .85fr 1.15fr; gap: 11vw; }.portal h2 { margin: 45px 0 28px; }.portal-copy p { max-width: 450px; color: #93a097; line-height: 1.65; }
.portal-links { border-top: 1px solid var(--line); }.portal-links a { min-height: 132px; border-bottom: 1px solid var(--line); display: grid; grid-template-columns: 55px 1fr auto; align-items: center; transition: .25s; position: relative; overflow: hidden; }.portal-links a::before { content:""; position:absolute; inset:0; background:var(--acid); transform:translateX(-101%); transition:.35s ease; }.portal-links a > * { position:relative; z-index:1; }.portal-links a:hover::before { transform:none; }.portal-links a:hover { color:#061006; padding-inline:18px; }.portal-links small { color:#657269; font:800 9px monospace; }.portal-links b { font-size:clamp(22px,3vw,38px); letter-spacing:-.04em; }.portal-links span { font:800 9px monospace; letter-spacing:1px; }
.footer { min-height: 130px; display: grid; grid-template-columns: 1fr 1.4fr 1fr; align-items: center; border-top: 1px solid var(--line); color: #6f7971; font: 700 9px/1.5 monospace; letter-spacing: .5px; }.footer p { text-align:center; max-width:480px; margin:auto; }.footer > span { text-align:right; }.footer-brand { color: var(--paper); font-family:Arial,sans-serif; font-size:19px; }

.modal { position:fixed; z-index:200; inset:0; background:rgba(1,5,2,.87); backdrop-filter:blur(16px); display:grid; place-items:center; animation:fade .25s ease; }.modal-close { position:absolute; right:28px; top:24px; width:48px; height:48px; border:1px solid var(--line); border-radius:50%; background:transparent; cursor:pointer; font-size:25px; }.modal-close:hover{background:var(--acid);color:var(--ink)}
.modal-core { width:min(600px,calc(100% - 36px)); min-height:550px; border:1px solid rgba(183,255,53,.35); background:radial-gradient(circle at center,rgba(34,122,50,.13),rgba(3,8,5,.96) 65%); padding:62px 50px 40px; text-align:center; position:relative; overflow:hidden; box-shadow:0 0 120px rgba(183,255,53,.1); }.modal-rings { height:150px; width:150px; margin:0 auto 25px; position:relative; }.modal-rings i { position:absolute; inset:0; border:1px solid var(--acid); border-radius:50%; animation:spin 7s linear infinite; }.modal-rings i:nth-child(2){inset:20px;border-style:dashed;animation-direction:reverse}.modal-rings i:nth-child(3){inset:42px;background:radial-gradient(circle,var(--acid),transparent 65%);box-shadow:0 0 35px rgba(183,255,53,.3)}
.modal-kicker{font:800 9px monospace;letter-spacing:2px;color:#718077}.modal-core strong{display:block;font-size:110px;line-height:1;color:var(--acid);letter-spacing:-.08em;margin-top:18px}.modal-core h3{font-size:22px;margin:5px 0 10px;letter-spacing:2px}.modal-core p{color:#849087;margin:0 0 30px}.modal-core>button{max-width:280px}.modal-core.is-scanning .modal-rings{animation:scanPulse .5s infinite alternate}

@keyframes blink { 50% { opacity:.3; } }
@keyframes breathe { 50% { transform: scale(1.018); filter: saturate(1.12); } }
@keyframes wave { to { height: 7px; opacity:.35; } }
@keyframes ticker { to { transform: translateX(-50%); } }
@keyframes spin { to { transform:rotate(360deg); } }
@keyframes scanPulse { to { transform:scale(1.055); filter:brightness(1.28); } }
@keyframes fade { from { opacity:0; } }

@media (max-width: 900px) {
  .shell { width: min(100% - 30px, 680px); }
  .nav { grid-template-columns: 1fr auto; }.nav-status { display:none; }.nav-links a:not(.nav-buy) { display:none; }
  .hero { height:auto; min-height:920px; }.hero-bg { background-position:62% center; }.hero::before { background:linear-gradient(90deg,rgba(1,4,3,.94),rgba(1,4,3,.35)),linear-gradient(0deg,#050806,transparent 40%); }
  .hero-content { min-height:850px; align-items:flex-start; padding-top:180px; }.hero-copy { width:100%; }.hero h1 { font-size:clamp(58px,15vw,90px); max-width:680px; }.intro { max-width:450px; }
  .specimen-data { display:none; }.ca-wrap { grid-template-columns:1fr 105px; bottom:26px; }.ca-label { display:none; }.ca-wrap code { border-left:0; }
  .thesis,.portal { padding:110px 0; }.thesis-grid,.scanner-grid,.portal { grid-template-columns:1fr; gap:70px; }.thesis-grid { padding-top:45px; }.thesis h2,.scanner-section h2,.portal h2 { font-size:clamp(48px,12vw,80px); }
  .scanner-section { padding:110px 0; }.scanner-card { justify-self:center; }.portal-links a { min-height:110px; }
  .footer { padding:40px 0; grid-template-columns:1fr; gap:24px; text-align:center; }.footer>span{text-align:center}.footer-brand{justify-content:center}
}

@media (max-width: 560px) {
  .nav { height:72px; }.brand { font-size:21px; }.nav-links .nav-buy { padding:11px 13px; font-size:9px; }
  .hero { min-height:870px; }.hero-bg { background-position:66% center; opacity:.8; }.hero-content { padding-top:142px; min-height:790px; }.hero-copy { text-shadow:0 2px 15px #000; }.eyebrow { margin-bottom:22px; }.hero h1 { font-size:clamp(52px,18vw,76px); line-height:.84; }.intro { font-size:15px; max-width:320px; }.hero-actions { flex-direction:column; align-items:stretch; width:min(100%,350px); }.button { min-height:54px; }.ca-wrap { height:60px; }.ca-wrap code { font-size:10px; padding-left:13px; }.ticker { height:46px; }.ticker div { font-size:14px; }
  .thesis,.portal,.scanner-section{padding:88px 0}.thesis-grid{gap:45px}.thesis-copy>p{font-size:16px}.scanner-card{padding:16px;min-height:560px}.scanner-orb{width:220px;height:220px}.scanner-orb img{width:145px;height:145px}.portal-links a{grid-template-columns:35px 1fr;}.portal-links a span{display:none}.portal-links b{font-size:25px}.modal-core{padding:48px 20px 30px;min-height:520px}.modal-core strong{font-size:86px}.cursor-glow{display:none}
}

@media (prefers-reduced-motion: reduce) { *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; scroll-behavior:auto!important; } }
