/*
Theme Name: 100x MLM
Theme URI: https://example.com/100x-mlm
Author: Your Team
Description: Clean, animated landing style for MLM software site with logo marquee, work slider, and creative headline.
Version: 1.0.0
Text Domain: mlm-100x
*/

:root{
  --bg:#f7f9ff;--card:#ffffff;--ink:#0e1528;--muted:#5d6a86;--primary:#576bff;--primary-600:#4154ff;--accent:#ff77a9;--ring:rgba(65,84,255,.28);
  --shadow:0 12px 32px rgba(10,25,60,.06),0 8px 16px rgba(10,25,60,.05);
  --radius:16px;--radius-lg:22px;--max:1180px;
  --logo-size: 40px;
  --santa-w: 300px;
}

*{box-sizing:border-box}
html,body{height:100%}
/* Typography */
:root{--font-display:'Manrope',system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;--font-body:'Inter',system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
body{margin:0;font-family:var(--font-body);background:radial-gradient(60% 80% at 10% 0%, rgba(255,152,197,.25) 0, rgba(255,152,197,0) 60%),radial-gradient(50% 60% at 90% 10%, rgba(137,167,255,.25) 0, rgba(137,167,255,0) 60%),linear-gradient(180deg,#ffffff 0%, #f6f7ff 100%);color:var(--ink)}
body.nav-open{overflow:hidden}

h1,h2,h3,.brand span,.headline,.sayhi{font-family:var(--font-display);letter-spacing:-.02em}
h1,.sayhi{font-weight:800}
h2{font-weight:800}
h3{font-weight:700}
a{color:var(--primary);text-decoration:none}
img{max-width:100%;display:block}
.container{max-width:var(--max);margin-inline:auto;padding:0 20px}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.8rem 1.1rem;border-radius:12px;border:1px solid rgba(0,0,0,.06);background:var(--primary);color:#fff;font-weight:700;box-shadow:var(--shadow)}
.btn:not(.secondary):not(.ghost){background:linear-gradient(90deg,#586eff,#8a6bff)}
.btn.secondary{background:#fff;color:var(--ink);border-color:#e6eefc}
.btn.ghost{background:transparent;border-color:#dfe8ff;color:var(--primary)}
.chip{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .6rem;border-radius:999px;background:#ecfdf5;color:#047857;font-weight:700;font-size:.78rem;border:1px solid #c7f3e4}
.grid{display:grid;gap:24px}
.grid.cols-3{grid-template-columns:repeat(3,1fr)}
.grid.cols-4{grid-template-columns:repeat(4,1fr)}
.grid.cols-5{grid-template-columns:repeat(5,1fr)}
@media (max-width:1024px){.grid.cols-5{grid-template-columns:repeat(3,1fr)}.grid.cols-4{grid-template-columns:repeat(2,1fr)}.grid.cols-3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.grid.cols-3,.grid.cols-4,.grid.cols-5{grid-template-columns:1fr}}


.hero{padding:72px 0 36px;border-bottom:1px dashed #e6eefc}
.hero h1{font-size:clamp(1.8rem,3.5vw,2.6rem);line-height:1.15;margin:0 0 12px}
.hero p{color:var(--muted);max-width:720px}
.hero .ctas{margin-top:20px;display:flex;gap:12px;flex-wrap:wrap}
.hero-card{margin-top:28px;padding:18px;border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow);border:1px solid #eef3ff}
.trust{padding:22px 0}
.section{padding:64px 0}
.section h2{font-size:clamp(1.3rem,2.6vw,1.9rem);margin:0 0 10px}
.muted{color:var(--muted)}
.card{background:var(--card);border:1px solid #e9f0ff;border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}
.icon{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:#eef6ff;border:1px solid #e6eeff}
.tick{color:#0bb97c}
.accordion{border-radius:var(--radius);overflow:hidden;border:1px solid #e9f0ff;background:#fff}
.acc-item+.acc-item{border-top:1px solid #eef3ff}
.acc-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;font-weight:600;cursor:pointer}
.acc-body{display:none;padding:0 18px 16px;color:var(--muted)}
.acc-item.open .acc-body{display:block}
.acc-item.open .acc-head .plus{transform:rotate(45deg)}
.badge{background:#f3f8ff;border:1px solid #e6eeff;color:#3b4d7a;padding:.25rem .55rem;border-radius:999px;font-size:.74rem;font-weight:600}
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:28px}
@media (max-width:920px){.split{grid-template-columns:1fr}}
.cta-strip{display:flex;gap:16px;align-items:center;justify-content:center;padding:18px;border:1px dashed #cfe0ff;background:#f9fcff;border-radius:14px}










/* Promo CTA banner above footer */
.cta-banner{border-radius:20px;background:linear-gradient(135deg,#101828 0%, #18233c 60%, #0f1a2e 100%);color:#fff;padding:24px;box-shadow:0 26px 52px rgba(2,10,40,.35);position:relative;overflow:hidden;display:grid;grid-template-columns:1.15fr .85fr;gap:22px;margin-bottom:22px}
.cta-banner::after{content:"";position:absolute;inset:-40% -10% auto -10%;height:140%;background:radial-gradient(40% 40% at 40% 50%, rgba(94,116,255,.25), transparent 60%);animation:ctaGlow 12s ease-in-out infinite;pointer-events:none}
@keyframes ctaGlow{0%{transform:translateY(0)}50%{transform:translateY(-14px)}100%{transform:translateY(0)}}
.cta-banner h3{margin:0 0 8px;color:#fff}
.cta-actions{display:flex;gap:10px;margin-top:12px}
.btn.light{background:#fff;border:1px solid #e6eefc;color:#0f172a}
.cta-visual{border-radius:16px;border:1px solid rgba(255,255,255,.15);background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02));min-height:160px;backdrop-filter:blur(2px);display:grid;place-items:center}
.cta-visual small{opacity:.8}

.small{font-size:.92rem}
.pill-list{display:flex;flex-wrap:wrap;gap:10px}
.kpis{display:flex;gap:16px;flex-wrap:wrap;margin-top:14px}
.kpi{background:#fff;border:1px solid #e9f0ff;border-radius:14px;padding:10px 14px;min-width:120px;text-align:center}
.kpi strong{font-size:1.1rem}
.note{font-size:.92rem;color:#6a7893}
.shadowed{box-shadow:var(--shadow)}

/* FAQ modern layout */
.faq-grid{display:grid;grid-template-columns:1fr 2fr;gap:28px;align-items:start}
@media (max-width:920px){.faq-grid{grid-template-columns:1fr}}
.faq-aside{position:sticky;top:84px}
.faq-avatars{display:flex;align-items:center;margin:8px 0 12px}
.faq-avatars img{width:36px;height:36px;border-radius:999px;border:2px solid #fff;box-shadow:var(--shadow)}
.faq-avatars img+img{margin-left:-10px}
.faq-actions{display:flex;gap:10px;flex-wrap:wrap}
.faq-list{display:grid;gap:12px}
.faq-item{background:#fff;border:1px solid #e6eeff;border-radius:14px;box-shadow:var(--shadow)}
.faq-item+.faq-item{margin-top:6px}
.faq-q{all:unset;display:flex;align-items:center;justify-content:space-between;width:100%;padding:14px 16px 14px 18px;cursor:pointer}
.faq-q .num{font-weight:700;color:#8aa0d6;margin-right:10px;min-width:28px}
.faq-q .plus{background:#eef4ff;border:1px solid #e3edff;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;color:#3b5bdb;font-weight:800;transition:transform .2s ease;position:relative;font-size:0}
.faq-q .plus::before,.faq-q .plus::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2px;background:#3b5bdb;border-radius:2px;transform:translate(-50%,-50%)}
.faq-q .plus::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq-item.open .faq-q .plus::after{opacity:0}
.faq-a{display:none;padding:0 18px 16px;color:var(--muted)}
.faq-item.open .faq-a{display:block}


/* Creative heading */
.sol-grid{display:flex;flex-wrap:wrap;gap:20px}
.sol-grid .outer{width:calc(50% - 10px);aspect-ratio:1;position:relative;display:grid;align-content:start;padding:18px;color:#fff;box-sizing:border-box;border-radius:var(--r);background-image:radial-gradient(circle at var(--cnr), transparent var(--r), #fff var(--r)),radial-gradient(circle at var(--cnr), transparent var(--r), #fff var(--r)),linear-gradient(45deg, #a7c5ff, #3386f2);background-repeat:no-repeat;background-size:var(--sz) var(--sz), var(--sz) var(--sz), cover;box-shadow:0 20px 36px rgba(62,124,255,.16),0 8px 12px rgba(62,124,255,.1)}
.sol-grid .outer .inner{width:var(--w);height:var(--h);border-radius:inherit;outline:var(--o) solid #fff}
.sol-grid .outer .content{position:relative;z-index:1}
.sol-grid .outer .content h3{margin:0 0 8px;color:#fff}
.sol-grid .outer .content .muted{color:rgba(255,255,255,.92)}
.sol-grid .outer .content .learn{display:inline-block;margin-top:12px;padding:.55rem .9rem;border-radius:12px;background:#fff;color:#244;box-shadow:0 10px 18px rgba(0,0,0,.12)}
.sol-grid .outer:nth-of-type(1){--w:100px;--h:30px;--o:8px;--r:10px;--ofs:calc(-1 * var(--o));--sz:calc(var(--r) + var(--o));background-position:var(--ofs) var(--h), var(--w) var(--ofs), 0 0;--cnr:right bottom;align-content:start}
.sol-grid .outer:nth-of-type(2){--w:40px;--h:80px;--o:12px;--r:6px;--ofs:calc(-1 * var(--o));--sz:calc(var(--r) + var(--o));background-position:calc(100% - var(--ofs)) var(--h), calc(100% - var(--w)) var(--ofs), 0 0;--cnr:left bottom;align-content:start}
.sol-grid .outer:nth-of-type(2) .inner{margin-left:auto}
.sol-grid .outer:nth-of-type(3){--w:20px;--h:90px;--o:4px;--r:4px;--ofs:calc(-1 * var(--o));--sz:calc(var(--r) + var(--o));background-position:calc(100% - var(--ofs)) calc(100% - var(--h)), calc(100% - var(--w)) calc(100% - var(--ofs)), 0 0;--cnr:left top;align-content:end}
.sol-grid .outer:nth-of-type(3) .inner{margin-left:auto}
.sol-grid .outer:nth-of-type(4){--w:80px;--h:80px;--o:8px;--r:18px;--ofs:calc(-1 * var(--o));--sz:calc(var(--r) + var(--o));background-position:var(--ofs) calc(100% - var(--h)), var(--w) calc(100% - var(--ofs)), 0 0;--cnr:right top;align-content:end}
.sol-grid .outer:nth-of-type(4) .inner{margin-right:auto}
.creative{background:linear-gradient(90deg,#586eff 0%, #8a6bff 45%, #ff77a9 80%, #ff9a6e 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.headline{display:inline-flex;gap:.4rem;align-items:center;flex-wrap:wrap}
.rotate-holder{position:relative;display:inline-grid;align-items:center;min-width:9.5ch}
.rotate-word{white-space:nowrap;transition:opacity .2s ease}
.cursor{width:2px;height:1.1em;background:currentColor;display:inline-block;margin-left:2px;animation:blink 1s steps(1,end) infinite}
@keyframes blink{50%{opacity:0}}

/* Client logo marquee */
.logo-marquee{position:relative;overflow:hidden;border:1px solid #e6eefc;background:#fff;border-radius:14px;padding:10px}
.logo-marquee::after,.logo-marquee::before{content:"";position:absolute;top:0;bottom:0;width:60px;pointer-events:none}
.logo-marquee::before{left:0;background:linear-gradient(90deg,#fff,rgba(255,255,255,0))}
.logo-marquee::after{right:0;background:linear-gradient(270deg,#fff,rgba(255,255,255,0))}
.marquee-track{display:flex;gap:36px;align-items:center;min-width:max-content;animation:scroll 28s linear infinite}
.logo-marquee:hover .marquee-track{animation-play-state:paused}
@keyframes scroll{to{transform:translateX(-50%)}}
.logo{opacity:.9;filter:grayscale(100%);transition:filter .2s,opacity .2s}
.logo:hover{filter:grayscale(0%);opacity:1}


/* Reveal on scroll */
[data-animate]{opacity:0;transform:translateY(14px);transition:opacity .6s ease, transform .6s ease}
.show[data-animate]{opacity:1;transform:none}

/* Content defaults for WP templates */
.site-content{padding:48px 0}
.site-main{max-width:var(--max);margin:0 auto;padding:0 20px}
.entry h1{margin-top:0}

/* Hero v2 */
.hero2{padding:72px 0 36px;border-bottom:1px dashed #e6eefc}
.hero2-wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:28px;align-items:center}
@media (max-width:980px){.hero2-wrap{grid-template-columns:1fr}}
.hero2 .copy p{max-width:620px}
.hero-form{margin-top:14px;display:flex;gap:10px;max-width:520px}
.hero-form input{flex:1;border:1px solid #e6eefc;border-radius:12px;padding:.8rem .9rem;background:#fff}
.hero-kpis{display:flex;gap:16px;align-items:center;margin-top:18px;flex-wrap:wrap}
.hero-kpis .stat{min-width:150px}
.hero-kpis .stat strong{font-size:1.3rem}
.hero-kpis .sep{width:1px;height:26px;background:#e6eefc}
.hero-kpis .stars{background:linear-gradient(90deg,#ffb703,#ff8e00);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero2 .art img{width:100%;border:1px solid #e6eefc;border-radius:18px;box-shadow:var(--shadow)}

/* Hero v3 */
.hero3{position:relative;padding:120px 0 160px;min-height:680px;margin-top:0;
  overflow:hidden}
.hero3 .grid-bg{display:none}
.hero3 .curve{display:none}
.hero3 .curve.left{left:-6%;top:26%}
.hero3 .curve.right{right:-8%;top:14%}
.hero3 .center{text-align:center}
.hero3 .fc{position:absolute;background:#fff;border:1px solid #e6eefc;border-radius:3% 30% / 63% 17%;box-shadow:var(--shadow);padding:0;overflow:hidden}
.hero3 .fc.img img{display:block;width:100%;height:auto}
.hero3 .fc.tl{left:5%;top:20%;width:210px}
.hero3 .fc.tr{right:6%;top:16%;width:230px}
.hero3 .fc.bl{left:12%;bottom:14%;width:260px}
.hero3 .fc.br{right:12%;bottom:14%;width:300px}
@media (max-width:980px){
  .hero3{padding:90px 0 120px;min-height:560px}
  .hero3 .grid-bg{height:220px;width:86%}
}

/* Center hero visual */
.hero-visual{max-width:1040px;margin:18px auto 0;position:relative}
.hero-visual img{width:100%;border:1px solid #e6eefc;border-radius:18px;box-shadow:var(--shadow)}
.hero-visual .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:86px;height:86px;border-radius:999px;border:1px solid #e6eefc;background:rgba(255,255,255,.88);box-shadow:0 20px 40px rgba(10,25,60,.15);cursor:pointer}
.hero-visual .play::after{content:"â–¶";display:block;text-align:center;font-size:30px;line-height:86px;color:var(--primary)}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(88,110,255,.35)}70%{box-shadow:0 0 0 24px rgba(88,110,255,0)}100%{box-shadow:0 0 0 0 rgba(88,110,255,0)}}
.hero-visual .play{animation:pulse 2.4s ease-out infinite}
.hero-visual .play:hover{filter:brightness(1.03)}

/* App + Blockchain (new) */
.appchain .split{gap:22px}
.appchain .card{border:1px solid #e6eefc;border-radius:18px;box-shadow:var(--shadow);padding:20px}
.appchain .app-card{background:#fff}
.appchain .chain-card{background:#fff}
.appchain .store-btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.appchain .store-btns img{height:164px;border-radius:10px;}
.appchain .crypto-icons{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.appchain .crypto-icons span{width:36px;height:36px;border-radius:999px;display:grid;place-items:center;background:#f3f7ff;border:1px solid #e6eefc;box-shadow:0 8px 12px rgba(10,25,60,.06)}

/* Revised mobile + blockchain layout */
.appchain .mobile-promo{display:grid;grid-template-columns:1.2fr .8fr;gap:28px;align-items:center;margin-bottom:20px}
@media (max-width:960px){.appchain .mobile-promo{grid-template-columns:1fr}}
.appchain .mobile-promo .phones{position:relative;height:420px}
.appchain .mobile-promo .phones .ph{position:absolute;bottom:0;border:1px solid #e6eefc;border-radius:24px;box-shadow:0 20px 40px rgba(10,25,60,.15)}
.appchain .mobile-promo .phones .ph.a{right:40px;transform:rotate(-14deg);width:260px}
.appchain .mobile-promo .phones .ph.b{right:160px;transform:rotate(8deg);width:240px}
@media (max-width:960px){.appchain .mobile-promo .phones{height:300px}.appchain .mobile-promo .phones .ph.a{right:10px;width:200px}.appchain .mobile-promo .phones .ph.b{right:120px;width:180px}}
.appchain .chain-panel{display:grid;grid-template-columns:1.2fr .8fr;gap:18px;margin-top:12px}
.appchain .chain-panel .hl{background:#ffdd88;padding:4px 6px;border-radius:6px}
@keyframes floaty{0%{transform:translate(0,0)}50%{transform:translate(10px,-18px)}100%{transform:translate(0,0)}}
.hero3 .fc{animation:floaty 10s ease-in-out infinite}
.hero3 .fc.tr{animation-delay:.5s;animation-duration:12s}
.hero3 .fc.bl{animation-delay:1s;animation-duration:13s}
.hero3 .fc.br{animation-delay:1.5s;animation-duration:11s}

/* Contact form — modern underline style */
.contact-head{max-width:920px;margin:0 auto 14px;text-align:center}
.sayhi{font-size:clamp(2rem,6vw,3.4rem);margin:0 0 10px;line-height:1.05}
.sayhi .big{font-size:1.08em}
.contact-form{max-width:980px;margin:0 auto;padding:28px 22px;border-radius:18px}
.field-row{display:grid;grid-template-columns:1fr;gap:16px;margin:12px 0 20px}
.field-row.two{grid-template-columns:1fr 1fr}
@media (max-width:760px){.field-row.two{grid-template-columns:1fr}}
.field{display:flex;flex-direction:column;gap:8px}
.label{font-weight:700;color:#7b88a8;font-size:.9rem}
.input-underline{border:0;border-bottom:2px solid #e6eaf5;background:transparent;padding:12px 2px;outline:none;border-radius:0;color:var(--ink);font-size:1rem}
.input-underline::placeholder{color:#a7b0c7}
.input-underline:focus{border-color:var(--primary)}
.phone-intl{position:relative}
.iti{width:100%}
.iti input{width:100%;padding-left:92px!important}
.iti .iti__country-list{z-index:9999}
.phone-fallback{display:none;grid-template-columns:180px 1fr;gap:12px;margin-top:6px}
body.no-intl-tel #phoneIntl{display:none}
body.no-intl-tel .phone-fallback{display:grid}
.tag-list{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.tag{padding:.45rem .8rem;border-radius:24px;border:1px solid #e3edff;background:#f7fbff;color:#2b3a67;cursor:pointer}
.tag.active{background:linear-gradient(90deg,#586eff,#8a6bff);border-color:transparent;color:#fff}
.field-row.actions{justify-content:flex-end}
.field-row.actions .btn{min-width:180px}

/* Integrations section */
.integrations .int-head{text-align:center;margin-bottom:16px}
.icon-belt{display:flex;gap:12px;justify-content:center;align-items:center;margin:10px 0 12px}
.icon-belt span{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:#eef6ff;border:1px solid #e6eeff}
.seg{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:10px}
.seg button{border:1px solid #e3edff;background:#fff;color:#2b3a67;padding:.45rem .7rem;border-radius:10px;cursor:pointer}
.seg button.active{background:#f3f7ff;color:var(--primary);border-color:#dfe8ff}
.int-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:20px}
@media (max-width:1024px){.int-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.int-grid{grid-template-columns:1fr}}
.int-card{position:relative;background:#fff;border:1px solid #e6eefc;border-radius:16px;padding:18px;box-shadow:var(--shadow);
  display:grid;grid-template-columns:48px 1fr;column-gap:14px;min-height:160px}
.int-icon{grid-column:1;align-self:start;width:44px;height:44px;border-radius:12px;background:#eef6ff;border:1px solid #e6eeff;display:grid;place-items:center;font-size:20px}
.int-meta{grid-column:2;display:flex;flex-direction:column;justify-content:space-between}
.int-meta h3{margin:2px 0 8px;font-size:1.08rem}
.int-meta p{margin:0;line-height:1.35;margin-top:auto}
.int-card .badge{position:absolute;top:10px;right:10px;background:#ffedec;color:#c2412d;border:1px solid #ffd5d1;border-radius:999px;padding:.15rem .45rem;font-size:.72rem;font-weight:800}
.int-card .badge.live{background:#ecfdf5;color:#047857;border-color:#c7f3e4}

/* Scallop edges disabled per user request */
.section.scallop::before,.section.scallop::after{display:none}
/* Feature cards – rounded blob style */
.feature-cards{--fc1:#22c55e;--fc2:#16a34a}
.feature-cards .card{position:relative;background:linear-gradient(135deg,var(--fc1),var(--fc2));color:#fff;border:0;border-radius:26px;box-shadow:0 20px 40px rgba(20,83,45,.18),0 6px 12px rgba(20,83,45,.12);padding:58px 18px 18px;overflow:hidden}
.feature-cards .card>*{position:relative;z-index:2}
.feature-cards .card h3{color:#fff}
.feature-cards .card .muted{color:rgba(255,255,255,.9)}
.feature-cards .card .icon{position:absolute;top:14px;left:14px;width:38px;height:38px;border-radius:12px;background:rgba(255,255,255,.9);border:0}
/* Transparent-looking cove using page background color */
.feature-cards .card::before{content:"";position:absolute;top:var(--cove-top,-34px);right:var(--cove-right,-34px);width:var(--cove-size,140px);height:var(--cove-size,140px);border-radius:999px;background:var(--bg);z-index:1}
/* Badge overlapping the notch */
.feature-cards .card::after{content:"★";position:absolute;top:8px;right:8px;width:44px;height:44px;border-radius:999px;background:#fff;color:#f59e0b;display:grid;place-items:center;font-size:18px;border:1px solid #e6eefc;z-index:3;box-shadow:0 10px 20px rgba(0,0,0,.08)}

/* Offset (unaligned) notch positions per card */
.feature-cards .card:nth-child(1){--cove-top:-28px;--cove-right:-28px;--cove-size:120px}
.feature-cards .card:nth-child(2){--cove-top:-24px;--cove-right:-36px;--cove-size:128px}
.feature-cards .card:nth-child(3){--cove-top:-32px;--cove-right:-24px;--cove-size:132px}
.feature-cards .card:nth-child(4){--cove-top:-26px;--cove-right:-30px;--cove-size:118px}
.feature-cards .card:nth-child(5){--cove-top:-22px;--cove-right:-34px;--cove-size:124px}
.feature-cards .card:nth-child(6){--cove-top:-34px;--cove-right:-26px;--cove-size:136px}
.feature-cards .card:nth-child(7){--cove-top:-28px;--cove-right:-32px;--cove-size:128px}
.feature-cards .card:nth-child(8){--cove-top:-24px;--cove-right:-28px;--cove-size:130px}
.feature-cards .badge{background:rgba(255,255,255,.85);color:#134e4a;border:0}
.sol-hub{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center}
@media (max-width:980px){.sol-hub{grid-template-columns:1fr}}
.sol-image img{width:100%;border:1px solid #e6eefc;border-radius:18px;box-shadow:var(--shadow)}
.sol-right{display:grid;gap:16px}
.sol-mini{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:640px){.sol-mini{grid-template-columns:1fr}}
.mini-card{position:relative;background:linear-gradient(180deg,#ffffff 0%, #f7fbff 100%);border:1px solid #e6eefc;border-radius:16px;padding:16px;box-shadow:var(--shadow)}
.mini-card .mini-ico{width:40px;height:40px;border-radius:999px;display:grid;place-items:center;background:#101828;color:#fff;margin-bottom:8px}
.mini-card h3{margin:0 0 6px}

/* Integrations-like panel (replaces first box in 'Why Choose Us') */
.integr-panel{grid-column:1/-1;display:grid;grid-template-columns:1.2fr .8fr;gap:18px;align-items:center;border:1px solid #e6eefc;border-radius:18px;padding:18px;background:radial-gradient(#eef3ff 1px, transparent 1px) 0 0/20px 20px}
.integr-copy h3{margin:0 0 8px}
.integr-logos{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}
.integr-logos span{width:44px;height:44px;border-radius:999px;display:grid;place-items:center;background:#fff;border:1px solid #e6eefc;box-shadow:0 8px 12px rgba(10,25,60,.06)}
@media (max-width:900px){.integr-panel{grid-template-columns:1fr}.integr-logos{justify-content:flex-start}}

/* Apply dotted background + 3D accents to the two boxes below */
.tech-card{position:relative;background:radial-gradient(#eef3ff 1px, transparent 1px) 0 0/18px 18px, linear-gradient(180deg,#ffffff, #f9fbff);border:1px solid #e6eefc;border-radius:18px;padding:18px;box-shadow:0 20px 36px rgba(10,25,60,.08)}
.tech-card h3{margin:0 0 8px}
.tech-card::before,.tech-card::after{content:"";position:absolute;pointer-events:none;filter:blur(6px);opacity:.55}
/* card 1: highlight top-right, shadow bottom-left */
.tech-card.tech-1::after{right:-20px;top:-20px;width:120px;height:80px;border-radius:30px;background:linear-gradient(135deg, rgba(100,140,255,.25), rgba(255,255,255,0))}
.tech-card.tech-1::before{left:-18px;bottom:-18px;width:140px;height:90px;border-radius:30px;background:linear-gradient(315deg, rgba(0,0,0,.06), rgba(255,255,255,0))}
/* card 2: highlight top-left, shadow bottom-right */
.tech-card.tech-2::after{left:-20px;top:-20px;width:120px;height:80px;border-radius:30px;background:linear-gradient(225deg, rgba(255,160,170,.25), rgba(255,255,255,0))}
.tech-card.tech-2::before{right:-18px;bottom:-18px;width:140px;height:90px;border-radius:30px;background:linear-gradient(45deg, rgba(0,0,0,.06), rgba(255,255,255,0))}

/* subtle light background colours */
.tech-0{background:radial-gradient(#eef3ff 1px, transparent 1px) 0 0/20px 20px, linear-gradient(180deg,#f6fbff,#ffffff)}
.tech-1{background:radial-gradient(#eef3ff 1px, transparent 1px) 0 0/18px 18px, linear-gradient(180deg,#f8fbff,#ffffff)}
.tech-2{background:radial-gradient(#eef3ff 1px, transparent 1px) 0 0/18px 18px, linear-gradient(180deg,#fffaf6,#ffffff)}

/* Premium top panel */
.premium-panel{grid-column:1/-1;display:grid;grid-template-columns:1.1fr .9fr;gap:22px;align-items:center;border:1px solid #e6eefc;border-radius:18px;padding:20px;background:linear-gradient(180deg,#eef4ff,#ffffff)}
@media (max-width:980px){.premium-panel{grid-template-columns:1fr}}
.premium-copy h3{margin:0 0 8px}
.premium-copy .bullets{list-style:none;margin:6px 0 14px;padding:0}
.premium-copy .bullets li{margin:6px 0;position:relative;padding-left:22px}
.premium-copy .bullets li::before{content:"👑";position:absolute;left:0;top:-1px}
.prem-visual img{width:100%;border:1px solid #e6eefc;border-radius:14px;box-shadow:0 20px 36px rgba(10,25,60,.08)}
.premium-copy .cta-row{display:flex;gap:10px;margin-top:10px}

/* Stack + Security cards (bottom two) */
.stack-card{display:grid;grid-template-columns:1.1fr .9fr;gap:16px;align-items:center;border:1px solid #e6eefc;border-radius:18px;padding:18px;background:linear-gradient(180deg,#f7fbff,#ffffff);box-shadow:0 18px 32px rgba(10,25,60,.08)}
@media (max-width:900px){.stack-card{grid-template-columns:1fr}}
.stack-card .note.tight li{margin:6px 0}
.stack-logos{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.stack-logos span{width:40px;height:40px;border-radius:999px;display:grid;place-items:center;background:#fff;border:1px solid #e6eefc;box-shadow:0 8px 12px rgba(10,25,60,.06)}

.security-card{position:relative;color:#fff;border-radius:18px;padding:22px;border:1px solid #dbe5ff;background:radial-gradient(120% 120% at 30% 0%, #163f8f, #0b2a66 60%, #081d4a 100%);box-shadow:0 20px 36px rgba(2,10,40,.4)}
.security-card h3{margin:0 0 10px;color:#fff}
.sec-list{list-style:none;margin:0;padding:0}
.sec-list li{margin:8px 0;padding-left:24px;position:relative}
.sec-list li::before{content:"✔";position:absolute;left:0;top:0;color:#9fe870}

/* Slab rows with animated visual (for two boxes) */
.slab{display:grid;grid-template-columns:1.1fr .9fr;gap:22px;align-items:center;border:1px solid #e6eefc;border-radius:18px;padding:24px;background:linear-gradient(180deg,#f8fbff,#ffffff);box-shadow:0 18px 32px rgba(10,25,60,.08)}
@media (max-width:900px){.slab{grid-template-columns:1fr}}
.slab-1{background:linear-gradient(180deg,#f0f7ff,#ffffff)}
.slab-2{background:linear-gradient(180deg,#fff7f2,#ffffff)}
.slab-copy h3{margin:0 0 8px}
.slab-viz{display:grid;place-items:center}
.viz-card{position:relative;width:100%;max-width:500px;height:240px;border:1px solid #e6eefc;border-radius:18px;background:#fff;box-shadow:0 24px 44px rgba(10,25,60,.12)}
.viz-card.tilt-right{transform:perspective(1000px) rotateY(-6deg) rotateX(2deg)}
.viz-card.tilt-left{transform:perspective(1000px) rotateY(6deg) rotateX(2deg)}
.viz-anim,.viz-anim.alt{position:absolute;inset:0;border-radius:inherit;background:radial-gradient(60% 80% at 20% 20%, rgba(87,107,255,.16), transparent 60%), radial-gradient(60% 80% at 80% 80%, rgba(255,173,153,.16), transparent 60%)}
.viz-anim.alt{background:radial-gradient(60% 80% at 20% 20%, rgba(255,173,153,.18), transparent 60%), radial-gradient(60% 80% at 80% 80%, rgba(87,107,255,.18), transparent 60%)}
@keyframes floatbg{0%{background-position:0 0,100% 100%}50%{background-position:4% 2%,96% 98%}100%{background-position:0 0,100% 100%}}
.viz-anim,.viz-anim.alt{animation:floatbg 6s ease-in-out infinite}
.viz-inner{position:absolute;left:16px;bottom:14px;animation:rise 1.2s ease both}
.viz-inner .small{opacity:.9}
@keyframes rise{from{transform:translateY(8px);opacity:.0}to{transform:none;opacity:1}}
.viz-inner strong{display:block}
.security-sec{background:#0d1b2a;color:#fff;padding:64px 0}
.security-sec .muted{color:#cfe0ff}
.sec-wrap{display:grid;grid-template-columns:1.05fr 1.2fr;gap:24px;align-items:center}
@media (max-width:980px){.sec-wrap{grid-template-columns:1fr}}
.sec-left{position:relative;height:360px;border-radius:18px;background:radial-gradient(800px 360px at 10% 50%, rgba(33,66,38,.8), rgba(13,27,42,1))}
.fingerprint{position:absolute;left:24px;bottom:24px;width:120px;height:120px;border-radius:999px;background:#fff;display:grid;place-items:center;box-shadow:0 24px 48px rgba(0,0,0,.35)}
.fingerprint::before{content:"🌀";font-size:48px;color:#1e824c}
.sec-right h2{margin:0 0 8px;color:#fff}
.sec-right .sec-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:12px}
@media (max-width:640px){.sec-right .sec-grid{grid-template-columns:1fr}}
.sec-card{background:rgba(255,255,255,.06);border:1px solid rgba(207,224,255,.15);border-radius:14px;padding:16px;backdrop-filter:blur(4px)}
.sec-card h3{margin:6px 0;color:#fff}
.sec-ico{width:36px;height:36px;border-radius:999px;display:grid;place-items:center;background:rgba(255,255,255,.15);border:1px solid rgba(207,224,255,.2);margin-bottom:6px}
.security-block{grid-column:1/-1;display:grid;grid-template-columns:1.1fr 1fr;gap:20px;margin-top:14px;align-items:stretch}
.sec-visual-lite{position:relative;border:1px solid #e6eefc;border-radius:18px;min-height:320px;background:radial-gradient(80% 120% at 0% 0%, rgba(88,110,255,.18), rgba(255,255,255,0) 60%), radial-gradient(80% 120% at 100% 100%, rgba(255,173,153,.18), rgba(255,255,255,0) 60%), linear-gradient(180deg,#f7fbff,#ffffff);box-shadow:0 22px 38px rgba(10,25,60,.10);overflow:hidden}
.sec-visual-lite::after{content:"";position:absolute;inset:-40% -40% auto auto;width:140%;height:140%;background:radial-gradient(circle at 30% 30%, rgba(88,110,255,.12), transparent 60%);animation:vizFloat 10s ease-in-out infinite;pointer-events:none}
.viz-overlay{position:absolute;left:16px;bottom:16px}
.viz-overlay h3{margin:0 0 6px}
.chip-row{display:flex;gap:8px;margin-top:6px}
.chip{background:#eef4ff;border:1px solid #e6eefc;color:#334155;padding:.25rem .55rem;border-radius:999px;font-size:.78rem;font-weight:600}
@keyframes vizFloat{0%{transform:translate(0,0)}50%{transform:translate(12px,-8px)}100%{transform:translate(0,0)}}
.sec-cards-lite{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.sec-lite{border:1px solid #e6eefc;border-radius:14px;padding:16px;background:linear-gradient(180deg,#ffffff,#f9fbff);box-shadow:0 10px 18px rgba(10,25,60,.06);transition:transform .22s ease, box-shadow .22s ease}
.sec-lite:hover{transform:translateY(-3px);box-shadow:0 16px 26px rgba(10,25,60,.10)}
.sec-lite .badge{width:34px;height:34px;border-radius:999px;display:grid;place-items:center;background:#fff;border:1px solid #e6eefc;box-shadow:0 6px 12px rgba(10,25,60,.06);margin-bottom:6px}
.sec-lite h4{margin:0 0 6px}
.sec-lite p{margin:0}
@media (max-width:980px){.security-block{grid-template-columns:1fr}.sec-visual-lite{min-height:220px}}
.sec-lite h4{margin:0 0 6px}
.sol-scroll{position:relative;overflow:hidden;border-radius:18px;border:1px solid #e6eefc;background:linear-gradient(180deg,#ffffff,#f7fbff);padding:14px}
.sol-scroll::before,.sol-scroll::after{content:"";position:absolute;top:0;bottom:0;width:60px;pointer-events:none}
.sol-scroll::before{left:0;background:linear-gradient(90deg,#fff,rgba(255,255,255,0))}
.sol-scroll::after{right:0;background:linear-gradient(270deg,#fff,rgba(255,255,255,0))}
.rail{display:flex;gap:14px;width:max-content;animation:scrollX 40s linear infinite;will-change:transform}
.rail.bottom{animation-direction:reverse;margin-top:12px}
.sol-scroll:hover .rail{animation-play-state:paused}
.mlm-card{position:relative;min-width:340px;max-width:340px;min-height:210px;border:1px solid #e6eefc;border-radius:16px;background:linear-gradient(180deg,#ffffff 0%, #f7fbff 100%);padding:18px;box-shadow:0 14px 22px rgba(10,25,60,.06);transition:transform .22s ease, filter .22s ease, box-shadow .22s ease}
.mlm-card h4{margin:0}
.mlm-card .title{display:flex;align-items:center;gap:10px;border-left:4px solid var(--accent,#586eff);padding-left:10px;margin-bottom:8px}
.mlm-card .title h4{font-weight:700}
.mlm-card .thumb{position:absolute;right:12px;bottom:12px;width:64px;height:64px;border-radius:12px;overflow:hidden;border:1px solid #e6eefc;box-shadow:0 10px 16px rgba(10,25,60,.10)}
.mlm-card .thumb img{width:100%;height:100%;object-fit:cover}
.mlm-card.color-1{--accent:#586eff;background:linear-gradient(180deg,#ffffff 0%, #eef3ff 100%)}
.mlm-card.color-2{--accent:#ff77a9;background:linear-gradient(180deg,#ffffff 0%, #fff1f6 100%)}
.mlm-card.color-3{--accent:#00c2a8;background:linear-gradient(180deg,#ffffff 0%, #e9fffb 100%)}
.mlm-card.color-4{--accent:#f59e0b;background:linear-gradient(180deg,#ffffff 0%, #fff7e8 100%)}
.mlm-card.color-5{--accent:#8b5cf6;background:linear-gradient(180deg,#ffffff 0%, #f4efff 100%)}
.mlm-card.color-6{--accent:#06b6d4;background:linear-gradient(180deg,#ffffff 0%, #effcff 100%)}
.sol-scroll:hover .mlm-card:not(:hover){filter:blur(2px) opacity(.65)}
.mlm-card:hover{filter:none;opacity:1;transform:translateY(-4px);box-shadow:0 18px 28px rgba(10,25,60,.12)}
.mlm-card p{margin:0}
.mlm-card .detail{display:none;margin-top:8px;padding-left:18px}
.mlm-card .detail{list-style:none}
.mlm-card .detail li{margin:6px 0;color:#5a6a85;position:relative;padding-left:22px}
.mlm-card .detail li::before{content:"";position:absolute;left:0;top:0;width:16px;height:16px;border-radius:999px;background:#eef4ff;color:#586eff;display:grid;place-items:center;font-size:11px;border:1px solid #e6eefc}
.mlm-card:hover p{display:none}
.mlm-card:hover .detail{display:block}

/* focus mode: blur non‑hovered cards to direct attention */
/* optional programmatic focus blur support — off by default */
/* .sol-scroll.focus-blur .mlm-card{filter:blur(1.2px) opacity(.7)}
.sol-scroll.focus-blur .mlm-card:hover{filter:none;opacity:1} */
@keyframes scrollX{to{transform:translateX(-50%)}}
/* Parallax utilities (site‑wide) */
.parallax-el{will-change:transform;transform:translateZ(0);transform-origin:center center}
@media (prefers-reduced-motion: reduce){
  .parallax-el{transform:none !important}
}
.container-footer{
      max-width: 1400px;
}
/* 

/* Center page H1 specifically */
.entry h1 {
  text-align: center;
  font-size: 2.5rem;     /* optional: adjust size */
  font-weight: 700;      /* optional: bold */
  margin: 40px auto 20px;
}



/* SEO hero wrapper */
.seo-hero{
  padding: 28px 0 12px;
  background: radial-gradient(120% 140% at 10% -20%, #fff 0%, #fbfcff 55%, #f5f7ff 100%);
}

/* Centered title */
.hero-title{
  text-align:center;
  font-size: clamp(28px, 3.2vw, 40px);
  font-weight: 800;
  letter-spacing: -0.015em;
  margin: 10px auto 8px;
  line-height: 1.15;
}

/* Subtitle */
.hero-sub{
  max-width: 880px;
  margin: 6px auto 10px;
  text-align:center;
  color:#667085;
  font-size: clamp(15px, 1.7vw, 17px);
}

/* Breadcrumbs */
.breadcrumbs ol{
  display:flex; gap:8px; align-items:center;
  list-style:none; padding:0; margin:0 auto 10px;
  justify-content:center; color:#667085; font-size:13px;
}
.breadcrumbs a{ color:#475569; text-decoration:none; }
.breadcrumbs .current{ color:#0f172a; }

/* Points */
.hero-points{
  display:flex; flex-wrap:wrap; gap:10px 16px;
  margin: 12px auto 14px; padding:0;
  list-style:none; justify-content:center;
  color:#334155; font-size:14.5px;
}
.hero-points li{ white-space:nowrap; }

/* CTAs */
.hero-ctas{
  display:flex; gap:12px; justify-content:center; margin-top:6px;
}
.hero-ctas .btn{ padding:10px 16px; border-radius:10px; font-weight:700; }
.hero-ctas .btn.ghost{ background:#fff; border:1px solid #e6ebff; }

/* Trust chips */
.trust-mini{
  display:flex; gap:8px; justify-content:center; margin-top:12px;
}
.trust-mini .chip{
  display:inline-block; padding:6px 10px; font-size:12px; font-weight:700;
  background:#eef2ff; border:1px solid #e1e8ff; border-radius:999px; color:#344054;
}

/* ===== Enhanced Navigation Styling ===== */
header.nav{
  position:sticky;
  top:0;
  z-index:1200;
  background:rgba(255,255,255,0.92);
  backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid rgba(226,236,255,0.6);
  box-shadow:0 12px 32px rgba(15,32,80,0.08);
}
header.nav::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(96,106,255,0.08),rgba(255,189,214,0.08));
  pointer-events:none;
  z-index:-1;
}
header.nav .nav-wrap{
  height:78px;
  gap:32px;
}
header.nav .brand img{
  width:38px;
  height:38px;
  border-radius:12px;
}
header.nav .main-nav{
  gap:32px;
  align-items:center;
}
header.nav .top-level> .menu-item> a,
header.nav .top-level> .menu-item> .trigger{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:12px 16px;
  border-radius:14px;
  font-weight:650;
  color:#1b2540;
  transition:all .18s ease;
}
header.nav .top-level> .menu-item> a:hover,
header.nav .top-level> .menu-item> .trigger:hover,
header.nav .top-level> .menu-item.open> a,
header.nav .top-level> .menu-item.open> .trigger{
  color:#2e4bff;
}
header.nav .trigger .trigger-caret{
  margin-left:6px;
  font-size:.72rem;
}
header.nav .menu-item.open > .trigger .trigger-caret{
  transform:rotate(180deg);
}
header.nav .top-level> .menu-item> a::before,
header.nav .top-level> .menu-item> .trigger::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(135deg,rgba(99,106,255,0.12),rgba(152,126,255,0.09));
  opacity:0;
  transform:translateY(4px) scale(.96);
  transition:all .18s ease;
  z-index:-1;
}
header.nav .top-level> .menu-item> a:hover::before,
header.nav .top-level> .menu-item> .trigger:hover::before,
header.nav .top-level> .menu-item.active> a::before,
header.nav .top-level> .menu-item.active> .trigger::before,
header.nav .top-level> .menu-item.open> a::before,
header.nav .top-level> .menu-item.open> .trigger::before{
  opacity:1;
  transform:none;
}
header.nav .main-nav .trigger::after{content:"";}
header.nav .dropdown{
  background:rgba(255,255,255,0.96);
  border:1px solid rgba(120,136,255,0.16);
  border-radius:18px;
  padding:14px 16px;
  box-shadow:0 26px 60px rgba(15,32,80,0.12);
  backdrop-filter:blur(16px);
}
header.nav .dropdown li + li{margin-top:6px;}
header.nav .dropdown a{
  display:block;
  padding:10px 14px;
  border-radius:12px;
  color:#243055;
  transition:all .18s ease;
}
header.nav .dropdown a:hover{
  background:linear-gradient(120deg,rgba(96,106,255,0.12),rgba(146,116,255,0.12));
  color:#2e4bff;
}
header.nav .mega{
  margin-top:18px;
  border-radius:26px;
  border:1px solid rgba(116,132,255,0.18);
  background:rgba(255,255,255,0.96);
  box-shadow:0 30px 80px rgba(15,32,80,0.14);
  padding:28px;
  backdrop-filter:blur(18px);
}
header.nav .mega-inner{
  display:grid;
  grid-template-columns:1.4fr 1fr .9fr;
  gap:34px;
}
header.nav .mega-col h3{
  margin:0 0 18px;
  font-size:1.02rem;
  color:#556288;
  text-transform:uppercase;
  letter-spacing:.18em;
}
header.nav .mega-col ul{margin:0;padding:0;list-style:none;display:flow;gap:14px;}
header.nav .mega a.menu-card,
header.nav .mega a.menu-row{
  display:flex;
  gap:14px;
  align-items:flex-start;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid transparent;
  background:rgba(255,255,255,0.9);
  box-shadow:0 14px 32px rgba(18,32,68,0.08);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  margin-bottom: 18px;
}
header.nav .mega a.menu-card:hover,
header.nav .mega a.menu-row:hover{
  transform:translateY(-3px);
  border-color:rgba(98,112,255,0.35);
  box-shadow:0 22px 54px rgba(18,32,68,0.16);
}
header.nav .mega a strong{display:block;font-weight:700;color:#17213c;margin-bottom:2px;}
header.nav .mega a p{margin:0;color:#5a6889;font-size:.9rem;}
header.nav .mega .ico{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:12px;
  background:linear-gradient(135deg,rgba(99,106,255,0.18),rgba(152,126,255,0.12));
  color:#2e4bff;
  font-weight:700;
}
header.nav .mega .promo{
  background:linear-gradient(150deg,rgba(96,106,255,0.14),rgba(255,204,230,0.16));
  border-radius:22px;
  padding:22px;
  display:flex;
  flex-direction:column;
  gap:12px;
  box-shadow:0 18px 46px rgba(18,32,68,0.12);
}
header.nav .mega .promo img{
  border-radius:18px;
  border:1px solid rgba(255,255,255,0.6);
  box-shadow:0 18px 36px rgba(11,29,68,0.16);
}
header.nav .mega .promo h3{margin:0;font-size:1.05rem;color:#1b2540;}
header.nav .mega .promo p{margin:0;color:#5b6687;}
header.nav .mega .promo .btn{align-self:flex-start;padding:10px 18px;border-radius:12px;}
header.nav .btn.cta{
  border-radius:16px;
  padding:.9rem 1.4rem;
  font-weight:700;
  box-shadow:0 16px 34px rgba(43,108,255,0.24);
}
header.nav .menu-item.small a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:12px;
  background:rgba(99,106,255,0.08);
  color:#1f2a44;
}
@media (max-width:980px){
  header.nav .main-nav{
    box-shadow:none;
    border-radius:0;
    background:rgba(255,255,255,0.98);
    padding:24px 20px 40px;
    height: 100vh;
  }
  header.nav .main-nav .top-level{gap:14px;}
  header.nav .dropdown, header.nav .mega{
    position:static;
    width:100%;
    margin-top:12px;
    box-shadow:none;
    border-radius:18px;
  }
  header.nav .mega-inner{grid-template-columns:1fr;}
  header.nav .mega .promo{order:-1; padding: 10px !important;}
}

.mega-col.promo .video-wrap{
  width: 100%;
  /* keeps 360x220 ratio ~1.636 */
  aspect-ratio: 360 / 220;
  border-radius: 10px;
  overflow: hidden;
}

.mega-col.promo video {
width: 143%;
height: 123%;
display: block;
object-fit: cover;
}

.border-radius-5{
  border-radius: 30%;
}

/* container */
.feature-visual{ position:relative; display:grid; place-items:center; }

/* the video card */
.feature-visual .video-box{
  width:100%;
  max-width:640px;
  aspect-ratio:16/9;
  border-radius:12px;
  overflow:hidden;
  background:#fff;                    /* helps the shadow look solid */
  box-shadow:
    0 22px 60px rgba(15,23,42,.16),
    0 8px 22px rgba(15,23,42,.08);    /* <-- the shadow behind the video */
}

/* video fits the card */
.feature-visual .video-box video{
  width:100%; height:100%;
  display:block;
  object-fit:cover; object-position:center;
}

/* optional: soft glow behind the card (not clipped) */
.feature-visual::before{
  content:"";
  position:absolute; inset:auto 0 18px; margin:auto;
  width:min(90%,740px); height:160px;
  background:radial-gradient(closest-side, rgba(107,108,255,.18), transparent 70%);
  filter:blur(28px);
  z-index:0; pointer-events:none;
}
.feature-visual .video-box{ z-index:1; }   /* keep the card above the glow */
header.nav .mega-plans .mega-inner{
  grid-template-columns:1.45fr 1fr .95fr;
}
header.nav .mega-grid-plans{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px 22px;
}
header.nav .mega-grid-plans .menu-card{
  background:rgba(243,247,255,0.82);
  border:1px solid rgba(122,138,255,0.18);
  border-radius:18px;
  padding:18px 20px;
  box-shadow:none;
}
header.nav .mega-grid-plans .menu-card:hover{
  background:#fff;
  box-shadow:0 26px 54px rgba(18,32,68,0.18);
}
header.nav .mega-grid-plans .menu-card strong{font-size:1rem;}
header.nav .mega-grid-plans .menu-card .ico{
  width:44px;
  height:44px;
  border-radius:14px;
  background:rgba(98,112,255,0.14);
}
header.nav .mega-grid-plans .menu-card .ico img{
  width:100%;
  height:auto;
}
header.nav .mega-list .ico svg{
  width:20px;
  height:20px;
}
header.nav .mega .mega-stack{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:10px;
}
header.nav .mega .mega-stack a{
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:600;
  color:#1f2d4f;
  padding:8px 0;
  border-bottom:1px solid rgba(255,255,255,0.22);
}
header.nav .mega .mega-stack li:last-child a{
  border-bottom:0;
}
header.nav .mega .mega-stack a:hover{
  color:#2e4bff;
}
header.nav .mega .plans-promo{
  background:linear-gradient(150deg,rgba(99,106,255,0.12),rgba(255,204,230,0.16));
  padding:26px;
  gap:16px;
}
header.nav .mega .plans-promo .view-more{
  margin-top:auto;
}
@media (max-width:1080px){
  header.nav .mega-plans .mega-inner{
    grid-template-columns:1fr 1fr;
  }
  header.nav .mega-grid-plans{
    grid-template-columns:1fr 1fr;
  }
  header.nav .mega .plans-promo{
    grid-column:1 / -1;
    order:3;
  }
}
@media (max-width:720px){
  header.nav .mega-plans .mega-inner{
    grid-template-columns:1fr;
  }
  header.nav .mega-grid-plans{
    grid-template-columns:1fr;
  }
}

/* .footer::before{content:"FENIZO";position:absolute;left:50%;bottom:8px;transform:translateX(-50%);font-weight:800;font-size:200px;letter-spacing:8px;color:rgba(88,110,255,.06);pointer-events:none;user-select:none;white-space:nowrap} */



/* 
footer{border-top:1px solid #e6eefc;background:#fff}
.footer{padding:40px 0 70px}
.footer{position:relative}
.footer-card{border:1px solid #e6eefc;border-radius:22px;background:#fff;box-shadow:0 24px 48px rgba(10,25,60,.06);padding:22px}
.foot-top{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:22px}
@media (max-width:900px){.foot-top{grid-template-columns:1fr}}
.foot-brand{display:flex;gap:10px;align-items:center}
.foot-brand .logo{width:36px;height:36px;border-radius:10px;background:#eef4ff;border:1px solid #e6eefc;display:grid;place-items:center;font-weight:800;color:#586eff}
.foot-desc{margin:10px 0 12px;color:#6a7893}
.foot-social{display:flex;gap:10px}
.foot-social a{width:34px;height:34px;border:1px solid #e6eefc;border-radius:999px;display:grid;place-items:center}
.foot-menu h4{margin:0 0 8px}
.foot-menu h4{font-size:1.06rem}
.foot-menu ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.foot-bottom{display:flex;gap:12px;justify-content:space-between;align-items:center;margin-top:16px;padding-top:14px;border-top:1px solid #eef3ff;color:#6a7893}
.footer-wide{margin-top:28px}
.footer-wide .cols{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr 1fr;gap:26px;margin-bottom:177px}
@media (max-width:1000px){.footer-wide .cols{grid-template-columns:1fr 1fr}}
.footer-wide h4{margin:0 0 40px;text-transform:uppercase;letter-spacing:.02em;font-size:1.02rem}
.footer-wide ul{list-style:none;margin:0;padding:0;display:grid;gap:25px}
.footer-wide li a{color:#0f172a}
.footer-wide .contact li{display:flex;align-items:center;gap:10px}
.footer-wide .ico{width:18px;height:18px;border-radius:999px;background:#e9f5ef;display:grid;place-items:center;font-size:11px}
.footer-wide .flag{font-size:14px}
footer { position: relative; } 
footer::before{
content:"FENIZO";
position:absolute;
left:50%;
bottom:clamp(4px, 1.2vw, 8px);
transform:translateX(-50%);
font-weight:800;
font-size:clamp(44px, 15vw, 200px);
letter-spacing:clamp(2px, 0.8vw, 8px);
color:rgba(88,110,255,.06);
pointer-events:none;
user-select:none;
white-space:nowrap;
}
@media (max-width:1200px){ footer::before{ font-size:140px; } }
@media (max-width:992px) { footer::before{ font-size:110px; } }
@media (max-width:768px) { footer::before{ font-size:80px;  letter-spacing:6px; } }
@media (max-width:576px) { footer::before{ font-size:56px;  letter-spacing:4px; bottom:4px; } }
@media (max-width:400px) { footer::before{ font-size:44px;  letter-spacing:2px; } }
 */




/* ---------- Base footer polish ---------- */
.site-footer{
  position:relative;
  border-top:1px solid #e6eefc;
  background:
    radial-gradient(1200px 400px at 80% -120px, rgba(120,140,255,.08), transparent 60%),
    radial-gradient(900px 320px at 0% -100px, rgba(255,170,208,.10), transparent 62%),
    #fff;
  overflow:hidden;
}
.site-footer .footer{ padding:56px 0 76px; }
.site-footer .footer-wide .cols{
  display:grid; grid-template-columns:1.2fr 1fr 1fr 1fr 1fr;
  gap:32px; margin-bottom:160px;
}
@media (max-width:1000px){ .site-footer .footer-wide .cols{ grid-template-columns:1fr 1fr; margin-bottom:90px; } }
@media (max-width:640px){ .site-footer .footer-wide .cols{ grid-template-columns:1fr; } }

.site-footer h4{
  margin:0 0 18px; font-size:1.02rem; text-transform:uppercase; letter-spacing:.08em;
  font-weight:800; color:#0e1528;
}
.site-footer ul{ list-style:none; margin:0; padding:0; display:grid; gap:14px; }
.site-footer a{ color:#0f172a; text-decoration:none; }
.site-footer a:hover{ color:var(--primary); text-decoration:underline; text-underline-offset:3px; }

/* Contact column */
.site-footer .contact .ico{
  width:22px; height:22px; border-radius:999px; background:#e9f5ef;
  display:grid; place-items:center; font-size:12px; color:#047857;
}
.site-footer .contact .flag{ font-size:16px }
.site-footer .ft-cta{ margin-top:16px }

/* Watermark brand you already had */
.site-footer::before{
  content:"FENIZO"; position:absolute; left:50%; bottom:clamp(6px,1.2vw,10px); transform:translateX(-50%);
  font-weight:800; font-size:clamp(44px, 15vw, 200px); letter-spacing:clamp(2px,.8vw,8px);
  color:rgba(88,110,255,.06); pointer-events:none; user-select:none; white-space:nowrap;
}

/* ---------- Seasonal banner (hidden by default) ---------- */
.ft-season{ display:none; position:relative; height:72px; overflow:visible; }
.site-footer.is-christmas .ft-season{ display:block; }

/* soft top glow */
.ft-season::before{
  content:""; position:absolute; inset:-60px -40px auto -40px; height:140px;
  background:radial-gradient(600px 140px at 50% 0, rgba(255,255,255,.8), rgba(255,255,255,0));
  pointer-events:none;
}

/* Santa sleigh */
.ft-santa{ position:absolute; top:-8px; left:-20%; will-change:transform; }
.site-footer.is-christmas .ft-santa{
  animation:ftFlyAcross 18s linear infinite;
}
.ft-santa svg{ filter:drop-shadow(0 6px 10px rgba(12,22,64,.18)); }

/* Snow (subtle, lightweight) */
.ft-snow{
  position:absolute; inset:0; pointer-events:none;
  --flake: radial-gradient(2px 2px at 2px 2px, #fff 98%, transparent);
  background-image: var(--flake), var(--flake), var(--flake), var(--flake), var(--flake);
  background-size: 6px 6px, 5px 5px, 4px 4px, 3px 3px, 2px 2px;
  background-position:
    10% -10px, 30% -30px, 55% -20px, 75% -40px, 90% -25px;
  opacity:.9;
}
.site-footer.is-christmas .ft-snow{
  animation:ftSnowFall 8s linear infinite;
}

/* Animations */
@keyframes ftFlyAcross{
  0%   { transform: translateX(0) translateY(0) }
  50%  { transform: translateX(75vw) translateY(-6px) }
  100% { transform: translateX(110vw) translateY(0) }
}
@keyframes ftSnowFall{
  0%   { background-position:10% -10px, 30% -30px, 55% -20px, 75% -40px, 90% -25px; }
  100% { background-position:10% 110px, 30% 120px, 55% 130px, 75% 140px, 90% 150px; }
}
@media (prefers-reduced-motion:reduce){
  .ft-santa, .ft-snow{ animation:none !important }
}

/* Buttons reuse */
.site-footer .btn.cta{
  background:linear-gradient(90deg,#2b6cff,#5a89ff);
  box-shadow:0 10px 24px rgba(43,108,255,.22),0 6px 10px rgba(43,108,255,.16);
  padding:.8rem 1.2rem; border-radius:12px; color:#fff; border:1px solid #2b6cff;
}

.ft-santa img{
  width: var(--santa-w, 260px);
  height: auto;
  filter: drop-shadow(0 6px 10px rgba(12,22,64,.18));
  display: block;
}

.site-footer.is-christmas .ft-santa{
  animation: ftFlyAcross 18s linear infinite;
}

/* Demo mega menu */
header.nav .mega-demo .container {
  max-width: 1340px;
  padding: 28px 24px 30px;
}

header.nav .mega-demo__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 26px;
  align-items: stretch;
}

header.nav .mega-demo .demo-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 24px;
  border-radius: 24px;
  border: 1px solid rgba(110, 129, 255, 0.16);
  background: linear-gradient(180deg, #ffffff 0%, #f7f9ff 100%);
  box-shadow: 0 26px 50px rgba(15, 23, 42, 0.12);
  min-height: 100%;
}

header.nav .mega-demo .demo-card__head h3 {
  margin: 0 0 10px;
  font-size: 18px;
  color: #061238;
}

header.nav .mega-demo .demo-card__head p {
  margin: 0;
  color: #566080;
  line-height: 1.58;
  font-size: 14px;
}

header.nav .mega-demo .demo-card__media {
  padding: 16px;
  border-radius: 18px;
  background: radial-gradient(circle at 20% 20%, rgba(91, 132, 255, 0.18), rgba(236, 242, 255, 0.36));
  border: 1px solid rgba(43, 108, 255, 0.16);
  display: flex;
  justify-content: center;
  align-items: center;
}

header.nav .mega-demo .demo-card__media img {
  width: 100%;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 20px 38px rgba(43, 108, 255, 0.16);
}

header.nav .mega-demo .demo-card__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 22px;
  border-radius: 16px;
  font-weight: 600;
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
}

header.nav .mega-demo .demo-card__btn--primary {
  background: linear-gradient(135deg, #2b6cff, #5d8dff);
  color: #fff;
  box-shadow: 0 20px 36px rgba(43, 108, 255, 0.22);
}

header.nav .mega-demo .demo-card__btn--primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 32px rgba(43, 108, 255, 0.24);
}

header.nav .mega-demo .demo-card__btn--ghost {
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid rgba(43, 108, 255, 0.32);
  color: #2b6cff;
  box-shadow: none;
}

header.nav .mega-demo .demo-card__btn--ghost:hover {
  background: #fff;
  transform: translateY(-2px);
  box-shadow: 0 14px 28px rgba(43, 108, 255, 0.14);
}

header.nav .mega-demo .demo-card--highlight {
  background: linear-gradient(160deg, rgba(240, 246, 255, 0.96), rgba(222, 234, 255, 0.88));
  border: 1px solid rgba(110, 129, 255, 0.24);
  box-shadow: 0 32px 64px rgba(12, 30, 72, 0.16);
  padding: 32px 28px 28px;
}

header.nav .mega-demo .demo-card__badge {
  position: absolute;
  top: 24px;
  right: 24px;
  padding: 6px 16px;
  border-radius: 999px 999px 6px 999px;
  background: linear-gradient(135deg, #2b6cff, #3f7bff);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  box-shadow: 0 18px 30px rgba(43, 108, 255, 0.32);
}

header.nav .mega-demo .demo-card--highlight h3 {
  margin: 32px 0 18px;
  font-size: 20px;
  line-height: 1.35;
  color: #071437;
}

header.nav .mega-demo .demo-card--highlight h3 span {
  color: #2b6cff;
}

header.nav .mega-demo .demo-card__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 12px;
  font-size: 14px;
  color: #39496e;
}

header.nav .mega-demo .demo-card__list li {
  position: relative;
  padding-left: 20px;
}

header.nav .mega-demo .demo-card__list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 7px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: linear-gradient(135deg, #2b6cff, #5d8dff);
  box-shadow: 0 4px 10px rgba(43, 108, 255, 0.28);
}

header.nav .mega-demo .demo-card__actions {
  margin-top: auto;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

header.nav .mega-demo .demo-card__actions .demo-card__btn {
  flex: 1 1 130px;
}

header.nav .mega-demo__links {
  margin-top: 28px;
  padding-top: 18px;
  border-top: 1px solid rgba(220, 228, 255, 0.9);
  display: flex;
  gap: 28px;
}

header.nav .mega-demo__links a {
  font-weight: 600;
  color: #2b6cff;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

header.nav .mega-demo__links a::after {
  content: '\203a';
  font-size: 18px;
  line-height: 1;
  transition: transform 0.2s ease;
}

header.nav .mega-demo__links a:hover {
  color: #1f4ae6;
}

header.nav .mega-demo__links a:hover::after {
  transform: translateX(3px);
}

@media (max-width: 1200px) {
  header.nav .mega-demo__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {

  .mega-col{padding: 0px!important;}

  header.nav .mega-demo .container {
    padding: 24px 18px 26px;
  }

  header.nav .mega-demo__grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  header.nav .mega-demo .demo-card__actions {
    flex-direction: column;
  }

  header.nav .mega-demo .demo-card__actions .demo-card__btn {
    width: 100%;
  }

  header.nav .mega-demo__links {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
  }
}





/* ================================
   HEADER / NAV ONLY  (drop-in)
   Uses your existing CSS variables
   ================================ */

/* Sticky glass header */
header.nav{
  position:sticky; top:0; z-index:1000;
  background:
    linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.78));
  backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid #eaf0ff;
  box-shadow:0 8px 24px rgba(10,25,60,.05);
}
.nav-wrap{
  height:72px;
  display:flex; align-items:center; justify-content:space-between;
  max-width:var(--max); margin:0 auto; padding:0 20px;
}

/* Brand */
.brand{display:flex; align-items:center; gap:.65rem; font-weight:800}
.brand img{
  height:32px; width:auto; object-fit:contain; /* ensure logo fits */
  image-rendering:auto;
}
.brand span{font-family:var(--font-display); letter-spacing:-.02em}

/* Top-level nav */
.main-nav{display:flex; align-items:center; position:relative; z-index:200}
.main-nav .top-level{
  display:flex; gap:20px; margin:0; padding:0; list-style:none;
}
.main-nav .menu-item{position:relative}
.main-nav .menu-item.has-mega{position:static}

.main-nav .top-level> .menu-item> a,
.main-nav .trigger{
  display:inline-flex; align-items:center; gap:.35rem;
  padding:10px 8px; font:600 0.95rem var(--font-body);
  color:var(--ink); background:transparent; border:0; cursor:pointer;
  transition:color .18s ease;
}
.main-nav .top-level> .menu-item> a:hover,
.main-nav .trigger:hover{color:var(--primary)}

/* Animated underline */
.main-nav .top-level> .menu-item> a::after,
.main-nav .trigger::after{
  content:""; position:absolute; left:8px; right:8px; bottom:2px;
  height:3px; border-radius:3px; background:linear-gradient(90deg,var(--primary),#8a6bff);
  transform:scaleX(0); transform-origin:left; transition:transform .18s ease;
  opacity:.9;
}
.main-nav .top-level> .menu-item:hover> a::after,
.main-nav .menu-item.open> .trigger::after{transform:scaleX(1)}

.trigger .trigger-caret{
  display:inline-block; margin-left:6px; font-size:.72rem;
  transition:transform .2s ease; transform-origin:50% 45%;
}
.main-nav .menu-item.open > .trigger .trigger-caret{transform:rotate(180deg)}

/* Standard dropdown (small) */
.dropdown{
  position:absolute; top:calc(100% + 8px); left:0;
  min-width:240px; padding:10px;
  background:#fff; border:1px solid #e8efff; border-radius:12px;
  box-shadow:var(--shadow);
  opacity:0; visibility:hidden; transform:translateY(6px);
  transition:opacity .16s ease, transform .16s ease, visibility .16s linear;
  pointer-events:none;
}
.menu-item:hover>.dropdown,
.menu-item:focus-within>.dropdown,
.menu-item.open>.dropdown{
  opacity:1; visibility:visible; transform:none; pointer-events:auto;
}
.dropdown ul{margin:0; padding:0; list-style:none}
.dropdown a{display:block; padding:10px 12px; border-radius:10px; color:var(--ink)}
.dropdown a:hover{background:#f3f7ff; color:var(--primary)}

/* ---------- Mega menu (large) ---------- */
.has-mega .mega{
  position:fixed; left:0; right:0; top:51px; /* aligns under header */
  background:linear-gradient(180deg,#ffffff, #f7f9ff);
  border-top:1px solid #e8efff;
  box-shadow:0 30px 60px rgba(6,24,44,.14), 0 12px 24px rgba(6,24,44,.10);
  padding:18px 0; border-radius:0 0 16px 16px;
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:opacity .16s ease, transform .16s ease, visibility .16s linear;
  z-index:900;
}
.has-mega:hover>.mega,
.has-mega.open>.mega,
.has-mega:focus-within>.mega{opacity:1; visibility:visible; transform:none}

/* Mega content grid */
.mega .container{max-width:1536px; padding:0 24px; margin:0 auto}
.mega-inner{
  display:grid; grid-template-columns:1.2fr 1fr .95fr; gap:36px; padding:22px 6px;
}
.mega-col{padding:0 18px}
.mega-col+.mega-col{border-left:1px solid #eef3ff}
.mega-col h3{margin:0 0 10px; padding-bottom:10px; border-bottom:1px solid #eef3ff}

/* Product cards */
.mega-grid{display:grid; grid-template-columns:1fr; gap:14px 22px; list-style:none; margin:14px 0 0; padding:0}
.menu-card{
  display:flex; gap:12px; align-items:flex-start; width:100%;
  padding:14px 16px; border-radius:14px; border:1px solid transparent;
  background:transparent; transition:background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.menu-card .ico{
  width:42px; height:42px; border-radius:12px;
  background:#eef6ff; border:1px solid #e6eeff; display:grid; place-items:center; flex:0 0 42px;
}
.menu-card:hover{
  background:#eef5ff; border-color:#dbe8ff; box-shadow:0 10px 24px rgba(6,24,44,.10);
  transform:translateY(-1px);
}
.menu-card div strong{display:block; font-weight:800; margin-bottom:2px}
.menu-card p{margin:2px 0 0; color:var(--muted); font-size:.95rem; line-height:1.35}

/* Services list */
.mega-list{list-style:none; margin:12px 0 0; padding:0; display:grid; gap:12px}
.menu-row{
  display:flex; gap:12px; align-items:flex-start; width:100%;
  padding:12px 14px; border-radius:12px; border:1px solid transparent;
  transition:background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.menu-row:hover{
  background:#eef5ff; border-color:#dbe8ff; box-shadow:0 8px 20px rgba(6,24,44,.08);
  transform:translateY(-1px);
}
.menu-row p{margin:2px 0 0; color:var(--muted); line-height:1.4}

/* Promo panel (right) */
.promo{
  background:linear-gradient(180deg,#f7faff, #f2f6ff);
  border:1px solid #e7edff; border-radius:16px; padding:16px;
  box-shadow:0 18px 44px rgba(43,108,255,.08);
}
.promo .promo-media{
  width:100%; aspect-ratio:16/9; border-radius:12px; overflow:hidden;
  background:#fafcff; border:1px solid #eef3ff; margin-bottom:14px;
}
.promo .promo-media img{
  width:100%; height:100%; object-fit:cover; /* fit image without distortion */
  display:block;
}
.promo h3{margin:6px 0 4px; font-size:1rem; font-weight:800}
.promo p{margin:0; color:#5d6a86; font-size:.95rem}
.promo .btn{
  margin-top:12px; display:inline-flex; align-items:center; gap:.45rem;
  background:linear-gradient(90deg,#2b6cff,#5a89ff);
  border:1px solid #2b6cff; color:#fff !important; padding:.85rem 1.15rem;
  border-radius:14px; font-weight:800; box-shadow:0 14px 28px rgba(43,108,255,.18),0 8px 16px rgba(43,108,255,.12);
}

/* Make mega links behave like blocks */
.main-nav .mega a{color:inherit; text-decoration:none; padding:0}
.main-nav .mega a.menu-card,
.main-nav .mega a.menu-row{display:flex !important; width:100%}

/* Focus styles */
.main-nav a:focus,
.main-nav .trigger:focus,
.dropdown a:focus,
.menu-card:focus,
.menu-row:focus{
  outline:2px solid var(--ring); outline-offset:2px; border-radius:10px;
}

/* Mobile */
.nav-toggle{display:none}
@media (max-width:980px){
  .nav-toggle{
    display:inline-flex; align-items:center; gap:.55rem;
    padding:.55rem .85rem; border-radius:12px;
    border:1px solid rgba(43,108,255,.26);
    background:rgba(43,108,255,.08); color:#1b2540; font-weight:600;
  }
  .main-nav{
    position:fixed; inset:72px 0 0 0; background:#fff;
    display:none; flex-direction:column; gap:12px; padding:16px; overflow:auto;
    box-shadow:0 18px 30px rgba(6,24,44,.12);
  }
  .main-nav.open{display:flex}
  .main-nav .top-level{flex-direction:column; gap:8px}
  .dropdown{position:static; border:0; box-shadow:none; padding:0; opacity:1; visibility:visible; transform:none; pointer-events:auto}
  .has-mega .mega{position:static; box-shadow:none; border:1px solid #eef3ff; border-radius:12px; opacity:1; visibility:visible; transform:none}
  .mega .container{max-width:100%}
  .mega-inner{grid-template-columns:1fr; gap:16px; padding:10px 0}
  .mega-col+.mega-col{border-left:0; border-top:1px solid #eef3ff; padding-top:12px}

  .mega .container{
    padding: 0px !important;
  }
}


header.nav .brand img,
header.nav .brand .custom-logo,
header.nav .custom-logo-link img{
  height: var(--logo-size);
  width: auto;
  max-height: var(--logo-size);
}

/* make header a touch taller if needed */
header.nav .nav-wrap{ height: calc(var(--logo-size) + 32px); }

/* optional: larger on wide screens */
@media (min-width:1280px){
  :root{ --logo-size: 44px; }
}

.ico img{
  width: 100px;
}





/* Mobile */
.nav-toggle{
  display:none !important;
  align-items:center;
  gap:.55rem;
  padding:.55rem .85rem;
  border-radius:12px;
  border:1px solid rgba(43,108,255,.26);
  background:rgba(43,108,255,.08);
  color:#1b2540;
  font-weight:600;
  font-size:.95rem;
  line-height:1;
  box-shadow:none;
  transition:background .18s ease,color .18s ease,border-color .18s ease;
}
.nav-toggle__bars{
  display:inline-flex;
  flex-direction:column;
  justify-content:space-between;
  width:20px;
  height:14px;
}
.nav-toggle__bars span{
  display:block;
  height:2px;
  border-radius:12px;
  background:currentColor;
  transition:transform .18s ease,opacity .18s ease;
}
.nav-toggle__label{
  font-size:.9rem;
  letter-spacing:.01em;
}
.nav-toggle:hover{
  background:rgba(43,108,255,.14);
  border-color:rgba(43,108,255,.36);
}
.nav-toggle[aria-expanded="true"]{
  background:var(--primary);
  color:#fff;
  border-color:var(--primary);
}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars span{
  background:#fff;
}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars span:nth-child(1){
  transform:translateY(6px) rotate(45deg);
}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars span:nth-child(2){
  opacity:0;
}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars span:nth-child(3){
  transform:translateY(-6px) rotate(-45deg);
}
@media (max-width:980px){
  .nav-toggle{display:inline-flex !important}
  .main-nav{position:fixed;inset:72px 0 0 0;background:#fff;display:none;flex-direction:column;gap:12px;padding:16px;overflow:auto}
  .main-nav.open{display:flex}
  .main-nav .top-level{flex-direction:column;gap:8px}
  .dropdown{position:static;border:0;box-shadow:none;padding:0;margin-left:10px;opacity:1;visibility:visible;transform:none}
  .menu-item.open>.dropdown{opacity:1;visibility:visible}
  .has-mega .mega{display:block;position:static;border:0;box-shadow:none;border-radius:12px;opacity:1;visibility:visible;transform:none}
  .has-mega.open>.mega{opacity:1;visibility:visible}
  .mega .container{max-width:100%}
  .mega-inner{grid-template-columns:1fr;gap:16px;padding:10px 0}
  .mega-col+.mega-col{border-left:0;border-top:1px solid #eef3ff;padding-top:12px}
}




/* PRELOADER (your styles kept) */
#preloader{
  position:fixed; inset:0; display:grid; place-items:center; 
  background:radial-gradient(60% 80% at 10% 0%, rgba(255,152,197,.25) 0, rgba(255,152,197,0) 60%),radial-gradient(50% 60% at 90% 10%, rgba(137,167,255,.25) 0, rgba(137,167,255,0) 60%),linear-gradient(180deg,#ffffff 0%, #f6f7ff 100%);
  z-index:9999; transition:opacity .7s ease, visibility .7s ease;
}
#preloader.hidden{opacity:0; visibility:hidden}

.wordmark{display:flex; align-items:center; gap:20px; user-select:none}
.wordmark .chunk{display:flex; gap:10px}

/* letters now start hidden; JS adds .in to trigger drop */
.letter{
  font-weight:900; font-size: clamp(40px, 6vw, 80px); letter-spacing:.02em;
  color: transparent;
  background:linear-gradient(90deg,#586eff 0%, #8a6bff 45%, #ff77a9 80%, #ff9a6e 100%);
  -webkit-background-clip: text;
  text-shadow: 0 6px 20px rgba(123,77,255,.25);
  transform: translateY(10px); opacity:0;
}
.letter.in{ animation: drop .6s ease forwards; }

/* coin as the “O” */
.coin-wrapper{width: clamp(48px,6.5vw,86px); height: clamp(48px,6.5vw,86px); perspective:800px}
.coin{
  --c1:#7b4dff; --c2:#a882ff; --edge:#5b36d6;
  width:100%; height:100%; border-radius:50%; position:relative;
  background: linear-gradient(90deg,#586eff 0%, #8a6bff 45%, #ff77a9 80%, #ff9a6e 100%);
  box-shadow: inset 8px -8px 20px rgba(0,0,0,.25), 0 8px 24px rgba(123,77,255,.35);
  transform-style:preserve-3d;
  animation: spin 1.4s linear infinite;
}
.coin::after{
  content:""; position:absolute; inset:-2px; border-radius:50%;
  background: radial-gradient(60% 60% at 30% 30%, rgba(255,255,255,.5), transparent 60%),
              conic-gradient(from 90deg, var(--edge), var(--c1), var(--edge));
  transform: translateZ(-14px); filter:blur(.4px);
}

/* FIXED spin keyframes (no duplicates) */
@keyframes spin{
  0%   { transform: rotateY(0deg) rotateX(12deg); }
  50%  { transform: rotateY(180deg) rotateX(12deg); box-shadow: inset 2px -2px 12px rgba(0,0,0,.35), 0 8px 28px rgba(123,77,255,.45); }
  100% { transform: rotateY(360deg) rotateX(12deg); }
}

@keyframes drop{ to{ transform:translateY(0); opacity:1 } }

.ml15 {
  font-weight: 800;
  font-size: 3.8em;
  text-transform: uppercase;
  letter-spacing: 0.5em;
}

.ml15 .word {
  display: inline-block;
  line-height: 1em;
}


/* Base: sections hidden until revealed */
.section.will-reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .6s ease, transform .6s ease;
}

/* When visible */
.section.will-reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* Stagger children inside each section */
.section.will-reveal :where(.wrap-hide, .hero__heading, .subheading,
  .courses__col, .steps__list-item, .reviews__block) {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity .5s ease, transform .5s ease;
}

.section.will-reveal.is-visible .reveal-child {
  opacity: 1;
  transform: none;
}


/* =============== MINI-HERO UPGRADE =============== */
.chain-panel--hero{
  /* bigger, airier */
  min-height: clamp(180px, 30vh, 320px);
  padding: clamp(22px, 5vw, 44px) clamp(22px, 5vw, 48px);
  grid-template-columns: 1.2fr .9fr;
  border-radius: 22px;
  background:
    /* subtle dark-to-light sweep */
    radial-gradient(120% 140% at 80% 50%, rgba(12,14,22,.08) 0%, rgba(12,14,22,0) 45%),
    linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.92) 100%);
  box-shadow:
    0 18px 60px rgba(2,6,23,.10),
    0 2px 0 rgba(2,6,23,.06);
  overflow: hidden;
}

/* left text: bolder headline & spacing */
.chain-panel--hero .chain-copy h3{
  font-size: clamp(26px, 3.2vw, 40px);
  line-height: 1.1;
  margin-bottom: 14px;
}
.chain-panel--hero .chain-copy p{
  font-size: clamp(15px,1.2vw,18px);
  max-width: 52ch;
  margin-bottom: 20px;
}

/* CTA pill: more presence */
.chain-panel--hero .btn.secondary{
  padding: 12px 18px;
  font-size: 15px;
  box-shadow: 0 6px 20px rgba(67,56,202,.18);
}

/* Right area: larger bubbles in a soft neon ribbon */
.chain-panel--hero .crypto-icons{
  gap: clamp(10px,1.6vw,18px);
  align-self: center;
  justify-self: end;
  padding: 8px 10px;
  background: rgba(255,255,255,.55);
  border-radius: 999px;
  backdrop-filter: blur(6px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 12px 30px rgba(15,23,42,.08);
}

.chain-panel--hero .crypto-icons span{
  width: clamp(38px, 3.6vw, 46px);
  height: clamp(38px, 3.6vw, 46px);
  font-size: clamp(15px,1.6vw,18px);
  border: 1px solid rgba(99,102,241,.22);
  background: linear-gradient(180deg,#f7faff 0%, #eef2ff 100%);
  box-shadow:
    inset 0 1px 0 #fff,
    0 8px 22px rgba(2,6,23,.10);
}
.chain-panel--hero .crypto-icons span:hover{
  transform: translateY(-4px) scale(1.03);
}

/* Hero glow & “edge light” arcs (pure CSS) */
.chain-panel--hero::before,
.chain-panel--hero::after{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:0;
}

/* colored glow blob on the right (like the neon rim of the globe) */
.chain-panel--hero::before{
  right:-18%;
  top:-35%;
  width: 70%;
  height: 190%;
  background:
    radial-gradient(40% 40% at 70% 50%, rgba(124,58,237,.28) 0%, rgba(99,102,241,.22) 28%, rgba(14,165,233,.18) 55%, rgba(255,255,255,0) 70%);
  filter: blur(12px);
}

/* faint circular “rim” */
.chain-panel--hero::after{
  right:-6%;
  top: 8%;
  width: 58%;
  height: 84%;
  border-radius: 50%;
  background:
    radial-gradient(60% 60% at 50% 50%, rgba(255,255,255,.5), rgba(255,255,255,0) 70%);
  mix-blend-mode: screen;
  opacity:.35;
}

/* raise content above glows */
.chain-panel--hero .chain-copy,
.chain-panel--hero .crypto-icons{ position:relative; z-index:1; }

/* Hover lift for whole panel */
.chain-panel--hero:hover{
  transform: translateY(-2px);
  box-shadow:
    0 24px 70px rgba(2,6,23,.14),
    0 3px 0 rgba(2,6,23,.06);
}

/* Responsive: stack & center the icon ribbon */
@media (max-width: 860px){
  .chain-panel--hero{
    grid-template-columns: 1fr;
    min-height: auto;
    padding: 22px;
  }
  .chain-panel--hero .crypto-icons{
    justify-self: start;
    margin-top: 10px;
  }
  .chain-panel--hero::before{ right:-30%; top:-55%; width: 100%; height: 200%; }
  .chain-panel--hero::after{ right:-10%; top:10%; width:70%; height:70%; }
}

/* Optional: dark skin toggle if your page has a dark section */
.chain-panel--hero.is-dark{
  background:
    radial-gradient(120% 140% at 80% 50%, rgba(0,0,0,.35) 0%, rgba(0,0,0,0) 45%),
    linear-gradient(180deg, #0b0f1a 0%, #0c111f 100%);
  color:#e5e7eb;
  border-color: rgba(148,163,184,.16);
}
.chain-panel--hero.is-dark .chain-copy p{ color:#a3a9b8; }
.chain-panel--hero.is-dark .crypto-icons{ background: rgba(13,18,30,.6); }
.chain-panel--hero.is-dark .crypto-icons span{
  background: linear-gradient(180deg,#121a2a 0%, #0e1525 100%);
  color:#e5e7eb;
  border-color: rgba(99,102,241,.38);
}

@media (max-width: 980px) {
#fenizo-features .container.split {
    grid-template-columns: 
    
    1fr !important;
}
.over-flow-ul:first-of-type h2 {
    font-size: 38px;
}

li:not(:last-of-type) {
    color: oklch(
      var(--lightness) var(--base-chroma)
        calc(var(--start) + (var(--step) * var(--i)))
    );
    margin-bottom: 20px;
}
.faq-aside {
     position: static;
    top: 84px;
}
}