/* XtremeIPTVHD.live — Custom Overrides */

/* LOGO */
.logo-icon-new{width:42px;height:42px;flex-shrink:0;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 2px 8px rgba(8,145,178,.45));transition:filter .3s}
.nav-logo:hover .logo-icon-new{filter:drop-shadow(0 4px 14px rgba(103,232,249,.65))}
.logo-text-new{font-family:'Sora',sans-serif;font-weight:800;font-size:1.3rem;letter-spacing:-.04em;color:var(--text-primary);line-height:1}
.logo-text-new span{background:linear-gradient(135deg,#0891b2 0%,#67e8f9 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.footer-logo .logo-text-new{color:#fff}
.footer-logo .logo-text-new span{background:linear-gradient(135deg,#67e8f9 0%,#a5f3fc 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
[data-theme="dark"] .nav-logo .logo-text-new{color:#ecfeff}

/* HERO BG */


/* HERO SLIDER */
.hero-img-slider{border-radius:20px;overflow:hidden;aspect-ratio:16/11;position:relative;box-shadow:0 0 0 1px rgba(255,255,255,.14),0 24px 64px rgba(0,0,0,.55),0 8px 24px rgba(8,145,178,.3)}
.img-slide{position:absolute;inset:0;opacity:0;transition:opacity .8s ease;display:flex;align-items:center;justify-content:center;overflow:hidden}
.img-slide.active{opacity:1}
.slide-img{width:100%;height:100%;object-fit:cover;object-position:center}
.slide-img-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,20,.72) 0%,rgba(0,0,20,.15) 50%,transparent 100%);pointer-events:none}

/* FEATURE CARDS GLASS */
.feature-card{background:rgba(255,255,255,.6);backdrop-filter:blur(22px) saturate(180%);-webkit-backdrop-filter:blur(22px) saturate(180%);border:1px solid rgba(255,255,255,.8);border-radius:20px;padding:32px 28px;position:relative;overflow:hidden;transition:all .35s cubic-bezier(.4,0,.2,1);box-shadow:0 8px 32px rgba(8,145,178,.07),inset 0 1px 0 rgba(255,255,255,.9)}
.feature-card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(103,232,249,.55),transparent)}
.feature-card:hover{transform:translateY(-8px) scale(1.01);box-shadow:0 24px 56px rgba(8,145,178,.18),inset 0 1px 0 rgba(255,255,255,.95);border-color:rgba(103,232,249,.45);background:rgba(255,255,255,.75)}
[data-theme="dark"] .feature-card{background:rgba(14,77,92,.62);border-color:rgba(103,232,249,.18);box-shadow:0 8px 32px rgba(0,0,0,.28),inset 0 1px 0 rgba(103,232,249,.08)}
[data-theme="dark"] .feature-card:hover{background:rgba(14,77,92,.82);border-color:rgba(103,232,249,.38);box-shadow:0 24px 56px rgba(0,0,0,.48)}

/* PRICING CARDS GLASS */
.pricing-card.glass-card{background:rgba(255,255,255,.62);backdrop-filter:blur(26px) saturate(200%);-webkit-backdrop-filter:blur(26px) saturate(200%);border:1px solid rgba(255,255,255,.82);border-radius:24px;box-shadow:0 12px 40px rgba(8,145,178,.1),inset 0 1px 0 rgba(255,255,255,.95);transition:all .35s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}
.pricing-card.glass-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,rgba(8,145,178,.4),rgba(103,232,249,.6),transparent)}
.pricing-card.glass-card:hover{transform:translateY(-10px);box-shadow:0 28px 64px rgba(8,145,178,.2),inset 0 1px 0 rgba(255,255,255,1);border-color:rgba(103,232,249,.5)}
.pricing-card.glass-card.popular{background:rgba(255,255,255,.78);border-color:rgba(8,145,178,.38);box-shadow:0 16px 56px rgba(8,145,178,.22),inset 0 1px 0 rgba(255,255,255,1)}
.pricing-card.glass-card.popular::before{background:linear-gradient(90deg,#0891b2,#67e8f9,#0891b2);height:3px}
[data-theme="dark"] .pricing-card.glass-card{background:rgba(14,77,92,.68);border-color:rgba(103,232,249,.18);box-shadow:0 12px 40px rgba(0,0,0,.32),inset 0 1px 0 rgba(103,232,249,.07)}
[data-theme="dark"] .pricing-card.glass-card.popular{background:rgba(14,77,92,.78);border-color:rgba(8,145,178,.48)}

/* DEVICES GRID */
.devices-grid-new{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
@media(max-width:768px){.devices-grid-new{grid-template-columns:repeat(2,1fr);gap:14px}}
@media(max-width:480px){.devices-grid-new{grid-template-columns:repeat(2,1fr);gap:12px}}
.device-card-new{background:rgba(255,255,255,.62);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(255,255,255,.8);border-radius:20px;padding:28px 20px 22px;text-align:center;position:relative;overflow:hidden;transition:all .35s cubic-bezier(.4,0,.2,1);box-shadow:0 6px 24px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.9)}
.device-card-new::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,rgba(var(--device-color-rgb),0),rgba(var(--device-color-rgb),.7),rgba(var(--device-color-rgb),0));opacity:0;transition:opacity .35s}
.device-card-new:hover{transform:translateY(-8px);box-shadow:0 20px 48px rgba(var(--device-color-rgb),.18),inset 0 1px 0 rgba(255,255,255,1);border-color:rgba(var(--device-color-rgb),.35)}
.device-card-new:hover::before{opacity:1}
[data-theme="dark"] .device-card-new{background:rgba(14,77,92,.65);border-color:rgba(var(--device-color-rgb),.15);box-shadow:0 6px 24px rgba(0,0,0,.28)}
[data-theme="dark"] .device-card-new:hover{box-shadow:0 20px 48px rgba(0,0,0,.4),0 0 0 1px rgba(var(--device-color-rgb),.3)}
.device-icon-new{width:80px;height:80px;background:linear-gradient(135deg,rgba(var(--device-color-rgb),.12),rgba(var(--device-color-rgb),.06));border:1.5px solid rgba(var(--device-color-rgb),.25);border-radius:20px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;transition:all .35s;position:relative;z-index:1}
.device-card-new:hover .device-icon-new{background:linear-gradient(135deg,rgba(var(--device-color-rgb),.22),rgba(var(--device-color-rgb),.1));border-color:rgba(var(--device-color-rgb),.5);transform:scale(1.08) rotate(-2deg)}
.device-name-new{font-family:'Sora',sans-serif;font-weight:700;font-size:.95rem;color:var(--text-primary);margin-bottom:4px}
.device-desc-new{font-size:.75rem;color:var(--text-muted);font-weight:500}
.device-css-icon{position:relative;width:52px;height:52px;display:flex;align-items:center;justify-content:center}

/* Smart TV */
.smarttv-icon{flex-direction:column;gap:0}
.tv-body{width:44px;height:28px;background:var(--device-color,#1e40af);border-radius:4px;display:flex;align-items:center;justify-content:center}
.tv-screen{width:36px;height:22px;background:rgba(0,0,0,.7);border-radius:2px;display:flex;align-items:center;justify-content:center}
.tv-play{width:0;height:0;border-style:solid;border-width:5px 0 5px 9px;border-color:transparent transparent transparent rgba(255,255,255,.8)}
.tv-stand{width:3px;height:6px;background:var(--device-color,#1e40af);margin:0 auto;opacity:.7}
.tv-base{width:18px;height:3px;background:var(--device-color,#1e40af);border-radius:2px;margin:0 auto;opacity:.6}

/* Android Robot */
.android-icon{position:relative;width:40px;height:48px}
.android-head{width:26px;height:14px;background:#16a34a;border-radius:13px 13px 0 0;position:absolute;top:2px;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:6px}
.android-eye{width:4px;height:4px;background:#fff;border-radius:50%;margin-top:3px}
.android-body{width:26px;height:18px;background:#16a34a;border-radius:0 0 6px 6px;position:absolute;top:16px;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center}
.android-stripe{width:14px;height:2px;background:rgba(255,255,255,.4)}
.android-arm{width:5px;height:13px;background:#16a34a;border-radius:3px;position:absolute;top:16px}
.android-arm-l{left:3px}.android-arm-r{right:3px}
.android-leg{width:5px;height:12px;background:#16a34a;border-radius:3px;position:absolute;bottom:0}
.android-leg-l{left:10px}.android-leg-r{right:10px}

/* Firestick */
.firestick-icon{flex-direction:column;align-items:center;gap:4px}
.fire-stick-body{width:38px;height:14px;background:#001a1f;border-radius:7px;display:flex;align-items:center;justify-content:flex-end;padding-right:5px}
.fire-stick-port{width:4px;height:8px;background:#e17000;border-radius:2px}
.fire-flame{position:relative;width:16px;height:22px;display:flex;align-items:center;justify-content:center}
.flame-outer{position:absolute;width:14px;height:20px;background:#e17000;border-radius:50% 50% 30% 30%/60% 60% 40% 40%;animation:flameFlicker 1.2s ease-in-out infinite alternate}
.flame-inner{position:absolute;width:8px;height:12px;background:#ffcc00;border-radius:50% 50% 30% 30%/60% 60% 40% 40%;bottom:2px}
@keyframes flameFlicker{0%{transform:scaleX(1) scaleY(1)}100%{transform:scaleX(.9) scaleY(1.05)}}

/* iPhone */
.phone-icon{align-items:center;justify-content:center}
.phone-body{width:28px;height:48px;background:#374151;border-radius:8px;display:flex;flex-direction:column;align-items:center;padding:5px 3px;gap:3px;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.15)}
.phone-notch{width:10px;height:4px;background:#1a1a1a;border-radius:3px;flex-shrink:0}
.phone-screen{flex:1;width:100%;background:linear-gradient(135deg,#001a1f,#0891b2);border-radius:3px;display:flex;align-items:flex-start;justify-content:center;padding-top:4px}
.phone-signal{display:flex;align-items:flex-end;gap:1.5px}
.phone-signal span{display:block;width:2px;background:rgba(255,255,255,.7);border-radius:1px}
.phone-signal span:nth-child(1){height:4px}.phone-signal span:nth-child(2){height:6px}.phone-signal span:nth-child(3){height:8px}
.phone-home-bar{width:12px;height:3px;background:rgba(255,255,255,.3);border-radius:2px;flex-shrink:0}

/* Windows */
.windows-icon{flex-direction:column;align-items:center;gap:2px}
.win-logo{display:grid;grid-template-columns:1fr 1fr;gap:2px;width:22px;height:22px}
.win-pane{border-radius:1.5px}
.win-pane-1{background:#f35325}.win-pane-2{background:#81bc06}.win-pane-3{background:#05a6f0}.win-pane-4{background:#ffba08}
.win-laptop-base{width:36px;height:5px;background:#0078d4;border-radius:1px 1px 3px 3px;margin-top:4px}
.win-laptop-kb{width:42px;height:3px;background:rgba(8,145,178,.4);border-radius:2px}

/* Mac */
.mac-icon{flex-direction:column;align-items:center;gap:0}
.mac-screen-wrapper{width:40px;height:28px;background:#374151;border-radius:4px 4px 0 0;display:flex;flex-direction:column;overflow:hidden}
.mac-notch-bar{width:100%;height:4px;background:#1f2937;display:flex;align-items:center;padding-left:4px;gap:2px}
.mac-notch-bar::before,.mac-notch-bar::after{content:'';width:3px;height:3px;background:rgba(255,255,255,.25);border-radius:50%}
.mac-screen{flex:1;background:linear-gradient(135deg,#001a1f,#0e4d5c);display:flex;align-items:center;justify-content:center}
.mac-finder{width:14px;height:10px;border-radius:2px;background:linear-gradient(135deg,#22d3ee,#60a5fa);opacity:.7}
.mac-chin{width:40px;height:3px;background:#4b5563}
.mac-base{width:46px;height:4px;background:#6b7280;border-radius:0 0 3px 3px;display:flex;align-items:center;justify-content:center}
.mac-base-inner{width:14px;height:2px;background:rgba(255,255,255,.2);border-radius:1px}

/* Android Phone */
.android-phone-icon{align-items:center;justify-content:center}
.aphone-body{width:30px;height:50px;background:#1f2937;border-radius:8px;display:flex;flex-direction:column;align-items:center;padding:4px 3px 6px;gap:3px;box-shadow:inset 0 0 0 1.5px rgba(52,211,153,.25)}
.aphone-camera{width:6px;height:6px;background:#374151;border-radius:50%;border:1.5px solid #34d399;flex-shrink:0}
.aphone-screen{flex:1;width:100%;background:linear-gradient(135deg,#064e3b,#065f46);border-radius:3px;display:flex;align-items:center;justify-content:center}
.aphone-app-grid{display:grid;grid-template-columns:1fr 1fr;gap:3px}
.aphone-app-grid span{width:6px;height:6px;background:rgba(52,211,153,.6);border-radius:1.5px}
.aphone-nav-bar{width:16px;height:3px;background:rgba(52,211,153,.35);border-radius:2px}

/* MAG Box */
.mag-icon{flex-direction:column;align-items:center;gap:4px}
.mag-body{width:40px;height:18px;background:#0e4d5c;border-radius:4px;display:flex;align-items:center;justify-content:space-between;padding:0 6px;box-shadow:inset 0 0 0 1px rgba(139,92,246,.3)}
.mag-lights{display:flex;gap:3px;align-items:center}
.mag-lights span{width:3px;height:3px;border-radius:50%}
.mag-lights span:nth-child(1){background:#ef4444;animation:blink 1.5s infinite}
.mag-lights span:nth-child(2){background:#22c55e;animation:blink 1.5s .5s infinite}
.mag-lights span:nth-child(3){background:#22d3ee;animation:blink 1.5s 1s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}
.mag-port{width:4px;height:8px;background:#7c3aed;border-radius:1px}
.mag-remote{width:16px;height:28px;background:#2d2d4e;border-radius:4px;display:flex;align-items:center;justify-content:center}
.mag-btn{width:8px;height:8px;background:#8b5cf6;border-radius:50%;opacity:.8}
.delay-7{animation-delay:.7s!important}.delay-8{animation-delay:.8s!important}

/* CTA SECTION */
.cta-section-new{position:relative;overflow:hidden;padding:110px 0;isolation:isolate}
[data-theme="light"] .cta-section-new{background:linear-gradient(135deg,#d0f5fa 0%,#e0fdfb 40%,#ccf8f8 70%,#d8fffe 100%)}
[data-theme="dark"] .cta-section-new{background:linear-gradient(135deg,#001a1f 0%,#02252c 40%,#001a1f 70%,#011e24 100%)}
.cta-wave-bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.cta-wave-svg{width:100%;height:100%;position:absolute;inset:0}
[data-theme="light"] .cta-wave-1{fill:rgba(8,145,178,.2);animation:waveDrift 8s ease-in-out infinite}
[data-theme="light"] .cta-wave-2{fill:rgba(34,211,238,.15);animation:waveDrift 10s ease-in-out infinite reverse}
[data-theme="light"] .cta-wave-3{fill:rgba(103,232,249,.25);animation:waveDrift 12s ease-in-out infinite 2s}
[data-theme="dark"] .cta-wave-1{fill:rgba(8,145,178,.18);animation:waveDrift 8s ease-in-out infinite}
[data-theme="dark"] .cta-wave-2{fill:rgba(14,77,92,.35);animation:waveDrift 10s ease-in-out infinite reverse}
[data-theme="dark"] .cta-wave-3{fill:rgba(8,145,178,.12);animation:waveDrift 12s ease-in-out infinite 2s}
@keyframes waveDrift{0%,100%{transform:translateX(0) translateY(0)}33%{transform:translateX(-20px) translateY(10px)}66%{transform:translateX(15px) translateY(-8px)}}
[data-theme="dark"] .cta-podium{fill:rgba(8,145,178,.2)!important}
[data-theme="dark"] .cta-podium-shadow{fill:rgba(14,77,92,.35)!important}
.cta-orb{position:absolute;border-radius:50%;filter:blur(70px);pointer-events:none;z-index:1}
.cta-orb-1{width:500px;height:500px;top:-120px;left:-100px;animation:orbDrift 14s ease-in-out infinite}
.cta-orb-2{width:380px;height:380px;bottom:-80px;right:-80px;animation:orbDrift 16s ease-in-out infinite reverse}
.cta-orb-3{width:260px;height:260px;top:50%;left:50%;transform:translate(-50%,-50%);animation:orbDrift 11s ease-in-out infinite 2s}
[data-theme="light"] .cta-orb-1{background:rgba(8,145,178,.18)}
[data-theme="light"] .cta-orb-2{background:rgba(34,211,238,.14)}
[data-theme="light"] .cta-orb-3{background:rgba(103,232,249,.12)}
[data-theme="dark"] .cta-orb-1{background:rgba(8,145,178,.3)}
[data-theme="dark"] .cta-orb-2{background:rgba(14,77,92,.45)}
[data-theme="dark"] .cta-orb-3{background:rgba(34,211,238,.18)}
@keyframes orbDrift{0%,100%{transform:translate(0,0)}50%{transform:translate(30px,-20px)}}
.cta-content-new{text-align:center;position:relative;z-index:2;max-width:700px;margin:0 auto}
.cta-badge-new{display:inline-flex;align-items:center;gap:8px;font-size:.73rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:7px 20px;border-radius:100px;margin-bottom:24px;backdrop-filter:blur(10px)}
[data-theme="light"] .cta-badge-new{color:#0891b2;background:rgba(8,145,178,.1);border:1px solid rgba(8,145,178,.25)}
[data-theme="dark"] .cta-badge-new{color:#67e8f9;background:rgba(8,145,178,.15);border:1px solid rgba(34,211,238,.3)}
.cta-live-dot{width:7px;height:7px;background:#22c55e;border-radius:50%;animation:ctaPulse 1.5s ease-in-out infinite;flex-shrink:0}
@keyframes ctaPulse{0%,100%{box-shadow:0 0 0 0 rgba(34,197,94,.6)}50%{box-shadow:0 0 0 6px rgba(34,197,94,0)}}
.cta-title-new{font-family:'Sora',sans-serif;font-size:clamp(2rem,4.5vw,3.2rem);font-weight:800;line-height:1.15;letter-spacing:-.03em;margin-bottom:20px}
[data-theme="light"] .cta-title-new{color:#001a1f}
[data-theme="dark"] .cta-title-new{color:#f0f8ff}
.cta-title-new em{font-style:normal;background:linear-gradient(135deg,#0891b2,#67e8f9);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
[data-theme="dark"] .cta-title-new em{background:linear-gradient(135deg,#67e8f9,#a5f3fc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.cta-subtitle-new{font-size:1.05rem;line-height:1.75;margin-bottom:32px}
[data-theme="light"] .cta-subtitle-new{color:#4a6080}
[data-theme="dark"] .cta-subtitle-new{color:rgba(180,235,240,.78)}
.cta-trust-row{display:flex;align-items:center;justify-content:center;gap:24px;flex-wrap:wrap;margin-bottom:40px}
.cta-trust-item{display:flex;align-items:center;gap:6px;font-size:.85rem;font-weight:600}
[data-theme="light"] .cta-trust-item{color:#4a6080}
[data-theme="dark"] .cta-trust-item{color:rgba(167,240,245,.82)}
.cta-trust-item svg{color:#22c55e;flex-shrink:0}
.cta-buttons-new{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap}
.btn-cta-primary{display:inline-flex;align-items:center;gap:10px;font-family:'Sora',sans-serif;font-weight:700;font-size:1.05rem;padding:18px 42px;background:linear-gradient(135deg,#0891b2 0%,#0891b2 60%,#67e8f9 100%);color:#fff;border-radius:100px;border:none;cursor:pointer;transition:all .35s cubic-bezier(.4,0,.2,1);box-shadow:0 8px 32px rgba(8,145,178,.45),0 2px 8px rgba(8,145,178,.2);position:relative;overflow:hidden;text-decoration:none;white-space:nowrap}
.btn-cta-primary:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 16px 48px rgba(8,145,178,.6),0 4px 16px rgba(8,145,178,.3);color:#fff}
.btn-cta-secondary{display:inline-flex;align-items:center;gap:8px;font-family:'Sora',sans-serif;font-weight:600;font-size:.95rem;padding:18px 38px;border-radius:100px;cursor:pointer;transition:all .35s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(12px);text-decoration:none;white-space:nowrap}
[data-theme="light"] .btn-cta-secondary{background:rgba(255,255,255,.75);color:#0891b2;border:1.5px solid rgba(8,145,178,.3)}
[data-theme="light"] .btn-cta-secondary:hover{background:rgba(255,255,255,.95);border-color:rgba(8,145,178,.6);transform:translateY(-3px);box-shadow:0 12px 32px rgba(8,145,178,.15)}
[data-theme="dark"] .btn-cta-secondary{background:rgba(8,145,178,.15);color:#67e8f9;border:1.5px solid rgba(34,211,238,.4)}
[data-theme="dark"] .btn-cta-secondary:hover{background:rgba(8,145,178,.3);border-color:rgba(103,232,249,.65);color:#ecfeff;transform:translateY(-3px);box-shadow:0 12px 32px rgba(8,145,178,.3)}
@media(max-width:768px){.cta-section-new{padding:75px 0}.cta-trust-row{gap:14px}.cta-trust-item{font-size:.78rem}.btn-cta-primary,.btn-cta-secondary{padding:15px 28px;font-size:.95rem}}

/* FOOTER REDESIGN */
.footer{background:#001a1f!important;padding:0!important;border-top:none!important;border-image:none!important;position:relative;overflow:hidden}
.footer::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 50% at 10% 0%,rgba(8,145,178,.18) 0%,transparent 60%),radial-gradient(ellipse 40% 40% at 90% 100%,rgba(103,232,249,.12) 0%,transparent 50%);pointer-events:none;z-index:0}
.footer .container{position:relative;z-index:1}
.footer-glow-bar{height:3px;background:linear-gradient(90deg,transparent 0%,#0891b2 25%,#67e8f9 50%,#0891b2 75%,transparent 100%);width:100%;position:relative}
.footer-glow-bar::after{content:'';position:absolute;inset:0;background:inherit;filter:blur(8px);opacity:.7}
.footer-body{padding:72px 0 48px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;padding-bottom:56px;border-bottom:1px solid rgba(255,255,255,.07)}
@media(max-width:1100px){.footer-grid{grid-template-columns:1fr 1fr 1fr;gap:36px}.footer-brand{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}.footer-brand p{max-width:100%;margin-bottom:0}}
@media(max-width:768px){.footer-grid{grid-template-columns:1fr 1fr;gap:28px}.footer-brand{grid-column:1/-1;grid-template-columns:1fr;gap:16px}}
.footer-brand-logo{display:flex;align-items:center;gap:12px;margin-bottom:18px;text-decoration:none}
.footer-brand-logo .logo-icon-new{width:46px!important;height:46px!important;filter:drop-shadow(0 4px 16px rgba(103,232,249,.5))}
.footer-brand-tagline{color:rgba(255,255,255,.52);font-size:.875rem;line-height:1.75;margin-bottom:24px;max-width:280px}
.footer-feature-badges{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.footer-badge-pill{display:inline-flex;align-items:center;gap:5px;font-size:.72rem;font-weight:600;color:rgba(167,240,245,.75);background:rgba(8,145,178,.2);border:1px solid rgba(8,145,178,.28);padding:4px 10px;border-radius:100px;white-space:nowrap}
.footer-badge-pill svg{width:10px;height:10px;stroke:#67e8f9;fill:none;stroke-width:2.5;flex-shrink:0}
.footer-social{display:flex!important;gap:10px!important}
.social-link{width:40px!important;height:40px!important;border-radius:12px!important;background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.1)!important;display:flex!important;align-items:center!important;justify-content:center!important;color:rgba(255,255,255,.55)!important;transition:all .3s ease!important;position:relative;overflow:hidden}
.social-link::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,#0891b2,#67e8f9);opacity:0;transition:opacity .3s}
.social-link:hover::before{opacity:1}
.social-link:hover{color:#fff!important;transform:translateY(-3px)!important;box-shadow:0 8px 20px rgba(8,145,178,.45)!important;border-color:transparent!important}
.social-link svg{position:relative;z-index:1}
.footer-col h4{font-family:'Sora',sans-serif!important;font-weight:700!important;font-size:.8rem!important;color:rgba(255,255,255,.95)!important;text-transform:uppercase!important;letter-spacing:.1em!important;margin-bottom:22px!important;position:relative;padding-bottom:12px}
.footer-col h4::after{content:'';position:absolute;bottom:0;left:0;width:28px;height:2px;background:linear-gradient(90deg,#0891b2,#67e8f9);border-radius:2px}
.footer-links{display:flex!important;flex-direction:column!important;gap:11px!important}
.footer-link{font-size:.875rem!important;color:rgba(255,255,255,.5)!important;transition:all .25s ease!important;display:flex!important;align-items:center!important;gap:7px!important;position:relative}
.footer-link::before{content:'';width:0;height:1px;background:#67e8f9;transition:width .3s ease;flex-shrink:0}
.footer-link:hover::before{width:12px}
.footer-link:hover{color:#90d8ff!important;padding-left:0!important;gap:10px!important}
.footer-bottom{padding:24px 0!important;border-top:1px solid rgba(255,255,255,.07)!important;display:flex!important;justify-content:space-between!important;align-items:center!important;flex-wrap:wrap!important;gap:16px!important}
.footer-bottom p{color:rgba(255,255,255,.32)!important;font-size:.8rem!important}
.footer-trust-row{display:flex;align-items:center;gap:16px}
.footer-trust-badge{display:flex;align-items:center;gap:5px;font-size:.72rem;font-weight:600;color:rgba(255,255,255,.38)}
.footer-trust-badge svg{width:14px;height:14px;fill:none;stroke:rgba(255,255,255,.3);stroke-width:1.5}
.footer-bottom-links a{font-size:.8rem!important;color:rgba(255,255,255,.36)!important;transition:color .2s!important}
.footer-bottom-links a:hover{color:#67e8f9!important}
@media(max-width:768px){.footer-body{padding:52px 0 36px}.footer-brand-tagline{max-width:100%}.footer-bottom{flex-direction:column;text-align:center}.footer-trust-row{justify-content:center;flex-wrap:wrap}}

/* MOBILE SLIDER RESPONSIVE */
@media(max-width:1024px){.hero-img-slider{aspect-ratio:16/9;border-radius:16px;max-width:600px;margin:0 auto}}
@media(max-width:768px){.hero-img-slider{aspect-ratio:4/3;border-radius:14px;max-width:100%}.hero-grid{padding-bottom:50px!important}}
@media(max-width:480px){.hero-img-slider{aspect-ratio:3/2;border-radius:12px}}

/* ============================================================
   HERO — Netflix-style background image (CSS only, no layout changes)
   ============================================================ */
.hero {
  background-image:
    linear-gradient(to right, rgba(4,10,22,0.98) 0%, rgba(4,10,22,0.95) 30%, rgba(4,10,22,0.5) 60%, rgba(4,10,22,0.15) 100%),
    url('../images/hero/hero-content-grid.png') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

/* ============================================================
   PAGE HERO — REDESIGNED (blog, faq, pricing, etc.)
   Different from CTA: diagonal stripe mesh + side accent bars
============================================================ */
.page-hero {
  padding: 110px 0 72px;
  position: relative;
  overflow: hidden;
  text-align: center;
  isolation: isolate;
}

/* Base gradient — dark teal diagonal */
[data-theme="dark"] .page-hero  { background: linear-gradient(160deg, #001a1f 0%, #0e4d5c 45%, #001a1f 100%); }
[data-theme="light"] .page-hero { background: linear-gradient(160deg, #0e4d5c 0%, #0891b2 50%, #0e4d5c 100%); }

/* Diagonal stripe overlay */
.page-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    -55deg,
    transparent,
    transparent 18px,
    rgba(255,255,255,0.025) 18px,
    rgba(255,255,255,0.025) 19px
  );
  z-index: 0;
}

/* Accent glow bar — left side */
.page-hero::after {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: linear-gradient(180deg, transparent, #22d3ee, #0891b2, transparent);
  z-index: 1;
}

/* Right glow orb */
.page-hero-orb {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}
.page-hero-orb-1 {
  width: 420px; height: 420px;
  top: -120px; right: -80px;
  background: radial-gradient(circle, rgba(8,145,178,0.28), transparent 70%);
  animation: orbDrift 14s ease-in-out infinite;
}
.page-hero-orb-2 {
  width: 280px; height: 280px;
  bottom: -60px; left: 8%;
  background: radial-gradient(circle, rgba(34,211,238,0.18), transparent 70%);
  animation: orbDrift 18s ease-in-out infinite reverse;
}

/* Floating teal dots */
.page-hero-dots {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}
.page-hero-dots span {
  position: absolute;
  width: 5px; height: 5px;
  border-radius: 50%;
  background: rgba(103,232,249,0.45);
  animation: floatDot linear infinite;
}
.page-hero-dots span:nth-child(1)  { left:10%; top:20%; animation-duration:8s;  animation-delay:0s;   width:4px; height:4px; }
.page-hero-dots span:nth-child(2)  { left:80%; top:15%; animation-duration:11s; animation-delay:1s; }
.page-hero-dots span:nth-child(3)  { left:55%; top:70%; animation-duration:9s;  animation-delay:2s;   width:3px; height:3px; background:rgba(34,211,238,0.35); }
.page-hero-dots span:nth-child(4)  { left:25%; top:80%; animation-duration:13s; animation-delay:0.5s; }
.page-hero-dots span:nth-child(5)  { left:70%; top:55%; animation-duration:10s; animation-delay:3s;   width:6px; height:6px; background:rgba(8,145,178,0.3); }
.page-hero-dots span:nth-child(6)  { left:40%; top:30%; animation-duration:7s;  animation-delay:1.5s; width:3px; height:3px; }
@keyframes floatDot {
  0%   { transform: translateY(0) scale(1);   opacity: 0.5; }
  50%  { transform: translateY(-18px) scale(1.3); opacity: 0.9; }
  100% { transform: translateY(0) scale(1);   opacity: 0.5; }
}

/* Category pill in hero */
.page-hero-badge {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 0.72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  padding: 6px 18px; border-radius: 100px;
  background: rgba(255,255,255,0.1); color: rgba(255,255,255,0.9);
  border: 1px solid rgba(255,255,255,0.2);
  margin-bottom: 20px;
  backdrop-filter: blur(8px);
}

/* ============================================================
   BLOG THUMBNAILS — Real image style
============================================================ */
.blog-thumb {
  position: relative;
  height: 200px;
  overflow: hidden;
  border-radius: var(--radius) var(--radius) 0 0;
}
.blog-thumb img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 0.5s cubic-bezier(0.4,0,0.2,1);
  display: block;
}
.blog-card:hover .blog-thumb img { transform: scale(1.07); }
.blog-thumb-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,26,31,0.75) 0%, rgba(0,26,31,0.1) 60%, transparent 100%);
}
.blog-thumb .blog-category {
  position: absolute; bottom: 12px; left: 14px; z-index: 2;
  font-size: 0.7rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
  padding: 4px 10px; border-radius: 100px;
  background: rgba(8,145,178,0.85); color: #fff;
  backdrop-filter: blur(6px);
}

/* ============================================================
   FAQ — OPEN STATE GRADIENT (pencil sketch feel)
============================================================ */
.faq-item { transition: all 0.35s cubic-bezier(0.4,0,0.2,1); }

.faq-item.open {
  border-color: rgba(8,145,178,0.4) !important;
}

/* Light mode open gradient */
[data-theme="light"] .faq-item.open {
  background:
    repeating-linear-gradient(
      -45deg,
      transparent,
      transparent 6px,
      rgba(8,145,178,0.035) 6px,
      rgba(8,145,178,0.035) 7px
    ),
    linear-gradient(135deg, rgba(8,145,178,0.06) 0%, rgba(34,211,238,0.08) 50%, rgba(103,232,249,0.05) 100%);
  box-shadow: 0 4px 24px rgba(8,145,178,0.12), inset 0 0 0 1px rgba(8,145,178,0.15);
}

/* Dark mode open gradient */
[data-theme="dark"] .faq-item.open {
  background:
    repeating-linear-gradient(
      -45deg,
      transparent,
      transparent 6px,
      rgba(34,211,238,0.04) 6px,
      rgba(34,211,238,0.04) 7px
    ),
    linear-gradient(135deg, rgba(8,145,178,0.12) 0%, rgba(14,77,92,0.18) 50%, rgba(8,145,178,0.08) 100%);
  box-shadow: 0 4px 32px rgba(8,145,178,0.2), inset 0 0 0 1px rgba(34,211,238,0.2);
}

/* Open question text colour pop */
.faq-item.open .faq-question { color: var(--primary); }
.faq-item.open .faq-question svg { stroke: var(--accent); }

/* Smooth answer reveal with slight indent */
.faq-answer-inner {
  border-left: 3px solid var(--primary);
  margin-left: 4px;
  padding-left: 20px !important;
}

/* Better hover */
.faq-item:hover:not(.open) {
  background: rgba(8,145,178,0.04);
  transform: translateX(3px);
}
