/* CertPulseAI marketing site styles. Brand tokens are the single source of truth. */
@import url("styles/brand-tokens.css");

:root{
      --ink:#05080f; --line:rgba(120,160,220,0.14); --line-2:rgba(120,160,220,0.08);
      --txt:#eef4ff; --txt-2:#9db4d4; --txt-3:#6781a4; --b:#2563eb; --b-hi:#38bdf8; --mono:var(--font-mono);
      --glass-a:rgba(120,160,220,0.10); --glass-b:rgba(120,160,220,0.02);
      --panel:rgba(8,14,28,0.5); --bar-track:rgba(120,160,220,0.14);
      --shell-1:rgba(20,32,55,0.94); --shell-2:rgba(8,14,28,0.96);
      --cta-1:rgba(20,32,55,0.7); --cta-2:rgba(8,14,28,0.7);
    }
    [data-theme='light']{
      --ink:#f2f6fc; --line:rgba(7,20,42,0.10); --line-2:rgba(7,20,42,0.06);
      --txt:#121821; --txt-2:#2a3f5c; --txt-3:#5a7494; --b:#2563eb; --b-hi:#0284c7;
      --glass-a:rgba(255,255,255,0.86); --glass-b:rgba(255,255,255,0.60);
      --panel:#e8eef8; --bar-track:#dde5f2;
      --shell-1:#ffffff; --shell-2:#e8eef8; --cta-1:#ffffff; --cta-2:#e8eef8;
    }
    [data-theme='light'] .field .blob{mix-blend-mode:multiply; opacity:0.14;}
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0; background:var(--ink); color:var(--txt); font-family:var(--font-sans); -webkit-font-smoothing:antialiased; overflow-x:hidden;}
    /* Beautiful scrollbars */
    *{scrollbar-width:thin; scrollbar-color:color-mix(in srgb, var(--txt-3) 55%, transparent) transparent;}
    ::-webkit-scrollbar{width:10px; height:10px;}
    ::-webkit-scrollbar-track{background:transparent;}
    ::-webkit-scrollbar-thumb{background:color-mix(in srgb, var(--txt-3) 45%, transparent); border-radius:999px; border:3px solid transparent; background-clip:padding-box;}
    ::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb, var(--txt-3) 75%, transparent); background-clip:padding-box;}
    ::-webkit-scrollbar-corner{background:transparent;}
    .modal-panel::-webkit-scrollbar{width:8px;}
    .modal-panel::-webkit-scrollbar-thumb{border-width:2px;}
    .field{position:fixed; inset:0; z-index:0; pointer-events:none;}
    .field .blob{position:absolute; border-radius:50%; filter:blur(70px); opacity:0.55; mix-blend-mode:screen;}
    .b1{width:55vw; height:55vw; left:-12vw; top:-18vw; background:radial-gradient(circle, #1d4ed8, transparent 62%); animation:drift1 22s ease-in-out infinite;}
    .b2{width:46vw; height:46vw; right:-10vw; top:-8vw; background:radial-gradient(circle, #38bdf8, transparent 60%); opacity:0.4; animation:drift2 26s ease-in-out infinite;}
    .b3{width:50vw; height:50vw; left:30vw; top:38vh; background:radial-gradient(circle, #2563eb, transparent 64%); opacity:0.28; animation:drift1 30s ease-in-out infinite reverse;}
    @keyframes drift1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(6vw,5vh) scale(1.12)}}
    @keyframes drift2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-7vw,6vh) scale(1.15)}}
    .grid-ov{position:fixed; inset:0; z-index:0; pointer-events:none;
      background-image:linear-gradient(var(--line-2) 1px, transparent 1px),linear-gradient(90deg, var(--line-2) 1px, transparent 1px);
      background-size:64px 64px; mask-image:radial-gradient(ellipse 90% 70% at 50% 0%, #000 30%, transparent 78%);}
    .grain{position:fixed; inset:0; z-index:1; pointer-events:none; opacity:0.04;
      background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
    .wrap{width:min(1180px, calc(100% - 48px)); margin-inline:auto; position:relative; z-index:2;}
    /* Vertical rhythm: a single flex gap controls all between-section spacing */
    .stack{display:flex; flex-direction:column; gap:var(--space-5xl);}
    .stack > section{padding-top:0 !important; padding-bottom:0 !important;}
    #hero{padding-top:calc(var(--space-5xl) + var(--space-2xl)) !important;}
    #teams{padding-top:var(--space-4xl) !important;}
    section[id]{scroll-margin-top:84px;}
    .stack > section > .wrap{display:flex; flex-direction:column; gap:var(--space-4xl);}
    .cursor-glow{position:fixed; inset:0; z-index:0; pointer-events:none;
      background:radial-gradient(560px 560px at var(--mx,50%) var(--my,14%), color-mix(in srgb, var(--b-hi) 13%, transparent), transparent 72%); transition:background .14s ease;}
    .glass{background:linear-gradient(180deg, var(--glass-a), var(--glass-b)); border:1px solid var(--line); border-radius:18px; backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);}
    .hair{position:relative}
    .hair::before{content:""; position:absolute; inset:0 0 auto; height:1px; background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--b-hi) 60%, transparent), transparent);}
    .nav{position:sticky; top:0; z-index:50; border-bottom:1px solid var(--line-2); background:color-mix(in srgb, var(--ink) 70%, transparent); backdrop-filter:blur(18px);}
    .navlink{padding:8px 12px; border-radius:9px; color:var(--txt-2); font-size:14px; font-weight:500; text-decoration:none; transition:color .15s, background .15s;}
    .navlink:hover{color:var(--txt); background:rgba(120,160,220,0.07);}
    .icon-btn{display:grid; place-items:center; width:38px; height:38px; border-radius:10px; border:1px solid var(--line); background:color-mix(in srgb, var(--txt-2) 8%, transparent); color:var(--txt-2); cursor:pointer; transition:background .15s, color .15s, border-color .15s;}
    .icon-btn:hover{color:var(--txt); border-color:color-mix(in srgb, var(--b) 40%, var(--line));}
    .theme-toggle .moon{display:none;}
    [data-theme='light'] .theme-toggle .sun{display:none;}
    [data-theme='light'] .theme-toggle .moon{display:block;}
    .brand-logo--onlight{display:none !important;}
    [data-theme='light'] .brand-logo--ondark{display:none !important;}
    [data-theme='light'] .brand-logo--onlight{display:block !important;}
    .btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; border:0; cursor:pointer; font:inherit; font-weight:600; font-size:14px; border-radius:999px; white-space:nowrap; transition:transform .15s, box-shadow .25s, background .2s; text-decoration:none;}
    .btn:active{transform:scale(.97)}
    .btn-pri{height:46px; padding:0 22px; color:#fff; background:linear-gradient(180deg, #3b82f6, #1d4ed8); box-shadow:0 0 0 1px rgba(120,170,255,.3) inset, 0 8px 30px rgba(37,99,235,.45);}
    .btn-pri:hover{box-shadow:0 0 0 1px rgba(120,170,255,.5) inset, 0 10px 40px rgba(37,99,235,.6); transform:translateY(-1px);}
    .btn-sm{height:40px; padding:0 16px;}
    .tag{font-family:var(--mono); font-size:12px; letter-spacing:.04em; color:var(--b-hi); text-transform:uppercase;}
    .chip{display:inline-flex; align-items:center; gap:8px; padding:7px 14px; border-radius:999px; border:1px solid color-mix(in srgb, var(--b) 45%, transparent); background:color-mix(in srgb, var(--b) 14%, transparent); color:var(--b-hi); font-family:var(--mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase;}
    .display{font-family:var(--font-display); font-weight:800; letter-spacing:-0.04em; line-height:0.98; margin:0;}
    .grad{background:linear-gradient(110deg, var(--b-hi) 0%, #818cf8 50%, var(--b) 100%); -webkit-background-clip:text; background-clip:text; color:transparent;}
    .ekg{display:block; width:100%; height:auto; overflow:visible;}
    .ekg .base{fill:none; stroke:var(--line); stroke-width:1.5;}
    .ekg .live{fill:none; stroke:url(#pg); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 0 6px var(--b-hi)); stroke-dasharray:160 1400; animation:trace 3.6s linear infinite;}
    @keyframes trace{from{stroke-dashoffset:1560}to{stroke-dashoffset:0}}
    .dot{width:8px; height:8px; border-radius:50%;}
    .dot.live{background:#34d399; box-shadow:0 0 0 0 rgba(52,211,153,.6); animation:ping 1.8s ease-out infinite;}
    @keyframes ping{0%{box-shadow:0 0 0 0 rgba(52,211,153,.5)}70%{box-shadow:0 0 0 7px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
    .rv{opacity:0; transform:translateY(22px); transition:opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1);}
    .rv.in{opacity:1; transform:none;}
    .marquee{display:flex; gap:14px; width:max-content; animation:scroll 80s linear infinite;}
    .marquee{animation-play-state:running;}
    @keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
    .mq-mask{overflow:hidden; mask-image:linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);}
    .float{animation:floaty 7s ease-in-out infinite;}
    @keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
    .bar{height:6px; border-radius:999px; background:var(--bar-track); overflow:hidden;}
    .bar > i{display:block; height:100%; border-radius:999px;}
    .feat{padding:26px; border-radius:18px; transition:transform .25s, border-color .25s, box-shadow .25s; position:relative; overflow:hidden;}
    .s3 > .glass, #teams .glass.hair{transition:transform .25s, border-color .25s, box-shadow .25s;}
    .feat:hover, .s3 > .glass:hover, #teams .glass.hair:hover{transform:translateY(-3px); border-color:color-mix(in srgb, var(--b) 40%, var(--line)); box-shadow:0 10px 26px color-mix(in srgb, var(--ink) 45%, transparent);}
    .ficon{display:grid; place-items:center; width:46px; height:46px; border-radius:13px; background:linear-gradient(160deg, color-mix(in srgb, var(--b) 35%, transparent), transparent); border:1px solid color-mix(in srgb, var(--b) 30%, transparent); color:var(--b-hi);}
    svg.ic{fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; display:block;}
    #features .feat, #teams .feat{display:grid; grid-template-columns:auto 1fr; column-gap:14px; align-items:center;}
    #features .feat > div:nth-child(2), #teams .feat > div:nth-child(2){margin:0 !important;}
    #features .feat > p, #teams .feat > p{grid-column:1 / -1; margin:14px 0 0 !important;}
    .sc-form .scf-form{display:grid; gap:16px; background:transparent !important; padding:0 !important; box-shadow:none !important;}
    .sc-form .scf-honeypot{display:none !important;}
    .sc-form .scf-privacy, .sc-form .scf-submit-btn{margin-top:0 !important;}
    .sc-form [id^=scf_]{background:transparent !important;}
    .sc-form .scf-fields{display:grid; gap:14px;}
    .sc-form .scf-field{display:grid; gap:6px;}
    .sc-form .scf-label{font-family:var(--font-sans) !important; font-size:13px !important; font-weight:600 !important; color:var(--txt-2) !important;}
    .sc-form .scf-required{color:var(--b-hi); margin-left:3px;}
    .sc-form .scf-input, .sc-form select, .sc-form textarea, .sc-form input[type=text], .sc-form input[type=email]{
      width:100% !important; height:46px !important; padding:0 14px !important; border-radius:12px !important;
      border:1px solid var(--line) !important; background:var(--panel) !important; color:var(--txt) !important;
      font-family:var(--font-sans) !important; font-size:14px !important; outline:none; box-shadow:none !important; transition:border-color .15s, box-shadow .15s;}
    .sc-form textarea{height:auto; min-height:90px; padding:12px 14px;}
    .sc-form .scf-input::placeholder{color:var(--txt-3);}
    .sc-form .scf-input:focus, .sc-form select:focus, .sc-form textarea:focus{border-color:color-mix(in srgb, var(--b-hi) 60%, transparent); box-shadow:0 0 0 3px color-mix(in srgb, var(--b) 22%, transparent);}
    .sc-form button, .sc-form [type=submit], .sc-form .scf-submit, .sc-form .scf-button{
      height:48px !important; padding:0 24px !important; border:0 !important; border-radius:999px !important; cursor:pointer;
      font-family:var(--font-sans) !important; font-weight:600 !important; font-size:14px !important; color:#fff !important;
      background:linear-gradient(180deg, #3b82f6, #1d4ed8) !important;
      box-shadow:0 0 0 1px rgba(120,170,255,.3) inset, 0 8px 30px rgba(37,99,235,.45) !important; transition:transform .15s, box-shadow .25s;}
    .sc-form button:hover, .sc-form [type=submit]:hover, .sc-form .scf-submit:hover{transform:translateY(-1px); box-shadow:0 0 0 1px rgba(120,170,255,.5) inset, 0 10px 40px rgba(37,99,235,.6);}
    .sc-form .scf-error-message, .sc-form .scf-error{color:#f87171; font-size:12px;}
    .sc-form .scf-error-message:empty{display:none !important; margin:0 !important;}
    .sc-form .scf-input.scf-error, .sc-form .scf-error input{border-color:#f87171 !important;}
    .sc-form .scf-message-container{color:var(--txt-2); font-size:13.5px; line-height:1.5;}
    .sc-form a{color:var(--b-hi);}
    .sc-form .scf-form, .sc-form .scf-fields, .sc-form .scf-field, .sc-form [id^=scf_]{border:0 !important; outline:none !important; box-shadow:none !important; background:transparent !important;}
    .sc-form .scf-fields{grid-template-columns:1fr !important; gap:16px !important;}
    .sc-form, .sc-form *{box-sizing:border-box !important; max-width:100% !important;}
    .sc-form .scf-option-group{display:grid; gap:10px;}
    .sc-form .scf-option-item{display:flex; align-items:center; gap:10px; padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:var(--panel); cursor:pointer; transition:border-color .15s;}
    .sc-form .scf-option-item:hover{border-color:color-mix(in srgb, var(--b-hi) 50%, var(--line));}
    .sc-form .scf-option-item span{color:var(--txt) !important; font-size:14px !important;}
    .sc-form input[type=checkbox], .sc-form input[type=radio]{width:18px !important; height:18px !important; accent-color:var(--b) !important; flex:none; cursor:pointer; margin:0;}
    .sc-form .scf-consent, .sc-form .scf-consent label, .sc-form .scf-consent span, .sc-form .scf-privacy, .sc-form .scf-privacy *{color:var(--txt-2) !important; font-size:13px !important; line-height:1.5;}
    .sc-form .scf-privacy a, .sc-form .scf-consent a{color:var(--b-hi) !important;}
    .modal-overlay{position:fixed; inset:0; z-index:200; display:grid; place-items:center; padding:24px;
      background:rgba(3,6,14,.66); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
      opacity:0; visibility:hidden; pointer-events:none; transition:opacity .3s ease, visibility .3s ease;}
    .modal-overlay.open{opacity:1; visibility:visible; pointer-events:auto;}
    .modal-panel{position:relative; width:min(500px,100%); max-height:88vh; overflow-y:auto; overflow-x:hidden;
      border:1px solid color-mix(in srgb, var(--b) 38%, transparent); border-radius:24px; padding:36px 32px 32px;
      background:linear-gradient(180deg, var(--shell-1), var(--shell-2));
      box-shadow:0 40px 120px rgba(3,8,22,.7), 0 0 0 1px rgba(120,160,220,.06) inset;
      transform:translateY(18px) scale(.96); opacity:.4; transition:transform .4s cubic-bezier(.22,1,.36,1), opacity .35s ease;}
    .modal-overlay.open .modal-panel{transform:none; opacity:1;}
    .modal-glow{position:absolute; inset:-1px -1px auto; height:170px; border-radius:24px 24px 0 0; pointer-events:none;
      background:radial-gradient(440px 170px at 50% -45%, color-mix(in srgb, var(--b-hi) 30%, transparent), transparent 70%);}
    .modal-close{position:absolute; top:14px; right:16px; z-index:3; width:34px; height:34px; border:0; border-radius:50%;
      background:rgba(120,160,220,.1); color:var(--txt-2); font-size:19px; line-height:1; cursor:pointer; transition:background .15s, color .15s;}
    .modal-close:hover{background:rgba(120,160,220,.2); color:var(--txt);}
    @media (max-width:920px){
      .hero-grid{grid-template-columns:1fr !important;}
      .f4{grid-template-columns:repeat(2,1fr) !important;}
      .s3{grid-template-columns:1fr !important;}
      .statline{grid-template-columns:repeat(2,1fr) !important;}
      .hide-sm{display:none !important;}
    }
    @media (prefers-reduced-motion: reduce){
      .live,.b1,.b2,.b3,.float,.dot.live,.marquee{animation:none !important;}
      .rv{opacity:1; transform:none;}
    }
