:root {
    --bg-dark: #070a13;
    --neon-cyan: #00f0ff;
    --neon-purple: #9d33d6;
    --text-main: #ffffff;
    --text-muted: #aab4cc;
    --font-main: 'Inter', sans-serif;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: var(--font-main);
}

body {
    background-color: var(--bg-dark);
    color: var(--text-main);
    line-height: 1.6;
    letter-spacing: 0.2px;
    font-weight: 400;
    /* Drawing the precise circuit board background from the mockup */
    background-image:
        /* Cyan angled circuit line top left */
        linear-gradient(135deg, transparent 40%, rgba(0, 240, 255, 0.15) 40%, rgba(0, 240, 255, 0.15) 40.2%, transparent 40.2%),
        linear-gradient(135deg, transparent 38%, rgba(0, 240, 255, 0.08) 38%, rgba(0, 240, 255, 0.08) 38.1%, transparent 38.1%),
        linear-gradient(45deg, transparent 20%, rgba(0, 240, 255, 0.1) 20%, rgba(0, 240, 255, 0.1) 20.2%, transparent 20.2%),

        /* Purple angled circuit line top right */
        linear-gradient(-135deg, transparent 30%, rgba(157, 51, 214, 0.2) 30%, rgba(157, 51, 214, 0.2) 30.2%, transparent 30.2%),
        linear-gradient(-45deg, transparent 15%, rgba(157, 51, 214, 0.1) 15%, rgba(157, 51, 214, 0.1) 15.2%, transparent 15.2%),

        /* Cyan horizontal/angled traces bottom left */
        linear-gradient(20deg, transparent 60%, rgba(0, 240, 255, 0.15) 60%, rgba(0, 240, 255, 0.15) 60.1%, transparent 60.1%),

        /* Glowing nodes (dots) */
        radial-gradient(circle at 20% 40%, rgba(0, 240, 255, 0.4) 0%, rgba(0, 240, 255, 0.1) 2%, transparent 6%),
        radial-gradient(circle at 80% 30%, rgba(157, 51, 214, 0.4) 0%, rgba(157, 51, 214, 0.1) 2%, transparent 6%),
        radial-gradient(circle at 15% 70%, rgba(0, 240, 255, 0.2) 0%, transparent 4%),

        /* Deep background gradients */
        radial-gradient(circle at center, rgba(13, 19, 43, 0.9), rgba(4, 6, 15, 1));

    background-attachment: fixed;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.container {
    max-width: 1100px;
    margin: 0 auto;
    width: 100%;
}

/* =====================================
   Top Navigation
   ===================================== */
.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 2rem;
    position: relative;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.brand-wrapper {
    display: flex;
    align-items: center;
    gap: 1rem;
    text-decoration: none;
}

.logo-img {
    height: 64px;
    width: auto;
    object-fit: contain;
    border-radius: 4px;
}

.pill-prelaunch {
    background: linear-gradient(90deg, #103342, #071f2a);
    border: 1px solid var(--neon-cyan);
    color: var(--neon-cyan);
    padding: 0.15rem 1rem;
    border-radius: 50px;
    font-size: 0.75rem;
    font-weight: 500;
}

.nav-links {
    display: flex;
    gap: 2rem;
    align-items: center;
}

.nav-links a {
    color: var(--text-main);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 400;
    transition: color 0.3s;
}

.nav-links a:hover,
.nav-links a.active {
    color: var(--neon-cyan);
}

/* =====================================
   Hero
   ===================================== */
.hero-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 3rem;
    padding-bottom: 2rem;
    text-align: center;
}

.hero-title {
    font-size: 2.8rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 1rem;
    letter-spacing: -0.5px;
}

.hero-subtitle {
    font-size: 1.1rem;
    color: var(--text-muted);
    font-weight: 400;
    max-width: 700px;
    margin: 0 auto 2rem auto;
}

.status-indicator {
    background: linear-gradient(180deg, rgba(255, 51, 102, 0.15), rgba(255, 51, 102, 0.05));
    border: 1px solid rgba(255, 51, 102, 0.6);
    padding: 0.6rem 1.5rem;
    border-radius: 6px;
    font-size: 0.85rem;
    color: #ffffff;
    margin-bottom: 2rem;
    box-shadow: 0 0 15px rgba(255, 51, 102, 0.2), inset 0 0 10px rgba(255, 51, 102, 0.1);
    text-align: center;
    line-height: 1.4;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.status-indicator span {
    text-transform: none;
    letter-spacing: normal;
    font-weight: 400;
}

/* The Waitlist Button is a pill with neon text and border */
.btn-waitlist {
    background: linear-gradient(180deg, rgba(0, 240, 255, 0.1), transparent);
    border: 1px solid var(--neon-cyan);
    color: #ffffff;
    padding: 0.7rem 2rem;
    border-radius: 50px;
    font-weight: 600;
    font-size: 1rem;
    text-decoration: none;
    box-shadow: 0 0 20px rgba(0, 240, 255, 0.2), inset 0 0 10px rgba(0, 240, 255, 0.1);
    transition: all 0.3s;
}

.btn-waitlist:hover {
    background: rgba(0, 240, 255, 0.2);
    box-shadow: 0 0 30px rgba(0, 240, 255, 0.4), inset 0 0 15px rgba(0, 240, 255, 0.3);
}

/* =====================================
   Complex Cyber Frames (Matches Mockup)
   ===================================== */
/* The Problem panel and similar cards use these glowing cut corners */
.cyber-panel {
    position: relative;
    padding: 2px;
    /* Create the slanted polygon shape for the borders */
    clip-path: polygon(20px 0, 100% 0,
            100% calc(100% - 20px), calc(100% - 20px) 100%,
            0 100%, 0 20px);
    margin: 0 auto;
}

/* Base styling for the borders */
.cyber-panel::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05));
    z-index: 0;
}

/* Cyan Glowing Borders */
.cyber-panel-cyan::before {
    background: linear-gradient(135deg, var(--neon-cyan) 0%, rgba(0, 240, 255, 0.4) 50%, var(--neon-cyan) 100%);
}

.cyber-panel-cyan-dim::before {
    background: linear-gradient(135deg, rgba(0, 240, 255, 0.5) 0%, rgba(0, 240, 255, 0.2) 50%, rgba(0, 240, 255, 0.5) 100%);
}

/* Purple Glowing Borders */
.cyber-panel-purple::before {
    background: linear-gradient(135deg, var(--neon-purple) 0%, rgba(157, 51, 214, 0.4) 50%, var(--neon-purple) 100%);
}

.cyber-panel-red::before {
    background: linear-gradient(135deg, rgba(255, 51, 102, 0.8) 0%, transparent 40%, transparent 60%, rgba(255, 51, 102, 0.8) 100%);
}

.cyber-panel-inner {
    position: relative;
    z-index: 1;
    background: linear-gradient(180deg, rgba(21, 35, 62, 0.8), rgba(9, 14, 27, 0.9));
    backdrop-filter: blur(10px);
    width: 100%;
    height: 100%;
    /* Must match wrapper clip-path precisely */
    clip-path: polygon(19px 0, 100% 0,
            100% calc(100% - 19px), calc(100% - 19px) 100%,
            0 100%, 0 19px);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Frame specific for DRI / SRI (Pill-like with corner brackets) */
.indicator-panel {
    position: relative;
    border-radius: 50px;
    padding: 1px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05));
    overflow: hidden;
}

.indicator-panel-cyan {
    background: linear-gradient(90deg, var(--neon-cyan) 0%, rgba(0, 240, 255, 0.2) 100%);
    box-shadow: -10px 0 20px rgba(0, 240, 255, 0.2);
}

.indicator-panel-purple {
    background: linear-gradient(90deg, var(--neon-purple) 0%, rgba(157, 51, 214, 0.2) 100%);
    box-shadow: -10px 0 20px rgba(157, 51, 214, 0.2);
}

.indicator-inner {
    background: rgba(7, 12, 24, 0.9);
    border-radius: 50px;
    padding: 1.2rem 2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 100%;
}

.indicator-icon-cyan svg {
    stroke: var(--neon-cyan);
    fill: none;
}

.indicator-icon-purple svg {
    stroke: var(--neon-purple);
    fill: none;
}

/* The text inside the DRI/SRI cards */
.ind-title {
    font-weight: 700;
    font-size: 0.95rem;
    color: #fff;
    margin-bottom: 0.25rem;
}

.ind-desc {
    font-size: 0.85rem;
    color: var(--text-muted);
}


/* Layouts */
.flex {
    display: flex;
}

.flex-col {
    flex-direction: column;
}

.items-center {
    align-items: center;
}

.justify-center {
    justify-content: center;
}

.gap-8 {
    gap: 2rem;
}

/* =====================================
   Footer
   ===================================== */
.footer {
    position: relative;
    margin-top: auto;
    width: 100%;
    z-index: 1000;
    padding: 1.25rem 2rem 0.5rem;
    color: var(--text-muted);
    font-size: 0.85rem;
    line-height: 1.6;
    background: rgba(7, 10, 19, 0.95);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-top: 1px solid rgba(0, 240, 255, 0.15);
}

.footer-inner {
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 1.5rem;
    margin-bottom: 0.5rem;
}

.footer-col {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    min-width: 250px;
    flex: 1;
}

.footer-col h4 {
    color: var(--text-main);
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.footer-col a {
    color: var(--text-muted);
    text-decoration: none;
    transition: color 0.3s;
}

.footer-col a:hover {
    color: var(--neon-cyan);
}

.footer-prototype-note {
    font-size: 0.75rem;
    opacity: 0.7;
    margin-top: 0.5rem;
    line-height: 1.4;
    border-left: 2px solid rgba(255, 51, 102, 0.4);
    padding-left: 0.75rem;
}

.footer-bottom {
    text-align: center;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    padding-top: 1rem;
    font-size: 0.8rem;
    opacity: 0.6;
}

body {
    padding-bottom: 0px;
}

/* Demo Banner */
.demo-banner {
    background: #ff3366;
    color: white;
    padding: 0.25rem 0;
    font-weight: 600;
    font-size: 0.85rem;
    letter-spacing: 0.5px;
    position: relative;
    z-index: 100;
}

.demo-banner marquee {
    display: block;
}

/* =====================================
   Responsiveness
   ===================================== */
.min-h-screen {
    min-height: 100vh;
}

@media (max-width: 768px) {

    /* Global classes used in inline styles or specific pages */
    .founder-grid,
    .layout-grid {
        grid-template-columns: 1fr !important;
        gap: 2rem !important;
    }

    .segments-grid {
        grid-template-columns: 1fr !important;
    }

    .process-flow {
        flex-direction: column !important;
        align-items: center !important;
        gap: 2rem !important;
    }

    .process-line {
        display: none !important;
    }

    .process-step {
        width: 100% !important;
    }

    /* Navbar */
    .navbar {
        flex-direction: column !important;
        gap: 1rem !important;
        padding: 1rem !important;
    }

    .nav-links {
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 1rem !important;
        line-height: 1.8;
    }

    /* Typography */
    .hero-title {
        font-size: 2rem !important;
    }

    .page-title {
        font-size: 1.8rem !important;
    }

    /* Specific overrides for flex rows using inline styles */
    .cyber-panel-inner[style*="flex-direction: row"] {
        flex-direction: column !important;
        text-align: center;
        gap: 1.5rem !important;
    }

    .flex.gap-8 {
        flex-direction: column !important;
        gap: 1.5rem !important;
    }

    .input-group,
    [style*="grid-template-columns: 1fr 1fr"] {
        grid-template-columns: 1fr !important;
    }
}
/* =========================================================
   HFAI V8 — White / Red Futuristic Property-Tech System
   Reference-driven redesign, preserving application behaviour.
   ========================================================= */
:root{
  --hf-red:#d8000c;
  --hf-red-2:#ff2028;
  --hf-red-dark:#920008;
  --hf-ink:#0b1018;
  --hf-muted:#5d6572;
  --hf-paper:#f7f8fa;
  --hf-line:#e4e7ec;
  --hf-card:#ffffff;
  --hf-shadow:0 18px 45px rgba(35,39,47,.12);
}
html{scroll-behavior:smooth}
body.hfai-light, body{
  background:#f7f8fa;
  color:var(--hf-ink);
  min-height:100vh;
  display:block;
  background-image:
    linear-gradient(135deg,transparent 0 46%,rgba(216,0,12,.035) 46.1% 46.25%,transparent 46.35%),
    linear-gradient(45deg,transparent 0 70%,rgba(216,0,12,.025) 70.1% 70.25%,transparent 70.35%);
  background-size:420px 420px,520px 520px;
  background-attachment:fixed;
}
body.hfai-light:before, body.hfai-light:after{
  content:"";position:fixed;z-index:-1;pointer-events:none;width:38vw;height:38vw;opacity:.35;
  background-image:linear-gradient(90deg,rgba(216,0,12,.18) 1px,transparent 1px),linear-gradient(rgba(216,0,12,.18) 1px,transparent 1px);
  background-size:36px 36px;mask-image:linear-gradient(135deg,#000,transparent 72%);
}
body.hfai-light:before{left:-8vw;top:90px;transform:rotate(45deg)}
body.hfai-light:after{right:-8vw;bottom:80px;transform:rotate(225deg)}
.site-shell{max-width:1600px;margin:0 auto;background:rgba(255,255,255,.72);min-height:100vh;box-shadow:0 0 80px rgba(20,25,35,.06)}
.site-header{height:104px;padding:0 4.3%;display:flex;align-items:center;gap:30px;background:rgba(255,255,255,.94);backdrop-filter:blur(16px);border-bottom:1px solid #eef0f3;position:sticky;top:0;z-index:1000}
.brand{display:inline-flex;align-items:center;gap:11px;text-decoration:none;color:var(--hf-ink);min-width:max-content}
.brand img{width:52px;height:52px;object-fit:contain}
.brand-copy{display:flex;flex-direction:column;line-height:1.02}
.brand-copy strong{font-size:23px;letter-spacing:-1.1px;font-weight:800}
.brand-copy strong span{color:var(--hf-red)}
.brand-copy small{margin-top:5px;font-size:11.5px;font-weight:600;color:#313641;letter-spacing:-.1px}
.site-nav{display:flex;align-items:center;justify-content:center;gap:28px;flex:1}
.site-nav a{color:#11151c;text-decoration:none;font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.01em;position:relative;padding:42px 0 36px}
.site-nav a:after{content:"";position:absolute;left:50%;bottom:25px;width:0;height:2px;background:var(--hf-red);transition:.25s;transform:translateX(-50%)}
.site-nav a:hover,.site-nav a.active{color:var(--hf-red)}
.site-nav a:hover:after,.site-nav a.active:after{width:42px}
.header-cta,.hf-btn.red,.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:20px;text-decoration:none;background:linear-gradient(135deg,var(--hf-red),#b9000a);color:#fff!important;border:0;border-radius:6px;padding:17px 24px;font-weight:700;text-transform:uppercase;letter-spacing:.02em;box-shadow:0 10px 26px rgba(216,0,12,.22),inset 0 0 18px rgba(255,255,255,.1);transition:.25s}
.header-cta:hover,.hf-btn.red:hover,.btn-primary:hover{transform:translateY(-2px);box-shadow:0 15px 30px rgba(216,0,12,.3)}
.header-cta span{font-size:22px;font-weight:400}
.mobile-nav-toggle{display:none;border:1px solid #e3e6ea;background:#fff;border-radius:6px;font-size:24px;width:44px;height:44px}
.development-strip{background:#fff3f4;color:#8b1118;text-align:center;font-size:11px;font-weight:700;letter-spacing:.08em;padding:7px 20px;border-bottom:1px solid #ffdadd}
.page-main{min-height:65vh;position:relative;overflow:hidden}

/* public/internal shared content shell */
.container{max-width:none;width:100%;margin:0}
.app-shell{max-width:1240px;margin:0 auto;padding:56px 32px 80px}
.hf-title{font-size:clamp(2rem,4vw,3.7rem)!important;line-height:1.05!important;letter-spacing:-.05em!important;color:var(--hf-ink)!important;margin-bottom:16px!important}
.hf-gradient{background:none!important;-webkit-text-fill-color:initial!important;color:var(--hf-ink)!important}
.hf-muted,.mini{color:var(--hf-muted)!important}
.hf-card,.cyber-panel-inner,.indicator-inner{background:rgba(255,255,255,.92)!important;color:var(--hf-ink)!important;border:1px solid #e4e7eb!important;border-radius:14px!important;box-shadow:var(--hf-shadow)!important;clip-path:none!important}
.hf-card{position:relative;overflow:hidden}
.hf-card:before{content:"";position:absolute;left:0;top:0;width:68px;height:3px;background:var(--hf-red)}
.hf-card.red{border-color:#f0d5d7!important}.hf-card.purple{border-color:#eadde9!important}
.hf-card h1,.hf-card h2,.hf-card h3,.cyber-panel-inner h1,.cyber-panel-inner h2,.cyber-panel-inner h3{color:var(--hf-ink)!important}
.hf-card p,.cyber-panel-inner p{color:var(--hf-muted)!important}
.hf-btn{background:#fff!important;border:1px solid #d5d9df!important;color:#20242c!important;border-radius:6px!important;box-shadow:0 8px 20px rgba(30,34,40,.08)!important;font-weight:700!important}
.hf-btn:hover{border-color:var(--hf-red)!important;color:var(--hf-red)!important;transform:translateY(-1px)}
.hf-btn.red{background:linear-gradient(135deg,var(--hf-red),#b9000a)!important;color:#fff!important;border:0!important}
.hf-btn.ghost{background:#f8f9fb!important}
.hf-alert{background:#fff!important;border:1px solid #dfe3e8!important;color:#2c3037!important;border-radius:8px!important}.hf-alert.ok{border-color:#a8d9bd!important}.hf-alert.error{border-color:#efb2b6!important;background:#fff6f7!important}
.status-pill{background:#f7f8fa!important;color:#444b57!important;border:1px solid #dfe2e7!important}.status-pill.red{background:#fff3f4!important;color:#a40c15!important;border-color:#efc4c7!important}
.hf-form input,.hf-form textarea,.hf-form select{background:#fff!important;color:#171a20!important;border:1px solid #d8dce2!important;border-radius:7px!important}.hf-form input:focus,.hf-form textarea:focus,.hf-form select:focus{outline:2px solid rgba(216,0,12,.12)!important;border-color:var(--hf-red)!important}
.hf-table{color:#242830!important}.hf-table th{background:#f6f7f9!important;color:#1c2028!important}.hf-table td{border-color:#e5e7eb!important}
.stat{color:var(--hf-red)!important}

/* Generic public page hero enhancement — works with existing page content */
.page-main .hero-content{padding:64px 32px 32px;color:var(--hf-ink)}
.page-main .hero-title{font-size:clamp(2.4rem,5vw,5rem);letter-spacing:-.06em;line-height:.98;color:var(--hf-ink);font-weight:800}
.page-main .hero-subtitle{color:var(--hf-muted)}
.status-indicator{background:#fff4f5!important;color:#8b1118!important;border:1px solid #efc3c6!important;box-shadow:none!important}
.btn-waitlist{background:var(--hf-red)!important;color:#fff!important;border:0!important;border-radius:6px!important;box-shadow:0 10px 24px rgba(216,0,12,.22)!important}
.cyber-panel{clip-path:none!important;padding:0!important}.cyber-panel:before{display:none!important}
.cyber-panel-inner{padding:32px!important}
.indicator-panel{border-radius:14px!important;background:#fff!important;padding:0!important;box-shadow:none!important}
.indicator-inner{border-radius:14px!important}
.ind-title{color:var(--hf-ink)!important}.ind-desc{color:var(--hf-muted)!important}

/* Footer */
.site-footer{position:relative;border-top:1px solid #e7e9ed;background:#f4f5f7;padding:26px 4.3% 18px;display:grid;grid-template-columns:1fr 1.25fr 1fr;align-items:center;gap:24px;overflow:hidden}
.site-footer:before,.site-footer:after{content:"";position:absolute;width:300px;height:100px;border-top:1px solid rgba(216,0,12,.18);transform:skewX(-45deg)}
.site-footer:before{left:-80px;top:18px}.site-footer:after{right:-80px;bottom:-30px}
.footer-brand .brand img{width:42px;height:42px}.footer-brand .brand-copy strong{font-size:18px}.footer-brand .brand-copy small{font-size:10px}
.footer-quote{text-align:center;font-weight:800;color:var(--hf-red);font-size:26px}.footer-quote span{color:#20242b;font-size:14px;font-weight:600;margin:0 12px}
.footer-links{display:flex;justify-content:flex-end;gap:18px}.footer-links a{color:#353a44;text-decoration:none;font-size:12px;font-weight:700}.footer-links a:hover{color:var(--hf-red)}
.footer-bottom{grid-column:1/-1;text-align:center;color:#7a808a;font-size:10px;padding-top:12px;border-top:1px solid #e1e4e8}

@media(max-width:1180px){
 .site-header{gap:18px;padding:0 24px}.site-nav{gap:16px}.site-nav a{font-size:11px}.header-cta{padding:14px 16px}.brand-copy small{display:none}
}
@media(max-width:900px){
 .site-header{height:78px}.brand img{width:44px;height:44px}.brand-copy strong{font-size:20px}.mobile-nav-toggle{display:block;margin-left:auto}.header-cta{display:none}
 .site-nav{display:none;position:absolute;top:78px;left:0;right:0;background:#fff;padding:10px 24px 22px;box-shadow:0 18px 28px rgba(20,24,30,.12);flex-direction:column;align-items:stretch;gap:0}.site-nav.open{display:flex}.site-nav a{padding:13px 4px;border-bottom:1px solid #eee}.site-nav a:after{display:none}
 .site-footer{grid-template-columns:1fr;text-align:center}.footer-brand{display:flex;justify-content:center}.footer-links{justify-content:center}.footer-quote{order:2}.footer-links{order:3}.footer-bottom{order:4}
}
@media(max-width:640px){.app-shell{padding:38px 18px 60px}.development-strip{font-size:9px}.brand-copy strong{font-size:17px}.site-header{padding:0 16px}.site-footer{padding-left:18px;padding-right:18px}}

/* Legacy public pages upgraded into the V8 shell without changing their working PHP logic */
.demo-banner{background:#fff3f4!important;color:#8b1118!important;border-bottom:1px solid #ffdadd!important;box-shadow:none!important;font-size:11px!important;font-weight:700!important;letter-spacing:.05em!important}
.demo-banner marquee{padding:6px 0!important}
.navbar{min-height:96px!important;padding:0 4.3%!important;background:rgba(255,255,255,.96)!important;backdrop-filter:blur(16px)!important;border-bottom:1px solid #edf0f3!important;position:sticky!important;top:0!important;z-index:1000!important;box-shadow:0 8px 24px rgba(25,30,38,.04)!important}
.navbar .brand-wrapper{gap:9px!important}.navbar .brand-wrapper img{height:48px!important}.navbar .brand-wrapper span{background:none!important;-webkit-text-fill-color:initial!important;color:#0b1018!important;font-size:20px!important;letter-spacing:-.8px!important;text-transform:none!important}.navbar .brand-wrapper span::after{content:"AI";color:var(--hf-red);margin-left:0}
.navbar .pill-prelaunch{background:#fff3f4!important;color:#ad0912!important;border:1px solid #efc7ca!important;border-radius:999px!important;font-size:9px!important;text-transform:uppercase!important;letter-spacing:.05em!important}
.navbar .nav-links{gap:23px!important}.navbar .nav-links a{color:#11151c!important;text-transform:uppercase!important;font-weight:700!important;font-size:11.5px!important;position:relative!important}.navbar .nav-links a:hover,.navbar .nav-links a.active{color:var(--hf-red)!important}.navbar .nav-links a.active:after{content:"";position:absolute;left:50%;bottom:-14px;width:36px;height:2px;background:var(--hf-red);transform:translateX(-50%)}
.navbar .nav-links .nav-account,.navbar .nav-links .nav-mvp{border-radius:6px!important}.navbar .nav-links .nav-account{background:linear-gradient(135deg,var(--hf-red),#b9000a)!important;color:#fff!important;padding:10px 14px!important;border:none!important}
.footer{background:#f4f5f7!important;border-top:1px solid #e2e5e9!important;color:#232831!important;margin-top:50px!important}.footer h4{color:#171c23!important}.footer a{color:#535b66!important}.footer a:hover{color:var(--hf-red)!important}.footer-prototype-note,.footer-bottom{color:#6d7580!important}.footer-bottom{border-top:1px solid #dfe2e6!important}

/* Old inline component styles converted to the current light theme */
.step-text-box{background:#f8f9fb!important;border:1px solid #e2e5e9!important;box-shadow:none!important}.step-text-box .step-title{color:#161b22!important}.step-text-box .step-desc{color:#5f6672!important}.step-icon{background:#fff!important;border-color:var(--hf-red)!important;box-shadow:0 8px 18px rgba(216,0,12,.1)!important}.step-icon svg,.step-icon.icon-purple svg,.step-icon.icon-pink svg{stroke:var(--hf-red)!important}.step-icon.icon-purple,.step-icon.icon-pink,.step-icon.icon-cyan-dim{border-color:var(--hf-red)!important}.process-line{background:linear-gradient(90deg,transparent,var(--hf-red),transparent)!important}
.danger-icon{color:var(--hf-red)!important;border-color:var(--hf-red)!important;box-shadow:none!important}

@media(max-width:900px){
 .navbar{min-height:78px!important;padding:10px 18px!important;flex-wrap:wrap!important}.navbar .nav-links{width:100%!important;overflow-x:auto!important;gap:16px!important;padding:8px 0!important}.navbar .nav-links a{white-space:nowrap!important}.navbar .brand-wrapper img{height:40px!important}.navbar .brand-wrapper span{font-size:16px!important}.navbar .pill-prelaunch{display:none!important}
 .process-flow{flex-wrap:wrap!important;gap:20px!important}.process-step{width:calc(50% - 10px)!important}.process-line{display:none!important}
}
@media(max-width:560px){.process-step{width:100%!important}.navbar .brand-wrapper span{display:none!important}}

/* =========================================================
   HFAI V9 MASTER MOCKUP ENFORCEMENT
   One white/red design language across legacy + shared pages.
   ========================================================= */
:root{--bg-dark:#f7f8fa!important;--neon-cyan:#d8000c!important;--neon-purple:#d8000c!important;--text-main:#0b1018!important;--text-muted:#5d6572!important}
body{background-color:#f7f8fa!important;color:#0b1018!important;background-image:radial-gradient(circle at 14% 18%,rgba(216,0,12,.045),transparent 22%),linear-gradient(135deg,transparent 0 47%,rgba(216,0,12,.04) 47.1% 47.22%,transparent 47.32%)!important;background-size:auto,360px 360px!important}
body:after{content:"";position:fixed;inset:110px 0 0;pointer-events:none;z-index:-1;opacity:.45;background-image:linear-gradient(90deg,transparent 0 22px,rgba(216,0,12,.09) 23px,transparent 24px),linear-gradient(0deg,transparent 0 22px,rgba(216,0,12,.07) 23px,transparent 24px);background-size:150px 150px;mask-image:linear-gradient(115deg,#000 0,transparent 28%,transparent 72%,#000 100%)}
.container{max-width:1240px!important;margin:0 auto!important;padding-left:28px!important;padding-right:28px!important}
.navbar{max-width:1600px!important;margin:0 auto!important;background:#fff!important;color:#0b1018!important;border-bottom:1px solid #e7e9ee!important}
.navbar .brand-wrapper span{color:#0b1018!important}.navbar .nav-links a{color:#11151c!important}.navbar .nav-links a.active,.navbar .nav-links a:hover{color:#d8000c!important}
.hero-content,.main-content,.section,.content-section{color:#0b1018!important}
.hero-title,.page-title,.page-header,h1,h2,h3,h4,h5,h6{color:#0b1018!important;text-shadow:none!important}
p,.hero-subtitle,.intro-text,.timeline-desc,.context-block p{color:#5d6572!important}
.cyber-panel,.cyber-panel-cyan,.cyber-panel-purple,.cyber-panel-red,.cyber-panel-cyan-dim{clip-path:none!important;background:transparent!important;padding:0!important}
.cyber-panel:before,.cyber-panel::before{display:none!important}
.cyber-panel-inner{clip-path:none!important;background:#fff!important;color:#0b1018!important;border:1px solid #e2e5ea!important;border-radius:14px!important;box-shadow:0 16px 38px rgba(20,25,35,.1)!important;position:relative!important;overflow:hidden!important}
.cyber-panel-inner:before{content:"";position:absolute;top:0;left:0;width:74px;height:3px;background:#d8000c}
.step-text-box,.segment-card,.info-card,.roadmap-card,.feature-card{background:#fff!important;color:#0b1018!important;border:1px solid #e2e5ea!important;box-shadow:0 14px 34px rgba(20,25,35,.09)!important;border-radius:12px!important}
.step-icon,.segment-icon{color:#d8000c!important;stroke:#d8000c!important}.step-icon svg,.segment-icon svg{stroke:#d8000c!important}
.disclaimer-matrix{background:#fff!important;border:1px solid #e1e4e8!important;box-shadow:0 14px 34px rgba(20,25,35,.08)!important;color:#111!important}
.disclaimer-matrix th{background:#f5f6f8!important;color:#20242b!important;border-bottom:1px solid #e2e5e9!important}.disclaimer-matrix td{color:#343a45!important;border-bottom:1px solid #eceef1!important}
.download-btn,.form-submit-btn{background:linear-gradient(135deg,#d8000c,#b30009)!important;border:0!important;color:#fff!important;border-radius:6px!important;box-shadow:0 10px 24px rgba(216,0,12,.22)!important}
.form-group input,.form-group textarea,.form-group select,.input-field{background:#fff!important;border:1px solid #d9dde3!important;color:#171a20!important;border-radius:7px!important}.form-group input::placeholder,.input-field::placeholder{color:#9298a1!important}.form-group input:focus,.input-field:focus{border-color:#d8000c!important;box-shadow:0 0 0 3px rgba(216,0,12,.08)!important}
.founder-photo{filter:none!important;border:1px solid #e1e4e8!important;border-radius:12px!important;box-shadow:0 16px 38px rgba(20,25,35,.12)!important}
.roadmap-path{background:radial-gradient(ellipse at center,rgba(216,0,12,.08),transparent 70%)!important}.roadmap-line,.process-line{background:linear-gradient(90deg,transparent,#d8000c,transparent)!important}
.timeline-dot{background:#fff!important;border-color:#d8000c!important;box-shadow:0 0 0 6px rgba(216,0,12,.08)!important}
.mvp-frame{background:#fff!important;border:1px solid #efc8cb!important;box-shadow:0 16px 38px rgba(20,25,35,.1)!important}
a{accent-color:#d8000c}.mini a,.hf-muted a,p a{color:#b6000a!important}
.footer{background:#f4f5f7!important;color:#252a31!important}.footer *{text-shadow:none!important}
@media(max-width:900px){.container{padding-left:18px!important;padding-right:18px!important}.layout-grid,.founder-grid{grid-template-columns:1fr!important;gap:2rem!important}.segments-grid{grid-template-columns:1fr!important}.timeline{flex-direction:column!important;gap:2rem!important}.roadmap-line{display:none!important}}

/* Reconstructed v10 deliberate dual-theme layer */
.theme-toggle{display:inline-flex;align-items:center;gap:.4rem;border:1px solid #d8dce2;background:#fff;color:#171a20;border-radius:999px;padding:.65rem .85rem;font-weight:700;cursor:pointer}
.theme-toggle:focus-visible,.hf-btn:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #00a8bd!important;outline-offset:3px}
html[data-theme="dark"]{color-scheme:dark;background:#070a13}
html[data-theme="dark"] body{--hf-ink:#f5f7fb!important;--hf-muted:#b6c0d0!important;--hf-paper:#070a13!important;--hf-line:#26324a!important;--hf-card:#10182a!important;background:#070a13!important;color:#f5f7fb!important;background-image:radial-gradient(circle at 15% 15%,rgba(216,0,12,.12),transparent 28%),linear-gradient(135deg,transparent 0 47%,rgba(0,240,255,.06) 47.1% 47.25%,transparent 47.35%)!important}
html[data-theme="dark"] .site-shell{background:rgba(7,10,19,.82)!important;box-shadow:none}
html[data-theme="dark"] .site-header,html[data-theme="dark"] .site-nav,html[data-theme="dark"] .navbar{background:rgba(9,14,27,.96)!important;border-color:#202a3e!important}
html[data-theme="dark"] .brand,html[data-theme="dark"] .brand-copy small,html[data-theme="dark"] .site-nav a,html[data-theme="dark"] h1,html[data-theme="dark"] h2,html[data-theme="dark"] h3,html[data-theme="dark"] h4,html[data-theme="dark"] .hero-title{color:#f5f7fb!important}
html[data-theme="dark"] .hf-card,html[data-theme="dark"] .cyber-panel-inner,html[data-theme="dark"] .indicator-inner,html[data-theme="dark"] .step-text-box,html[data-theme="dark"] .segment-card,html[data-theme="dark"] .info-card,html[data-theme="dark"] .roadmap-card,html[data-theme="dark"] .feature-card{background:#10182a!important;color:#f5f7fb!important;border-color:#293550!important;box-shadow:0 18px 44px rgba(0,0,0,.3)!important}
html[data-theme="dark"] .hf-muted,html[data-theme="dark"] .mini,html[data-theme="dark"] p{color:#b6c0d0!important}
html[data-theme="dark"] .hf-form input,html[data-theme="dark"] .hf-form textarea,html[data-theme="dark"] .hf-form select{background:#080d18!important;color:#fff!important;border-color:#33415e!important}
html[data-theme="dark"] .hf-alert{background:#111b2e!important;color:#eef3fa!important;border-color:#34425f!important}
html[data-theme="dark"] .hf-alert.error{background:#2a1118!important;color:#ffdce2!important;border-color:#8e3345!important}
html[data-theme="dark"] .site-footer{background:#090e1b!important;border-color:#222d43!important}
html[data-theme="dark"] .footer-links a,html[data-theme="dark"] .footer-quote span,html[data-theme="dark"] .footer-bottom{color:#bdc6d5!important}
html[data-theme="dark"] .theme-toggle{background:#111a2b;color:#fff;border-color:#34415c}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
