:root{
  --navy:#061832;
  --navy-2:#0a244d;
  --navy-3:#102f63;
  --ink:#0f1e43;
  --muted:#667693;
  --line:#dde7f2;
  --line-2:#cfdced;
  --blue:#2f6df6;
  --blue-2:#4c86ff;
  --purple:#7957ff;
  --cyan:#13b8ee;
  --green:#21bf87;
  --red:#ff5a65;
  --orange:#ffad42;
  --surface:#ffffff;
  --surface-soft:#f7faff;
  --shadow:0 20px 50px rgba(24,54,105,.10);
  --shadow-soft:0 10px 28px rgba(24,54,105,.07);
  --container:1380px;
  --header-h:76px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--ink);font-family:Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.modal-open{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
svg{display:block}
.svg-sprite{position:absolute;width:0;height:0;overflow:hidden}
.container{width:min(calc(100% - 48px),var(--container));margin:0 auto}
.logo-dark{filter:brightness(0)}
.section-kicker{display:inline-block;font-size:11px;line-height:1.3;letter-spacing:.16em;text-transform:uppercase;font-weight:800;color:#4c7cff}
.section-kicker.on-dark{color:#72d0ff}
.dark-section{color:#fff}
.reveal{opacity:0;transform:translateY(24px);filter:blur(5px);transition:opacity .72s ease,transform .72s ease,filter .72s ease}
.reveal.visible{opacity:1;transform:none;filter:none}
.scroll-progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:9999;background:rgba(38,89,190,.06)}
.scroll-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--purple),var(--cyan));box-shadow:0 0 16px rgba(70,116,255,.6)}

/* Buttons */
.btn{border:0;border-radius:12px;padding:12px 19px;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:700;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,background .2s ease}
.btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.btn:hover{transform:translateY(-2px)}
.btn-primary{color:#fff;background:linear-gradient(135deg,#6b5cff,#236df8 62%,#11b8ef);box-shadow:0 10px 28px rgba(63,92,244,.28)}
.btn-primary:hover{box-shadow:0 16px 34px rgba(63,92,244,.38)}
.btn-ghost{color:#fff;background:rgba(255,255,255,.04);border:1px solid rgba(187,214,255,.5);backdrop-filter:blur(10px)}
.btn-ghost:hover{background:rgba(255,255,255,.09);border-color:rgba(211,229,255,.75)}
.btn-secondary{background:#f1f5fb;color:#24365e;border:1px solid #dbe5f1}
.btn-lg{min-height:50px;padding-inline:22px}
.btn-small{min-height:42px;padding:10px 16px;border-radius:10px;font-size:13px}

/* Header & navigation */
.site-header{height:var(--header-h);position:sticky;top:0;z-index:2000;background:rgba(255,255,255,.96);backdrop-filter:blur(16px);border-bottom:1px solid rgba(209,222,240,.9);box-shadow:0 4px 18px rgba(25,53,98,.04)}
.nav-shell{height:100%;display:flex;align-items:center;gap:24px}
.brand{display:flex;align-items:center;flex:none;width:170px;height:42px;overflow:hidden}
.brand img{width:100%;height:100%;object-fit:contain;object-position:left center;filter:brightness(0)}
.desktop-nav{margin-left:auto;display:flex;align-items:center;gap:2px}
.nav-item{position:relative}
.nav-link{height:44px;appearance:none;border:0;background:transparent;padding:0 13px;display:inline-flex;align-items:center;gap:6px;border-radius:10px;color:#172a52;font-size:14px;font-weight:700;white-space:nowrap;transition:.2s ease}
.nav-link>svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;transition:transform .2s ease}
.nav-link:hover,.nav-link:focus-visible,.has-menu.open>.nav-link{color:var(--blue);background:#f2f6ff;outline:0}
.has-menu:hover>.nav-link>svg,.has-menu.open>.nav-link>svg{transform:rotate(180deg)}
.direct-link{padding-inline:15px}
.nav-actions{display:flex;align-items:center;gap:11px;margin-left:10px;flex:none}
.login-link{display:inline-flex;align-items:center;justify-content:center;height:42px;padding:0 12px;color:#20345e;font-size:13px;font-weight:700;border-radius:9px;transition:.2s}
.login-link:hover{background:#f1f5fb;color:var(--blue)}

.dropdown-panel{position:absolute;top:calc(100% + 13px);left:50%;width:360px;padding:12px;background:rgba(255,255,255,.985);border:1px solid #dce6f3;border-radius:16px;box-shadow:0 24px 64px rgba(17,42,85,.18);opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,10px) scale(.985);transform-origin:top center;transition:opacity .18s ease,transform .18s ease,visibility .18s;z-index:2100}
.dropdown-panel::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.has-menu:hover>.dropdown-panel,.has-menu:focus-within>.dropdown-panel,.has-menu.open>.dropdown-panel{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0) scale(1)}
.nav-item[data-align="right"]>.dropdown-panel{left:auto;right:0;transform:translateY(10px) scale(.985);transform-origin:top right}
.nav-item[data-align="right"]:hover>.dropdown-panel,.nav-item[data-align="right"]:focus-within>.dropdown-panel,.nav-item[data-align="right"].open>.dropdown-panel{transform:translateY(0) scale(1)}
.dropdown-wide{width:560px;padding:14px}
.dropdown-head{padding:5px 8px 11px;margin-bottom:5px;border-bottom:1px solid #edf2f8;display:flex;align-items:baseline;justify-content:space-between;gap:14px}
.dropdown-head span{font:700 12px Poppins,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#20365f}
.dropdown-head small{font-size:10px;color:#8592a9;text-align:right}
.dropdown-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.dropdown-panel>a,.dropdown-grid>a{display:flex;align-items:center;gap:11px;padding:11px;border-radius:11px;transition:.18s}
.dropdown-panel>a:hover,.dropdown-grid>a:hover{background:#f3f7ff;transform:translateX(1px)}
.dropdown-panel b,.dropdown-grid b{display:block;font-size:12px;color:#15284d}
.dropdown-panel small,.dropdown-grid small{display:block;font-size:10px;color:#7887a2;margin-top:3px;line-height:1.35}
.menu-icon{width:34px;height:34px;border-radius:10px;background:linear-gradient(145deg,#eef3ff,#e7efff);display:grid;place-items:center;color:#4f6ff2;flex:none}
.menu-icon svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.dropdown-standard>a{display:block}
.dropdown-highlight{margin-top:5px!important;background:linear-gradient(90deg,#eef4ff,#f7f5ff);color:#2b63f2;display:flex!important;justify-content:space-between;align-items:center}
.dropdown-highlight b{color:#2b63f2}
.mobile-toggle{display:none;width:42px;height:42px;border:1px solid #dce5f0;border-radius:10px;background:#fff;padding:10px}
.mobile-toggle span{display:block;height:2px;background:#18325f;margin:5px 0;border-radius:10px;transition:.2s}
.mobile-nav{display:none;background:#fff;border-top:1px solid #e4ebf4;box-shadow:0 18px 36px rgba(20,43,79,.12)}
.mobile-nav-inner{padding:13px 0 18px;display:grid;gap:2px}.mobile-nav summary,.mobile-nav>a{display:flex;justify-content:space-between;align-items:center;padding:13px 8px;font-weight:700;color:#17305b;cursor:pointer;list-style:none}.mobile-nav details>a{display:block;padding:10px 16px;color:#60708d;font-size:13px}.mobile-nav-cta{display:flex;gap:10px;align-items:center;padding:14px 8px 0;border-top:1px solid #edf1f7;margin-top:8px}.mobile-nav-cta>a{font-weight:700;color:#264b86}

/* Hero */
.hero{position:relative;background:radial-gradient(circle at 83% 16%,rgba(10,164,231,.22),transparent 24%),radial-gradient(circle at 64% 22%,rgba(89,68,255,.14),transparent 28%),linear-gradient(135deg,#07162f 0%,#08244a 54%,#071a37 100%);overflow:hidden;padding:44px 0 0;min-height:0}
#auroraCanvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.hero-grid-lines{position:absolute;inset:0;background-image:linear-gradient(rgba(76,130,225,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(76,130,225,.05) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.85),transparent 76%)}
.hero-layout{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,.88fr) minmax(580px,1.12fr);gap:54px;align-items:center}
.hero-copy{padding:10px 0 38px;max-width:620px}.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:10px;letter-spacing:.13em;text-transform:uppercase;font-weight:800;color:#78d1ff}.eyebrow>span{width:8px;height:8px;border-radius:50%;background:#28d194;box-shadow:0 0 0 6px rgba(40,209,148,.12)}
.hero h1{font:700 clamp(46px,4.7vw,72px)/1.03 Poppins,sans-serif;letter-spacing:-.045em;margin:18px 0 20px}.hero h1>span{background:linear-gradient(90deg,#78c3ff,#56a1ff 42%,#936fff 74%,#55e3c2);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-lede{max-width:610px;color:#c4d4ec;font-size:16px;line-height:1.75;margin:0}.hero-actions{display:flex;gap:13px;margin-top:28px}.hero-benefits{display:flex;flex-wrap:wrap;gap:22px;margin-top:24px;color:#d7e5f7;font-size:11px;font-weight:600}.hero-benefits span{display:flex;align-items:center;gap:7px}.hero-benefits i{width:18px;height:18px;display:grid;place-items:center;border:1px solid #6bc9ff;border-radius:50%;color:#6bc9ff}.hero-benefits svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:2.2}
.hero-product{height:455px;position:relative;perspective:1200px}.product-glow{position:absolute;inset:9% 0 2% 10%;background:radial-gradient(circle,rgba(22,157,255,.30),transparent 65%);filter:blur(30px)}
.dashboard-window{position:absolute;right:2%;top:24px;width:84%;height:385px;border-radius:19px;overflow:hidden;background:#f9fbff;border:1px solid rgba(255,255,255,.7);box-shadow:0 30px 90px rgba(0,0,0,.36),0 0 0 2px rgba(74,138,255,.16);transform:rotateY(-3deg) rotateX(1.4deg);transform-style:preserve-3d;transition:transform .2s ease}
.dashboard-topbar{height:48px;display:flex;align-items:center;gap:15px;padding:0 15px;background:#fff;border-bottom:1px solid #e8eef6}.dashboard-logo{width:82px;height:24px;object-fit:contain;object-position:left center}.dashboard-search{flex:1;max-width:310px;height:28px;border:1px solid #e1e8f1;border-radius:7px;display:flex;align-items:center;gap:7px;color:#9aa7bb;padding:0 9px;font-size:8px}.dashboard-search svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.8}.dash-actions{margin-left:auto;display:flex;align-items:center;gap:8px}.round-dot{width:22px;height:22px;border:1px solid #e3e9f2;border-radius:6px}.profile-dot{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#edf4ff;color:#3166d6;font-size:8px;font-weight:800}
.dashboard-body{display:grid;grid-template-columns:122px 1fr;height:calc(100% - 48px)}.dash-sidebar{background:#fbfcff;border-right:1px solid #edf1f6;padding:13px 9px;display:grid;align-content:start;gap:6px;color:#74829b;font-size:8px}.dash-sidebar>div{padding:7px 8px;border-radius:6px;display:flex;align-items:center;gap:7px}.dash-sidebar svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.8}.dash-nav-active{background:#edf3ff;color:#4566e8!important;font-weight:700}.dash-main{padding:13px;color:#223154;overflow:hidden}.dash-main-head{display:flex;align-items:flex-start;justify-content:space-between}.dash-main-head strong{display:block;font-size:13px}.dash-main-head small{display:block;margin-top:3px;color:#8f9bb0;font-size:8px}.dash-main-head button{display:flex;align-items:center;gap:3px;border:1px solid #e1e7f0;background:#fff;color:#66738d;border-radius:7px;padding:6px 8px;font-size:8px}.dash-main-head button svg{width:10px;height:10px;fill:none;stroke:currentColor;stroke-width:2}.dash-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:11px}.dash-metrics>div{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto auto;column-gap:7px;align-items:center;border:1px solid #e5ebf3;background:#fff;border-radius:10px;padding:8px}.metric-icon{grid-row:1/4;width:27px;height:27px;border-radius:8px;display:grid;place-items:center}.metric-icon svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8}.metric-icon.blue{background:#e8f2ff;color:#2972ff}.metric-icon.purple{background:#f0eaff;color:#8059ff}.metric-icon.green{background:#e5f9f0;color:#18af78}.metric-icon.red{background:#fff0f1;color:#ff5d68}.dash-metrics small{font-size:7px;color:#8794aa}.dash-metrics b{font-size:12px}.dash-metrics em{font-style:normal;font-size:7px;color:#9ba7b9}.dash-chart-row{display:grid;grid-template-columns:1.65fr .75fr;gap:8px;margin-top:8px}.dash-chart{height:185px;border:1px solid #e6ecf4;border-radius:10px;background:#fff;padding:10px}.chart-head{display:flex;justify-content:space-between;align-items:center;font-size:9px}.chart-head small{color:#9aa6b7}.bar-chart{height:114px;margin-top:13px;display:flex;align-items:flex-end;gap:5px;border-bottom:1px solid #e7edf5;background:repeating-linear-gradient(to top,#f2f5fa 0 1px,transparent 1px 28px)}.bar-chart span{flex:1;height:0;max-height:var(--h);background:linear-gradient(to top,#3c8df8 0 22%,#ff6669 22% 36%,#26bf83 36% 58%,#b7ad5a 58%);border-radius:3px 3px 0 0;animation:chartGrow 1.3s ease forwards;animation-delay:var(--d)}@keyframes chartGrow{to{height:var(--h)}}.chart-legend{display:flex;gap:9px;margin-top:7px;color:#8a96aa;font-size:6px}.chart-legend span{display:flex;align-items:center;gap:3px}.chart-legend i{width:5px;height:5px;border-radius:1px}.c1{background:#3c8df8}.c2{background:#ff6669}.c3{background:#26bf83}.mini-risk-chart{display:flex;flex-direction:column}.risk-donut{width:82px;height:82px;margin:15px auto 7px;border-radius:50%;background:conic-gradient(#ff5f69 0 18%,#ffbe4f 18% 55%,#1fc98a 55%);position:relative}.risk-donut::after{content:"";position:absolute;inset:14px;border-radius:50%;background:#fff}.risk-donut>div{position:absolute;inset:0;z-index:2;display:grid;place-content:center;text-align:center}.risk-donut b{font-size:15px}.risk-donut small{font-size:6px}.risk-legend{display:grid;grid-template-columns:repeat(3,auto);gap:4px;color:#8190aa;font-size:6px}.risk-legend span{display:flex;align-items:center;gap:3px}.risk-legend i{width:5px;height:5px;border-radius:50%;background:#ff5f69}.risk-legend span:nth-child(2) i{background:#ffbe4f}.risk-legend span:nth-child(3) i{background:#1fc98a}
.float-card{position:absolute;display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.97);color:#1e3158;border:1px solid rgba(211,224,242,.95);box-shadow:0 18px 44px rgba(1,16,38,.26);border-radius:14px;padding:11px 12px;z-index:6}.float-card small,.float-card b,.float-card em,.float-card strong{display:block}.float-card small{font-size:7px;font-weight:700;color:#5e6e88}.float-card b{font-size:9px;margin-top:4px}.float-card em{font-size:7px;color:#7f8ba0;font-style:normal;margin-top:2px}.float-card strong{font-size:18px;margin-top:3px}.float-badge{width:35px;height:35px;border-radius:11px;display:grid;place-items:center;flex:none}.float-badge svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9}.float-badge.amber{background:#fff1c8;color:#d99b00}.float-badge.red{background:#ffe7e9;color:#f14d59}.float-badge.green{background:#e4faef;color:#13ad74}.framework-float{right:-2%;top:0;width:225px}.active-pill{margin-left:auto;background:#dcf7eb;color:#0ba56b;font-size:6px;font-weight:800;padding:4px 6px;border-radius:4px}.risk-float{left:3%;bottom:5px;width:220px}.risk-tag{position:absolute;right:9px;top:35px;font-size:6px;background:#fff0f0;color:#f3515a;padding:3px 5px;border-radius:4px}.mini-spark{display:flex;align-items:flex-end;gap:2px;height:27px;margin-left:auto;padding-top:8px}.mini-spark i{width:4px;background:#5ec7ff;border-radius:2px}.mini-spark i:nth-child(1){height:6px}.mini-spark i:nth-child(2){height:9px}.mini-spark i:nth-child(3){height:13px}.mini-spark i:nth-child(4){height:17px}.mini-spark i:nth-child(5){height:20px}.mini-spark i:nth-child(6){height:24px}.evidence-float{right:-1%;bottom:16px;width:210px;display:grid;grid-template-columns:auto 48px 1fr;gap:8px}.evidence-title{grid-column:2/4}.mini-donut{width:45px;height:45px;border-radius:50%;background:conic-gradient(#21bf87 0 34%,#1da9e6 34% 65%,#ffb549 65% 94%,#ff5c67 94%);position:relative}.mini-donut::after{content:"";position:absolute;inset:9px;border-radius:50%;background:#fff}.evidence-list{display:grid;gap:3px}.evidence-list span{font-size:5.6px;color:#65738c}.evidence-list i{display:inline-block;width:5px;height:5px;border-radius:2px;margin-right:3px}.evidence-list .g{background:#21bf87}.evidence-list .o{background:#ffb549}.evidence-list .b{background:#1da9e6}.evidence-list .r{background:#ff5c67}.hand-note{position:absolute;right:-1%;top:370px;color:#73cbff;font:italic 12px/1.25 Georgia,serif;transform:rotate(-6deg)}
.floating{animation:floatY 4.4s ease-in-out infinite}.floating.reverse{animation-direction:reverse;animation-duration:5.1s}@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.trust-wrap{position:relative;z-index:3;border-top:1px solid rgba(159,193,239,.16);padding:14px 0 18px}.trust-wrap>p{text-transform:uppercase;letter-spacing:.15em;color:#89a8cf;font-size:8px;font-weight:800;margin:0 0 10px}.logo-marquee{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}.logo-track{display:flex;align-items:center;width:max-content;animation:marquee 30s linear infinite;will-change:transform}.logo-group{display:flex;align-items:center;justify-content:space-between;gap:42px;flex:0 0 var(--container);width:var(--container);padding:0 24px}.logo-group>span{white-space:nowrap;color:#f4f8ff}.logo-track:hover{animation-play-state:paused}.logo-cyber{display:grid;grid-template-columns:28px auto;grid-template-rows:auto auto;align-items:center;column-gap:8px;font-weight:700;font-size:11px}.logo-cyber i{grid-row:1/3;width:26px;height:26px;display:block;background:linear-gradient(135deg,#67d3ff,#1d6bff);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}.logo-cyber small{font-size:7px;font-weight:500;color:#bdd2ef}.text-logo{font-size:18px;font-weight:700;opacity:.95}.microsoft-logo{display:flex;align-items:center;gap:8px}.microsoft-logo b{width:15px;height:15px;background:linear-gradient(90deg,#fff 0 46%,transparent 46% 54%,#fff 54%);position:relative}.microsoft-logo b::after{content:"";position:absolute;left:0;right:0;top:46%;height:8%;background:#061832}.aws-logo{font-size:24px;font-weight:500}.deloitte-logo span{color:#5dd47b}.infosys-logo{font-family:Georgia,serif;font-weight:500}.wipro-logo,.accenture-logo,.tata-logo{letter-spacing:-.03em}@keyframes marquee{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

/* Manual chaos comparison */
.manual-chaos{padding:72px 0 42px;background:radial-gradient(circle at 88% 10%,#f4f9ff,transparent 28%),#fff}.section-heading{max-width:900px}.section-heading.center{text-align:center;margin:0 auto 36px}.section-heading h2,.numbers-intro h2,.story h2,.closing-cta h2{font-family:Poppins,sans-serif;letter-spacing:-.035em}.section-heading h2{font-size:clamp(30px,3.1vw,47px);line-height:1.12;margin:9px 0 10px}.section-heading p{max-width:760px;margin:0 auto;color:var(--muted);font-size:15px;line-height:1.7}.comparison-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.comparison-card{position:relative;overflow:hidden;border:1px solid #dbe5f1;border-radius:22px;padding:24px;background:#fff;box-shadow:var(--shadow-soft);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}.comparison-card:hover{transform:translateY(-4px);box-shadow:0 22px 52px rgba(23,58,113,.12)}.old-card{background:linear-gradient(145deg,#fff,#fffafb)}.new-card{background:linear-gradient(145deg,#fff,#f8fffc)}.old-card::before,.new-card::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.8}.old-card::before{background:radial-gradient(circle at 93% 88%,rgba(255,95,106,.06),transparent 34%)}.new-card::before{background:radial-gradient(circle at 90% 88%,rgba(33,191,135,.07),transparent 34%)}.compare-head{position:relative;z-index:2;display:flex;align-items:center;gap:13px;padding-bottom:18px;border-bottom:1px solid #edf1f6}.compare-head h3{font:700 20px Poppins,sans-serif;margin:0;color:#13264c}.compare-head p{margin:3px 0 0;color:#73819a;font-size:12px}.compare-icon{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;box-shadow:0 0 0 8px rgba(0,0,0,.026);flex:none}.compare-icon svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.compare-icon.danger{background:linear-gradient(145deg,#ff6670,#f54f5a)}.compare-icon.success{background:linear-gradient(145deg,#2bcd94,#19b979)}.compare-body{position:relative;z-index:2;display:grid;grid-template-columns:minmax(260px,1fr) minmax(255px,.9fr);gap:18px;align-items:center;padding-top:20px;min-height:265px}.compare-list{list-style:none;padding:0;margin:0;display:grid;gap:15px}.compare-list li{position:relative;padding-left:30px;color:#50617e;font-size:14px;line-height:1.4}.compare-list li::before{position:absolute;left:0;top:1px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;font-size:11px}.danger-list li::before{content:"×";background:#ff5a65}.success-list li::before{content:"✓";background:#20bf83}.old-way-visual,.network-visual{position:relative;height:220px;border-radius:16px;background:linear-gradient(180deg,rgba(249,251,255,.72),rgba(255,255,255,.4));border:1px solid rgba(224,233,244,.68);overflow:hidden}.source-grid{position:absolute;left:50%;top:26px;transform:translateX(-50%);width:180px;display:grid;grid-template-columns:1fr 1fr;gap:24px 48px;z-index:2}.source-card{width:58px;height:58px;border-radius:13px;display:grid;place-items:center;color:#fff;font-weight:800;font-size:12px;box-shadow:0 12px 26px rgba(45,67,108,.15)}.source-card.excel{background:#18b77b}.source-card.pdf{background:#f1515d}.source-card.sheet{background:#64748b}.source-card.drive{background:#397bf0}.source-card svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8}.merge-lines{position:absolute;inset:0;width:100%;height:100%;z-index:1}.merge-lines path,.network-lines path{fill:none;stroke:#91afe0;stroke-width:1.7;stroke-dasharray:5 5}.state-pill{position:absolute;left:50%;transform:translateX(-50%);bottom:16px;padding:10px 20px;border-radius:10px;font-weight:800;font-size:13px;white-space:nowrap;z-index:4}.old-state{background:#fff0f1;color:#ff4550}.new-state{background:#dbf7eb;color:#0aa66c}.network-lines{position:absolute;inset:0;width:100%;height:100%;z-index:1}.network-hub{position:absolute;left:50%;top:47%;transform:translate(-50%,-50%);width:60px;height:60px;border:2px solid #d4dff0;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 12px 28px rgba(43,75,128,.10);z-index:3}.network-hub img{width:31px;height:31px;object-fit:contain}.network-node{position:absolute;display:flex;align-items:center;gap:6px;background:#fff;border:1px solid #dce6f1;border-radius:10px;padding:9px 11px;box-shadow:0 8px 22px rgba(42,73,123,.08);font-size:10px;font-weight:800;color:#233760;z-index:3}.network-node svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.9}.node-controls{left:6%;top:18%;color:#6e5df5}.node-evidence{right:4%;top:17%;color:#2c9ce6}.node-risk{left:5%;top:58%;color:#ef4f5c}.node-framework{right:2%;top:58%;color:#735af7}

/* Numbers */
.numbers{padding:18px 0 48px;background:linear-gradient(180deg,#f7faff,#fff)}.numbers-grid{display:grid;grid-template-columns:1.25fr repeat(4,1fr);gap:14px;align-items:stretch}.numbers-intro{padding:18px 6px 10px 0}.numbers-intro h2{font-size:32px;margin:5px 0 8px}.numbers-intro p{margin:0;color:#72809a;font-size:12px;line-height:1.6;max-width:270px}.stat-card{background:#fff;border:1px solid #e1e9f3;border-radius:17px;padding:20px 18px;box-shadow:0 14px 34px rgba(37,72,124,.06);min-height:170px;display:flex;flex-direction:column;justify-content:center;transition:.25s}.stat-card:hover{transform:translateY(-5px);box-shadow:0 22px 44px rgba(37,72,124,.11);border-color:#cfdcf0}.stat-icon{width:42px;height:42px;border-radius:12px;background:linear-gradient(145deg,#f1edff,#e8e7ff);color:#6f5cff;display:grid;place-items:center;margin-bottom:13px}.stat-icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8}.stat-card strong{font:800 36px/1 Poppins,sans-serif;letter-spacing:-.04em;color:#0b1d47}.stat-card p{margin:9px 0 0;color:#667592;font-size:12px;line-height:1.45}

/* Story / rotating testimonials */
.story{position:relative;padding:48px 0;background:linear-gradient(110deg,#062449,#0a3e77 72%,#0a315d);overflow:hidden}.story::after{content:"";position:absolute;right:-5%;top:-50%;width:480px;height:480px;border-radius:50%;background:radial-gradient(circle,rgba(62,161,255,.18),transparent 68%)}.story-lines{position:absolute;inset:0;background-image:linear-gradient(90deg,transparent 64%,rgba(255,255,255,.04) 64%);opacity:.6}.story-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr 1fr .78fr;gap:26px;align-items:center}.story-copy h2{font-size:31px;line-height:1.13;margin:8px 0 10px}.story-copy p{margin:0;color:#ccdcf3;font-size:13px;line-height:1.7}.testimonial-shell{min-height:235px;border:1px solid rgba(144,193,255,.28);background:rgba(8,40,82,.7);border-radius:18px;padding:24px 24px 18px;display:flex;flex-direction:column;box-shadow:0 20px 48px rgba(0,0,0,.12)}.quote-mark{font:64px/1 Georgia,serif;color:#6cd0ff;height:42px}.testimonial-shell>p{color:#e1ebf8;font-size:13px;line-height:1.7;margin:6px 0 18px;min-height:67px;transition:opacity .22s,transform .22s}.testimonial-shell.is-changing>p,.testimonial-shell.is-changing .testimonial-person{opacity:0;transform:translateY(5px)}.testimonial-person{display:flex;align-items:center;gap:11px;transition:opacity .22s,transform .22s}.avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#1a4e94;font-weight:800;font-size:11px}.testimonial-person b,.testimonial-person small{display:block}.testimonial-person b{font-size:11px}.testimonial-person small{font-size:9px;color:#abc4e8;margin-top:3px}.testimonial-controls{display:flex;align-items:center;gap:10px;margin-top:auto;padding-top:14px;border-top:1px solid rgba(171,204,245,.12)}.testimonial-arrow{width:28px;height:28px;border-radius:8px;border:1px solid rgba(180,211,248,.25);background:rgba(255,255,255,.04);color:#cde1fb;display:grid;place-items:center}.testimonial-arrow:hover{background:rgba(255,255,255,.09)}.testimonial-dots{display:flex;gap:6px}.testimonial-dots button{width:7px;height:7px;border:0;border-radius:50%;background:#56759f;padding:0}.testimonial-dots button.active{width:20px;border-radius:10px;background:#72cfff}.story-proof{padding-left:24px;border-left:1px solid rgba(187,215,248,.24)}.proof-brand{display:flex;align-items:center;gap:11px}.proof-cube{width:38px;height:38px;background:linear-gradient(135deg,#62d4ff,#1f6aff);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}.proof-brand b{font-size:15px}.proof-brand small{display:block;font-size:9px;font-weight:500;color:#b9d2ee}.story-proof ul{list-style:none;padding:0;margin:17px 0 0;display:grid;gap:9px}.story-proof li{font-size:10px;color:#dfebf8;padding-left:20px;position:relative;line-height:1.45}.story-proof li::before{content:"✓";position:absolute;left:0;top:0;color:#65d3ff}

/* How it works */
.how{padding:70px 0 64px;background:#fff}.how .section-heading{margin-bottom:36px}.process-track{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding-top:6px}.process-line{position:absolute;left:8%;right:8%;top:53px;height:2px;background:#e1e8f3;z-index:0}.process-line span{display:block;width:0;height:100%;background:linear-gradient(90deg,#3477f4,#8060f2,#21c89a,#ff9b4a);transition:width 1.4s ease}.process-track.active .process-line span{width:100%}.process-step{position:relative;z-index:1;text-align:center;padding:0 12px}.step-orb{width:82px;height:82px;border-radius:50%;margin:0 auto 18px;display:grid;place-items:center;position:relative;background:#fff;border:2px solid currentColor;box-shadow:0 0 0 8px #fff}.step-orb::after{content:"";position:absolute;inset:8px;border-radius:50%;background:currentColor;opacity:.13}.step-orb>span{position:absolute;top:9px;left:50%;transform:translateX(-50%);font-weight:800;font-size:18px;z-index:2}.step-orb svg{position:absolute;bottom:10px;width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.9;z-index:2}.blue-orb{color:#3377f5}.purple-orb{color:#815ef4}.green-orb{color:#21bf94}.orange-orb{color:#ff9550}.step-copy{background:#fff;border:1px solid #e5ebf3;border-radius:16px;padding:17px 15px 18px;min-height:145px;box-shadow:0 12px 30px rgba(32,65,116,.05);transition:.25s}.process-step:hover .step-copy{transform:translateY(-5px);box-shadow:0 20px 40px rgba(32,65,116,.10);border-color:#d2def0}.step-copy h3{font:700 15px Poppins,sans-serif;margin:0 0 8px;color:#13264d}.step-copy p{margin:0;color:#6d7c98;font-size:11.5px;line-height:1.55}

/* Features */
.features{padding:52px 0 70px;background:linear-gradient(180deg,#fbfdff,#f5f9ff)}.split-heading{display:flex;justify-content:space-between;align-items:end;gap:28px;max-width:none;margin-bottom:28px}.split-heading h2{margin:8px 0 0}.split-heading>a{display:flex;align-items:center;gap:5px;padding-bottom:8px;color:#2b66f7;font-size:12px;font-weight:800}.split-heading>a svg,.feature-card>a svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:17px}.feature-card{background:#fff;border:1px solid #dfe8f3;border-radius:18px;padding:17px;box-shadow:0 14px 36px rgba(28,62,116,.06);transition:.25s}.feature-card:hover{transform:translateY(-6px);box-shadow:0 24px 48px rgba(28,62,116,.12);border-color:#cbd9ef}.feature-title{display:flex;align-items:center;gap:9px}.feature-title>span{width:34px;height:34px;border-radius:10px;background:#f0edff;color:#6c5bff;display:grid;place-items:center}.feature-title>span svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8}.feature-title h3{font:700 13px Poppins,sans-serif;margin:0}.mini-ui{height:115px;border:1px solid #e5ecf5;background:#fbfcff;border-radius:11px;padding:12px;margin-top:14px;overflow:hidden}.framework-ui,.control-ui{display:grid;align-content:start;gap:10px}.framework-ui>div,.control-ui>div{font-size:8px;display:flex;align-items:center;gap:7px;color:#334260}.framework-ui b{margin-left:auto;font-size:6px;padding:3px 5px;background:#dbf7eb;color:#0aa66b;border-radius:4px}.shield-dot{width:21px;height:21px;border-radius:6px;display:grid;place-items:center;font-style:normal;color:#fff;font-size:8px}.amber-bg{background:#e4a100}.blue-bg{background:#2767c8}.green-bg{background:#22a56f}.control-ui i{width:13px;height:13px;border:1px solid #d8e2ef;border-radius:3px}.control-ui b{margin-left:auto;font-size:5.5px;padding:3px 4px;border-radius:3px}.warn-chip{background:#fff0d9;color:#ef9e16}.ok-chip{background:#dcf8ec;color:#0aa46b}.scope-out{background:#eee9ff;color:#6f59d9}.risk-ui b{font-size:9px}.risk-bar{display:grid;grid-template-columns:2fr 4fr 6fr;height:26px;margin-top:23px;border-radius:4px;overflow:hidden;color:#fff;text-align:center;line-height:26px;font-size:7px}.risk-bar .high{background:#ff5360}.risk-bar .medium{background:#ffc24f}.risk-bar .low{background:#22be7f}.risk-bar-labels{display:grid;grid-template-columns:2fr 4fr 6fr;text-align:center;margin-top:7px;color:#74819b}.risk-bar-labels small{font-size:7px}.evidence-ui{display:grid;grid-template-columns:minmax(0,1fr) 78px;align-items:center;column-gap:28px;padding-left:14px;padding-right:14px}.evidence-copy{display:grid;gap:8px}.evidence-copy span{font-size:7px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:6px;color:#677590;padding-right:2px}.evidence-copy span b{min-width:22px;text-align:right;font-variant-numeric:tabular-nums}.evidence-copy i{width:7px;height:7px;border-radius:2px}.orange-dot{background:#ffb549}.green-dot2{background:#20bf83}.red-dot2{background:#ff5c67}.blue-dot2{background:#427cff}.feature-donut{width:72px;height:72px;border-radius:50%;background:conic-gradient(#20bf83 0 34%,#1da9e6 34% 68%,#ffb549 68% 96%,#ff5c67 96%);position:relative}.feature-donut::after{content:"";position:absolute;inset:17px;background:#fff;border-radius:50%}.feature-card>p{font-size:11px;line-height:1.55;color:#697791;min-height:52px}.feature-card>a{display:inline-flex;align-items:center;gap:4px;font-size:10px;color:#2767f5;font-weight:800}

/* Closing CTA + footer */
.closing-cta{position:relative;overflow:hidden;padding:44px 0;background:linear-gradient(105deg,#071a3b,#0a3770 58%,#153c88)}.cta-wave{position:absolute;inset:0;background:radial-gradient(circle at 90% 10%,rgba(115,91,255,.22),transparent 30%),linear-gradient(150deg,transparent 0 62%,rgba(75,141,255,.09) 62% 64%,transparent 64%)}.cta-mark{position:absolute;right:3%;top:50%;transform:translateY(-50%);width:220px;opacity:.035}.cta-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.35fr auto;gap:22px 34px;align-items:center}.cta-grid h2{font-size:34px;margin:7px 0 9px}.cta-grid p{margin:0;color:#c8d9ee;font-size:13px;line-height:1.6;max-width:750px}.cta-actions{display:flex;gap:10px}.cta-benefits{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.14);padding-top:20px;display:flex;justify-content:flex-end;gap:46px}.cta-benefits span{display:flex;align-items:center;gap:8px;color:#dce8f8}.cta-benefits svg{width:20px;height:20px;fill:none;stroke:#76cfff;stroke-width:1.8}.cta-benefits b{font-size:11px}
.site-footer{background:#03162e;color:#dbe7f9;padding:30px 0 18px}.footer-grid{display:grid;grid-template-columns:1.5fr repeat(4,.8fr) .55fr;gap:27px;align-items:start}.footer-logo{display:block;width:150px;height:39px}.footer-logo img{width:100%;height:100%;object-fit:contain;object-position:left center}.footer-brand p{font-size:11px;line-height:1.55;color:#9fb3d0;margin:10px 0 0}.footer-col h4{font-size:11px;color:#fff;margin:2px 0 10px}.footer-col a{display:block;font-size:9px;color:#9db0cb;margin:7px 0;transition:.2s}.footer-col a:hover{color:#fff;transform:translateX(2px)}.footer-social{display:flex;justify-content:flex-end;gap:8px}.footer-social a{width:28px;height:28px;border:1px solid #405778;border-radius:6px;display:grid;place-items:center;color:#eaf1fb;font-size:11px}.footer-bottom{border-top:1px solid rgba(156,182,219,.16);margin-top:22px;padding-top:15px;display:flex;justify-content:space-between;gap:20px;color:#7589a8;font-size:8px}.footer-bottom a{color:#9db2d0}

/* Modal */
.modal{position:fixed;inset:0;z-index:5000;display:none;place-items:center;padding:24px}.modal.open{display:grid}.modal-backdrop{position:absolute;inset:0;background:rgba(2,12,29,.67);backdrop-filter:blur(8px)}.modal-dialog{position:relative;width:min(900px,100%);max-height:min(88vh,760px);overflow:auto;background:#fff;border:1px solid #e1e8f1;border-radius:20px;padding:28px;box-shadow:0 35px 100px rgba(0,0,0,.32)}.modal-close{position:absolute;right:14px;top:13px;width:34px;height:34px;border-radius:9px;border:1px solid #dde5ef;background:#fff;color:#385077;font-size:22px}.modal-logo{width:120px;height:31px;object-fit:contain;object-position:left center;margin-bottom:16px}.walkthrough-dialog h2,.demo-dialog h2{font:700 31px/1.15 Poppins,sans-serif;letter-spacing:-.035em;margin:8px 0 18px}.walkthrough-stage{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.walk-step{border:1px solid #e2e9f2;background:#f8fbff;border-radius:14px;padding:16px;opacity:.5;transition:.2s}.walk-step.active{opacity:1;border-color:#b9ccff;background:#f1f5ff;box-shadow:0 12px 30px rgba(56,91,176,.09)}.walk-step>span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#346ff3;color:#fff;font-weight:800}.walk-step b,.walk-step small{display:block}.walk-step b{margin-top:14px;font-size:13px}.walk-step small{margin-top:6px;color:#6e7c94;font-size:10px;line-height:1.5}.walkthrough-controls{display:flex;align-items:center;justify-content:space-between;margin-top:20px}.walk-dots{display:flex;gap:6px}.walk-dots button{width:8px;height:8px;padding:0;border:0;background:#c4cede;border-radius:50%}.walk-dots button.active{width:24px;border-radius:10px;background:#3e73f6}.demo-dialog{display:grid;grid-template-columns:.9fr 1.1fr;gap:30px}.demo-copy p{color:#6f7d95;font-size:13px;line-height:1.65}.demo-copy ul{padding-left:18px;color:#2c4975;font-size:12px;line-height:1.9}.demo-dialog form{display:grid;grid-template-columns:1fr 1fr;gap:14px}.demo-dialog label{font-size:11px;font-weight:700;color:#283b61}.demo-dialog input,.demo-dialog select,.demo-dialog textarea{width:100%;margin-top:6px;border:1px solid #dbe4ef;border-radius:9px;padding:11px 12px;color:#1e3358;background:#fff;outline:none;transition:.2s}.demo-dialog input:focus,.demo-dialog select:focus,.demo-dialog textarea:focus{border-color:#6b83f4;box-shadow:0 0 0 3px rgba(76,112,244,.10)}.demo-dialog label.full,.form-footer.full{grid-column:1/-1}.form-footer{display:flex;align-items:center;justify-content:space-between;gap:12px}.form-footer p{font-size:10px;color:#6f7d95;margin:0}

/* Responsive */
@media(max-width:1220px){
  .desktop-nav{display:none}.nav-actions{margin-left:auto}
  .hero-layout{grid-template-columns:1fr;gap:18px}.hero-copy{max-width:780px}.hero-product{width:min(930px,100%);margin:0 auto}.hero{padding-top:34px}.comparison-grid{grid-template-columns:1fr}.numbers-grid{grid-template-columns:repeat(4,1fr)}.numbers-intro{grid-column:1/-1}.numbers-intro p{max-width:560px}.story-grid{grid-template-columns:1fr 1fr}.story-proof{grid-column:1/-1;border-left:0;border-top:1px solid rgba(187,215,248,.22);padding:18px 0 0}.feature-grid{grid-template-columns:1fr 1fr}.cta-grid{grid-template-columns:1fr 1fr}.cta-benefits{grid-column:1/-1;justify-content:flex-start}.footer-grid{grid-template-columns:1.3fr repeat(4,1fr)}.footer-social{grid-column:1/-1;justify-content:flex-start}
}
@media(max-width:800px){
  :root{--header-h:68px}.container{width:min(calc(100% - 28px),var(--container))}.brand{width:138px;height:35px}.login-link,.btn-small{display:none}.hero{padding-top:34px}.hero h1{font-size:44px}.hero-lede{font-size:14px}.hero-product{height:420px}.dashboard-window{width:96%;right:2%;height:325px;transform:none}.dashboard-body{grid-template-columns:82px 1fr}.dash-sidebar span{display:none}.dash-sidebar>div{justify-content:center}.dash-chart-row{display:none}.dash-metrics{grid-template-columns:1fr 1fr}.framework-float{right:-1%;top:7px}.risk-float{left:-1%;bottom:8px}.evidence-float{display:none}.hand-note{display:none}.compare-body{grid-template-columns:1fr}.old-way-visual,.network-visual{height:205px}.numbers-grid{grid-template-columns:1fr 1fr}.story-grid{grid-template-columns:1fr}.story-proof{grid-column:auto}.process-track{grid-template-columns:1fr 1fr;gap:24px 16px}.process-line{display:none}.feature-grid{grid-template-columns:1fr}.split-heading{display:block}.split-heading>a{display:inline-flex;margin-top:12px}.cta-grid{grid-template-columns:1fr}.cta-actions{flex-wrap:wrap}.cta-benefits{gap:22px;justify-content:flex-start}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.footer-social{grid-column:1/-1}.footer-bottom{flex-direction:column}.walkthrough-stage{grid-template-columns:1fr 1fr}.demo-dialog{grid-template-columns:1fr}.demo-dialog form{grid-template-columns:1fr}.demo-dialog label.full,.form-footer.full{grid-column:auto}
}
@media(max-width:520px){
  .hero h1{font-size:38px}.hero-actions{display:grid}.hero-actions .btn{width:100%}.hero-benefits{gap:12px;font-size:10px}.hero-product{height:405px}.dashboard-window{top:40px}.framework-float,.risk-float{width:195px}.manual-chaos{padding-top:54px}.section-heading h2{font-size:30px}.compare-body{padding-top:16px}.compare-card{padding:18px}.compare-list li{font-size:12px}.numbers-grid{grid-template-columns:1fr}.process-track{grid-template-columns:1fr}.step-orb{width:74px;height:74px}.cta-benefits{justify-content:space-between;gap:10px}.cta-benefits b{font-size:9px}.footer-grid{grid-template-columns:1fr 1fr}.modal{padding:10px}.modal-dialog{padding:24px 18px}.form-footer{align-items:stretch;flex-direction:column}.form-footer .btn{width:100%}.walkthrough-stage{grid-template-columns:1fr}.walkthrough-controls{gap:8px}.walk-dots{display:none}
}
@media(max-width:720px){.logo-group{flex-basis:1080px;width:1080px;gap:36px;padding:0 28px}.logo-track{animation-duration:24s}}

@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.logo-track{animation:none}.reveal{opacity:1;transform:none;filter:none}}

/* ========================================================================== */
/* XZLENZ FINAL COMPOSED DESIGN — v7                                           */
/* ========================================================================== */

:root{
  --container:1520px;
  --header-h:84px;
  --navy:#061a3a;
  --navy-2:#0a2f68;
  --navy-3:#123f8a;
  --ink:#0e1d48;
  --muted:#65779a;
  --blue:#3778ff;
  --purple:#7b5cff;
  --cyan:#1bc5ef;
  --green:#21c58b;
}

/* ----- header / nav ------------------------------------------------------- */
.site-header{
  height:var(--header-h);
  background:rgba(255,255,255,.985);
  backdrop-filter:blur(18px);
  border-bottom:1px solid #dce6f4;
  box-shadow:0 7px 28px rgba(18,45,91,.06);
}
.nav-shell{height:100%;gap:22px}
.brand{width:205px;height:56px}
.brand img{width:100%;height:100%;object-fit:contain;object-position:left center;filter:brightness(0)}
.desktop-nav{margin-left:auto;gap:4px;align-self:stretch}
.nav-item{display:flex;align-items:center}
.nav-link{
  height:100%;padding:0 17px;border-radius:0;color:#12244f;font-size:15px;font-weight:700;
  position:relative;background:transparent!important;
}
.nav-link::after{
  content:"";position:absolute;left:17px;right:17px;bottom:0;height:3px;border-radius:3px 3px 0 0;
  background:linear-gradient(90deg,var(--blue),var(--purple));transform:scaleX(0);transform-origin:center;transition:.2s ease;
}
.nav-link:hover,.nav-link:focus-visible,.has-menu.open>.nav-link{color:#2d62db}
.nav-link:hover::after,.nav-link:focus-visible::after,.has-menu.open>.nav-link::after{transform:scaleX(1)}
.nav-link>svg{width:13px;height:13px;margin-left:2px}
.nav-actions{margin-left:14px;gap:12px}
.login-link{height:44px;padding:0 14px;font-size:14px;border-radius:10px;color:#1c3769}
.btn-small{min-height:48px;padding:12px 20px;border-radius:12px;font-size:14px}

.dropdown-panel{
  top:calc(100% + 10px);border-radius:18px;border:1px solid #dbe5f2;
  box-shadow:0 26px 70px rgba(17,43,86,.18);padding:14px;
}
.dropdown-wide{width:610px}
.dropdown-standard{width:360px}
.dropdown-head{padding:5px 8px 12px;margin-bottom:7px}
.dropdown-head span{font-size:12px;color:#1c3563}.dropdown-head small{font-size:10px;max-width:235px}
.dropdown-grid{gap:7px}
.dropdown-panel>a,.dropdown-grid>a{padding:12px;border-radius:12px}
.menu-icon{width:36px;height:36px;border-radius:11px}
.dropdown-panel b,.dropdown-grid b{font-size:13px}
.dropdown-panel small,.dropdown-grid small{font-size:10.5px}
.nav-item[data-align="right"]>.dropdown-panel{right:-8px}

/* ----- hero --------------------------------------------------------------- */
.hero{
  padding:26px 0 0;
  background:
    linear-gradient(90deg,rgba(5,20,50,.86) 0%,rgba(5,22,55,.73) 34%,rgba(6,30,70,.38) 62%,rgba(5,24,58,.16) 100%),
    url('../assets/hero-bg.webp') center/cover no-repeat;
  min-height:0;
  overflow:hidden;
}
#auroraCanvas{opacity:.16}
.hero-grid-lines{opacity:.35}
.hero-stage{
  position:relative;z-index:3;
  border:1px solid rgba(128,185,255,.25);
  border-radius:30px;
  background:linear-gradient(105deg,rgba(4,20,48,.58),rgba(6,36,78,.26));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 24px 78px rgba(2,13,34,.25);
  overflow:visible;
  padding:24px 28px 16px;
}
.hero-stage::before{
  content:"";position:absolute;inset:0;border-radius:30px;pointer-events:none;
  background:radial-gradient(circle at 79% 18%,rgba(53,175,255,.10),transparent 30%);
}
.hero-layout{
  position:relative;z-index:2;grid-template-columns:minmax(0,.92fr) minmax(640px,1.08fr);gap:42px;align-items:center;
}
.hero-copy{padding:30px 0 38px;max-width:650px}
.eyebrow{font-size:11px;letter-spacing:.15em;color:#77d7ff}.eyebrow>span{width:9px;height:9px}
.hero h1{font-size:clamp(50px,4vw,80px);line-height:.99;letter-spacing:-.052em;margin:24px 0 24px}
.hero h1>span{background:linear-gradient(90deg,#69bcff 0%,#528dff 35%,#825cff 68%,#5dddc6 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-lede{font-size:16.5px;line-height:1.72;color:#d6e1f2;max-width:620px}
.hero-actions{margin-top:28px;gap:14px}.hero-actions .btn{min-width:190px}
.hero-benefits{margin-top:24px;gap:28px;font-size:12px;color:#e2ecfa}
.hero-product{
  height:500px;position:relative;perspective:1300px;
  border:1px solid rgba(157,199,255,.24);border-radius:28px;
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.025));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 28px 72px rgba(2,12,31,.28);
  overflow:visible;
}
.hero-product::before{content:"";position:absolute;inset:12px;border:1px solid rgba(172,208,255,.10);border-radius:21px;pointer-events:none}
.product-glow{inset:8% 2% 0 12%;opacity:.75}
.dashboard-window{right:4%;top:66px;width:84%;height:360px;border-radius:22px;transform:rotateY(-2deg) rotateX(.7deg);box-shadow:0 34px 90px rgba(0,0,0,.33),0 0 0 1px rgba(76,142,255,.20)}
.dashboard-topbar{height:46px}.dashboard-body{height:calc(100% - 46px)}
.dashboard-logo{width:100px;max-height:32px;object-fit:contain;filter:brightness(0)}
.dashboard-search{height:28px;display:flex;align-items:center;gap:6px;font-size:8px}.dashboard-search svg{width:12px;height:12px}
.dash-actions{display:flex;gap:7px;align-items:center;margin-left:auto}.round-dot{width:20px;height:20px;border-radius:7px;background:#f1f5fb;border:1px solid #e5ebf4}.profile-dot{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#eef4ff;color:#3569d6;font-size:7px;font-weight:800}
.framework-float{right:-1.5%;top:21px;width:270px;padding:13px}.risk-float{left:-2%;bottom:10px;width:250px}.evidence-float{right:-1%;bottom:19px;width:230px}.hand-note{right:10px;bottom:-3px}

/* ----- fixed company strip ------------------------------------------------ */
.trust-wrap{position:relative;z-index:4;margin-top:20px;padding:20px 0 24px;border-top:1px solid rgba(255,255,255,.18)}
.trust-wrap>p{font-size:10px;letter-spacing:.18em;color:#c2d5ef;margin:0 0 15px;text-transform:uppercase;font-weight:800}
.company-row{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));align-items:center;border-top:1px solid rgba(255,255,255,.05)}
.company-logo{position:relative;min-height:64px;display:flex;align-items:center;justify-content:center;gap:9px;color:#f7fbff;font-weight:700;font-size:20px;white-space:nowrap;padding:0 18px;text-align:center}
.company-logo:not(:last-child)::after{content:"";position:absolute;right:0;top:50%;transform:translateY(-50%);width:1px;height:36px;background:rgba(255,255,255,.38)}
.cybercube{font-size:13px;line-height:1.02}.cybercube small{display:block;font-size:8px;font-weight:500;margin-top:2px}.cyber-cube-mark{width:30px;height:30px;flex:none;background:linear-gradient(135deg,#50cbff,#1470ff);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.microsoft-logo{font-size:18px}.microsoft-logo b{width:18px;height:18px;background:linear-gradient(90deg,#fff 0 46%,transparent 46% 54%,#fff 54%);position:relative;flex:none}.microsoft-logo b::after{content:"";position:absolute;left:0;right:0;top:46%;height:8%;background:#0a2552}
.aws-logo{font-size:25px;font-weight:500}.deloitte-logo span{color:#65d47d}.infosys-logo{font-family:Georgia,serif;font-size:22px;font-weight:500}.wipro-logo{font-size:20px}.accenture-logo{font-size:19px}.accenture-logo sup{font-size:11px;color:#b881ff;margin-left:2px}.tata-logo{font-size:21px}

/* ----- compliance challenge ---------------------------------------------- */
.manual-chaos{padding:76px 0 56px;background:radial-gradient(circle at 86% 12%,#f5faff,transparent 28%),linear-gradient(180deg,#fff,#fbfdff)}
.manual-chaos .section-heading{max-width:1120px;margin-bottom:46px}
.manual-chaos .section-heading h2{font-size:clamp(42px,4vw,64px);line-height:1.03;max-width:1000px;margin:10px auto 20px;color:#0e1c4a}
.manual-chaos .section-heading p{font-size:18px;line-height:1.65;max-width:940px;color:#66789c}
.manual-chaos .section-kicker{font-size:12px;letter-spacing:.16em}
.comparison-grid{gap:26px}
.comparison-card{border-radius:24px;padding:30px 32px;box-shadow:0 18px 46px rgba(33,68,122,.07);border:1px solid #dbe5f1;min-height:430px}
.compare-head{padding-bottom:22px}.compare-head h3{font-size:24px}.compare-head p{font-size:14px;margin-top:4px}.compare-icon{width:56px;height:56px}.compare-icon svg{width:26px;height:26px}
.compare-body{grid-template-columns:minmax(310px,1.05fr) minmax(300px,.95fr);gap:28px;min-height:295px;padding-top:24px}
.compare-list{gap:17px}.compare-list li{font-size:16px;line-height:1.35;padding-left:31px}.compare-list li::before{width:22px;height:22px;top:0}
.old-way-visual,.network-visual{height:245px;border-radius:18px;background:linear-gradient(180deg,#fbfcff,#fff);border:1px solid #e2e9f3}
.old-diagram{position:relative;width:100%;height:100%}.old-node{width:66px;height:66px;border-radius:15px;font-size:14px}.old-node svg{width:24px;height:24px}.old-xls{left:27px;top:30px}.old-pdf{right:27px;top:30px}.old-doc{left:28px;top:124px}.old-controls{right:28px;top:124px}.old-way-visual .merge-lines path{stroke-width:1.8;stroke:#94b3e3;stroke-dasharray:6 6}.old-way-visual .state-pill{bottom:20px;font-size:15px;padding:12px 24px;border-radius:14px}
.network-hub{width:68px;height:68px}.network-hub img{width:36px;height:36px}.network-node{font-size:11px;padding:10px 13px}.network-node svg{width:14px;height:14px}.state-pill.new-state{bottom:20px;font-size:15px;padding:12px 24px;border-radius:14px}

/* ----- how XZLENZ works: compact horizontal reference style -------------- */
.how{padding:66px 0 62px;background:#fff}
.how .section-heading{margin-bottom:34px;max-width:1100px}.how .section-heading h2{font-size:clamp(36px,3.2vw,52px);max-width:1000px;margin-left:auto;margin-right:auto}
.how-steps{display:grid;grid-template-columns:1fr 36px 1fr 36px 1fr 36px 1fr;align-items:center;gap:10px;margin-top:12px}
.how-step{display:grid;grid-template-columns:88px 1fr;align-items:center;gap:14px;min-width:0}
.step-stack{position:relative;height:132px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}
.step-stack::before{content:"";position:absolute;left:50%;top:54px;bottom:34px;width:2px;background:#dfe8f5;transform:translateX(-50%)}
.step-number,.step-symbol{position:relative;z-index:2;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#fff;box-shadow:0 0 0 5px #fff,0 0 0 7px currentColor;font:800 18px/1 Poppins,sans-serif}
.step-symbol svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.step-blue{color:#3977f7}.step-purple{color:#805ff5}.step-green{color:#25c69a}.step-orange{color:#fa9651}
.step-blue .step-number,.step-blue .step-symbol{background:#edf4ff}.step-purple .step-number,.step-purple .step-symbol{background:#f2efff}.step-green .step-number,.step-green .step-symbol{background:#ecfbf6}.step-orange .step-number,.step-orange .step-symbol{background:#fff4eb}
.step-text h3{font:700 17px/1.2 Poppins,sans-serif;margin:0 0 9px;color:#10224d}.step-text p{font-size:13px;line-height:1.55;color:#6c7c99;margin:0}.step-chevron{font-size:42px;color:#705aff;text-align:center;font-weight:300;margin-top:-12px}

/* ----- built by practitioners section background ------------------------- */
.story{background:linear-gradient(110deg,rgba(6,32,73,.86),rgba(8,50,104,.80) 60%,rgba(7,34,76,.82)),url('../assets/story-bg.webp') center/cover no-repeat}.story::after{display:none}.story-lines{opacity:.35}

/* ----- v4-style closing CTA ---------------------------------------------- */
.closing-cta{padding:0;background:linear-gradient(105deg,#071d45,#0a3a79 58%,#2447a7);overflow:hidden}
.closing-cta::before{content:"";position:absolute;inset:0;background:linear-gradient(150deg,transparent 0 53%,rgba(80,139,255,.10) 53% 55%,transparent 55%),radial-gradient(circle at 88% 5%,rgba(117,88,255,.18),transparent 28%)}
.cta-wave{display:none}.cta-mark{right:4%;width:250px;opacity:.05}
.cta-grid{display:grid;grid-template-columns:1.25fr auto;grid-template-areas:"copy actions" "benefits benefits";gap:0 42px;padding-top:56px;align-items:center}
.cta-grid>div:first-of-type{grid-area:copy;padding-bottom:34px}.cta-actions{grid-area:actions;padding-bottom:34px;display:flex;gap:12px}.cta-benefits{grid-area:benefits;margin:0;border-top:1px solid rgba(255,255,255,.18);padding:25px 0 28px;justify-content:flex-end;gap:60px}
.cta-grid h2{font-size:clamp(34px,3vw,48px);line-height:1.12;margin:8px 0 16px;max-width:880px}.cta-grid p{font-size:15px;line-height:1.7;max-width:860px}.cta-actions .btn{min-height:58px;padding:15px 24px;font-size:15px;white-space:nowrap}.cta-benefits b{font-size:13px}.cta-benefits svg{width:24px;height:24px}

/* ----- responsive --------------------------------------------------------- */
@media(max-width:1320px){
  .desktop-nav{gap:0}.nav-link{padding:0 12px;font-size:14px}.nav-link::after{left:12px;right:12px}.brand{width:178px}.hero-layout{grid-template-columns:minmax(0,.9fr) minmax(560px,1.1fr)}.hero h1{font-size:47px}.company-logo{padding:0 12px;font-size:17px}.infosys-logo{font-size:19px}.how-steps{grid-template-columns:1fr 24px 1fr 24px 1fr 24px 1fr}.how-step{grid-template-columns:78px 1fr;gap:10px}
}
@media(max-width:1180px){
  .desktop-nav{display:none}.mobile-toggle{display:block}.mobile-nav.open{display:block}.nav-actions{margin-left:auto}.site-header{height:72px}.brand{width:165px;height:48px}
  .hero-stage{padding:20px}.hero-layout{grid-template-columns:1fr;gap:16px}.hero-copy{max-width:780px;padding-bottom:14px}.hero-product{width:min(940px,100%);margin:0 auto;height:470px}.dashboard-window{top:60px;right:4%;height:345px}
  .company-row{grid-template-columns:repeat(4,1fr);row-gap:4px}.company-logo:nth-child(4)::after{display:none}.company-logo:nth-child(-n+4){border-bottom:1px solid rgba(255,255,255,.10)}
  .comparison-grid{grid-template-columns:1fr}.comparison-card{min-height:0}.compare-body{grid-template-columns:1fr 1fr}
  .how-steps{grid-template-columns:1fr 1fr;gap:26px 22px}.step-chevron{display:none}.how-step{grid-template-columns:90px 1fr}
  .cta-grid{grid-template-columns:1fr;grid-template-areas:"copy" "actions" "benefits"}.cta-actions{padding-bottom:30px}.cta-benefits{justify-content:flex-start}
}
@media(max-width:760px){
  :root{--header-h:68px}.container{width:min(calc(100% - 28px),var(--container))}.site-header{height:68px}.brand{width:145px;height:42px}.nav-shell{gap:10px}.login-link,.btn-small{display:none}
  .hero{padding-top:14px}.hero-stage{border-radius:22px;padding:16px 14px}.hero h1{font-size:45px}.hero-lede{font-size:14px}.hero-actions{display:grid;grid-template-columns:1fr 1fr}.hero-actions .btn{min-width:0}.hero-benefits{gap:14px}.hero-product{height:410px;border-radius:20px}.dashboard-window{top:47px;width:96%;right:2%;height:310px;transform:none}.dashboard-body{grid-template-columns:78px 1fr}.dash-sidebar span{display:none}.dash-sidebar>div{justify-content:center}.dash-chart-row{display:none}.dash-metrics{grid-template-columns:1fr 1fr}.framework-float{top:8px;right:-2px;width:210px}.risk-float{left:2px;bottom:8px;width:205px}.evidence-float{display:none}.hand-note{display:none}
  .trust-wrap{padding-bottom:18px}.company-row{grid-template-columns:repeat(2,1fr)}.company-logo:nth-child(2n)::after{display:none}.company-logo:nth-child(-n+6){border-bottom:1px solid rgba(255,255,255,.10)}.company-logo{min-height:54px;font-size:16px}.cybercube{font-size:11px}
  .manual-chaos{padding:58px 0 42px}.manual-chaos .section-heading h2{font-size:36px}.manual-chaos .section-heading p{font-size:15px}.comparison-card{padding:22px}.compare-body{grid-template-columns:1fr}.old-way-visual,.network-visual{height:225px}.compare-list li{font-size:14px}
  .how{padding:52px 0}.how .section-heading h2{font-size:32px}.how-steps{grid-template-columns:1fr}.how-step{grid-template-columns:80px 1fr}.step-stack{height:126px}
  .cta-grid{padding-top:44px}.cta-grid h2{font-size:34px}.cta-actions{display:grid;grid-template-columns:1fr}.cta-actions .btn{width:100%}.cta-benefits{gap:20px;justify-content:space-between;flex-wrap:wrap}.cta-benefits b{font-size:11px}
}
@media(max-width:480px){
  .hero h1{font-size:39px}.hero-actions{grid-template-columns:1fr}.hero-product{height:385px}.framework-float,.risk-float{width:190px}.company-row{grid-template-columns:1fr 1fr}.company-logo{padding:0 8px;font-size:14px}.manual-chaos .section-heading h2{font-size:31px}.compare-head h3{font-size:20px}.compare-icon{width:48px;height:48px}.how-step{grid-template-columns:72px 1fr}.step-text h3{font-size:16px}.step-text p{font-size:12px}
}

/* final alignment safeguards */
.desktop-nav>.nav-item{height:100%}
.old-way-visual{height:255px}
.network-visual{height:255px}


/* ========================================================================
   V8 FINAL REFINEMENTS
   ======================================================================== */

/* Sleeker navigation */
:root{--header-h:68px}
.site-header{
  height:68px;
  background:rgba(255,255,255,.975);
  border-bottom:1px solid #e4eaf3;
  box-shadow:0 5px 20px rgba(16,40,79,.045);
}
.nav-shell{height:68px;gap:18px}
.brand{width:164px;height:44px}
.desktop-nav{gap:1px}
.nav-link{height:38px;padding:0 11px;font-size:13.5px;border-radius:9px;color:#132951}
.nav-link:hover,.nav-link:focus-visible{background:#f4f7fc;color:#2868e8}
.nav-link::after{bottom:4px;left:11px;right:11px;height:2px}
.nav-actions{gap:9px}
.login-link{
  height:40px;
  padding:0 16px;
  border:1px solid #b9d0ff;
  background:#f5f8ff;
  color:#2754a5;
  border-radius:9px;
  box-shadow:0 5px 14px rgba(50,100,205,.08);
}
.login-link:hover{background:#eaf1ff;border-color:#8fb3ff;color:#1749a7;transform:translateY(-1px)}
.btn-small{min-height:42px;padding:10px 17px;border-radius:10px;font-size:13px}
.mega-menu{top:calc(100% + 9px);border-radius:16px;padding:15px;box-shadow:0 20px 54px rgba(15,38,81,.16)}
.mega-menu a{padding:10px 11px}

/* Hero: remove the large card/frame wrapping all hero components. */
.hero{padding-top:24px}
.hero-stage{
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  overflow:visible;
}
.hero-stage::before{display:none}
.hero-layout{min-height:590px;gap:48px}
.hero-copy{padding:36px 0 42px}
.hero-actions{margin-top:28px}
.hero-actions .btn{min-width:190px}
.hero-product{
  height:500px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.hero-product::before{display:none}
.dashboard-window{right:4%;top:66px;width:86%;height:365px}
.framework-float{right:0;top:26px}
.risk-float{left:0;bottom:8px}
.evidence-float{right:0;bottom:16px}

/* Company logos remain fixed, centered, and separated by consistent white lines. */
.trust-wrap{margin-top:6px;padding:20px 0 24px}
.company-row{width:100%;grid-template-columns:repeat(8,minmax(0,1fr));border-top:0}
.company-logo{min-height:62px;padding:0 16px;justify-content:center;text-align:center}
.company-logo:not(:last-child)::after{height:34px;background:rgba(255,255,255,.42)}

/* Compliance challenge — independent classes prevent collisions with older rules. */
.manual-chaos{padding:72px 0 64px;background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)}
.challenge-heading{max-width:960px!important;margin:0 auto 42px!important}
.challenge-heading h2{font-size:clamp(38px,3.6vw,56px)!important;line-height:1.08!important;max-width:920px!important;margin:10px auto 15px!important;color:#0d1d4b!important}
.challenge-heading p{font-size:16px!important;line-height:1.7!important;max-width:850px!important;color:#687998!important}
.challenge-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:stretch}
.challenge-card{min-width:0;border:1px solid #dce6f2;border-radius:24px;background:#fff;padding:28px;box-shadow:0 18px 48px rgba(30,62,113,.07);overflow:hidden}
.challenge-old{background:linear-gradient(145deg,#fff,#fffafa)}
.challenge-new{background:linear-gradient(145deg,#fff,#f8fffc)}
.challenge-card-head{display:flex;align-items:center;gap:15px;padding-bottom:20px;border-bottom:1px solid #e9eef5}
.challenge-status-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:50%;box-shadow:0 0 0 8px rgba(17,37,72,.035);flex:none}
.challenge-status-icon svg{width:27px;height:27px;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.challenge-status-icon.danger{background:#ff5c66}.challenge-status-icon.success{background:#22c78b}
.challenge-card-head h3{margin:0;font:700 25px/1.1 Poppins,sans-serif;color:#10234f}
.challenge-card-head p{margin:5px 0 0;color:#71809b;font-size:14px}
.challenge-card-body{display:grid;grid-template-columns:minmax(260px,1fr) minmax(300px,.95fr);gap:28px;align-items:center;padding-top:24px;min-height:310px}
.challenge-list{list-style:none;padding:0;margin:0;display:grid;gap:17px}
.challenge-list li{position:relative;padding-left:34px;color:#50627f;font-size:16px;line-height:1.35}
.challenge-list li::before{position:absolute;left:0;top:0;width:23px;height:23px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:12px}
.danger-list-v8 li::before{content:'×';background:#ff5964}.success-list-v8 li::before{content:'✓';background:#20bd83}
.chaos-diagram{position:relative;width:100%;height:260px;border:1px solid #e0e8f2;border-radius:20px;background:linear-gradient(180deg,#f9fbff,#fff);overflow:hidden}
.chaos-source{position:absolute;width:66px;height:66px;border-radius:16px;display:grid;place-items:center;color:#fff;font-weight:800;font-size:14px;box-shadow:0 14px 30px rgba(31,58,104,.13);z-index:3}
.chaos-source svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8}
.source-xls{left:36px;top:27px;background:#19b97a}.source-pdf{right:36px;top:27px;background:#ef5260}.source-doc{left:36px;top:126px;background:#6e7b93}.source-stack{right:36px;top:126px;background:#3b78ee}
.chaos-lines,.network-lines-v8{position:absolute;inset:0;width:100%;height:100%;z-index:1}
.chaos-lines path,.network-lines-v8 path{fill:none;stroke:#91afe0;stroke-width:2;stroke-dasharray:7 7}
.chaos-outcome{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);z-index:4;white-space:nowrap;padding:12px 25px;border-radius:14px;font-weight:800;font-size:15px}
.old-outcome{background:#fff0f1;color:#ff4652}.new-outcome{background:#dff8ed;color:#0ca76d}
.xz-hub-v8{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);width:68px;height:68px;border:2px solid #d7e2f0;border-radius:50%;background:#fff;display:grid;place-items:center;z-index:4;box-shadow:0 12px 28px rgba(31,65,117,.08)}
.xz-hub-v8 img{width:35px;height:35px;object-fit:contain}
.xz-node{position:absolute;z-index:3;display:flex;align-items:center;gap:7px;padding:10px 14px;border:1px solid #dce6f1;border-radius:11px;background:#fff;box-shadow:0 8px 22px rgba(38,70,119,.08);font-size:11px;font-weight:800;color:#27406a;white-space:nowrap}
.xz-node svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.9}
.node-control-v8{left:24px;top:39px;color:#715cf4}.node-evidence-v8{right:22px;top:39px;color:#2a9de8}.node-risk-v8{left:22px;top:143px;color:#ef4e5b}.node-framework-v8{right:20px;top:143px;color:#715cf4}

/* Stable story/testimonial height across all rotating testimonial lengths. */
.story{padding:15px 0}
.story-grid{min-height:330px;align-items:stretch}
.story-copy,.story-proof{display:flex;flex-direction:column;justify-content:center}
.testimonial-shell{height:310px;min-height:310px;max-height:310px;padding:25px 24px 18px}
.testimonial-shell>p{height:130px;min-height:130px;max-height:130px;overflow:hidden;margin:7px 0 16px;display:block}
.testimonial-person{min-height:44px}
.testimonial-controls{margin-top:auto}

@media(max-width:1180px){
  .hero-stage{padding:0}.hero-product{height:470px}.hero-layout{grid-template-columns:1fr;gap:14px}.hero-copy{max-width:780px;padding-bottom:10px}
  .company-row{grid-template-columns:repeat(4,1fr)}
  .company-logo:nth-child(4)::after{display:none}.company-logo:nth-child(-n+4){border-bottom:1px solid rgba(255,255,255,.10)}
  .challenge-grid{grid-template-columns:1fr}.challenge-card-body{grid-template-columns:1fr 360px}.story-grid{min-height:0}.testimonial-shell{height:310px}
}
@media(max-width:760px){
  .site-header{height:64px}.nav-shell{height:64px}.brand{width:140px;height:39px}.login-link,.btn-small{display:none}
  .hero{padding-top:14px}.hero-stage{padding:0}.hero h1{font-size:44px}.hero-actions{display:block}.hero-actions .btn{width:auto}.hero-product{height:410px}
  .company-row{grid-template-columns:repeat(2,1fr)}.company-logo:nth-child(2n)::after{display:none}.company-logo:nth-child(-n+6){border-bottom:1px solid rgba(255,255,255,.10)}
  .challenge-heading h2{font-size:35px!important}.challenge-heading p{font-size:15px!important}.challenge-card{padding:22px}.challenge-card-body{grid-template-columns:1fr}.chaos-diagram{height:245px}.challenge-list li{font-size:14px}
  .story-grid{min-height:0}.testimonial-shell{height:320px;min-height:320px;max-height:320px}.testimonial-shell>p{height:145px;min-height:145px;max-height:145px}
}
@media(max-width:480px){
  .hero h1{font-size:38px}.hero-actions .btn{width:100%}.hero-product{height:385px}
  .challenge-card-head h3{font-size:21px}.challenge-status-icon{width:50px;height:50px}.chaos-source{width:58px;height:58px}.source-xls,.source-doc{left:20px}.source-pdf,.source-stack{right:20px}.chaos-outcome{font-size:13px;padding:10px 16px}.xz-node{font-size:10px;padding:9px 10px}.node-control-v8,.node-risk-v8{left:12px}.node-evidence-v8,.node-framework-v8{right:12px}
  .testimonial-shell{height:340px;min-height:340px;max-height:340px}.testimonial-shell>p{height:165px;min-height:165px;max-height:165px}
}


/* =========================================================
   FINAL LAYOUT REFINEMENTS
   - challenge cards remain fully contained at 100% zoom
   - XZLENZ mark is visible in the central hub
   - story/testimonial section has a stable, balanced height
   ========================================================= */

/* Compliance challenge: robust two-column geometry */
.manual-chaos{padding:68px 0 48px}
.challenge-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px;
  align-items:stretch;
}
.challenge-card{
  min-width:0;
  height:100%;
  padding:28px;
  border-radius:24px;
  overflow:hidden;
}
.challenge-card-head{padding-bottom:22px}
.challenge-card-body{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,350px);
  gap:24px;
  align-items:center;
  min-width:0;
  min-height:320px;
  padding-top:22px;
}
.challenge-card-body>*{min-width:0}
.challenge-list{min-width:0;gap:16px}
.challenge-list li{
  font-size:15px;
  line-height:1.45;
  padding-left:32px;
  overflow-wrap:anywhere;
}
.chaos-diagram{
  width:100%;
  max-width:350px;
  height:255px;
  min-width:0;
  justify-self:end;
  border-radius:20px;
  overflow:hidden;
}
.chaos-source{width:64px;height:64px}
.source-xls{left:30px;top:25px}.source-pdf{right:30px;top:25px}
.source-doc{left:30px;top:122px}.source-stack{right:30px;top:122px}
.chaos-outcome{bottom:18px;max-width:calc(100% - 36px);text-align:center}
.xz-node{font-size:10.5px;padding:10px 12px;max-width:132px}
.node-control-v8{left:18px;top:36px}.node-evidence-v8{right:18px;top:36px}
.node-risk-v8{left:18px;top:140px}.node-framework-v8{right:18px;top:140px}
.xz-hub-v8{
  width:70px;height:70px;top:45%;
  background:#fff;border:2px solid #cfdaeb;
  box-shadow:0 12px 30px rgba(35,66,115,.10);
}
.xz-hub-v8 img{width:42px;height:42px;object-fit:contain;opacity:1;filter:none}

/* Practitioner story: fixed composition regardless of testimonial length */
.story{padding:15px 0}
.story-grid{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr) minmax(310px,.68fr);
  gap:34px;
  align-items:center;
  min-height:360px;
}
.story-copy{justify-content:center;min-width:0}
.story-copy h2{font-size:clamp(31px,2.45vw,43px);line-height:1.17;margin:10px 0 14px;max-width:620px}
.story-copy p{font-size:15px;line-height:1.75;max-width:640px}
.testimonial-shell{
  height:300px;
  min-height:300px;
  max-height:300px;
  padding:30px 30px 28px;
  display:grid;
  grid-template-rows:44px minmax(0,1fr) 54px;
  align-content:stretch;
  border-radius:20px;
}
.testimonial-shell .quote-mark{height:auto;align-self:start}
.testimonial-shell>p{
  height:auto;
  min-height:0;
  max-height:none;
  overflow:hidden;
  margin:4px 0 16px;
  display:flex;
  align-items:flex-start;
  font-size:14px;
  line-height:1.72;
}
.testimonial-person{min-height:54px;align-self:end;padding-top:12px;border-top:1px solid rgba(171,204,245,.13)}
.testimonial-person .avatar{width:46px;height:46px;font-size:12px}
.testimonial-person b{font-size:12px}.testimonial-person small{font-size:10px}
.testimonial-controls,.testimonial-arrow,.testimonial-dots{display:none!important}
.story-proof{
  align-self:stretch;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  padding-left:30px;
}
.story-proof ul{gap:12px;margin-top:22px}
.story-proof li{font-size:11px;line-height:1.55}
.proof-brand b{font-size:17px}.proof-brand small{font-size:10px}

@media(max-width:1260px){
  .challenge-card-body{grid-template-columns:minmax(0,1fr) minmax(270px,320px);gap:18px}
  .chaos-diagram{max-width:320px}
  .story-grid{grid-template-columns:1fr 1fr;min-height:0}
  .story-proof{grid-column:1/-1;border-left:0;border-top:1px solid rgba(187,215,248,.22);padding:24px 0 0;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:28px}
  .story-proof ul{grid-template-columns:repeat(2,minmax(0,1fr));margin:0}
}

@media(max-width:1040px){
  .challenge-grid{grid-template-columns:1fr}
  .challenge-card-body{grid-template-columns:minmax(0,1fr) 350px}
  .chaos-diagram{max-width:350px}
}

@media(max-width:760px){
  .challenge-card{padding:22px}
  .challenge-card-body{grid-template-columns:1fr;min-height:0}
  .chaos-diagram{justify-self:center;max-width:360px;width:100%}
  .story-grid{grid-template-columns:1fr;gap:24px}
  .testimonial-shell{height:310px;min-height:310px;max-height:310px}
  .story-proof{grid-column:auto;display:flex;border-top:1px solid rgba(187,215,248,.22);padding:24px 0 0}
  .story-proof ul{display:grid;grid-template-columns:1fr;margin-top:18px}
}

@media(max-width:480px){
  .chaos-diagram{height:238px}
  .source-xls,.source-doc{left:18px}.source-pdf,.source-stack{right:18px}
  .xz-node{font-size:9.5px;padding:9px 9px;max-width:112px}
  .node-control-v8,.node-risk-v8{left:9px}.node-evidence-v8,.node-framework-v8{right:9px}
  .xz-hub-v8{width:62px;height:62px}.xz-hub-v8 img{width:36px;height:36px}
  .testimonial-shell{height:330px;min-height:330px;max-height:330px;padding:25px 22px}
}

/* ========================================================================
   FINAL V2 REFINEMENTS — 100% ZOOM, NAV, CTA BENEFITS, CUSTOM SELECT, FOOTER
   ======================================================================== */

/* Sleek final navigation */
:root{--header-h:66px}
.site-header{height:66px;background:rgba(255,255,255,.985);border-bottom:1px solid #e5ebf4;box-shadow:0 4px 18px rgba(17,43,86,.045)}
.nav-shell{height:66px;gap:16px}
.brand{width:154px;height:40px}
.desktop-nav{gap:1px}
.nav-link{height:38px;padding:0 11px;border-radius:9px;font-size:13.5px;color:#142950}
.nav-link::after{bottom:3px;height:2px;left:11px;right:11px}
.direct-link{padding-inline:13px}
.nav-actions{gap:9px;margin-left:8px}
.login-link{height:40px;padding:0 17px;border:1px solid #9ebfff;background:linear-gradient(180deg,#f8fbff,#edf4ff);color:#2455ac;border-radius:10px;box-shadow:0 6px 18px rgba(52,102,200,.11)}
.login-link:hover{background:#e6efff;border-color:#78a3ff;color:#1749a7;box-shadow:0 9px 22px rgba(52,102,200,.16)}
.btn-small{min-height:42px;padding:10px 17px;border-radius:10px;font-size:13px}
.dropdown-panel{top:calc(100% + 10px);padding:14px;border:1px solid #dce6f3;border-radius:18px;background:rgba(255,255,255,.995);box-shadow:0 28px 70px rgba(14,39,82,.17)}
.dropdown-panel::after{content:"";position:absolute;top:-7px;left:50%;width:14px;height:14px;background:#fff;border-left:1px solid #dce6f3;border-top:1px solid #dce6f3;transform:translateX(-50%) rotate(45deg);z-index:-1}
.dropdown-wide{width:610px}.dropdown-standard{width:350px}
.dropdown-head{padding:5px 8px 12px;margin-bottom:7px}.dropdown-head span{font-size:11.5px;letter-spacing:.09em}.dropdown-head small{font-size:10px}
.dropdown-grid{gap:6px}
.dropdown-panel>a,.dropdown-grid>a{position:relative;padding:11px 12px;border-radius:12px;border:1px solid transparent;transition:.18s ease}
.dropdown-panel>a:hover,.dropdown-grid>a:hover{background:#f5f8ff;border-color:#e7edfb;transform:translateY(-1px)}
.dropdown-panel>a::before,.dropdown-grid>a::before{content:"";position:absolute;left:0;top:11px;bottom:11px;width:3px;border-radius:3px;background:linear-gradient(var(--blue),var(--purple));opacity:0;transition:.18s}
.dropdown-panel>a:hover::before,.dropdown-grid>a:hover::before{opacity:1}
.dropdown-highlight{margin-top:4px;background:#f4f7ff;color:#2d63d9}

/* Compliance challenge — more breathing room at standard 100% browser zoom */
.manual-chaos>.container{width:min(calc(100% - 48px),1660px)}
.challenge-grid{gap:28px}
.challenge-card{padding:26px;min-width:0}
.challenge-card-body{grid-template-columns:minmax(300px,.92fr) minmax(330px,1.08fr);gap:20px;min-height:300px;padding-top:22px}
.challenge-list{gap:15px;padding-right:4px}
.challenge-list li{font-size:14px;line-height:1.4;padding-left:31px;overflow-wrap:normal;word-break:normal}
.chaos-diagram{max-width:none;width:100%;height:252px;justify-self:stretch}
.chaos-source{width:62px;height:62px}
.source-xls{left:28px;top:24px}.source-pdf{right:28px;top:24px}.source-doc{left:28px;top:118px}.source-stack{right:28px;top:118px}
.xz-node{font-size:10px;padding:9px 11px;max-width:none}
.node-control-v8{left:16px;top:34px}.node-evidence-v8{right:16px;top:34px}.node-risk-v8{left:16px;top:137px}.node-framework-v8{right:16px;top:137px}
.xz-hub-v8{width:68px;height:68px}.xz-hub-v8 img{width:40px;height:40px}
.chaos-outcome{bottom:16px;padding:11px 22px;font-size:14px}

/* Primary Focus: custom dropdown replacing the native browser menu */
.focus-field{position:relative}
.custom-select{position:relative;margin-top:6px}
.custom-select input[type="hidden"]{display:none}
.custom-select-trigger{width:100%;height:46px;padding:0 14px;border:1px solid #d9e3f0;border-radius:11px;background:linear-gradient(180deg,#fff,#fbfdff);color:#1d3156;display:flex;align-items:center;justify-content:space-between;gap:14px;font-weight:600;box-shadow:0 5px 14px rgba(30,63,113,.04);transition:.18s}
.custom-select-trigger:hover{border-color:#b8c9e8;background:#fff}
.custom-select.open .custom-select-trigger,.custom-select-trigger:focus-visible{outline:0;border-color:#6f8cff;box-shadow:0 0 0 3px rgba(85,112,244,.12)}
.custom-select-trigger svg{width:16px;height:16px;fill:none;stroke:#294164;stroke-width:2;transition:transform .18s}
.custom-select.open .custom-select-trigger svg{transform:rotate(180deg)}
.custom-select-value.placeholder{color:#8b98ad}
.custom-select-menu{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 7px);padding:7px;background:#fff;border:1px solid #d9e3f0;border-radius:13px;box-shadow:0 22px 55px rgba(20,49,95,.18);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-5px);transition:.16s ease}
.custom-select.open .custom-select-menu{opacity:1;visibility:visible;pointer-events:auto;transform:none}
.custom-select-menu button{width:100%;border:0;background:transparent;color:#263b61;text-align:left;padding:10px 12px;border-radius:9px;font-size:13px;transition:.15s}
.custom-select-menu button:hover,.custom-select-menu button[aria-selected="true"]{background:#eff4ff;color:#265fd7}

/* CTA: one benefit left, one centered, one right */
.cta-benefits{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:0!important;width:100%;justify-content:stretch!important}
.cta-benefits span{display:flex;align-items:center;gap:9px;min-width:0}
.cta-benefits .benefit-left{justify-self:start}
.cta-benefits .benefit-center{justify-self:center}
.cta-benefits .benefit-right{justify-self:end}

/* New XZLENZ footer */
.site-footer{background:linear-gradient(180deg,#03172f 0%,#021226 100%);color:#dbe8f8;padding:54px 0 22px;border-top:1px solid rgba(140,178,230,.13)}
.footer-main{display:grid;grid-template-columns:minmax(330px,.95fr) minmax(0,2.05fr);gap:70px;align-items:start}
.footer-contact{min-width:0}.footer-logo{display:block;width:168px;height:44px}.footer-logo img{width:100%;height:100%;object-fit:contain;object-position:left center}
.footer-contact h3{font:700 22px/1.25 Poppins,sans-serif;color:#fff;margin:19px 0 10px;letter-spacing:-.02em}
.footer-contact>p{margin:0;max-width:430px;color:#9fb4d0;font-size:12px;line-height:1.7}
.footer-contact-details{margin-top:26px;padding-top:22px;border-top:1px solid rgba(151,183,225,.15)}
.footer-contact-details h4{font-size:12px;color:#fff;margin:0 0 14px}.footer-contact-details p{margin:10px 0;color:#9fb4d0;font-size:11px}.footer-contact-details a{color:#dcecff}.footer-contact-details a:hover{color:#78d5ff}
.footer-region-row{display:flex;align-items:center;gap:13px;color:#9fb4d0;font-size:11px}
.region-selector{display:inline-flex;padding:3px;border:1px solid rgba(141,180,232,.20);background:rgba(255,255,255,.035);border-radius:10px;gap:2px}
.region-selector button{border:0;background:transparent;color:#9eb4d2;font-size:10px;font-weight:800;padding:7px 10px;border-radius:7px;letter-spacing:.04em}
.region-selector button:hover{color:#fff;background:rgba(255,255,255,.07)}
.region-selector button.active{color:#fff;background:linear-gradient(135deg,#476dff,#149fe7);box-shadow:0 6px 16px rgba(31,107,236,.22)}
.footer-nav-grid{display:grid;grid-template-columns:1.25fr 1.3fr .9fr .7fr;gap:34px}
.footer-col h4{margin:2px 0 15px;color:#fff;font:700 12px/1.2 Poppins,sans-serif;letter-spacing:.02em}
.footer-col a{display:block;margin:9px 0;color:#91a8c7;font-size:10.5px;line-height:1.35;transition:.18s}.footer-col a:hover{color:#fff;transform:translateX(3px)}
.footer-quick a{font-weight:600;color:#b5c7df}
.footer-lower{margin-top:42px;padding-top:19px;border-top:1px solid rgba(151,183,225,.15);display:flex;align-items:center;justify-content:space-between;gap:24px}
.footer-trust{display:flex;align-items:center;gap:22px}.footer-trust b{font-size:11px;color:#e8f1fc}.footer-trust a{font-size:10px;color:#7bcfff;border:1px solid rgba(93,173,237,.25);padding:7px 10px;border-radius:8px}
.footer-legal{display:flex;align-items:center;gap:15px;color:#7086a5;font-size:9.5px}.footer-legal a{color:#8fa6c5}.footer-legal a:hover{color:#fff}

@media(max-width:1450px){
  .manual-chaos>.container{width:min(calc(100% - 40px),1480px)}
  .challenge-card-body{grid-template-columns:minmax(270px,.9fr) minmax(300px,1.1fr);gap:18px}
  .challenge-list li{font-size:13.5px}
  .chaos-diagram{height:245px}
}
@media(max-width:1240px){
  .challenge-grid{grid-template-columns:1fr}
  .challenge-card-body{grid-template-columns:minmax(0,1fr) 390px}.chaos-diagram{max-width:390px;justify-self:end}
  .footer-main{grid-template-columns:1fr;gap:38px}.footer-nav-grid{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:860px){
  .cta-benefits{grid-template-columns:1fr!important;gap:16px!important}.cta-benefits .benefit-left,.cta-benefits .benefit-center,.cta-benefits .benefit-right{justify-self:start}
  .footer-nav-grid{grid-template-columns:repeat(2,1fr);gap:28px}.footer-lower{align-items:flex-start;flex-direction:column}.footer-legal{flex-wrap:wrap}
}
@media(max-width:760px){
  .challenge-card-body{grid-template-columns:1fr}.chaos-diagram{justify-self:center;max-width:390px}
}
@media(max-width:520px){
  .footer-nav-grid{grid-template-columns:1fr 1fr}.footer-region-row{align-items:flex-start;flex-direction:column;gap:8px}.footer-trust{align-items:flex-start;flex-direction:column;gap:10px}
}

/* ========================================================================
   FINAL V3 — centered navigation + white challenge/solution banner
   ======================================================================== */

/* Keep the brand and sales actions anchored to the edges while the primary
   navigation is geometrically centered in the header. */
@media (min-width:1181px){
  .nav-shell{
    display:grid !important;
    grid-template-columns:minmax(185px,1fr) auto minmax(260px,1fr) !important;
    align-items:center !important;
    gap:18px !important;
    height:66px !important;
  }
  .brand{
    justify-self:start !important;
    width:158px !important;
    height:44px !important;
  }
  .desktop-nav{
    justify-self:center !important;
    margin:0 !important;
    display:flex !important;
    align-items:center !important;
    gap:2px !important;
    height:100% !important;
  }
  .nav-actions{
    justify-self:end !important;
    margin:0 !important;
    gap:10px !important;
  }
  .nav-link{
    padding:0 13px !important;
    font-size:13.5px !important;
    height:66px !important;
    display:inline-flex !important;
    align-items:center !important;
  }
}

/* White interpretation of the supplied challenge -> solution artwork. */
.manual-chaos{
  position:relative !important;
  overflow:hidden !important;
  padding:0 !important;
  background:#fff !important;
}
.manual-chaos>.container{display:none !important}
.challenge-banner-shell{
  position:relative;
  min-height:610px;
  padding:62px max(28px,calc((100vw - 1740px)/2)) 64px;
  background:
    linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.96) 38%,rgba(255,255,255,.88) 66%,rgba(255,255,255,.20) 100%),
    url('../assets/challenge-white-banner.webp') center/cover no-repeat;
  border-top:1px solid #e5edf6;
  border-bottom:1px solid #e3ebf5;
}
.challenge-banner-shell::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(241,247,255,.38),transparent 28%,transparent 76%,rgba(242,247,253,.42));
}
.challenge-layout{
  position:relative;
  z-index:2;
  width:100%;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(330px,1.12fr) minmax(300px,.88fr) 48px minmax(300px,.88fr) minmax(135px,.38fr);
  align-items:start;
  gap:20px;
}
.challenge-intro{
  align-self:center;
  max-width:470px;
  padding:18px 20px 18px 0;
}
.challenge-eyebrow{
  display:block;
  margin-bottom:19px;
  color:#3977ee;
  font:800 11px/1.3 Inter,sans-serif;
  letter-spacing:.17em;
  text-transform:uppercase;
}
.challenge-intro h2{
  margin:0;
  color:#102451;
  font:700 clamp(38px,3.15vw,58px)/1.06 Poppins,sans-serif;
  letter-spacing:-.045em;
  max-width:460px;
}
.challenge-intro p{
  margin:24px 0 0;
  max-width:435px;
  color:#647696;
  font-size:14px;
  line-height:1.75;
}
.challenge-column{
  min-width:0;
  display:grid;
  grid-template-rows:auto repeat(4,1fr);
  gap:12px;
  padding:14px;
  border:1px solid #dce6f2;
  border-radius:22px;
  background:rgba(255,255,255,.79);
  box-shadow:0 22px 58px rgba(41,74,126,.09);
  backdrop-filter:blur(8px);
}
.challenge-column-label{
  justify-self:start;
  border-radius:8px;
  padding:7px 13px;
  font:800 11px/1 Inter,sans-serif;
  letter-spacing:.07em;
  text-transform:uppercase;
  box-shadow:0 5px 16px rgba(40,72,120,.08);
}
.problem-label{background:#ff6672;color:#fff}
.solution-label{background:#5bd0f2;color:#08355a}
.challenge-row{
  min-height:92px;
  display:grid;
  grid-template-columns:54px minmax(0,1fr);
  gap:13px;
  align-items:center;
  padding:13px 14px;
  border:1px solid #e3eaf4;
  border-radius:15px;
  background:rgba(255,255,255,.92);
  box-shadow:0 9px 22px rgba(33,66,116,.055);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.challenge-row:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(33,66,116,.10);border-color:#cfdded}
.challenge-row-icon{
  width:46px;
  height:46px;
  border-radius:12px;
  display:grid;
  place-items:center;
}
.problem-row .challenge-row-icon{background:#fff0f2;color:#f05b69;border:1px solid #ffdce1}
.solution-row .challenge-row-icon{background:#eafaff;color:#1699c7;border:1px solid #d6f4ff}
.challenge-row-icon svg{
  width:23px;
  height:23px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.challenge-row h3{
  margin:0 0 4px;
  color:#172a50;
  font:700 13px/1.3 Poppins,sans-serif;
}
.challenge-row p{
  margin:0;
  color:#6f7e97;
  font-size:10.5px;
  line-height:1.42;
}
.challenge-arrows{
  padding-top:51px;
  display:grid;
  grid-template-rows:repeat(4,92px);
  row-gap:12px;
  place-items:center;
}
.challenge-arrows span{
  width:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  color:#40aee2;
}
.challenge-arrows span::before{
  content:"";
  position:absolute;
  width:34px;
  right:23px;
  border-top:1.5px dashed #80badd;
}
.challenge-arrows svg{
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  background:#fff;
}
.challenge-mountain-note{
  align-self:center;
  justify-self:center;
  max-width:125px;
  margin:24px 0 0;
  color:#245287;
  font:600 italic 18px/1.35 Georgia,serif;
  transform:rotate(-3deg);
  text-align:center;
  text-shadow:0 1px 0 #fff;
}
.challenge-mountain-note span{display:block}

@media (max-width:1450px){
  .challenge-banner-shell{padding-inline:36px;background-position:60% center}
  .challenge-layout{grid-template-columns:minmax(300px,1fr) minmax(280px,.9fr) 38px minmax(280px,.9fr) 90px;gap:14px}
  .challenge-row{grid-template-columns:48px minmax(0,1fr);gap:10px;padding:12px;min-height:88px}
  .challenge-row-icon{width:42px;height:42px}
  .challenge-arrows{grid-template-rows:repeat(4,88px);row-gap:12px}
  .challenge-intro h2{font-size:42px}
  .challenge-mountain-note{font-size:15px}
}

@media (max-width:1180px){
  .challenge-banner-shell{padding:54px 28px;background-position:72% center}
  .challenge-layout{grid-template-columns:1fr 38px 1fr;gap:16px;max-width:1040px;margin:auto}
  .challenge-intro{grid-column:1/-1;max-width:760px;text-align:center;justify-self:center;padding:0 0 18px}
  .challenge-intro h2{max-width:760px}
  .challenge-intro p{max-width:650px;margin-inline:auto}
  .challenge-column:nth-of-type(2){grid-column:1}
  .challenge-arrows{grid-column:2}
  .solution-column{grid-column:3}
  .challenge-mountain-note{display:none}
}

@media (max-width:760px){
  .challenge-banner-shell{padding:46px 18px;background-position:78% center}
  .challenge-layout{display:block}
  .challenge-intro{text-align:left;padding-bottom:28px}
  .challenge-intro h2{font-size:34px}
  .challenge-intro p{font-size:13px;margin-top:18px}
  .challenge-column{padding:12px;margin-bottom:18px}
  .challenge-row{min-height:auto}
  .challenge-arrows{display:flex;padding:0 0 18px;justify-content:center}
  .challenge-arrows span{display:none}
  .challenge-arrows span:first-child{display:flex;transform:rotate(90deg)}
}


/* ========================================================================
   FINAL V4 — alignment, compact footer, mobile hero, polished challenge
   ======================================================================== */

/* Closing CTA: keep all three benefits grouped on the right. */
@media (min-width:861px){
  .closing-cta .cta-grid{
    grid-template-columns:minmax(0,1.25fr) minmax(560px,.75fr)!important;
    grid-template-areas:"copy actions" "copy benefits"!important;
    column-gap:46px!important;
    row-gap:18px!important;
    padding-top:54px!important;
    padding-bottom:38px!important;
    align-items:center!important;
  }
  .closing-cta .cta-grid>div:first-of-type{
    grid-area:copy!important;
    align-self:center!important;
    padding-bottom:0!important;
  }
  .closing-cta .cta-actions{
    grid-area:actions!important;
    justify-content:flex-end!important;
    padding-bottom:0!important;
  }
  .closing-cta .cta-benefits{
    grid-area:benefits!important;
    grid-column:auto!important;
    display:flex!important;
    width:100%!important;
    justify-self:end!important;
    justify-content:flex-end!important;
    align-items:center!important;
    gap:38px!important;
    margin:0!important;
    padding:18px 0 0!important;
    border-top:1px solid rgba(255,255,255,.16)!important;
  }
  .closing-cta .cta-benefits span{justify-self:auto!important;white-space:nowrap}
}

/* Compact footer: content fills the width rather than leaving a tall empty area. */
.site-footer{padding:42px 0 20px!important}
.footer-top{
  display:grid;
  grid-template-columns:minmax(300px,.85fr) minmax(0,2.15fr);
  gap:62px;
  align-items:start;
}
.footer-brand-block{min-width:0;padding-right:8px}
.footer-brand-block .footer-logo{width:168px;height:44px}
.footer-brand-block h3{font:700 22px/1.25 Poppins,sans-serif;color:#fff;margin:18px 0 10px;letter-spacing:-.02em}
.footer-brand-block p{margin:0;max-width:440px;color:#9fb4d0;font-size:12px;line-height:1.7}
.footer-nav-grid{grid-template-columns:1.15fr 1.2fr .9fr .72fr!important;gap:30px!important}
.footer-contact-bar{
  margin-top:30px;
  padding:18px 0;
  border-top:1px solid rgba(151,183,225,.15);
  border-bottom:1px solid rgba(151,183,225,.15);
  display:grid;
  grid-template-columns:1.15fr auto 1fr 1fr;
  align-items:center;
  gap:28px;
}
.footer-contact-title span,.footer-contact-item span,.footer-region-row>span{display:block;color:#fff;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}
.footer-contact-title small{display:block;color:#748baa;font-size:9px;line-height:1.4}
.footer-contact-item a{color:#dcecff;font-size:11px}.footer-contact-item a:hover{color:#78d5ff}
.footer-region-row{display:block!important;color:#9fb4d0!important;font-size:11px!important}
.footer-lower{margin-top:18px!important;padding-top:0!important;border-top:0!important}

/* Hero handwritten positioning statement — retain on desktop and mobile. */
.hand-note{
  top:auto!important;
  right:41.5%!important;
  bottom:0!important;
  color:#73cbff!important;
  font:italic 12px/1.25 Georgia,serif!important;
  transform:rotate(-5deg)!important;
  z-index:8!important;
  text-align:right;
}

/* Challenge section: tighter visual hierarchy and precisely aligned arrows. */
.challenge-banner-shell{
  min-height:620px!important;
  padding-top:56px!important;
  padding-bottom:56px!important;
}
.challenge-layout{
  grid-template-columns:minmax(350px,1.1fr) minmax(315px,.92fr) 64px minmax(315px,.92fr) minmax(125px,.35fr)!important;
  gap:18px!important;
  align-items:center!important;
}
.challenge-intro{padding-right:30px!important}
.challenge-column{
  align-self:stretch!important;
  grid-template-rows:38px repeat(4,96px)!important;
  gap:12px!important;
  padding:15px!important;
  background:rgba(255,255,255,.86)!important;
  border-color:#d8e4f2!important;
  box-shadow:0 24px 60px rgba(35,71,124,.10)!important;
}
.challenge-column-label{height:38px;display:inline-flex;align-items:center;justify-content:center;margin:0!important}
.challenge-row{
  min-height:96px!important;
  height:96px!important;
  padding:13px 14px!important;
  background:rgba(255,255,255,.96)!important;
}
.challenge-row h3{font-size:13.5px!important}
.challenge-row p{font-size:10.7px!important;line-height:1.45!important}
.challenge-arrows{
  align-self:stretch!important;
  padding-top:50px!important;
  display:grid!important;
  grid-template-rows:repeat(4,96px)!important;
  row-gap:12px!important;
  width:100%!important;
}
.challenge-arrows span{
  position:relative!important;
  width:100%!important;
  height:96px!important;
  display:grid!important;
  place-items:center!important;
  color:#36aee7!important;
}
.challenge-arrows span::before{
  content:""!important;
  position:absolute!important;
  left:-20px!important;
  right:-20px!important;
  width:auto!important;
  top:50%!important;
  border-top:1.5px dashed #78b9e0!important;
  z-index:0!important;
}
.challenge-arrows svg{
  position:relative!important;
  z-index:1!important;
  width:29px!important;
  height:29px!important;
  padding:5px!important;
  border:1px solid #cfe4f2!important;
  border-radius:50%!important;
  background:#fff!important;
  box-shadow:0 5px 14px rgba(42,99,151,.08)!important;
}
.challenge-mountain-note{margin-top:0!important}


@media (max-width:860px){
  .closing-cta .cta-grid{display:grid!important;grid-template-columns:1fr!important;grid-template-areas:"copy" "actions" "benefits"!important;gap:24px!important;padding-top:44px!important;padding-bottom:30px!important}
  .closing-cta .cta-grid>div:first-of-type{grid-area:copy!important;padding-bottom:0!important}
  .closing-cta .cta-actions{grid-area:actions!important;padding-bottom:0!important}
  .closing-cta .cta-benefits{grid-area:benefits!important;display:flex!important;justify-content:flex-start!important;gap:24px!important;width:100%!important;padding-top:18px!important;border-top:1px solid rgba(255,255,255,.16)!important;flex-wrap:wrap!important}

  .footer-top{grid-template-columns:1fr;gap:32px}
  .footer-nav-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:28px 34px!important}
  .footer-contact-bar{grid-template-columns:1fr 1fr;gap:18px 28px}
  .footer-contact-title{grid-column:1/-1}
}
@media (max-width:1180px){
.nav-actions{margin-left:auto!important;min-width:44px!important;width:auto!important;flex:0 0 auto!important}
}
@media (max-width:760px){
  .site-header,.nav-shell{height:64px!important}
  .container{width:min(calc(100% - 24px),var(--container))!important}
  .brand{width:138px!important;height:38px!important;flex:0 0 auto!important}
  .nav-actions{margin-left:auto!important;min-width:44px!important;width:auto!important;flex:0 0 auto!important}
  .mobile-toggle{width:44px!important;height:44px!important;margin-left:auto!important;padding:10px!important}

  .hero{padding-top:24px!important}
  .hero-layout{display:block!important}
  .hero-copy{padding:4px 0 22px!important;max-width:none!important}
  .hero h1{font-size:clamp(40px,12vw,52px)!important;line-height:1.01!important;margin:16px 0 16px!important}
  .hero-lede{font-size:13.5px!important;line-height:1.65!important;max-width:none!important}
  .hero-actions{margin-top:22px!important}
  .hero-benefits{margin-top:18px!important;gap:10px 16px!important}
  .hero-product{
    width:100%!important;
    height:500px!important;
    margin:8px auto 0!important;
    overflow:hidden!important;
    border-radius:18px!important;
  }
  .dashboard-window{
    left:0!important;
    right:auto!important;
    top:72px!important;
    width:100%!important;
    height:360px!important;
    transform:none!important;
    border-radius:17px!important;
  }
  .dashboard-body{grid-template-columns:68px 1fr!important}
  .dash-main{padding:10px!important}
  .dash-metrics{grid-template-columns:1fr 1fr!important;gap:7px!important}
  .framework-float{top:18px!important;right:5px!important;left:auto!important;width:205px!important;transform:none!important}
  .risk-float{left:4px!important;right:auto!important;bottom:16px!important;width:195px!important;transform:none!important}
  .evidence-float{display:none!important}
  .hand-note{display:block!important;right:8px!important;bottom:10px!important;font-size:10px!important;opacity:.9!important}
  .trust-wrap{margin-top:0!important;padding-top:16px!important}

  .challenge-banner-shell{padding:42px 18px 46px!important;background-position:78% center!important}
  .challenge-layout{display:block!important}
  .challenge-intro{padding:0 0 28px!important;text-align:left!important;max-width:none!important}
  .challenge-intro h2{font-size:34px!important;max-width:560px!important}
  .challenge-intro p{font-size:13px!important;max-width:580px!important}
  .challenge-column{display:grid!important;grid-template-rows:auto repeat(4,auto)!important;gap:10px!important;margin-bottom:14px!important}
  .challenge-row{height:auto!important;min-height:86px!important}
  .challenge-arrows{display:flex!important;height:46px!important;padding:0!important;align-items:center!important;justify-content:center!important;margin:0 0 14px!important}
  .challenge-arrows span{display:none!important}
  .challenge-arrows span:first-child{display:grid!important;width:44px!important;height:44px!important;transform:rotate(90deg)!important}
  .challenge-arrows span:first-child::before{display:none!important}
  .challenge-mountain-note{display:none!important}

  .footer-contact-bar{grid-template-columns:1fr!important}
  .footer-lower{align-items:flex-start!important}
}

@media (max-width:520px){
  .container{width:min(calc(100% - 24px),var(--container))!important}
  .brand{width:132px!important;height:36px!important}
  .hero-product{height:480px!important}
  .dashboard-window{top:70px!important;height:345px!important}
  .framework-float{width:190px!important;padding:9px 10px!important}
  .risk-float{width:184px!important;padding:9px 10px!important}
  .hero-benefits{font-size:9.5px!important}
  .company-row{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .company-logo{border-right:0!important;border-bottom:1px solid rgba(255,255,255,.12)!important;min-height:54px!important}
  .footer-nav-grid{grid-template-columns:1fr 1fr!important;gap:24px!important}
  .footer-lower{gap:14px!important}
  .footer-legal{gap:10px!important}
}

/* ========================================================================
   FINAL V5 — MOBILE NAV LINK FIX + CHALLENGE WIDTH ALIGNMENT
   ======================================================================== */

/* Keep the challenge content on the same visual grid as the rest of the site
   on large screens. The background may remain full-bleed, but the actual
   challenge content is capped to the global container width. */
@media (min-width:1181px){
  .challenge-banner-shell{
    padding-left:max(24px,calc((100vw - var(--container))/2))!important;
    padding-right:max(24px,calc((100vw - var(--container))/2))!important;
  }

  .challenge-layout{
    width:100%!important;
    max-width:var(--container)!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

/* Mobile navigation: direct links (Plans / Resources / Company) were not
   receiving the same row styling because they are children of
   .mobile-nav-inner, not direct children of .mobile-nav. */
@media (max-width:1180px){
  .mobile-nav{
    max-height:calc(100vh - 64px);
    overflow-y:auto;
    overscroll-behavior:contain;
  }

  .mobile-nav-inner{
    padding:8px 0 16px!important;
    gap:0!important;
  }

  .mobile-nav details,
  .mobile-nav-inner > a{
    border-bottom:1px solid #edf2f7;
  }

  .mobile-nav summary,
  .mobile-nav-inner > a{
    min-height:48px;
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:12px 8px!important;
    color:#17305b;
    font-size:13px;
    line-height:1.2;
    font-weight:700;
    border-radius:8px;
    transition:background .18s ease,color .18s ease;
  }

  .mobile-nav summary:hover,
  .mobile-nav summary:focus-visible,
  .mobile-nav-inner > a:hover,
  .mobile-nav-inner > a:focus-visible{
    background:#f4f7fc;
    color:#2868e8;
    outline:0;
  }

  .mobile-nav summary::after{
    content:"+";
    flex:0 0 auto;
    margin-left:12px;
    color:#5b6f91;
    font-size:18px;
    font-weight:500;
    line-height:1;
    transition:transform .18s ease,color .18s ease;
  }

  .mobile-nav details[open] > summary::after{
    content:"−";
    color:#2868e8;
  }

  .mobile-nav details > a{
    display:block;
    min-height:40px;
    padding:10px 18px 10px 22px!important;
    color:#60708d;
    font-size:12.5px;
    line-height:1.35;
    border-radius:7px;
  }

  .mobile-nav details > a:hover,
  .mobile-nav details > a:focus-visible{
    background:#f6f8fc;
    color:#2868e8;
    outline:0;
  }

  .mobile-nav-cta{
    margin-top:10px!important;
    padding:14px 8px 0!important;
    border-top:0!important;
    display:grid!important;
    grid-template-columns:auto 1fr;
    gap:10px!important;
    align-items:center!important;
  }

  .mobile-nav-cta > a{
    min-height:44px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 10px;
    border-radius:9px;
    color:#264b86;
    font-size:13px;
    font-weight:700;
  }

  .mobile-nav-cta .btn{
    min-height:44px;
    width:100%;
    padding:10px 14px;
    font-size:13px;
  }
}

@media (max-width:520px){
  .mobile-nav summary,
  .mobile-nav-inner > a{
    padding-left:6px!important;
    padding-right:6px!important;
  }

  .mobile-nav-cta{
    grid-template-columns:1fr auto;
    padding-left:6px!important;
    padding-right:6px!important;
  }
}

/* ==============================================================
   PLATFORM OVERVIEW — MOBILE HERO FIX
   ============================================================== */

@media (max-width: 980px) {

    .pov-hero {
        min-height: auto;
        padding: 0;
    }

    .pov-hero-grid {
        width: min(calc(100% - 36px), 760px);

        display: grid;
        grid-template-columns: 1fr;

        gap: 34px;

        padding-top: 52px;
        padding-bottom: 54px;
    }

    /* --------------------------------
       HERO COPY
       -------------------------------- */

    .pov-hero-copy {
        width: 100%;
        max-width: 680px;

        margin: 0 auto;

        text-align: left;
    }

    .pov-hero-copy h1 {
        max-width: 680px;

        margin: 12px 0 18px;

        font-size: clamp(42px, 8vw, 58px);
        line-height: 1.03;
        letter-spacing: -0.045em;

        text-wrap: balance;
    }

    .pov-hero-copy p {
        max-width: 640px;
    }

    .pov-hero-actions {
        justify-content: flex-start;
    }


    /* ==========================================================
       IMPORTANT FIX
       Dashboard now stays AFTER the text instead of overlapping it
       ========================================================== */

    .pov-product-stage {
        position: relative;

        width: 100%;
        max-width: 760px;

        min-height: 0;

        margin: 0 auto;

        overflow: visible;
    }

    .pov-dashboard {
        position: relative;

        top: auto;
        right: auto;
        bottom: auto;
        left: auto;

        width: 100%;

        margin: 0;
    }

    .pov-product-stage::before,
    .pov-product-stage::after {
        display: none;
    }

    .pov-connected-card {
        top: -24px;
        right: 14px;

        z-index: 6;
    }

    .pov-unified-chip {
        right: 12px;
        bottom: -22px;
    }
}


/* ==============================================================
   MOBILE
   ============================================================== */

@media (max-width: 760px) {

    .pov-hero-grid {
        width: min(calc(100% - 28px), 640px);

        gap: 30px;

        padding-top: 40px;
        padding-bottom: 46px;
    }

    .pov-hero-copy h1 {
        font-size: clamp(36px, 10.5vw, 48px);
        line-height: 1.02;
    }

    .pov-hero-copy p {
        font-size: 15px;
        line-height: 1.6;
    }


    /* --------------------------------
       PRODUCT DASHBOARD
       -------------------------------- */

    .pov-dashboard {
        border-radius: 16px;
        overflow: hidden;
    }

    .pov-dashboard-topbar {
        height: 48px;

        grid-template-columns:
            92px
            minmax(0, 1fr);

        gap: 8px;

        padding: 0 10px;
    }

    .pov-dashboard-wordmark {
        font-size: 12px;
        letter-spacing: 0.13em;
    }

    .pov-dashboard-search {
        min-width: 0;

        height: 30px;

        padding: 0 9px;

        font-size: 8px;

        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .pov-dashboard-dots {
        display: none;
    }


    /* --------------------------------
       DASHBOARD CONTENT
       -------------------------------- */

    .pov-dashboard-body {
        grid-template-columns:
            78px
            minmax(0, 1fr);

        min-height: 292px;
    }

    .pov-dashboard-sidebar {
        min-width: 0;

        padding: 11px 7px;

        gap: 4px;

        font-size: 7px;
    }

    .pov-dashboard-sidebar b,
    .pov-dashboard-sidebar span {
        padding: 6px 5px;

        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .pov-dashboard-main {
        min-width: 0;

        padding: 11px;
    }

    .pov-dash-title-row {
        margin-bottom: 10px;
    }

    .pov-dash-title-row strong {
        font-size: 12px;
    }

    .pov-dash-title-row > span {
        display: none;
    }


    /* --------------------------------
       METRICS
       -------------------------------- */

    .pov-metric-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 6px;
    }

    .pov-metric-grid > div {
        min-width: 0;

        padding: 8px;
    }

    .pov-metric-grid b {
        font-size: 12px;
    }


    /* --------------------------------
       CHART
       -------------------------------- */

    .pov-chart-grid {
        grid-template-columns: 1fr;

        margin-top: 7px;
    }

    .pov-chart-card {
        min-height: 126px;

        padding: 9px;
    }

    .pov-status-card {
        display: none;
    }

    .pov-bars {
        height: 72px;

        gap: 4px;

        padding-top: 10px;
    }


    /* Floating cards are unnecessary
       on small screens */

    .pov-connected-card,
    .pov-unified-chip {
        display: none;
    }
}


/* ==============================================================
   SMALL PHONES
   ============================================================== */

@media (max-width: 520px) {

    .pov-hero-grid {
        width: min(calc(100% - 24px), 460px);

        gap: 26px;

        padding-top: 34px;
        padding-bottom: 40px;
    }

    .pov-hero-copy h1 {
        font-size: clamp(34px, 11.2vw, 43px);

        line-height: 1.02;

        letter-spacing: -0.04em;
    }

    .pov-hero-actions {
        margin-top: 24px;
    }

    .pov-hero-actions .btn {
        width: 100%;

        min-width: 0;
    }


    /* --------------------------------
       MOBILE DASHBOARD
       -------------------------------- */

    .pov-dashboard {
        border-radius: 14px;
    }

    .pov-dashboard-body {
        grid-template-columns:
            64px
            minmax(0, 1fr);

        min-height: 270px;
    }

    .pov-dashboard-sidebar {
        padding: 9px 5px;

        font-size: 6px;
    }

    .pov-dashboard-sidebar b,
    .pov-dashboard-sidebar span {
        padding: 5px 4px;
    }

    .pov-dashboard-main {
        padding: 9px;
    }


    /* Keep only 3 useful metrics
       on very narrow phones */

    .pov-metric-grid > div:nth-child(4) {
        display: none;
    }

    .pov-metric-grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

    .pov-metric-grid b {
        font-size: 10px;
    }

    .pov-metric-grid span,
    .pov-metric-grid small {
        font-size: 5.5px;
    }
}

/* =========================================================
   PRODUCTION COMPILE — navigation, login, demo form, footer
   ========================================================= */
.brand img{filter:none!important}
.login-menu{position:relative}
.login-link{height:42px!important;padding:0 18px!important;border:1px solid rgba(112,101,255,.55)!important;border-radius:12px!important;background:linear-gradient(135deg,#6f62f4,#7454e8)!important;color:#fff!important;box-shadow:0 8px 22px rgba(85,72,220,.20)!important}
.login-link:hover,.login-menu.open>.login-link{border-color:#8d82ff!important;background:linear-gradient(135deg,#7568ff,#6848dc)!important;color:#fff!important}
.login-dropdown{width:300px!important;padding:10px!important;right:0!important;left:auto!important;background:#10192e!important;border-color:#59647a!important;box-shadow:0 24px 64px rgba(4,12,30,.35)!important}
.login-dropdown a{display:block!important;padding:15px 17px!important;border-radius:11px!important;color:#eef4ff!important}
.login-dropdown a:hover{background:#172542!important}.login-dropdown a+a{margin-top:4px}
.login-dropdown b{font-size:14px!important;color:#f5f8ff!important}
.company-menu{width:320px!important}
.mobile-login{border-top:1px solid #edf1f7;margin-top:4px;padding-top:4px}

.demo-dialog{width:min(1020px,100%);grid-template-columns:.82fr 1.18fr;gap:32px;max-height:min(92vh,820px)}
.demo-dialog form{gap:12px 14px;align-content:start}
.demo-dialog input,.demo-dialog textarea{min-height:46px}
.demo-dialog textarea{min-height:92px;resize:vertical}
.demo-dialog .custom-select-menu{max-height:230px;overflow:auto}
.demo-dialog .field-error{display:block;min-height:14px;margin-top:4px;color:#d23e49;font-size:9px;font-weight:600}
.demo-dialog input.error,.demo-dialog textarea.error,.demo-dialog .custom-select-trigger.error{border-color:#e25a66!important;box-shadow:0 0 0 3px rgba(226,90,102,.08)!important}
.demo-response-note{grid-column:1/-1;margin:0;color:#75849b;font-size:10px;line-height:1.45}
.form-footer{grid-column:1/-1}
.form-footer button:disabled{opacity:.65;cursor:not-allowed;transform:none}

.footer-contact-bar{grid-template-columns:.75fr auto 1fr .8fr 1.35fr!important;gap:22px!important}
.footer-contact-item{min-width:0}
.footer-contact-item>a{display:block;margin-top:4px;overflow-wrap:anywhere}
.footer-address address{margin:0;color:#dcecff;font-size:10.5px;line-height:1.55;font-style:normal}

.testimonial-shell{height:360px!important;min-height:360px!important;max-height:360px!important}
.testimonial-shell>p{height:210px!important;min-height:210px!important;max-height:210px!important;overflow:auto!important;padding-right:5px;scrollbar-width:thin}
.story-grid{min-height:380px!important}

@media(max-width:1240px){.footer-contact-bar{grid-template-columns:1fr 1fr!important}.footer-contact-title{grid-column:1/-1}.demo-dialog{grid-template-columns:1fr;max-width:760px}.demo-copy{display:none}}
@media(max-width:760px){.login-menu{display:none}.footer-contact-bar{grid-template-columns:1fr!important}.footer-contact-title{grid-column:auto}.testimonial-shell{height:410px!important;min-height:410px!important;max-height:410px!important}.testimonial-shell>p{height:250px!important;min-height:250px!important;max-height:250px!important}.demo-dialog{padding:22px 18px}.demo-dialog form{grid-template-columns:1fr}.demo-dialog label.full,.demo-response-note,.form-footer{grid-column:auto}}
/* =========================================================
   HOMEPAGE FINAL POLISH
   - testimonial without internal scrollbar
   - real CyberCube logo in practitioner proof
   - refined Book a Demo modal spacing + visual
   ========================================================= */

/* ---------------------------------------------------------
   PRACTITIONER / TESTIMONIAL SECTION
--------------------------------------------------------- */

.story-grid {
  align-items: center;
}

/* Allow every testimonial to fit naturally.
   No internal scrollbar is used. */
.testimonial-shell {
  height: auto !important;
  min-height: 342px !important;
  max-height: none !important;
  grid-template-rows: 42px auto 58px !important;
  align-content: stretch;
  overflow: hidden;
}

.testimonial-shell > p {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  padding-right: 0 !important;
  margin: 6px 0 18px !important;
  scrollbar-width: none !important;
  font-size: clamp(13px, 0.80vw, 15px) !important;
  line-height: 1.68 !important;
}

.testimonial-shell > p::-webkit-scrollbar {
  display: none !important;
}

.testimonial-person {
  align-self: end;
}

/* CyberCube proof branding — use the supplied real logo,
   not the generated cube + typed brand name. */
.proof-brand {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  align-items: center;
  justify-content: flex-start;
  padding: 10px 14px;
  border: 1px solid rgba(196, 221, 248, 0.34);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 12px 32px rgba(1, 17, 42, 0.18);
}

.proof-brand .proof-logo {
  display: block;
  width: min(205px, 100%);
  height: auto;
  max-height: 54px;
  object-fit: contain;
  object-position: left center;
  filter: none !important;
}

.proof-cube {
  display: none !important;
}

.story-proof ul {
  margin-top: 22px;
}


/* ---------------------------------------------------------
   BOOK A DEMO MODAL
--------------------------------------------------------- */

/* Give the close button and the first form row more breathing room. */
.demo-dialog {
  padding: 46px 42px 38px !important;
}

.modal-close {
  top: 19px !important;
  right: 20px !important;
}

.demo-dialog form {
  padding-top: 18px;
}

/* Keep the left copy visually balanced instead of leaving
   a large empty area below the bullet list. */
.demo-copy {
  position: relative;
  min-height: 100%;
  padding: 4px 18px 166px 0;
  overflow: hidden;
}

/* Decorative connected-compliance visual */
.demo-copy::after {
  content: "";
  position: absolute;
  left: 0;
  right: 18px;
  bottom: 2px;
  height: 128px;
  border: 1px solid rgba(99, 137, 255, 0.22);
  border-radius: 22px;
  background:
    radial-gradient(circle at 18% 42%, rgba(36, 215, 242, 0.98) 0 5px, rgba(36, 215, 242, 0.16) 6px 14px, transparent 15px),
    radial-gradient(circle at 50% 28%, rgba(115, 88, 255, 0.98) 0 5px, rgba(115, 88, 255, 0.15) 6px 14px, transparent 15px),
    radial-gradient(circle at 81% 43%, rgba(43, 124, 255, 0.98) 0 5px, rgba(43, 124, 255, 0.16) 6px 14px, transparent 15px),
    linear-gradient(12deg, transparent 0 22%, rgba(78, 154, 255, 0.22) 22.3% 22.8%, transparent 23.1% 100%),
    linear-gradient(166deg, transparent 0 24%, rgba(92, 120, 255, 0.20) 24.3% 24.8%, transparent 25.1% 100%),
    linear-gradient(135deg, rgba(242, 247, 255, 0.98), rgba(235, 242, 255, 0.94));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 18px 42px rgba(54, 83, 167, 0.10);
  pointer-events: none;
}

.demo-copy::before {
  content: "ONE PLATFORM  •  255+ FRAMEWORKS  •  CONTINUOUS READINESS";
  position: absolute;
  left: 22px;
  right: 40px;
  bottom: 23px;
  z-index: 2;
  color: #49638f;
  font-size: 9px;
  line-height: 1.45;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-align: center;
  pointer-events: none;
}

/* Slightly more room above the actual inputs after the close button. */
.demo-dialog form > label:nth-child(-n + 2) {
  margin-top: 2px;
}


/* ---------------------------------------------------------
   RESPONSIVE
--------------------------------------------------------- */

@media (max-width: 1260px) {
  .testimonial-shell {
    min-height: 330px !important;
  }

  .proof-brand .proof-logo {
    width: min(190px, 100%);
  }
}

@media (max-width: 760px) {
  .testimonial-shell {
    height: auto !important;
    min-height: 330px !important;
    max-height: none !important;
  }

  .testimonial-shell > p {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .demo-dialog {
    padding: 54px 18px 24px !important;
  }

  .modal-close {
    top: 14px !important;
    right: 14px !important;
  }

  .demo-dialog form {
    padding-top: 0;
  }
}
/* =========================================================
   BOOK A DEMO — REFINED LEFT PANEL
   Replaces the previous decorative line graphic with a
   product-relevant compliance readiness preview.
   ========================================================= */

.demo-copy {
  position: relative;
  min-height: 100%;
  padding: 4px 18px 0 0 !important;
  overflow: visible !important;
}

/* Remove the previous decorative pseudo-element artwork. */
.demo-copy::before,
.demo-copy::after {
  content: none !important;
  display: none !important;
}

.demo-program-preview {
  margin-top: 15px;
  padding: 20px 20px 18px;
  border: 1px solid #d9e4f4;
  border-radius: 20px;
  background:
    linear-gradient(145deg, rgba(248, 251, 255, 0.98), rgba(238, 245, 255, 0.98));
  box-shadow:
    0 18px 42px rgba(38, 72, 132, 0.10),
    inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

.demo-program-preview-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.demo-program-preview-head > div {
  min-width: 0;
}

.demo-program-preview-head span {
  display: block;
  margin-bottom: 5px;
  color: #4774ca;
  font-size: 9px;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.demo-program-preview-head strong {
  display: block;
  color: #12254f;
  font-size: 15px;
  line-height: 1.25;
  font-weight: 750;
}

.demo-program-preview-head > b {
  flex: 0 0 auto;
  color: #285ff5;
  font: 800 28px/1 Poppins, Inter, sans-serif;
  letter-spacing: -0.04em;
}

.demo-program-bar {
  height: 7px;
  margin-top: 17px;
  overflow: hidden;
  border-radius: 999px;
  background: #dbe5f3;
}

.demo-program-bar i {
  display: block;
  width: 87%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #22c9ea 0%, #2f7af7 56%, #7358ff 100%);
  box-shadow: 0 0 18px rgba(47, 122, 247, 0.22);
}

.demo-program-frameworks {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 16px;
}

.demo-program-frameworks span {
  padding: 7px 10px;
  border: 1px solid #d9e4f3;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.82);
  color: #405b88;
  font-size: 9px;
  line-height: 1;
  font-weight: 750;
}

.demo-program-status {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 14px;
}

.demo-program-status span {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  padding: 9px 10px;
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.72);
  color: #516783;
  font-size: 8.5px;
  line-height: 1.25;
  font-weight: 700;
}

.demo-program-status i {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #20c9aa;
  box-shadow: 0 0 0 4px rgba(32, 201, 170, 0.10);
}

/* More breathing room around the close button and the top form row. */
.demo-dialog {
  padding: 12px 42px 20px !important;
}

.modal-close {
  top: 22px !important;
  right: 22px !important;
}

.demo-dialog form {
  padding-top: 24px !important;
}

@media (max-width: 1240px) {
  .demo-program-preview {
    display: none;
  }
}

@media (max-width: 760px) {
  .demo-dialog {
    padding: 58px 18px 24px !important;
  }

  .modal-close {
    top: 15px !important;
    right: 15px !important;
  }

  .demo-dialog form {
    padding-top: 0 !important;
  }
}

/* ========================================================================
   BOOK A DEMO — RESPONSIVE MOBILE/TABLET FIX
   Keeps XZLENZ intro visible, reduces form height, and prevents the modal
   from becoming a form-only screen on smaller devices.
   ======================================================================== */

@media (max-width: 1240px) {
  .modal {
    padding: 16px !important;
  }

  .demo-dialog {
    width: min(780px, calc(100vw - 32px)) !important;
    max-height: calc(100dvh - 32px) !important;
    overflow-y: auto !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    padding: 30px 28px 24px !important;
    border-radius: 22px !important;
  }

  /* The old production rule hid this entire block below 1240px.
     Force it back on and keep it compact. */
  .demo-copy {
    display: block !important;
    min-height: 0 !important;
    padding: 0 58px 2px 0 !important;
    overflow: visible !important;
  }

  .demo-copy .modal-logo {
    width: 112px !important;
    height: 30px !important;
    margin: 0 0 10px !important;
  }

  .demo-copy .section-kicker {
    display: block !important;
    margin-bottom: 5px !important;
    font-size: 10px !important;
    letter-spacing: .15em !important;
  }

  .demo-dialog .demo-copy h2 {
    max-width: 620px !important;
    margin: 0 0 8px !important;
    font-size: 27px !important;
    line-height: 1.12 !important;
    letter-spacing: -.035em !important;
  }

  .demo-copy > p {
    max-width: 670px !important;
    margin: 0 !important;
    color: #6f7d95 !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
  }

  /* The bullets and readiness preview are useful on desktop,
     but they make the mobile modal unnecessarily tall. */
  .demo-copy > ul,
  .demo-program-preview {
    display: none !important;
  }

  .demo-dialog form {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px 12px !important;
    padding-top: 16px !important;
    border-top: 1px solid #e7edf5 !important;
  }

  .demo-dialog label {
    min-width: 0 !important;
    font-size: 10.5px !important;
  }

  .demo-dialog input,
  .demo-dialog textarea {
    min-height: 42px !important;
    margin-top: 5px !important;
    padding: 9px 11px !important;
    border-radius: 9px !important;
    font-size: 12px !important;
  }

  .demo-dialog textarea {
    min-height: 78px !important;
    max-height: 110px !important;
  }

  .demo-dialog .custom-select {
    margin-top: 5px !important;
  }

  .demo-dialog .custom-select-trigger {
    height: 42px !important;
    padding: 0 11px !important;
    border-radius: 9px !important;
    font-size: 12px !important;
  }

  .demo-dialog .field-error {
    min-height: 10px !important;
    margin-top: 2px !important;
    font-size: 8px !important;
  }

  .demo-response-note {
    margin-top: -2px !important;
    font-size: 9.5px !important;
  }

  .modal-close {
    top: 18px !important;
    right: 18px !important;
    width: 36px !important;
    height: 36px !important;
    z-index: 5 !important;
  }
}

@media (max-width: 640px) {
  .modal {
    display: none;
    padding: 8px !important;
    align-items: flex-start !important;
    overflow-y: auto !important;
  }

  .modal.open {
    display: grid !important;
  }

  .demo-dialog {
    width: 100% !important;
    max-height: calc(100dvh - 16px) !important;
    margin: 0 !important;
    gap: 13px !important;
    padding: 20px 14px 16px !important;
    border-radius: 18px !important;
  }

  .demo-copy {
    display: block !important;
    padding: 0 46px 0 0 !important;
  }

  .demo-copy .modal-logo {
    width: 98px !important;
    height: 26px !important;
    margin-bottom: 8px !important;
  }

  .demo-copy .section-kicker {
    margin-bottom: 4px !important;
    font-size: 8.5px !important;
  }

  .demo-dialog .demo-copy h2 {
    max-width: 100% !important;
    margin: 0 0 6px !important;
    font-size: 21px !important;
    line-height: 1.12 !important;
  }

  .demo-copy > p {
    max-width: 100% !important;
    font-size: 10.5px !important;
    line-height: 1.45 !important;
  }

  .demo-dialog form {
    grid-template-columns: 1fr !important;
    gap: 7px !important;
    padding-top: 12px !important;
  }

  .demo-dialog label,
  .demo-dialog label.full,
  .demo-response-note,
  .form-footer {
    grid-column: 1 !important;
  }

  .demo-dialog label {
    font-size: 9.5px !important;
  }

  .demo-dialog input,
  .demo-dialog textarea {
    min-height: 39px !important;
    margin-top: 4px !important;
    padding: 8px 10px !important;
    font-size: 11px !important;
  }

  .demo-dialog textarea {
    min-height: 66px !important;
    max-height: 86px !important;
  }

  .demo-dialog .custom-select {
    margin-top: 4px !important;
  }

  .demo-dialog .custom-select-trigger {
    height: 39px !important;
    padding: 0 10px !important;
    font-size: 11px !important;
  }

  .demo-dialog .custom-select-menu {
    max-height: 190px !important;
  }

  .demo-response-note {
    margin: 0 !important;
    font-size: 8.5px !important;
  }

  .form-footer {
    display: block !important;
  }

  .form-footer .btn,
  .form-footer button {
    width: 100% !important;
    min-height: 42px !important;
    padding: 10px 13px !important;
    font-size: 12px !important;
  }

  .modal-close {
    top: 12px !important;
    right: 12px !important;
    width: 32px !important;
    height: 32px !important;
    font-size: 20px !important;
  }
}

@media (max-width: 380px) {
  .demo-dialog {
    padding: 17px 12px 14px !important;
  }

  .demo-copy {
    padding-right: 40px !important;
  }

  .demo-dialog .demo-copy h2 {
    font-size: 19px !important;
  }

  .demo-copy > p {
    font-size: 10px !important;
  }

  .demo-dialog form {
    gap: 6px !important;
  }

  .demo-dialog input,
  .demo-dialog textarea,
  .demo-dialog .custom-select-trigger {
    font-size: 10.5px !important;
  }
}

/* ========================================================================
   XZLENZ NAVBAR — RESTORED FROM THE EARLIER SITE LAYOUT
   This block intentionally sits LAST and wins over old/experimental rules.
   ======================================================================== */

@media (min-width: 1181px) {
  :root { --header-h: 66px !important; }

  .site-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 2000 !important;
    width: 100% !important;
    height: 66px !important;
    min-height: 66px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: rgba(255,255,255,.985) !important;
    border: 0 !important;
    border-bottom: 1px solid #e5ebf4 !important;
    box-shadow: 0 4px 18px rgba(17,43,86,.045) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
  }

  .site-header .nav-shell {
    width: min(calc(100% - 48px), 1520px) !important;
    max-width: 1520px !important;
    height: 66px !important;
    min-height: 66px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(185px,1fr) auto minmax(280px,1fr) !important;
    align-items: center !important;
    gap: 18px !important;
  }

  .site-header .brand {
    justify-self: start !important;
    display: flex !important;
    align-items: center !important;
    width: 158px !important;
    min-width: 158px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  .site-header .brand img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: left center !important;
    filter: none !important;
  }

  .site-header .desktop-nav {
    justify-self: center !important;
    align-self: stretch !important;
    display: flex !important;
    align-items: center !important;
    gap: 2px !important;
    height: 66px !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
  }

  .site-header .desktop-nav > .nav-item {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    height: 66px !important;
  }

  .site-header .desktop-nav .nav-link {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    height: 66px !important;
    min-height: 66px !important;
    margin: 0 !important;
    padding: 0 13px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #12244f !important;
    font: 700 13.5px/1 Inter, Arial, sans-serif !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    box-shadow: none !important;
  }

  .site-header .desktop-nav .nav-link > svg {
    display: block !important;
    width: 13px !important;
    height: 13px !important;
    margin-left: 2px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2 !important;
    transition: transform .18s ease !important;
  }

  .site-header .desktop-nav .nav-link::after {
    content: "" !important;
    position: absolute !important;
    left: 13px !important;
    right: 13px !important;
    bottom: 0 !important;
    height: 3px !important;
    border-radius: 3px 3px 0 0 !important;
    background: linear-gradient(90deg, #3778ff, #7b5cff) !important;
    transform: scaleX(0) !important;
    transform-origin: center !important;
    transition: transform .18s ease !important;
  }

  .site-header .desktop-nav .nav-link:hover,
  .site-header .desktop-nav .nav-link:focus-visible,
  .site-header .desktop-nav .has-menu.open > .nav-link {
    color: #2d62db !important;
    background: transparent !important;
    outline: 0 !important;
  }

  .site-header .desktop-nav .nav-link:hover::after,
  .site-header .desktop-nav .nav-link:focus-visible::after,
  .site-header .desktop-nav .has-menu.open > .nav-link::after {
    transform: scaleX(1) !important;
  }

  .site-header .has-menu:hover > .nav-link > svg,
  .site-header .has-menu.open > .nav-link > svg {
    transform: rotate(180deg) !important;
  }

  .site-header .direct-link,
  .site-header .company-direct-link {
    font-weight: 700 !important;
  }

  .site-header .nav-actions {
    justify-self: end !important;
    display: flex !important;
    align-items: center !important;
    height: 66px !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 10px !important;
  }

  .site-header .nav-actions > .nav-item {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
  }

  .site-header .login-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 92px !important;
    height: 42px !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 0 20px !important;
    border: 1px solid #9ebfff !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #2455a7 !important;
    font: 700 13.5px/1 Inter, Arial, sans-serif !important;
    box-shadow: 0 5px 14px rgba(50,100,205,.06) !important;
  }

  .site-header .login-link:hover,
  .site-header .login-link:focus-visible,
  .site-header .login-menu.open > .login-link {
    background: #f4f8ff !important;
    border-color: #78a3ff !important;
    color: #1749a7 !important;
    transform: none !important;
  }

  .site-header .login-link::after,
  .site-header .login-link .login-chevron,
  .site-header .login-link > svg {
    display: none !important;
  }

  .site-header .nav-actions .btn-small {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    min-width: 152px !important;
    min-height: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 0 17px !important;
    border: 0 !important;
    border-radius: 10px !important;
    color: #fff !important;
    background: linear-gradient(135deg,#6b5cff,#236df8 62%,#11b8ef) !important;
    font: 700 13px/1 Inter, Arial, sans-serif !important;
    box-shadow: 0 10px 28px rgba(63,92,244,.20) !important;
  }

  .site-header .nav-actions .btn-small svg {
    width: 16px !important;
    height: 16px !important;
  }

  /* Dropdown geometry from the working earlier navbar. */
  .site-header .dropdown-panel {
    top: calc(100% + 10px) !important;
    z-index: 2100 !important;
    padding: 14px !important;
    border: 1px solid #dce6f3 !important;
    border-radius: 18px !important;
    background: rgba(255,255,255,.995) !important;
    box-shadow: 0 28px 70px rgba(14,39,82,.17) !important;
  }

  .site-header .dropdown-wide { width: 610px !important; }
  .site-header .dropdown-standard { width: 350px !important; }

  /* Focus must not keep a menu hanging open after the mouse leaves. */
  .site-header .has-menu:not(:hover):not(.open) > .dropdown-panel {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  .site-header .has-menu:hover > .dropdown-panel,
  .site-header .has-menu.open > .dropdown-panel {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  .site-header .login-dropdown {
    width: 300px !important;
    right: 0 !important;
    left: auto !important;
    padding: 10px !important;
    background: #10192e !important;
    border-color: #59647a !important;
    box-shadow: 0 24px 64px rgba(4,12,30,.35) !important;
  }

  .site-header .login-dropdown::after {
    background: #10192e !important;
    border-left-color: #59647a !important;
    border-top-color: #59647a !important;
  }

  .site-header .login-dropdown a {
    display: block !important;
    padding: 15px 17px !important;
    border-radius: 11px !important;
    color: #eef4ff !important;
  }

  .site-header .login-dropdown a:hover { background: #172542 !important; }
  .site-header .login-dropdown a + a { margin-top: 4px !important;}
  .site-header .login-dropdown b { font-size: 14px !important; color: #f5f8ff !important; }

  .site-header .mobile-toggle,
  .site-header .mobile-nav {
    display: none !important;
  }
}

/* Keep the earlier mobile navigation untouched and compact. */
@media (max-width: 1180px) {
  .site-header {
    height: 64px !important;
    min-height: 64px !important;
  }

  .site-header .nav-shell {
    height: 64px !important;
    min-height: 64px !important;
  }

  .site-header .brand {
    width: 140px !important;
    height: 39px !important;
  }

  .site-header .brand img { filter: none !important; }

  .site-header .desktop-nav { display: none !important; }
  .site-header .login-menu,
  .site-header .nav-actions > .btn-small { display: none !important; }
  .site-header .mobile-toggle { display: block !important; }
}


/* ==========================================================================
   TRUSTED ORGANIZATIONS — REAL CLIENT LOGOS
   Final override for the homepage trust strip.
   ========================================================================== */

.trust-wrap.trusted-organizations{
  position:relative;
  z-index:4;
  width:min(calc(100% - 48px),var(--container));
  margin:8px auto 0;
  padding:20px 0 28px;
  border-top:1px solid rgba(174,205,244,.20);
}

.trusted-organizations-title{
  margin:0 0 16px !important;
  color:#c7d8ef !important;
  font-size:10px !important;
  line-height:1.3;
  font-weight:800 !important;
  letter-spacing:.18em !important;
  text-transform:uppercase;
}

.trusted-orgs-grid{
  width:100%;
  display:grid;
  grid-template-columns:repeat(8,minmax(0,1fr));
  align-items:stretch;
  overflow:hidden;
  border:1px solid rgba(160,196,239,.18);
  border-radius:18px;
  background:
    linear-gradient(180deg,rgba(8,42,83,.52),rgba(5,31,66,.58));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 14px 34px rgba(0,13,37,.10);
}

.trusted-org{
  position:relative;
  min-width:0;
  min-height:88px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:13px 11px;
}

.trusted-org:not(:last-child)::after{
  content:"";
  position:absolute;
  top:22px;
  right:0;
  bottom:22px;
  width:1px;
  background:linear-gradient(
    180deg,
    transparent,
    rgba(205,225,249,.34),
    transparent
  );
}

.trusted-org-logo{
  width:100%;
  height:58px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  padding:7px 9px;
  border:1px solid rgba(224,235,249,.82);
  border-radius:12px;
  background:linear-gradient(145deg,#ffffff 0%,#f7faff 100%);
  box-shadow:
    0 8px 22px rgba(0,18,49,.12),
    inset 0 1px 0 rgba(255,255,255,.96);
  transition:
    transform .22s ease,
    box-shadow .22s ease,
    border-color .22s ease;
}

.trusted-org:hover .trusted-org-logo{
  transform:translateY(-2px);
  border-color:rgba(94,156,245,.58);
  box-shadow:
    0 13px 28px rgba(0,18,49,.18),
    inset 0 1px 0 rgba(255,255,255,1);
}

.trusted-org-logo img{
  display:block;
  width:auto;
  max-width:92%;
  height:auto;
  max-height:41px;
  object-fit:contain;
  object-position:center;
}

/* Per-logo normalization for the supplied source artwork. */
.trusted-org-trantor .trusted-org-logo img{
  max-width:52px;
  max-height:46px;
}

.trusted-org-nlb .trusted-org-logo{
  padding:0 7px;
}

.trusted-org-nlb .trusted-org-logo img{
  width:110%;
  max-width:none;
  max-height:none;
  transform:scale(1.04);
}

.trusted-org-himalayan .trusted-org-logo{
  padding:5px 6px;
}

.trusted-org-himalayan .trusted-org-logo img{
  width:100%;
  max-width:100%;
  max-height:46px;
}

.trusted-org-paytring .trusted-org-logo img{
  max-width:92%;
  max-height:40px;
}

.trusted-org-clearlyrated .trusted-org-logo img{
  max-width:94%;
  max-height:38px;
}

.trusted-org-fonepay .trusted-org-logo img{
  max-width:94%;
  max-height:37px;
}

.trusted-org-evonix .trusted-org-logo img{
  max-width:94%;
  max-height:36px;
}

.trusted-org-act .trusted-org-logo img{
  max-width:88%;
  max-height:43px;
}

@media(max-width:1180px){
  .trust-wrap.trusted-organizations{
    width:min(calc(100% - 36px),var(--container));
    padding-bottom:24px;
  }

  .trusted-orgs-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }

  .trusted-org{
    min-height:84px;
  }

  .trusted-org:nth-child(4n)::after{
    display:none;
  }

  .trusted-org:nth-child(-n+4)::before{
    content:"";
    position:absolute;
    left:12px;
    right:12px;
    bottom:0;
    height:1px;
    background:linear-gradient(
      90deg,
      transparent,
      rgba(205,225,249,.20),
      transparent
    );
  }
}

@media(max-width:760px){
  .trust-wrap.trusted-organizations{
    width:min(calc(100% - 24px),var(--container)) !important;
    margin-top:0 !important;
    padding:16px 0 22px !important;
  }

  .trusted-organizations-title{
    margin-bottom:13px !important;
    font-size:9px !important;
    letter-spacing:.145em !important;
  }

  .trusted-orgs-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    border-radius:15px;
  }

  .trusted-org{
    min-height:76px;
    padding:9px 8px;
    border-bottom:0 !important;
  }

  .trusted-org::after{
    display:block !important;
  }

  .trusted-org:nth-child(2n)::after{
    display:none !important;
  }

  .trusted-org:nth-child(-n+6)::before{
    content:"";
    position:absolute;
    left:9px;
    right:9px;
    bottom:0;
    height:1px;
    background:linear-gradient(
      90deg,
      transparent,
      rgba(205,225,249,.18),
      transparent
    );
  }

  .trusted-org:nth-child(n+7)::before{
    display:none;
  }

  .trusted-org-logo{
    height:52px;
    padding:6px 8px;
    border-radius:10px;
  }

  .trusted-org-logo img{
    max-height:35px;
  }

  .trusted-org-trantor .trusted-org-logo img{
    max-width:43px;
    max-height:39px;
  }

  .trusted-org-nlb .trusted-org-logo img{
    width:110%;
  }

  .trusted-org-himalayan .trusted-org-logo img{
    max-height:37px;
  }

  .trusted-org-act .trusted-org-logo img{
    max-height:37px;
  }
}

@media(max-width:420px){
  .trusted-org{
    min-height:72px;
    padding:8px 6px;
  }

  .trusted-org-logo{
    height:48px;
    padding:5px 6px;
  }

  .trusted-org-logo img{
    max-width:90%;
    max-height:31px;
  }

  .trusted-org-trantor .trusted-org-logo img{
    max-width:40px;
    max-height:36px;
  }

  .trusted-org-nlb .trusted-org-logo img{
    width:110%;
    max-width:none;
  }
}

/* ========================================================================
   XZLENZ FOOTER — POLISHED CONTACT / REGIONAL LAYOUT
   - right-side divider starts at Email column, not under XZLENZ
   - Email / India / UAE / United States align with nav columns above
   - addresses appear before phone numbers
   - LinkedIn gets a proper icon button
   ======================================================================== */

.footer-contact-bar.footer-contact-polished{
  width:min(calc(100% - 48px),var(--container)) !important;
  margin:5px auto 0 !important;
  padding:0 0 28px !important;

  display:grid !important;
  grid-template-columns:minmax(300px,.85fr) minmax(0,2.15fr) !important;
  gap:62px !important;
  align-items:start !important;

  border-top:0 !important;
  border-bottom:1px solid rgba(151,183,225,.15) !important;
}

/* ------------------------------------------------------------------------
   LEFT SIDE
   No divider is drawn above this area, so the XZLENZ logo and LinkedIn
   button remain visually connected as one clean left-hand column.
   ------------------------------------------------------------------------ */
.footer-social-column{
  min-width:0;
  padding-top:40px;
  padding-right:8px;
}

.footer-linkedin-btn{
  position:relative;
  width:fit-content;
  min-width:154px;
  min-height:54px;
  padding:8px 13px 8px 9px;

  display:inline-flex;
  align-items:center;
  gap:10px;

  border:1px solid rgba(105,169,232,.28);
  border-radius:14px;
  background:
    linear-gradient(135deg,rgba(16,55,96,.72),rgba(8,37,72,.76));
  color:#dcecff !important;
  text-decoration:none !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 10px 26px rgba(0,10,28,.10);

  transition:
    transform .2s ease,
    border-color .2s ease,
    background .2s ease,
    box-shadow .2s ease;
}

.footer-linkedin-btn:hover{
  transform:translateY(-2px);
  border-color:rgba(90,174,255,.52);
  background:
    linear-gradient(135deg,rgba(17,71,124,.90),rgba(8,47,91,.90));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 14px 30px rgba(0,12,32,.18);
}

.footer-linkedin-icon{
  flex:0 0 auto;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#0a66c2;
  box-shadow:0 6px 16px rgba(10,102,194,.22);
}

.footer-linkedin-icon svg{
  width:20px;
  height:20px;
  fill:#fff;
}

.footer-linkedin-copy{
  min-width:0;
  display:grid;
  gap:2px;
  text-align:left;
}

.footer-linkedin-copy small{
  color:#7895b8;
  font-size:8px;
  line-height:1;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.footer-linkedin-copy strong{
  color:#f3f8ff;
  font-size:11px;
  line-height:1.2;
  font-weight:750;
}

.footer-linkedin-arrow{
  width:15px;
  height:15px;
  margin-left:3px;
  fill:none;
  stroke:#73cfff;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:transform .2s ease;
}

.footer-linkedin-btn:hover .footer-linkedin-arrow{
  transform:translate(2px,-2px);
}

/* ------------------------------------------------------------------------
   RIGHT SIDE
   The divider deliberately begins here, so it does not run between
   the XZLENZ brand block and LinkedIn.
   ------------------------------------------------------------------------ */
.footer-contact-grid{
  min-width:0;
  padding-top:25px;
  border-top:1px solid rgba(151,183,225,.15);

  display:grid !important;
  grid-template-columns:1.15fr 1.2fr .9fr .72fr !important;
  gap:30px !important;
  align-items:start !important;
}

.footer-contact-polished .footer-contact-item{
  min-width:0;
  padding:0 !important;
  background:none !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

.footer-contact-polished .footer-contact-item > span{
  display:block;
  margin:0 0 10px;
  color:#ffffff;
  font-size:10px;
  line-height:1.2;
  font-weight:800;
  letter-spacing:.075em;
  text-transform:uppercase;
}

/* Addresses are intentionally first. */
.footer-contact-polished .footer-contact-item address{
  min-height:47px;
  margin:0 0 12px;
  color:#8fa8c8;
  font-size:9.7px;
  line-height:1.55;
  font-style:normal;
}

/* Phone numbers sit directly below the address. */
.footer-contact-phones{
  display:grid;
  gap:4px;
}

.footer-contact-polished .footer-contact-item a{
  display:block;
  width:fit-content;
  max-width:100%;
  margin:0;
  color:#dcecff;
  font-size:10.5px;
  line-height:1.5;
  font-weight:500;
  text-decoration:none;
  overflow-wrap:anywhere;
  transition:color .18s ease,transform .18s ease;
}

.footer-contact-polished .footer-contact-item a:hover{
  color:#78d5ff;
  transform:translateX(2px);
}

/* Email has no address, so keep it naturally compact. */
.footer-contact-polished .footer-contact-email{
  display:grid !important;
  align-content:start;
  gap:5px;
}

.footer-contact-polished .footer-contact-email > span{
  margin-bottom:5px;
}

.footer-contact-polished .footer-contact-email a{
  color:#e8f2ff;
}

/* Old footer controls/cards must never reappear. */
.footer-region-row,
.region-selector,
.footer-office-card,
.footer-office-head,
.footer-office-code,
.footer-office-detail,
.footer-contact-intro,
.footer-contact-simple{
  /* only legacy nested components are suppressed by their own selectors;
     the obsolete footer-contact-simple markup is no longer generated */
}

/* Bottom row */
.footer-lower{
  margin-top:18px !important;
  padding-top:0 !important;
  border-top:0 !important;
}

.footer-trust{
  gap:0 !important;
}

/* ------------------------------------------------------------------------
   RESPONSIVE
   ------------------------------------------------------------------------ */
@media(max-width:1240px){
  .footer-contact-bar.footer-contact-polished{
    grid-template-columns:1fr !important;
    gap:22px !important;
  }

  .footer-social-column{
    padding-top:10px;
  }

  .footer-contact-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:24px !important;
  }
}

@media(max-width:860px){
  .footer-contact-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:26px 30px !important;
  }

  .footer-contact-polished .footer-contact-item address{
    min-height:0;
  }
}

@media(max-width:620px){
  .footer-contact-bar.footer-contact-polished{
    width:min(calc(100% - 24px),var(--container)) !important;
    margin-top:24px !important;
    padding-bottom:22px !important;
  }

  .footer-social-column{
    padding-top:10px;
  }

  .footer-linkedin-btn{
    min-width:148px;
    min-height:50px;
  }

  .footer-contact-grid{
    padding-top:22px;
    grid-template-columns:1fr 1fr !important;
    gap:24px 18px !important;
  }
}

@media(max-width:420px){
  .footer-contact-grid{
    grid-template-columns:1fr !important;
  }
}

/* ========================================================================
   FINAL MOBILE FOOTER CONTACT LAYOUT
   ======================================================================== */

@media (max-width: 860px){

  .footer-contact-bar.footer-contact-polished{
    display:flex !important;
    flex-direction:column !important;
    gap:26px !important;
    margin-top:30px !important;
    padding:0 0 28px !important;
    border-top:0 !important;
    border-bottom:1px solid rgba(151,183,225,.15) !important;
  }

  /* Make contact details look like the 2-column footer navigation above. */
  .footer-contact-grid{
    order:1 !important;
    width:100% !important;
    padding-top:0 !important;
    border-top:0 !important;

    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:30px 34px !important;
    align-items:start !important;
  }

  /* Keep LinkedIn below the contact grid, but before the final divider. */
  .footer-social-column{
    order:2 !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
  }

  .footer-contact-polished .footer-contact-item{
    min-width:0 !important;
  }

  .footer-contact-polished .footer-contact-item > span{
    margin-bottom:10px !important;
  }

  .footer-contact-polished .footer-contact-item address{
    min-height:0 !important;
    margin:0 0 10px !important;
  }

  .footer-contact-polished .footer-contact-email{
    gap:6px !important;
  }

  .footer-linkedin-btn{
    margin-top:2px !important;
  }
}

@media (max-width: 620px){

  .footer-contact-bar.footer-contact-polished{
    width:min(calc(100% - 24px),var(--container)) !important;
    margin-top:30px !important;
    padding-bottom:26px !important;
  }

  .footer-contact-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:28px 22px !important;
  }

  .footer-contact-polished .footer-contact-item > span{
    font-size:10px !important;
  }

  .footer-contact-polished .footer-contact-item address{
    font-size:9.7px !important;
    line-height:1.55 !important;
  }

  .footer-contact-polished .footer-contact-item a{
    font-size:10.5px !important;
    line-height:1.5 !important;
  }

  .footer-linkedin-btn{
    min-width:148px !important;
    min-height:50px !important;
  }
}

/* Override the older rule that collapsed contact details into one long column. */
@media (max-width: 420px){

  .footer-contact-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:26px 16px !important;
  }

  .footer-contact-polished .footer-contact-item > span{
    font-size:9.5px !important;
  }

  .footer-contact-polished .footer-contact-item address{
    font-size:9px !important;
    line-height:1.5 !important;
  }

  .footer-contact-polished .footer-contact-item a{
    font-size:9.6px !important;
  }

  .footer-linkedin-btn{
    min-width:142px !important;
  }
}

/* ========================================================================
   FINAL FOOTER LINKEDIN ICON NORMALIZATION
   Prevents page-specific SVG rules from changing the shared footer icon.
   Keep this block LAST in styles.css.
   ======================================================================== */

.site-footer .footer-linkedin-icon{
  display:grid !important;
  place-items:center !important;
  flex:0 0 auto !important;
  width:36px !important;
  height:36px !important;
  overflow:hidden !important;
  border-radius:10px !important;
  background:#0a66c2 !important;
  color:#ffffff !important;
  line-height:0 !important;
}

.site-footer .footer-linkedin-icon svg{
  display:block !important;
  width:20px !important;
  height:20px !important;
  margin:0 !important;
  padding:0 !important;
  overflow:visible !important;
  fill:#ffffff !important;
  stroke:none !important;
  stroke-width:0 !important;
  color:#ffffff !important;
  transform:none !important;
}

.site-footer .footer-linkedin-icon svg path,
.site-footer .footer-linkedin-icon svg rect,
.site-footer .footer-linkedin-icon svg circle,
.site-footer .footer-linkedin-icon svg polygon,
.site-footer .footer-linkedin-icon svg polyline,
.site-footer .footer-linkedin-icon svg g{
  fill:#ffffff !important;
  stroke:none !important;
  stroke-width:0 !important;
  vector-effect:none !important;
}

/* Keep the external-link arrow as an outline icon. */
.site-footer .footer-linkedin-arrow,
.site-footer .footer-linkedin-arrow path,
.site-footer .footer-linkedin-arrow polyline,
.site-footer .footer-linkedin-arrow line{
  fill:none !important;
  stroke:#73cfff !important;
  stroke-width:1.8 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}

@media (max-width:620px){
  .site-footer .footer-linkedin-icon{
    width:36px !important;
    height:36px !important;
  }

  .site-footer .footer-linkedin-icon svg{
    width:20px !important;
    height:20px !important;
  }
}