/* BluetechGreen - Shared Stylesheet */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
--bg:#FAFAF8;--bgw:#F5F3EE;--bgc:#FFFFFF;
--tp:#1A1A1A;--ts:#4A4A4A;--tm:#7A7A7A;
--ac:#0B6E4F;--al:#E8F5EF;--ah:#094D38;
--bl:#1B4965;--bll:#E8EEF4;
--bd:#E5E2DB;--bdl:#EDEAE4;
--ssm:0 1px 3px rgba(0,0,0,.04),0 1px 2px rgba(0,0,0,.06);
--smd:0 4px 16px rgba(0,0,0,.06),0 2px 4px rgba(0,0,0,.04);
--slg:0 12px 40px rgba(0,0,0,.08),0 4px 12px rgba(0,0,0,.04);
--r:12px;--rs:8px;--rl:20px;
--f:'Inter',-apple-system,sans-serif;
--fd:'Instrument Serif',Georgia,serif;
--nh:72px;--mw:1200px;
--t:.3s cubic-bezier(.25,.46,.45,.94)
}
svg{max-width:100%;height:auto}
html{scroll-behavior:smooth}
body{font-family:var(--f);background:var(--bg);color:var(--tp);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}a{text-decoration:none;color:inherit}button{cursor:pointer;border:none;background:none;font-family:inherit}

/* NAV */
.nav{position:fixed;top:0;left:0;right:0;height:var(--nh);background:rgba(250,250,248,.85);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--bdl);z-index:1000;transition:var(--t)}
.nav.scrolled{background:rgba(250,250,248,.95);box-shadow:var(--ssm)}
.nav-i{max-width:var(--mw);margin:0 auto;padding:0 2rem;height:100%;display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:.5rem;font-weight:700;font-size:1.15rem;letter-spacing:-.02em}
.logo-m{width:32px;height:32px;background:linear-gradient(135deg,var(--ac),var(--bl));border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:.8rem}
.logo .g{color:var(--ac)}
.n-links{display:flex;align-items:center;gap:0;list-style:none}
.n-item{position:relative}
.n-link{display:flex;align-items:center;gap:4px;padding:.5rem 1rem;font-size:.9rem;font-weight:500;color:var(--ts);transition:color var(--t);cursor:pointer}
.n-link:hover{color:var(--tp)}
.n-link svg{width:12px;height:12px;transition:transform var(--t)}
.n-item:hover .n-link svg{transform:rotate(180deg)}
.n-dd{position:absolute;top:100%;left:50%;transform:translateX(-50%);min-width:300px;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--r);box-shadow:var(--slg);padding:.5rem;opacity:0;visibility:hidden;transition:all .25s ease;pointer-events:none}
.n-item:hover .n-dd{opacity:1;visibility:visible;pointer-events:auto}
.dd-link{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem 1rem;border-radius:var(--rs);transition:background var(--t)}
.dd-link:hover{background:var(--bgw)}
.dd-ic{width:36px;height:36px;flex-shrink:0;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1rem}
.dd-ic.gr{background:var(--al)}.dd-ic.bl{background:var(--bll)}
.dd-t h4{font-size:.875rem;font-weight:600;margin-bottom:2px}
.dd-t p{font-size:.78rem;color:var(--tm);line-height:1.4}
.n-cta{padding:.55rem 1.25rem;background:transparent;border:1.5px solid var(--ac);color:var(--ac);font-size:.875rem;font-weight:600;border-radius:100px;transition:all var(--t);margin-left:.5rem;white-space:nowrap;min-width:fit-content}
.n-cta:hover{background:var(--ac);color:#fff;transform:translateY(-1px);box-shadow:0 4px 12px rgba(11,110,79,.25)}
.n-ph{display:flex;align-items:center;gap:.4rem;padding:.5rem .75rem;font-size:.85rem;font-weight:600;color:var(--ac)}
.n-ph svg{width:14px;height:14px}
.n-tog{display:none;flex-direction:column;gap:5px;padding:4px}
.n-tog span{width:22px;height:2px;background:var(--tp);border-radius:2px;transition:var(--t)}

/* HERO */
.hero{padding:calc(var(--nh) + 5rem) 2rem 5rem;max-width:var(--mw);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;min-height:90vh;position:relative}
.hero-bg{position:fixed;top:0;left:0;width:100%;height:100vh;pointer-events:none;z-index:-1;overflow:hidden}
.hero-net{width:100%;height:100%;opacity:.6}
.hero-bg::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 30% 40%,rgba(11,110,79,.04) 0%,transparent 60%),radial-gradient(ellipse at 70% 60%,rgba(27,73,101,.03) 0%,transparent 50%)}
@keyframes nodePulse{0%,100%{opacity:.3;r:3}50%{opacity:.6;r:4.5}}
.hero-net .node{animation:nodePulse 4s ease-in-out infinite}
.hero-net .n2{animation-delay:.5s}.hero-net .n3{animation-delay:1s}.hero-net .n4{animation-delay:1.5s}
.hero-net .n5{animation-delay:2s}.hero-net .n6{animation-delay:.8s}.hero-net .n7{animation-delay:1.3s}
.hero-net .n8{animation-delay:1.8s}.hero-net .n9{animation-delay:2.3s}.hero-net .n10{animation-delay:.3s}
.hero-net .n11{animation-delay:1.6s}.hero-net .n12{animation-delay:2.1s}
@keyframes edgePulse{0%,100%{opacity:.1}50%{opacity:.2}}
.hero-net .edge{animation:edgePulse 5s ease-in-out infinite}
.hero-trusted{margin-top:2rem;display:flex;flex-direction:column;gap:.5rem}
.hero-trusted-label{font-size:.8rem;color:var(--tm);font-weight:500}
.hero-trusted-tags{display:flex;gap:.5rem;flex-wrap:wrap}
.trusted-tag{padding:.25rem .7rem;background:var(--bgw);border:1px solid var(--bdl);border-radius:100px;font-size:.72rem;font-weight:600;color:var(--ts);letter-spacing:.02em}
.hero-c{animation:fu .8s ease forwards}
.hero-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem 1rem;background:var(--al);color:var(--ac);font-size:.8rem;font-weight:600;border-radius:100px;margin-bottom:1.5rem;letter-spacing:.02em}
.hero-badge .pulse{width:6px;height:6px;background:var(--ac);border-radius:50%;animation:pls 2s ease infinite}
.hero h1{font-family:var(--fd);font-size:clamp(2.5rem,5vw,3.75rem);line-height:1.1;margin-bottom:1.25rem;letter-spacing:-.02em;font-weight:800}
.hero h1 em{font-style:italic;color:var(--ac)}
.hero-sub{font-size:1.1rem;color:var(--ts);line-height:1.7;margin-bottom:2rem;max-width:520px}
.hero-act{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
.btn-p{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 2rem;background:var(--ac);color:#fff;font-size:.95rem;font-weight:600;border-radius:100px;transition:all var(--t)}
.btn-p:hover{background:var(--ah);transform:translateY(-2px);box-shadow:0 8px 24px rgba(11,110,79,.2)}
.btn-p svg{width:18px;height:18px}
.btn-s{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 2rem;background:transparent;font-size:.95rem;font-weight:600;border-radius:100px;border:1.5px solid var(--bd);transition:all var(--t)}
.btn-s:hover{border-color:var(--tp);transform:translateY(-2px)}
.hero-v{position:relative;animation:fu .8s ease .2s both}
.h-card{background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rl);padding:2rem;box-shadow:var(--slg);position:relative;overflow:hidden}
.h-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--ac),var(--bl))}
.h-card-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}
.h-card-h h3{font-size:.95rem;font-weight:600}
.s-badge{display:flex;align-items:center;gap:6px;padding:.3rem .75rem;background:#ECFDF5;color:#059669;font-size:.75rem;font-weight:600;border-radius:100px}
.s-dot{width:6px;height:6px;background:#059669;border-radius:50%;animation:pls 2s ease infinite}
.h-pillars{list-style:none;display:flex;flex-direction:column;gap:0}
.h-pillar{padding:0;border-bottom:1px solid var(--bdl)}
.h-pillar:last-child{border-bottom:none}
.h-pillar-ic{width:36px;height:36px;flex-shrink:0;border-radius:8px;display:flex;align-items:center;justify-content:center}
.h-pillar-ic.gr{background:var(--al);color:var(--ac)}
.h-pillar-ic.bl{background:var(--bll);color:var(--bl)}
.h-pillar-ic svg{width:18px;height:18px}
.h-pillar div{display:flex;flex-direction:column;gap:2px}
.h-pillar strong{font-size:.875rem;font-weight:600;color:var(--tp)}
.h-pillar span{font-size:.78rem;color:var(--tm);line-height:1.4}
.h-pillar-link{display:flex;align-items:flex-start;gap:.85rem;width:100%;padding:.85rem 0;transition:all var(--t)}
.h-pillar:hover{background:var(--bgw);border-radius:var(--rs)}
.h-pillar-footer{margin-top:1rem;padding-top:.85rem;border-top:1px solid var(--bdl);font-size:.78rem;font-weight:600;color:var(--ac);text-align:center;letter-spacing:.01em}

/* STATS */
.stats{padding:3rem 2rem;max-width:var(--mw);margin:0 auto}
.stats-i{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;padding:2.5rem;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rl);box-shadow:var(--ssm)}
.stat{text-align:center}
.stat-n{font-family:var(--fd);font-size:clamp(2rem,3.5vw,2.75rem);color:var(--ac);line-height:1;margin-bottom:.35rem}
.stat-l{font-size:.8rem;color:var(--tm);font-weight:500;line-height:1.4}

/* TRUST */
.trust{padding:1rem 2rem 3rem;max-width:var(--mw);margin:0 auto}
.trust-i{display:flex;align-items:center;justify-content:center;gap:3rem;flex-wrap:wrap;padding:1.5rem 2rem;border-top:1px solid var(--bdl);border-bottom:1px solid var(--bdl)}
.t-item{display:flex;align-items:center;gap:.6rem;font-size:.85rem;color:var(--tm);font-weight:500}
.t-ic{width:32px;height:32px;background:var(--bgw);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:.9rem}

/* INDUSTRY BAR */
.industry-bar{padding:1.5rem 2rem;text-align:center}
.industry-label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--tm);display:block;margin-bottom:1rem}
.industry-track{overflow:hidden;mask-image:linear-gradient(to right,transparent,#000 10%,#000 90%,transparent)}
.industry-scroll{display:flex;gap:2.5rem;justify-content:center;flex-wrap:wrap}
.ind-item{display:flex;align-items:center;gap:.5rem;font-size:.82rem;font-weight:500;color:var(--ts);white-space:nowrap}
.ind-item svg{flex-shrink:0}

/* AUTHOR BIO */
.author-bio{display:flex;gap:1.5rem;align-items:flex-start;padding:2rem;background:rgba(255,255,255,.06);border:1px solid var(--bd);border-radius:var(--rl);margin:3rem 0}
.author-bio .ab-avatar{width:64px;height:64px;border-radius:50%;background:var(--ac);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-size:1.5rem;font-weight:700;flex-shrink:0}
.author-bio .ab-info h4{margin:0 0 .5rem;font-family:var(--fd);color:var(--al)}
.author-bio .ab-info p{margin:0;font-size:.9rem;color:var(--ts);line-height:1.6}
.author-bio .ab-info a{color:var(--ac);text-decoration:none}
.author-bio .ab-info a:hover{text-decoration:underline}
@media(max-width:768px){.author-bio{flex-direction:column;align-items:center;text-align:center}

.industry-scroll{flex-wrap:nowrap;justify-content:flex-start;animation:marquee 20s linear infinite;width:max-content}
.industry-scroll .ind-item{flex-shrink:0}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
}

/* SECTIONS */
.sec{padding:5rem 2rem;max-width:var(--mw);margin:0 auto}
.sec:nth-child(even){background:linear-gradient(180deg,rgba(245,243,238,.5) 0%,rgba(250,250,248,.3) 100%);border-radius:var(--rl);margin-top:1rem;margin-bottom:1rem}
.sec-h{text-align:center;margin-bottom:3.5rem}
.sec-l{display:inline-block;font-size:.78rem;font-weight:700;color:var(--ac);text-transform:uppercase;letter-spacing:.15em;margin-bottom:.75rem}
.sec-t{font-family:var(--fd);font-size:clamp(2rem,4vw,2.75rem);font-weight:700;line-height:1.15;margin-bottom:1rem;letter-spacing:-.01em}
.sec-t em{font-style:italic;color:var(--ac)}
.sec-d{font-size:1.05rem;color:var(--ts);max-width:600px;margin:0 auto;line-height:1.7}

/* FEATURE SPOTLIGHT */
.spotlight{background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rl);margin:0 2rem;padding:4rem 3rem;position:relative;overflow:hidden}
.spotlight::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--ac),var(--bl))}
.spot-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;max-width:var(--mw);margin:0 auto}
.spot-content .sec-l,.spot-content .sec-t{text-align:left}
.spot-content .sec-d{margin:0;text-align:left}
.spot-content .sec-t{margin-bottom:.75rem}
.spot-text{font-size:.95rem;color:var(--ts);line-height:1.7;margin:1.5rem 0}
.spot-features{list-style:none;display:flex;flex-direction:column;gap:.75rem;margin-bottom:2rem}
.spot-features li{display:flex;align-items:flex-start;gap:.6rem;font-size:.9rem;color:var(--ts);line-height:1.5}
.spot-features li .ic{width:22px;height:22px;flex-shrink:0;background:var(--al);border-radius:50%;display:flex;align-items:center;justify-content:center;margin-top:1px}
.spot-features li .ic svg{width:12px;height:12px;color:var(--ac)}
.spot-visual{position:relative}
.spot-flow{display:flex;align-items:center;justify-content:center;gap:.25rem;margin-bottom:1.5rem;padding:1.25rem .75rem;background:var(--bgw);border:1px solid var(--bdl);border-radius:var(--r);overflow-x:auto}
.flow-step{display:flex;flex-direction:column;align-items:center;gap:.35rem;opacity:0;transform:translateY(10px);transition:all .5s ease}
.flow-step span{font-size:.7rem;font-weight:600;color:var(--ts)}
.flow-arrow{opacity:0;transform:scaleX(0);transform-origin:left;transition:all .4s ease}
.spot-flow.visible .flow-step,.spot-flow.visible .flow-arrow{opacity:1;transform:translateY(0)}
.spot-flow.visible .flow-arrow{transform:scaleX(1)}
.spot-flow.visible .fs-1{transition-delay:.1s}.spot-flow.visible .fa-1{transition-delay:.3s}
.spot-flow.visible .fs-2{transition-delay:.5s}.spot-flow.visible .fa-2{transition-delay:.7s}
.spot-flow.visible .fs-3{transition-delay:.9s}.spot-flow.visible .fa-3{transition-delay:1.1s}
.spot-flow.visible .fs-4{transition-delay:1.3s}.spot-flow.visible .fa-4{transition-delay:1.5s}
.spot-flow.visible .fs-5{transition-delay:1.7s}
.flow-done span{color:var(--ac);font-weight:700}
.spot-card{background:var(--bgw);border:1px solid var(--bdl);border-radius:var(--rl);padding:2rem;position:relative}
.spot-step{display:flex;align-items:flex-start;gap:1rem;padding:1rem;border-bottom:1px solid var(--bdl);background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(255,255,255,.6));border-radius:var(--rs);margin-bottom:.5rem;border:1px solid rgba(255,255,255,.4);box-shadow:0 4px 16px rgba(0,0,0,.03),inset 0 1px 0 rgba(255,255,255,.8);transition:all var(--t)}
.spot-step:last-child{border-bottom:none}
.spot-num{width:32px;height:32px;flex-shrink:0;background:var(--ac);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700}
.spot-step h4{font-size:.9rem;font-weight:600;margin-bottom:3px}
.spot-step p{font-size:.82rem;color:var(--tm);line-height:1.5}

/* SERVICES */
.s-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}
.s-card{background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(255,255,255,.6));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.4);border-radius:var(--rl);padding:2rem;transition:all var(--t);position:relative;overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.8)}
.s-card::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none;z-index:0}
.s-card:hover{border-color:rgba(11,110,79,.3);box-shadow:0 12px 40px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.8),0 0 0 1px rgba(11,110,79,.15);transform:translateY(-4px);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.s-card::after{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--ac);transform:scaleX(0);transform-origin:left;transition:transform .4s ease}
.s-card:hover::after{transform:scaleX(1)}
.s-ic{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;margin-bottom:1.25rem}
.s-ic.gr{background:var(--al)}.s-ic.bl{background:var(--bll)}
.s-card h3{font-size:1.1rem;font-weight:700;margin-bottom:.6rem}
.s-card p{font-size:.9rem;color:var(--ts);line-height:1.65;margin-bottom:1.25rem}
.s-card.s-featured{grid-column:span 1;border:2px solid rgba(255,255,255,.5);padding:2.25rem}
.s-benefits{list-style:none;display:flex;flex-direction:column;gap:.35rem;margin-bottom:1.25rem}
.s-benefits li{font-size:.82rem;color:var(--ts);padding-left:1.1rem;position:relative}
.s-benefits li::before{content:'';position:absolute;left:0;top:.45em;width:6px;height:6px;background:var(--ac);border-radius:50%}
.s-card.s-featured:hover{border-color:var(--ac)}
@media(min-width:769px){.s-grid{grid-template-columns:repeat(2,1fr)}.s-card.s-featured{padding:2.5rem}}
.s-link{display:inline-flex;align-items:center;gap:.4rem;font-size:.85rem;font-weight:600;color:var(--ac);transition:gap var(--t)}
.s-link:hover{gap:.7rem}
.s-link svg{width:14px;height:14px}
a.s-card{display:block;color:inherit}

/* BEFORE/AFTER */
.ba-sec{padding:5rem 2rem;max-width:var(--mw);margin:0 auto}
.ba-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.ba-card{border-radius:var(--rl);padding:2rem;border:1px solid var(--bd);transition:all .6s ease}
.ba-before{background:#FFFBFB;border-color:#FED7D7}
.ba-after{background:#F0FDF9;border-color:#A7F3D0}
.ba-header{display:flex;align-items:center;gap:.6rem;margin-bottom:1.5rem}
.ba-header h3{font-size:1rem;font-weight:700}
.ba-h-before h3{color:#991B1B}.ba-h-after h3{color:#065F46}
.ba-list{list-style:none;display:flex;flex-direction:column;gap:.65rem}
.ba-item{display:flex;align-items:flex-start;gap:.6rem;font-size:.875rem;line-height:1.55}
.ba-item svg{flex-shrink:0;margin-top:2px}
.ba-bad{color:#7F1D1D}.ba-good{color:#065F46}
.ba-sec.visible .ba-before{animation:slideInLeft .6s ease forwards}
.ba-sec.visible .ba-after{animation:slideInRight .6s .3s ease both}
@keyframes slideInLeft{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}
@keyframes slideInRight{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}
@media(max-width:768px){.ba-grid{grid-template-columns:1fr}}

/* WHY */
.why{background:var(--bgw);border-radius:var(--rl);margin:0 2rem;padding:4rem 3rem}
.why .sec-h{margin-bottom:3rem}
.w-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;max-width:var(--mw);margin:0 auto}
.w-item{text-align:center;padding:1.5rem}
.w-num{font-family:var(--fd);font-size:3rem;color:var(--ac);line-height:1;margin-bottom:.75rem}
.w-item h4{font-size:1rem;font-weight:700;margin-bottom:.5rem}
.w-item p{font-size:.875rem;color:var(--ts);line-height:1.6}

/* PROCESS */
.p-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;counter-reset:step}
.p-timeline{grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;gap:0;align-items:start}
.p-connector{display:flex;align-items:center;padding-top:3.5rem;padding-left:.25rem;padding-right:.25rem}
.p-connector svg{width:100%;min-width:24px}
.p-step{position:relative;padding:2rem 1.5rem;text-align:center;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rl);transition:all var(--t)}
.p-step:hover{box-shadow:var(--smd);transform:translateY(-2px)}
.p-step::before{counter-increment:step;content:counter(step);display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:var(--ac);color:#fff;font-weight:700;border-radius:50%;margin:0 auto 1rem}
.p-icon{display:flex;justify-content:center;margin-bottom:.5rem;color:var(--ac)}
.p-reveal{opacity:0;transform:translateY(20px);transition:all .6s ease}
.visible .p-reveal{opacity:1;transform:translateY(0);transition-delay:var(--delay)}
.p-step h4{font-size:1rem;font-weight:700;margin-bottom:.5rem}
.p-step p{font-size:.85rem;color:var(--ts);line-height:1.6}


/* CTA */
.cta{background:linear-gradient(135deg,var(--bl) 0%,var(--ac) 100%);border-radius:var(--rl);margin:2rem 2rem 0;padding:4rem 3rem;text-align:center;color:#fff;position:relative;overflow:hidden}
.cta::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 30% 50%,rgba(255,255,255,.08) 0%,transparent 60%)}
.cta-shapes{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.cta-shape{position:absolute;border:1px solid rgba(255,255,255,.08);border-radius:50%}
.cta-shape.sh-1{width:300px;height:300px;top:-80px;right:-60px;animation:floatShape 8s ease-in-out infinite}
.cta-shape.sh-2{width:200px;height:200px;bottom:-40px;left:-30px;animation:floatShape 10s ease-in-out infinite reverse}
.cta-shape.sh-3{width:150px;height:150px;top:50%;left:60%;border-radius:30%;animation:floatShape 12s ease-in-out infinite;transform:rotate(45deg)}
@keyframes floatShape{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-15px) rotate(3deg)}}
.form-trust{display:flex;align-items:center;gap:.4rem;font-size:.78rem;color:rgba(255,255,255,.6);margin-top:.5rem;justify-content:center}
.cta .sec-l{color:rgba(255,255,255,.7)}
.cta .sec-t{color:#fff}.cta .sec-t em{color:rgba(255,255,255,.85)}
.cta .sec-d{color:rgba(255,255,255,.8)}
.cta-acts{display:flex;justify-content:center;gap:1rem;margin-top:2rem;position:relative;z-index:1;flex-wrap:wrap}
.btn-w{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 2rem;background:#fff;color:var(--bl);font-size:.95rem;font-weight:600;border-radius:100px;transition:all var(--t)}
.btn-w:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.2)}
.btn-ow{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 2rem;border:1.5px solid rgba(255,255,255,.4);color:#fff;font-size:.95rem;font-weight:600;border-radius:100px;transition:all var(--t)}
.btn-ow:hover{border-color:#fff;background:rgba(255,255,255,.1)}
.cta-info{margin-top:2rem;display:flex;justify-content:center;gap:2.5rem;flex-wrap:wrap;position:relative;z-index:1}
.cta-it{display:flex;align-items:center;gap:.5rem;color:rgba(255,255,255,.9);font-size:.9rem;font-weight:500}
.cta-it a{color:rgba(255,255,255,.9);transition:color var(--t)}.cta-it a:hover{color:#fff}
.cta-it svg{width:16px;height:16px;opacity:.8}

/* CONTACT FORM */
.cta-form-wrap{display:grid;grid-template-columns:1fr 1fr;gap:3rem;max-width:900px;margin:2rem auto 0;position:relative;z-index:1;text-align:left}
.cta-form{display:flex;flex-direction:column;gap:.85rem}
.cta-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:.85rem}
.cta-form label{font-size:.78rem;font-weight:600;color:rgba(255,255,255,.7);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.2rem;display:block}
.cta-form input,.cta-form textarea{width:100%;padding:.75rem 1rem;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:var(--rs);color:#fff;font-family:var(--f);font-size:.9rem;transition:all var(--t)}
.cta-form input::placeholder,.cta-form textarea::placeholder{color:rgba(255,255,255,.45)}
.cta-form input:focus,.cta-form textarea:focus{outline:none;border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.18)}
.cta-form textarea{min-height:100px;resize:vertical}
.cta-form .btn-w{width:100%;justify-content:center;margin-top:.25rem}
.cta-sidebar{display:flex;flex-direction:column;gap:1.5rem;justify-content:center}
.cta-sidebar-item{display:flex;align-items:flex-start;gap:.75rem}
.cta-sidebar-item svg{width:20px;height:20px;flex-shrink:0;opacity:.7;margin-top:2px}
.cta-sidebar-item strong{display:block;font-size:.85rem;color:#fff;margin-bottom:2px}
.cta-sidebar-item span,.cta-sidebar-item a{font-size:.85rem;color:rgba(255,255,255,.75);line-height:1.5}
.cta-sidebar-item a:hover{color:#fff}
.form-success{background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.3);border-radius:var(--r);padding:1.5rem 2rem;text-align:center;margin:2rem auto 0;max-width:500px;position:relative;z-index:1}
.form-success h3{font-size:1.1rem;margin-bottom:.5rem}
.form-success p{font-size:.9rem;color:rgba(255,255,255,.8)}
.form-error{background:rgba(255,80,80,.2);border:1px solid rgba(255,80,80,.4);border-radius:var(--r);padding:1rem 1.5rem;text-align:center;margin:1rem auto 0;max-width:500px;position:relative;z-index:1;font-size:.9rem}
@media(max-width:768px){
.cta-form-wrap{grid-template-columns:1fr}
.cta-form .form-row{grid-template-columns:1fr}
}

/* FOOTER */
.footer{max-width:var(--mw);margin:0 auto;padding:4rem 2rem 2rem}
.f-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.3fr;gap:3rem;padding-bottom:2.5rem;border-bottom:1px solid var(--bdl)}
.f-brand p{font-size:.875rem;color:var(--ts);line-height:1.7;margin-top:1rem;max-width:300px}
.f-col h4{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--tm);margin-bottom:1rem}
.f-col ul{list-style:none;display:flex;flex-direction:column;gap:.6rem}
.f-col ul li a{font-size:.875rem;color:var(--ts);transition:color var(--t)}
.f-col ul li a:hover{color:var(--ac)}
.f-ci{display:flex;align-items:center;gap:.5rem;font-size:.875rem;color:var(--ts);margin-bottom:.75rem}
.f-ci svg{width:14px;height:14px;color:var(--ac);flex-shrink:0}
.f-ci a{color:var(--ts);transition:color var(--t)}.f-ci a:hover{color:var(--ac)}
.f-bot{display:flex;justify-content:space-between;align-items:center;padding-top:2rem}
.f-bot p{font-size:.8rem;color:var(--tm)}
.f-soc{display:flex;gap:1rem}
.f-soc a{width:36px;height:36px;border:1px solid var(--bd);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--tm);transition:all var(--t)}
.f-soc a:hover{border-color:var(--ac);color:var(--ac);background:var(--al)}
.f-soc a svg{width:16px;height:16px}

/* ANIMATIONS */
@keyframes fu{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes pls{0%,100%{opacity:1}50%{opacity:.4}}
.reveal{opacity:0;transform:translateY(30px);transition:all .7s cubic-bezier(.25,.46,.45,.94)}
.reveal.visible{opacity:1;transform:translateY(0)}

/* ============================================
   TOOLS PAGE STYLES
   ============================================ */

/* Tools Hero */
.tools-hero{padding:calc(var(--nh) + 4rem) 2rem 4rem;max-width:var(--mw);margin:0 auto;text-align:center}
.tools-hero h1{font-family:var(--fd);font-size:clamp(2.5rem,5vw,3.5rem);line-height:1.1;margin-bottom:1.25rem;letter-spacing:-.02em;font-weight:800}
.tools-hero h1 em{font-style:italic;color:var(--ac)}
.tools-hero .hero-sub{max-width:700px;margin:0 auto 2rem}

/* Product Cards */
.product-sec{padding:4rem 2rem;max-width:var(--mw);margin:0 auto}
.product-sec:nth-child(even) .prod-grid{direction:rtl}
.product-sec:nth-child(even) .prod-grid>*{direction:ltr}
.prod-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.prod-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem 1rem;font-size:.78rem;font-weight:700;border-radius:100px;margin-bottom:1.25rem;letter-spacing:.02em;text-transform:uppercase}
.prod-badge.green{background:var(--al);color:var(--ac)}
.prod-badge.blue{background:var(--bll);color:var(--bl)}
.prod-content h2{font-family:var(--fd);font-size:clamp(1.8rem,3.5vw,2.5rem);font-weight:700;line-height:1.15;margin-bottom:1rem;letter-spacing:-.01em}
.prod-content h2 em{font-style:italic;color:var(--ac)}
.prod-quote{font-size:1rem;color:var(--ts);line-height:1.7;margin-bottom:1.5rem;padding-left:1.25rem;border-left:3px solid var(--ac);font-style:italic}
.prod-desc{font-size:.95rem;color:var(--ts);line-height:1.7;margin-bottom:1.5rem}
.prod-features{list-style:none;display:flex;flex-direction:column;gap:.6rem;margin-bottom:2rem}
.prod-features li{display:flex;align-items:flex-start;gap:.6rem;font-size:.9rem;color:var(--ts);line-height:1.5}
.prod-features li .ic{width:22px;height:22px;flex-shrink:0;background:var(--al);border-radius:50%;display:flex;align-items:center;justify-content:center;margin-top:1px}
.prod-features li .ic svg{width:12px;height:12px;color:var(--ac)}
.prod-features li .ic.bl{background:var(--bll)}
.prod-features li .ic.bl svg{color:var(--bl)}

/* Product Visual / How It Works */
.prod-visual{position:relative}
.prod-how{background:var(--bgw);border:1px solid var(--bdl);border-radius:var(--rl);padding:2rem;position:relative}
.prod-how h3{font-size:1rem;font-weight:700;margin-bottom:1.25rem;color:var(--tp)}
.hw-step{display:flex;align-items:flex-start;gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--bdl)}
.hw-step:last-child{border-bottom:none}
.hw-num{width:28px;height:28px;flex-shrink:0;background:var(--ac);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700}
.hw-num.bl{background:var(--bl)}
.hw-step h4{font-size:.875rem;font-weight:600;margin-bottom:2px}
.hw-step p{font-size:.8rem;color:var(--tm);line-height:1.5}

/* Before/After Comparison */
.compare-sec{padding:4rem 2rem;max-width:var(--mw);margin:0 auto}
.compare-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:1.5rem}
.compare-card{background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rl);overflow:hidden;transition:all var(--t)}
.compare-card:hover{box-shadow:var(--smd);transform:translateY(-2px)}
.compare-card h3{font-size:1rem;font-weight:700;padding:1.5rem 1.5rem .75rem;display:flex;align-items:center;gap:.5rem}
.compare-row{display:grid;grid-template-columns:1fr 1fr;font-size:.85rem}
.compare-head{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:.6rem 1rem}
.compare-head.before{background:#FEF2F2;color:#991B1B}
.compare-head.after{background:#ECFDF5;color:#065F46}
.compare-cell{padding:.6rem 1rem;border-top:1px solid var(--bdl)}
.compare-cell.before{background:#FFFBFB;color:var(--ts)}
.compare-cell.after{background:#F0FDF9;color:var(--tp);font-weight:500}

/* Product Divider */
.prod-divider{max-width:var(--mw);margin:0 auto;padding:0 2rem}
.prod-divider hr{border:none;border-top:1px solid var(--bdl)}

/* ============================================
   DEMO PANEL ANIMATIONS (Tools Page)
   ============================================ */

/* Shared: macOS window chrome */
.demo-panel{margin-bottom:1.5rem;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--r);overflow:hidden;box-shadow:var(--smd)}
.demo-chrome{display:flex;align-items:center;gap:6px;padding:10px 14px;background:var(--bgw);border-bottom:1px solid var(--bdl)}
.demo-dot{width:10px;height:10px;border-radius:50%}
.demo-dot.r{background:#FF5F57}.demo-dot.y{background:#FEBC2E}.demo-dot.g{background:#28C840}
.demo-title{margin-left:8px;font-size:.72rem;font-weight:600;color:var(--tm);letter-spacing:.02em}
.demo-body{padding:1rem;font-size:.78rem;min-height:180px;position:relative;overflow:hidden}

/* ---- IntuneGuard Demo ---- */
.ig-row{display:flex;align-items:center;justify-content:space-between;padding:6px 10px;border-radius:6px;margin-bottom:4px;transition:background-color 1s ease}
.ig-row:last-child{margin-bottom:0}
.ig-app{font-weight:600;color:var(--tp);display:flex;align-items:center;gap:6px}
.ig-app svg{width:14px;height:14px;color:var(--tm)}
.ig-status{font-size:.7rem;font-weight:600;padding:2px 10px;border-radius:100px;white-space:nowrap}
.ig-status.pass{background:#ECFDF5;color:#059669}
.ig-status.fail{background:#FEF2F2;color:#DC2626}
.ig-status.scan{background:#FEF9C3;color:#A16207}
.ig-status.fixed{background:#ECFDF5;color:#059669}
.ig-row.problem{background:rgba(220,38,38,.06)}

/* IntuneGuard keyframes — 12s loop */
/* 0-25%: red error | 25-45%: scanning | 45-65%: mismatch | 65-100%: fixed (green) */
@keyframes igStatus{
  0%,24.9%{opacity:1}25%{opacity:0}
}
@keyframes igStatusScan{
  0%,24.9%{opacity:0}25%,44.9%{opacity:1}45%{opacity:0}
}
@keyframes igStatusMismatch{
  0%,44.9%{opacity:0}45%,64.9%{opacity:1}65%{opacity:0}
}
@keyframes igStatusFixed{
  0%,64.9%{opacity:0}65%,100%{opacity:1}
}
@keyframes igRowBg{
  0%,24.9%{background-color:rgba(220,38,38,.06)}
  65%,100%{background-color:rgba(5,150,105,.06)}
}
.ig-problem-wrap{position:relative}
.ig-problem-wrap .ig-status{position:absolute;right:10px;top:50%;transform:translateY(-50%)}
.product-sec.visible .ig-problem-wrap .ig-s-fail{animation:igStatus 12s infinite}
.product-sec.visible .ig-problem-wrap .ig-s-scan{animation:igStatusScan 12s infinite}
.product-sec.visible .ig-problem-wrap .ig-s-mismatch{animation:igStatusMismatch 12s infinite}
.product-sec.visible .ig-problem-wrap .ig-s-fixed{animation:igStatusFixed 12s infinite}
.product-sec.visible .ig-problem-wrap .ig-row.problem{animation:igRowBg 12s infinite}

/* ---- LogLens Demo ---- */
.ll-tabs{display:flex;gap:4px;margin-bottom:10px;flex-wrap:wrap}
.ll-tab{padding:3px 10px;border-radius:100px;font-size:.68rem;font-weight:600;background:var(--bgw);border:1px solid var(--bdl);color:var(--tm);opacity:0;transform:translateY(6px)}
.ll-lines{display:flex;flex-direction:column;gap:3px;margin-bottom:10px}
.ll-line{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:4px;font-family:'Inter',monospace;font-size:.7rem;color:var(--ts);opacity:0;transform:translateX(-10px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ll-line .ll-src{font-weight:600;color:var(--tm);flex-shrink:0;min-width:60px}
.ll-line.error{background:#FEF2F2;color:#DC2626;font-weight:600}
.ll-summary{background:var(--al);border:1px solid rgba(11,110,79,.15);border-radius:var(--rs);padding:10px 12px;opacity:0;transform:translateY(10px)}
.ll-summary-label{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--ac);margin-bottom:3px}
.ll-summary-text{font-size:.78rem;font-weight:600;color:var(--tp);line-height:1.4}

/* LogLens keyframes — 12s loop */
/* Tabs: 0-8% each, Lines: 33-58%, Error highlight: 58%, Summary: 67-100% */
@keyframes llTabIn{
  0%,4%{opacity:0;transform:translateY(6px)}
  8%,100%{opacity:1;transform:translateY(0)}
}
@keyframes llTab2{0%,8%{opacity:0;transform:translateY(6px)}14%,100%{opacity:1;transform:translateY(0)}}
@keyframes llTab3{0%,14%{opacity:0;transform:translateY(6px)}20%,100%{opacity:1;transform:translateY(0)}}
@keyframes llTab4{0%,20%{opacity:0;transform:translateY(6px)}26%,100%{opacity:1;transform:translateY(0)}}
@keyframes llLineIn1{0%,30%{opacity:0;transform:translateX(-10px)}36%,100%{opacity:1;transform:translateX(0)}}
@keyframes llLineIn2{0%,36%{opacity:0;transform:translateX(-10px)}42%,100%{opacity:1;transform:translateX(0)}}
@keyframes llLineIn3{0%,42%{opacity:0;transform:translateX(-10px)}48%,100%{opacity:1;transform:translateX(0)}}
@keyframes llLineIn4{0%,48%{opacity:0;transform:translateX(-10px)}54%,100%{opacity:1;transform:translateX(0)}}
@keyframes llErrorHighlight{0%,56%{background-color:transparent}60%,100%{background-color:#FEF2F2}}
@keyframes llSummaryIn{0%,67%{opacity:0;transform:translateY(10px)}75%,100%{opacity:1;transform:translateY(0)}}

.product-sec.visible .ll-tab:nth-child(1){animation:llTabIn 12s infinite}
.product-sec.visible .ll-tab:nth-child(2){animation:llTab2 12s infinite}
.product-sec.visible .ll-tab:nth-child(3){animation:llTab3 12s infinite}
.product-sec.visible .ll-tab:nth-child(4){animation:llTab4 12s infinite}
.product-sec.visible .ll-line:nth-child(1){animation:llLineIn1 12s infinite}
.product-sec.visible .ll-line:nth-child(2){animation:llLineIn2 12s infinite}
.product-sec.visible .ll-line:nth-child(3){animation:llLineIn3 12s infinite}
.product-sec.visible .ll-line:nth-child(4){animation:llLineIn4 12s infinite,llErrorHighlight 12s infinite}
.product-sec.visible .ll-summary{animation:llSummaryIn 12s infinite}

/* ---- EntraShift Demo ---- */
.es-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:10px}
.es-device{background:var(--bgw);border:1px solid var(--bdl);border-radius:6px;padding:8px;text-align:center;position:relative;min-height:54px}
.es-device-name{font-size:.68rem;font-weight:600;color:var(--tp);margin-bottom:4px;display:flex;align-items:center;justify-content:center;gap:4px}
.es-device-name svg{width:12px;height:12px;color:var(--tm)}
.es-badge-wrap{position:relative;height:18px}
.es-badge{position:absolute;left:50%;transform:translateX(-50%);font-size:.6rem;font-weight:700;padding:1px 8px;border-radius:100px;white-space:nowrap;transition:opacity .4s ease}
.es-badge.old{background:#FEF2F2;color:#991B1B}
.es-badge.new{background:#ECFDF5;color:#059669;opacity:0}
.es-check{position:absolute;top:4px;right:4px;width:14px;height:14px;background:#059669;border-radius:50%;display:flex;align-items:center;justify-content:center;opacity:0;transform:scale(0)}
.es-check svg{width:8px;height:8px;color:#fff}
.es-progress{height:6px;background:var(--bdl);border-radius:3px;overflow:hidden;margin-bottom:8px}
.es-progress-bar{height:100%;width:0;background:linear-gradient(90deg,var(--ac),var(--bl));border-radius:3px}
.es-status{text-align:center;font-size:.7rem;font-weight:600;color:var(--tm);opacity:0}

/* EntraShift keyframes — 12s loop */
@keyframes esProgress{0%,8%{width:0}83%,100%{width:100%}}
@keyframes esStatusIn{0%,10%{opacity:0}16%,100%{opacity:1}}
/* Device badge flips — staggered across 6 devices */
@keyframes esBadgeOld1{0%,16%{opacity:1}22%,100%{opacity:0}}
@keyframes esBadgeNew1{0%,20%{opacity:0}26%,100%{opacity:1}}
@keyframes esCheck1{0%,24%{opacity:0;transform:scale(0)}28%{opacity:1;transform:scale(1.15)}30%,100%{opacity:1;transform:scale(1)}}
@keyframes esBadgeOld2{0%,26%{opacity:1}32%,100%{opacity:0}}
@keyframes esBadgeNew2{0%,30%{opacity:0}36%,100%{opacity:1}}
@keyframes esCheck2{0%,34%{opacity:0;transform:scale(0)}38%{opacity:1;transform:scale(1.15)}40%,100%{opacity:1;transform:scale(1)}}
@keyframes esBadgeOld3{0%,36%{opacity:1}42%,100%{opacity:0}}
@keyframes esBadgeNew3{0%,40%{opacity:0}46%,100%{opacity:1}}
@keyframes esCheck3{0%,44%{opacity:0;transform:scale(0)}48%{opacity:1;transform:scale(1.15)}50%,100%{opacity:1;transform:scale(1)}}
@keyframes esBadgeOld4{0%,46%{opacity:1}52%,100%{opacity:0}}
@keyframes esBadgeNew4{0%,50%{opacity:0}56%,100%{opacity:1}}
@keyframes esCheck4{0%,54%{opacity:0;transform:scale(0)}58%{opacity:1;transform:scale(1.15)}60%,100%{opacity:1;transform:scale(1)}}
@keyframes esBadgeOld5{0%,56%{opacity:1}62%,100%{opacity:0}}
@keyframes esBadgeNew5{0%,60%{opacity:0}66%,100%{opacity:1}}
@keyframes esCheck5{0%,64%{opacity:0;transform:scale(0)}68%{opacity:1;transform:scale(1.15)}70%,100%{opacity:1;transform:scale(1)}}
@keyframes esBadgeOld6{0%,66%{opacity:1}72%,100%{opacity:0}}
@keyframes esBadgeNew6{0%,70%{opacity:0}76%,100%{opacity:1}}
@keyframes esCheck6{0%,74%{opacity:0;transform:scale(0)}78%{opacity:1;transform:scale(1.15)}80%,100%{opacity:1;transform:scale(1)}}

.product-sec.visible .es-progress-bar{animation:esProgress 12s infinite}
.product-sec.visible .es-status{animation:esStatusIn 12s infinite}
.product-sec.visible .es-device:nth-child(1) .es-badge.old{animation:esBadgeOld1 12s infinite}
.product-sec.visible .es-device:nth-child(1) .es-badge.new{animation:esBadgeNew1 12s infinite}
.product-sec.visible .es-device:nth-child(1) .es-check{animation:esCheck1 12s infinite}
.product-sec.visible .es-device:nth-child(2) .es-badge.old{animation:esBadgeOld2 12s infinite}
.product-sec.visible .es-device:nth-child(2) .es-badge.new{animation:esBadgeNew2 12s infinite}
.product-sec.visible .es-device:nth-child(2) .es-check{animation:esCheck2 12s infinite}
.product-sec.visible .es-device:nth-child(3) .es-badge.old{animation:esBadgeOld3 12s infinite}
.product-sec.visible .es-device:nth-child(3) .es-badge.new{animation:esBadgeNew3 12s infinite}
.product-sec.visible .es-device:nth-child(3) .es-check{animation:esCheck3 12s infinite}
.product-sec.visible .es-device:nth-child(4) .es-badge.old{animation:esBadgeOld4 12s infinite}
.product-sec.visible .es-device:nth-child(4) .es-badge.new{animation:esBadgeNew4 12s infinite}
.product-sec.visible .es-device:nth-child(4) .es-check{animation:esCheck4 12s infinite}
.product-sec.visible .es-device:nth-child(5) .es-badge.old{animation:esBadgeOld5 12s infinite}
.product-sec.visible .es-device:nth-child(5) .es-badge.new{animation:esBadgeNew5 12s infinite}
.product-sec.visible .es-device:nth-child(5) .es-check{animation:esCheck5 12s infinite}
.product-sec.visible .es-device:nth-child(6) .es-badge.old{animation:esBadgeOld6 12s infinite}
.product-sec.visible .es-device:nth-child(6) .es-badge.new{animation:esBadgeNew6 12s infinite}
.product-sec.visible .es-device:nth-child(6) .es-check{animation:esCheck6 12s infinite}

/* Reduced motion: show static completed state */
@media(prefers-reduced-motion:reduce){
  .ig-problem-wrap .ig-s-fail,.ig-problem-wrap .ig-s-scan,.ig-problem-wrap .ig-s-mismatch{display:none}
  .ig-problem-wrap .ig-s-fixed{opacity:1}
  .ig-row.problem{background:rgba(5,150,105,.06)}
  .ll-tab,.ll-line,.ll-summary{opacity:1;transform:none}
  .ll-line.error{background:#FEF2F2}
  .es-progress-bar{width:100%}
  .es-badge.old{opacity:0}.es-badge.new{opacity:1}
  .es-check{opacity:1;transform:scale(1)}
  .es-status{opacity:1}
  .product-sec.visible .ig-problem-wrap .ig-s-fail,
  .product-sec.visible .ig-problem-wrap .ig-s-scan,
  .product-sec.visible .ig-problem-wrap .ig-s-mismatch,
  .product-sec.visible .ig-problem-wrap .ig-s-fixed,
  .product-sec.visible .ig-problem-wrap .ig-row.problem,
  .product-sec.visible .ll-tab,
  .product-sec.visible .ll-line,
  .product-sec.visible .ll-summary,
  .product-sec.visible .es-progress-bar,
  .product-sec.visible .es-status,
  .product-sec.visible .es-device .es-badge.old,
  .product-sec.visible .es-device .es-badge.new,
  .product-sec.visible .es-device .es-check{animation:none}
}

/* Demo panel responsive */
@media(max-width:768px){
  .es-grid{grid-template-columns:repeat(2,1fr)}
  .demo-body{min-height:150px}
}
@media(max-width:480px){
  .es-grid{grid-template-columns:1fr 1fr}
  .ll-line{font-size:.65rem}
  .demo-body{padding:.75rem}
}

/* Featured Product Banner (for index.html) */
.feat-banner{background:linear-gradient(135deg,var(--ac) 0%,var(--bl) 100%);border-radius:var(--rl);margin:0 2rem;padding:3rem;position:relative;overflow:hidden}
.feat-banner::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 70% 30%,rgba(255,255,255,.1) 0%,transparent 60%)}
.feat-banner-i{max-width:var(--mw);margin:0 auto;display:grid;grid-template-columns:1fr auto;gap:3rem;align-items:center;position:relative;z-index:1}
.feat-banner .sec-l{color:rgba(255,255,255,.7)}
.feat-banner h2{font-family:var(--fd);font-size:clamp(1.5rem,3vw,2rem);font-weight:700;color:#fff;line-height:1.2;margin-bottom:.75rem}
.feat-banner h2 em{font-style:italic;color:rgba(255,255,255,.85)}
.feat-banner p{font-size:.95rem;color:rgba(255,255,255,.8);line-height:1.6;max-width:600px}
.feat-banner .btn-w{white-space:nowrap}

/* Active nav link */
.n-link.active{color:var(--ac);font-weight:600}

/* FAQ */
.faq-list{max-width:760px;margin:0 auto}
.faq-item{background:var(--bgc);border:1px solid var(--bd);border-radius:var(--r);margin-bottom:.75rem;transition:all var(--t)}
.faq-item:hover{border-color:var(--ac)}
.faq-item[open]{box-shadow:var(--ssm)}
.faq-q{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1.5rem;font-size:.95rem;font-weight:600;cursor:pointer;list-style:none;user-select:none}
.faq-q::-webkit-details-marker{display:none}
.faq-q::after{content:'+';font-size:1.25rem;font-weight:400;color:var(--ac);transition:transform var(--t);flex-shrink:0;margin-left:1rem}
.faq-item[open] .faq-q::after{content:'\2212'}
.faq-a{padding:0 1.5rem 1.25rem}
.faq-a p{font-size:.9rem;color:var(--ts);line-height:1.7}

/* ============================================
   SPRINT / CONVERSION PAGE STYLES
   ============================================ */

/* Page Hero (single-column, centered) */
.page-hero{padding:calc(var(--nh) + 4rem) 2rem 3rem;max-width:var(--mw);margin:0 auto;text-align:center}
.page-hero h1{font-family:var(--fd);font-size:clamp(2.2rem,4.5vw,3.25rem);line-height:1.1;margin-bottom:1rem;letter-spacing:-.02em;font-weight:800}
.page-hero h1 em{font-style:italic;color:var(--ac)}
.page-hero .hero-sub{max-width:680px;margin:0 auto 2rem;font-size:1.05rem;color:var(--ts);line-height:1.7}
.page-hero .hero-badges{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap;margin-bottom:2rem}
.page-hero .h-badge{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem 1rem;background:var(--bgc);border:1px solid var(--bd);border-radius:100px;font-size:.82rem;font-weight:600;color:var(--ts)}
.page-hero .h-badge .ic{color:var(--ac)}

/* Symptoms / Pain Points Grid */
.symptoms-sec{padding:3rem 2rem;max-width:var(--mw);margin:0 auto}
.symptoms-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem}
.symptom-card{display:flex;align-items:flex-start;gap:.75rem;padding:1.25rem;background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(255,255,255,.6));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.4);border-radius:var(--r);transition:all var(--t);position:relative;overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.8)}
.symptom-card::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none;z-index:0}
.symptom-card:hover{border-color:rgba(11,110,79,.3);box-shadow:0 12px 40px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.8),0 0 0 1px rgba(11,110,79,.15);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.symptom-ic{width:36px;height:36px;flex-shrink:0;background:#FEF2F2;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1rem;color:#991B1B}
.symptom-ic svg,.trust-card-ic svg,.s-card-ic svg,.req-ic svg,.cl-ic svg{width:20px;height:20px}
.symptom-card h4{font-size:.9rem;font-weight:600;margin-bottom:3px}
.symptom-card h3{font-size:.9rem;font-weight:600;margin-bottom:3px}
.symptom-card p{font-size:.82rem;color:var(--tm);line-height:1.5}

/* Deliverables Section */
.deliverables-sec{padding:3rem 2rem;max-width:var(--mw);margin:0 auto}
.deliverables-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem;counter-reset:del}
.del-card{background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(255,255,255,.6));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.4);border-radius:var(--rl);padding:2rem;position:relative;overflow:hidden;transition:all var(--t);box-shadow:0 8px 32px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.8)}
.del-card::after{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none;z-index:0}
.del-card:hover{border-color:rgba(11,110,79,.3);box-shadow:0 12px 40px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.8),0 0 0 1px rgba(11,110,79,.15);transform:translateY(-2px);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.del-card::before{counter-increment:del;content:counter(del);position:absolute;top:1.25rem;right:1.25rem;width:32px;height:32px;background:var(--al);color:var(--ac);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700}
.del-card h4{font-size:1rem;font-weight:700;margin-bottom:.5rem;padding-right:2.5rem}
.del-card p{font-size:.875rem;color:var(--ts);line-height:1.65}

/* Requirements / Timeline Bar */
.req-bar{background:var(--bgw);border-radius:var(--rl);margin:0 2rem;padding:3rem}
.req-bar-i{max-width:var(--mw);margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem;text-align:center}
.req-item{background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(255,255,255,.6));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.4);border-radius:var(--r);padding:1.5rem;position:relative;overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.8);transition:all var(--t)}
.req-item::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none;z-index:0}
.req-item:hover{border-color:rgba(11,110,79,.3);box-shadow:0 12px 40px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.8),0 0 0 1px rgba(11,110,79,.15)}
.req-item .ri-ic{font-size:1.5rem;margin-bottom:.5rem}
.req-item h4{font-size:.9rem;font-weight:700;margin-bottom:.25rem}
.req-item p{font-size:.82rem;color:var(--tm);line-height:1.5}

/* Trust / Enterprise Ready Page */
.trust-sec{padding:3rem 2rem;max-width:var(--mw);margin:0 auto}
.trust-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem}
.trust-card{background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(255,255,255,.6));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.4);border-radius:var(--rl);padding:2rem;transition:all var(--t);position:relative;overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.8)}
.trust-card::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none;z-index:0}
.trust-card:hover{border-color:rgba(11,110,79,.3);box-shadow:0 12px 40px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.8),0 0 0 1px rgba(11,110,79,.15);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.trust-card-ic{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;margin-bottom:1rem}
.trust-card-ic.gr{background:var(--al)}
.trust-card-ic.bl{background:var(--bll)}
.trust-card h3{font-size:1.05rem;font-weight:700;margin-bottom:.75rem}
.trust-card ul{list-style:none;display:flex;flex-direction:column;gap:.5rem}
.trust-card ul li{display:flex;align-items:flex-start;gap:.5rem;font-size:.875rem;color:var(--ts);line-height:1.55}
.trust-card ul li .ic{width:18px;height:18px;flex-shrink:0;background:var(--al);border-radius:50%;display:flex;align-items:center;justify-content:center;margin-top:2px}
.trust-card ul li .ic svg{width:10px;height:10px;color:var(--ac)}

/* Engagement Process Timeline */
.engage-timeline{max-width:760px;margin:0 auto;padding:2rem 0}
.engage-step{display:flex;gap:1.5rem;padding:1.25rem 0;position:relative}
.engage-step:not(:last-child)::after{content:'';position:absolute;left:19px;top:3.5rem;bottom:0;width:2px;background:var(--bdl)}
.engage-dot{width:40px;height:40px;flex-shrink:0;background:var(--ac);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700;position:relative;z-index:1}
.engage-step h4{font-size:.95rem;font-weight:600;margin-bottom:3px}
.engage-step p{font-size:.85rem;color:var(--ts);line-height:1.6}

/* Cross-link Cards */
.crosslinks{padding:3rem 2rem;max-width:var(--mw);margin:0 auto}
.crosslinks-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}
.crosslink-card{background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(255,255,255,.6));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.4);border-radius:var(--rl);padding:1.5rem;display:flex;align-items:center;gap:1rem;transition:all var(--t);position:relative;overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.8)}
.crosslink-card::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none;z-index:0}
.crosslink-card:hover{border-color:rgba(11,110,79,.3);box-shadow:0 12px 40px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.8),0 0 0 1px rgba(11,110,79,.15);transform:translateY(-2px);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.crosslink-card .cl-ic{width:44px;height:44px;flex-shrink:0;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.2rem}
.crosslink-card .cl-ic.gr{background:var(--al)}
.crosslink-card .cl-ic.bl{background:var(--bll)}
.crosslink-card h4{font-size:.95rem;font-weight:600;margin-bottom:2px}
.crosslink-card p{font-size:.8rem;color:var(--tm)}

/* Compliance Badges Row */
.compliance-badges{display:flex;justify-content:center;gap:1.5rem;flex-wrap:wrap;padding:2rem;max-width:var(--mw);margin:0 auto}
.comp-badge{display:flex;align-items:center;gap:.5rem;padding:.5rem 1.25rem;background:var(--bgc);border:1px solid var(--bd);border-radius:100px;font-size:.85rem;font-weight:600;color:var(--ts)}
.comp-badge .cb-ic{width:24px;height:24px;background:var(--al);border-radius:50%;display:flex;align-items:center;justify-content:center}
.comp-badge .cb-ic svg{width:12px;height:12px;color:var(--ac)}

@media(max-width:768px){
.symptoms-grid{grid-template-columns:1fr}
.deliverables-grid{grid-template-columns:1fr}
.trust-grid{grid-template-columns:1fr}
.req-bar-i{grid-template-columns:1fr 1fr}
.req-bar{margin:0 1rem;padding:2rem 1.5rem}
.crosslinks-grid{grid-template-columns:1fr}
.compliance-badges{gap:.75rem}
.engage-step{gap:1rem}
}

/* ============================================
   BLOG STYLES
   ============================================ */

/* Blog Listing */
.blog-hero{padding:calc(var(--nh) + 3rem) 2rem 2rem;max-width:var(--mw);margin:0 auto;text-align:center}
.blog-hero h1{font-family:var(--fd);font-size:clamp(2rem,4vw,3rem);font-weight:800;line-height:1.15;margin-bottom:.75rem}
.blog-hero h1 em{font-style:italic;color:var(--ac)}
.blog-hero p{font-size:1.05rem;color:var(--ts);max-width:600px;margin:0 auto 2rem;line-height:1.7}

.blog-filters{display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap;margin-bottom:2rem;padding:0 2rem}
.blog-filter{padding:.45rem 1.1rem;font-size:.85rem;font-weight:500;border-radius:100px;border:1px solid var(--bd);color:var(--ts);cursor:pointer;transition:all var(--t);background:var(--bgc)}
.blog-filter:hover,.blog-filter.active{background:var(--ac);color:#fff;border-color:var(--ac)}

.blog-search{max-width:480px;margin:0 auto 3rem;padding:0 2rem}
.blog-search input{width:100%;padding:.75rem 1.25rem .75rem 2.75rem;border:1px solid var(--bd);border-radius:100px;font-size:.9rem;font-family:var(--f);background:var(--bgc) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%237A7A7A' stroke-width='1.5'%3E%3Ccircle cx='7' cy='7' r='4.5'/%3E%3Cpath d='M10.5 10.5L14 14'/%3E%3C/svg%3E") no-repeat 1rem center;transition:border-color var(--t)}
.blog-search input:focus{outline:none;border-color:var(--ac)}

.blog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem;max-width:var(--mw);margin:0 auto;padding:0 2rem 4rem}
.blog-card{background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rl);overflow:hidden;transition:all var(--t)}
.blog-card:hover{border-color:var(--ac);box-shadow:var(--smd);transform:translateY(-4px)}
.blog-card-body{padding:1.5rem}
.blog-card-meta{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem;font-size:.78rem;color:var(--tm)}
.blog-card-meta .cat{padding:.2rem .6rem;background:var(--al);color:var(--ac);border-radius:100px;font-weight:600}
.blog-card h3{font-size:1.05rem;font-weight:700;margin-bottom:.5rem;line-height:1.4}
.blog-card h3 a{transition:color var(--t)}.blog-card h3 a:hover{color:var(--ac)}
.blog-card p{font-size:.875rem;color:var(--ts);line-height:1.65;margin-bottom:1rem}
.blog-card .s-link{font-size:.82rem}

.blog-pagination{display:flex;justify-content:center;gap:.5rem;padding:0 2rem 4rem}
.blog-pagination a,.blog-pagination span{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;font-size:.85rem;font-weight:600;border:1px solid var(--bd);color:var(--ts);transition:all var(--t)}
.blog-pagination a:hover,.blog-pagination span.active{background:var(--ac);color:#fff;border-color:var(--ac)}

/* Blog Post */
.blog-post{max-width:760px;margin:0 auto;padding:calc(var(--nh) + 3rem) 2rem 4rem}
.blog-post-meta{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem;font-size:.85rem;color:var(--tm)}
.blog-post-meta .cat{padding:.25rem .75rem;background:var(--al);color:var(--ac);border-radius:100px;font-weight:600;font-size:.78rem}
.blog-post h1{font-family:var(--fd);font-size:clamp(1.8rem,4vw,2.5rem);font-weight:700;line-height:1.2;margin-bottom:1.5rem}
.blog-post-content{font-size:1rem;color:var(--ts);line-height:1.8}
.blog-post-content h2{font-size:1.4rem;font-weight:700;color:var(--tp);margin:2rem 0 .75rem}
.blog-post-content h3{font-size:1.15rem;font-weight:600;color:var(--tp);margin:1.5rem 0 .5rem}
.blog-post-content p{margin-bottom:1.25rem}
.blog-post-content ul,.blog-post-content ol{margin-bottom:1.25rem;padding-left:1.5rem}
.blog-post-content li{margin-bottom:.5rem}
.blog-post-content code{background:var(--bgw);padding:.15rem .4rem;border-radius:4px;font-size:.9em}
.blog-post-content pre{background:var(--bgw);border:1px solid var(--bdl);border-radius:var(--rs);padding:1.25rem;overflow-x:auto;margin-bottom:1.25rem}
.blog-post-content pre code{background:none;padding:0}
.blog-post-content blockquote{border-left:3px solid var(--ac);padding-left:1.25rem;margin:1.5rem 0;font-style:italic;color:var(--tm)}
.blog-post-content a{color:var(--ac);text-decoration:underline}
.blog-post-content a:hover{color:var(--ah)}

.blog-post-cta{background:var(--bgw);border:1px solid var(--bdl);border-radius:var(--rl);padding:2rem;margin-top:3rem;text-align:center}
.blog-post-cta h3{font-size:1.1rem;font-weight:700;margin-bottom:.5rem}
.blog-post-cta p{font-size:.9rem;color:var(--ts);margin-bottom:1.25rem}

/* ============================================
   FREEDOMSTACK PAGE STYLES
   ============================================ */

/* Stack Grid - 3-column responsive grid for replacement cards */
.fs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.fs-card{background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(255,255,255,.6));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.4);border-radius:var(--rl);padding:2rem;transition:all var(--t);position:relative;overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.8)}
.fs-card::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none;z-index:0}
.fs-card:hover{border-color:rgba(11,110,79,.3);box-shadow:0 12px 40px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.8),0 0 0 1px rgba(11,110,79,.15);transform:translateY(-4px);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.fs-card::after{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--ac);transform:scaleX(0);transform-origin:left;transition:transform .4s ease}
.fs-card:hover::after{transform:scaleX(1)}
.fs-card .s-ic{margin-bottom:1rem}
.fs-card h3{font-size:1.05rem;font-weight:700;margin-bottom:.75rem}
.fs-replaces{font-size:.78rem;color:var(--tm);margin-bottom:.25rem}
.fs-replaces strong{color:#991B1B;font-weight:600}
.fs-with{font-size:.82rem;color:var(--ts);margin-bottom:.75rem}
.fs-with strong{color:var(--ac);font-weight:600}
.fs-stat{display:inline-block;padding:.3rem .8rem;background:var(--al);color:var(--ac);font-size:.82rem;font-weight:700;border-radius:100px;margin-bottom:.75rem}
.fs-card p{font-size:.85rem;color:var(--ts);line-height:1.6}

/* Cost Comparison Savings Callout */
.fs-savings{text-align:center;margin-top:2rem;padding:2rem;background:var(--al);border:2px solid var(--ac);border-radius:var(--rl)}
.fs-savings-num{font-family:var(--fd);font-size:clamp(2rem,4vw,3rem);color:var(--ac);line-height:1;margin-bottom:.5rem}
.fs-savings-label{font-size:1rem;font-weight:600;color:var(--tp);margin-bottom:.5rem}
.fs-savings-note{font-size:.85rem;color:var(--ts);line-height:1.5}

/* Two Models Grid */
.models-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.model-card{background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(255,255,255,.6));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.4);border-radius:var(--rl);padding:2.5rem;transition:all var(--t);position:relative;overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.8)}
.model-card::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none;z-index:0}
.model-card:hover{border-color:rgba(11,110,79,.3);box-shadow:0 12px 40px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.8),0 0 0 1px rgba(11,110,79,.15);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.model-card h3{font-size:1.15rem;font-weight:700;margin-bottom:.5rem}
.model-card .model-type{font-size:.78rem;font-weight:700;color:var(--ac);text-transform:uppercase;letter-spacing:.1em;margin-bottom:1rem}
.model-card p{font-size:.9rem;color:var(--ts);line-height:1.65;margin-bottom:1rem}
.model-card ul{list-style:none;display:flex;flex-direction:column;gap:.5rem}
.model-card ul li{display:flex;align-items:flex-start;gap:.5rem;font-size:.875rem;color:var(--ts);line-height:1.5}
.model-card ul li::before{content:'';width:6px;height:6px;background:var(--ac);border-radius:50%;flex-shrink:0;margin-top:.5em}

/* ============================================
   SHIELDSCAN PAGE STYLES
   ============================================ */

/* Scan Form Card */
.scan-card{max-width:560px;margin:0 auto;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rl);padding:2.5rem;box-shadow:var(--smd)}
.scan-card h3{font-size:1.25rem;font-weight:700;margin-bottom:.5rem}
.scan-card>p{font-size:.9rem;color:var(--ts);margin-bottom:1.5rem;line-height:1.6}
.scan-card label{font-size:.82rem;font-weight:600;color:var(--tp);display:block;margin-bottom:.35rem}
.scan-card input[type="url"],.scan-card input[type="email"]{width:100%;padding:.75rem 1rem;border:1px solid var(--bd);border-radius:var(--rs);font-family:var(--f);font-size:.9rem;margin-bottom:1rem;transition:border-color var(--t)}
.scan-card input:focus{outline:none;border-color:var(--ac)}
.scan-checkbox{display:flex;align-items:flex-start;gap:.5rem;margin-bottom:1.25rem;font-size:.82rem;color:var(--ts);line-height:1.5;cursor:pointer}
.scan-checkbox input[type="checkbox"]{margin-top:3px;accent-color:var(--ac)}
.scan-result{margin-top:1rem;padding:1rem;border-radius:var(--rs);font-size:.9rem;display:none}
.scan-result.success{display:block;background:#ECFDF5;color:#065F46;border:1px solid #A7F3D0}
.scan-result.error{display:block;background:#FEF2F2;color:#991B1B;border:1px solid #FED7D7}

/* Scan Comparison Cards */
.scan-compare{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;max-width:900px;margin:0 auto}
.scan-tier{background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rl);padding:2.5rem;transition:all var(--t)}
.scan-tier:hover{box-shadow:var(--smd);transform:translateY(-2px)}
.scan-tier.free{border-top:4px solid var(--bl)}
.scan-tier.paid{border-top:4px solid var(--ac)}
.scan-tier h3{font-size:1.1rem;font-weight:700;margin-bottom:.5rem}
.scan-tier .scan-price{font-size:.85rem;font-weight:600;color:var(--ac);margin-bottom:1rem}
.scan-tier ul{list-style:none;display:flex;flex-direction:column;gap:.6rem}
.scan-tier ul li{display:flex;align-items:flex-start;gap:.5rem;font-size:.875rem;color:var(--ts);line-height:1.5}
.scan-tier ul li .ic{width:18px;height:18px;flex-shrink:0;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-top:2px}
.scan-tier.free ul li .ic{background:var(--bll)}
.scan-tier.free ul li .ic svg{color:var(--bl)}
.scan-tier.paid ul li .ic{background:var(--al)}
.scan-tier.paid ul li .ic svg{color:var(--ac)}

/* AI Stats Callout */
.ai-stat{text-align:center;padding:2.5rem;background:linear-gradient(135deg,var(--al) 0%,var(--bll) 100%);border-radius:var(--rl);margin-bottom:2rem}
.ai-stat-num{font-family:var(--fd);font-size:clamp(2.5rem,5vw,3.5rem);color:var(--ac);line-height:1;margin-bottom:.5rem}
.ai-stat-label{font-size:1rem;font-weight:600;color:var(--tp);margin-bottom:.25rem}
.ai-stat-sub{font-size:.85rem;color:var(--ts)}

/* PRICING CARD */
.pricing-card{display:flex;align-items:center;justify-content:center;gap:2rem;background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(255,255,255,.7));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:2px solid var(--ac);border-radius:var(--rl);padding:3rem;position:relative;overflow:hidden;box-shadow:0 12px 40px rgba(11,110,79,.08),inset 0 1px 0 rgba(255,255,255,.8);max-width:600px;margin:0 auto 3rem}
.pricing-card::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none;z-index:0}
.pricing-block{text-align:center;position:relative;z-index:1}
.pricing-amount{font-family:var(--fd);font-size:clamp(2.5rem,5vw,3.5rem);color:var(--ac);line-height:1;margin-bottom:.35rem;font-weight:700}
.pricing-label{font-size:.9rem;color:var(--ts);font-weight:500}
.pricing-plus{font-family:var(--fd);font-size:2rem;color:var(--bd);line-height:1;position:relative;z-index:1}
.pricing-includes{display:grid;grid-template-columns:1fr 1fr;gap:2rem;max-width:700px;margin:0 auto}
.pricing-includes h4{font-size:.95rem;font-weight:700;margin-bottom:.75rem;color:var(--tp)}
.pricing-includes ul{list-style:none;display:flex;flex-direction:column;gap:.4rem}
.pricing-includes ul li{display:flex;align-items:flex-start;gap:.5rem;font-size:.85rem;color:var(--ts);line-height:1.55}
.pricing-includes ul li::before{content:'';width:6px;height:6px;background:var(--ac);border-radius:50%;flex-shrink:0;margin-top:.5em}

/* WEB DESIGN PAGE — Purple Premium Theme */
.wd-hero{position:relative;padding:calc(var(--nh) + 4rem) 2rem 4rem;overflow:hidden;min-height:85vh;display:flex;align-items:center}
.wd-hero-bg{position:absolute;inset:0;background:linear-gradient(135deg,#1a0533 0%,#2d1b69 30%,#4c1d95 60%,#7c3aed 100%);z-index:0}
.wd-hero-bg::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 20% 50%,rgba(124,58,237,.3) 0%,transparent 50%),radial-gradient(ellipse at 80% 20%,rgba(167,139,250,.2) 0%,transparent 40%)}
.wd-hero-bg::after{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.04}
.wd-hero-i{position:relative;z-index:1;max-width:var(--mw);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.wd-hero-text{color:#fff}
.wd-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem 1rem;background:rgba(255,255,255,.1);backdrop-filter:blur(8px);color:rgba(255,255,255,.9);font-size:.75rem;font-weight:700;border-radius:100px;margin-bottom:1.5rem;letter-spacing:.1em;border:1px solid rgba(255,255,255,.15)}
.wd-hero h1{font-family:var(--fd);font-size:clamp(2.5rem,5vw,3.75rem);line-height:1.08;margin-bottom:1.25rem;letter-spacing:-.02em;font-weight:800;color:#fff}
.wd-hero h1 em{font-style:italic;color:#c4b5fd}
.wd-hero p{font-size:1.1rem;color:rgba(255,255,255,.8);line-height:1.7;margin-bottom:1.5rem;max-width:520px}
.wd-hero-pills{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:2rem}
.wd-hero-pills span{padding:.35rem .85rem;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:100px;font-size:.78rem;font-weight:600;color:rgba(255,255,255,.85)}
.wd-hero-act{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
.wd-btn-primary{display:inline-flex;align-items:center;gap:.5rem;padding:.9rem 2rem;background:#fff;color:#5b21b6;font-size:.95rem;font-weight:700;border-radius:100px;transition:all var(--t);box-shadow:0 4px 24px rgba(0,0,0,.2)}
.wd-btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(0,0,0,.3)}
.wd-btn-primary svg{width:18px;height:18px}
.wd-btn-ghost{display:inline-flex;align-items:center;gap:.5rem;padding:.9rem 2rem;background:transparent;font-size:.95rem;font-weight:600;border-radius:100px;border:1.5px solid rgba(255,255,255,.3);color:#fff;transition:all var(--t)}
.wd-btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.1);transform:translateY(-2px)}
.wd-hero-visual{position:relative;perspective:1200px}
.wd-hero-stack{position:relative;width:100%;max-width:560px;margin:0 auto}
.wd-stack-back{width:88%;border-radius:10px;box-shadow:0 20px 60px rgba(0,0,0,.4);position:absolute;top:15%;left:0;transform:rotate(-4deg);opacity:.6}
.wd-stack-front{width:100%;border-radius:10px;box-shadow:0 25px 80px rgba(0,0,0,.5);position:relative;z-index:1;transform:rotate(2deg)}

/* WD Stats Bar */
.wd-stats{background:linear-gradient(135deg,#f5f3ff,#ede9fe);padding:3rem 2rem;border-top:3px solid #7c3aed}
.wd-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;max-width:var(--mw);margin:0 auto;text-align:center}
.wd-stat-val{font-family:var(--fd);font-size:clamp(1.8rem,3vw,2.5rem);font-weight:800;color:#5b21b6;line-height:1.1;margin-bottom:.25rem}
.wd-stat-lbl{font-size:.82rem;color:var(--ts);line-height:1.4}

/* WD Features compact grid */
.wd-features{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;max-width:var(--mw);margin:0 auto}
.wd-feat{display:flex;align-items:flex-start;gap:.75rem;padding:1.25rem;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--r);transition:all var(--t)}
.wd-feat:hover{border-color:#c4b5fd;box-shadow:0 4px 16px rgba(124,58,237,.08)}
.wd-feat svg{flex-shrink:0;margin-top:2px}
.wd-feat strong{display:block;font-size:.9rem;font-weight:700;margin-bottom:2px}
.wd-feat span{font-size:.82rem;color:var(--ts);line-height:1.4}

/* WD Showcase override — larger, more premium */
.wd-showcase .showcase-grid{gap:1.25rem}
.wd-showcase .showcase-item{border:2px solid transparent;border-radius:var(--rl)}
.wd-showcase .showcase-item:hover{border-color:#7c3aed;box-shadow:0 16px 48px rgba(124,58,237,.15)}

/* WD purple theme overrides for section headings */
.wd-showcase .sec-t em,.wd-page .sec-t em{color:var(--ai);-webkit-text-fill-color:var(--ai)}
.wd-page .faq-item:hover{border-color:var(--ai)}
.wd-page .faq-q::after{color:var(--ai)}
.wd-page .faq-q{color:var(--tx);font-size:1rem}
.wd-page .faq-item{background:#fff;border:1px solid #e5e7eb}

/* WD CTA purple accent */
.wd-page .cta{background:linear-gradient(135deg,#1a0533 0%,#2d1b69 40%,#4c1d95 80%,#7c3aed 100%)}
.wd-page .btn-w{background:var(--ai);border-color:var(--ai)}
.wd-page .btn-w:hover{background:var(--aid);border-color:var(--aid)}

/* WD responsive */
@media(max-width:1024px){.wd-hero-i{grid-template-columns:1fr;text-align:center;gap:2.5rem}.wd-hero p{margin:0 auto 1.5rem}.wd-hero-pills{justify-content:center}.wd-hero-act{justify-content:center}.wd-hero-stack{max-width:420px}.wd-stats-grid{grid-template-columns:repeat(2,1fr)}.wd-features{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){.wd-hero{min-height:auto;padding:calc(var(--nh) + 2.5rem) 1.5rem 2.5rem}.wd-stack-back{display:none}.wd-stack-front{transform:none}.wd-stats-grid{grid-template-columns:1fr 1fr;gap:1.5rem}.wd-features{grid-template-columns:1fr}}

/* SHOWCASE GRID */
.showcase-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem;max-width:var(--mw);margin:0 auto}
.showcase-item{position:relative;border-radius:var(--r);overflow:hidden;border:1px solid var(--bd);cursor:pointer;transition:all var(--t);background:var(--bgc)}
.showcase-item:hover{transform:translateY(-6px);box-shadow:var(--slg);border-color:var(--ac)}
.showcase-item:focus-visible{outline:2px solid var(--ac);outline-offset:2px}
.showcase-item img{width:100%;height:auto;display:block;transition:transform var(--t)}
.showcase-item:hover img{transform:scale(1.02)}
.showcase-label{position:absolute;bottom:0;left:0;right:0;padding:.75rem 1rem;background:linear-gradient(transparent,rgba(0,0,0,.7));display:flex;flex-direction:column;gap:2px}
.showcase-industry{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:rgba(255,255,255,.8)}
.showcase-name{font-size:.95rem;font-weight:700;color:#fff}

/* SHOWCASE LIGHTBOX */
.showcase-overlay{position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:2000;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;padding:2rem}
.showcase-overlay.active{opacity:1;visibility:visible}
.showcase-full{max-width:90vw;max-height:85vh;border-radius:var(--r);box-shadow:var(--slg);transform:scale(.9);transition:transform .3s ease;object-fit:contain}
.showcase-overlay.active .showcase-full{transform:scale(1)}
.showcase-close{position:absolute;top:1.5rem;right:1.5rem;width:44px;height:44px;background:rgba(255,255,255,.1);border:none;border-radius:50%;color:#fff;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background var(--t);z-index:2001}
.showcase-close:hover{background:rgba(255,255,255,.25)}
@media(max-width:768px){.showcase-grid{grid-template-columns:repeat(2,1fr);gap:.75rem}.showcase-label{padding:.5rem .6rem}.showcase-industry{font-size:.6rem}.showcase-name{font-size:.75rem}.showcase-full{max-width:95vw;max-height:80vh}}
@media(min-width:769px) and (max-width:1024px){.showcase-grid{grid-template-columns:repeat(2,1fr)}}

/* WEB TRANSFORM ANIMATION */
.web-transform{display:flex;justify-content:center;padding:2rem;margin:-1rem auto 2rem;max-width:700px}
.web-transform svg{width:100%;max-height:280px}
@keyframes brokenFade{0%,30%{opacity:1}40%,60%{opacity:.15}70%,100%{opacity:1}}
@keyframes beautifulFade{0%,30%{opacity:.15}40%,60%{opacity:1}70%,100%{opacity:.15}}
.broken-side{animation:brokenFade 6s ease-in-out infinite}
.beautiful-side{animation:beautifulFade 6s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){
.broken-side,.beautiful-side{animation:none;opacity:1}
}

/* LAST UPDATED */
.last-updated{font-size:.8rem;color:var(--ts);opacity:.7;margin-bottom:1.5rem;text-align:center}
.last-updated time{font-weight:500}

/* SECURITY INTELLIGENCE SECTION */
.sec-intel{padding:3rem 2rem 2rem}
.sec-intel .sec-h{text-align:center}
.si-grid{grid-template-columns:repeat(4,1fr)!important;gap:1.25rem}
.si-card{padding:1.5rem!important}
.si-card h3{font-size:.95rem;margin-bottom:.4rem}
.si-card p{font-size:.82rem;line-height:1.55;margin-bottom:.75rem}
.si-tag{display:inline-block;padding:.2rem .6rem;background:var(--al);color:var(--ac);font-size:.7rem;font-weight:700;border-radius:100px;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.75rem}
.si-tag.si-urgent{background:#FEF3C7;color:#92400E}

/* ============================================
   RESPONSIVE
   ============================================ */
@media(max-width:900px){
.si-grid{grid-template-columns:repeat(2,1fr)!important}
.hero{grid-template-columns:1fr;gap:2.5rem;min-height:auto;padding-top:calc(var(--nh) + 3rem)}
.hero-v{order:-1}
.w-grid{grid-template-columns:1fr 1fr}
.p-timeline{grid-template-columns:1fr;gap:.75rem}
.p-connector{display:none}
.f-grid{grid-template-columns:1fr 1fr}
.why,.cta,.spotlight,.feat-banner{margin:0 1rem;padding:3rem 1.5rem}
.stats-i{grid-template-columns:repeat(2,1fr)}
.spot-grid,.prod-grid{grid-template-columns:1fr}
.product-sec:nth-child(even) .prod-grid{direction:ltr}
.feat-banner-i{grid-template-columns:1fr;text-align:center}
.feat-banner p{margin:0 auto .75rem}
.fs-grid{grid-template-columns:repeat(2,1fr)}
.models-grid{grid-template-columns:1fr}
.scan-compare{grid-template-columns:1fr}
}
@media(max-width:768px){
.n-links{display:none}.n-tog{display:flex}
.n-links.open{display:flex;flex-direction:column;position:absolute;top:var(--nh);left:0;right:0;background:var(--bgc);border-bottom:1px solid var(--bd);padding:1rem;box-shadow:var(--smd)}
.n-links.open .n-item{width:100%}
.n-links.open .n-link{padding:.75rem 1rem}
.n-links.open .n-dd{position:static;transform:none;opacity:1;visibility:visible;pointer-events:auto;box-shadow:none;border:none;padding-left:1rem;display:none}
.n-links.open .n-item.dd-open .n-dd{display:block}
.n-cta{width:100%;text-align:center;margin:.5rem 0 0}
.hero-act{flex-direction:column;align-items:stretch}
.hero-act .btn-p,.hero-act .btn-s{text-align:center;justify-content:center}
.f-grid{grid-template-columns:1fr;gap:2rem}
.f-bot{flex-direction:column;gap:1rem;text-align:center}
.cta-acts{flex-direction:column;align-items:center}
.s-grid{grid-template-columns:1fr}
.cta-info{flex-direction:column;align-items:center;gap:1rem}
.n-ph{display:none}
.w-grid{grid-template-columns:1fr}
.p-timeline{grid-template-columns:1fr;gap:.75rem}
.p-connector{display:none}
.stats-i{grid-template-columns:1fr 1fr}
.spot-grid,.prod-grid{grid-template-columns:1fr;gap:2rem}
.compare-grid{grid-template-columns:1fr}
.blog-grid{grid-template-columns:1fr}
.fs-grid{grid-template-columns:1fr}
.scan-compare{grid-template-columns:1fr}
.pricing-card{flex-direction:column;gap:1rem;padding:2rem}
.pricing-includes{grid-template-columns:1fr}

/* Disable desktop neuron pseudo-elements on mobile — they overlay the pill */
.n-ai::before,.n-ai::after,.n-ai>.n-link::after{animation:none!important;opacity:0!important;display:none!important}

/* AI Services — mobile nav purple pill with pulse animation */
.n-links.open .n-item.n-ai{width:auto;align-self:flex-start;margin:.25rem 0}
.n-links.open .n-item.n-ai>.n-link{background:rgba(124,58,237,.15);border:1.5px solid rgba(124,58,237,.5);border-radius:12px;color:var(--ai)!important;padding:.75rem 1.25rem;box-shadow:0 0 12px rgba(124,58,237,.2),0 0 4px rgba(124,58,237,.12);animation:mobileAiPulse 3s ease-in-out infinite}
.n-links.open .n-item.n-ai .n-dd{border-left:2px solid rgba(124,58,237,.35);margin-left:1rem;padding-left:.75rem}
.n-links.open .n-item.n-ai .dd-link{border-left:2px solid transparent;padding-left:.5rem;margin:.25rem 0;border-radius:6px}
.n-links.open .n-item.n-ai .dd-link:hover,.n-links.open .n-item.n-ai .dd-link:active{background:rgba(124,58,237,.08);border-left-color:var(--ai)}

/* Mobile AI page enhancements */
.ai-hero .hero-act{flex-direction:column;align-items:stretch}
.ai-hero .btn-p,.ai-hero .btn-s{text-align:center;justify-content:center}
}
@keyframes mobileAiPulse{0%,100%{box-shadow:0 0 8px rgba(124,58,237,.12),0 0 3px rgba(124,58,237,.08);border-color:rgba(124,58,237,.35)}50%{box-shadow:0 0 20px rgba(124,58,237,.35),0 0 8px rgba(124,58,237,.2);border-color:rgba(124,58,237,.7)}}

/* ============================================
   FEATURE SUB-PAGE STYLES
   ============================================ */

/* Animated SVG hero section for feature pages */
.feat-svg{display:flex;justify-content:center;padding:2rem;margin:-1rem auto 2rem;max-width:600px}
.feat-svg svg{width:100%;max-height:280px}

/* Card link styling for parent pages */
.s-card-link{text-decoration:none;color:inherit;display:block}
.s-card-link .s-card{cursor:pointer}
.s-card-link:hover .s-card{border-color:var(--ac);box-shadow:var(--smd);transform:translateY(-4px)}
.s-card .s-card-link{display:inline-flex;align-items:center;gap:.4rem;font-size:.85rem;font-weight:600;color:var(--ac);transition:gap var(--t)}
.s-card .s-card-link:hover{gap:.7rem}
.s-card .s-card-link svg{width:14px;height:14px;flex-shrink:0}

/* Breadcrumb for sub-pages */
.breadcrumb{max-width:var(--mw);margin:0 auto;padding:.5rem 2rem 0;font-size:.8rem;color:var(--tm)}
.breadcrumb a{color:var(--ac);text-decoration:none}
.breadcrumb a:hover{text-decoration:underline}

/* ============================================
   AI SERVICES PAGE STYLES
   ============================================ */

/* AI Accent Color */
:root{--ai:#7C3AED;--ail:#EDE9FE;--aid:#5B21B6}

/* AI Dark Hero */
.ai-hero{padding:calc(var(--nh) + 5rem) 2rem 5rem;background:linear-gradient(135deg,#0F172A 0%,#1E1B4B 60%,#312E81 100%);color:#fff;position:relative;overflow:hidden;min-height:90vh;display:flex;align-items:center}
.ai-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 30% 40%,rgba(124,58,237,.15) 0%,transparent 60%),radial-gradient(ellipse at 70% 60%,rgba(99,102,241,.1) 0%,transparent 50%)}
.ai-hero::after{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none}
.ai-hero-inner{max-width:var(--mw);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;position:relative;z-index:1}
.ai-hero.ai-hero-centered .ai-hero-inner{grid-template-columns:1fr;text-align:center;max-width:780px}
.ai-hero.ai-hero-centered .hero-sub{text-align:center;margin:0 auto 2rem}
.ai-hero.ai-hero-centered .hero-badges{justify-content:center}
.ai-hero.ai-hero-centered .hero-act{justify-content:center}
.ai-hero.ai-hero-centered .hero-badge{margin:0 auto 1.25rem}
.ai-hero h1{font-family:var(--fd);font-size:clamp(2.5rem,5vw,3.75rem);line-height:1.08;margin-bottom:1.25rem;letter-spacing:-.02em;font-weight:800;color:#fff}
.ai-hero h1 em{font-style:italic;color:#A78BFA}
.ai-hero .hero-sub{font-size:1.1rem;color:rgba(255,255,255,.75);line-height:1.7;margin-bottom:2rem;max-width:520px}
.ai-hero .hero-badge{background:rgba(124,58,237,.2);color:#C4B5FD;border:1px solid rgba(124,58,237,.3)}
.ai-hero .hero-badge .pulse{background:#A78BFA}
.ai-hero .btn-p{background:var(--ai);color:#fff}
.ai-hero .btn-p:hover{background:var(--aid);box-shadow:0 8px 24px rgba(124,58,237,.35)}
.ai-hero .btn-s{border-color:rgba(255,255,255,.3);color:#fff}
.ai-hero .btn-s:hover{border-color:#fff;background:rgba(255,255,255,.08)}

/* AI Stats Bar */
.ai-stats{padding:3rem 2rem;max-width:var(--mw);margin:0 auto}
.ai-stats-i{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;padding:2.5rem;background:linear-gradient(135deg,#1E1B4B,#312E81);border-radius:var(--rl);box-shadow:0 12px 40px rgba(15,23,42,.3)}
.ai-stat-card{text-align:center;padding:1rem;border-right:1px solid rgba(255,255,255,.1)}
.ai-stat-card:last-child{border-right:none}
.ai-stat-card .stat-n{font-family:var(--fd);font-size:clamp(1.8rem,3.5vw,2.5rem);color:#A78BFA;line-height:1;margin-bottom:.35rem}
.ai-stat-card .stat-l{font-size:.8rem;color:rgba(255,255,255,.6);font-weight:500;line-height:1.4}

/* AI Pain Points (dark variant) */
.ai-pain{padding:4rem 2rem;max-width:var(--mw);margin:0 auto}
.ai-pain .sec-l{color:var(--ai)}
.ai-pain-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.25rem}
.ai-pain-card{display:flex;align-items:flex-start;gap:.85rem;padding:1.5rem;background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(255,255,255,.6));backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.4);border-radius:var(--r);transition:all var(--t);position:relative;overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.8)}
.ai-pain-card::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none;z-index:0}
.ai-pain-card:hover{border-color:rgba(124,58,237,.3);box-shadow:0 12px 40px rgba(0,0,0,.08),0 0 0 1px rgba(124,58,237,.15)}
.ai-pain-ic{width:40px;height:40px;flex-shrink:0;background:var(--ail);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:var(--ai)}
.ai-pain-ic svg{width:20px;height:20px}
.ai-pain-card h4{font-size:.95rem;font-weight:700;margin-bottom:4px}
.ai-pain-card p{font-size:.84rem;color:var(--ts);line-height:1.55}

/* AI Service Cards (purple accent) */
.ai-services .s-card:hover{border-color:rgba(124,58,237,.3);box-shadow:0 12px 40px rgba(0,0,0,.08),0 0 0 1px rgba(124,58,237,.15);transform:translateY(-4px)}
.ai-services .s-card::after{background:var(--ai)}
.ai-services .s-ic.pu{background:var(--ail);color:var(--ai)}
.ai-services .s-link{color:var(--ai)}
.ai-services .sec-l{color:var(--ai)}

/* Comparison Table */
.comp-table{width:100%;border-collapse:collapse;border-radius:var(--r);overflow:hidden;box-shadow:var(--ssm)}
.comp-table thead th{background:var(--ai);color:#fff;padding:1rem 1.25rem;font-size:.82rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;text-align:left}
.comp-table thead th:first-child{border-radius:var(--rs) 0 0 0}
.comp-table thead th:last-child{border-radius:0 var(--rs) 0 0}
.comp-table tbody td{padding:.85rem 1.25rem;font-size:.88rem;border-bottom:1px solid var(--bdl);color:var(--ts)}
.comp-table tbody tr:nth-child(even){background:var(--bgw)}
.comp-table tbody tr:hover{background:var(--ail)}
.comp-table tbody td:first-child{font-weight:600;color:var(--tp)}
.comp-table .good{color:#059669;font-weight:600}
.comp-table .bad{color:#DC2626;font-weight:600}
.comp-table .warn{color:#D97706;font-weight:600}
.comp-table-wrap{overflow-x:auto;margin:2rem 0;border-radius:var(--r)}

/* Green-header variant for non-AI pages */
.comp-table.green thead th{background:var(--ac)}
.comp-table.green tbody tr:hover{background:var(--al)}

/* Process Timeline (Horizontal) */
.ai-timeline{padding:4rem 2rem;max-width:var(--mw);margin:0 auto}
.ai-timeline .sec-l{color:var(--ai)}
.timeline-track{display:flex;align-items:flex-start;gap:0;position:relative;padding:2rem 0}
.timeline-step{flex:1;text-align:center;position:relative;padding:0 .5rem}
.timeline-step::before{content:attr(data-step);display:flex;align-items:center;justify-content:center;width:44px;height:44px;background:var(--ai);color:#fff;font-weight:700;font-size:.85rem;border-radius:50%;margin:0 auto 1rem;position:relative;z-index:2;box-shadow:0 4px 12px rgba(124,58,237,.3)}
.timeline-step::after{content:'';position:absolute;top:22px;left:calc(50% + 22px);width:calc(100% - 44px);height:2px;background:var(--bdl);z-index:1}
.timeline-step:last-child::after{display:none}
.timeline-step h4{font-size:.9rem;font-weight:700;margin-bottom:.35rem}
.timeline-step p{font-size:.78rem;color:var(--tm);line-height:1.5}

/* Green timeline variant */
.timeline-track.green .timeline-step::before{background:var(--ac);box-shadow:0 4px 12px rgba(11,110,79,.3)}

/* Before/After Split (AI variant) */
.ai-ba{padding:4rem 2rem;max-width:var(--mw);margin:0 auto}
.ai-ba .sec-l{color:var(--ai)}

/* Orbital Animation (AI Agents page) */
.orbital-wrap{position:relative;width:100%;max-width:500px;margin:0 auto;aspect-ratio:1}
.orbital-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:5}
.orbital-center-glow{width:80px;height:80px;background:radial-gradient(circle,rgba(124,58,237,.4) 0%,transparent 70%);border-radius:50%;animation:centerPulse 3s ease-in-out infinite;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
.orbital-ring{position:absolute;top:50%;left:50%;border:1px solid rgba(124,58,237,.15);border-radius:50%;transform:translate(-50%,-50%)}
.orbital-ring-1{width:65%;height:65%;animation:orbitSpin 30s linear infinite}
.orbital-ring-2{width:85%;height:85%;animation:orbitSpin 45s linear infinite reverse}
.orbital-ring-3{width:100%;height:100%;animation:orbitSpin 60s linear infinite}
.orbital-node{position:absolute;width:42px;height:42px;background:rgba(15,23,42,.9);border:2px solid rgba(124,58,237,.3);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:.65rem;font-weight:700;color:#C4B5FD;box-shadow:0 4px 16px rgba(0,0,0,.3);transition:all .3s ease}
.orbital-node:hover{border-color:var(--ai);transform:scale(1.15);box-shadow:0 8px 24px rgba(124,58,237,.4)}
.orbital-node img,.orbital-node svg{width:22px;height:22px}

/* Particle streams */
.orbital-particles{position:absolute;inset:0;pointer-events:none}
.particle{position:absolute;width:3px;height:3px;background:#A78BFA;border-radius:50%;opacity:0;animation:particleFlow var(--dur,4s) linear infinite var(--delay,0s)}

@keyframes centerPulse{0%,100%{opacity:.6;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.3)}}
@keyframes orbitSpin{0%{transform:translate(-50%,-50%) rotate(0deg)}100%{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes particleFlow{0%{opacity:0;transform:translate(var(--sx,0),var(--sy,0))}20%{opacity:.8}80%{opacity:.8}100%{opacity:0;transform:translate(var(--ex,0),var(--ey,0))}}

/* Gamification Dashboard SVG (AI Training page) */
.gamify-wrap{position:relative;max-width:500px;margin:0 auto}
.gamify-wrap svg{width:100%;height:auto}
@keyframes progressFill{from{stroke-dashoffset:var(--offset,283)}to{stroke-dashoffset:var(--target,50)}}
@keyframes badgePop{0%{transform:scale(0);opacity:0}70%{transform:scale(1.2);opacity:1}100%{transform:scale(1);opacity:1}}
@keyframes streakGlow{0%,100%{filter:drop-shadow(0 0 2px rgba(124,58,237,.3))}50%{filter:drop-shadow(0 0 8px rgba(124,58,237,.6))}}

/* Compliance Shield SVG (AI Governance page) */
.shield-wrap{position:relative;max-width:450px;margin:0 auto}
.shield-wrap svg{width:100%;height:auto}
@keyframes shieldScan{0%{transform:translateY(-100%)}100%{transform:translateY(100%)}}
@keyframes checkMark{0%{stroke-dashoffset:24}100%{stroke-dashoffset:0}}
@keyframes threatDetect{0%,40%{opacity:1}50%{opacity:0;transform:scale(.5)}100%{opacity:0}}

/* Output Streams (AI Agents) */
.output-node{position:absolute;width:36px;height:36px;background:rgba(15,23,42,.85);border:1.5px solid rgba(167,139,250,.25);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:.7rem;color:#A78BFA;animation:outputPulse 3s ease-in-out infinite var(--delay,0s)}
@keyframes outputPulse{0%,100%{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}

/* AI FAQ (purple accent variant) */
.ai-faq .faq-item:hover{border-color:var(--ai)}
.ai-faq .faq-q::after{color:var(--ai)}

/* AI CTA section */
.ai-cta{background:linear-gradient(135deg,#1E1B4B 0%,#312E81 50%,var(--ai) 100%)}
.ai-cta .btn-w{color:#1E1B4B}

/* AI Cross-links */
.ai-crosslinks .crosslink-card:hover{border-color:rgba(124,58,237,.3);box-shadow:0 12px 40px rgba(0,0,0,.08),0 0 0 1px rgba(124,58,237,.15)}
.ai-crosslinks .cl-ic.pu{background:var(--ail);color:var(--ai)}

/* ============================================
   AI PAGES RESPONSIVE
   ============================================ */
@media(max-width:900px){
.ai-hero-inner{grid-template-columns:1fr;gap:2.5rem}
.ai-hero{min-height:auto;padding-top:calc(var(--nh) + 3rem)}
.ai-stats-i{grid-template-columns:repeat(2,1fr)}
.ai-stat-card{border-right:none;border-bottom:1px solid rgba(255,255,255,.1)}
.ai-stat-card:nth-child(2n){border-right:none}
.ai-stat-card:nth-last-child(-n+2){border-bottom:none}
.timeline-track{flex-direction:column;gap:1rem}
.timeline-step::after{display:none}
.timeline-step{text-align:left;display:flex;align-items:flex-start;gap:1rem;padding:0}
.timeline-step::before{margin:0;flex-shrink:0}
.orbital-wrap{max-width:350px}
}
@media(max-width:768px){
.ai-hero-inner{grid-template-columns:1fr}
.ai-hero h1{text-align:center}
.ai-hero .hero-sub{text-align:center;margin:0 auto 2rem}
.ai-hero .hero-act{justify-content:center}
.ai-hero{padding-bottom:3rem}
.ai-pain-grid{grid-template-columns:1fr}
.ai-stats-i{grid-template-columns:1fr 1fr}
.orbital-wrap{max-width:280px;margin:0 auto}
.orbital-node{width:34px;height:34px;font-size:.55rem}
}

/* Reduced motion for AI animations */
@media(prefers-reduced-motion:reduce){
.orbital-ring,.orbital-ring-1,.orbital-ring-2,.orbital-ring-3{animation:none}
.orbital-center-glow{animation:none;opacity:.8}
.particle{animation:none;display:none}
.output-node{animation:none;opacity:.8}
[class*="gamify"] [style*="animation"]{animation:none!important}
.shield-wrap [style*="animation"]{animation:none!important}
.n-ai::before,.n-ai::after,.n-ai>.n-link::after{animation:none!important}
.n-ai::before{opacity:.3}
}

/* AI Nav Dropdown styling */
.dd-ic.pu{background:var(--ail);color:var(--ai)}

/* ============================================
   AI SERVICES NAV — NEURON ANIMATION
   Purple signal traces the border like an
   action potential, then dendrite tendrils
   pulse outward at connection points.
   ============================================ */
@property --na{syntax:'<angle>';initial-value:0deg;inherits:false}

.n-ai{position:relative}
.n-ai>.n-link{position:relative;color:var(--ai)!important;z-index:1}

/* Rotating trace — signal traveling the neuron axon */
.n-ai::before{content:'';position:absolute;inset:6px 0;border-radius:20px;padding:1.5px;background:conic-gradient(from var(--na),transparent 0%,transparent 65%,rgba(124,58,237,.1) 72%,rgba(124,58,237,.4) 80%,rgba(167,139,250,.65) 85%,rgba(124,58,237,.4) 90%,rgba(124,58,237,.1) 97%,transparent 100%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:neuronTrace 5s linear infinite;pointer-events:none;z-index:0}

/* Synaptic glow halo */
.n-ai::after{content:'';position:absolute;inset:2px -2px;border-radius:22px;box-shadow:0 0 14px rgba(124,58,237,.06),0 0 4px rgba(124,58,237,.04);animation:neuronGlow 4s ease-in-out infinite;pointer-events:none;z-index:0}

/* Neural dendrite connections — tendrils reaching outward */
.n-ai>.n-link::after{content:'';position:absolute;inset:-8px -12px;border-radius:30px;background:radial-gradient(ellipse 25% 55% at 0% 50%,rgba(124,58,237,.18) 0%,transparent 100%),radial-gradient(ellipse 25% 55% at 100% 50%,rgba(124,58,237,.18) 0%,transparent 100%),radial-gradient(ellipse 55% 25% at 50% 0%,rgba(124,58,237,.1) 0%,transparent 100%),radial-gradient(ellipse 55% 25% at 50% 100%,rgba(124,58,237,.1) 0%,transparent 100%);animation:neuronConnect 5s ease-in-out infinite;pointer-events:none;z-index:-1}

/* Hover: intensify the neural activity */
.n-ai:hover::before{background:conic-gradient(from var(--na),transparent 0%,transparent 55%,rgba(124,58,237,.2) 65%,rgba(124,58,237,.6) 78%,rgba(167,139,250,.9) 85%,rgba(124,58,237,.6) 92%,rgba(124,58,237,.2) 97%,transparent 100%);animation-duration:3s}
.n-ai:hover::after{box-shadow:0 0 20px rgba(124,58,237,.12),0 0 8px rgba(124,58,237,.08)}
.n-ai:hover>.n-link::after{opacity:1}

@keyframes neuronTrace{0%{--na:0deg}100%{--na:360deg}}
@keyframes neuronGlow{0%,100%{opacity:.4;transform:scale(.98)}50%{opacity:1;transform:scale(1.02)}}
@keyframes neuronConnect{0%,25%,75%,100%{opacity:0;transform:scale(.95)}45%,55%{opacity:.6;transform:scale(1.05)}}

/* ============================================
   Web Design Nav — flashy purple treatment
   ============================================ */
@property --nw{syntax:'<angle>';initial-value:0deg;inherits:false}
.n-wd{position:relative}
.n-wd>.n-link{position:relative;color:var(--ai)!important;z-index:1}
/* Rotating conic-gradient border */
.n-wd::before{content:'';position:absolute;inset:6px 0;border-radius:20px;padding:1.5px;background:conic-gradient(from var(--nw),transparent 0%,transparent 60%,rgba(124,58,237,.12) 70%,rgba(124,58,237,.45) 80%,rgba(196,181,253,.7) 85%,rgba(124,58,237,.45) 90%,rgba(124,58,237,.12) 95%,transparent 100%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:wdTrace 4s linear infinite;pointer-events:none;z-index:0}
/* Glow halo */
.n-wd::after{content:'';position:absolute;inset:2px -2px;border-radius:22px;box-shadow:0 0 14px rgba(124,58,237,.06),0 0 4px rgba(124,58,237,.04);animation:wdGlow 3.5s ease-in-out infinite;pointer-events:none;z-index:0}
/* Hover: intensify */
.n-wd:hover::before{background:conic-gradient(from var(--nw),transparent 0%,transparent 50%,rgba(124,58,237,.25) 62%,rgba(124,58,237,.65) 78%,rgba(196,181,253,.95) 85%,rgba(124,58,237,.65) 92%,rgba(124,58,237,.25) 96%,transparent 100%);animation-duration:2.5s}
.n-wd:hover::after{box-shadow:0 0 22px rgba(124,58,237,.14),0 0 8px rgba(124,58,237,.08)}
@keyframes wdTrace{0%{--nw:0deg}100%{--nw:360deg}}
@keyframes wdGlow{0%,100%{opacity:.35;transform:scale(.97)}50%{opacity:1;transform:scale(1.03)}}
/* Mobile: purple pill */
@media(max-width:768px){
.n-wd::before,.n-wd::after{animation:none!important;opacity:0!important;display:none!important}
.n-links.open .n-item.n-wd{width:auto;align-self:flex-start;margin:.25rem 0}
.n-links.open .n-item.n-wd>.n-link{background:rgba(124,58,237,.15);border:1.5px solid rgba(124,58,237,.5);border-radius:12px;color:var(--ai)!important;padding:.75rem 1.25rem;box-shadow:0 0 12px rgba(124,58,237,.2),0 0 4px rgba(124,58,237,.12);animation:mobileAiPulse 3s ease-in-out infinite}
}
/* Prefers reduced motion */
@media(prefers-reduced-motion:reduce){.n-wd::before,.n-wd::after{animation:none!important}.n-wd::before{opacity:.3}}

/* ── Homepage Web Design Showcase ── */
.wd-home-showcase{background:#0a0a0f;padding:5rem 2rem;position:relative;overflow:hidden}
.wd-home-showcase::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 30% 60%,rgba(124,58,237,.12),transparent 60%),radial-gradient(ellipse at 70% 30%,rgba(167,139,250,.08),transparent 50%)}
.wd-home-inner{max-width:var(--mw);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;position:relative;z-index:1}
.wd-home-text{color:#fff}
.wd-home-text .sec-l{color:#7c3aed;background:rgba(124,58,237,.15);display:inline-block;padding:.35rem .85rem;border-radius:100px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.2em;margin-bottom:1.25rem}
.wd-home-text h2{font-family:var(--fd);font-size:clamp(2rem,4vw,2.75rem);line-height:1.12;font-weight:700;margin-bottom:1rem;color:#f5f5f7}
.wd-home-text h2 em{background:linear-gradient(135deg,#a78bfa,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-style:italic}
.wd-home-text p{font-size:1rem;color:rgba(255,255,255,.55);line-height:1.7;margin-bottom:2rem;max-width:480px}
.wd-home-text .wd-home-cta{display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 2rem;font-size:.92rem;font-weight:600;color:#fff;border-radius:100px;position:relative;background:#0a0a0f;transition:transform .3s,box-shadow .3s;z-index:1}
.wd-home-text .wd-home-cta::before{content:'';position:absolute;inset:-2px;border-radius:100px;background:conic-gradient(from var(--angle),#7c3aed,#a78bfa,#c4b5fd,#7c3aed);z-index:-1;animation:wd-rotate 3s linear infinite}
.wd-home-text .wd-home-cta:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(124,58,237,.35)}
.wd-home-text .wd-home-cta svg{width:18px;height:18px}
.wd-home-demos{display:grid;grid-template-columns:1fr 1fr;gap:1rem;position:relative}
.wd-home-demos .demo-thumb{border-radius:12px;overflow:hidden;border:1px solid rgba(124,58,237,.15);transition:all .4s;position:relative}
.wd-home-demos .demo-thumb:first-child{grid-column:span 2}
.wd-home-demos .demo-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
.wd-home-demos .demo-thumb:hover{border-color:rgba(124,58,237,.4);box-shadow:0 0 40px rgba(124,58,237,.2);transform:translateY(-4px)}
.wd-home-demos .demo-thumb:hover img{transform:scale(1.04)}
.wd-home-demos .demo-thumb-label{position:absolute;bottom:0;left:0;right:0;padding:.6rem .85rem;background:linear-gradient(transparent,rgba(0,0,0,.8));font-size:.72rem;font-weight:700;color:#a78bfa;text-transform:uppercase;letter-spacing:.1em}
@media(max-width:1024px){.wd-home-inner{grid-template-columns:1fr;text-align:center;gap:2.5rem}.wd-home-text p{margin:0 auto 2rem}.wd-home-demos{max-width:500px;margin:0 auto}}
@media(max-width:768px){.wd-home-showcase{padding:3.5rem 1.5rem}.wd-home-demos{gap:.75rem}}

/* Case Study Card */
.case-study{background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(255,255,255,.7));border:1px solid var(--bd);border-radius:var(--rl);padding:2.5rem;margin:2rem 0;position:relative;overflow:hidden}
.case-study::before{content:'CASE STUDY';position:absolute;top:1rem;right:1.5rem;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--tm);background:var(--bgw);padding:.3rem .8rem;border-radius:100px}
.case-study h4{font-size:1.05rem;font-weight:700;margin-bottom:.75rem;padding-right:8rem}
.case-study p{font-size:.9rem;color:var(--ts);line-height:1.7;margin-bottom:1rem}
.case-study-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin-top:1.25rem}
.case-study-metric{text-align:center;padding:1rem;background:var(--bgw);border-radius:var(--rs);border:1px solid var(--bdl)}
.case-study-metric .val{font-family:var(--fd);font-size:1.5rem;color:var(--ac);line-height:1;margin-bottom:.25rem}
.case-study-metric .lbl{font-size:.75rem;color:var(--tm);font-weight:500}

/* Checklist Card */
.checklist{background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rl);padding:2rem;margin:2rem 0}
.checklist h4{font-size:1rem;font-weight:700;margin-bottom:1rem}
.checklist ul{list-style:none;display:flex;flex-direction:column;gap:.5rem}
.checklist ul li{display:flex;align-items:flex-start;gap:.6rem;font-size:.88rem;color:var(--ts);line-height:1.55}
.checklist ul li::before{content:'';width:18px;height:18px;flex-shrink:0;background:var(--al);border-radius:4px;display:flex;align-items:center;justify-content:center;margin-top:2px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%230B6E4F' stroke-width='2'%3E%3Cpath d='M2.5 6l2.5 2.5 4.5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:10px}

/* SLA / Pricing Table variant of comp-table */
.comp-table.sla thead th{background:var(--bl)}
.comp-table.sla tbody tr:hover{background:var(--bll)}

/* Urgency Banner */
.urgency-banner{background:linear-gradient(135deg,#FEF2F2,#FFF7ED);border:1px solid #FED7D7;border-radius:var(--r);padding:1.5rem 2rem;margin:2rem 0;display:flex;align-items:flex-start;gap:1rem}
.urgency-banner .ub-ic{width:40px;height:40px;flex-shrink:0;background:#FEE2E2;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:#DC2626}
.urgency-banner h4{font-size:.95rem;font-weight:700;color:#991B1B;margin-bottom:4px}
.urgency-banner p{font-size:.84rem;color:#7F1D1D;line-height:1.55}

/* ============================================
   TECH ICONS SECTION (Desktop + Mobile)
   ============================================ */
.tech-stack{text-align:center;padding:2.5rem 2rem 1.5rem;max-width:var(--mw);margin:0 auto}
.tech-stack-label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--tm);margin-bottom:1.25rem;display:block}
.tech-icons{display:flex;justify-content:center;gap:1.75rem;flex-wrap:wrap}
.tech-bubble{width:52px;height:52px;border-radius:50%;background:rgba(245,243,238,.8);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--bdl);display:grid;place-items:center;position:relative;overflow:hidden;transition:all var(--t);text-decoration:none}
.tech-bubble svg{width:24px;height:24px;fill:var(--tm);transition:all var(--t)}
.tech-bubble:hover{border-color:var(--ac);background:var(--al);transform:translateY(-3px);box-shadow:0 8px 20px rgba(11,110,79,.12)}
.tech-bubble:hover svg{fill:var(--ac)}
.tech-bubble::after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.4) 50%,transparent 60%);transform:translateX(-120%);transition:transform .6s ease;pointer-events:none}
.tech-bubble:hover::after{transform:translateX(120%)}

/* ============================================
   BUTTON HOVER EFFECTS — ROTATING GRADIENT BORDER
   Matrix-style rotating border, tasteful
   Desktop + Mobile
   ============================================ */
@property --angle{syntax:'<angle>';initial-value:0deg;inherits:false}

@keyframes btnRotate{to{--angle:360deg}}

.btn-p,.btn-s,.n-cta{position:relative;z-index:1;isolation:isolate}
.btn-p::after,.btn-s::after,.n-cta::after{content:'';position:absolute;inset:-2px;border-radius:inherit;background:conic-gradient(from var(--angle),transparent 25%,var(--ac) 30%,transparent 35%,transparent 75%,var(--ac) 80%,transparent 85%);opacity:0;transition:opacity .35s ease;z-index:-1;pointer-events:none}
.btn-p:hover::after,.btn-s:hover::after,.n-cta:hover::after{opacity:.6;animation:btnRotate 4s linear infinite}
.btn-p:focus-visible::after,.btn-s:focus-visible::after,.n-cta:focus-visible::after{opacity:.6;animation:btnRotate 4s linear infinite}

/* Purple variant for AI pages */
.ai-hero .btn-p::after,.ai-hero .btn-s::after,.ai-cta .btn-w::after{background:conic-gradient(from var(--angle),transparent 25%,var(--ai) 30%,transparent 35%,transparent 75%,var(--ai) 80%,transparent 85%)}

/* Firefox fallback — simple glow pulse (no @property support) */
@supports not (background: conic-gradient(from 0deg, red, blue)) {
  .btn-p:hover,.btn-s:hover,.n-cta:hover{box-shadow:0 0 16px rgba(11,110,79,.25),0 0 4px rgba(11,110,79,.15)}
  .btn-p::after,.btn-s::after,.n-cta::after{display:none}
}

/* ============================================
   MOBILE PREMIUM VISUAL REDESIGN
   @media(max-width:768px)
   ============================================ */
@media(max-width:768px){

/* --- PERFORMANCE: content-visibility for below-fold sections --- */
.spotlight,.feat-banner,.ba-sec,.why{content-visibility:auto;contain-intrinsic-size:auto 600px}
.del-card,.trust-card{contain:layout style paint}

/* --- PERFORMANCE: Hide ONLY heavy SVG/canvas decorations --- */
.hero-bg,.cta-shapes{display:none!important}

/* === HERO: Premium gradient background, headline FIRST === */
.hero{
  padding:calc(var(--nh) + 2rem) 1.5rem 2.5rem;
  grid-template-columns:1fr;gap:1.5rem;min-height:auto;text-align:center;
  background:linear-gradient(165deg,#F0FDF9 0%,#FAFAF8 35%,#EDF5FF 70%,#F5F0FF 100%);
  position:relative
}
.hero::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--ac),var(--bl),transparent)}
.hero-c{text-align:center;order:-1}
.hero h1{font-size:clamp(2.1rem,7.5vw,2.85rem);text-wrap:balance;letter-spacing:-.02em;line-height:1.12}
.hero h1 em{background:linear-gradient(135deg,var(--ac),var(--bl));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-sub{margin:0 auto 1.5rem;text-align:center;font-size:.95rem;line-height:1.7;color:var(--ts)}
.hero-badge{margin:0 auto 1.25rem;background:linear-gradient(135deg,var(--al),#E8EEF4);border:1px solid rgba(11,110,79,.15);box-shadow:0 2px 8px rgba(11,110,79,.08)}
.hero-badges{justify-content:center!important;gap:.5rem!important}
.hero-badges .h-badge{background:rgba(255,255,255,.7)!important;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 1px 4px rgba(0,0,0,.04)}
.hero-trusted{align-items:center;text-align:center}
.hero-trusted-tags{justify-content:center}
.hero-trusted-label{font-weight:600;color:var(--tm)}
.trusted-tag{background:rgba(255,255,255,.7);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid var(--bdl);box-shadow:0 1px 3px rgba(0,0,0,.03)}

/* Hero buttons: full-width stacked, 60px touch targets, gradient primary */
.hero-act{flex-direction:column;align-items:stretch;gap:.75rem}
.hero-act .btn-p{min-height:60px;justify-content:center;text-align:center;font-size:1.05rem;padding:1rem 1.5rem;background:linear-gradient(135deg,var(--ac),#0A8F63);box-shadow:0 4px 16px rgba(11,110,79,.25),0 1px 3px rgba(11,110,79,.15);border:none}
.hero-act .btn-s{min-height:56px;justify-content:center;text-align:center;font-size:1rem;padding:1rem 1.5rem;background:rgba(255,255,255,.7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--bdl);box-shadow:0 2px 8px rgba(0,0,0,.04)}

/* Hero specialties card: premium glass */
.hero-v{order:1}
.h-card{padding:1.25rem;background:rgba(255,255,255,.6);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 24px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.8);border-radius:var(--rl)}
.h-card-h{flex-direction:column;gap:.5rem;align-items:flex-start}
.h-pillar-link{padding:.65rem 0}
.h-pillar-ic{width:32px;height:32px}
.h-pillar:hover{background:rgba(245,243,238,.6)}

/* === SERVICE CARDS: Premium glass carousel === */
.s-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;gap:1rem;padding:0 0 1rem;scrollbar-width:none}
.s-grid::-webkit-scrollbar{display:none}
.s-card{flex:0 0 85vw;scroll-snap-align:start;min-width:0;background:linear-gradient(145deg,rgba(255,255,255,.85),rgba(255,255,255,.55));backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.5);box-shadow:0 8px 32px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.8)}
.s-card.s-featured{padding:1.75rem;border:2px solid rgba(11,110,79,.15);box-shadow:0 8px 32px rgba(11,110,79,.08),inset 0 1px 0 rgba(255,255,255,.8)}
.s-card::after{height:3px;background:linear-gradient(90deg,var(--ac),var(--bl));transform:scaleX(1)!important}
.s-card:active{transform:scale(.98);transition:transform .1s}

/* === STATS: Premium gradient background === */
.stats{padding:0 1rem;margin-top:-1rem}
.stats-i{padding:2rem 1.25rem;gap:1.25rem;grid-template-columns:1fr 1fr;background:linear-gradient(135deg,var(--bl) 0%,#0B6E4F 100%);border-radius:var(--rl);border:none;box-shadow:0 8px 32px rgba(27,73,101,.2)}
.stat{text-align:center}
.stat-n{font-size:clamp(1.75rem,8vw,2.25rem);color:#fff!important}
.stat-l{color:rgba(255,255,255,.8)!important;font-weight:500}

/* === SECTION SPACING & TYPOGRAPHY === */
body{line-height:1.75}
.sec{padding:3rem 1.25rem}
.sec:nth-child(even){background:linear-gradient(180deg,rgba(240,253,249,.4) 0%,rgba(250,250,248,.2) 50%,rgba(237,245,255,.3) 100%);margin:.5rem .5rem;border-radius:var(--rl);border:1px solid rgba(11,110,79,.04)}
.sec-h{margin-bottom:2.5rem}
.sec-t{font-size:clamp(1.6rem,6vw,2.25rem);text-wrap:balance}
.sec-t em{background:linear-gradient(135deg,var(--ac),var(--bl));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.sec-d{font-size:.95rem}

/* === SPOTLIGHT: Premium bordered card === */
.spotlight{margin:0 .75rem;padding:2.5rem 1.5rem;background:rgba(255,255,255,.7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(11,110,79,.08);box-shadow:0 4px 24px rgba(0,0,0,.04)}
.spotlight::before{height:3px!important;background:linear-gradient(90deg,var(--ac),var(--bl),var(--ac))!important}
.spot-flow{flex-wrap:wrap;gap:.5rem;padding:1rem}
.flow-step svg{width:22px;height:22px}
.flow-arrow{display:none}
.spot-card{padding:1.25rem;background:rgba(245,243,238,.5);border:1px solid var(--bdl);border-radius:var(--r)}
.spot-step{border:1px solid rgba(11,110,79,.06);box-shadow:0 2px 8px rgba(0,0,0,.03)}

/* === BEFORE/AFTER === */
.ba-sec{padding:3rem 1.25rem}
.ba-card{padding:1.5rem;box-shadow:0 4px 16px rgba(0,0,0,.04)}

/* === WHY section: Subtle gradient background === */
.why{margin:0 .75rem;padding:2.5rem 1.5rem;background:linear-gradient(165deg,#F0FDF9,var(--bgw),#EDF5FF);border:1px solid rgba(11,110,79,.06)}
.w-grid{grid-template-columns:1fr;gap:1.5rem}
.w-item{padding:1.25rem;background:rgba(255,255,255,.6);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.5);border-radius:var(--r);box-shadow:0 2px 12px rgba(0,0,0,.03)}
.w-num{font-size:2.25rem;background:linear-gradient(135deg,var(--ac),var(--bl));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}

/* === PROCESS timeline === */
.p-step{padding:1.5rem 1.25rem;background:rgba(255,255,255,.7);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(11,110,79,.06);box-shadow:0 2px 12px rgba(0,0,0,.03)}
.p-step::before{width:36px;height:36px;font-size:.75rem;background:linear-gradient(135deg,var(--ac),var(--bl));box-shadow:0 4px 12px rgba(11,110,79,.2)}

/* === CTA section: Full impact === */
.cta{margin:0;padding:3rem 1.5rem;border-radius:0;background:linear-gradient(135deg,var(--bl) 0%,#094D38 60%,var(--ac) 100%)}
.cta .sec-t{font-size:clamp(1.6rem,6vw,2.2rem)}
.cta-acts{flex-direction:column;align-items:stretch;gap:.75rem}
.cta-acts .btn-w,.cta-acts .btn-ow{min-height:56px;justify-content:center;font-size:1rem}
.cta-acts .btn-w{box-shadow:0 4px 16px rgba(0,0,0,.2)}

/* === FOOTER === */
.footer{padding:2.5rem 1.25rem 1.5rem}
.f-brand p{max-width:100%}
.f-col h4{margin-bottom:.75rem}
.f-grid{grid-template-columns:1fr;gap:2rem}
.f-bot{flex-direction:column;gap:1rem;text-align:center}

/* === FEATURED BANNER === */
.feat-banner{margin:0 .75rem;padding:2rem 1.25rem;background:rgba(255,255,255,.7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(11,110,79,.08)}
.feat-banner h2{font-size:clamp(1.25rem,5vw,1.75rem);text-wrap:balance}

/* === TRUST section === */
.trust-i{gap:1.5rem;padding:1.25rem 1rem;background:rgba(255,255,255,.5);border-radius:var(--r)}
.t-item{font-size:.78rem}

/* === INDUSTRY BAR: static wrap on mobile === */
.industry-scroll{flex-wrap:wrap;justify-content:center;animation:none;width:auto}

/* === TECH ICONS mobile === */
.tech-icons{gap:1.25rem}
.tech-bubble{width:44px;height:44px}
.tech-bubble svg{width:20px;height:20px}

/* === SCROLL-DRIVEN FADE-IN (progressive enhancement) === */
@supports(animation-timeline:view()){
  .reveal{animation:mobileReveal linear both;animation-timeline:view();animation-range:entry 0% entry 30%}
  @keyframes mobileReveal{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
}

}

/* ============================================
   AI SERVICES PAGE — PREMIUM MOBILE
   ============================================ */
@media(max-width:768px){

/* AI Hero: deep purple gradient, centered, premium */
.ai-hero{min-height:auto;padding:calc(var(--nh) + 2rem) 1.5rem 2.5rem;text-align:center;background:linear-gradient(165deg,#1a0533 0%,#2d1b69 40%,#1B4965 100%)}
.ai-hero::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--ai),var(--bl),transparent)}
.ai-hero-inner{grid-template-columns:1fr;gap:1.5rem;text-align:center}
.ai-hero h1{text-align:center;text-wrap:balance;font-size:clamp(2.1rem,7.5vw,2.85rem);letter-spacing:-.02em;line-height:1.12}
.ai-hero .hero-sub{text-align:center;margin:0 auto 1.5rem;font-size:.95rem;line-height:1.7}
.ai-hero .hero-badge{margin:0 auto 1.25rem;box-shadow:0 2px 8px rgba(124,58,237,.15)}
.ai-hero .hero-act{flex-direction:column;align-items:stretch;gap:.75rem}
.ai-hero .btn-p{min-height:60px;justify-content:center;font-size:1.05rem;padding:1rem 1.5rem;background:linear-gradient(135deg,var(--ai),#9333EA);box-shadow:0 4px 16px rgba(124,58,237,.3);border:none}
.ai-hero .btn-s{min-height:56px;justify-content:center;font-size:1rem;padding:1rem 1.5rem;background:rgba(255,255,255,.08);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.15)}

/* Hide heavy orbital animation and animated SVG on mobile */
.orbital-wrap,.feat-svg{display:none!important}

/* AI Pain Cards: glass effect with purple accent */
.ai-pain{padding:3rem 1.25rem}
.ai-pain-grid{grid-template-columns:1fr;gap:1rem}
.ai-pain-card{border-left:3px solid var(--ai);padding:1.25rem;background:rgba(255,255,255,.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:var(--r);box-shadow:0 2px 12px rgba(124,58,237,.06)}

/* AI Stats: 2x2 grid with purple gradient background */
.ai-stats{padding:0 1rem}
.ai-stats-i{padding:2rem 1.25rem;gap:1rem;background:linear-gradient(135deg,#2d1b69 0%,var(--ai) 100%);border-radius:var(--rl);border:none;box-shadow:0 8px 32px rgba(124,58,237,.2)}
.ai-stats .stat-n{color:#fff!important}
.ai-stats .stat-l{color:rgba(255,255,255,.8)!important}

/* AI Timeline mobile */
.ai-timeline{padding:3rem 1.25rem}

/* AI CTA: full-width purple gradient */
.ai-cta{margin:0;padding:3rem 1.5rem;border-radius:0;background:linear-gradient(135deg,#1a0533 0%,#2d1b69 60%,var(--ai) 100%)}

}

/* TESTIMONIALS */
.testimonial-sec{padding:5rem 2rem;max-width:var(--mw);margin:0 auto}
.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.testimonial-card{background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rl);padding:2rem;position:relative;transition:all var(--t)}
.testimonial-card:hover{box-shadow:var(--smd);transform:translateY(-2px)}
.testimonial-card::before{content:'\201C';position:absolute;top:1rem;right:1.5rem;font-family:var(--fd);font-size:3rem;color:var(--al);line-height:1}
.testimonial-stars{display:flex;gap:2px;margin-bottom:1rem}
.testimonial-stars svg{width:16px;height:16px;fill:#F59E0B}
.testimonial-text{font-size:.9rem;color:var(--ts);line-height:1.7;margin-bottom:1.5rem;font-style:italic}
.testimonial-author{display:flex;align-items:center;gap:.75rem}
.testimonial-avatar{width:40px;height:40px;border-radius:50%;background:var(--ac);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem}
.testimonial-info h4{font-size:.85rem;font-weight:600;margin-bottom:2px}
.testimonial-info p{font-size:.78rem;color:var(--tm)}
@media(max-width:768px){.testimonial-grid{grid-template-columns:1fr}}

/* GEO BADGE */
.geo-badge{text-align:center;padding:0 2rem;max-width:var(--mw);margin:-1rem auto 2rem}
.geo-badge p{font-size:.95rem;color:var(--tm);font-weight:500}

/* CITY LINKS */
.city-links{text-align:center;padding:1.5rem 0;border-top:1px solid var(--bdl);margin-top:1rem}
.city-links a{font-size:.85rem;color:var(--ts);font-weight:500;transition:color var(--t);padding:0 .75rem}
.city-links a:hover{color:var(--ac)}
.city-links span{color:var(--bdl)}

/* CASE STUDY CARDS */
.cs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:1.5rem}
.cs-card{background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rl);overflow:hidden;transition:all var(--t)}
.cs-card:hover{box-shadow:var(--smd);transform:translateY(-2px)}
.cs-card-header{padding:1.5rem;background:linear-gradient(135deg,var(--ac),var(--bl));color:#fff}
.cs-card-header h3{font-size:1.1rem;font-weight:700;margin-bottom:.25rem}
.cs-card-header p{font-size:.82rem;opacity:.85}
.cs-card-body{padding:1.5rem}
.cs-card-body h4{font-size:.9rem;font-weight:700;color:var(--ac);margin-bottom:.5rem;text-transform:uppercase;letter-spacing:.05em}
.cs-card-body p{font-size:.875rem;color:var(--ts);line-height:1.6;margin-bottom:1rem}
.cs-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;padding:1rem 1.5rem;background:var(--bgw);border-top:1px solid var(--bdl)}
.cs-metric{text-align:center}
.cs-metric-val{font-family:var(--fd);font-size:1.5rem;color:var(--ac);font-weight:700}
.cs-metric-label{font-size:.72rem;color:var(--tm);font-weight:500}

/* PRICING TIERS */
.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem}
.pricing-card{background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rl);padding:2rem;text-align:center;transition:all var(--t)}
.pricing-card:hover{box-shadow:var(--smd);transform:translateY(-2px)}
.pricing-card.featured{border-color:var(--ac);position:relative}
.pricing-card.featured::before{content:'Most Popular';position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--ac);color:#fff;font-size:.72rem;font-weight:700;padding:.25rem 1rem;border-radius:100px;white-space:nowrap}
.pricing-card h3{font-size:1rem;font-weight:700;margin-bottom:.5rem}
.pricing-card .price{font-family:var(--fd);font-size:2rem;color:var(--ac);margin-bottom:.25rem}
.pricing-card .price-sub{font-size:.8rem;color:var(--tm);margin-bottom:1.5rem}
.pricing-card ul{list-style:none;text-align:left;margin-bottom:1.5rem}
.pricing-card ul li{font-size:.85rem;color:var(--ts);padding:.35rem 0;padding-left:1.25rem;position:relative}
.pricing-card ul li::before{content:'';position:absolute;left:0;top:.7em;width:6px;height:6px;background:var(--ac);border-radius:50%}

/* TL;DR BOX */
.tldr-box{background:var(--al);border:2px solid var(--ac);border-radius:var(--rl);padding:2rem;margin:2rem 0}
.tldr-box h3{font-size:1rem;font-weight:700;color:var(--ac);margin-bottom:.75rem;display:flex;align-items:center;gap:.5rem}
.tldr-box p{font-size:.95rem;color:var(--ts);line-height:1.7}

/* COMPARISON TABLE */
.comp-table{width:100%;border-collapse:collapse;margin:2rem 0;border-radius:var(--r);overflow:hidden;border:1px solid var(--bd)}
.comp-table th{background:var(--ac);color:#fff;padding:1rem;text-align:left;font-size:.85rem;font-weight:600}
.comp-table td{padding:.85rem 1rem;border-bottom:1px solid var(--bdl);font-size:.875rem;color:var(--ts)}
.comp-table tr:hover{background:var(--bgw)}
.comp-table tr:last-child td{border-bottom:none}
.comp-table .winner{color:var(--ac);font-weight:600}

/* ===== WEB DESIGN TAMPA — PREMIUM DARK MODE ===== */
/* ═══════════════════════════════════════════════════════════
   WD-PAGE: Cutting-edge editorial redesign
   ═══════════════════════════════════════════════════════════ */
.wd-page{background:#0a0a0f;color:#f5f5f7}

/* ── Rotating border animation ── */
@property --angle{syntax:'<angle>';initial-value:0deg;inherits:false}
@keyframes wd-rotate{to{--angle:360deg}}
@keyframes wd-fade-up{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes wd-scale-in{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}

/* ── Dark nav on hero ── */
.wd-page .nav:not(.scrolled){background:transparent}
.wd-page .nav:not(.scrolled) .logo{color:#fff}
.wd-page .nav:not(.scrolled) .n-link{color:rgba(255,255,255,.85)}
.wd-page .nav:not(.scrolled) .n-link:hover{color:#fff}
.wd-page .nav:not(.scrolled) .n-ph{color:rgba(255,255,255,.85)}
.wd-page .nav:not(.scrolled) .n-cta{border-color:rgba(255,255,255,.4);color:#fff}
.wd-page .nav:not(.scrolled) .n-cta:hover{background:rgba(255,255,255,.15);border-color:#fff}

/* ── HERO ── */
.wd-page .wd-hero-bg{background:#0a0a0f}
.wd-page .wd-hero-bg::before{background:radial-gradient(ellipse at 30% 70%,rgba(124,58,237,.18) 0%,transparent 55%),radial-gradient(circle at 70% 30%,rgba(167,139,250,.1) 0%,transparent 40%)}
.wd-page .wd-hero-bg::after{opacity:.025}
/* Grid lines overlay */
.wd-page .wd-hero::after{content:'';position:absolute;inset:0;z-index:0;background-image:linear-gradient(rgba(124,58,237,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(124,58,237,.04) 1px,transparent 1px);background-size:80px 80px;pointer-events:none}
.wd-page .wd-hero-i{grid-template-columns:1fr 1fr;text-align:left;gap:4rem}
.wd-page .wd-hero-text{max-width:600px;margin:0}
.wd-page .wd-hero-eyebrow{font-size:.7rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:1.5rem}
.wd-page .wd-hero h1{font-size:clamp(3.5rem,6vw,5rem);line-height:1.04;margin-bottom:1.5rem;font-weight:400;letter-spacing:-.03em;text-wrap:balance}
.wd-page .wd-hero h1 em{background:linear-gradient(135deg,#a78bfa,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-style:italic}
.wd-page .wd-hero-sub{font-size:1.1rem;color:rgba(255,255,255,.55);line-height:1.7;margin-bottom:2rem;max-width:460px}
/* Animated border CTA */
.wd-page .wd-btn-anim{display:inline-flex;align-items:center;gap:.6rem;padding:.95rem 2.25rem;font-size:.92rem;font-weight:600;color:#fff;border-radius:100px;position:relative;background:#0a0a0f;transition:transform .3s,box-shadow .3s;z-index:1}
.wd-page .wd-btn-anim::before{content:'';position:absolute;inset:-2px;border-radius:100px;background:conic-gradient(from var(--angle),#7c3aed,#a78bfa,#c4b5fd,#7c3aed);z-index:-1;animation:wd-rotate 3s linear infinite}
.wd-page .wd-btn-anim:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(124,58,237,.35)}
.wd-page .wd-btn-anim svg{width:18px;height:18px}
/* Fanned image stack */
.wd-page .wd-hero-stack{position:relative;width:100%;max-width:520px;margin:0 auto;aspect-ratio:16/10}
.wd-page .wd-stack-img{position:absolute;inset:0;border-radius:14px;overflow:hidden;box-shadow:0 25px 80px rgba(0,0,0,.6);transition:transform .5s cubic-bezier(.25,.46,.45,.94)}
.wd-page .wd-stack-img img{width:100%;height:100%;object-fit:cover}
.wd-page .wd-stack-img.back{transform:rotate(-6deg) translateX(-8%) translateY(4%);opacity:.45;filter:brightness(.7)}
.wd-page .wd-stack-img.mid{transform:rotate(-2deg) translateX(-3%) translateY(1%);opacity:.7;filter:brightness(.85)}
.wd-page .wd-stack-img.front{transform:rotate(2deg);opacity:1;box-shadow:0 25px 80px rgba(0,0,0,.6),0 0 80px rgba(124,58,237,.25);border:1px solid rgba(124,58,237,.2)}

/* ── SHOWCASE: Horizontal strip + bento grid ── */
.wd-page .wd-showcase{background:#111118;padding:6rem 0 5rem;border-radius:0;margin:0;max-width:100%;overflow:hidden}
.wd-page .wd-showcase .sec-h-ed{display:flex;align-items:flex-end;justify-content:space-between;max-width:var(--mw);margin:0 auto 3rem;padding:0 2rem;gap:2rem}
.wd-page .wd-showcase .sec-h-left{flex:1}
.wd-page .wd-showcase .sec-h-left .sec-l{display:inline-block;font-size:.72rem;font-weight:700;color:#7c3aed;text-transform:uppercase;letter-spacing:.2em;margin-bottom:.75rem}
.wd-page .wd-showcase .sec-h-left .sec-t{font-family:var(--fd);font-size:clamp(2rem,4vw,2.75rem);color:#f5f5f7;line-height:1.15;font-weight:700;margin-bottom:0}
.wd-page .wd-showcase .sec-h-left .sec-t em{color:#a78bfa;-webkit-text-fill-color:#a78bfa}
.wd-page .wd-showcase .sec-h-ed hr{flex:1;border:none;border-top:1px solid rgba(124,58,237,.2);margin:0 2rem .6rem}
.wd-page .wd-showcase .sec-h-stat{text-align:right;flex-shrink:0}
.wd-page .wd-showcase .sec-h-stat .stat-num{font-family:var(--fd);font-size:2rem;font-weight:700;color:#f5f5f7;line-height:1}
.wd-page .wd-showcase .sec-h-stat .stat-lbl{font-size:.72rem;color:rgba(255,255,255,.45);text-transform:uppercase;letter-spacing:.1em}
/* Horizontal scroll strip */
.wd-page .showcase-strip{display:flex;gap:1.5rem;padding:0 2rem 2rem;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.wd-page .showcase-strip::-webkit-scrollbar{display:none}
.wd-page .showcase-strip .showcase-card{flex:0 0 60vw;max-width:720px;scroll-snap-align:start;position:relative;border-radius:16px;overflow:hidden;cursor:pointer;transition:all .4s cubic-bezier(.25,.46,.45,.94);border:1px solid rgba(124,58,237,.1);background:#1a1a24}
.wd-page .showcase-strip .showcase-card:hover{border-color:rgba(124,58,237,.4);box-shadow:0 0 60px rgba(124,58,237,.2)}
.wd-page .showcase-strip .showcase-card img{width:100%;height:auto;display:block;transition:transform .5s}
.wd-page .showcase-strip .showcase-card:hover img{transform:scale(1.03)}
.wd-page .showcase-strip .showcase-card .showcase-frost{position:absolute;inset:0;background:rgba(10,10,15,.6);backdrop-filter:blur(6px);opacity:0;transition:opacity .4s;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem}
.wd-page .showcase-strip .showcase-card:hover .showcase-frost{opacity:1}
.wd-page .showcase-strip .showcase-frost .frost-label{font-size:.7rem;font-weight:700;color:#a78bfa;text-transform:uppercase;letter-spacing:.15em}
.wd-page .showcase-strip .showcase-frost .frost-name{font-family:var(--fd);font-size:1.5rem;color:#fff;font-weight:700}
.wd-page .showcase-strip .showcase-frost .frost-link{font-size:.82rem;color:rgba(255,255,255,.7);margin-top:.25rem;text-decoration:underline;text-underline-offset:3px}
/* Bento grid */
.wd-page .showcase-bento{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;max-width:var(--mw);margin:0 auto;padding:0 2rem}
.wd-page .showcase-bento .bento-item{position:relative;border-radius:14px;overflow:hidden;cursor:pointer;transition:all .4s;border:1px solid rgba(124,58,237,.1);background:#1a1a24}
.wd-page .showcase-bento .bento-item:first-child{grid-column:span 2}
.wd-page .showcase-bento .bento-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
.wd-page .showcase-bento .bento-item:hover{border-color:rgba(124,58,237,.4);box-shadow:0 0 40px rgba(124,58,237,.2);transform:translateY(-4px)}
.wd-page .showcase-bento .bento-item:hover img{transform:scale(1.03)}
.wd-page .showcase-bento .bento-label{position:absolute;bottom:0;left:0;right:0;padding:1rem 1.25rem;background:linear-gradient(transparent,rgba(0,0,0,.8));display:flex;flex-direction:column;gap:2px}
.wd-page .showcase-bento .bento-industry{font-size:.7rem;font-weight:700;color:#a78bfa;text-transform:uppercase;letter-spacing:.1em}
.wd-page .showcase-bento .bento-name{font-size:.95rem;font-weight:700;color:#fff}

/* ── STATS: Oversized serif counters ── */
.wd-page .wd-stats{background:#0a0a0f;padding:5rem 2rem;border-top:none;position:relative;overflow:hidden}
.wd-page .wd-stats::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(124,58,237,.3) 50%,transparent)}
.wd-page .wd-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;max-width:var(--mw);margin:0 auto;text-align:center;position:relative}
.wd-page .wd-stat{position:relative;padding:1.5rem 0}
.wd-page .wd-stat:not(:last-child)::after{content:'';position:absolute;right:0;top:20%;height:60%;width:1px;background:rgba(124,58,237,.2)}
/* Watermark number */
.wd-page .wd-stat-watermark{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:var(--fd);font-size:clamp(6rem,12vw,10rem);font-weight:400;color:rgba(255,255,255,.02);line-height:1;pointer-events:none;white-space:nowrap}
.wd-page .wd-stat-val{font-family:var(--fd);font-size:clamp(3rem,5vw,4.5rem);font-weight:400;color:#fff;line-height:1.1;margin-bottom:.35rem;position:relative}
.wd-page .wd-stat-lbl{font-size:.78rem;color:rgba(255,255,255,.45);line-height:1.4;max-width:180px;margin:0 auto}

/* ── FEATURES: Bento glassmorphism grid ── */
.wd-page .wd-features-sec{background:#111118;padding:6rem 2rem;border-radius:0;margin:0;max-width:100%}
.wd-page .wd-features-sec .sec-h{text-align:center;margin-bottom:3.5rem}
.wd-page .wd-features-sec .sec-l{display:inline-block;font-size:.72rem;font-weight:700;color:#7c3aed;text-transform:uppercase;letter-spacing:.2em;margin-bottom:.75rem;background:rgba(124,58,237,.1);padding:.35rem .85rem;border-radius:100px}
.wd-page .wd-features-sec .sec-t{font-family:var(--fd);font-size:clamp(2rem,4vw,2.75rem);color:#f5f5f7;line-height:1.15;font-weight:700;margin-bottom:1rem}
.wd-page .wd-features-sec .sec-t em{color:#a78bfa;-webkit-text-fill-color:#a78bfa}
.wd-page .wd-features-sec .sec-d{font-size:1rem;color:rgba(255,255,255,.5);max-width:560px;margin:0 auto}
.wd-page .wd-features-bento{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;max-width:var(--mw);margin:0 auto}
.wd-page .wd-feat-card{background:rgba(26,26,36,.8);backdrop-filter:blur(12px);border:1px solid rgba(124,58,237,.1);border-radius:16px;padding:2rem;transition:all .4s;position:relative;overflow:hidden}
.wd-page .wd-feat-card::before{content:'';position:absolute;inset:0;border-radius:16px;border:1px solid transparent;background:conic-gradient(from var(--angle),transparent 40%,rgba(124,58,237,.3) 50%,transparent 60%) border-box;-webkit-mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .4s;animation:wd-rotate 4s linear infinite}
.wd-page .wd-feat-card:hover::before{opacity:1}
.wd-page .wd-feat-card:hover{box-shadow:0 0 40px rgba(124,58,237,.15);transform:translateY(-4px)}
.wd-page .wd-feat-card:first-child{grid-column:span 2}
.wd-page .wd-feat-card:last-child{grid-column:span 3}
.wd-page .wd-feat-card .feat-icon{width:48px;height:48px;border-radius:12px;background:linear-gradient(135deg,rgba(124,58,237,.15),rgba(167,139,250,.1));display:flex;align-items:center;justify-content:center;margin-bottom:1.25rem}
.wd-page .wd-feat-card .feat-icon svg{stroke:#a78bfa;width:24px;height:24px}
.wd-page .wd-feat-card strong{display:block;font-size:1.05rem;color:#f5f5f7;margin-bottom:.5rem}
.wd-page .wd-feat-card .feat-desc{font-size:.88rem;color:rgba(255,255,255,.5);line-height:1.6}

/* ── FAQ: Two-column editorial ── */
.wd-page .wd-faq-sec{background:#0a0a0f;padding:6rem 2rem;border-radius:0;margin:0;max-width:100%}
.wd-page .wd-faq-inner{display:grid;grid-template-columns:1fr 1.4fr;gap:4rem;max-width:var(--mw);margin:0 auto;align-items:start}
.wd-page .wd-faq-left{position:sticky;top:calc(var(--nh) + 2rem)}
.wd-page .wd-faq-left .sec-l{display:inline-block;font-size:.72rem;font-weight:700;color:#7c3aed;text-transform:uppercase;letter-spacing:.2em;margin-bottom:.75rem}
.wd-page .wd-faq-left .sec-t{font-family:var(--fd);font-size:clamp(2rem,3.5vw,2.5rem);color:#f5f5f7;line-height:1.15;font-weight:700;margin-bottom:1.25rem}
.wd-page .wd-faq-left .sec-t em{color:#a78bfa;-webkit-text-fill-color:#a78bfa}
.wd-page .wd-faq-left .faq-help{font-size:.88rem;color:rgba(255,255,255,.45)}
.wd-page .wd-faq-left .faq-help a{color:#a78bfa;text-decoration:underline;text-underline-offset:3px}
.wd-page .wd-faq-left .faq-help a:hover{color:#c4b5fd}
.wd-page .faq-list-ed .faq-item{background:transparent;border:none;border-bottom:1px solid rgba(124,58,237,.12);border-radius:0;margin-bottom:0}
.wd-page .faq-list-ed .faq-item:hover{border-bottom-color:rgba(124,58,237,.3)}
.wd-page .faq-list-ed .faq-q{color:#f5f5f7;padding:1.5rem 0;font-size:1rem}
.wd-page .faq-list-ed .faq-q::after{color:#7c3aed;transition:transform .3s}
.wd-page .faq-list-ed .faq-item[open] .faq-q::after{transform:rotate(45deg)}
.wd-page .faq-list-ed .faq-a{padding:0 0 1.5rem}
.wd-page .faq-list-ed .faq-a p{color:rgba(255,255,255,.6);font-size:.9rem;line-height:1.7}

/* ── CTA: Magazine split layout ── */
.wd-page .wd-cta{display:grid;grid-template-columns:1fr 1fr;border-radius:0;margin:0;max-width:100%}
.wd-page .wd-cta-left{background:#0a0a0f;padding:5rem 4rem;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.wd-page .wd-cta-left::after{content:'';position:absolute;bottom:-60px;right:-60px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(124,58,237,.2),transparent 70%);pointer-events:none}
.wd-page .wd-cta-left .sec-l{display:inline-block;font-size:.72rem;font-weight:700;color:#7c3aed;text-transform:uppercase;letter-spacing:.2em;margin-bottom:.75rem;width:fit-content}
.wd-page .wd-cta-left .cta-headline{font-family:var(--fd);font-size:clamp(2rem,3.5vw,2.75rem);color:#f5f5f7;line-height:1.15;font-weight:700;margin-bottom:1.5rem}
.wd-page .wd-cta-left .cta-headline em{background:linear-gradient(135deg,#a78bfa,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-style:italic}
.wd-page .wd-cta-left .cta-contacts{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}
.wd-page .wd-cta-left .cta-contact-item{display:flex;align-items:center;gap:.75rem;font-size:.88rem;color:rgba(255,255,255,.6)}
.wd-page .wd-cta-left .cta-contact-item svg{width:18px;height:18px;stroke:rgba(255,255,255,.4);flex-shrink:0}
.wd-page .wd-cta-left .cta-contact-item a{color:rgba(255,255,255,.7);transition:color .2s}
.wd-page .wd-cta-left .cta-contact-item a:hover{color:#fff}
.wd-page .wd-cta-right{background:#111118;padding:5rem 4rem;display:flex;flex-direction:column;justify-content:center}
.wd-page .wd-cta-right .cta-form{display:flex;flex-direction:column;gap:.85rem}
.wd-page .wd-cta-right .form-row{display:grid;grid-template-columns:1fr 1fr;gap:.85rem}
.wd-page .wd-cta-right label{font-size:.72rem;font-weight:600;color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.2rem;display:block}
.wd-page .wd-cta-right input,.wd-page .wd-cta-right textarea{width:100%;padding:.8rem 1rem;background:rgba(255,255,255,.05);border:1px solid rgba(124,58,237,.15);border-radius:10px;color:#fff;font-family:var(--f);font-size:.9rem;transition:all .3s}
.wd-page .wd-cta-right input::placeholder,.wd-page .wd-cta-right textarea::placeholder{color:rgba(255,255,255,.3)}
.wd-page .wd-cta-right input:focus,.wd-page .wd-cta-right textarea:focus{outline:none;border-color:rgba(124,58,237,.5);box-shadow:0 0 20px rgba(124,58,237,.1);background:rgba(255,255,255,.08)}
.wd-page .wd-cta-right textarea{min-height:100px;resize:vertical}
.wd-page .wd-cta-right .btn-submit{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;width:100%;padding:.95rem 2rem;font-size:.92rem;font-weight:600;color:#fff;border:none;border-radius:100px;position:relative;background:#0a0a0f;cursor:pointer;transition:transform .3s,box-shadow .3s;margin-top:.5rem;font-family:var(--f)}
.wd-page .wd-cta-right .btn-submit::before{content:'';position:absolute;inset:-2px;border-radius:100px;background:conic-gradient(from var(--angle),#7c3aed,#a78bfa,#c4b5fd,#7c3aed);z-index:-1;animation:wd-rotate 3s linear infinite}
.wd-page .wd-cta-right .btn-submit:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(124,58,237,.35)}
.wd-page .wd-cta-right .cta-trust{text-align:center;font-size:.78rem;color:rgba(255,255,255,.35);margin-top:1rem}

/* ── Lightbox navigation ── */
.showcase-nav{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:50%;color:#fff;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s;z-index:2001;backdrop-filter:blur(8px)}
.showcase-nav:hover{background:rgba(255,255,255,.25)}
.showcase-nav.prev{left:1.5rem}
.showcase-nav.next{right:1.5rem}
.showcase-counter{position:absolute;bottom:1.5rem;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.7);font-size:.85rem;font-weight:500;z-index:2001}

/* ── Responsive: wd-page ── */
@media(max-width:1024px){
.wd-page .wd-hero-i{grid-template-columns:1fr;text-align:center;gap:2.5rem}
.wd-page .wd-hero-text{max-width:640px;margin:0 auto}
.wd-page .wd-hero-sub{margin:0 auto 2rem}
.wd-page .wd-hero-eyebrow{text-align:center}
.wd-page .wd-hero-act{justify-content:center}
.wd-page .wd-hero-stack{max-width:420px}
.wd-page .wd-features-bento{grid-template-columns:repeat(2,1fr)}
.wd-page .wd-feat-card:first-child{grid-column:span 2}
.wd-page .wd-feat-card:last-child{grid-column:span 2}
.wd-page .wd-stats-grid{grid-template-columns:repeat(2,1fr)}
.wd-page .wd-stat:not(:last-child)::after{display:none}
.wd-page .wd-faq-inner{grid-template-columns:1fr;gap:2rem}
.wd-page .wd-faq-left{position:static}
.wd-page .wd-cta{grid-template-columns:1fr}
.wd-page .wd-cta-left{padding:4rem 2rem}
.wd-page .wd-cta-right{padding:4rem 2rem}
}
@media(max-width:768px){
.wd-page .wd-hero{min-height:auto;padding:calc(var(--nh) + 2.5rem) 1.5rem 2.5rem}
.wd-page .wd-hero-stack{max-width:320px}
.wd-page .wd-stack-img.back{display:none}
.wd-page .wd-stack-img.mid{display:none}
.wd-page .wd-stack-img.front{transform:none}
.wd-page .wd-showcase{padding:4rem 0 3.5rem}
.wd-page .wd-showcase .sec-h-ed{flex-direction:column;align-items:flex-start;padding:0 1.5rem;margin-bottom:2rem}
.wd-page .wd-showcase .sec-h-ed hr{display:none}
.wd-page .showcase-strip .showcase-card{flex:0 0 85vw}
.wd-page .showcase-strip{padding:0 1.5rem 1.5rem}
.wd-page .showcase-bento{grid-template-columns:1fr;padding:0 1.5rem}
.wd-page .showcase-bento .bento-item:first-child{grid-column:span 1}
.wd-page .wd-stats{padding:3.5rem 1.5rem}
.wd-page .wd-stats-grid{grid-template-columns:1fr 1fr;gap:1.5rem}
.wd-page .wd-stat-watermark{font-size:4rem}
.wd-page .wd-features-sec{padding:4rem 1.5rem}
.wd-page .wd-features-bento{grid-template-columns:1fr}
.wd-page .wd-feat-card:first-child,.wd-page .wd-feat-card:last-child{grid-column:span 1}
.wd-page .wd-faq-sec{padding:4rem 1.5rem}
.wd-page .wd-cta-left{padding:3rem 1.5rem}
.wd-page .wd-cta-right{padding:3rem 1.5rem}
.wd-page .wd-cta-right .form-row{grid-template-columns:1fr}
.showcase-nav{width:36px;height:36px;font-size:1.2rem}
.showcase-nav.prev{left:.75rem}
.showcase-nav.next{right:.75rem}
}