/* sentinel-blog.css — WS13.9/13.10: legacy blog-family CSS (index bi-*,
editorial, was-breached, anti-doxxing, guide, breach-alert) palette-
mapped onto Sentinel tokens. Markup + filter JS byte-identical; only
the skin changed. Loaded on blog pages via sx_page(extra_head). */
/* WS12.585.109 — Kill sidebar offset on public blog. Body carries the
has-sidebar class from the global layout (which leaves padding-left
for the dashboard sidebar), but the public blog never renders that
sidebar — so the offset just shifts all content ~350px to the right
on desktop. Same override block used on /ai-concierge and /features. */
.sidebar-nav,
.mobile-bottom-nav,
.mobile-sidebar-overlay,
.sidebar-toggle,
.sidebar-overlay { display: none !important; }
.main-content,
.dashboard-main,
.content-area {
margin-left: 0 !important;
padding-left: 0 !important;
width: 100% !important;
max-width: 100% !important;
}
body.has-sidebar { padding-left: 0 !important; }
body.has-sidebar .gw-sticky-nav-topnav { display: flex !important; }
.gw-reveal,.gw-reveal-left,.gw-reveal-right,.gw-reveal-scale{opacity:1!important;transform:none!important;}
.bi-wrap{max-width:1180px;margin:0 auto;padding:2rem 1.25rem 5rem;padding-top:100px;}/* HERO */
.bi-hero{text-align:center;margin-bottom:2rem;}.bi-hero.gw-bg{padding:3.2rem 1.5rem 2.4rem;}@media(max-width:640px){.bi-hero.gw-bg{padding:2.2rem 1.1rem 1.6rem;}}.bi-wrap .bi-hero h1{font-size:clamp(1.85rem,3.6vw,2.4rem);font-weight:800;color:#fafafa;letter-spacing:-.5px;margin:0 0 .5rem;}.bi-wrap .bi-hero h1 span{background:linear-gradient(135deg,#84cc16,#65a30d,#bef264);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}.bi-wrap .bi-hero p{color:#a1a1aa;font-size:.95rem;max-width:580px;margin:0 auto;line-height:1.6;}/* FILTER BAR */
.bi-filter-bar{position:relative;z-index:1;margin:0 0 2rem;padding:1rem 1.1rem;background:linear-gradient(180deg,rgba(7,9,15,.92),rgba(7,9,15,.85));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(82,82,91,.35);border-radius:16px;display:flex;flex-direction:column;gap:.85rem;}.bi-wrap .bi-search-wrap{position:relative;width:100%;}.bi-wrap .bi-search-wrap svg{position:absolute;top:50%;left:.85rem;transform:translateY(-50%);color:#6b6b73;width:16px;height:16px;pointer-events:none;}.bi-wrap .bi-search-input{width:100% !important;height:42px !important;padding:0 2.4rem 0 2.5rem !important;background:rgba(7,9,15,.7) !important;color:#fafafa !important;border:1px solid rgba(82,82,91,.35) !important;border-radius:999px !important;font-size:.9rem !important;font-family:inherit !important;outline:none !important;transition:border-color .2s,background .2s !important;line-height:42px !important;box-shadow:none !important;}.bi-wrap .bi-search-input:focus{border-color:#84cc16;background:rgba(7,9,15,.95);}.bi-wrap .bi-search-clear{position:absolute !important;top:50% !important;right:.7rem !important;transform:translateY(-50%) !important;background:rgba(82,82,91,.35) !important;border:none !important;color:#a1a1aa !important;cursor:pointer !important;width:22px !important;height:22px !important;border-radius:999px !important;display:none;align-items:center;justify-content:center;font-size:.95rem !important;line-height:1 !important;padding:0 !important;}.bi-wrap .bi-search-clear.is-shown{display:inline-flex;}.bi-wrap .bi-filter-row{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap;}.bi-wrap .bi-filter-tabs{display:flex;gap:.4rem;flex-wrap:wrap;flex:1;}.bi-wrap .bi-tab{display:inline-flex !important;align-items:center !important;gap:.45rem !important;height:38px !important;padding:0 1.05rem !important;background:rgba(15,23,41,.55) !important;color:#a1a1aa !important;border:1px solid rgba(82,82,91,.35) !important;border-radius:999px !important;font-size:.82rem !important;font-weight:600 !important;cursor:pointer !important;font-family:inherit !important;transition:all .15s !important;line-height:1 !important;white-space:nowrap !important;text-transform:none !important;letter-spacing:0 !important;}.bi-wrap .bi-tab:hover{border-color:rgba(132,204,22,.35);color:#fafafa;}.bi-wrap .bi-tab.is-active{background:linear-gradient(135deg,rgba(132,204,22,.15),rgba(132,204,22,.18));border-color:#84cc16;color:#84cc16;}.bi-wrap .bi-tab-count{display:inline-block;font-size:.7rem;font-weight:700;padding:.1rem .45rem;background:rgba(82,82,91,.35);border-radius:999px;color:#a1a1aa;}.bi-wrap .bi-tab.is-active .bi-tab-count{background:rgba(132,204,22,.18);color:#84cc16;}.bi-wrap .bi-secondary{display:flex;gap:.5rem;align-items:center;}/* WS12.224 — tag cloud collapsed: primary chips inline,secondary chips revealed by 'More topics' toggle */
.bi-tagcloud{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;padding:.75rem 0 0;border-top:1px solid rgba(82,82,91,.35);margin-top:.65rem;}.bi-wrap .bi-tagcloud-label{font-size:.7rem;color:#6b6b73;font-weight:600;letter-spacing:.06em;text-transform:uppercase;align-self:center;margin-right:.45rem;}.bi-wrap .bi-tag-chip{display:inline-flex !important;align-items:center !important;gap:.35rem !important;height:30px !important;padding:0 .85rem !important;background:rgba(15,23,41,.55) !important;color:#a1a1aa !important;border:1px solid rgba(82,82,91,.35) !important;border-radius:999px !important;font-size:.78rem !important;font-weight:500 !important;cursor:pointer !important;font-family:inherit !important;transition:all .15s !important;text-transform:lowercase !important;letter-spacing:.01em !important;line-height:1 !important;white-space:nowrap !important;}.bi-wrap .bi-tag-chip:hover{border-color:rgba(132,204,22,.32);color:#fafafa;background:rgba(15,23,41,.85);}.bi-wrap .bi-tag-chip.is-active{background:linear-gradient(135deg,rgba(132,204,22,.18),rgba(132,204,22,.16));border-color:#84cc16;color:#84cc16;}.bi-wrap .bi-tag-chip-count{font-size:.65rem;font-weight:700;color:#6b6b73;}.bi-wrap .bi-tag-chip.is-active .bi-tag-chip-count{color:#84cc16;}.bi-wrap .bi-tag-chip.bi-tag-secondary{display:none !important;}.bi-wrap .bi-tagcloud.is-expanded .bi-tag-chip.bi-tag-secondary{display:inline-flex !important;}.bi-wrap .bi-tag-more{display:inline-flex !important;align-items:center !important;gap:.3rem !important;height:30px !important;padding:0 .9rem !important;background:transparent !important;color:#a1a1aa !important;border:1px dashed rgba(82,82,91,.35) !important;border-radius:999px !important;font-size:.74rem !important;font-weight:600 !important;cursor:pointer !important;font-family:inherit !important;letter-spacing:.02em !important;transition:all .15s !important;line-height:1 !important;text-transform:none !important;}.bi-wrap .bi-tag-more:hover{color:#84cc16;border-color:rgba(132,204,22,.4);}.bi-wrap .bi-tag-more svg{width:11px;height:11px;transition:transform .2s;}.bi-wrap .bi-tagcloud.is-expanded .bi-tag-more svg{transform:rotate(180deg);}.bi-wrap .bi-tag-clear{margin-left:.25rem;background:transparent;border:none;color:#6b6b73;font-size:.72rem;cursor:pointer;font-family:inherit;padding:.25rem .5rem;border-radius:999px;display:none;}.bi-wrap .bi-tag-clear:hover{color:#fca5a5;background:rgba(239,68,68,.08);}.bi-wrap .bi-tag-clear.is-shown{display:inline-flex;align-items:center;}.bi-wrap .bi-select{padding:.55rem .85rem .55rem .85rem;background:rgba(15,23,41,.55);color:#a1a1aa;border:1px solid rgba(82,82,91,.35);border-radius:999px;font-size:.82rem;font-family:inherit;cursor:pointer;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;utf8,");background-repeat:no-repeat;background-position:right .65rem center;background-size:14px;padding-right:2rem;}.bi-wrap .bi-select:hover{border-color:rgba(132,204,22,.32);}.bi-wrap .bi-select.is-disabled{opacity:.4;pointer-events:none;}.bi-wrap .bi-select{height:38px;padding-top:0;padding-bottom:0;line-height:1;}/* RESULT META + GRID */
.bi-results{display:flex;justify-content:space-between;align-items:center;margin:0 0 1.1rem;padding:0 .25rem;color:#a1a1aa;font-size:.82rem;}.bi-wrap .bi-results strong{color:#fafafa;font-weight:600;}.bi-wrap .bi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem;}.bi-wrap .bi-grid.is-empty{display:none;}.bi-wrap .bi-empty{display:none;text-align:center;padding:4rem 1rem;color:#a1a1aa;}.bi-wrap .bi-grid.is-empty + .bi-empty{display:block;}.bi-wrap .bi-empty h3{color:#fafafa;font-size:1.1rem;font-weight:600;margin:0 0 .5rem;}.bi-wrap .bi-empty p{font-size:.9rem;margin:0;}/* CARDS */
.bi-card{display:block;background:linear-gradient(180deg,rgba(20,20,23,.85) 0%,rgba(7,9,15,.7) 100%);border:1px solid rgba(82,82,91,.35);border-radius:18px;text-decoration:none;transition:border-color .2s,transform .15s,box-shadow .2s;overflow:hidden;}.bi-wrap .bi-card[hidden]{display:none !important;}.bi-wrap .bi-card-thumb{position:relative;width:100%;aspect-ratio:16/9;background:linear-gradient(135deg,rgba(132,204,22,.08),rgba(132,204,22,.06));overflow:hidden;}.bi-wrap .bi-card-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease;}.bi-wrap .bi-card-thumb-fallback{position:absolute;inset:0;background:radial-gradient(circle at 30% 30%,rgba(132,204,22,.2),transparent 60%),radial-gradient(circle at 70% 70%,rgba(132,204,22,.18),transparent 60%);z-index:0;}.bi-wrap .bi-card:hover .bi-card-thumb img{transform:scale(1.04);}.bi-wrap .bi-card-body{padding:1.1rem 1.25rem 1.25rem;}.bi-wrap .bi-card:hover{border-color:rgba(132,204,22,.4);transform:translateY(-3px);box-shadow:0 16px 36px rgba(0,0,0,.5);}.bi-wrap .bi-card-breach{border-left:3px solid rgba(239,68,68,.4);}.bi-wrap .bi-card-breach:hover{border-color:rgba(239,68,68,.45);}.bi-wrap .bi-card-guide{border-left:3px solid rgba(132,204,22,.3);}.bi-wrap .bi-card-guide:hover{border-color:rgba(132,204,22,.45);}.bi-wrap .bi-card-article{border-left:3px solid rgba(132,204,22,.3);}.bi-wrap .bi-card-article:hover{border-color:rgba(132,204,22,.45);}.bi-wrap .bi-badge{display:inline-block;font-size:.6rem;font-weight:700;padding:.2rem .55rem;border-radius:6px;text-transform:uppercase;letter-spacing:.5px;}.bi-wrap .bi-card h3{color:#fafafa;font-size:1rem;font-weight:600;margin:.6rem 0 .4rem;line-height:1.35;word-break:break-word;overflow-wrap:anywhere;}.bi-wrap .bi-card p{color:#a1a1aa;font-size:.82rem;line-height:1.5;margin:0;}.bi-wrap .bi-card .bi-meta{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem;}/* LOAD MORE */
.bi-load-more-row{display:flex;justify-content:center;margin-top:2rem;}.bi-wrap .bi-load-more{display:inline-flex !important;align-items:center !important;gap:.5rem !important;padding:.85rem 1.85rem !important;background:linear-gradient(135deg,rgba(132,204,22,.1),rgba(132,204,22,.1)) !important;color:#84cc16 !important;border:1px solid rgba(132,204,22,.32) !important;border-radius:999px !important;font-size:.88rem !important;font-weight:600 !important;cursor:pointer !important;font-family:inherit !important;transition:all .2s !important;text-transform:none !important;letter-spacing:0 !important;}.bi-wrap .bi-load-more:hover{background:linear-gradient(135deg,rgba(132,204,22,.18),rgba(132,204,22,.18));border-color:#84cc16;}.bi-wrap .bi-load-more[hidden]{display:none;}/* CTA */
.bi-cta-box{text-align:center;padding:2.5rem 2rem;background:linear-gradient(135deg,rgba(132,204,22,.12) 0%,rgba(132,204,22,.08) 50%,rgba(132,204,22,.12) 100%);border:1px solid rgba(82,82,91,.35);border-radius:16px;margin-top:2.5rem;}.bi-wrap .bi-cta-box h2{color:#fafafa;font-size:1.2rem;font-weight:700;margin:0 0 .5rem;}.bi-wrap .bi-cta-box p{color:#a1a1aa;font-size:.88rem;margin:0 0 1.25rem;max-width:480px;margin-left:auto;margin-right:auto;}.bi-wrap .bi-cta-btn{display:inline-flex !important;align-items:center !important;gap:.4rem !important;background:linear-gradient(135deg,#84cc16,#65a30d) !important;color:#0a0a0b !important;padding:.85rem 1.65rem !important;border:none !important;border-radius:999px !important;font-weight:700 !important;font-size:.9rem !important;text-decoration:none !important;transition:all .2s !important;text-transform:none !important;letter-spacing:0 !important;}.bi-wrap .bi-cta-btn:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(132,204,22,.32);}
.bi-newsletter{margin:3rem 0 1.5rem;padding:2.4rem 1.85rem;background:linear-gradient(135deg,rgba(132,204,22,.08),rgba(132,204,22,.06),rgba(132,204,22,.08));border:1px solid rgba(132,204,22,.18);border-radius:22px;position:relative;overflow:hidden;}
.bi-newsletter::before{content:'';position:absolute;inset:-30% -10%;background:radial-gradient(ellipse at center,rgba(132,204,22,.12),transparent 60%);pointer-events:none;}
.bi-newsletter-inner{max-width:640px;margin:0 auto;text-align:center;position:relative;}
.bi-newsletter-copy h2{color:#fafafa;font-size:1.35rem;font-weight:800;margin:0 0 .55rem;letter-spacing:-.005em;}
.bi-newsletter-copy p{color:#a1a1aa;font-size:.93rem;line-height:1.6;margin:0 0 1.35rem;}
.bi-newsletter-form{display:flex;gap:.55rem;max-width:480px;margin:0 auto;flex-wrap:wrap;justify-content:center;}
.bi-newsletter-input{flex:1;min-width:240px;height:42px !important;padding:0 1.1rem !important;background:rgba(7,9,15,.85) !important;color:#fafafa !important;border:1px solid rgba(82,82,91,.35) !important;border-radius:999px !important;font-size:.92rem !important;font-family:inherit !important;outline:none !important;transition:border-color .2s !important;}
.bi-newsletter-input:focus{border-color:#84cc16 !important;}
.bi-newsletter-btn{height:42px !important;padding:0 1.6rem !important;background:linear-gradient(135deg,#84cc16,#65a30d) !important;color:#0a0a0b !important;border:none !important;border-radius:999px !important;font-weight:700 !important;font-size:.92rem !important;cursor:pointer !important;transition:transform .15s,box-shadow .2s !important;font-family:inherit !important;}
.bi-newsletter-btn:hover{transform:translateY(-1px) !important;box-shadow:0 8px 22px rgba(132,204,22,.32) !important;}
.bi-newsletter-btn:disabled{opacity:.6 !important;cursor:wait !important;}
.bi-newsletter-msg{margin-top:.85rem;font-size:.85rem;color:#a1a1aa;min-height:1.2em;}
.bi-newsletter-msg.ok{color:#a3e635;}
.bi-newsletter-msg.err{color:#fca5a5;}
.bi-newsletter-note{margin-top:1rem;font-size:.7rem;color:#6b6b73;}
@media(max-width:600px){.bi-newsletter{padding:1.85rem 1.2rem;}.bi-newsletter-input{min-width:100%;}}
/* WS12.264 — desktop hides the toggle button; mobile uses it. */
.bi-wrap .bi-filters-toggle { display: none; }
.bi-wrap .bi-filters-toggle .bi-filters-chev { transition: transform .2s; margin-left: auto; }
.bi-wrap .bi-filters-toggle[aria-expanded="true"] .bi-filters-chev { transform: rotate(180deg); }
.bi-wrap .bi-filters-active-badge { display:inline-flex; min-width:18px; height:18px; padding:0 5px; align-items:center; justify-content:center; background:#84cc16; color:#0a0a0b; font-size:.62rem; font-weight:800; border-radius:999px; margin-left:.4rem; }
.bi-wrap .bi-filters-active-badge[hidden] { display:none; }
/* WS12.416 — Latest breaches strip (always-rendered, NOT inside a media
query). Previous version was accidentally nested inside the 600px
block, so desktop got no grid/pill/aspect-ratio rules — images went
full-width and the pill was unstyled. */
.bi-wrap .bi-latest { margin: 0 0 2rem; }
.bi-wrap .bi-latest-head {
display: flex; align-items: center; justify-content: space-between;
gap: 0.75rem; flex-wrap: wrap; margin-bottom: 0.85rem;
}
.bi-wrap .bi-latest-pill {
display: inline-flex; align-items: center; gap: 0.45rem;
padding: 0.3rem 0.85rem; border-radius: 999px;
background: rgba(239,68,68,0.10); border: 1px solid rgba(239,68,68,0.32);
color: #fca5a5; font-size: 0.72rem; font-weight: 700;
letter-spacing: 0.04em; text-transform: uppercase;
}
.bi-wrap .bi-latest-dot {
width: 7px; height: 7px; border-radius: 50%;
background: currentColor; box-shadow: 0 0 8px currentColor;
animation: bilLatestPulse 1.6s ease-in-out infinite;
}
@keyframes bilLatestPulse { 0%,100%{opacity:1;} 50%{opacity:0.5;} }
.bi-wrap .bi-latest-more {
color: #bef264; font-size: 0.8rem; font-weight: 600;
text-decoration: none;
}
.bi-wrap .bi-latest-more:hover { color: #bef264; }
.bi-wrap .bi-latest-grid {
display: grid !important;
gap: 0.95rem;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
.bi-wrap .bi-latest-card {
display: block !important; padding: 0; text-decoration: none;
background: rgba(20,20,23,0.6);
border: 1px solid rgba(82,82,91,.35);
border-radius: 12px; overflow: hidden;
transition: transform 0.18s, border-color 0.18s;
width: 100%; max-width: 100%;
}
.bi-wrap .bi-latest-card:hover {
transform: translateY(-2px);
border-color: rgba(239,68,68,0.35);
}
.bi-wrap .bi-latest-card-thumb {
aspect-ratio: 16/9;
width: 100%;
background: linear-gradient(135deg, rgba(239,68,68,0.10), rgba(248,113,113,0.04));
overflow: hidden;
position: relative;
}
.bi-wrap .bi-latest-card-thumb img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
display: block;
}
.bi-wrap .bi-latest-card-body { padding: 0.75rem 0.85rem 0.95rem; }
.bi-wrap .bi-latest-meta {
display: flex; align-items: center; justify-content: space-between;
gap: 0.5rem; margin-bottom: 0.45rem;
font-size: 0.66rem;
}
.bi-wrap .bi-latest-sev {
padding: 0.12rem 0.5rem; border-radius: 999px;
font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase;
font-size: 0.6rem;
}
.bi-wrap .bi-latest-sev-critical { background: rgba(239,68,68,0.18); color: #fca5a5; border: 1px solid rgba(239,68,68,0.40); }
.bi-wrap .bi-latest-sev-high { background: rgba(245,158,11,0.18); color: #fcd34d; border: 1px solid rgba(245,158,11,0.40); }
.bi-wrap .bi-latest-sev-medium, .bi-wrap .bi-latest-sev-breach { background: rgba(132,204,22,0.12); color: #bef264; border: 1px solid rgba(132,204,22,0.32); }
.bi-wrap .bi-latest-date { color: #6b6b73; font-size: 0.66rem; }
.bi-wrap .bi-latest-title {
margin: 0; color: #fafafa; font-size: 0.88rem;
font-weight: 700; line-height: 1.35;
display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
overflow: hidden;
}
@media (max-width: 860px) {
.bi-wrap .bi-latest-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 520px) {
.bi-wrap .bi-latest-grid {
grid-template-columns: none !important;
grid-auto-flow: column;
grid-auto-columns: 78%;
overflow-x: auto;
scroll-snap-type: x mandatory;
padding-bottom: 0.5rem;
}
.bi-wrap .bi-latest-card { scroll-snap-align: start; }
}
@media (max-width:600px) {
.bi-wrap { padding-top: 90px; padding-left: .85rem; padding-right: .85rem; }
.bi-wrap .bi-hero { margin-bottom: 1.5rem; }
.bi-wrap .bi-hero h1 { font-size: 1.6rem; }
.bi-wrap .bi-hero p { font-size: .88rem; }
/* Filter bar tightens up */
.bi-wrap .bi-filter-bar { position: static; padding: .75rem .85rem; gap: .65rem; border-radius: 14px; }
.bi-wrap .bi-search-input { font-size: 16px !important; height: 44px !important; }
/* Type-tab row: shrink to fit 4 tabs on 360px; horizontal scroll as fallback. */
.bi-wrap .bi-filter-row { flex-direction: column; gap: .55rem; align-items: stretch; }
/* Wrap the scrollable tabs in a container with a right-edge fade mask so users see scrollability. */
.bi-wrap .bi-filter-tabs {
flex-wrap: nowrap;
overflow-x: auto;
gap: .3rem;
padding: 0 1rem .15rem 0;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
-webkit-mask-image: linear-gradient(to right, #000 0, #000 calc(100% - 24px), transparent 100%);
mask-image: linear-gradient(to right, #000 0, #000 calc(100% - 24px), transparent 100%);
}
.bi-wrap .bi-filter-tabs::-webkit-scrollbar { display: none; }
/* Tighter tabs so all 4 fit on 360px-wide viewports without scroll. */
.bi-wrap .bi-tab { height: 34px !important; padding: 0 .7rem !important; font-size: .72rem !important; gap: .3rem !important; flex-shrink: 0; letter-spacing: -0.01em !important; }
.bi-wrap .bi-tab-count { font-size: .58rem; padding: .06rem .3rem; }
/* Filters & topics toggle button (mobile only) */
.bi-wrap .bi-filters-toggle {
display: inline-flex !important; align-items: center; gap: .45rem; width: 100%;
height: 40px; padding: 0 .9rem; background: rgba(15,23,41,.55);
color: #a1a1aa; border: 1px solid rgba(82,82,91,.35); border-radius: 12px;
font: inherit; font-size: .82rem; font-weight: 600; cursor: pointer;
}
.bi-wrap .bi-filters-toggle:hover { border-color: rgba(132,204,22,.32); color: #fafafa; }
.bi-wrap .bi-filters-toggle[aria-expanded="true"] { background: rgba(132,204,22,.06); border-color: rgba(132,204,22,.35); color: #84cc16; }
/* Hide secondary panel + topics by default; expand together when toggle is open */
.bi-wrap .bi-secondary { max-height: 0; overflow: hidden; transition: max-height .28s ease, opacity .2s ease, margin .2s ease; opacity: 0; margin: 0; }
.bi-wrap.is-filters-open .bi-secondary { max-height: 500px; opacity: 1; margin-top: .55rem; flex-direction: column; align-items: stretch; }
.bi-wrap.is-filters-open .bi-secondary .bi-select { width: 100%; height: 42px; font-size: 16px; }
.bi-wrap .bi-tagcloud { max-height: 0; overflow: hidden; opacity: 0; padding-top: 0; margin-top: 0; border-top: 0; transition: max-height .28s ease, opacity .2s ease, padding .2s ease, margin .2s ease; }
.bi-wrap.is-filters-open .bi-tagcloud { max-height: 600px; opacity: 1; padding-top: .65rem; margin-top: .55rem; border-top: 1px solid rgba(82,82,91,.35); }
/* Cards full-width single column */
.bi-wrap .bi-grid { grid-template-columns: 1fr; gap: .85rem; }
/* Result meta tightens up */
.bi-wrap .bi-results { font-size: .76rem; padding: 0 .15rem; }
}
}
.bi-hero-tight{position:relative;text-align:center;margin:0 0 1.5rem;padding:1.4rem 1.2rem 1.6rem;background:radial-gradient(ellipse at 50% 0%, rgba(132,204,22,0.14) 0%, transparent 65%), linear-gradient(180deg, rgba(20,20,23,0.6), rgba(8,12,24,0.35));border:1px solid rgba(132,204,22,0.18);border-radius:18px;overflow:hidden;}
.bi-hero-tight::before{content:"";position:absolute;top:-40%;right:-15%;width:340px;height:340px;background:radial-gradient(circle, rgba(132,204,22,0.16) 0%, transparent 60%);pointer-events:none;}
.bi-hero-eyebrow{display:inline-flex;align-items:center;gap:.45rem;padding:.28rem .75rem;border-radius:999px;background:rgba(132,204,22,0.12);border:1px solid rgba(132,204,22,0.32);font-size:.62rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#bef264;margin-bottom:.85rem;}
.bi-hero-eyebrow-dot{width:6px;height:6px;border-radius:50%;background:#84cc16;box-shadow:0 0 8px rgba(132,204,22,.85);animation:gwPulse 1.6s ease-in-out infinite;}
.bi-hero-tight h1{margin:0 0 .45rem;font-family:'Inter',-apple-system,sans-serif;font-weight:900;font-size:clamp(1.5rem,3.6vw,2.1rem);line-height:1.15;letter-spacing:-.02em;color:#fafafa;}
.bi-hero-pink{background:linear-gradient(135deg,#bef264,#a3e635,#bef264);-webkit-background-clip:text;background-clip:text;color:transparent;}
.bi-hero-tight p{margin:0 auto;max-width:640px;font-size:.86rem;line-height:1.55;color:#a1a1aa;}
@media (max-width:600px){.bi-hero-tight{padding:1.1rem .95rem 1.25rem;margin-bottom:1.1rem;border-radius:14px;}.bi-hero-tight h1{font-size:1.35rem;}.bi-hero-tight p{font-size:.78rem;}}
.bi-chain-featured{position:relative;margin:0 0 2rem;padding:2rem 1.8rem;background:linear-gradient(135deg,rgba(132,204,22,.12),rgba(132,204,22,.10),rgba(163,230,53,.07));border:1px solid rgba(132,204,22,.34);border-radius:20px;display:grid;grid-template-columns:auto 1fr;gap:1.5rem;align-items:flex-start;overflow:hidden;box-shadow:0 12px 36px rgba(0,0,0,.45),0 0 0 1px rgba(132,204,22,.06) inset;}
.bi-chain-featured::before{content:"";position:absolute;top:-30%;right:-10%;width:340px;height:340px;background:radial-gradient(circle,rgba(132,204,22,.18) 0%,transparent 60%);pointer-events:none;}
.bi-chain-featured-icon{flex-shrink:0;width:72px;height:72px;border-radius:16px;background:linear-gradient(135deg,rgba(132,204,22,.28),rgba(132,204,22,.22));display:flex;align-items:center;justify-content:center;border:1px solid rgba(132,204,22,.42);position:relative;z-index:1;box-shadow:0 6px 18px rgba(132,204,22,.18);}
.bi-chain-featured-body{min-width:0;position:relative;z-index:1;}
.bi-chain-featured-eyebrow{display:inline-flex;align-items:center;gap:.45rem;font-size:.64rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:#bef264;margin-bottom:.5rem;padding:.22rem .55rem;border-radius:999px;background:rgba(132,204,22,.12);border:1px solid rgba(132,204,22,.28);}
.bi-chain-featured-dot{width:6px;height:6px;border-radius:50%;background:#84cc16;box-shadow:0 0 8px rgba(132,204,22,.85);animation:gwPulse 1.8s ease-in-out infinite;}
@keyframes gwPulse{0%,100%{opacity:1;}50%{opacity:.4;}}
.bi-chain-featured-title{margin:0 0 .6rem;font-family:'Inter',-apple-system,sans-serif;font-weight:900;font-size:1.45rem;color:#fafafa;line-height:1.2;letter-spacing:-.015em;}
.bi-chain-featured-sub{margin:0 0 1.1rem;color:#a1a1aa;font-size:.92rem;line-height:1.55;}
.bi-chain-featured-flow{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin:0 0 1.1rem;padding:.65rem .85rem;background:rgba(8,14,28,.5);border:1px solid rgba(82,82,91,.35);border-radius:10px;}
.bi-chain-stage{display:inline-flex;align-items:center;font-size:.7rem;font-weight:800;letter-spacing:.04em;color:var(--c,#a1a1aa);text-shadow:0 0 8px rgba(0,0,0,.6);padding:.18rem .45rem;border-radius:6px;background:rgba(0,0,0,.18);border:1px solid color-mix(in srgb, var(--c, #a1a1aa) 32%, transparent);}
.bi-chain-link{flex:0 0 18px;height:2px;background:linear-gradient(90deg,rgba(82,82,91,.35),rgba(82,82,91,.35),rgba(82,82,91,.35));border-radius:2px;position:relative;overflow:hidden;}
.bi-chain-link::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,#84cc16,transparent);animation:bi-chain-pulse 2.4s ease-in-out infinite;}
.bi-chain-link:nth-of-type(2)::after{animation-delay:.6s;}
.bi-chain-link:nth-of-type(3)::after{animation-delay:1.2s;}
@keyframes bi-chain-pulse{0%{transform:translateX(-100%);}100%{transform:translateX(100%);}}
.bi-chain-featured-ctas{display:flex;gap:.55rem;flex-wrap:wrap;}
.bi-chain-cta{display:inline-flex;align-items:center;gap:.3rem;padding:.55rem 1rem;font-weight:800;font-size:.82rem;text-decoration:none;border-radius:999px;transition:transform .15s ease;}
.bi-chain-cta:hover{transform:translateY(-1px);}
.bi-chain-cta-primary{background:linear-gradient(135deg,#84cc16,#65a30d);color:#0a0a0b;box-shadow:0 4px 14px rgba(132,204,22,.32);}
.bi-chain-cta-outline{background:transparent;color:#a1a1aa;border:1px solid rgba(82,82,91,.35);}
.bi-chain-cta-promo{background:transparent;color:#fbbf24;border:1px solid rgba(251,191,36,.42);}
@media (max-width: 640px) {
.bi-chain-featured{padding:1.6rem 1.2rem;grid-template-columns:1fr;text-align:center;gap:1rem;}
.bi-chain-featured-icon{margin:0 auto;}
.bi-chain-featured-eyebrow{margin:0 auto .5rem;}
.bi-chain-featured-flow{justify-content:center;font-size:.65rem;padding:.55rem .65rem;}
.bi-chain-stage{font-size:.62rem;padding:.16rem .38rem;}
.bi-chain-link{flex:0 0 12px;}
.bi-chain-featured-ctas{justify-content:center;}
}
.bi-empty-search{padding:2.5rem 1.5rem 2rem;text-align:center;max-width:620px;margin:0 auto;}
.bi-empty-search-eyebrow{display:inline-flex;align-items:center;gap:.45rem;padding:.32rem .85rem;border-radius:999px;background:rgba(132,204,22,.12);border:1px solid rgba(132,204,22,.38);color:#bef264;font-size:.65rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;margin-bottom:1rem;}
.bi-empty-search-dot{width:6px;height:6px;border-radius:50%;background:#84cc16;box-shadow:0 0 8px rgba(132,204,22,.85);animation:gwPulse 1.6s ease-in-out infinite;}
.bi-empty-search h3{font-size:1.4rem;color:#fafafa;line-height:1.25;margin:0 0 .85rem;font-weight:800;letter-spacing:-.01em;}
.bi-empty-search p{color:#a1a1aa;font-size:.92rem;line-height:1.6;margin:0 auto 1.4rem;max-width:520px;}
.bi-empty-search-cta{display:inline-flex;align-items:center;justify-content:center;padding:.9rem 1.6rem;background:linear-gradient(135deg,#84cc16,#65a30d 55%,#65a30d);color:#0a0a0b;font-weight:800;font-size:.95rem;border-radius:14px;text-decoration:none;box-shadow:0 6px 22px rgba(249,115,22,.4);transition:transform .15s ease,box-shadow .15s ease;}
.bi-empty-search-cta:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(249,115,22,.5);}
.bi-empty-search-sub{font-size:.7rem;color:#6b6b73;margin-top:.85rem;letter-spacing:.04em;}
#biEmpty[data-mode="search"] .bi-empty-filter{display:none;}
#biEmpty[data-mode="search"] .bi-empty-search{display:block;}
#biEmpty[data-mode="filter"] .bi-empty-search{display:none;}
.wb-wrap{max-width:800px;margin:0 auto;padding:2rem 1rem;padding-top:120px;}.wb-header{text-align:center;margin-bottom:2.5rem;}.wb-icon{font-size:3rem;display:block;margin-bottom:0.75rem;}.wb-h1{font-size:2rem;font-weight:800;color:#fafafa;margin:0.75rem 0 0.5rem;}.wb-sub{color:#a1a1aa;font-size:1.05rem;line-height:1.6;}.wb-verdict{display:inline-flex;align-items:center;gap:0.4rem;background:rgba(239,68,68,0.12);border:1px solid rgba(132,204,22,0.32);border-radius:20px;padding:0.3rem 0.9rem;font-size:0.75rem;color:#fca5a5;font-weight:600;margin-bottom:1rem;}.wb-verdict-dot{width:6px;height:6px;background:#ef4444;border-radius:50%;box-shadow:0 0 6px #ef4444;}.wb-timeline{margin-bottom:2rem;}.wb-timeline h2{color:#ef4444;font-size:1.2rem;font-weight:700;margin-bottom:1rem;}.wb-tl-list{background:rgba(10,14,22,0.7);border:1px solid rgba(255,255,255,0.06);border-radius:12px;overflow:hidden;}.wb-tl-row{display:flex;justify-content:space-between;align-items:center;padding:0.9rem 1.25rem;border-bottom:1px solid rgba(255,255,255,0.04);}.wb-tl-row:last-child{border-bottom:none;}.wb-tl-year{color:#fafafa;font-weight:700;font-size:0.95rem;}.wb-tl-desc{color:#a1a1aa;margin:0.2rem 0 0;font-size:0.85rem;line-height:1.4;}.wb-tl-badge{color:#ef4444;font-size:0.8rem;white-space:nowrap;font-weight:600;}.wb-protect{background:rgba(132,204,22,0.08);border:1px solid rgba(132,204,22,0.2);border-radius:12px;padding:1.5rem;margin-bottom:2rem;}.wb-protect h2{color:#84cc16;font-size:1.2rem;font-weight:700;margin-bottom:1rem;}.wb-protect ol{color:#a1a1aa;line-height:2;margin-left:1.25rem;font-size:0.95rem;}.wb-protect li::marker{color:#84cc16;}.wb-links{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:2rem;}.wb-link{flex:1;min-width:200px;background:linear-gradient(145deg, rgba(30,27,56,0.7) 0%, rgba(10,14,22,0.85) 60%, rgba(20,20,23,0.7) 100%);border:1px solid rgba(82,82,91,.35);border-radius:12px;padding:1rem 1.25rem;text-decoration:none;text-align:center;transition:all 0.2s;}.wb-link:hover{border-color:rgba(255,255,255,0.15);transform:translateY(-1px);}.wb-link-title{font-weight:600;font-size:0.95rem;}.wb-link-sub{color:#a1a1aa;font-size:0.8rem;margin-top:0.25rem;}.wb-cta{text-align:center;padding:2.5rem 2rem;background:linear-gradient(135deg, rgba(132,204,22,0.12) 0%, rgba(132,204,22,0.08) 50%, rgba(132,204,22,0.12) 100%);border:1px solid rgba(82,82,91,.35);border-radius:16px;}.wb-cta h3{color:#fafafa;font-size:1.15rem;font-weight:700;margin-bottom:0.5rem;}.wb-cta p{color:#a1a1aa;font-size:0.9rem;margin-bottom:1rem;}.wb-cta-btn{display:inline-flex;align-items:center;gap:0.5rem;background:linear-gradient(135deg, #ef4444, #dc2626, #b91c1c);color:#0a0a0b;padding:0.85rem 1.75rem;text-decoration:none;font-weight:700;border:none;border-radius:10px;font-size:0.95rem;transition:all 0.2s;}.wb-cta-btn:hover{background:linear-gradient(135deg, #b91c1c, #ef4444, #dc2626);box-shadow:0 0 24px rgba(132,204,22,0.3);}.wb-cta-note{margin-top:0.75rem;font-size:0.7rem;color:#84cc16;}
@media(max-width:600px){.wb-links{flex-direction:column;}}
.gw-reveal,.gw-reveal-left,.gw-reveal-right,.gw-reveal-scale{opacity:1!important;transform:none!important;}
.ed-wrap{max-width:780px;margin:0 auto;padding:2rem 1.25rem 4rem;padding-top:100px;}
.ed-back{color:#a1a1aa;text-decoration:none;display:inline-flex;align-items:center;gap:.4rem;font-size:.82rem;font-weight:500;margin-bottom:1.25rem;transition:color .2s;}
.ed-back:hover{color:#84cc16;}
.ed-badge{display:inline-block;font-size:.7rem;font-weight:700;padding:.3rem .7rem;border-radius:999px;background:rgba(132,204,22,.12);color:#84cc16;letter-spacing:.4px;text-transform:uppercase;border:1px solid rgba(132,204,22,.25);}
.ed-badge-platform{background:rgba(132,204,22,.12);color:#bef264;border-color:rgba(132,204,22,.25);}
.ed-meta-row{display:flex;align-items:center;gap:.6rem;margin-bottom:.85rem;flex-wrap:wrap;}
.ed-meta-time{color:#6b6b73;font-size:.78rem;font-weight:500;}
.ed-h1{font-size:2.05rem;color:#fafafa;font-weight:800;margin:0 0 .7rem;line-height:1.2;letter-spacing:-.01em;}
.ed-deck{color:#a1a1aa;font-size:1.02rem;line-height:1.55;margin:0 0 1.75rem;font-weight:400;}
.ed-hero{position:relative;width:100%;aspect-ratio:16/9;border-radius:16px;overflow:hidden;margin:0 0 2rem;background:linear-gradient(135deg,rgba(20,20,23,.85),rgba(10,10,11,.95));border:1px solid rgba(82,82,91,.35);box-shadow:0 12px 36px rgba(0,0,0,.45),0 0 0 1px rgba(132,204,22,.06);}
.ed-hero img{width:100%;height:100%;object-fit:cover;display:block;}
.ed-hero-placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 30% 30%,rgba(132,204,22,.18),transparent 60%),radial-gradient(ellipse at 80% 70%,rgba(132,204,22,.18),transparent 60%),linear-gradient(135deg,#141417,#0a0a0b);}
.ed-hero-placeholder svg{width:96px;height:96px;opacity:.55;}
.ed-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,10,11,.6) 0%,transparent 35%);pointer-events:none;}
.ed-body{color:#a1a1aa;line-height:1.75;font-size:.96rem;}
.ed-body h2{color:#fafafa;font-size:1.35rem;font-weight:700;margin:2rem 0 .75rem;letter-spacing:-.005em;}
.ed-body h3{color:#fafafa;font-size:1.08rem;font-weight:600;margin:1.5rem 0 .55rem;}
.ed-body ul,.ed-body ol{margin:.5rem 0 1rem 1.25rem;}
.ed-body li{margin-bottom:.4rem;}
.ed-body p{margin:0 0 1rem;}
.ed-body strong{color:#fafafa;font-weight:600;}
.ed-body a{color:#84cc16;text-decoration:none;border-bottom:1px solid rgba(132,204,22,.3);}
.ed-body a:hover{border-bottom-color:#84cc16;}
.ed-section{background:linear-gradient(135deg,rgba(20,20,23,.55),rgba(10,10,11,.55));border:1px solid rgba(82,82,91,.35);border-radius:14px;padding:1.4rem 1.5rem;margin:1.25rem 0;}
.ed-section h2{margin-top:.25rem;}
.ed-steps{counter-reset:edstep;list-style:none;margin:.85rem 0 0;padding:0;}
.ed-steps li{counter-increment:edstep;position:relative;padding:.55rem 0 .55rem 2.4rem;border-bottom:1px solid rgba(82,82,91,.35);color:#a1a1aa;font-size:.92rem;}
.ed-steps li:last-child{border-bottom:none;}
.ed-steps li::before{content:counter(edstep);position:absolute;left:0;top:.55rem;width:1.7rem;height:1.7rem;background:linear-gradient(135deg,#84cc16,#65a30d);color:#0a0a0b;border-radius:999px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.78rem;}
.ed-warn{display:flex;gap:.7rem;align-items:flex-start;background:linear-gradient(135deg,rgba(239,68,68,.08),rgba(239,68,68,.02));border:1px solid rgba(239,68,68,.25);border-radius:12px;padding:1rem 1.15rem;margin:1rem 0;color:#fca5a5;font-size:.9rem;}
.ed-warn-icon{flex:0 0 22px;color:#ef4444;}
.ed-scams{display:grid;grid-template-columns:1fr;gap:.6rem;margin:.85rem 0 0;}
.ed-scam{display:flex;gap:.7rem;align-items:flex-start;padding:.7rem .9rem;background:rgba(239,68,68,.06);border:1px solid rgba(239,68,68,.18);border-radius:10px;color:#fca5a5;font-size:.88rem;line-height:1.5;}
.ed-scam svg{flex:0 0 18px;color:#ef4444;margin-top:.15rem;}
.ed-cta{position:relative;text-align:center;padding:2.4rem 1.75rem;background:linear-gradient(135deg,rgba(132,204,22,.1) 0%,rgba(132,204,22,.08) 50%,rgba(132,204,22,.1) 100%);border:1px solid rgba(132,204,22,.22);border-radius:16px;margin:2.25rem 0 2rem;overflow:hidden;}
.ed-cta::before{content:'';position:absolute;top:-30%;left:-10%;width:60%;height:160%;background:radial-gradient(ellipse at center,rgba(132,204,22,.18),transparent 60%);pointer-events:none;}
.ed-cta h3{color:#fafafa;font-size:1.25rem;font-weight:800;margin:0 0 .55rem;letter-spacing:-.005em;position:relative;}
.ed-cta p{color:#a1a1aa;font-size:.93rem;margin:0 0 1.15rem;position:relative;}
.ed-cta a{position:relative;display:inline-flex;align-items:center;gap:.45rem;background:linear-gradient(135deg,#84cc16,#65a30d);color:#0a0a0b;padding:.85rem 1.6rem;border:none;border-radius:999px;font-weight:700;font-size:.92rem;text-decoration:none;transition:all .2s;box-shadow:0 8px 24px rgba(132,204,22,.25);}
.ed-cta a:hover{transform:translateY(-1px);box-shadow:0 12px 32px rgba(132,204,22,.4);}
.ed-related{margin:3rem 0 0;padding-top:2rem;border-top:1px solid rgba(82,82,91,.35);}
.ed-related h2{color:#fafafa;font-size:1.1rem;font-weight:700;margin:0 0 1rem;letter-spacing:.01em;}
.ed-related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.85rem;}
.ed-related-card{display:block;padding:1rem 1.1rem;background:rgba(20,20,23,.55);border:1px solid rgba(82,82,91,.35);border-radius:12px;text-decoration:none;transition:all .2s;}
.ed-related-card:hover{border-color:rgba(132,204,22,.4);background:rgba(20,20,23,.8);transform:translateY(-1px);}
.ed-related-card h3{color:#fafafa;font-size:.92rem;font-weight:600;margin:0 0 .35rem;line-height:1.35;}
.ed-related-card p{color:#a1a1aa;font-size:.78rem;margin:0;line-height:1.45;}
@media (max-width:640px){
.ed-wrap{padding-top:80px;}
.ed-h1{font-size:1.6rem;}
.ed-deck{font-size:.95rem;}
.ed-body{font-size:.92rem;}
.ed-section{padding:1.15rem 1.15rem;}
}
.bi-paywall-fade{position:relative;height:140px;margin-top:-140px;background:linear-gradient(180deg,rgba(10,14,22,0) 0%,rgba(10,14,22,.85) 60%,rgba(10,14,22,1) 100%);pointer-events:none;z-index:2;}
.bi-paywall{position:relative;text-align:center;padding:2.4rem 1.6rem 2.6rem;background:linear-gradient(135deg,rgba(132,204,22,.08) 0%,rgba(132,204,22,.10) 50%,rgba(132,204,22,.08) 100%);border:1px solid rgba(132,204,22,.32);border-radius:18px;margin:0 0 2rem;overflow:hidden;box-shadow:0 12px 36px rgba(0,0,0,.45),0 0 0 1px rgba(132,204,22,.06);}
.bi-paywall::before{content:'';position:absolute;top:-30%;left:-10%;width:120%;height:160%;background:radial-gradient(ellipse at center,rgba(132,204,22,.18),transparent 60%);pointer-events:none;}
.bi-paywall-icon{position:relative;width:44px;height:44px;margin:0 auto .9rem;border-radius:14px;background:linear-gradient(135deg,#84cc16,#65a30d);display:flex;align-items:center;justify-content:center;color:#0a0a0b;box-shadow:0 8px 20px rgba(132,204,22,.35);}
.bi-paywall-icon svg{width:22px;height:22px;}
.bi-paywall-meta{position:relative;font-size:.74rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#a1a1aa;margin-bottom:.55rem;}
.bi-paywall-h{position:relative;color:#fafafa;font-size:1.45rem;font-weight:800;margin:0 0 .65rem;letter-spacing:-.005em;line-height:1.25;}
.bi-paywall-p{position:relative;color:#a1a1aa;font-size:.96rem;line-height:1.55;margin:0 auto 1.4rem;max-width:480px;text-align:center !important;text-wrap:balance;-webkit-text-wrap:balance;}
.bi-paywall-cta-row{position:relative;margin-bottom:.85rem;}
.bi-paywall-cta{display:inline-flex;align-items:center;gap:.45rem;background:linear-gradient(135deg,#84cc16,#65a30d);color:#0a0a0b!important;padding:.95rem 1.85rem;border:none;border-radius:999px;font-weight:700;font-size:.96rem;text-decoration:none;transition:all .2s;box-shadow:0 8px 24px rgba(132,204,22,.35);}
.bi-paywall-cta:hover{transform:translateY(-1px);box-shadow:0 14px 36px rgba(132,204,22,.5);}
.bi-paywall-sec{position:relative;margin-bottom:1.4rem;}
.bi-paywall-link{color:#a1a1aa;font-size:.86rem;text-decoration:none;border-bottom:1px solid rgba(82,82,91,.35);padding-bottom:1px;transition:color .2s,border-color .2s;}
.bi-paywall-link:hover{color:#84cc16;border-bottom-color:#84cc16;}
.bi-paywall-ben{position:relative;display:flex;justify-content:center;flex-wrap:wrap;gap:.95rem 1.6rem;padding-top:1.1rem;border-top:1px solid rgba(82,82,91,.35);}
.bi-paywall-ben-item{display:inline-flex;align-items:center;gap:.4rem;color:#a1a1aa;font-size:.82rem;font-weight:500;}
.bi-paywall-ben-dot{width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,#84cc16,#65a30d);box-shadow:0 0 8px rgba(132,204,22,.6);}
@media (max-width:640px){
.bi-paywall{padding:1.85rem 1.1rem 2rem;border-radius:14px;}
.bi-paywall-h{font-size:1.18rem;}
.bi-paywall-p{font-size:.9rem;}
.bi-paywall-cta{padding:.85rem 1.4rem;font-size:.9rem;width:100%;justify-content:center;}
.bi-paywall-ben{gap:.55rem .95rem;}
.bi-paywall-ben-item{font-size:.76rem;}
}
.gw-reveal,.gw-reveal-left,.gw-reveal-right,.gw-reveal-scale{opacity:1!important;transform:none!important;}
.ed-wrap{max-width:780px;margin:0 auto;padding:2rem 1.25rem 4rem;padding-top:100px;}
.ed-back{color:#a1a1aa;text-decoration:none;display:inline-flex;align-items:center;gap:.4rem;font-size:.82rem;font-weight:500;margin-bottom:1.25rem;transition:color .2s;}
.ed-back:hover{color:#84cc16;}
.ed-badge{display:inline-block;font-size:.7rem;font-weight:700;padding:.3rem .7rem;border-radius:999px;background:rgba(132,204,22,.12);color:#84cc16;letter-spacing:.4px;text-transform:uppercase;border:1px solid rgba(132,204,22,.25);}
.ed-badge-platform{background:rgba(132,204,22,.12);color:#bef264;border-color:rgba(132,204,22,.25);}
.ed-meta-row{display:flex;align-items:center;gap:.6rem;margin-bottom:.85rem;flex-wrap:wrap;}
.ed-meta-time{color:#6b6b73;font-size:.78rem;font-weight:500;}
.ed-h1{font-size:2.05rem;color:#fafafa;font-weight:800;margin:0 0 .7rem;line-height:1.2;letter-spacing:-.01em;}
.ed-deck{color:#a1a1aa;font-size:1.02rem;line-height:1.55;margin:0 0 1.75rem;font-weight:400;}
.ed-hero{position:relative;width:100%;aspect-ratio:16/9;border-radius:16px;overflow:hidden;margin:0 0 2rem;background:linear-gradient(135deg,rgba(20,20,23,.85),rgba(10,10,11,.95));border:1px solid rgba(82,82,91,.35);box-shadow:0 12px 36px rgba(0,0,0,.45),0 0 0 1px rgba(132,204,22,.06);}
.ed-hero img{width:100%;height:100%;object-fit:cover;display:block;}
.ed-hero-placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 30% 30%,rgba(132,204,22,.18),transparent 60%),radial-gradient(ellipse at 80% 70%,rgba(132,204,22,.18),transparent 60%),linear-gradient(135deg,#141417,#0a0a0b);}
.ed-hero-placeholder svg{width:96px;height:96px;opacity:.55;}
.ed-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,10,11,.6) 0%,transparent 35%);pointer-events:none;}
.ed-body{color:#a1a1aa;line-height:1.75;font-size:.96rem;}
.ed-body h2{color:#fafafa;font-size:1.35rem;font-weight:700;margin:2rem 0 .75rem;letter-spacing:-.005em;}
.ed-body h3{color:#fafafa;font-size:1.08rem;font-weight:600;margin:1.5rem 0 .55rem;}
.ed-body ul,.ed-body ol{margin:.5rem 0 1rem 1.25rem;}
.ed-body li{margin-bottom:.4rem;}
.ed-body p{margin:0 0 1rem;}
.ed-body strong{color:#fafafa;font-weight:600;}
.ed-body a{color:#84cc16;text-decoration:none;border-bottom:1px solid rgba(132,204,22,.3);}
.ed-body a:hover{border-bottom-color:#84cc16;}
.ed-section{background:linear-gradient(135deg,rgba(20,20,23,.55),rgba(10,10,11,.55));border:1px solid rgba(82,82,91,.35);border-radius:14px;padding:1.4rem 1.5rem;margin:1.25rem 0;}
.ed-section h2{margin-top:.25rem;}
.ed-steps{counter-reset:edstep;list-style:none;margin:.85rem 0 0;padding:0;}
.ed-steps li{counter-increment:edstep;position:relative;padding:.55rem 0 .55rem 2.4rem;border-bottom:1px solid rgba(82,82,91,.35);color:#a1a1aa;font-size:.92rem;}
.ed-steps li:last-child{border-bottom:none;}
.ed-steps li::before{content:counter(edstep);position:absolute;left:0;top:.55rem;width:1.7rem;height:1.7rem;background:linear-gradient(135deg,#84cc16,#65a30d);color:#0a0a0b;border-radius:999px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.78rem;}
.ed-warn{display:flex;gap:.7rem;align-items:flex-start;background:linear-gradient(135deg,rgba(239,68,68,.08),rgba(239,68,68,.02));border:1px solid rgba(239,68,68,.25);border-radius:12px;padding:1rem 1.15rem;margin:1rem 0;color:#fca5a5;font-size:.9rem;}
.ed-warn-icon{flex:0 0 22px;color:#ef4444;}
.ed-scams{display:grid;grid-template-columns:1fr;gap:.6rem;margin:.85rem 0 0;}
.ed-scam{display:flex;gap:.7rem;align-items:flex-start;padding:.7rem .9rem;background:rgba(239,68,68,.06);border:1px solid rgba(239,68,68,.18);border-radius:10px;color:#fca5a5;font-size:.88rem;line-height:1.5;}
.ed-scam svg{flex:0 0 18px;color:#ef4444;margin-top:.15rem;}
.ed-cta{position:relative;text-align:center;padding:2.4rem 1.75rem;background:linear-gradient(135deg,rgba(132,204,22,.1) 0%,rgba(132,204,22,.08) 50%,rgba(132,204,22,.1) 100%);border:1px solid rgba(132,204,22,.22);border-radius:16px;margin:2.25rem 0 2rem;overflow:hidden;}
.ed-cta::before{content:'';position:absolute;top:-30%;left:-10%;width:60%;height:160%;background:radial-gradient(ellipse at center,rgba(132,204,22,.18),transparent 60%);pointer-events:none;}
.ed-cta h3{color:#fafafa;font-size:1.25rem;font-weight:800;margin:0 0 .55rem;letter-spacing:-.005em;position:relative;}
.ed-cta p{color:#a1a1aa;font-size:.93rem;margin:0 0 1.15rem;position:relative;}
.ed-cta a{position:relative;display:inline-flex;align-items:center;gap:.45rem;background:linear-gradient(135deg,#84cc16,#65a30d);color:#0a0a0b;padding:.85rem 1.6rem;border:none;border-radius:999px;font-weight:700;font-size:.92rem;text-decoration:none;transition:all .2s;box-shadow:0 8px 24px rgba(132,204,22,.25);}
.ed-cta a:hover{transform:translateY(-1px);box-shadow:0 12px 32px rgba(132,204,22,.4);}
.ed-related{margin:3rem 0 0;padding-top:2rem;border-top:1px solid rgba(82,82,91,.35);}
.ed-related h2{color:#fafafa;font-size:1.1rem;font-weight:700;margin:0 0 1rem;letter-spacing:.01em;}
.ed-related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.85rem;}
.ed-related-card{display:block;padding:1rem 1.1rem;background:rgba(20,20,23,.55);border:1px solid rgba(82,82,91,.35);border-radius:12px;text-decoration:none;transition:all .2s;}
.ed-related-card:hover{border-color:rgba(132,204,22,.4);background:rgba(20,20,23,.8);transform:translateY(-1px);}
.ed-related-card h3{color:#fafafa;font-size:.92rem;font-weight:600;margin:0 0 .35rem;line-height:1.35;}
.ed-related-card p{color:#a1a1aa;font-size:.78rem;margin:0;line-height:1.45;}
@media (max-width:640px){
.ed-wrap{padding-top:80px;}
.ed-h1{font-size:1.6rem;}
.ed-deck{font-size:.95rem;}
.ed-body{font-size:.92rem;}
.ed-section{padding:1.15rem 1.15rem;}
}
.bi-paywall-fade{position:relative;height:140px;margin-top:-140px;background:linear-gradient(180deg,rgba(10,14,22,0) 0%,rgba(10,14,22,.85) 60%,rgba(10,14,22,1) 100%);pointer-events:none;z-index:2;}
.bi-paywall{position:relative;text-align:center;padding:2.4rem 1.6rem 2.6rem;background:linear-gradient(135deg,rgba(132,204,22,.08) 0%,rgba(132,204,22,.10) 50%,rgba(132,204,22,.08) 100%);border:1px solid rgba(132,204,22,.32);border-radius:18px;margin:0 0 2rem;overflow:hidden;box-shadow:0 12px 36px rgba(0,0,0,.45),0 0 0 1px rgba(132,204,22,.06);}
.bi-paywall::before{content:'';position:absolute;top:-30%;left:-10%;width:120%;height:160%;background:radial-gradient(ellipse at center,rgba(132,204,22,.18),transparent 60%);pointer-events:none;}
.bi-paywall-icon{position:relative;width:44px;height:44px;margin:0 auto .9rem;border-radius:14px;background:linear-gradient(135deg,#84cc16,#65a30d);display:flex;align-items:center;justify-content:center;color:#0a0a0b;box-shadow:0 8px 20px rgba(132,204,22,.35);}
.bi-paywall-icon svg{width:22px;height:22px;}
.bi-paywall-meta{position:relative;font-size:.74rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#a1a1aa;margin-bottom:.55rem;}
.bi-paywall-h{position:relative;color:#fafafa;font-size:1.45rem;font-weight:800;margin:0 0 .65rem;letter-spacing:-.005em;line-height:1.25;}
.bi-paywall-p{position:relative;color:#a1a1aa;font-size:.96rem;line-height:1.55;margin:0 auto 1.4rem;max-width:480px;text-align:center !important;text-wrap:balance;-webkit-text-wrap:balance;}
.bi-paywall-cta-row{position:relative;margin-bottom:.85rem;}
.bi-paywall-cta{display:inline-flex;align-items:center;gap:.45rem;background:linear-gradient(135deg,#84cc16,#65a30d);color:#0a0a0b!important;padding:.95rem 1.85rem;border:none;border-radius:999px;font-weight:700;font-size:.96rem;text-decoration:none;transition:all .2s;box-shadow:0 8px 24px rgba(132,204,22,.35);}
.bi-paywall-cta:hover{transform:translateY(-1px);box-shadow:0 14px 36px rgba(132,204,22,.5);}
.bi-paywall-sec{position:relative;margin-bottom:1.4rem;}
.bi-paywall-link{color:#a1a1aa;font-size:.86rem;text-decoration:none;border-bottom:1px solid rgba(82,82,91,.35);padding-bottom:1px;transition:color .2s,border-color .2s;}
.bi-paywall-link:hover{color:#84cc16;border-bottom-color:#84cc16;}
.bi-paywall-ben{position:relative;display:flex;justify-content:center;flex-wrap:wrap;gap:.95rem 1.6rem;padding-top:1.1rem;border-top:1px solid rgba(82,82,91,.35);}
.bi-paywall-ben-item{display:inline-flex;align-items:center;gap:.4rem;color:#a1a1aa;font-size:.82rem;font-weight:500;}
.bi-paywall-ben-dot{width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,#84cc16,#65a30d);box-shadow:0 0 8px rgba(132,204,22,.6);}
@media (max-width:640px){
.bi-paywall{padding:1.85rem 1.1rem 2rem;border-radius:14px;}
.bi-paywall-h{font-size:1.18rem;}
.bi-paywall-p{font-size:.9rem;}
.bi-paywall-cta{padding:.85rem 1.4rem;font-size:.9rem;width:100%;justify-content:center;}
.bi-paywall-ben{gap:.55rem .95rem;}
.bi-paywall-ben-item{font-size:.76rem;}
}
.wb-wrap{max-width:800px;margin:0 auto;padding:2rem 1rem;padding-top:120px;}.wb-header{text-align:center;margin-bottom:2.5rem;}.wb-icon{font-size:3rem;display:block;margin-bottom:0.75rem;}.wb-h1{font-size:2rem;font-weight:800;color:#fafafa;margin:0.75rem 0 0.5rem;}.wb-sub{color:#a1a1aa;font-size:1.05rem;line-height:1.6;}.wb-verdict{display:inline-flex;align-items:center;gap:0.4rem;background:rgba(239,68,68,0.12);border:1px solid rgba(132,204,22,0.32);border-radius:20px;padding:0.3rem 0.9rem;font-size:0.75rem;color:#fca5a5;font-weight:600;margin-bottom:1rem;}.wb-verdict-dot{width:6px;height:6px;background:#ef4444;border-radius:50%;box-shadow:0 0 6px #ef4444;}.wb-timeline{margin-bottom:2rem;}.wb-timeline h2{color:#ef4444;font-size:1.2rem;font-weight:700;margin-bottom:1rem;}.wb-tl-list{background:rgba(10,14,22,0.7);border:1px solid rgba(255,255,255,0.06);border-radius:12px;overflow:hidden;}.wb-tl-row{display:flex;justify-content:space-between;align-items:center;padding:0.9rem 1.25rem;border-bottom:1px solid rgba(255,255,255,0.04);}.wb-tl-row:last-child{border-bottom:none;}.wb-tl-year{color:#fafafa;font-weight:700;font-size:0.95rem;}.wb-tl-desc{color:#a1a1aa;margin:0.2rem 0 0;font-size:0.85rem;line-height:1.4;}.wb-tl-badge{color:#ef4444;font-size:0.8rem;white-space:nowrap;font-weight:600;}.wb-protect{background:rgba(132,204,22,0.08);border:1px solid rgba(132,204,22,0.2);border-radius:12px;padding:1.5rem;margin-bottom:2rem;}.wb-protect h2{color:#84cc16;font-size:1.2rem;font-weight:700;margin-bottom:1rem;}.wb-protect ol{color:#a1a1aa;line-height:2;margin-left:1.25rem;font-size:0.95rem;}.wb-protect li::marker{color:#84cc16;}.wb-links{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:2rem;}.wb-link{flex:1;min-width:200px;background:linear-gradient(145deg, rgba(30,27,56,0.7) 0%, rgba(10,14,22,0.85) 60%, rgba(20,20,23,0.7) 100%);border:1px solid rgba(82,82,91,.35);border-radius:12px;padding:1rem 1.25rem;text-decoration:none;text-align:center;transition:all 0.2s;}.wb-link:hover{border-color:rgba(255,255,255,0.15);transform:translateY(-1px);}.wb-link-title{font-weight:600;font-size:0.95rem;}.wb-link-sub{color:#a1a1aa;font-size:0.8rem;margin-top:0.25rem;}.wb-cta{text-align:center;padding:2.5rem 2rem;background:linear-gradient(135deg, rgba(132,204,22,0.12) 0%, rgba(132,204,22,0.08) 50%, rgba(132,204,22,0.12) 100%);border:1px solid rgba(82,82,91,.35);border-radius:16px;}.wb-cta h3{color:#fafafa;font-size:1.15rem;font-weight:700;margin-bottom:0.5rem;}.wb-cta p{color:#a1a1aa;font-size:0.9rem;margin-bottom:1rem;}.wb-cta-btn{display:inline-flex;align-items:center;gap:0.5rem;background:linear-gradient(135deg, #ef4444, #dc2626, #b91c1c);color:#0a0a0b;padding:0.85rem 1.75rem;text-decoration:none;font-weight:700;border:none;border-radius:10px;font-size:0.95rem;transition:all 0.2s;}.wb-cta-btn:hover{background:linear-gradient(135deg, #b91c1c, #ef4444, #dc2626);box-shadow:0 0 24px rgba(132,204,22,0.3);}.wb-cta-note{margin-top:0.75rem;font-size:0.7rem;color:#84cc16;}
@media(max-width:600px){.wb-links{flex-direction:column;}}
.gw-reveal,.gw-reveal-left,.gw-reveal-right,.gw-reveal-scale{opacity:1!important;transform:none!important;}
.ed-wrap{max-width:780px;margin:0 auto;padding:2rem 1.25rem 4rem;padding-top:100px;}
.ed-back{color:#a1a1aa;text-decoration:none;display:inline-flex;align-items:center;gap:.4rem;font-size:.82rem;font-weight:500;margin-bottom:1.25rem;transition:color .2s;}
.ed-back:hover{color:#84cc16;}
.ed-badge{display:inline-block;font-size:.7rem;font-weight:700;padding:.3rem .7rem;border-radius:999px;background:rgba(132,204,22,.12);color:#84cc16;letter-spacing:.4px;text-transform:uppercase;border:1px solid rgba(132,204,22,.25);}
.ed-badge-platform{background:rgba(132,204,22,.12);color:#bef264;border-color:rgba(132,204,22,.25);}
.ed-meta-row{display:flex;align-items:center;gap:.6rem;margin-bottom:.85rem;flex-wrap:wrap;}
.ed-meta-time{color:#6b6b73;font-size:.78rem;font-weight:500;}
.ed-h1{font-size:2.05rem;color:#fafafa;font-weight:800;margin:0 0 .7rem;line-height:1.2;letter-spacing:-.01em;}
.ed-deck{color:#a1a1aa;font-size:1.02rem;line-height:1.55;margin:0 0 1.75rem;font-weight:400;}
.ed-hero{position:relative;width:100%;aspect-ratio:16/9;border-radius:16px;overflow:hidden;margin:0 0 2rem;background:linear-gradient(135deg,rgba(20,20,23,.85),rgba(10,10,11,.95));border:1px solid rgba(82,82,91,.35);box-shadow:0 12px 36px rgba(0,0,0,.45),0 0 0 1px rgba(132,204,22,.06);}
.ed-hero img{width:100%;height:100%;object-fit:cover;display:block;}
.ed-hero-placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 30% 30%,rgba(132,204,22,.18),transparent 60%),radial-gradient(ellipse at 80% 70%,rgba(132,204,22,.18),transparent 60%),linear-gradient(135deg,#141417,#0a0a0b);}
.ed-hero-placeholder svg{width:96px;height:96px;opacity:.55;}
.ed-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,10,11,.6) 0%,transparent 35%);pointer-events:none;}
.ed-body{color:#a1a1aa;line-height:1.75;font-size:.96rem;}
.ed-body h2{color:#fafafa;font-size:1.35rem;font-weight:700;margin:2rem 0 .75rem;letter-spacing:-.005em;}
.ed-body h3{color:#fafafa;font-size:1.08rem;font-weight:600;margin:1.5rem 0 .55rem;}
.ed-body ul,.ed-body ol{margin:.5rem 0 1rem 1.25rem;}
.ed-body li{margin-bottom:.4rem;}
.ed-body p{margin:0 0 1rem;}
.ed-body strong{color:#fafafa;font-weight:600;}
.ed-body a{color:#84cc16;text-decoration:none;border-bottom:1px solid rgba(132,204,22,.3);}
.ed-body a:hover{border-bottom-color:#84cc16;}
.ed-section{background:linear-gradient(135deg,rgba(20,20,23,.55),rgba(10,10,11,.55));border:1px solid rgba(82,82,91,.35);border-radius:14px;padding:1.4rem 1.5rem;margin:1.25rem 0;}
.ed-section h2{margin-top:.25rem;}
.ed-steps{counter-reset:edstep;list-style:none;margin:.85rem 0 0;padding:0;}
.ed-steps li{counter-increment:edstep;position:relative;padding:.55rem 0 .55rem 2.4rem;border-bottom:1px solid rgba(82,82,91,.35);color:#a1a1aa;font-size:.92rem;}
.ed-steps li:last-child{border-bottom:none;}
.ed-steps li::before{content:counter(edstep);position:absolute;left:0;top:.55rem;width:1.7rem;height:1.7rem;background:linear-gradient(135deg,#84cc16,#65a30d);color:#0a0a0b;border-radius:999px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.78rem;}
.ed-warn{display:flex;gap:.7rem;align-items:flex-start;background:linear-gradient(135deg,rgba(239,68,68,.08),rgba(239,68,68,.02));border:1px solid rgba(239,68,68,.25);border-radius:12px;padding:1rem 1.15rem;margin:1rem 0;color:#fca5a5;font-size:.9rem;}
.ed-warn-icon{flex:0 0 22px;color:#ef4444;}
.ed-scams{display:grid;grid-template-columns:1fr;gap:.6rem;margin:.85rem 0 0;}
.ed-scam{display:flex;gap:.7rem;align-items:flex-start;padding:.7rem .9rem;background:rgba(239,68,68,.06);border:1px solid rgba(239,68,68,.18);border-radius:10px;color:#fca5a5;font-size:.88rem;line-height:1.5;}
.ed-scam svg{flex:0 0 18px;color:#ef4444;margin-top:.15rem;}
.ed-cta{position:relative;text-align:center;padding:2.4rem 1.75rem;background:linear-gradient(135deg,rgba(132,204,22,.1) 0%,rgba(132,204,22,.08) 50%,rgba(132,204,22,.1) 100%);border:1px solid rgba(132,204,22,.22);border-radius:16px;margin:2.25rem 0 2rem;overflow:hidden;}
.ed-cta::before{content:'';position:absolute;top:-30%;left:-10%;width:60%;height:160%;background:radial-gradient(ellipse at center,rgba(132,204,22,.18),transparent 60%);pointer-events:none;}
.ed-cta h3{color:#fafafa;font-size:1.25rem;font-weight:800;margin:0 0 .55rem;letter-spacing:-.005em;position:relative;}
.ed-cta p{color:#a1a1aa;font-size:.93rem;margin:0 0 1.15rem;position:relative;}
.ed-cta a{position:relative;display:inline-flex;align-items:center;gap:.45rem;background:linear-gradient(135deg,#84cc16,#65a30d);color:#0a0a0b;padding:.85rem 1.6rem;border:none;border-radius:999px;font-weight:700;font-size:.92rem;text-decoration:none;transition:all .2s;box-shadow:0 8px 24px rgba(132,204,22,.25);}
.ed-cta a:hover{transform:translateY(-1px);box-shadow:0 12px 32px rgba(132,204,22,.4);}
.ed-related{margin:3rem 0 0;padding-top:2rem;border-top:1px solid rgba(82,82,91,.35);}
.ed-related h2{color:#fafafa;font-size:1.1rem;font-weight:700;margin:0 0 1rem;letter-spacing:.01em;}
.ed-related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.85rem;}
.ed-related-card{display:block;padding:1rem 1.1rem;background:rgba(20,20,23,.55);border:1px solid rgba(82,82,91,.35);border-radius:12px;text-decoration:none;transition:all .2s;}
.ed-related-card:hover{border-color:rgba(132,204,22,.4);background:rgba(20,20,23,.8);transform:translateY(-1px);}
.ed-related-card h3{color:#fafafa;font-size:.92rem;font-weight:600;margin:0 0 .35rem;line-height:1.35;}
.ed-related-card p{color:#a1a1aa;font-size:.78rem;margin:0;line-height:1.45;}
@media (max-width:640px){
.ed-wrap{padding-top:80px;}
.ed-h1{font-size:1.6rem;}
.ed-deck{font-size:.95rem;}
.ed-body{font-size:.92rem;}
.ed-section{padding:1.15rem 1.15rem;}
}
.bi-paywall-fade{position:relative;height:140px;margin-top:-140px;background:linear-gradient(180deg,rgba(10,14,22,0) 0%,rgba(10,14,22,.85) 60%,rgba(10,14,22,1) 100%);pointer-events:none;z-index:2;}
.bi-paywall{position:relative;text-align:center;padding:2.4rem 1.6rem 2.6rem;background:linear-gradient(135deg,rgba(132,204,22,.08) 0%,rgba(132,204,22,.10) 50%,rgba(132,204,22,.08) 100%);border:1px solid rgba(132,204,22,.32);border-radius:18px;margin:0 0 2rem;overflow:hidden;box-shadow:0 12px 36px rgba(0,0,0,.45),0 0 0 1px rgba(132,204,22,.06);}
.bi-paywall::before{content:'';position:absolute;top:-30%;left:-10%;width:120%;height:160%;background:radial-gradient(ellipse at center,rgba(132,204,22,.18),transparent 60%);pointer-events:none;}
.bi-paywall-icon{position:relative;width:44px;height:44px;margin:0 auto .9rem;border-radius:14px;background:linear-gradient(135deg,#84cc16,#65a30d);display:flex;align-items:center;justify-content:center;color:#0a0a0b;box-shadow:0 8px 20px rgba(132,204,22,.35);}
.bi-paywall-icon svg{width:22px;height:22px;}
.bi-paywall-meta{position:relative;font-size:.74rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#a1a1aa;margin-bottom:.55rem;}
.bi-paywall-h{position:relative;color:#fafafa;font-size:1.45rem;font-weight:800;margin:0 0 .65rem;letter-spacing:-.005em;line-height:1.25;}
.bi-paywall-p{position:relative;color:#a1a1aa;font-size:.96rem;line-height:1.55;margin:0 auto 1.4rem;max-width:480px;text-align:center !important;text-wrap:balance;-webkit-text-wrap:balance;}
.bi-paywall-cta-row{position:relative;margin-bottom:.85rem;}
.bi-paywall-cta{display:inline-flex;align-items:center;gap:.45rem;background:linear-gradient(135deg,#84cc16,#65a30d);color:#0a0a0b!important;padding:.95rem 1.85rem;border:none;border-radius:999px;font-weight:700;font-size:.96rem;text-decoration:none;transition:all .2s;box-shadow:0 8px 24px rgba(132,204,22,.35);}
.bi-paywall-cta:hover{transform:translateY(-1px);box-shadow:0 14px 36px rgba(132,204,22,.5);}
.bi-paywall-sec{position:relative;margin-bottom:1.4rem;}
.bi-paywall-link{color:#a1a1aa;font-size:.86rem;text-decoration:none;border-bottom:1px solid rgba(82,82,91,.35);padding-bottom:1px;transition:color .2s,border-color .2s;}
.bi-paywall-link:hover{color:#84cc16;border-bottom-color:#84cc16;}
.bi-paywall-ben{position:relative;display:flex;justify-content:center;flex-wrap:wrap;gap:.95rem 1.6rem;padding-top:1.1rem;border-top:1px solid rgba(82,82,91,.35);}
.bi-paywall-ben-item{display:inline-flex;align-items:center;gap:.4rem;color:#a1a1aa;font-size:.82rem;font-weight:500;}
.bi-paywall-ben-dot{width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,#84cc16,#65a30d);box-shadow:0 0 8px rgba(132,204,22,.6);}
@media (max-width:640px){
.bi-paywall{padding:1.85rem 1.1rem 2rem;border-radius:14px;}
.bi-paywall-h{font-size:1.18rem;}
.bi-paywall-p{font-size:.9rem;}
.bi-paywall-cta{padding:.85rem 1.4rem;font-size:.9rem;width:100%;justify-content:center;}
.bi-paywall-ben{gap:.55rem .95rem;}
.bi-paywall-ben-item{font-size:.76rem;}
}
.anti-doxx-hero {
text-align: center;
padding: 4rem 1rem 3rem;
padding-top: 120px;
max-width: 900px;
margin: 0 auto;
}
.anti-doxx-hero h1 {
font-size: 2.8rem;
background: linear-gradient(135deg, #ef4444, #fbbf24, #ef4444);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
margin-bottom: 1rem;
line-height: 1.2;
}
.anti-doxx-hero .subtitle {
color: #a1a1aa;
font-size: 1.25rem;
max-width: 700px;
margin: 0 auto 2rem;
line-height: 1.6;
}
.anti-doxx-badge {
display: inline-flex;
align-items: center;
gap: 0.5rem;
background: linear-gradient(135deg, rgba(239, 68, 68, 0.15), rgba(251, 191, 36, 0.1));
border: 1px solid rgba(239, 68, 68, 0.4);
padding: 0.5rem 1rem;
color: #fbbf24;
font-size: 0.85rem;
font-weight: 700;
margin-bottom: 1.5rem;
clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
}
.feature-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
gap: 2rem;
max-width: 1200px;
margin: 0 auto;
padding: 0 1rem;
}
.feature-card {
background: linear-gradient(135deg, rgba(20,20,23, 0.95), rgba(27,27,31, 0.9));
border: 1px solid rgba(82,82,91,.35);
padding: 2rem;
clip-path: polygon(15px 0, 100% 0, 100% calc(100% - 15px), calc(100% - 15px) 100%, 0 100%, 0 15px);
transition: all 0.3s;
}
.feature-card:hover {
border-color: rgba(82,82,91,.35);
transform: translateY(-4px);
}
.feature-card .icon-wrap {
width: 64px;
height: 64px;
background: linear-gradient(135deg, rgba(82,82,91,.35), rgba(82,82,91,.35));
border: 1px solid rgba(82,82,91,.35);
display: flex;
align-items: center;
justify-content: center;
font-size: 2rem;
margin-bottom: 1.25rem;
clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
}
.feature-card h3 {
color: #fafafa;
font-size: 1.3rem;
margin-bottom: 0.75rem;
}
.feature-card p {
color: #a1a1aa;
font-size: 0.95rem;
line-height: 1.6;
margin-bottom: 1rem;
}
.feature-card ul {
list-style: none;
padding: 0;
margin: 0;
}
.feature-card li {
color: #a1a1aa;
font-size: 0.9rem;
padding: 0.5rem 0;
padding-left: 1.5rem;
position: relative;
}
.feature-card li::before {
content: "";
position: absolute;
left: 0;
color: #84cc16;
font-weight: 700;
}
.comparison-section {
max-width: 1000px;
margin: 4rem auto;
padding: 0 1rem;
}
.comparison-section h2 {
text-align: center;
color: #fafafa;
font-size: 2rem;
margin-bottom: 2rem;
}
.pros-cons {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 2rem;
}
@media (max-width: 768px) {
.pros-cons { grid-template-columns: 1fr; }
.anti-doxx-hero h1 { font-size: 2rem; }
}
.pros-card, .cons-card {
padding: 2rem;
clip-path: polygon(12px 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%, 0 12px);
}
.pros-card {
background: linear-gradient(135deg, rgba(132,204,22, 0.1), rgba(132,204,22, 0.05));
border: 1px solid rgba(132,204,22, 0.3);
}
.cons-card {
background: linear-gradient(135deg, rgba(251, 191, 36, 0.1), rgba(251, 191, 36, 0.05));
border: 1px solid rgba(251, 191, 36, 0.3);
}
.pros-card h3 { color: #84cc16; }
.cons-card h3 { color: #fbbf24; }
.stack-section {
max-width: 900px;
margin: 4rem auto;
padding: 2.5rem;
background: linear-gradient(135deg, rgba(82,82,91,.35), rgba(82,82,91,.35));
border: 1px solid rgba(82,82,91,.35);
clip-path: polygon(20px 0, 100% 0, 100% calc(100% - 20px), calc(100% - 20px) 100%, 0 100%, 0 20px);
}
.stack-section h2 {
color: #ef4444;
font-size: 1.8rem;
margin-bottom: 0.75rem;
text-align: center;
}
.stack-section .intro {
color: #a1a1aa;
text-align: center;
margin-bottom: 2rem;
}
.stack-item {
display: flex;
gap: 1.25rem;
padding: 1.25rem;
background: rgba(20,20,23, 0.5);
margin-bottom: 1rem;
clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
}
.stack-item .number {
width: 40px;
height: 40px;
background: linear-gradient(135deg, #ef4444, #ef4444);
color: #0a0a0b;
display: flex;
align-items: center;
justify-content: center;
font-weight: 700;
font-size: 1.1rem;
flex-shrink: 0;
clip-path: polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px);
}
.stack-item .content h4 {
color: #fafafa;
margin-bottom: 0.25rem;
}
.stack-item .content p {
color: #a1a1aa;
font-size: 0.9rem;
margin: 0;
}
.cta-section {
text-align: center;
padding: 4rem 1rem;
max-width: 700px;
margin: 0 auto;
}
.cta-section h2 {
color: #fafafa;
font-size: 2rem;
margin-bottom: 1rem;
}
.cta-section p {
color: #a1a1aa;
margin-bottom: 2rem;
}
.cta-btn {
display: inline-flex;
align-items: center;
gap: 0.75rem;
padding: 1rem 2.5rem;
background: linear-gradient(135deg, #84cc16, #65a30d);
color: white;
text-decoration: none;
font-weight: 700;
font-size: 1.1rem;
clip-path: polygon(12px 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%, 0 12px);
transition: all 0.3s;
}
.cta-btn:hover {
transform: translateY(-2px);
box-shadow: 0 10px 30px rgba(132,204,22, 0.3);
}
.articles-section {
max-width: 1000px;
margin: 3rem auto;
padding: 0 1rem;
}
.articles-section h2 {
color: #fafafa;
font-size: 1.5rem;
margin-bottom: 1.5rem;
text-align: center;
}
.article-links {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 1rem;
}
.article-link {
display: block;
padding: 1.25rem;
background: rgba(20,20,23, 0.8);
border: 1px solid rgba(82,82,91,.35);
text-decoration: none;
clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
transition: all 0.3s;
}
.article-link:hover {
border-color: rgba(82,82,91,.35);
}
.article-link h4 {
color: #ef4444;
font-size: 1rem;
margin-bottom: 0.5rem;
}
.article-link p {
color: #a1a1aa;
font-size: 0.85rem;
margin: 0;
}
/* ---- GW_SECTION_BG_CSS (sentinelized) — section shells used by blog bodies ---- */
/* WS12.297 — Section bg textures. Direct background-image (NOT ::before)
so we never collide with upstream .section ::before rules. */
/* Base: every textured section gets the dark base color */
.gw-bg {
position: relative;
isolation: isolate;
background-color: #0a0a0b;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
}
.gw-bg > * { position: relative; z-index: 2; }
/* Soft bottom fade for content readability */
.gw-bg::after {
content: '';
position: absolute;
left: 0; right: 0; bottom: 0;
height: 50%;
background: linear-gradient(180deg, transparent 0%, rgba(2, 6, 23, .42) 100%);
pointer-events: none;
z-index: 1;
}
/* Aurora — radial cyan/violet glow wash */
.gw-bg.gw-bg-aurora {
background-image:
radial-gradient(ellipse 65% 90% at 18% 25%, rgba(132,204,22,.42), transparent 60%),
radial-gradient(ellipse 65% 90% at 82% 75%, rgba(132,204,22,.40), transparent 60%),
radial-gradient(ellipse 55% 50% at 50% 110%, rgba(132,204,22,.32), transparent 60%);
}
.gw-bg.gw-bg-aurora.gw-bg-hero {
background-image:
radial-gradient(ellipse 70% 95% at 18% 25%, rgba(132,204,22,.58), transparent 62%),
radial-gradient(ellipse 70% 95% at 82% 75%, rgba(132,204,22,.55), transparent 62%),
radial-gradient(ellipse 60% 55% at 50% 110%, rgba(132,204,22,.42), transparent 62%);
}
/* Hex — three-axis honeycomb weave (continuous, fills entire section) */
.gw-bg.gw-bg-hex {
background-image:
radial-gradient(circle at 50% 0%, rgba(132,204,22,.10), transparent 65%),
repeating-linear-gradient(60deg, transparent 0 28px, rgba(132,204,22,.22) 28px 29.5px),
repeating-linear-gradient(-60deg, transparent 0 28px, rgba(132,204,22,.20) 28px 29.5px),
repeating-linear-gradient(0deg, transparent 0 28px, rgba(132,204,22,.16) 28px 29.5px);
}
/* Topo — flowing horizontal contour lines at slight angles */
.gw-bg.gw-bg-topo {
background-color: #0a0a0b;
background-image:
repeating-linear-gradient(2deg, transparent 0 38px, rgba(132,204,22,.22) 38px 40px),
repeating-linear-gradient(-1deg, transparent 0 56px, rgba(132,204,22,.18) 56px 58px),
repeating-linear-gradient(3deg, transparent 0 80px, rgba(132,204,22,.16) 80px 82px),
radial-gradient(ellipse at 50% 50%, #141417 0%, #0a0a0b 60%, #0a0a0b 100%);
}
/* Beams — diagonal scanning streaks across full width */
.gw-bg.gw-bg-beams {
background-image:
repeating-linear-gradient(108deg, transparent 0 70px, rgba(132,204,22,.24) 70px 73px, transparent 73px 180px, rgba(132,204,22,.22) 180px 183px, transparent 183px 320px, rgba(132,204,22,.18) 320px 323px, transparent 323px 480px, rgba(132,204,22,.20) 480px 483px, transparent 483px 640px);
}
/* Mesh — geometric facets repeating */
.gw-bg.gw-bg-mesh {
background-color: #0a0a0b;
background-image:
repeating-linear-gradient(120deg, transparent 0 90px, rgba(132,204,22,.18) 90px 91.5px, transparent 91.5px 180px, rgba(132,204,22,.14) 180px 181.5px, transparent 181.5px 270px),
repeating-linear-gradient(60deg, transparent 0 110px, rgba(132,204,22,.14) 110px 111.5px, transparent 111.5px 220px, rgba(132,204,22,.12) 220px 221.5px, transparent 221.5px 330px),
radial-gradient(ellipse 40% 50% at 25% 30%, rgba(132,204,22,.12), transparent 60%),
radial-gradient(ellipse 40% 50% at 75% 70%, rgba(132,204,22,.12), transparent 60%);
}
/* Orbs — large blurred glow blobs (closing CTA) */
.gw-bg.gw-bg-orbs {
background-image:
radial-gradient(circle 320px at 8% 12%, rgba(132,204,22,.70), transparent 60%),
radial-gradient(circle 300px at 92% 88%, rgba(132,204,22,.66), transparent 60%),
radial-gradient(circle 240px at 60% 35%, rgba(132,204,22,.52), transparent 60%);
}
/* Rest — flat dark vignette (between textured sections) */
.gw-bg.gw-bg-rest {
background-image: radial-gradient(ellipse at 50% 50%, #141417 0%, #0a0a0b 60%, #0a0a0b 100%);
}
.gw-bg.gw-bg-rest::after { display: none; }
/* Mobile texture moderation */
@media (max-width: 768px) {
.gw-bg.gw-bg-aurora,
.gw-bg.gw-bg-hex,
.gw-bg.gw-bg-topo,
.gw-bg.gw-bg-beams,
.gw-bg.gw-bg-mesh,
.gw-bg.gw-bg-orbs { opacity: .94; }
}
/* Mobile overflow guard — defense in depth */
@media (max-width: 768px) {
html, body { overflow-x: clip !important; max-width: 100vw !important; }
.gw-bg, .section, .ent-section, .ent-hero, .ft-section, .fdr-section,
.pf-hero, .pf-section, .pf-founder, .fam-hero, .fam-section, .fam-chain,
.fam-quote, .fam-waitlist, .ab-page, .rc-hero, .pricing-hero, .pwc-section,
.bottom-cta-section, .bi-wrap, .ed-wrap, .ent-page, .pf-page,
.gw-stat, .gw-step, .gw-path, .stat-card, .threat-card, .breach-card,
.dashboard-card, .dash-card, .dash-tile, .gw-prof-card, .exposure-tile,
.exposure-card, .action-card, .recommendation-card, .plan-card,
.mfa-setup-card, .settings-profile-card, .subscription-info-card,
.mf-step-card, .ai-briefing-card, .security-status-card, .smart-suggestion-card,
.reveal-item, .reveals-grid {
max-width: 100% !important;
box-sizing: border-box !important;
}
}
/* Section padding (kept from original) */
.gw-bg{padding:3.2rem 1.5rem;border-radius:18px;margin:1.5rem 0;}
@media (max-width:640px){.gw-bg{padding:2.2rem 1.1rem;border-radius:14px;margin:1rem 0;}}
/* Helpers (kept from original) */
.gw-section-eyebrow{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#84cc16;background:rgba(132,204,22,.12);border:1px solid rgba(132,204,22,.32);padding:4px 11px;border-radius:999px;margin-bottom:.85rem;}
.gw-section-h{color:#fafafa;font-size:clamp(1.4rem,2.8vw,2rem);font-weight:800;letter-spacing:-.005em;line-height:1.2;margin:0 0 .65rem;text-align:center;}
.gw-section-h span{background:linear-gradient(135deg,#84cc16,#65a30d,#84cc16);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.gw-section-sub{color:#a1a1aa;font-size:.96rem;line-height:1.55;max-width:580px;margin:0 auto 1.6rem;text-align:center;}
.gw-section-inner{max-width:880px;margin:0 auto;}
.gw-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem;max-width:880px;margin:0 auto;}
.gw-stat{text-align:center;padding:1rem .85rem;background:rgba(20,20,23,.65);border:1px solid rgba(82,82,91,.35);border-radius:14px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);}
.gw-stat-num{display:block;font-size:1.55rem;font-weight:800;background:linear-gradient(135deg,#84cc16,#84cc16);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:-.02em;line-height:1.1;}
.gw-stat-label{display:block;font-size:.74rem;color:#a1a1aa;letter-spacing:.04em;text-transform:uppercase;font-weight:600;margin-top:.35rem;}
@media (max-width:640px){.gw-stats{grid-template-columns:repeat(2,1fr);}.gw-stat-num{font-size:1.3rem;}}
.gw-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;max-width:880px;margin:0 auto;}
/* WS12.585.495 — Pre-495 .gw-step had no display rule here, but static
shared-bundle.css line 1 ships a legacy `.gw-step{display:flex;align-items:center}`
from an older horizontal-card pattern. That made .gw-step a flex ROW,
which lined up the icon-box + h3 + body horizontally on a single
axis. With the icon-box at width:38px declared but `flex:0 1 auto`
inside that row, the box shrunk to ~22px to fit, and the
text
wrapped awkwardly next to the h3 (Brandon's screenshot on /blog
"From handle to real identity"). The fix below forces the flex
layout into a vertical column with stretch alignment + locks the
icon-box width via flex-shrink:0, so the legacy shared-bundle rule
keeps its display:flex but every other layout property is overridden
by these higher-specificity-plus-!important declarations. */
.gw-step{position:relative;padding:1.4rem 1.2rem 1.5rem;background:rgba(20,20,23,.72);border:1px solid rgba(82,82,91,.35);border-radius:16px;text-align:left;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex !important;flex-direction:column !important;align-items:stretch !important;justify-content:flex-start !important;}
.gw-step-num{position:absolute;top:-12px;left:1rem;font-size:.65rem;font-weight:800;letter-spacing:.16em;color:#0a0a0b;background:linear-gradient(135deg,#84cc16,#65a30d);padding:4px 9px;border-radius:999px;text-transform:uppercase;}
.gw-step-icon{display:flex !important;align-items:center;justify-content:center;width:38px !important;height:38px !important;flex:0 0 38px !important;border-radius:10px;background:linear-gradient(135deg,rgba(132,204,22,.18),rgba(132,204,22,.18));border:1px solid rgba(132,204,22,.3);margin-bottom:.7rem;color:#84cc16;}
.gw-step-icon svg{width:20px;height:20px;}
.gw-step h3{color:#fafafa;font-size:1rem;font-weight:700;margin:0 0 .35rem;letter-spacing:-.005em;}
.gw-step p{color:#a1a1aa;font-size:.86rem;line-height:1.55;margin:0;}
@media (max-width:780px){.gw-steps{grid-template-columns:1fr;}}
/* Flush mode for full-bleed page sections */
.section.gw-bg, .bottom-cta-section.gw-bg, .ent-section.gw-bg, .ent-hero.gw-bg,
.ft-section.gw-bg, .fdr-section.gw-bg, .pf-hero.gw-bg, .pf-section.gw-bg,
.pf-founder.gw-bg, .fam-hero.gw-bg, .fam-section.gw-bg, .fam-chain.gw-bg,
.fam-waitlist.gw-bg, .fam-quote.gw-bg, .ab-page.gw-bg, .rc-hero.gw-bg,
.pricing-hero.gw-bg, .pwc-section.gw-bg {
border-radius: 0 !important;
margin-top: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
/* ============================================================================
WS12.287 — MOTION + MICRO-INTERACTIONS POLISH
Slow continuous drift on textures + unified button hover sweep + universal
focus rings + card lift. All gated behind prefers-reduced-motion.
============================================================================ */
@media (prefers-reduced-motion: no-preference) {
/* Aurora gradient drifts diagonally over 90s loop. */
@keyframes gw-aurora-drift {
0% { background-position: 0% 50%, 100% 50%, 50% 100%; }
50% { background-position: 100% 50%, 0% 50%, 50% 0%; }
100% { background-position: 0% 50%, 100% 50%, 50% 100%; }
}
.gw-bg.gw-bg-aurora::before {
background-size: 180% 180%, 180% 180%, 180% 180%;
animation: gw-aurora-drift 90s ease-in-out infinite;
}
.gw-bg.gw-bg-aurora.gw-bg-hero::before {
animation: gw-aurora-drift 65s ease-in-out infinite; /* hero a bit faster */
}
/* Orbs drift in a soft Lissajous figure over 70s. */
@keyframes gw-orbs-drift {
0% { background-position: 0% 0%, 100% 100%, 50% 30%; }
33% { background-position: 12% 8%, 88% 92%, 40% 38%; }
66% { background-position: 6% 4%, 94% 96%, 60% 33%; }
100% { background-position: 0% 0%, 100% 100%, 50% 30%; }
}
.gw-bg.gw-bg-orbs::before {
background-size: 800px 800px, 800px 800px, 600px 600px;
animation: gw-orbs-drift 70s ease-in-out infinite;
}
/* Topo isolines breathe — very subtle scale + opacity pulse. */
@keyframes gw-topo-breath {
0%, 100% { transform: scale(1.0); opacity: 1; }
50% { transform: scale(1.025); opacity: .88; }
}
.gw-bg.gw-bg-topo::before {
transform-origin: center center;
animation: gw-topo-breath 22s ease-in-out infinite;
will-change: transform, opacity;
}
/* Hex mesh shift — slow translate across the weave (4px range). */
@keyframes gw-hex-shift {
0%, 100% { background-position: 0 0, 0 0, 0 0, 0 0; }
50% { background-position: 0 0, 12px -7px, -12px -7px, 0 14px; }
}
.gw-bg.gw-bg-hex::before {
animation: gw-hex-shift 45s ease-in-out infinite;
}
/* Beams sweep — light bars travel slowly across. */
@keyframes gw-beams-sweep {
0% { background-position: -8% 0; }
100% { background-position: 108% 0; }
}
.gw-bg.gw-bg-beams::before {
background-size: 200% 100%;
animation: gw-beams-sweep 28s linear infinite;
}
/* Mesh subtle parallax — diagonal lines drift slightly */
@keyframes gw-mesh-shift {
0%, 100% { background-position: 0 0, 0 0, 0 0, 0 0; }
50% { background-position: 18px 12px, -18px -12px, 0 0, 0 0; }
}
.gw-bg.gw-bg-mesh::before {
animation: gw-mesh-shift 38s ease-in-out infinite;
}
/* Subtle hover micro-lift on cards — works on EVERY card class via :hover. */
.gw-stat:hover, .gw-step:hover, .gw-path:hover {
transform: translateY(-3px);
}
.gw-stat, .gw-step, .gw-path {
transition: transform .28s cubic-bezier(0.2, 0.8, 0.2, 1),
box-shadow .28s ease,
border-color .22s ease,
background .22s ease;
}
}
/* CTA HOVER SWEEP — universal shimmer on primary buttons site-wide.
Applies to every brand CTA class so buttons feel alive on hover.
The sweep is a 2px-thin moving highlight, not a flashy cosmic effect. */
a.gw-cta-btn,
a.bi-cta-btn,
a.pwc-cta,
a.ent-cta-primary,
a.gw-paywall-cta,
a.gw-path-cta,
a.gw-nav-cta,
button.gw-cta,
.gw-mobile-cta {
position: relative;
overflow: hidden;
}
a.gw-cta-btn::before,
a.bi-cta-btn::before,
a.pwc-cta::before,
a.ent-cta-primary::before,
a.gw-paywall-cta::before,
a.gw-nav-cta::before,
button.gw-cta::before,
.gw-mobile-cta::before {
content: '';
position: absolute;
top: 0; left: -75%;
width: 50%; height: 100%;
background: linear-gradient(110deg, transparent 0%, rgba(255,255,255,.18) 50%, transparent 100%);
transform: skewX(-22deg);
transition: left .55s cubic-bezier(0.2, 0.8, 0.2, 1);
pointer-events: none;
}
a.gw-cta-btn:hover::before,
a.bi-cta-btn:hover::before,
a.pwc-cta:hover::before,
a.ent-cta-primary:hover::before,
a.gw-paywall-cta:hover::before,
a.gw-nav-cta:hover::before,
button.gw-cta:hover::before,
.gw-mobile-cta:hover::before {
left: 125%;
}
/* UNIFIED FOCUS RINGS — accessibility + brand. Cyan ring on every
keyboard-focused interactive element. Replaces ugly browser default. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[role="button"]:focus-visible,
.gw-stat:focus-visible,
.gw-step:focus-visible,
.gw-path:focus-visible {
outline: 2px solid rgba(132,204,22, .85) !important;
outline-offset: 2px;
border-radius: 8px;
box-shadow: 0 0 0 4px rgba(132,204,22, .18) !important;
}
/* Don't steal corners on already-rounded items */
a.gw-cta-btn:focus-visible,
a.bi-cta-btn:focus-visible,
a.pwc-cta:focus-visible,
a.ent-cta-primary:focus-visible,
a.gw-paywall-cta:focus-visible,
a.gw-nav-cta:focus-visible,
button.gw-cta:focus-visible,
.gw-mobile-cta:focus-visible {
border-radius: 999px;
}
/* Reduce motion fallback: kill all section drift animations */
@media (prefers-reduced-motion: reduce) {
.gw-bg::before,
.gw-stat, .gw-step, .gw-path,
a.gw-cta-btn::before, a.bi-cta-btn::before, a.pwc-cta::before,
a.ent-cta-primary::before, a.gw-paywall-cta::before, a.gw-nav-cta::before,
button.gw-cta::before, .gw-mobile-cta::before {
animation: none !important;
transition: none !important;
}
}
/* ============================================================================
WS12.288 — QUALITY UX/UI SYSTEM
Site-wide unification for inputs, button loading states, skeletons,
tooltips. Drop-in classes — no template changes required for existing
surfaces beyond opting in via class names.
============================================================================ */
/* --- INPUT SYSTEM --------------------------------------------------------- */
.gw-input,
input.gw-input,
textarea.gw-input,
select.gw-input {
display: block;
width: 100%;
height: 44px;
padding: 0 1rem;
background: rgba(7, 9, 15, .85);
color: #fafafa;
border: 1px solid rgba(82,82,91,.35);
border-radius: 12px;
font-size: 16px; /* iOS won't auto-zoom at 16+ */
font-family: inherit;
outline: none;
transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
-webkit-appearance: none;
appearance: none;
}
textarea.gw-input { height: auto; min-height: 88px; padding: .85rem 1rem; resize: vertical; }
.gw-input::placeholder { color: rgba(82,82,91,.35); }
.gw-input:hover {
border-color: rgba(82,82,91,.35);
background: rgba(7, 9, 15, .95);
}
.gw-input:focus {
border-color: rgba(132,204,22, .65);
box-shadow: 0 0 0 3px rgba(132,204,22, .18);
background: rgba(7, 9, 15, .98);
}
.gw-input[aria-invalid="true"], .gw-input.is-error {
border-color: rgba(239, 68, 68, .55);
box-shadow: 0 0 0 3px rgba(239, 68, 68, .14);
}
.gw-input.is-success {
border-color: rgba(163,230,53, .5);
box-shadow: 0 0 0 3px rgba(163,230,53, .14);
}
.gw-input-row { display: flex; flex-direction: column; gap: .35rem; }
.gw-input-label { font-size: .8rem; font-weight: 600; color: #a1a1aa; letter-spacing: .01em; }
.gw-input-help { font-size: .76rem; color: #a1a1aa; }
.gw-input-help.is-error { color: #fca5a5; }
.gw-input-help.is-success { color: #bef264; }
/* --- BUTTON LOADING STATE ------------------------------------------------- */
/* Add `data-loading="true"` to any button or .gw-mobile-cta to trigger spinner. */
[data-loading="true"] {
pointer-events: none;
position: relative;
color: transparent !important;
text-shadow: none !important;
}
[data-loading="true"]::after {
content: '';
position: absolute;
top: 50%; left: 50%;
width: 18px; height: 18px;
margin: -9px 0 0 -9px;
border: 2px solid rgba(255, 255, 255, .25);
border-top-color: rgba(255, 255, 255, .95);
border-radius: 50%;
animation: gw-spin .7s linear infinite;
}
@keyframes gw-spin { to { transform: rotate(360deg); } }
/* Pulse ring on submit-style buttons during loading */
[data-loading="true"]::before {
content: '' !important;
position: absolute !important;
inset: -3px !important;
border-radius: inherit !important;
border: 2px solid rgba(132,204,22, .55) !important;
animation: gw-loading-pulse 1.4s ease-out infinite !important;
background: none !important;
left: -3px !important;
width: auto !important;
transform: none !important;
}
@keyframes gw-loading-pulse {
0% { opacity: .8; transform: scale(1); }
100% { opacity: 0; transform: scale(1.15); }
}
/* --- SKELETON LOADERS ----------------------------------------------------- */
.gw-skel {
position: relative;
overflow: hidden;
background: rgba(20,20,23, .65);
border-radius: 8px;
color: transparent !important;
user-select: none;
}
.gw-skel::after {
content: '';
position: absolute;
top: 0; left: -120%;
width: 80%; height: 100%;
background: linear-gradient(
90deg,
transparent 0%,
rgba(82,82,91,.35) 30%,
rgba(132,204,22, .12) 50%,
rgba(82,82,91,.35) 70%,
transparent 100%
);
animation: gw-skel-shimmer 1.6s ease-in-out infinite;
}
@keyframes gw-skel-shimmer {
0% { left: -120%; }
100% { left: 220%; }
}
.gw-skel-text { height: .9rem; margin: .35rem 0; border-radius: 4px; }
.gw-skel-title { height: 1.6rem; margin: .5rem 0 .75rem; border-radius: 6px; width: 60%; }
.gw-skel-image { aspect-ratio: 16/9; border-radius: 12px; }
.gw-skel-card { padding: 1.2rem; border-radius: 14px; background: rgba(20,20,23, .55); border: 1px solid rgba(82,82,91,.35); }
.gw-skel-card .gw-skel { background: rgba(20,20,23, .85); }
/* --- TOOLTIP (CSS-only) --------------------------------------------------- */
/* Add `data-gw-tip="Help text"` to any element. Hover/focus reveals popover. */
[data-gw-tip] { position: relative; }
[data-gw-tip]::after {
content: attr(data-gw-tip);
position: absolute;
bottom: calc(100% + 8px);
left: 50%;
transform: translateX(-50%) translateY(4px);
background: linear-gradient(135deg, rgba(20,20,23, .98), rgba(2, 6, 23, .98));
color: #fafafa;
font-size: .76rem;
font-weight: 500;
letter-spacing: .01em;
padding: 6px 10px;
border-radius: 8px;
border: 1px solid rgba(132,204,22, .22);
box-shadow: 0 8px 24px rgba(2, 6, 23, .55);
white-space: nowrap;
pointer-events: none;
opacity: 0;
transition: opacity .18s ease, transform .18s ease;
z-index: 9999;
}
[data-gw-tip]:hover::after,
[data-gw-tip]:focus-visible::after {
opacity: 1;
transform: translateX(-50%) translateY(0);
}
[data-gw-tip-pos="bottom"]::after {
bottom: auto;
top: calc(100% + 8px);
transform: translateX(-50%) translateY(-4px);
}
[data-gw-tip-pos="bottom"]:hover::after,
[data-gw-tip-pos="bottom"]:focus-visible::after {
transform: translateX(-50%) translateY(0);
}
/* --- HERO PARALLAX HOOK --------------------------------------------------- */
/* JS adds CSS vars --gw-px / --gw-py (-1..1 normalized cursor offset). */
@media (prefers-reduced-motion: no-preference) and (min-width: 900px) {
.gw-parallax-target {
transform: translate3d(
calc(var(--gw-px, 0) * 8px),
calc(var(--gw-py, 0) * 6px),
0
);
transition: transform .35s cubic-bezier(.2, .8, .2, 1);
will-change: transform;
}
.gw-parallax-target.gw-parallax-deep {
transform: translate3d(
calc(var(--gw-px, 0) * 14px),
calc(var(--gw-py, 0) * 10px),
0
);
}
}
/* ============================================================================
WS12.289 — EMPTY STATES + DASHBOARD POLISH + INPUT UNIFICATION
============================================================================ */
/* --- EMPTY STATE SYSTEM --------------------------------------------------- */
.gw-empty {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
padding: 3rem 1.5rem;
max-width: 420px;
margin: 2rem auto;
}
.gw-empty-icon {
display: flex;
align-items: center;
justify-content: center;
width: 84px;
height: 84px;
margin: 0 auto 1.25rem;
border-radius: 22px;
background: linear-gradient(135deg, rgba(132,204,22,.10), rgba(132,204,22,.10), rgba(132,204,22,.10));
border: 1px solid rgba(82,82,91,.35);
box-shadow: 0 8px 24px rgba(2,6,23,.4), 0 0 0 4px rgba(132,204,22,.06) inset;
color: #84cc16;
position: relative;
}
.gw-empty-icon::before {
content: '';
position: absolute; inset: -8px;
border-radius: 26px;
background: radial-gradient(ellipse, rgba(132,204,22,.18), transparent 60%);
filter: blur(10px);
z-index: -1;
}
.gw-empty-icon svg { width: 38px; height: 38px; }
.gw-empty h3 {
color: #fafafa;
font-size: 1.1rem;
font-weight: 700;
margin: 0 0 .35rem;
letter-spacing: -.005em;
}
.gw-empty p {
color: #a1a1aa;
font-size: .9rem;
line-height: 1.55;
margin: 0 0 1.25rem;
}
.gw-empty-cta {
display: inline-flex;
align-items: center;
gap: .45rem;
background: linear-gradient(135deg, #84cc16, #65a30d);
color: #0a0a0b !important;
padding: .7rem 1.4rem;
border-radius: 999px;
font-weight: 700;
font-size: .88rem;
text-decoration: none;
border: none;
transition: transform .2s, box-shadow .2s;
}
.gw-empty-cta:hover {
transform: translateY(-1px);
box-shadow: 0 8px 22px rgba(132,204,22,.32);
}
/* --- DASHBOARD CARD POLISH (universal across every dash card class) ------- */
.gw-prof-card,
.stat-card, .main-score-card, .component-card,
.wizard-card, .threat-card, .gsr-stat-card, .gsr-threat-card,
.metric-card, .breach-card,
.dashboard-card, .dash-card, .dash-tile {
transition: transform .25s cubic-bezier(.2,.8,.2,1),
box-shadow .25s ease,
border-color .22s ease,
background .22s ease;
}
@media (prefers-reduced-motion: no-preference) {
.stat-card:hover, .component-card:hover, .threat-card:hover,
.gsr-stat-card:hover, .metric-card:hover, .breach-card:hover,
.dashboard-card:hover, .dash-card:hover, .dash-tile:hover {
transform: translateY(-2px);
box-shadow: 0 10px 28px rgba(2,6,23,.55), 0 0 0 1px rgba(132,204,22,.18) inset;
border-color: rgba(132,204,22,.32);
}
}
/* Dashboard heading polish — better hierarchy + cyan accent line under h2s */
.dashboard-section h2,
.dash-section h2,
.dashboard-section .section-title,
.dash-section-title {
position: relative;
padding-bottom: .55rem;
}
.dashboard-section h2::after,
.dash-section h2::after,
.dashboard-section .section-title::after,
.dash-section-title::after {
content: '';
position: absolute;
bottom: 0; left: 0;
width: 36px;
height: 2px;
background: linear-gradient(90deg, #84cc16, #65a30d, transparent);
border-radius: 2px;
}
/* Dashboard sticky bottom-nav uniform iOS safe-area */
@supports (padding: env(safe-area-inset-bottom)) {
.dashboard-bottom-nav, .dash-bottom-nav, .gw-bottom-nav {
padding-bottom: max(.5rem, env(safe-area-inset-bottom));
}
}
/* --- INPUT UNIFICATION (additive) ---------------------------------------- */
/* Polish the existing custom-class inputs (so we don't have to retag them
all with .gw-input) — bring them up to the same focus-ring quality. */
.bi-newsletter-input:focus,
.search-input:focus,
.pwc-input:focus,
input[name="email"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="text"]:focus {
outline: none;
}
.bi-newsletter-input:focus-visible,
.search-input:focus-visible,
.pwc-input:focus-visible,
input[name="email"]:focus-visible,
input[type="email"]:focus-visible,
input[type="password"]:focus-visible,
input[type="search"]:focus-visible,
input[type="text"]:focus-visible {
border-color: rgba(132,204,22,.65) !important;
box-shadow: 0 0 0 3px rgba(132,204,22,.18) !important;
}
/* ============================================================================
WS12.290 — TOAST + SKIP-LINK + SCROLL-TO-TOP + PRINT
============================================================================ */
/* --- TOAST NOTIFICATION SYSTEM ------------------------------------------- */
.gw-toast-host {
position: fixed;
top: 1rem;
right: 1rem;
z-index: 99999;
display: flex;
flex-direction: column;
gap: .55rem;
pointer-events: none;
max-width: 380px;
width: calc(100vw - 2rem);
}
.gw-toast {
pointer-events: auto;
display: flex;
align-items: flex-start;
gap: .75rem;
padding: .85rem 1rem;
background: linear-gradient(135deg, rgba(20,20,23, .98), rgba(2, 6, 23, .98));
border: 1px solid rgba(132,204,22, .28);
border-radius: 12px;
box-shadow: 0 12px 32px rgba(2, 6, 23, .55), 0 0 0 1px rgba(132,204,22, .08) inset;
color: #fafafa;
font-size: .88rem;
line-height: 1.45;
transform: translateX(20px);
opacity: 0;
animation: gw-toast-in .35s cubic-bezier(.2, .8, .2, 1) forwards;
position: relative;
overflow: hidden;
}
.gw-toast::before {
content: '';
position: absolute;
left: 0; top: 0; bottom: 0;
width: 3px;
background: linear-gradient(180deg, #84cc16, #65a30d);
}
.gw-toast.is-error::before { background: linear-gradient(180deg, #ef4444, #f87171); }
.gw-toast.is-success::before { background: linear-gradient(180deg, #a3e635, #84cc16); }
.gw-toast.is-warning::before { background: linear-gradient(180deg, #fbbf24, #f59e0b); }
.gw-toast.is-removing { animation: gw-toast-out .25s ease forwards; }
.gw-toast-icon {
flex-shrink: 0;
width: 22px; height: 22px;
display: inline-flex;
align-items: center;
justify-content: center;
color: #84cc16;
}
.gw-toast.is-error .gw-toast-icon { color: #f87171; }
.gw-toast.is-success .gw-toast-icon { color: #a3e635; }
.gw-toast.is-warning .gw-toast-icon { color: #fbbf24; }
.gw-toast-icon svg { width: 18px; height: 18px; }
.gw-toast-body { flex: 1; min-width: 0; }
.gw-toast-title {
font-weight: 700;
font-size: .9rem;
margin: 0 0 .15rem;
letter-spacing: -.005em;
}
.gw-toast-msg {
color: #a1a1aa;
font-size: .82rem;
margin: 0;
}
.gw-toast-close {
flex-shrink: 0;
background: transparent;
border: 0;
color: #a1a1aa;
cursor: pointer;
padding: 2px 4px;
font-size: 1rem;
line-height: 1;
border-radius: 4px;
transition: color .15s, background .15s;
}
.gw-toast-close:hover { color: #fafafa; background: rgba(82,82,91,.35); }
@keyframes gw-toast-in {
from { transform: translateX(20px); opacity: 0; }
to { transform: translateX(0); opacity: 1; }
}
@keyframes gw-toast-out {
from { transform: translateX(0); opacity: 1; }
to { transform: translateX(20px); opacity: 0; }
}
@media (max-width: 540px) {
.gw-toast-host { top: auto; bottom: 1rem; left: 1rem; right: 1rem; width: auto; max-width: none; }
.gw-toast { font-size: .84rem; padding: .75rem .85rem; }
}
/* --- SKIP-TO-CONTENT LINK (a11y) ----------------------------------------- */
.gw-skip-link {
position: absolute !important;
left: -9999px !important;
top: -9999px !important;
width: 1px !important;
height: 1px !important;
overflow: hidden !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
white-space: nowrap !important;
}
.gw-skip-link:focus,
.gw-skip-link:focus-visible {
position: absolute !important;
left: 1rem !important;
top: 1rem !important;
width: auto !important;
height: auto !important;
clip: auto !important;
clip-path: none !important;
z-index: 100000 !important;
padding: .65rem 1.1rem !important;
background: linear-gradient(135deg, #84cc16, #65a30d) !important;
color: #0a0a0b !important;
font-weight: 700 !important;
font-size: .9rem !important;
text-decoration: none !important;
border-radius: 8px !important;
box-shadow: 0 8px 24px rgba(132,204,22, .35) !important;
outline: 2px solid rgba(255, 255, 255, .85) !important;
outline-offset: 2px !important;
}
/* --- SCROLL-TO-TOP BUTTON ------------------------------------------------- */
/* WS12.574 — `!important` defenses added because rogue third-party JS
(likely a ripple-effect helper in shared.min.js or a cosmic-effects
pass) was injecting `style="position: relative; overflow: hidden;"`
on this button. Inline styles beat CSS, so the button was rendering
at default flow position (top-left of page) instead of fixed bottom-
right. The button is still hidden by opacity:0 but the un-positioned
element took up DOM space in the top-left, leaking through. */
.gw-scroll-top {
position: fixed !important;
bottom: 1.5rem !important;
right: 1.5rem !important;
left: auto !important;
top: auto !important;
z-index: 99998;
width: 44px;
height: 44px;
border-radius: 50%;
background: linear-gradient(135deg, rgba(20,20,23, .96), rgba(2, 6, 23, .96));
border: 1px solid rgba(132,204,22, .32);
color: #84cc16;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
transform: translateY(12px) scale(.92);
pointer-events: none;
transition: opacity .25s ease, transform .25s cubic-bezier(.2, .8, .2, 1), border-color .2s, background .2s;
box-shadow: 0 8px 24px rgba(2, 6, 23, .5);
overflow: visible;
}
.gw-scroll-top.is-visible {
opacity: 1;
transform: translateY(0) scale(1);
pointer-events: auto;
}
.gw-scroll-top:hover {
border-color: rgba(132,204,22, .55);
background: linear-gradient(135deg, rgba(20,20,23, 1), rgba(2, 6, 23, 1));
transform: translateY(-2px) scale(1);
}
.gw-scroll-top svg { width: 20px; height: 20px; }
@media (max-width: 540px) {
.gw-scroll-top {
width: 40px; height: 40px;
bottom: max(1rem, env(safe-area-inset-bottom));
right: 1rem;
}
}
/* Hide if mobile sticky CTA is also present (avoid stacking) */
.gw-mobile-cta + .gw-scroll-top,
body:has(.gw-mobile-cta) .gw-scroll-top {
bottom: 5.5rem;
}
/* --- PRINT STYLES --------------------------------------------------------- */
@media print {
/* Strip backgrounds, navs, sticky chrome */
.gw-bg::before, .gw-bg::after,
.gw-nav, .gw-mobile-cta, .gw-scroll-top, .gw-toast-host,
.gw-bottom-nav, .dashboard-bottom-nav, .live-chat-widget,
.sidebar-nav, .gw-drawer, .gw-drawer-backdrop,
.bi-newsletter, .bi-cta-box, .gw-cta-btn,
[data-loading="true"]::before, [data-loading="true"]::after {
display: none !important;
}
body {
background: #fff !important;
color: #000 !important;
}
a {
color: #000 !important;
text-decoration: underline;
}
a[href]::after {
content: ' (' attr(href) ')';
font-size: .85em;
color: #6b6b73;
}
a[href^="#"]::after, a[href^="javascript:"]::after { content: ''; }
.gw-bg, .section, .ent-section, .ft-section, .pf-section, .fam-section,
.pwc-section, .fdr-section {
page-break-inside: avoid;
background: #fff !important;
color: #000 !important;
border: none !important;
box-shadow: none !important;
}
h1, h2, h3 { color: #000 !important; page-break-after: avoid; }
img { max-width: 100% !important; height: auto !important; }
}
/* ============================================================================
WS12.292 — FOOTER REBUILD POLISH
============================================================================ */
.gw-footer.gw-footer-v2 {
position: relative;
margin-top: 4rem;
padding-top: 0;
background: linear-gradient(180deg, transparent 0%, rgba(7, 9, 15, .65) 35%, rgba(2, 6, 23, .92) 100%);
border-top: 1px solid transparent;
border-image: linear-gradient(90deg, transparent 0%, rgba(132,204,22,.32) 22%, rgba(132,204,22,.42) 50%, rgba(132,204,22,.32) 78%, transparent 100%) 1;
}
.gw-footer.gw-footer-v2::before {
content: '';
position: absolute;
inset: 0;
background:
radial-gradient(ellipse 60% 70% at 18% 10%, rgba(132,204,22,.10), transparent 65%),
radial-gradient(ellipse 60% 70% at 82% 95%, rgba(132,204,22,.10), transparent 65%);
pointer-events: none;
z-index: 0;
}
.gw-footer.gw-footer-v2 > * { position: relative; z-index: 1; }
/* Trust strip */
/* WS12.483 - Trust strip was rendering as `display: block` (vertical stack)
in production despite this rule. Likely a CSS specificity / reset collision.
Adding !important + a body scope to ensure the grid actually applies. */
/* WS12.578 — Even more aggressive defensive overrides. The original
`display: grid !important` should win, but Brandon kept seeing it
stacked vertically. Likely cause: a parent container with restrictive
width (e.g. sidebar-mounted main content area) shrinks the trust
strip below the auto-min-content size, causing items to overflow
into next rows visually as a stack. Now we also set width:100% on
the strip and min-width:0 / min-height:auto on items so they can
shrink to fit when grid space is tight. */
body .gw-footer-trust,
.gw-footer-trust {
display: grid !important;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
gap: 1rem;
width: 100% !important;
max-width: 1180px;
margin: 0 auto;
padding: 2rem 1.5rem 2.4rem;
border-bottom: 1px solid rgba(82,82,91,.35);
box-sizing: border-box;
}
.gw-footer-trust-item {
display: flex !important;
flex-direction: row !important;
align-items: center;
gap: .8rem;
padding: .85rem 1rem;
background: rgba(20,20,23, .55);
border: 1px solid rgba(82,82,91,.35);
border-radius: 12px;
transition: border-color .22s ease, background .22s ease;
min-width: 0 !important;
box-sizing: border-box;
}
.gw-footer-trust-item:hover {
border-color: rgba(132,204,22, .28);
background: rgba(20,20,23, .8);
}
.gw-footer-trust-item svg {
flex-shrink: 0 !important;
width: 22px !important;
height: 22px !important;
max-width: 22px !important;
max-height: 22px !important;
color: #84cc16;
}
.gw-footer-trust-item div { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; }
.gw-footer-trust-item strong {
color: #fafafa;
font-size: 1.02rem;
font-weight: 800;
letter-spacing: -.01em;
background: linear-gradient(135deg, #84cc16, #84cc16);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
}
.gw-footer-trust-item span {
color: #a1a1aa;
font-size: .72rem;
letter-spacing: .04em;
text-transform: uppercase;
font-weight: 600;
margin-top: 2px;
}
@media (max-width: 880px) {
body .gw-footer-trust,
.gw-footer-trust { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 480px) {
body .gw-footer-trust,
.gw-footer-trust { grid-template-columns: 1fr !important; padding: 1.6rem 1.1rem 1.8rem; }
}
/* Mini CTA in brand col */
.gw-footer-cta-row { margin-top: 1rem; }
.gw-footer-mini-cta {
display: inline-flex;
align-items: center;
gap: .35rem;
padding: .55rem 1rem;
background: linear-gradient(135deg, rgba(132,204,22,.12), rgba(132,204,22,.12));
border: 1px solid rgba(132,204,22, .32);
color: #84cc16 !important;
border-radius: 999px;
font-weight: 600;
font-size: .82rem;
text-decoration: none;
transition: border-color .2s, background .2s, color .2s, transform .2s;
}
.gw-footer-mini-cta:hover {
border-color: rgba(132,204,22, .55);
background: linear-gradient(135deg, rgba(132,204,22,.20), rgba(132,204,22,.20));
color: #bef264 !important;
transform: translateY(-1px);
}
/* Footer link column polish */
.gw-footer-v2 .gw-footer-grid {
position: relative;
padding-top: 2rem;
}
.gw-footer-v2 .gw-footer-col h4 {
position: relative;
padding-bottom: .35rem;
}
.gw-footer-v2 .gw-footer-col h4::after {
content: '';
position: absolute;
bottom: 0; left: 0;
width: 24px;
height: 2px;
background: linear-gradient(90deg, #84cc16, #65a30d, transparent);
border-radius: 2px;
}
.gw-footer-v2 .gw-footer-col a {
position: relative;
transition: color .18s ease, padding-left .18s ease;
}
.gw-footer-v2 .gw-footer-col a:hover {
color: #84cc16 !important;
padding-left: 4px;
}
.gw-footer-v2 .gw-footer-col a::before {
content: '';
position: absolute;
left: -10px;
top: 50%;
transform: translateY(-50%);
width: 0;
height: 1px;
background: #84cc16;
transition: width .22s ease;
}
.gw-footer-v2 .gw-footer-col a:hover::before { width: 6px; }
/* Footer bottom row — refined */
.gw-footer-v2 .gw-footer-bottom {
border-top: 1px solid rgba(82,82,91,.35);
background: rgba(2, 6, 23, .55);
padding: 1.25rem 1.5rem;
position: relative;
}
.gw-footer-v2 .gw-footer-bottom p {
font-size: .76rem;
color: #a1a1aa;
line-height: 1.5;
}
/* ============================================================================
WS12.293 — DASHBOARD-SPECIFIC POLISH
============================================================================ */
/* Extended hover lift to ALL dashboard card classes */
.ai-briefing-card,
.security-status-card,
.smart-suggestion-card,
.sv-sector-card,
.subscription-info-card,
.settings-profile-card,
.mfa-setup-card,
.plan-card,
.mf-step-card,
.cosmic-achievement-card,
.score-hero,
.exposure-tile,
.exposure-card,
.action-card,
.recommendation-card,
.onboarding-step,
.dashboard-grid-card {
transition: transform .25s cubic-bezier(.2,.8,.2,1),
box-shadow .25s ease,
border-color .22s ease,
background .22s ease;
}
@media (prefers-reduced-motion: no-preference) {
.ai-briefing-card:hover,
.security-status-card:hover,
.smart-suggestion-card:hover,
.sv-sector-card:hover,
.subscription-info-card:hover,
.plan-card:hover,
.mf-step-card:hover,
.cosmic-achievement-card:hover,
.exposure-tile:hover,
.exposure-card:hover,
.action-card:hover,
.recommendation-card:hover,
.onboarding-step:hover,
.dashboard-grid-card:hover {
transform: translateY(-2px);
box-shadow: 0 10px 28px rgba(2,6,23,.55), 0 0 0 1px rgba(132,204,22,.18) inset;
border-color: rgba(132,204,22,.32) !important;
}
}
/* Score-hero polish — bigger glow + brand gradient on score number */
.score-hero {
position: relative;
overflow: hidden;
border-radius: 18px;
}
.score-hero::before {
content: '';
position: absolute;
inset: 0;
background:
radial-gradient(ellipse 60% 50% at 30% 20%, rgba(132,204,22,.12), transparent 60%),
radial-gradient(ellipse 60% 50% at 70% 80%, rgba(132,204,22,.12), transparent 60%);
pointer-events: none;
z-index: 0;
}
.score-hero > * { position: relative; z-index: 1; }
.score-hero .score-number {
text-shadow: 0 2px 18px rgba(2,6,23,.55), 0 0 32px rgba(132,204,22,.18);
}
/* Stat card cyan ring on hover (per --stat-color preserved for severity) */
.stat-card { position: relative; }
.stat-card:hover {
border-color: var(--stat-color, rgba(132,204,22,.55)) !important;
}
/* Trial banner / alert banner polish */
.trial-banner, .alert-banner {
position: relative;
border-radius: 14px;
overflow: hidden;
}
.trial-banner::before {
content: '';
position: absolute;
top: 0; left: 0; right: 0;
height: 3px;
background: linear-gradient(90deg, transparent, rgba(132,204,22,.6), rgba(132,204,22,.6), transparent);
animation: gw-banner-shimmer 4s ease-in-out infinite;
}
@keyframes gw-banner-shimmer {
0%, 100% { opacity: .55; }
50% { opacity: 1; }
}
/* Onboarding-step empty state polish */
.onboarding-step,
.onboarding-checklist .checklist-item {
position: relative;
}
.onboarding-step::before,
.onboarding-checklist .checklist-item::before {
content: '';
position: absolute;
left: 0; top: 0; bottom: 0;
width: 3px;
background: linear-gradient(180deg, #84cc16, transparent);
border-radius: 2px;
opacity: 0;
transition: opacity .2s;
}
.onboarding-step:hover::before,
.onboarding-checklist .checklist-item:hover::before {
opacity: 1;
}
/* Dashboard-card detail collapse arrows */
.dashboard-card[open] > summary,
details.dashboard-card > summary {
cursor: pointer;
list-style: none;
position: relative;
}
details.dashboard-card > summary::-webkit-details-marker { display: none; }
/* Premium / Warden tier badge polish */
.warden-badge, .elite-badge, .tier-warden, .tier-elite {
position: relative;
}
.warden-badge::before, .tier-warden::before {
content: '';
position: absolute; inset: -2px;
border-radius: inherit;
background: linear-gradient(135deg, rgba(251,191,36,.32), transparent);
filter: blur(4px);
z-index: -1;
}
/* "First-run" empty state for new users with no data yet */
.dashboard-empty-state {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
padding: 3.5rem 1.5rem;
background: linear-gradient(180deg, rgba(20,20,23,.55), rgba(20,20,23,.25));
border: 1px solid rgba(82,82,91,.35);
border-radius: 18px;
margin: 1.5rem 0;
position: relative;
overflow: hidden;
}
.dashboard-empty-state::before {
content: '';
position: absolute;
inset: 0;
background: radial-gradient(ellipse 60% 80% at 50% 0%, rgba(132,204,22,.10), transparent 60%);
pointer-events: none;
}
.dashboard-empty-state > * { position: relative; z-index: 1; }
.dashboard-empty-state h3 { color: #fafafa; font-size: 1.2rem; font-weight: 700; margin: .5rem 0 .35rem; }
.dashboard-empty-state p { color: #a1a1aa; max-width: 420px; line-height: 1.55; margin: 0 0 1.25rem; }
.dashboard-empty-state .gw-empty-cta { font-size: .92rem; padding: .75rem 1.5rem; }
/* ============================================================================
WS12.294 — Homepage icon-wall edge-fade + clamped parallax
============================================================================ */
/* Edge fade mask on the icon-rows wrap so the wall fades out at L/R edges
instead of hard-clipping mid-icon. Premium SaaS pattern (Stripe/Linear/Vercel). */
.icon-rows-wrap {
-webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%);
mask-image: linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%);
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
}
/* Reduce parallax range on the icon wall so cursor-right doesn't compound
the natural right-edge clip. */
@media (prefers-reduced-motion: no-preference) and (min-width: 900px) {
.icon-rows-wrap.gw-parallax-target.gw-parallax-deep {
/* Override the default deep parallax (was 14px X, 10px Y) */
transform: translate3d(
calc(var(--gw-px, 0) * 4px),
calc(var(--gw-py, 0) * 4px),
0
);
}
}
/* Make sure the icon-rows-inner is centered so any natural clipping is
symmetric L/R rather than dumping all overflow to the right side. */
.icon-rows-inner {
margin-left: auto;
margin-right: auto;
}
/* ============================================================================
WS12.296 — MOBILE OVERFLOW GUARD
Defensive rules so no element on any page can push past the viewport.
============================================================================ */
@media (max-width: 768px) {
html, body {
overflow-x: clip !important;
max-width: 100vw !important;
}
.gw-bg,
.section,
.ent-section, .ent-hero,
.ft-section, .fdr-section,
.pf-hero, .pf-section, .pf-founder,
.fam-hero, .fam-section, .fam-chain, .fam-quote, .fam-waitlist,
.ab-page, .rc-hero, .pricing-hero, .pwc-section,
.bottom-cta-section,
.bi-wrap, .ed-wrap, .ent-page, .pf-page, .ab-page,
.gw-bg-card,
.gw-stat, .gw-step, .gw-path,
.ai-briefing-card, .security-status-card, .smart-suggestion-card,
.sv-sector-card, .stat-card, .threat-card, .gsr-stat-card,
.gsr-threat-card, .metric-card, .breach-card,
.dashboard-card, .dash-card, .dash-tile, .gw-prof-card,
.exposure-tile, .exposure-card, .action-card, .recommendation-card,
.onboarding-step, .dashboard-grid-card,
.plan-card, .mfa-setup-card, .settings-profile-card,
.subscription-info-card, .mf-step-card {
max-width: 100% !important;
box-sizing: border-box !important;
}
/* Cards inside gw-empty / gw-paths / gw-stats / gw-steps grids
occasionally inherit absolute positioning that overflows; clamp them. */
.gw-empty, .gw-paths, .gw-stats, .gw-steps {
max-width: 100% !important;
box-sizing: border-box !important;
padding-left: 1rem;
padding-right: 1rem;
}
}
/* ============================================================================
WS12.298 — Full-bleed break-out for textured sections.
Parent wrappers (.ft-page, .fam-page, .pf-page, .ab-page, .fdr-page, .ent-page)
constrain max-width:1180px + padding:0 20px. Textured sections need to ignore
that and stretch edge-to-edge. Negative margin breakout pulls them past their
parent's gutters. Content inside stays in its own max-width container.
============================================================================ */
.section.gw-bg,
.ft-section.gw-bg,
.fdr-section.gw-bg,
.pf-hero.gw-bg, .pf-section.gw-bg, .pf-founder.gw-bg,
.fam-hero.gw-bg, .fam-section.gw-bg, .fam-chain.gw-bg, .fam-quote.gw-bg, .fam-waitlist.gw-bg,
.ab-page.gw-bg,
.rc-hero.gw-bg,
.pricing-hero.gw-bg,
.pwc-hero.gw-bg,
.ent-section.gw-bg, .ent-hero.gw-bg,
.bottom-cta-section.gw-bg,
.bi-wrap > section.gw-bg,
.bi-wrap > .bi-newsletter.gw-bg,
.bi-wrap > .bi-cta-box.gw-bg {
width: 100vw !important;
max-width: 100vw !important;
margin-left: calc(50% - 50vw) !important;
margin-right: calc(50% - 50vw) !important;
border-radius: 0 !important;
box-sizing: border-box !important;
}
/* WS12.311 — .pwc-section is NOT full-bleed: parent .pwc is a flex column
with align-items:center + padding, so 100vw children break the layout.
Keep .pwc-section at its native 720px max-width centered, but render
the texture as the section's own background so the visual rhythm
stays banded between sections. */
.pwc-section.gw-bg {
width: 100% !important;
max-width: 720px !important;
margin-left: auto !important;
margin-right: auto !important;
border-radius: 18px !important;
}