/* =========================================================
   Xpert IT — 2026 Website  |  Static stylesheet (no frameworks)
   ========================================================= */
:root{
  /* Dark-mode base surfaces */
  --bg:#06071b; --bg-2:#0b0b24; --bg-3:#0f1030;
  --surface:#121233; --surface-2:#181a41; --surface-hi:#1e2050;
  --line:rgba(255,255,255,0.09); --line-2:rgba(255,255,255,0.16);

  /* Gradient accent stops: blue -> purple -> pink */
  --g-blue:#2a6bff; --g-indigo:#5b3bff; --g-purple:#8b2fff; --g-magenta:#c026e0; --g-pink:#ff3ea5;
  --grad:linear-gradient(100deg,var(--g-blue) 0%,var(--g-indigo) 30%,var(--g-purple) 55%,var(--g-magenta) 78%,var(--g-pink) 100%);
  --grad-soft:linear-gradient(135deg,rgba(42,107,255,0.18),rgba(139,47,255,0.16) 55%,rgba(255,62,165,0.16));

  /* Legacy aliases mapped to dark palette (so existing rules keep working) */
  --navy:#0b0b24; --navy-900:#050514; --navy-800:#121233;
  --blue:#2a6bff; --blue-700:#5b3bff; --blue-300:#9db6ff; --sky:rgba(91,59,255,0.16);
  --white:var(--surface); --grey-50:var(--surface); --grey-100:var(--line); --grey-200:var(--line-2);
  --grey-400:#8a90b8; --grey-600:#b8bde0; --ink:#eef0ff;

  --green:#22d38a; --red:#ff5a6a; --amber:#f5a623;
  --font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --maxw:1200px; --gutter:clamp(1.25rem,4vw,3rem);
  --radius:18px; --radius-sm:12px; --radius-lg:28px;
  --shadow-sm:0 2px 10px rgba(0,0,0,0.4);
  --shadow:0 18px 44px rgba(0,0,0,0.5);
  --shadow-lg:0 34px 80px rgba(0,0,0,0.6);
  --ease:cubic-bezier(0.22,1,0.36,1); --nav-h:88px;
}
*,*::before,*::after{box-sizing:border-box;}
*{margin:0;}

/* Animatable angle for rotating gradient borders ("light trace" effect) */
@property --angle{syntax:"<angle>";initial-value:0deg;inherits:false;}
@keyframes border-spin{to{--angle:360deg;}}

/* Reusable animated gradient border.
   A conic gradient rotates around the element edge via a masked ::before.
   Two layers: a soft always-on hairline + a bright travelling "comet" light. */
.glow-border{position:relative;isolation:isolate;}
.glow-border::before,.glow-border::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;}
/* base subtle full-perimeter gradient ring */
.glow-border::before{background:conic-gradient(from var(--angle),var(--g-blue),var(--g-indigo),var(--g-purple),var(--g-magenta),var(--g-pink),var(--g-blue));opacity:0.35;animation:border-spin 6s linear infinite;}
/* bright travelling highlight ("light element") */
.glow-border::after{background:conic-gradient(from var(--angle),transparent 0deg,transparent 300deg,#ffffff 340deg,var(--g-pink) 352deg,transparent 360deg);opacity:0.9;filter:blur(0.5px) drop-shadow(0 0 6px rgba(255,62,165,0.55));animation:border-spin 6s linear infinite;}
.glow-border:hover::before{opacity:0.7;}
.glow-border:hover::after{animation-duration:3s;}
/* stagger the travelling light across grids so they feel alive, not synced */
.glow-border:nth-child(2)::before,.glow-border:nth-child(2)::after{animation-delay:-1.5s;}
.glow-border:nth-child(3)::before,.glow-border:nth-child(3)::after{animation-delay:-3s;}
.glow-border:nth-child(4)::before,.glow-border:nth-child(4)::after{animation-delay:-4.5s;}
.glow-border:nth-child(5)::before,.glow-border:nth-child(5)::after{animation-delay:-0.9s;}
.glow-border:nth-child(6)::before,.glow-border:nth-child(6)::after{animation-delay:-2.4s;}
.glow-border:nth-child(7)::before,.glow-border:nth-child(7)::after{animation-delay:-3.9s;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{font-family:var(--font);color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;
  background-image:radial-gradient(90% 60% at 80% -5%,rgba(91,59,255,0.22),transparent 60%),radial-gradient(80% 55% at 0% 15%,rgba(42,107,255,0.16),transparent 55%),radial-gradient(70% 60% at 100% 100%,rgba(255,62,165,0.12),transparent 60%);
  background-attachment:fixed;}
img,svg,video{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
button{font:inherit;cursor:pointer;border:none;background:none;color:inherit;}
ul{list-style:none;padding:0;}
:focus-visible{outline:3px solid var(--g-purple);outline-offset:2px;border-radius:4px;}

h1,h2,h3,h4{line-height:1.1;font-weight:800;letter-spacing:-0.02em;color:#fff;}
h1{font-size:clamp(2.4rem,5.2vw,4.2rem);}
h2{font-size:clamp(1.9rem,3.6vw,3rem);}
h3{font-size:clamp(1.15rem,1.6vw,1.4rem);}
p{color:var(--grey-600);}
.lead{font-size:clamp(1.05rem,1.5vw,1.3rem);color:var(--grey-600);}

/* Gradient text helper */
.grad-text,h1 .accent,h2 .accent,.quote blockquote .accent{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;}

.container{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter);}
.section{padding-block:clamp(3.5rem,8vw,7rem);}
.section--tight{padding-block:clamp(2.5rem,5vw,4rem);}
.bg-grey{background:var(--bg-2);}
.bg-deep{background:var(--bg-3);}
.center{text-align:center;}
.measure{max-width:62ch;}
.eyebrow{display:inline-block;font-size:0.8rem;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;margin-bottom:0.9rem;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;}
.eyebrow--light{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.section-head{max-width:760px;margin-bottom:clamp(2rem,4vw,3.25rem);}
.section-head.center{margin-inline:auto;}
.accent{color:var(--g-purple);}

.btn{--btn-fg:#fff;display:inline-flex;align-items:center;gap:0.55rem;padding:0.9rem 1.5rem;background:var(--grad);background-size:180% 180%;color:var(--btn-fg);border-radius:999px;font-weight:700;font-size:0.98rem;transition:transform .25s var(--ease),box-shadow .25s var(--ease),background-position .5s var(--ease);box-shadow:0 10px 26px rgba(120,50,255,0.4);white-space:nowrap;}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(180,40,220,0.5);background-position:100% 0;}
.btn:active{transform:translateY(0);}
.btn .arr{transition:transform .25s var(--ease);}
.btn:hover .arr{transform:translateX(4px);}
.btn--ghost{background:rgba(255,255,255,0.04);--btn-fg:#fff;box-shadow:inset 0 0 0 1.5px var(--line-2);}
.btn--ghost:hover{box-shadow:inset 0 0 0 1.5px transparent;background:var(--grad-soft);}
.btn--light{background:#fff;--btn-fg:#0b0b24;box-shadow:0 12px 30px rgba(0,0,0,0.35);}
.btn--light:hover{background:#fff;}
.btn--outline-light{background:rgba(255,255,255,0.06);--btn-fg:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,0.4);}
.btn--outline-light:hover{background:rgba(255,255,255,0.14);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,0.8);}
.btn--lg{padding:1.05rem 1.9rem;font-size:1.05rem;}
.text-link{font-weight:700;display:inline-flex;align-items:center;gap:0.4rem;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;}
.text-link .arr{transition:transform .25s var(--ease);}
.text-link:hover .arr{transform:translateX(4px);}

/* ---------- Header / Nav ---------- */
.site-header{position:fixed;inset:0 0 auto 0;z-index:100;height:var(--nav-h);display:flex;align-items:center;transition:background .3s,box-shadow .3s,height .3s;}
.site-header .container{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;}
.site-header.scrolled,.site-header.solid{background:rgba(8,9,28,0.72);backdrop-filter:saturate(160%) blur(16px);-webkit-backdrop-filter:saturate(160%) blur(16px);box-shadow:0 1px 0 var(--line),var(--shadow-sm);}
.site-header.scrolled{height:72px;}
.brand{display:flex;align-items:center;gap:0.6rem;flex-shrink:0;z-index:2;}
.brand img{height:104px;width:auto;transition:height .3s;}
.site-header.scrolled .brand img{height:80px;}
/* dark header keeps the white logo everywhere */
.brand .logo-colour{display:none;}
.site-header.scrolled .brand .logo-white,.site-header.solid .brand .logo-white{display:block;}
.site-header.scrolled .brand .logo-colour,.site-header.solid .brand .logo-colour{display:none;}
.nav{display:flex;align-items:center;gap:2rem;}
.nav-links{display:flex;align-items:center;gap:1.6rem;}
.nav-links a{font-weight:600;font-size:0.95rem;color:#fff;position:relative;padding-block:0.3rem;transition:color .2s;}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:var(--blue);transition:width .25s var(--ease);}
.nav-links a:hover::after,.nav-links a[aria-current="page"]::after{width:100%;}
.nav-links a::after{background:var(--grad);}
.site-header.scrolled .nav-links a,.site-header.solid .nav-links a{color:#fff;}
.nav-links a[aria-current="page"]{color:#fff;}
/* ---------- Nav dropdown ---------- */
.has-dropdown{position:relative;}
.nav-parent{display:inline-flex;align-items:center;gap:0.35rem;}
.nav-caret{transition:transform .25s var(--ease);opacity:0.85;}
.has-dropdown:hover .nav-caret,.has-dropdown.open .nav-caret{transform:rotate(180deg);}
.nav-dropdown{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(8px);min-width:220px;background:var(--surface);border:1px solid var(--line-2);border-radius:14px;padding:0.55rem;box-shadow:0 20px 50px rgba(0,0,0,0.45),0 0 0 1px rgba(255,255,255,0.02) inset;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .22s var(--ease),transform .22s var(--ease),visibility .22s;z-index:20;display:flex;flex-direction:column;gap:0.15rem;}
.nav-dropdown::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px;}
.has-dropdown:hover > .nav-dropdown,.has-dropdown:focus-within > .nav-dropdown,.has-dropdown.open > .nav-dropdown{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0);}
.nav-dropdown a{display:block;padding:0.6rem 0.9rem;border-radius:10px;font-size:0.92rem;font-weight:600;color:#fff;white-space:nowrap;transition:background .2s var(--ease),color .2s var(--ease);}
.nav-dropdown a::after{display:none;}
.nav-dropdown a:hover,.nav-dropdown a:focus-visible{background:var(--grad-soft);color:#fff;}
.nav-cta{display:flex;align-items:center;gap:0.75rem;}
.hamburger{display:none;width:44px;height:44px;position:relative;z-index:2;}
.hamburger span{position:absolute;left:10px;right:10px;height:2px;background:#fff;transition:transform .3s var(--ease),opacity .2s,background .3s;}
.hamburger span:nth-child(1){top:15px;}
.hamburger span:nth-child(2){top:21px;}
.hamburger span:nth-child(3){top:27px;}
.site-header.scrolled .hamburger span,.site-header.solid .hamburger span{background:#fff;}
body.menu-open .hamburger span{background:#fff;}
body.menu-open .hamburger span:nth-child(1){transform:translateY(6px) rotate(45deg);}
body.menu-open .hamburger span:nth-child(2){opacity:0;}
body.menu-open .hamburger span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}

/* ---------- Hero (home) ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;padding-top:var(--nav-h);color:#fff;overflow:hidden;background:var(--bg);}




/* Full-screen background video loop */
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0;}
/* Overlay removed — video shows at full clarity */
.hero__overlay{display:none;}
.hero .container{position:relative;z-index:2;padding-block:4rem;}

.hero__grid{display:flex;flex-wrap:wrap;--cols:1;--gapx:3rem;gap:3rem;align-items:center;max-width:680px;}
.hero h1{color:#fff;}
.hero__lead{color:rgba(255,255,255,0.82);margin-top:1.25rem;font-size:clamp(1.05rem,1.4vw,1.25rem);max-width:46ch;}
.hero__ticks{display:flex;flex-wrap:wrap;gap:0.5rem 1.4rem;margin:1.8rem 0 2.2rem;}
.hero__ticks li{display:flex;align-items:center;gap:0.5rem;font-weight:600;font-size:0.95rem;color:rgba(255,255,255,0.92);}
.hero__ticks svg{flex-shrink:0;}
.hero__actions{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;}
.orbit{position:relative;aspect-ratio:1;max-width:460px;margin-inline:auto;width:100%;}
.orbit{display:none;}
.orbit__core{position:absolute;inset:34% 34%;display:flex;align-items:center;justify-content:center;background:var(--grad);border-radius:50%;box-shadow:0 20px 60px rgba(139,47,255,0.5),inset 0 0 30px rgba(255,255,255,0.15);color:#fff;font-weight:800;text-align:center;font-size:0.8rem;letter-spacing:0.02em;padding:0.5rem;}
.orbit__ring{position:absolute;inset:0;border:1px dashed rgba(255,255,255,0.22);border-radius:50%;animation:spin 40s linear infinite;}
.orbit__ring--2{inset:16%;animation-duration:28s;animation-direction:reverse;border-color:rgba(111,168,255,0.28);}
.orbit__badge{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(var(--a)) translateY(calc(var(--r)*-1)) rotate(calc(var(--a)*-1));background:rgba(255,255,255,0.95);color:var(--navy);font-size:0.72rem;font-weight:700;padding:0.5rem 0.8rem;border-radius:999px;box-shadow:var(--shadow);white-space:nowrap;animation:floaty 6s var(--ease) infinite;animation-delay:var(--d,0s);}
@keyframes spin{to{transform:rotate(360deg);}}
@keyframes floaty{50%{margin-top:-6px;}}

/* ---------- Interior page hero ---------- */
.page-hero{position:relative;padding:calc(var(--nav-h) + clamp(3rem,6vw,5rem)) 0 clamp(3rem,6vw,5rem);background:radial-gradient(90% 120% at 85% -10%,rgba(255,62,165,0.22),transparent 55%),radial-gradient(90% 120% at 10% 0%,rgba(42,107,255,0.24),transparent 55%),linear-gradient(180deg,var(--bg-2),var(--bg));color:#fff;overflow:hidden;}
.page-hero::after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,0.06) 1px,transparent 1px);background-size:26px 26px;-webkit-mask-image:radial-gradient(80% 80% at 70% 10%,#000,transparent 70%);mask-image:radial-gradient(80% 80% at 70% 10%,#000,transparent 70%);pointer-events:none;}
.page-hero .container{position:relative;z-index:1;}
.page-hero h1{color:#fff;}
.page-hero .lead{color:rgba(255,255,255,0.82);margin-top:1.1rem;}
.page-hero__grid{display:flex;flex-wrap:wrap;--gapx:3rem;gap:3rem;align-items:center;}
.page-hero__ticks{display:flex;flex-wrap:wrap;gap:0.6rem 1.5rem;margin-top:1.6rem;}
.page-hero__ticks li{display:flex;gap:0.5rem;align-items:center;font-weight:600;color:rgba(255,255,255,0.92);font-size:0.92rem;}
.page-hero__actions{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2rem;}

.statuscard{background:var(--grad-soft),rgba(255,255,255,0.03);border:1px solid var(--line-2);border-radius:var(--radius);padding:1.4rem;backdrop-filter:blur(6px);box-shadow:var(--shadow);}
.statuscard__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.1rem;}
.statuscard__top strong{color:#fff;font-size:0.95rem;}
.pill-ok{display:inline-flex;align-items:center;gap:0.4rem;font-size:0.78rem;font-weight:700;color:#b7f7d8;background:rgba(23,185,120,0.16);padding:0.3rem 0.7rem;border-radius:999px;}
.pill-ok .dot{width:8px;height:8px;border-radius:50%;background:var(--green);animation:pulse 2s infinite;}
@keyframes pulse{70%{box-shadow:0 0 0 8px rgba(23,185,120,0);}100%{box-shadow:0 0 0 0 rgba(23,185,120,0);}}
.statusrow{display:flex;flex-wrap:wrap;--gapx:0.4rem;gap:0.4rem;padding:0.7rem 0;border-top:1px solid rgba(255,255,255,0.08);color:rgba(255,255,255,0.8);font-size:0.9rem;}
.statusrow span:last-child{color:#b7f7d8;font-weight:700;}
.statusgrid{display:flex;flex-wrap:wrap;--cols:2;--gapx:0.8rem;gap:0.8rem;margin-top:0.9rem;}
.statustile{background:rgba(255,255,255,0.06);border-radius:var(--radius-sm);padding:0.9rem;}
.statustile b{display:block;color:#fff;font-size:1.4rem;}
.statustile small{color:rgba(255,255,255,0.6);font-size:0.75rem;}

/* ---------- Pillars ---------- */
.pillars{display:flex;flex-wrap:wrap;--cols:4;--gapx:1.25rem;gap:1.25rem;}
.pillar{background:var(--surface);border:1px solid transparent;border-radius:var(--radius);padding:1.8rem 1.6rem;box-shadow:var(--shadow-sm);transition:transform .3s var(--ease),box-shadow .3s var(--ease);}
.pillar:hover{transform:translateY(-6px);box-shadow:var(--shadow);}
.pillar__icon{width:54px;height:54px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:1.1rem;background:var(--grad-soft);border:1px solid var(--line-2);overflow:hidden;}
.pillar__icon img{width:100%;height:100%;object-fit:cover;}
.pillar h3{margin-bottom:0.4rem;}
.pillar p{font-size:0.95rem;}

/* ---------- Cost of IT ---------- */
.cost{background:linear-gradient(180deg,var(--bg),var(--bg-2));color:#fff;position:relative;overflow:hidden;}
.cost::before{content:"";position:absolute;width:700px;height:700px;border-radius:50%;background:radial-gradient(circle,rgba(139,47,255,0.3),transparent 70%);top:-260px;right:-180px;pointer-events:none;}
.cost::after{content:"";position:absolute;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(255,62,165,0.16),transparent 70%);bottom:-260px;left:-160px;pointer-events:none;}
.cost .container{position:relative;z-index:1;}
.cost__grid{display:flex;flex-wrap:wrap;--cols:2;--gapx:clamp(1.5rem,4vw,3rem);gap:clamp(1.5rem,4vw,3rem);align-items:center;margin-top:2.5rem;}
.cost__list{display:flex;flex-direction:column;gap:0.75rem;}
.cost__list li{display:flex;gap:0.7rem;align-items:center;color:rgba(255,255,255,0.85);}
.cost__list .x{color:var(--red);flex-shrink:0;}

/* Visual cycle using Untitled-4.png */
.cycle-visual{position:relative;display:flex;align-items:center;justify-content:center;padding:1rem;}
.cycle-visual__img{width:min(100%,460px);filter:drop-shadow(0 20px 50px rgba(139,47,255,0.45));}
.cycle-visual__glow{position:absolute;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(91,59,255,0.35),transparent 65%);filter:blur(20px);z-index:-1;}
.cycle{display:flex;flex-wrap:wrap;--cols:2;--gapx:0.9rem;gap:0.9rem;}
.cycle__item{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem;}
.cycle__item b{color:#fff;display:block;margin-bottom:0.2rem;font-size:1.05rem;}
.cycle__item span{color:rgba(255,255,255,0.7);font-size:0.85rem;}
.cycle__num{font-weight:800;font-size:0.8rem;letter-spacing:0.1em;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.compare{display:flex;flex-wrap:wrap;--cols:2;--gapx:1.25rem;gap:1.25rem;margin-top:2.5rem;}
.compare__col{border-radius:var(--radius);padding:1.6rem;}
.compare__col--bad{background:rgba(255,90,106,0.08);border:1px solid rgba(255,90,106,0.28);}
.compare__col--good{background:rgba(34,211,138,0.08);border:1px solid rgba(34,211,138,0.3);}
.compare__col h4{color:#fff;font-size:1rem;text-transform:uppercase;letter-spacing:0.08em;margin-bottom:1rem;}
.compare__col ul{display:flex;flex-direction:column;gap:0.6rem;}
.compare__col li{display:flex;gap:0.6rem;align-items:flex-start;color:rgba(255,255,255,0.85);font-size:0.92rem;}
.compare__col--good .ic{color:var(--green);flex-shrink:0;}
.compare__col--bad .ic{color:var(--red);flex-shrink:0;}

/* ---------- Services grid ---------- */
.services-grid{display:flex;flex-wrap:wrap;--cols:4;--gapx:1.25rem;gap:1.25rem;}
.svc-card{background:var(--surface);border:1px solid transparent;border-radius:var(--radius);padding:1.7rem 1.5rem;box-shadow:var(--shadow-sm);transition:transform .3s var(--ease),box-shadow .3s var(--ease);}
.svc-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);}
.svc-card__icon{width:54px;height:54px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:1.1rem;background:var(--grad-soft);border:1px solid var(--line-2);overflow:hidden;}
.svc-card__icon img{width:100%;height:100%;object-fit:cover;}
.svc-card h3{margin-bottom:0.45rem;font-size:1.15rem;}
.svc-card p{font-size:0.92rem;}

/* ---------- Quote ---------- */
.quote{background:linear-gradient(135deg,var(--bg-2),var(--bg-3));color:#fff;text-align:center;position:relative;overflow:hidden;}
.quote::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 80% at 50% 0%,rgba(139,47,255,0.25),transparent 60%);pointer-events:none;}
.quote .container{position:relative;z-index:1;}
.quote blockquote{max-width:20ch;margin-inline:auto;font-size:clamp(1.8rem,4.5vw,3.2rem);font-weight:800;line-height:1.12;letter-spacing:-0.02em;color:#fff;}
.quote cite{display:block;margin-top:1.6rem;font-style:normal;color:rgba(255,255,255,0.7);font-weight:600;font-size:0.95rem;max-width:52ch;margin-inline:auto;line-height:1.5;}

/* ---------- Integrations / brands ---------- */
.brands{display:flex;flex-wrap:wrap;gap:1.25rem;justify-content:center;margin-top:2.5rem;}
.brand-chip{display:flex;align-items:center;justify-content:center;height:200px;padding:0 3rem;min-width:320px;background:var(--surface);border:1px solid transparent;border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .3s var(--ease),box-shadow .3s var(--ease);}
.brand-chip:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
.brand-chip img{max-height:144px;max-width:340px;width:auto;object-fit:contain;}

/* ---------- Plans ---------- */
.plans{display:flex;flex-wrap:wrap;--cols:2;--gapx:1.5rem;gap:1.5rem;align-items:stretch;margin-top:1rem;}
.plan{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:2.2rem;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;position:relative;transition:transform .3s var(--ease),box-shadow .3s var(--ease);}
.plan:hover{transform:translateY(-6px);box-shadow:var(--shadow);}
.plan--featured{background:var(--surface-2);border:1px solid transparent;box-shadow:var(--shadow);}
.plan__tag{position:absolute;top:-14px;left:2.2rem;background:var(--grad);color:#fff;font-size:0.72rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;padding:0.4rem 0.9rem;border-radius:999px;box-shadow:0 8px 18px rgba(139,47,255,0.45);}
.plan h3{font-size:1.5rem;margin-bottom:0.6rem;}
.plan__desc{font-size:0.95rem;margin-bottom:1.4rem;}
.plan__list{display:flex;flex-direction:column;gap:0.7rem;margin-bottom:1.8rem;}
.plan__list li{display:flex;gap:0.6rem;align-items:flex-start;font-size:0.94rem;color:var(--grey-600);}
.plan__list .ic{color:var(--green);flex-shrink:0;margin-top:2px;}
.plan .btn{margin-top:auto;justify-content:center;}

/* ---------- Steps ---------- */
.steps{display:flex;flex-wrap:wrap;--cols:4;--gapx:1.25rem;gap:1.25rem;counter-reset:step;}
.step{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.8rem 1.5rem;box-shadow:var(--shadow-sm);position:relative;transition:transform .3s var(--ease),box-shadow .3s var(--ease);}
.step:hover{transform:translateY(-6px);box-shadow:var(--shadow);}
.step__num{font-size:0.75rem;font-weight:800;letter-spacing:0.14em;text-transform:uppercase;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.step__badge{width:46px;height:46px;border-radius:12px;background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;margin:0.8rem 0 1rem;box-shadow:0 8px 18px rgba(139,47,255,0.4);}
.step h3{font-size:1.2rem;margin-bottom:0.5rem;}
.step p{font-size:0.92rem;}

/* ---------- Approach (Monitor/Maintain/Support/Improve) ---------- */
.approach{display:flex;flex-wrap:wrap;--cols:4;--gapx:1.25rem;gap:1.25rem;}
.approach__item{padding:1.6rem;border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s;}
.approach__item:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--line-2);}
.approach__item .num{font-weight:800;font-size:2rem;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.approach__item h3{margin:0.6rem 0 0.4rem;}
.approach__item p{font-size:0.92rem;}

/* ---------- Pain points ---------- */
.pains{display:flex;flex-wrap:wrap;--cols:2;--gapx:1.25rem;gap:1.25rem;margin-top:1rem;}
.pain{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--g-magenta);border-radius:var(--radius);padding:1.6rem;box-shadow:var(--shadow-sm);}
.pain h3{font-size:1.15rem;margin-bottom:0.5rem;}
.pain p{font-size:0.94rem;}

/* ---------- Cybersecurity page ---------- */
/* Centered hero + full-width image below */
.page-hero--cyber{padding-bottom:0;overflow:hidden;}
.page-hero__center{max-width:820px;margin-inline:auto;text-align:center;}
.page-hero__ticks--center{justify-content:center;}
.page-hero__actions--center{justify-content:center;}
.cyber-hero-full{position:relative;z-index:1;width:100%;margin-top:clamp(2.5rem,5vw,4rem);line-height:0;}
.cyber-hero-full img{width:100%;height:clamp(280px,42vw,560px);object-fit:cover;display:block;}
.cyber-hero-full::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,7,27,0.35) 0%,rgba(6,7,27,0) 30%,rgba(6,7,27,0) 70%,var(--bg) 100%);pointer-events:none;}
/* Legacy boxed hero media (kept for safety) */
.cyber-hero-media{position:relative;border-radius:var(--radius);overflow:hidden;background:var(--surface);border:1px solid var(--line-2);aspect-ratio:4/3;box-shadow:var(--shadow);}
.cyber-hero-media img{width:100%;height:100%;object-fit:cover;display:block;}
.cyber-hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,7,27,0) 40%,rgba(6,7,27,0.55));pointer-events:none;}
/* Threat cards */
.threats{display:flex;flex-wrap:wrap;--cols:4;--gapx:1.25rem;gap:1.25rem;margin-top:1rem;}
.threat{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.75rem 1.5rem;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s;}
.threat:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--line-2);}
.threat__icon{width:clamp(52px,5vw,60px);height:clamp(52px,5vw,60px);border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:1.25rem;background:radial-gradient(120% 120% at 30% 20%,rgba(77,159,255,0.28),rgba(91,59,255,0.14) 60%,rgba(18,18,51,0.6));box-shadow:0 0 22px rgba(77,159,255,0.35),inset 0 0 0 1px rgba(120,170,255,0.25);}
.threat__icon img{width:58%;height:58%;object-fit:contain;filter:drop-shadow(0 0 6px rgba(77,159,255,0.6));}
.threat h3{font-size:1.1rem;margin-bottom:0.5rem;color:#fff;}
.threat p{font-size:0.93rem;color:var(--grey-600);}
/* Full-bleed approach image */
.approach-cyber{padding-bottom:clamp(3.5rem,8vw,7rem);}
.cyber-approach-media{position:relative;width:100%;line-height:0;margin:clamp(2rem,4vw,3rem) 0 clamp(2.5rem,5vw,4rem);}
.cyber-approach-media img{width:100%;height:clamp(300px,44vw,620px);object-fit:cover;display:block;}
.cyber-approach-media::before{content:"";position:absolute;inset:0;top:auto;height:38%;background:linear-gradient(180deg,transparent,var(--bg-2));pointer-events:none;}
.cyber-approach-media::after{content:"";position:absolute;inset:0;bottom:auto;height:38%;background:linear-gradient(180deg,var(--bg-2),transparent);pointer-events:none;}
/* 5-pillar approach (Prevent/Protect/Detect/Respond/Recover) — icon-led, no card */
.cyber-pillars{display:flex;flex-wrap:wrap;--cols:5;--gapx:1.5rem;gap:1.5rem;margin-top:0;}
.cyber-pillar{position:relative;text-align:center;padding:0 0.5rem;background:none;border:none;transition:transform .3s var(--ease);}
.cyber-pillar:hover{transform:translateY(-4px);}
.cyber-pillar__icon{width:clamp(84px,9vw,116px);height:clamp(84px,9vw,116px);display:flex;align-items:center;justify-content:center;margin:0 auto 1.1rem;}
.cyber-pillar__icon img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 24px rgba(139,47,255,0.35));}
.cyber-pillar__num{display:none;}
.cyber-pillar h3{font-size:1.2rem;margin-bottom:0.5rem;color:#fff;}
.cyber-pillar p{font-size:0.92rem;color:var(--grey-600);line-height:1.55;max-width:22ch;margin-inline:auto;}

/* ---------- Why Xpert IT page ---------- */
/* Image-background hero (like home) */
.why-hero{position:relative;min-height:40vh;display:flex;align-items:center;padding-top:var(--nav-h);color:#fff;overflow:hidden;background:var(--bg);}
.why-hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:75% center;z-index:0;}
.why-hero__overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(6,7,27,0.9) 0%,rgba(6,7,27,0.72) 40%,rgba(6,7,27,0.35) 75%,rgba(6,7,27,0.15) 100%),linear-gradient(180deg,rgba(6,7,27,0.4),rgba(6,7,27,0.55));}
/* Clearer hero — lighter overlay only behind the text so the image stays vivid */
.why-hero--clear .why-hero__overlay{background:linear-gradient(90deg,rgba(6,7,27,0.78) 0%,rgba(6,7,27,0.5) 34%,rgba(6,7,27,0.12) 62%,rgba(6,7,27,0) 100%);}
.why-hero .container{position:relative;z-index:2;padding-block:clamp(3rem,7vw,6rem);}
.why-hero__inner{max-width:660px;}
.why-hero h1{color:#fff;}
.why-hero__lead{color:rgba(255,255,255,0.85);margin-top:1.25rem;font-size:clamp(1.05rem,1.4vw,1.25rem);max-width:52ch;}
.why-hero__actions{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2.2rem;}
/* 5 service cards */
.why-services{display:flex;flex-wrap:wrap;--cols:5;--gapx:1.25rem;gap:1.25rem;margin-top:1rem;}
.why-service{position:relative;text-align:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:2rem 1.35rem 1.75rem;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s;}
.why-service:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--line-2);}
.why-service__icon{width:clamp(72px,7vw,92px);height:clamp(72px,7vw,92px);display:flex;align-items:center;justify-content:center;margin:0 auto 1.1rem;}
.why-service__icon img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 20px rgba(139,47,255,0.3));}
.why-service h3{font-size:1.15rem;margin-bottom:0.5rem;color:#fff;}
.why-service p{font-size:0.9rem;color:var(--grey-600);line-height:1.5;}
/* Values grid */
.why-values{display:flex;flex-wrap:wrap;--cols:4;--gapx:1.25rem;gap:1.25rem;margin-top:1rem;text-align:left;}
.why-value{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.8rem 1.5rem;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s;}
.why-value:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--line-2);}
.why-value__num{font-weight:800;font-size:1.8rem;line-height:1;margin-bottom:0.8rem;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;}
.why-value h3{font-size:1.12rem;margin-bottom:0.5rem;color:#fff;}
.why-value p{font-size:0.92rem;color:var(--grey-600);line-height:1.55;}
/* Full-width image band before the footer — show full image, no cropping */
.why-image-band{position:relative;width:100%;line-height:0;}
.why-image-band img{width:100%;height:auto;display:block;}

/* ---------- Ideal-for / list card ---------- */
.split{display:flex;flex-wrap:wrap;--cols:2;--gapx:clamp(1.5rem,4vw,3rem);gap:clamp(1.5rem,4vw,3rem);align-items:start;}
.checklist{display:flex;flex-direction:column;gap:0.85rem;}
.checklist li{display:flex;gap:0.7rem;align-items:flex-start;font-size:1rem;color:#eef0ff;font-weight:500;}
.checklist .ic{color:var(--g-pink);flex-shrink:0;margin-top:3px;}
.stepline{display:flex;flex-direction:column;gap:1rem;}
.stepline__item{display:flex;gap:1rem;align-items:flex-start;}
.stepline__n{width:34px;height:34px;border-radius:50%;background:var(--grad);color:#fff;font-weight:800;font-size:0.85rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.stepline__item b{color:#fff;display:block;}
.stepline__item span{font-size:0.92rem;color:var(--grey-600);}

/* ---------- FAQ accordion ---------- */
.faq{max-width:820px;margin-inline:auto;}
.faq__item{border-bottom:1px solid var(--line);}
.faq__q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.35rem 0;text-align:left;font-weight:700;color:#fff;font-size:clamp(1.02rem,1.4vw,1.18rem);}
.faq__q .ico{flex-shrink:0;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--grad-soft);color:#fff;font-size:1.3rem;font-weight:700;transition:transform .3s var(--ease),background .3s;line-height:1;}
.faq__item.open .faq__q .ico{transform:rotate(45deg);background:var(--grad);color:#fff;}
.faq__a{overflow:hidden;max-height:0;transition:max-height .35s var(--ease);}
.faq__a p{padding:0 0 1.35rem;font-size:0.98rem;}

/* ---------- CTA band ---------- */
.cta-band{background:var(--grad);background-size:150% 150%;color:#fff;text-align:center;position:relative;overflow:hidden;}
.cta-band::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,0.08) 1px,transparent 1px);background-size:24px 24px;opacity:0.5;}
.cta-band .container{position:relative;z-index:1;}
.cta-band h2{color:#fff;}
/* Override gradient-clipped accent inside the CTA band so it stays readable on the gradient bg */
.cta-band h2 .accent{-webkit-text-fill-color:#fff;color:#fff;background:none;text-shadow:0 1px 12px rgba(0,0,0,0.25);}
.cta-band p{color:rgba(255,255,255,0.85);margin-top:0.9rem;}
.cta-band__actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-top:2rem;}
.cta-band small{display:block;margin-top:1.1rem;color:rgba(255,255,255,0.6);font-size:0.85rem;}

/* ---------- Contact / forms ---------- */
.contact-grid{display:flex;flex-wrap:wrap;--gapx:clamp(1.5rem,4vw,3.5rem);gap:clamp(1.5rem,4vw,3.5rem);align-items:start;}
.info-card{display:flex;gap:1rem;align-items:flex-start;padding:1.3rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow-sm);margin-bottom:1rem;transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s;}
.info-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--line-2);}
.info-card__ic{width:46px;height:46px;border-radius:12px;background:var(--grad-soft);color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.info-card b{color:#fff;display:block;font-size:1rem;}
.info-card a,.info-card span{color:var(--grey-600);font-size:0.95rem;}
.info-card a:hover{color:#fff;}

.form{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:clamp(1.6rem,3vw,2.5rem);box-shadow:var(--shadow);}
.form__row{display:flex;flex-wrap:wrap;--cols:2;--gapx:1.1rem;gap:1.1rem;}
.field{margin-bottom:1.1rem;display:flex;flex-direction:column;gap:0.4rem;}
.field label{font-weight:600;font-size:0.88rem;color:#fff;}
.field label .req{color:var(--g-pink);}
.field input,.field select,.field textarea{width:100%;padding:0.85rem 1rem;border:1.5px solid var(--line-2);border-radius:var(--radius-sm);font:inherit;color:#fff;background:var(--bg-3);transition:border-color .2s,background .2s,box-shadow .2s;}
.field select option{background:var(--bg-3);color:#fff;}
.field input::placeholder,.field textarea::placeholder{color:var(--grey-400);}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--g-purple);background:var(--surface-hi);box-shadow:0 0 0 4px rgba(139,47,255,0.2);}
.field textarea{resize:vertical;min-height:130px;}
.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:var(--red);background:rgba(255,90,106,0.08);}
.field__err{color:var(--red);font-size:0.8rem;min-height:0;display:none;}
.field.invalid .field__err{display:block;}
.form__note{font-size:0.82rem;color:var(--grey-400);margin-top:0.4rem;}
.form-success{display:none;text-align:center;padding:2rem 1rem;}
.form-success.show{display:block;}
.form-success .tick{width:64px;height:64px;border-radius:50%;background:var(--green);color:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto 1.2rem;animation:pop .4s var(--ease);}
@keyframes pop{0%{transform:scale(0);}70%{transform:scale(1.15);}100%{transform:scale(1);}}
.form-success h3{margin-bottom:0.5rem;}

/* ---------- Map ---------- */
.map{border:0;width:100%;height:380px;border-radius:var(--radius);box-shadow:var(--shadow-sm);filter:invert(0.92) hue-rotate(180deg) saturate(0.85) contrast(0.95);border:1px solid var(--line);}

/* ---------- Footer ---------- */
.site-footer{background:var(--bg-2);color:rgba(255,255,255,0.75);padding-block:clamp(3rem,6vw,4.5rem) 2rem;border-top:1px solid var(--line);position:relative;overflow:hidden;}
.site-footer::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--grad);}
.footer-grid{display:flex;flex-wrap:wrap;--gapx:2.5rem;gap:2.5rem;padding-bottom:2.5rem;border-bottom:1px solid var(--line);}
.site-footer .brand img{height:58px;}
.footer-about p{margin-top:1rem;font-size:0.92rem;color:rgba(255,255,255,0.6);max-width:34ch;}
.footer-col h4{color:#fff;font-size:0.95rem;letter-spacing:0.04em;margin-bottom:1rem;}
.footer-col a:not(.btn){display:block;padding:0.35rem 0;font-size:0.92rem;color:rgba(255,255,255,0.7);transition:color .2s,padding-left .2s;}
.footer-col a:not(.btn):hover{color:#fff;padding-left:4px;}
.site-footer .btn{display:inline-flex;padding:0.9rem 1.5rem;color:#fff;}
.site-footer .btn:hover{padding-left:1.5rem;color:#fff;}
.socials{display:flex;gap:0.7rem;margin-top:1.2rem;}
.socials a{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,0.08);color:#fff;transition:background .25s,transform .25s;}
.socials a:hover{background:var(--grad);transform:translateY(-3px);}
.footer-bottom{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding-top:1.6rem;font-size:0.85rem;color:rgba(255,255,255,0.5);}

/* ---------- Scroll reveal ---------- */
[data-reveal]{opacity:0;transform:translateY(28px);transition:opacity .7s var(--ease),transform .7s var(--ease);}
[data-reveal].in{opacity:1;transform:none;}
[data-reveal][data-delay="1"]{transition-delay:.08s;}
[data-reveal][data-delay="2"]{transition-delay:.16s;}
[data-reveal][data-delay="3"]{transition-delay:.24s;}
[data-reveal][data-delay="4"]{transition-delay:.32s;}

/* ---------- Utility ---------- */
.mt-1{margin-top:1rem;}
.mt-2{margin-top:2rem;}
.stack-sm>*+*{margin-top:0.5rem;}

/* ---------- Responsive ---------- */
@media (max-width:1024px){
  .pillars,.services-grid,.steps,.approach,.threats,.why-values{--cols:2;}
  .cyber-pillars,.why-services{--cols:3;}
  .page-hero__grid,.cost__grid,.split,.contact-grid{--cols:1;}
  .footer-grid{--cols:2;gap:2rem;}



  .hero__grid{max-width:none;}

}
@media (max-width:768px){
  :root{--nav-h:64px;}
  .nav-links,.nav-cta .btn--nav{display:none;}
  .hamburger{display:block;}
  .nav{position:fixed;inset:0;background:var(--bg);background-image:radial-gradient(90% 60% at 80% 0%,rgba(139,47,255,0.25),transparent 60%);flex-direction:column;justify-content:center;gap:0;transform:translateX(100%);transition:transform .4s var(--ease);z-index:1;padding:2rem;}
  body.menu-open .nav{transform:translateX(0);}
  .nav-links{flex-direction:column;gap:0.5rem;width:100%;}
  .nav-links a{color:#fff!important;font-size:1.4rem;font-weight:700;padding:0.6rem 0;}
  .nav-links a::after{display:none;}
  /* Mobile dropdown */
  .has-dropdown{width:100%;text-align:center;}
  .nav-parent{justify-content:center;width:100%;}
  .nav-dropdown{position:static;transform:none;opacity:1;visibility:visible;pointer-events:auto;background:transparent;border:none;box-shadow:none;padding:0;min-width:0;max-height:0;overflow:hidden;transition:max-height .3s var(--ease);gap:0;}
  .has-dropdown.open > .nav-dropdown{max-height:500px;padding:0.25rem 0 0.5rem;}
  .nav-dropdown a{font-size:1.05rem!important;font-weight:600;padding:0.5rem 0;color:rgba(255,255,255,0.85)!important;}
  .nav-cta{flex-direction:column;width:100%;margin-top:1.5rem;}
  .nav-cta .btn{width:100%;justify-content:center;display:inline-flex;}
  body.menu-open{overflow:hidden;}
  .plans,.pains,.compare,.cycle,.form__row,.threats{--cols:1;}
  .cyber-pillars,.why-values{--cols:2;}
  .why-services{--cols:2;}
  .cta-band__actions{flex-direction:column;align-items:stretch;}
}
@media (max-width:520px){
  .pillars,.services-grid,.steps,.approach,.cyber-pillars,.why-services,.why-values{--cols:1;}
  .footer-grid{--cols:1;}
  .hero__ticks{gap:0.5rem 1rem;}
  .brand-chip{min-width:220px;height:150px;padding:0 2rem;}
  .brand-chip img{max-height:104px;max-width:200px;}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:0.001ms!important;animation-iteration-count:1!important;transition-duration:0.001ms!important;scroll-behavior:auto!important;}
  [data-reveal]{opacity:1;transform:none;}
  /* keep a static gradient ring, hide the moving comet */
  .glow-border::before{opacity:0.5!important;}
  .glow-border::after{display:none;}
}

/* =========================================================
   Flexbox layout engine
   Replaces the former CSS grid layouts. Each layout parent sets
   --cols and --gapx; children derive their flex-basis from those,
   so a responsive change is a single --cols override.
   ========================================================= */
.pillars > *,.services-grid > *,.steps > *,.approach > *,.threats > *,.why-values > *,.cyber-pillars > *,.why-services > *,.cost__grid > *,.split > *,.compare > *,.plans > *,.pains > *,.cycle > *,.form__row > *,.statusgrid > *,.hero__grid > *{flex:1 1 calc((100% - (var(--cols,1) - 1) * var(--gapx,0px)) / var(--cols,1));min-width:0;}
/* uneven ratio rows */
.page-hero__grid > *,.contact-grid > *,.footer-grid > *,.statusrow > *{min-width:0;}
/* .contact-grid and .footer-grid column widths live on the Elementor containers,
   so no flex-basis is declared for them here. */
.page-hero__grid > *:nth-child(1){flex:1 1 calc((100% - var(--gapx)) * 0.55);}
.page-hero__grid > *:nth-child(2){flex:1 1 calc((100% - var(--gapx)) * 0.45);}
.statusrow > *:nth-child(1){flex:1 1 auto;}
.statusrow > *:nth-child(2){flex:0 0 auto;}
@media (max-width:1024px){
  .page-hero__grid > *:nth-child(1),.page-hero__grid > *:nth-child(2){flex-basis:100%;}
}