
@font-face{font-family:'Fixel Display';font-style:normal;font-weight:100;font-display:swap;src:url('../assets/fonts/FixelDisplay-Thin.woff2') format('woff2')}
@font-face{font-family:'Fixel Display';font-style:normal;font-weight:200;font-display:swap;src:url('../assets/fonts/FixelDisplay-ExtraLight.woff2') format('woff2')}
@font-face{font-family:'Fixel Display';font-style:normal;font-weight:300;font-display:swap;src:url('../assets/fonts/FixelDisplay-Light.woff2') format('woff2')}
@font-face{font-family:'Fixel Display';font-style:normal;font-weight:400;font-display:swap;src:url('../assets/fonts/FixelDisplay-Regular.woff2') format('woff2')}
@font-face{font-family:'Fixel Display';font-style:normal;font-weight:500;font-display:swap;src:url('../assets/fonts/FixelDisplay-Medium.woff2') format('woff2')}
@font-face{font-family:'Fixel Display';font-style:normal;font-weight:600;font-display:swap;src:url('../assets/fonts/FixelDisplay-SemiBold.woff2') format('woff2')}
@font-face{font-family:'Fixel Display';font-style:normal;font-weight:700;font-display:swap;src:url('../assets/fonts/FixelDisplay-Bold.woff2') format('woff2')}
@font-face{font-family:'Fixel Display';font-style:normal;font-weight:800;font-display:swap;src:url('../assets/fonts/FixelDisplay-ExtraBold.woff2') format('woff2')}
@font-face{font-family:'Fixel Display';font-style:normal;font-weight:900;font-display:swap;src:url('../assets/fonts/FixelDisplay-Black.woff2') format('woff2')}
*{box-sizing:border-box;margin:0;padding:0;font-family:'Fixel Display'!important}
body{font-family:'Fixel Display';background:#121417;color:#fff;overflow-x:hidden}
input,button,textarea,select{font-family:'Fixel Display'!important}
html{overflow-x:hidden}
@keyframes fadeUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
.fade-up{opacity:0;animation:fadeUp 0.9s cubic-bezier(0.22,1,0.36,1) forwards}
.d1{animation-delay:0.05s}.d2{animation-delay:0.2s}.d3{animation-delay:0.38s}.d4{animation-delay:0.52s}
@keyframes gradMove{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@keyframes blobFloat{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(30px,-20px) scale(1.04)}66%{transform:translate(-20px,25px) scale(0.97)}}
@keyframes blobFloat2{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(-25px,30px) scale(1.06)}66%{transform:translate(35px,-15px) scale(0.95)}}
@keyframes lf0{0%,100%{transform:translateY(0px)}50%{transform:translateY(-22px)}}
@keyframes lf1{0%,100%{transform:translateY(0px)}50%{transform:translateY(-17px)}}
@keyframes lf2{0%,100%{transform:translateY(0px)}50%{transform:translateY(-13px)}}
@keyframes lf3{0%,100%{transform:translateY(0px)}50%{transform:translateY(-9px)}}
@keyframes lf4{0%,100%{transform:translateY(0px)}50%{transform:translateY(-5px)}}
.lf0{animation:lf0 4s ease-in-out infinite}
.lf1{animation:lf1 4s ease-in-out infinite 0.28s}
.lf2{animation:lf2 4s ease-in-out infinite 0.56s}
.lf3{animation:lf3 4s ease-in-out infinite 0.84s}
.lf4{animation:lf4 4s ease-in-out infinite 1.12s}
/* Liquid glass (glassmorphism) — no outer shadows on any variant */
.glass{background:rgba(255,255,255,0.04);backdrop-filter:blur(24px) saturate(1.2);-webkit-backdrop-filter:blur(24px) saturate(1.2);border:1px solid rgba(255,255,255,0.12);box-shadow:inset 0 1px 0 rgba(255,255,255,0.14),inset 0 0 40px rgba(172,163,251,0.06);border-radius:20px;}
.glass-lg{background:rgba(255,255,255,0.05);backdrop-filter:blur(32px) saturate(1.3);-webkit-backdrop-filter:blur(32px) saturate(1.3);border:1px solid rgba(255,255,255,0.14);box-shadow:inset 0 1px 0 rgba(255,255,255,0.16),inset 0 0 80px rgba(172,163,251,0.08);border-radius:24px;}
.glass-lime{background:rgba(61,168,0,0.04);backdrop-filter:blur(28px) saturate(1.2);-webkit-backdrop-filter:blur(28px) saturate(1.2);border:1px solid rgba(61,168,0,0.2);box-shadow:inset 0 1px 0 rgba(255,255,255,0.1),inset 0 0 60px rgba(61,168,0,0.06);border-radius:24px;}
/* Liquid glass card — light sections (frosted glass on light bg, no outer shadow) */
.glass-card-light{background:rgba(255,255,255,0.52);backdrop-filter:blur(28px) saturate(2);-webkit-backdrop-filter:blur(28px) saturate(2);border:1.5px solid rgba(255,255,255,0.88);box-shadow:inset 0 1.5px 0 rgba(255,255,255,1);border-radius:20px;}
/* Shape decorations — floating cloud/spike/sphere (real Figma shapes, not blurred gradients) */
.shape{position:absolute;pointer-events:none;z-index:0;}
@keyframes floatA{0%,100%{transform:translate(0,0) rotate(0deg)}50%{transform:translate(8px,-14px) rotate(3deg)}}
@keyframes floatB{0%,100%{transform:translate(0,0) rotate(0deg)}50%{transform:translate(-12px,10px) rotate(-4deg)}}
.floatA{animation:floatA 11s ease-in-out infinite}
.floatB{animation:floatB 13s ease-in-out infinite}
/* Nav pill — hover affordance (it's a link back to the Leebry home).
   Silver double-pill from Figma node 1677:6623 (Desktop-8 scrolled state), permanently applied here. */
#navPill{transition:transform 0.35s cubic-bezier(0.22,1,0.36,1),box-shadow 0.35s ease,border-color 0.35s ease;cursor:pointer;}
#navPill:hover{transform:translateY(-1px) scale(1.02);box-shadow:0 6px 32px rgba(255,0,170,0.2),0 2px 20px rgba(0,0,0,0.35)!important;}
#navPill .navHomeArrow{opacity:0;width:0;margin-left:0;transition:opacity 0.3s ease,width 0.35s cubic-bezier(0.22,1,0.36,1),margin-left 0.35s cubic-bezier(0.22,1,0.36,1);overflow:hidden;display:inline-flex;align-items:center;color:rgba(26,26,25,0.55);font-size:9px;font-weight:700;letter-spacing:0.8px;text-transform:uppercase;white-space:nowrap;}
#navPill:hover .navHomeArrow{opacity:1;width:40px;margin-left:4px;}
/* Top-right "Back to Leebry" button */
#navBackBtn{position:fixed;top:26px;right:32px;z-index:100;display:inline-flex;align-items:center;gap:10px;padding:11px 18px 11px 11px;border-radius:100px;background:#FF00AA;border:1px solid #FF00AA;box-shadow:0 6px 20px rgba(255,0,170,0.35);text-decoration:none;transition:transform 0.25s cubic-bezier(0.22,1,0.36,1),box-shadow 0.25s ease,background 0.25s ease;cursor:pointer;}
#navBackBtn:hover{transform:translateY(-1px);background:#E6009A;box-shadow:0 10px 28px rgba(255,0,170,0.45);}
#navBackBtn .arrow{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,0.2);color:#fff;font-size:14px;line-height:1;transition:background 0.25s ease,transform 0.25s cubic-bezier(0.22,1,0.36,1);}
#navBackBtn:hover .arrow{background:rgba(255,255,255,0.3);transform:translateX(-3px);}
#navBackBtn .label{font-size:14px;font-weight:800;color:#fff;letter-spacing:-0.2px;line-height:1;}
#navBackBtn .hint{font-size:10px;font-weight:700;color:rgba(255,255,255,0.75);letter-spacing:1.4px;text-transform:uppercase;line-height:1;margin-bottom:3px;display:block;}
@media (max-width:1024px){
html{-webkit-text-size-adjust:96%;text-size-adjust:96%}
#navBackBtn{top:86px;left:50%;right:auto;transform:translateX(-50%);width:180px;justify-content:center}
#navBackBtn:hover{transform:translateX(-50%) translateY(-1px)}
.intro-three-cards{grid-template-columns:1fr!important}
.kt-four-cards{grid-template-columns:1fr!important}
.reality-gap-split{grid-template-columns:1fr!important}
.company-gap-three-cards{grid-template-columns:1fr!important}
.measurement-gap-three-cards{grid-template-columns:1fr!important}
.value-two-stats{grid-template-columns:1fr!important}
.value-theme-four-cards{grid-template-columns:1fr!important}
.value-quotes-three-cards{grid-template-columns:1fr!important}
.midmarket-paradox-split{grid-template-columns:1fr!important}
.trust-stat-split{grid-template-columns:1fr!important}
.security-stat-split{grid-template-columns:1fr!important}
.security-exposure-three-cards{grid-template-columns:1fr!important}
.minority-majority-split{grid-template-columns:1fr!important}
.about-builtby-split{grid-template-columns:1fr!important}
.macpaw-products-grid{grid-template-columns:repeat(2,1fr)!important}
.audit-gap-three-cards{grid-template-columns:1fr!important}
.knowledge-dual-stat{grid-template-columns:1fr!important}
.falling-short-dual-stat{grid-template-columns:1fr!important}
.audit-gap-metric-row{flex-direction:column!important;gap:14px!important}
}
@media (max-width:768px){
html{-webkit-text-size-adjust:92%;text-size-adjust:92%}
#navBackBtn{display:none!important}
.survey-hero-split{grid-template-columns:1fr!important;gap:24px!important}
.key-finding-3x-split{grid-template-columns:1fr!important;gap:20px!important;align-items:start!important}
.kt-stat-split{grid-template-columns:1fr!important;gap:12px!important;align-items:start!important}
.formal-metrics-split{grid-template-columns:1fr!important;gap:28px!important}
.momentum-split{grid-template-columns:1fr!important;gap:28px!important}
.audit-readiness-split{grid-template-columns:1fr!important;gap:28px!important}
.audit-readiness-three-cards{grid-template-columns:1fr!important}
.stat-row{grid-template-columns:1fr!important;gap:12px!important;align-items:start!important}
}
/* Report email gate modal */
#reportModal{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:16px;visibility:hidden;opacity:0;transition:opacity 0.25s ease,visibility 0.25s ease}
#reportModal.is-open{visibility:visible;opacity:1}
#reportModalOverlay{position:absolute;inset:0;background:rgba(18,20,23,0.85);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);cursor:pointer}
#reportModalBox{position:relative;background:rgba(255,255,255,0.06);backdrop-filter:blur(32px) saturate(1.3);-webkit-backdrop-filter:blur(32px) saturate(1.3);border:1px solid rgba(255,255,255,0.14);border-radius:24px;padding:48px 40px 40px;width:100%;max-width:460px;box-shadow:inset 0 1px 0 rgba(255,255,255,0.16),0 24px 80px rgba(0,0,0,0.6);z-index:1}
#reportModalClose{position:absolute;top:16px;right:16px;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,0.08);border:none;cursor:pointer;color:rgba(255,255,255,0.55);display:flex;align-items:center;justify-content:center;transition:background 0.2s ease,color 0.2s ease}
#reportModalClose:hover{background:rgba(255,255,255,0.15);color:#fff}
#reportModalBadge{display:inline-flex;align-items:center;padding:6px 14px;border-radius:100px;background:#FF00AA;margin-bottom:20px;box-shadow:0 8px 24px -6px rgba(255,0,170,0.45)}
#reportModalBadge span{font-size:10px;font-weight:800;color:#fff;letter-spacing:1.5px;text-transform:uppercase}
#reportModalBox h2{font-size:26px;font-weight:800;color:#fff;letter-spacing:-0.4px;margin-bottom:10px}
#reportModalDesc{font-size:15px;color:rgba(255,255,255,0.5);line-height:1.6;margin-bottom:28px}
#reportModalEmail{width:100%;padding:15px 20px;border-radius:12px;border:1.5px solid rgba(255,255,255,0.18);background:rgba(255,255,255,0.06);color:#fff;font-size:15px;font-weight:500;outline:none;transition:border-color 0.2s ease;display:block;margin-bottom:4px}
#reportModalEmail::placeholder{color:rgba(255,255,255,0.3)}
#reportModalEmail:focus{border-color:rgba(255,255,255,0.45)}
#reportModalError{display:block;font-size:13px;color:#FF6B6B;min-height:16px;margin-bottom:6px}
#reportModalSubmit{width:100%;padding:16px;border-radius:12px;background:#FF00AA;border:none;cursor:pointer;color:#fff;font-size:15px;font-weight:700;transition:background 0.2s ease,transform 0.2s ease,box-shadow 0.2s ease;box-shadow:0 8px 24px -4px rgba(255,0,170,0.45)}
#reportModalPrivacy{font-size:11px;line-height:1.6;color:rgba(255,255,255,0.35);margin-top:16px;margin-bottom:0;text-align:center}
#reportModalPrivacy a{color:rgba(255,255,255,0.55);text-decoration:underline}
#reportModalSubmit:hover{background:#E6009A;transform:translateY(-1px);box-shadow:0 12px 32px -4px rgba(255,0,170,0.55)}
#reportModalSubmit:active{transform:translateY(0)}
#reportModalSubmit:disabled{opacity:0.6;cursor:default;transform:none!important}
#reportModalSuccess:not([hidden]){display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center;padding:24px 0 8px}
#reportModalSuccess p{font-size:16px;color:rgba(255,255,255,0.65);line-height:1.6;margin:0}
@media(max-width:480px){#reportModalBox{padding:40px 24px 32px}#reportModalBox h2{font-size:22px}}
@media(max-width:1024px){.cta-bubbles-grid{grid-template-columns:1fr!important}}
@media(max-width:768px){.cta-bubbles-grid .glass{padding:36px 28px!important}}
