/* =====================================================================================================
   EdumaGix — light premium colour theme (2026-10-27)
   Loaded after site.css when Settings → Brand → "Light premium colour theme" is on. Colours only:
   no layout, content, images or behaviour change here. Switch it off and the site is exactly as before.
   Purple stays the brand accent (buttons, selected states, final banner); large areas become
   white / off-white / soft lavender, with deep navy for the dark section and the footer.
   Rules start with "html " so they win over site.css without !important.
   ===================================================================================================== */
/* 2026-10-28 client feedback: balanced palette — white / light grey / subtle lavender / navy, purple only as
   the highlight (#6254E8, with #4263EB as the second accent). */
:root{
  --brand:#6254E8;--brand-2:#4263EB;--brand-3:#6A5CFF;--sky:#7AA5FF;
  --navy:#172B4D;--navy-2:#1F3762;--navy-3:#2B4675;
  --soft:#F7F8FC;--lav:#F0EDFF;--lav-2:#E3DEFF;--lav-3:#ECEEFB;
  --ink:#17233B;--text:#526079;--muted:#6B7690;--line:#E4E8F1;
  --grad:linear-gradient(135deg,#6254E8 0%,#4263EB 100%);
  --grad-text:linear-gradient(90deg,#6254E8,#4263EB);
  --sh:0 1px 2px rgba(23,43,77,.04),0 8px 24px rgba(23,43,77,.06);
  --sh-lg:0 22px 44px -26px rgba(23,43,77,.32);
}
/* the banner slider keeps its previous gradient, so its Play Video button looks exactly as before */
html .hero-slider{--grad:linear-gradient(135deg,#563CF5 0%,#6B55FF 55%,#7C9DFF 100%)}
html .btn-brand{background:var(--brand);box-shadow:0 8px 18px -12px rgba(98,84,232,.7)}
html .btn-brand:hover{background:#5446D6;box-shadow:0 12px 22px -12px rgba(98,84,232,.75)}

/* ---------------------------------------------------------------- banner (every page) */
html .hero{background:#F8F9FE;color:var(--ink)}
html .hero::before{background:
  radial-gradient(640px 420px at 88% 8%,rgba(86,60,245,.11),transparent 62%),
  radial-gradient(560px 400px at 4% 96%,rgba(122,165,255,.16),transparent 62%),
  radial-gradient(480px 320px at 55% 112%,rgba(226,220,255,.7),transparent 62%)}
html .hero::after{opacity:.6;background-image:linear-gradient(rgba(21,43,82,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(21,43,82,.035) 1px,transparent 1px)}
html .hero h1,html .hero-slider h1,html .hero-slider .h1{color:var(--ink)}
html .hero .hl{background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent}
html .hero .lead,html .hero-home .lead,html .hero-inner .lead,html .hero-slider .lead{color:var(--text)}
html .hero-points{color:var(--text)}
html .hero-points i{color:var(--brand)}
html .pill-tag{background:#fff;border-color:var(--line);color:var(--ink);box-shadow:0 6px 18px -12px rgba(21,43,82,.3)}
html .pill-tag b{background:var(--grad);color:#fff}
html .hero .crumbs{color:var(--muted)}
html .hero .crumbs a:hover{color:var(--brand)}
/* banner buttons: the main one purple, the second one white with a purple outline */
html .hero .btn-white{background:var(--brand);color:#fff;box-shadow:0 12px 24px -12px rgba(86,60,245,.6)}
html .hero .btn-white:hover{background:#4A30E6}
html .hero .btn-ghost{background:#fff;color:var(--brand);border-color:var(--lav-2);backdrop-filter:none}
html .hero .btn-ghost:hover{background:var(--lav);border-color:var(--brand)}
html .hero-art .frame{background:#fff;border-color:var(--line);box-shadow:0 34px 70px -34px rgba(21,43,82,.35)}
html .svc-hero .ibig{border:1px solid var(--line);box-shadow:0 12px 26px -14px rgba(86,60,245,.45)}
/* slider controls and Play Video */
html .sl-arrow{background:#fff;border-color:var(--line);color:var(--brand)}
html .sl-arrow:hover{background:var(--brand);color:#fff}
html .sl-dots button{background:var(--lav-2)}
html .sl-dots button.on{background:var(--brand)}
html .play{color:var(--ink)}
html .play-ic{background:var(--grad);color:#fff;box-shadow:0 10px 24px -10px rgba(86,60,245,.6)}
html .play-ic::before,html .play-ic::after{border-color:rgba(86,60,245,.35)}

/* ---------------------------------------------------------------- icon boxes: soft lavender, purple on hover */
html .ibox{background:var(--lav);color:var(--brand);box-shadow:none}
html .card:hover .ibox,html .svc-card:hover .ibox,html a.hub-card:hover .ibox,html .mini-svc:hover .ibox{background:var(--grad);color:#fff}
html .t-dark .ibox{background:rgba(255,255,255,.1);color:#fff}
html .tile-ic{background:var(--lav)}
html .card,html .svc-card,html .tile,html .fact,html .step,html .pain-sm,html .hub-card{border-color:var(--line)}

/* ---------------------------------------------------------------- App Ecosystem: light lavender instead of the purple picture */
html .apps-sec.has-bg,html .apps-sec.t-brand{
  background:radial-gradient(720px 440px at 12% 8%,rgba(86,60,245,.10),transparent 62%),
             radial-gradient(660px 420px at 92% 92%,rgba(122,165,255,.16),transparent 62%),#F4F2FF;
  color:var(--text)}
html .apps-sec.t-brand::before{display:none}
html .apps-sec.has-bg h2,html .apps-sec.has-bg h3,html .apps-sec.t-brand h2,html .apps-sec.t-brand h3{color:var(--ink)}
html .apps-sec.has-bg .hl,html .apps-sec.t-brand .hl{background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent}
html .apps-sec.has-bg .sec-head p,html .apps-sec.t-brand .sec-head p{color:var(--text)}
html .apps-sec.has-bg .sec-tag,html .apps-sec.t-brand .sec-tag{background:#fff;border:1px solid var(--lav-2);color:var(--brand);backdrop-filter:none}
html .apps-sec.has-bg .sec-tag::before,html .apps-sec.t-brand .sec-tag::before{background:var(--brand)}
html .apps-tile{background:rgba(255,255,255,.75);border-color:var(--lav-2);color:var(--brand);box-shadow:0 16px 30px -18px rgba(86,60,245,.4);opacity:.85}
/* tabs */
html .apps-sec.has-bg .apps-tabs,html .apps-sec.t-brand .apps-tabs{background:#fff;border-color:var(--line);backdrop-filter:none;box-shadow:0 10px 26px -18px rgba(21,43,82,.3)}
html .apps-sec.has-bg .apps-tabs button,html .apps-sec.t-brand .apps-tabs button{color:var(--text)}
html .apps-sec.has-bg .apps-tabs button:hover,html .apps-sec.t-brand .apps-tabs button:hover{color:var(--brand)}
html .apps-sec.has-bg .apps-tabs button[aria-selected=true],html .apps-sec.t-brand .apps-tabs button[aria-selected=true]{background:var(--grad);color:#fff;box-shadow:0 10px 20px -10px rgba(86,60,245,.6)}
/* feature cards */
html .apps-sec.has-bg .feat-list button,html .apps-sec.t-brand .feat-list button{background:#fff;border:1px solid var(--line);color:var(--ink);backdrop-filter:none;box-shadow:0 6px 16px -14px rgba(21,43,82,.4)}
html .apps-sec.has-bg .feat-list button:hover,html .apps-sec.t-brand .feat-list button:hover{border-color:var(--lav-2)}
html .apps-sec.has-bg .fl-ck,html .apps-sec.t-brand .fl-ck{border:0;background:var(--lav);color:var(--brand)}
html .apps-sec .fl-go{color:var(--muted)}
html .apps-sec.has-bg .feat-list button.on,html .apps-sec.t-brand .feat-list button.on{background:#fff;color:var(--brand);border:1.5px solid var(--brand);box-shadow:0 0 0 4px rgba(86,60,245,.10),0 16px 30px -18px rgba(86,60,245,.55)}
html .apps-sec.has-bg .feat-list button.on .fl-ck,html .apps-sec.t-brand .feat-list button.on .fl-ck{background:var(--grad);color:#fff;box-shadow:0 6px 14px -6px rgba(86,60,245,.6)}
html .phone-ring{border-color:rgba(86,60,245,.22);box-shadow:0 0 90px 10px rgba(122,165,255,.16)}
html .apps-sec .phone .cap{border:1px solid var(--line);box-shadow:0 12px 24px -16px rgba(21,43,82,.4)}

/* ---------------------------------------------------------------- dark sections & navy cards */
html .tl-sec.t-dark{background:radial-gradient(900px 420px at 12% 0%,rgba(86,60,245,.28),transparent 62%),radial-gradient(760px 380px at 100% 100%,rgba(122,165,255,.18),transparent 60%),var(--navy)}
html .fact-big{background:linear-gradient(150deg,var(--navy) 0%,var(--navy-2) 100%);box-shadow:0 26px 50px -28px rgba(21,43,82,.6)}
html .fact-big::before{background:radial-gradient(circle,rgba(107,85,255,.45),transparent 70%)}
html .fact-big::after{background:var(--grad-warm)}

/* ---------------------------------------------------------------- softer decorations */
html .cta-box::after{background:rgba(122,165,255,.28)}
html .blk.t-brand::before{background:radial-gradient(520px 380px at 90% 0%,rgba(255,255,255,.14),transparent 60%),radial-gradient(480px 360px at 0% 100%,rgba(122,165,255,.22),transparent 60%)}
html .site-footer::before{background:radial-gradient(circle,rgba(107,85,255,.18),transparent 65%)}
html .site-header.scrolled{box-shadow:0 6px 22px -16px rgba(21,43,82,.3)}

/* ================================================================ client feedback (2026-10-28): less purple, fewer glows */
/* header: white, navy links, purple only on hover / current page */
html .site-header{background:rgba(255,255,255,.94)}
html .menu>li>a,html .menu>li>button,html .nav-cta .login{color:var(--navy)}
html .menu>li>a:hover,html .menu>li>button:hover,html .menu>li.open>button,html .menu>li>a.active{color:var(--brand);background:var(--lav)}
/* banner: light neutral with only a hint of lavender / blue */
html .hero{background:#F9FAFD}
html .hero::before{background:
  radial-gradient(620px 400px at 88% 8%,rgba(98,84,232,.07),transparent 62%),
  radial-gradient(560px 400px at 4% 96%,rgba(66,99,235,.06),transparent 62%)}
html .hero::after{opacity:.45}
/* sections: white and a very light lavender-grey, alternating */
html .blk.t-soft{background:#F7F7FD}
/* selected tabs, icon boxes, small badges: solid accent instead of a glowing gradient */
html .tabbar button[aria-selected=true]{background:var(--brand);box-shadow:0 6px 14px -10px rgba(98,84,232,.8)}
html .apps-sec.has-bg .apps-tabs button[aria-selected=true],html .apps-sec.t-brand .apps-tabs button[aria-selected=true]{background:var(--brand);box-shadow:0 6px 14px -10px rgba(98,84,232,.8)}
html .card:hover .ibox,html .svc-card:hover .ibox,html a.hub-card:hover .ibox,html .mini-svc:hover .ibox{background:var(--brand)}
html .pain-big .pain-ic{background:var(--brand);box-shadow:none}
html .post-cat{background:var(--brand)}
/* service cards: white, soft border, quiet shadow */
html .svc-card,html .card{box-shadow:0 1px 2px rgba(23,43,77,.03)}
html .svc-card:hover,html .card:hover,html .post-card:hover{box-shadow:var(--sh-lg);border-color:var(--lav-2)}
/* The Big Picture: navy centre without the purple glow, readable labels */
html .hub-center{box-shadow:0 0 0 12px #fff,0 0 0 22px var(--lav-2),0 24px 48px -24px rgba(23,43,77,.5)}
html .t-soft .hub-center{box-shadow:0 0 0 12px #F7F7FD,0 0 0 22px var(--lav-2),0 24px 48px -24px rgba(23,43,77,.5)}
html .hub-center::before{background:radial-gradient(circle at 50% 15%,rgba(98,84,232,.4),transparent 70%)}
html .hub-core::before{background:radial-gradient(120% 90% at 50% 0%,rgba(98,84,232,.35),transparent 65%)}
html .hub-lines line{stroke:#AEB8D6;opacity:.8}
html .hub-dot{border-color:var(--line);box-shadow:0 10px 22px -16px rgba(23,43,77,.5)}
html a.hub-node:hover .hub-dot{background:var(--brand);box-shadow:0 12px 24px -14px rgba(98,84,232,.7)}
html .hub-node b{color:var(--ink)}
/* App Ecosystem: light lavender, white cards, purple only on the selected one */
html .apps-sec.has-bg,html .apps-sec.t-brand{background:#F5F4FE}
html .apps-tile{box-shadow:0 12px 24px -18px rgba(23,43,77,.35)}
html .apps-sec.has-bg .feat-list button.on,html .apps-sec.t-brand .feat-list button.on{border-color:var(--brand);box-shadow:0 0 0 3px rgba(98,84,232,.1),0 12px 24px -18px rgba(23,43,77,.4)}
html .apps-sec.has-bg .feat-list button.on .fl-ck,html .apps-sec.t-brand .feat-list button.on .fl-ck{background:var(--brand);box-shadow:none}
html .phone-ring{border-color:rgba(98,84,232,.18);box-shadow:none}
/* dark day timeline: navy with only a faint accent */
html .tl-sec.t-dark{background:radial-gradient(900px 420px at 12% 0%,rgba(98,84,232,.14),transparent 62%),var(--navy)}
/* package table: neutral rows, clear text */
html .cmp tbody th{color:var(--ink)}
html .cmp tbody tr:nth-child(even) th,html .cmp tbody tr:nth-child(even) td{background:#FAFBFD}
html .cmp td.hot{background:#F5F3FF!important}
html .cmp-yes{background:var(--brand);box-shadow:none}
/* final call-to-action: a restrained purple-blue, no glow circles */
html .cta-box{background:linear-gradient(135deg,#5A4CDF 0%,#4263EB 100%)}
html .cta-box::before{background:rgba(255,255,255,.07)}
html .cta-box::after{background:rgba(255,255,255,.05)}
html .blk.t-brand:not(.apps-sec){background:linear-gradient(135deg,#5A4CDF 0%,#4263EB 100%)}
/* footer: deep navy, no purple glow */
html .site-footer{background:var(--navy)}
html .site-footer::before{background:radial-gradient(circle,rgba(98,84,232,.1),transparent 65%)}