/* =========================================================
BIZNEXA — minimal, product-led (v12)
Light UI · official palette · Urbanist
========================================================= */
:root{
--gold:#DEA35E; --gold-d:#C6893F;
--emerald:#24846C; --emerald-2:#1C6D59; --emerald-ink:#0C1E1C;
--ink:#11211C; /* headings */
--ink-soft:#586761; /* body */
--paper:#EDF4EE; /* page — light green */
--block:#E3EDE5; /* soft rounded section blocks — light green */
--card:#FFFFFF;
--line:rgba(17,33,28,.10);
--grey:#5D5C66;
--display:"Urbanist",system-ui,sans-serif;
--sans:"Inter",system-ui,sans-serif;
--pad:clamp(1.15rem,5vw,5.5rem);
--maxw:1240px;
--r:34px; --r-md:22px; --r-sm:14px;
--ease:cubic-bezier(.22,1,.36,1);
--shadow-card:0 22px 48px -34px rgba(12,30,28,.38);
--shadow-lift:0 30px 60px -32px rgba(12,30,28,.52);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--paper);color:var(--ink);line-height:1.6;overflow-x:hidden}
img,svg,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
::selection{background:var(--emerald);color:#fff}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
/* ---------- type ---------- */
h1,h2,h3,h4{font-family:var(--display);font-weight:600;line-height:1.05;letter-spacing:-.02em;color:var(--ink)}
.display{font-size:clamp(2.5rem,6vw,4.7rem)}
.h2{font-size:clamp(2rem,4.4vw,3.3rem)}
.h3{font-size:clamp(1.3rem,2.2vw,1.7rem);letter-spacing:-.01em}
.lead{font-size:clamp(1.05rem,1.5vw,1.28rem);color:var(--ink-soft);font-weight:400;line-height:1.55}
.eyebrow{font:600 .78rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--emerald)}
em{font-style:normal;color:var(--gold)}
.muted{color:var(--ink-soft)}
/* ---------- tag / pill ---------- */
.tag{display:inline-flex;align-items:center;gap:.5em;font:600 .82rem/1 var(--sans);
color:var(--emerald);background:rgba(36,132,108,.1);padding:.5em .85em;border-radius:100px}
.tag .spark{color:var(--gold)}
/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;
font:600 .92rem/1 var(--sans);padding:.95em 1.5em;border-radius:100px;
transition:transform .5s var(--ease),background .3s,color .3s,border-color .3s,box-shadow .3s;white-space:nowrap}
.btn svg{width:1.05em;height:1.05em}
.btn--gold{background:linear-gradient(120deg,#0C1E1C 0%,#2E9A7C 100%);color:#fff;box-shadow:0 12px 26px -12px rgba(36,132,108,.55)}
.btn--gold:hover{background:linear-gradient(120deg,#123a2e 0%,#39ae90 100%)}
.btn--dark{background:linear-gradient(120deg,#0C1E1C 0%,#2E9A7C 100%);color:#fff;box-shadow:0 12px 26px -12px rgba(36,132,108,.5)}
.btn--dark:hover{background:linear-gradient(120deg,#123a2e 0%,#39ae90 100%)}
/* on the emerald CTA panels, use a light button for contrast */
.cta__panel .btn--gold{background:var(--paper);color:var(--emerald-ink);box-shadow:0 14px 32px -14px rgba(0,0,0,.45)}
.cta__panel .btn--gold:hover{background:#fff}
.btn--emerald{background:var(--emerald);color:#fff}
.btn--emerald:hover{background:var(--emerald-2)}
.btn--ghost{border:1px solid var(--line);color:var(--ink);background:var(--card)}
.btn--ghost:hover{border-color:var(--ink);}
.btn--ghost-light{border:1px solid rgba(255,255,255,.35);color:#fff}
.btn--ghost-light:hover{background:rgba(255,255,255,.12)}
.btn--lg{padding:1.1em 1.9em;font-size:1rem}
/* ---------- layout ---------- */
.wrap{max-width:var(--maxw);margin:0 auto}
.sec{padding:clamp(3rem,7vw,6rem) var(--pad)}
.center{text-align:center}
.center .lead{max-width:44rem;margin-inline:auto}
/* =========================================================
NAV
========================================================= */
.nav{position:fixed;top:0;left:0;width:100%;z-index:900;display:flex;align-items:center;justify-content:space-between;
padding:1.1rem var(--pad);transition:background .4s,box-shadow .4s,padding .4s}
.nav.scrolled{background:rgba(237,244,238,.88);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line);padding:.7rem var(--pad)}
.nav__brand img{height:26px;width:auto}
.nav__links{display:flex;gap:2rem}
.nav__links a{font:500 .9rem/1 var(--sans);color:var(--ink);opacity:.75;transition:opacity .3s;position:relative}
.nav__links a:hover,.nav__links a.is-active{opacity:1}
.nav__links a.is-active{color:var(--emerald)}
.nav__right{display:flex;align-items:center;gap:.8rem}
.nav__burger{display:none;width:34px;height:34px;flex-direction:column;gap:6px;align-items:center;justify-content:center}
.nav__burger span{width:22px;height:2px;background:var(--ink);border-radius:2px;transition:transform .4s var(--ease),opacity .3s}
.nav__burger[aria-expanded="true"] span{background:#fff} /* white X over the dark menu */
.nav__burger[aria-expanded="true"] span:first-child{transform:translateY(4px) rotate(45deg)}
.nav__burger[aria-expanded="true"] span:last-child{transform:translateY(-4px) rotate(-45deg)}
.menu{position:fixed;inset:0;z-index:890;background:var(--emerald-ink);display:flex;flex-direction:column;justify-content:flex-start;overflow-y:auto;overflow-x:hidden;
padding:calc(5.2rem + env(safe-area-inset-top)) 1.4rem calc(1.6rem + env(safe-area-inset-bottom));clip-path:circle(0 at 100% 0);transition:clip-path .7s var(--ease)}
.menu.open{clip-path:circle(160% at 100% 0)}
/* =========================================================
HERO
========================================================= */
.hero{padding:9rem var(--pad) clamp(2.5rem,5vw,4rem);position:relative;overflow:hidden}
.hero__grid{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1.03fr .97fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.hero__left .tag{margin-bottom:1.4rem}
.hero h1{color:var(--ink)}
.hero h1 em{color:var(--gold)}
.hero__lead{color:var(--ink-soft);font-size:clamp(1.05rem,1.35vw,1.25rem);margin-top:1.35rem;max-width:34rem}
.hero__cta{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:2rem}
.hero__proof{display:flex;align-items:center;gap:.7rem;margin-top:1.7rem;font-size:.92rem;color:var(--ink-soft)}
.hero__proof .stars{color:var(--gold);letter-spacing:.08em}
.hero__proof b{color:var(--ink);font-weight:600}
.hero__visual{position:relative;perspective:1100px}
.herophoto{will-change:transform}
.hero__visual::before{content:"";position:absolute;inset:-14% -10%;z-index:0;
background:radial-gradient(closest-side,rgba(36,132,108,.22),transparent 72%);filter:blur(8px)}
.hero__visual .mock{position:relative;z-index:1;box-shadow:0 50px 110px -55px rgba(12,30,28,.6)}
/* trust strip */
.trust{padding:clamp(2.5rem,5vw,4rem) var(--pad) 1rem;text-align:center}
.trust__label{font:600 .78rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);opacity:.7}
.trust__row{display:flex;flex-wrap:wrap;gap:1rem 2.6rem;justify-content:center;align-items:center;margin-top:1.4rem}
.trust__row span{font-family:var(--display);font-weight:600;font-size:clamp(1.1rem,2vw,1.5rem);color:var(--ink);opacity:.35;letter-spacing:.02em}
/* =========================================================
SECTION INTRO
========================================================= */
.intro .tag{margin-bottom:1.1rem}
.intro h2{max-width:20ch;margin:0 auto}
.intro .lead{margin-top:1.1rem}
/* =========================================================
FEATURE ROWS
========================================================= */
.feat{max-width:var(--maxw);margin:0 auto;background:var(--block);border-radius:var(--r);
display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:center;
padding:clamp(2rem,4.5vw,4rem);margin-bottom:1.5rem;overflow:hidden}
.feat--rev .feat__text{order:2}
.feat__text h3{font-size:clamp(1.9rem,3.4vw,2.7rem);margin:.9rem 0 1rem}
.feat__text .lead{font-size:1.06rem}
.flist{list-style:none;display:flex;flex-direction:column;gap:.7rem;margin:1.5rem 0 1.8rem}
.flist li{display:flex;align-items:center;gap:.7em;font-weight:500;color:var(--ink)}
.flist li::before{content:"↗";color:var(--emerald);font-weight:700;font-size:.95em}
.feat__visual{display:flex;align-items:center;justify-content:center}
/* ---------- product mockups ---------- */
.mock{width:100%;border-radius:var(--r-md);padding:clamp(1.3rem,2.4vw,2rem);color:#fff;
background:radial-gradient(130% 130% at 85% 0%,var(--emerald) 0%,#123f34 55%,var(--emerald-ink) 100%);
box-shadow:0 40px 80px -50px rgba(12,30,28,.6);position:relative;overflow:hidden}
.mock::before{content:"";position:absolute;inset:0;background-image:url("../assets/pattern.svg");background-size:150px 108px;opacity:.35;pointer-events:none}
.mockcard{position:relative;z-index:2;background:#fff;color:var(--ink);border-radius:var(--r-sm);padding:1.2rem 1.3rem;box-shadow:0 20px 40px -28px rgba(0,0,0,.35)}
.mockcard+.mockcard{margin-top:.9rem}
.mrow{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem 0;border-bottom:1px solid var(--line);font-size:.95rem}
.mrow:last-child{border-bottom:0}
.mrow b{font-weight:600}
.pill{font:600 .74rem/1 var(--sans);padding:.42em .7em;border-radius:100px;display:inline-flex;align-items:center;gap:.4em;white-space:nowrap}
.pill--ok{background:rgba(36,132,108,.12);color:var(--emerald)}
.pill--wait{background:rgba(222,163,94,.16);color:var(--gold-d)}
.pill--dot::before{content:"";width:.5em;height:.5em;border-radius:50%;background:currentColor}
.mockcard h4{font-size:1rem;margin-bottom:.2rem}
.mocksub{font-size:.82rem;color:var(--ink-soft);margin-bottom:.9rem}
.bar{height:8px;border-radius:100px;background:rgba(17,33,28,.08);overflow:hidden;flex:1}
.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--emerald),var(--gold));border-radius:100px}
.barrow{display:flex;align-items:center;gap:.8rem;padding:.55rem 0}
.barrow span{width:5.5rem;font-size:.9rem;font-weight:500}
.barrow b{width:6rem;text-align:right;font-size:.92rem}
.flow{margin-top:.5rem;display:flex;flex-direction:column;gap:.6rem}
.flowstep{display:flex;align-items:center;gap:.6rem;font-size:.86rem;color:var(--ink-soft)}
.flowstep .dot{width:1.15rem;height:1.15rem;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;font-size:.7rem;color:#fff;background:var(--emerald)}
.flowstep .dot.wait{background:var(--gold)}
.flowstep .dot.idle{background:rgba(17,33,28,.18)}
/* =========================================================
STATS
========================================================= */
.stats{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;text-align:center}
.stat__num{font-family:var(--display);font-weight:600;font-size:clamp(2.4rem,4.5vw,3.6rem);color:var(--emerald);letter-spacing:-.02em;line-height:1}
.stat__label{margin-top:.5rem;font-size:.9rem;color:var(--ink-soft)}
/* =========================================================
TESTIMONIALS
========================================================= */
.quotes{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem}
.qcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:1.8rem;display:flex;flex-direction:column;gap:1.2rem;box-shadow:var(--shadow-card);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.qcard:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift)}
.qcard .stars{color:var(--gold);letter-spacing:.15em;font-size:.9rem}
.qcard blockquote{font-family:var(--display);font-weight:500;font-size:1.12rem;line-height:1.4;letter-spacing:-.01em}
.qcard figcaption{font-size:.82rem;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.05em;margin-top:auto}
.qcard figcaption b{color:var(--ink);font-weight:600}
/* =========================================================
ROWS (free zones / values / process)
========================================================= */
.rows{max-width:var(--maxw);margin:2.5rem auto 0;border-top:1px solid var(--line)}
.row{display:grid;grid-template-columns:2.5rem 1fr 1.6fr;gap:1.5rem;align-items:center;padding:1.5rem .3rem;border-bottom:1px solid var(--line);transition:background .3s}
.row:hover{background:var(--block)}
.row__no{font-family:var(--display);font-weight:600;color:var(--gold)}
.row__t{font-family:var(--display);font-weight:600;font-size:clamp(1.15rem,2vw,1.5rem)}
.row__d{color:var(--ink-soft);font-size:.98rem}
/* process steps */
.steps{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1.3rem}
.step{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:1.8rem;box-shadow:var(--shadow-card);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.step:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift)}
.step__no{font-family:var(--display);font-weight:600;color:var(--gold);font-size:1.2rem}
.step h3{font-size:1.25rem;margin:.7rem 0 .5rem}
.step p{color:var(--ink-soft);font-size:.95rem}
/* =========================================================
PRICING
========================================================= */
.price{max-width:44rem;margin:0 auto;background:var(--card);border:1px solid var(--line);border-radius:var(--r);
padding:clamp(2.2rem,5vw,3.6rem);text-align:center;box-shadow:0 40px 80px -60px rgba(12,30,28,.4)}
.price .tag{margin-bottom:1rem}
.price__amt{font-family:var(--display);font-weight:600;font-size:clamp(3.2rem,9vw,5.2rem);color:var(--ink);letter-spacing:-.03em;line-height:1;margin:.6rem 0}
.price__amt small{font-size:.32em;color:var(--emerald);vertical-align:super;font-weight:600;letter-spacing:0}
.price__note{color:var(--ink-soft);max-width:32rem;margin:.5rem auto 1.6rem}
/* =========================================================
CONTACT
========================================================= */
.contact{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem)}
.contact__title{font-size:clamp(2rem,4.4vw,3.3rem)}
.cdetails{margin-top:2.4rem;display:grid;grid-template-columns:1fr 1fr;gap:1.6rem}
.cdetail{display:flex;flex-direction:column;gap:.35rem}
.cdetail__k{font:600 .72rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--emerald)}
.cdetail__v{color:var(--ink);font-weight:500}
a.cdetail:hover .cdetail__v{color:var(--emerald)}
.form{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:clamp(1.35rem,2.6vw,2rem);display:flex;flex-direction:column;gap:.8rem;box-shadow:0 40px 80px -60px rgba(12,30,28,.35)}
.field{position:relative}
.field input,.field select,.field textarea{width:100%;background:var(--paper);border:1px solid var(--line);border-radius:12px;
padding:1.5rem .95rem .5rem;color:var(--ink);font:400 1rem/1.2 var(--sans);transition:border-color .25s,box-shadow .25s;
appearance:none;-webkit-appearance:none}
.field textarea{resize:vertical;min-height:106px}
.field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23586761' stroke-width='2'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;padding-right:2.4rem}
.field label{position:absolute;left:.98rem;top:50%;transform:translateY(-50%);color:var(--ink-soft);font-size:1rem;pointer-events:none;transition:.2s var(--ease);transform-origin:left}
.field textarea~label{top:1.15rem;transform:none}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--emerald);box-shadow:0 0 0 3px rgba(36,132,108,.13)}
.field input:focus~label,.field input:not(:placeholder-shown)~label,
.field select:focus~label,.field select:valid~label,
.field textarea:focus~label,.field textarea:not(:placeholder-shown)~label{top:.45rem;transform:translateY(0) scale(.72);transform-origin:left top;color:var(--emerald)}
.form-note{font-size:.78rem;color:var(--ink-soft);text-align:center;margin-top:.15rem}
.mapsec{max-width:var(--maxw);margin:1.5rem auto 0;border-radius:var(--r);overflow:hidden;border:1px solid var(--line)}
.mapsec iframe{display:block;width:100%;height:44vh;min-height:320px;border:0;filter:grayscale(.2)}
/* =========================================================
PAGE HERO (subpages)
========================================================= */
.phero{padding:8.5rem var(--pad) 0}
.phero__panel{max-width:var(--maxw);margin:0 auto;border-radius:var(--r);overflow:hidden;position:relative;
background:radial-gradient(120% 130% at 80% 0%,var(--emerald),#12463a 50%,var(--emerald-ink));color:#fff;
padding:clamp(3rem,6vw,5rem) clamp(1.5rem,5vw,4rem)}
.phero__panel::before{content:"";position:absolute;inset:0;background-image:url("../assets/pattern.svg");background-size:190px 138px;opacity:.45}
.phero__inner{position:relative;z-index:2;max-width:40rem}
.phero h1{color:#fff}.phero h1 em{color:var(--gold)}
.phero__lead{color:rgba(255,255,255,.82);margin-top:1.1rem}
/* =========================================================
CTA BAND
========================================================= */
.cta{padding:0 var(--pad) clamp(3rem,6vw,5rem)}
.cta__panel{max-width:var(--maxw);margin:0 auto;border-radius:var(--r);overflow:hidden;position:relative;text-align:center;color:#fff;
background:radial-gradient(120% 130% at 50% 0%,var(--emerald),#12463a 55%,var(--emerald-ink));padding:clamp(3rem,6vw,5.5rem) var(--pad)}
.cta__panel::before{content:"";position:absolute;inset:0;background-image:url("../assets/pattern.svg");background-size:190px 138px;opacity:.4}
.cta__panel>*{position:relative;z-index:2}
.cta__panel h2{color:#fff;max-width:18ch;margin:0 auto}
.cta__panel .lead{color:rgba(255,255,255,.82);margin:1rem auto 2rem;max-width:34rem}
/* =========================================================
FOOTER
========================================================= */
.footer{padding:clamp(3rem,6vw,4.5rem) var(--pad) 2rem}
.footer__top{max-width:var(--maxw);margin:0 auto;display:flex;align-items:flex-start;justify-content:space-between;gap:2rem;flex-wrap:wrap;padding-bottom:2.5rem;border-bottom:1px solid var(--line)}
.footer__logo{height:30px}
.footer__tag{color:var(--ink-soft);max-width:22rem;margin-top:.9rem;font-size:.95rem}
.footer__nav{display:flex;gap:1.6rem;flex-wrap:wrap}
.footer__nav a{font:500 .9rem/1 var(--sans);color:var(--ink-soft);transition:color .3s}
.footer__nav a:hover{color:var(--emerald)}
.social{display:flex;gap:.6rem;margin-top:1.3rem}
.social__a{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;
color:var(--ink-soft);transition:transform .3s var(--ease),border-color .3s,color .3s,background .3s}
.social__a:hover{border-color:var(--emerald);color:#fff;background:linear-gradient(120deg,#0C1E1C 0%,#2E9A7C 100%);transform:translateY(-2px)}
.social__a svg{width:17px;height:17px}
html[data-theme="dark"] .social__a:hover{background:linear-gradient(120deg,#1C6D59 0%,#3EC7A2 100%);color:#07130f}
.footer__bar{max-width:var(--maxw);margin:1.6rem auto 0;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.85rem;color:var(--ink-soft)}
.footer__bar a:hover{color:var(--emerald)}
/* floating whatsapp */
.wa{position:fixed;bottom:1.4rem;right:1.4rem;z-index:800;width:54px;height:54px;border-radius:50%;background:var(--emerald);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 14px 30px -10px rgba(36,132,108,.6);transition:transform .4s var(--ease),background .3s}
.wa svg{width:28px;height:28px}
.wa:hover{background:var(--emerald-2);transform:translateY(-2px)}
/* =========================================================
REVEAL
========================================================= */
[data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
[data-reveal].in{opacity:1;transform:none}
/* =========================================================
RESPONSIVE
========================================================= */
@media (max-width:900px){
.nav__links,.nav__right .btn{display:none}
.nav__burger{display:flex}
.hero{padding-top:7rem}
.hero__grid{grid-template-columns:1fr;gap:2.6rem}
.hero__visual{max-width:34rem}
.feat{grid-template-columns:1fr;gap:2rem}
.feat--rev .feat__text{order:0}
.feat__visual{order:2}
.stats{grid-template-columns:1fr 1fr;gap:2rem 1rem}
.quotes{grid-template-columns:1fr}
.steps{grid-template-columns:1fr 1fr}
.contact{grid-template-columns:1fr}
.cdetails{grid-template-columns:1fr 1fr}
.row{grid-template-columns:2rem 1fr;gap:.6rem 1rem}
.row__d{grid-column:2}
}
@media (max-width:520px){
.stats,.steps,.cdetails{grid-template-columns:1fr}
.hero__cta .btn{flex:1}
}
@media (prefers-reduced-motion:reduce){
*{animation:none!important;transition:none!important}
[data-reveal]{opacity:1!important;transform:none!important}
html{scroll-behavior:auto}
}
/* =========================================================
STACKED SCROLL CARDS (v13) — cards overlay as you scroll
========================================================= */
.stack{max-width:var(--maxw);margin:0 auto}
.stackcard{position:sticky;transform-origin:center top;border:1px solid var(--line);
box-shadow:0 34px 80px -46px rgba(12,30,28,.5);will-change:transform;margin-bottom:2.2rem}
.stackcard:nth-child(1){top:clamp(82px,11vh,112px)}
.stackcard:nth-child(2){top:clamp(98px,12vh,130px)}
.stackcard:nth-child(3){top:clamp(114px,13vh,148px)}
.stackcard:nth-child(4){top:clamp(130px,14vh,166px)}
.stackcard:last-child{margin-bottom:0}
@media (max-width:900px){
/* v37b — on mobile the feature cards are taller than the screen, so the sticky
overlay clipped the mock at the bottom. Fall back to clean full-height
stacking (each card still animates in via data-reveal). */
.stackcard{position:static;transform:none!important;margin-bottom:1.5rem;box-shadow:0 24px 50px -34px rgba(12,30,28,.35)}
}
/* =========================================================
BACKGROUND SPARKLES + STAR CURSOR (v16)
========================================================= */
.sparkles{position:fixed;top:0;left:0;right:0;bottom:-180px;z-index:-1;pointer-events:none;overflow:hidden;will-change:transform}
.spk{position:absolute;color:var(--gold);will-change:transform,opacity;animation:twinkle linear infinite}
.spk svg{width:100%;height:100%;fill:currentColor;display:block}
@keyframes twinkle{
0%{opacity:.08;transform:translateY(8px) rotate(0deg) scale(.85)}
50%{opacity:.42;transform:translateY(-10px) rotate(18deg) scale(1.12)}
100%{opacity:.08;transform:translateY(8px) rotate(0deg) scale(.85)}
}
/* star cursor (fine pointers only; JS hides the native cursor) */
.cursor{position:fixed;top:0;left:0;width:22px;height:22px;z-index:9999;pointer-events:none;
transform:translate(-50%,-50%);opacity:0;transition:opacity .3s,width .25s var(--ease),height .25s var(--ease);
filter:drop-shadow(0 2px 6px rgba(198,137,63,.5))}
.cursor svg{width:100%;height:100%;fill:var(--gold);display:block}
.cursor.on{opacity:1}
.cursor.hover{width:34px;height:34px}
@media (hover:none),(pointer:coarse){ .cursor{display:none!important} }
@media (prefers-reduced-motion:reduce){ .spk{animation:none;opacity:.2} }
/* =========================================================
INTRO LOGO ANIMATION (v17) — first load only (per session)
========================================================= */
.logointro{position:fixed;inset:0;z-index:9998;background:var(--paper);display:grid;place-items:center;
animation:introOut .85s var(--ease) 1.9s forwards}
.logointro__logo{position:relative;display:flex;flex-direction:column;align-items:center;gap:1.25rem}
.logointro__mark{width:clamp(60px,9vw,84px);height:auto;animation:introMark 1.05s var(--ease) both}
.logointro__spark{position:absolute;top:-8px;right:calc(50% - 46px);color:var(--emerald);font-size:1.15rem;opacity:0;
animation:introSpark .9s var(--ease) .5s both,twinkle 2.4s var(--ease) 1.2s infinite}
.logointro__logo::after{content:"";position:absolute;top:calc(50% - 30px);left:50%;transform:translate(-50%,-50%);
width:170px;height:170px;border-radius:50%;background:radial-gradient(closest-side,rgba(46,154,124,.3),transparent 70%);
opacity:0;animation:introGlow 1.7s var(--ease) both;pointer-events:none;z-index:-1}
.logointro__word{display:inline-flex;font-family:var(--display);font-weight:600;letter-spacing:.3em;padding-left:.3em;
text-transform:uppercase;font-size:clamp(1rem,1.6vw,1.3rem)}
/* gradient lives on each letter (background-clip:text fails on a flex container) */
.logointro__word span{display:inline-block;opacity:0;transform:translateY(16px);
background-image:linear-gradient(115deg,#0A1C19 0%,#2E9A7C 100%);
-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
animation:letterIn .55s var(--ease) forwards}
@supports not ((-webkit-background-clip:text) or (background-clip:text)){
.logointro__word span{-webkit-text-fill-color:currentColor;color:#1C6D59}
html[data-theme="dark"] .logointro__word span{color:#E4B072}
}
.logointro__word span:nth-child(1){animation-delay:.6s}
.logointro__word span:nth-child(2){animation-delay:.66s}
.logointro__word span:nth-child(3){animation-delay:.72s}
.logointro__word span:nth-child(4){animation-delay:.78s}
.logointro__word span:nth-child(5){animation-delay:.84s}
.logointro__word span:nth-child(6){animation-delay:.9s}
.logointro__word span:nth-child(7){animation-delay:.96s}
@keyframes introMark{0%{opacity:0;transform:scale(.35) rotate(-26deg)}45%{opacity:1;transform:scale(1.12) rotate(6deg)}
68%{transform:scale(.95) rotate(-3deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes introSpark{0%{opacity:0;transform:scale(0) rotate(-120deg)}60%{opacity:1;transform:scale(1.35) rotate(12deg)}100%{opacity:.95;transform:scale(1) rotate(0)}}
@keyframes introGlow{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}45%{opacity:1}100%{opacity:.55;transform:translate(-50%,-50%) scale(1.15)}}
@keyframes letterIn{to{opacity:1;transform:none}}
@keyframes introOut{to{opacity:0;transform:translateY(-3.5%) scale(1.03);visibility:hidden;pointer-events:none}}
@media (prefers-reduced-motion:reduce){ .logointro{display:none} }
/* =========================================================
DUBAI SHOWCASE (v24) — clean split: copy + single tall image
========================================================= */
.show{padding:clamp(3.5rem,8vw,7rem) var(--pad);overflow:hidden}
.show__grid{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1.02fr .98fr;
gap:clamp(2rem,5vw,4.5rem);align-items:center}
.show__text .tag{margin-bottom:1rem}
.show__text h2{margin-top:.4rem}
.show__text .lead{margin-top:1.1rem;max-width:34rem}
.show__stats{list-style:none;display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.8rem}
.show__stats li{font:600 .85rem/1 var(--sans);color:var(--ink);background:var(--card);border:1px solid var(--line);
padding:.62em 1em;border-radius:100px;display:inline-flex;align-items:center;gap:.5em;box-shadow:0 8px 20px -14px rgba(12,30,28,.4)}
.show__stats li::before{content:"";width:.5em;height:.5em;border-radius:50%;background:var(--emerald);flex:0 0 auto}
.show__stats li:nth-child(2)::before{background:var(--gold)}
.show__stage{perspective:1200px}
.show__deck{position:relative;transform-style:preserve-3d;transition:transform .4s var(--ease);will-change:transform}
.show__img{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:4/5;
box-shadow:0 55px 110px -55px rgba(12,30,28,.6)}
.show__img img{position:absolute;top:-8%;left:0;width:100%;height:116%;object-fit:cover;will-change:transform}
.show__img::after{content:"";position:absolute;inset:0;pointer-events:none;
background:linear-gradient(180deg,transparent 55%,rgba(12,30,28,.5) 100%)}
.show__badge{position:absolute;left:1.1rem;bottom:1.1rem;z-index:2;display:inline-flex;align-items:center;gap:.5em;
font:600 .82rem/1 var(--sans);color:#fff;transform:translateZ(45px)}
.show__badge::before{content:"";width:.5em;height:.5em;border-radius:50%;background:var(--gold)}
@media (max-width:860px){
.show__grid{grid-template-columns:1fr;gap:2.2rem}
.show__stage{order:2;max-width:440px;margin:0 auto;width:100%}
}
@media (prefers-reduced-motion:reduce){ .show__deck{transform:none!important} .show__img img{height:100%;top:0} }
/* =========================================================
DARK MODE (v25)
========================================================= */
.themebtn{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--card);
display:grid;place-items:center;color:var(--ink);flex:0 0 auto;transition:background .3s,border-color .3s,color .3s}
.themebtn:hover{border-color:var(--emerald);color:var(--emerald)}
.themebtn svg{width:18px;height:18px}
.themebtn .ic-sun{display:none}
html[data-theme="dark"] .themebtn .ic-moon{display:none}
html[data-theme="dark"] .themebtn .ic-sun{display:block}
/* the product mock is always a light UI island (works in both themes) */
.mock{--ink:#11211C;--ink-soft:#586761;--line:rgba(17,33,28,.1);--card:#fff}
html[data-theme="dark"]{
--paper:#0C1917; --block:#12211D; --card:#16271F;
--ink:#EDF1EC; --ink-soft:#9AA8A0; --line:rgba(237,241,236,.13);
--emerald:#34A488; --gold:#E4B072;
}
html[data-theme="dark"] body{background:var(--paper);color:var(--ink)}
html[data-theme="dark"] .nav.scrolled{background:rgba(12,25,23,.82);box-shadow:0 1px 0 var(--line)}
html[data-theme="dark"] .tag{background:rgba(52,164,136,.16)}
html[data-theme="dark"] .trust__row span{color:var(--ink);opacity:.4}
/* buttons — brighter gradient so they don't blend into the dark bg */
html[data-theme="dark"] .btn--gold,html[data-theme="dark"] .btn--dark{background:linear-gradient(120deg,#1C6D59 0%,#3EC7A2 100%);color:#07130f}
html[data-theme="dark"] .btn--gold:hover,html[data-theme="dark"] .btn--dark:hover{background:linear-gradient(120deg,#23856c 0%,#4bd9b3 100%)}
html[data-theme="dark"] .btn--ghost{background:var(--card);border-color:var(--line);color:var(--ink)}
html[data-theme="dark"] .btn--ghost:hover{border-color:var(--ink)}
/* CTA-panel button stays a fixed light chip (panel is emerald in both themes) */
html[data-theme="dark"] .cta__panel .btn--gold{background:#EFECE3;color:#0C1E1C}
/* dark map */
html[data-theme="dark"] .mapsec iframe{filter:grayscale(.35) invert(.9) hue-rotate(180deg) brightness(.85) contrast(.92)}
/* intro logo → gold in dark */
html[data-theme="dark"] .logointro__word span{background-image:linear-gradient(115deg,#C6893F 0%,#F0C88A 100%)}
html[data-theme="dark"] .logointro__spark{color:var(--gold)}
html[data-theme="dark"] .logointro__logo::after{background:radial-gradient(closest-side,rgba(228,176,114,.3),transparent 70%)}
/* =========================================================
v28 — SCROLL INTERACTIVITY + THEME TRANSITION
========================================================= */
/* scroll progress bar */
.progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:1200;transform:scaleX(0);
transform-origin:0 50%;background:linear-gradient(90deg,var(--emerald),var(--gold));
box-shadow:0 0 14px rgba(222,163,94,.45);pointer-events:none;will-change:transform}
/* trust logos — infinite marquee (speed reacts to scroll velocity) */
.marquee{margin-top:1.4rem;overflow:hidden;
-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);
mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.marquee__track{display:flex;gap:2.8rem;width:max-content;will-change:transform}
.marquee__track span{font-family:var(--display);font-weight:600;font-size:clamp(1.1rem,2vw,1.5rem);
color:var(--ink);opacity:.32;letter-spacing:.02em;white-space:nowrap}
html[data-theme="dark"] .marquee__track span{opacity:.44}
@media (prefers-reduced-motion:reduce){
.marquee{-webkit-mask-image:none;mask-image:none}
.marquee__track{flex-wrap:wrap;justify-content:center;width:auto;gap:1rem 2.6rem;transform:none!important}
}
/* unique theme change — circular ink-spread from the toggle button */
@media (prefers-reduced-motion:no-preference){
::view-transition-old(root){animation:none}
::view-transition-new(root){animation:bzx-reveal .62s var(--ease)}
@keyframes bzx-reveal{
from{clip-path:circle(0 at var(--bzx-x,100%) var(--bzx-y,0))}
to{clip-path:circle(var(--bzx-r,160%) at var(--bzx-x,100%) var(--bzx-y,0))}
}
}
.themebtn:active{transform:scale(.9)}
.themebtn svg{transition:transform .5s var(--ease)}
.themebtn:active svg{transform:rotate(45deg)}
/* =========================================================
v29 — BUSINESS IMAGERY (band + banner), palette-matched
========================================================= */
.bizband{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem}
.bizcard{position:relative;overflow:hidden;border-radius:var(--r-md);border:1px solid var(--line);
aspect-ratio:3/2;box-shadow:var(--shadow-card)}
.bizcard img{position:absolute;top:-9%;left:0;width:100%;height:118%;object-fit:cover;
transition:filter .5s var(--ease)}
/* gentle brand wash so varied photos read as one palette; lifts to true colour on hover */
.bizcard::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
background:none;transition:opacity .5s var(--ease)}
.bizcard::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
background:linear-gradient(180deg,rgba(12,30,28,0) 48%,rgba(12,30,28,.6) 100%)}
.bizcard:hover img{filter:saturate(1.06) contrast(1.04)} /* transform is owned by the scroll parallax */
.bizcard:hover::before{opacity:.28}
.bizcard__cap{position:absolute;left:1rem;right:1rem;bottom:.9rem;z-index:2;color:#fff;
font:600 .92rem/1.25 var(--sans);display:flex;align-items:center;gap:.5em;text-shadow:0 1px 12px rgba(0,0,0,.4)}
.bizcard__cap .spark{color:var(--gold)}
@media (max-width:760px){.bizband{grid-template-columns:1fr;gap:.9rem}.bizcard{aspect-ratio:16/10}}
/* wide cinematic banner (about page) */
.bizbanner{position:relative;overflow:hidden;border-radius:var(--r-md);border:1px solid var(--line);
max-width:var(--maxw);margin:2.2rem auto 0;aspect-ratio:3/1;box-shadow:0 30px 62px -48px rgba(12,30,28,.55)}
.bizbanner img{position:absolute;top:-9%;left:0;width:100%;height:118%;object-fit:cover;
transition:filter .6s var(--ease)}
.bizbanner:hover img{filter:saturate(1.02) contrast(1.03)}
.bizbanner::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
background:linear-gradient(115deg,rgba(12,30,28,.6) 0%,rgba(12,30,28,.1) 46%,rgba(12,30,28,0) 100%)}
.bizbanner__cap{position:absolute;left:clamp(1.1rem,3vw,2.4rem);bottom:clamp(1.1rem,3vw,2rem);z-index:2;color:#fff;max-width:30ch}
.bizbanner__cap b{font-family:var(--display);font-weight:600;font-size:clamp(1.2rem,2.6vw,1.9rem);display:block;letter-spacing:-.01em;margin-bottom:.3rem}
.bizbanner__cap span{font:500 .95rem/1.45 var(--sans);opacity:.92}
@media (max-width:600px){.bizbanner{aspect-ratio:4/3}}
/* =========================================================
v32 — HERO PORTRAIT (business person + floating proof card)
========================================================= */
.herophoto{position:relative;z-index:1;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);
aspect-ratio:4/5;box-shadow:0 50px 110px -55px rgba(12,30,28,.6)}
.herophoto img{position:absolute;top:-9%;left:0;width:100%;height:118%;object-fit:cover;object-position:50% 50%}
/* gentle brand wash + bottom scrim so the floating card stays legible */
.herophoto::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
background:linear-gradient(180deg,rgba(12,30,28,0) 62%,rgba(12,30,28,.32) 100%)}
/* floating frosted-glass status card — a light island in both themes */
.herochip__row{display:flex;align-items:center;justify-content:space-between;gap:.8rem;
padding:.52rem 0;border-bottom:1px solid var(--line);font-size:.9rem;color:var(--ink)}
.herochip__row b{font-weight:600}
/* floating glass rating pill (top-left) */
.heropill{position:absolute;z-index:3;top:clamp(.8rem,2vw,1.15rem);left:clamp(.8rem,2vw,1.15rem);
display:inline-flex;align-items:center;gap:.5em;border-radius:100px;padding:.5em .9em;
background:rgba(255,255,255,.16);backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);
border:1px solid rgba(255,255,255,.4);color:#fff;font:600 .8rem/1 var(--sans);
box-shadow:0 12px 30px -14px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.5);text-shadow:0 1px 6px rgba(0,0,0,.35)}
.heropill .stars{color:var(--gold);letter-spacing:.05em;font-size:.9em}
.heropill b{font-weight:700}
/* frosted-glass trust badge (top-right) */
.herobadge{position:absolute;z-index:3;top:clamp(.8rem,2vw,1.15rem);right:clamp(.8rem,2vw,1.15rem);
background:rgba(12,30,28,.4);backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);
border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:100px;padding:.46em .9em;
font:600 .8rem/1 var(--sans);display:inline-flex;align-items:center;gap:.45em;
box-shadow:0 12px 30px -14px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.28)}
.herobadge .spark{color:var(--gold)}
/* =========================================================
v35 — ABOUT HERO: future-of-Dubai backdrop
========================================================= */
body[data-page="about"] .phero__panel{
background:linear-gradient(110deg,rgba(9,20,18,.92) 0%,rgba(12,30,28,.72) 46%,rgba(28,109,89,.4) 100%),
url("../assets/dubai-future.jpg") center 30%/cover no-repeat}
body[data-page="about"] .phero__panel::before{opacity:.16}
/* =========================================================
v35 — UAE GROWTH (animated chart, home)
========================================================= */
.growth{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:.92fr 1.08fr;
gap:clamp(2rem,5vw,4rem);align-items:center}
.chartcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
padding:clamp(1.2rem,2.5vw,1.8rem);box-shadow:var(--shadow-card)}
.chartcard__head{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;
font-weight:600;color:var(--ink);font-size:.95rem}
.chartcard__pill{font:600 .74rem/1 var(--sans);color:var(--emerald);background:rgba(36,132,108,.12);
padding:.42em .7em;border-radius:100px;white-space:nowrap}
html[data-theme="dark"] .chartcard__pill{background:rgba(52,164,136,.18)}
.chart{width:100%;height:auto;display:block}
.chart__grid line{stroke:var(--line);stroke-width:1}
.chart__x text{fill:var(--ink-soft);font:500 12px var(--sans)}
.chart__dot{fill:var(--emerald);transform-box:fill-box;transform-origin:center}
.chart__dot--last{fill:var(--gold)}
.chart__pulse{fill:var(--gold);transform-box:fill-box;transform-origin:center;opacity:.5;animation:chartPulse 2.4s var(--ease) infinite}
@keyframes chartPulse{0%{transform:scale(1);opacity:.5}70%{transform:scale(3.2);opacity:0}100%{opacity:0}}
.chartcard__note{margin-top:.8rem;font-size:.74rem;color:var(--ink-soft);font-style:italic}
@media (max-width:820px){.growth{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.chart__pulse{animation:none}}
/* =========================================================
v36 — MOBILE ALIGNMENT FIXES
========================================================= */
/* =========================================================
v39 — ABOUT JOURNEY FLOW MAP (scroll-driven)
========================================================= */
.journey{position:relative;max-width:820px;margin:0 auto;padding:.5rem 0}
.journey__rail{position:absolute;top:10px;bottom:10px;left:50%;transform:translateX(-50%);
width:2px;background:var(--line);border-radius:2px;overflow:hidden}
.journey__fill{position:absolute;top:0;left:0;width:100%;height:0;
background:linear-gradient(180deg,var(--emerald),var(--gold))}
.jstep{position:relative;display:grid;grid-template-columns:1fr 1fr;margin:1.6rem 0}
.jstep__dot{position:absolute;left:50%;top:16px;transform:translateX(-50%);width:15px;height:15px;
border-radius:50%;background:var(--card);border:2px solid var(--line);z-index:2;transition:.45s var(--ease)}
.jstep.in .jstep__dot{border-color:var(--gold);background:var(--gold);box-shadow:0 0 0 6px rgba(222,163,94,.16)}
.jstep__card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm);
padding:1rem 1.2rem;box-shadow:var(--shadow-card);
opacity:.4;transform:translateY(16px);transition:opacity .55s var(--ease),transform .55s var(--ease)}
.jstep.in .jstep__card{opacity:1;transform:none}
.jstep--l .jstep__card{grid-column:1;margin-right:2.4rem;text-align:right}
.jstep--r .jstep__card{grid-column:2;margin-left:2.4rem}
.jstep__no{font:700 .8rem/1 var(--sans);color:var(--gold);letter-spacing:.06em}
.jstep__title{font-size:1.05rem;margin:.32rem 0 .35rem}
.jstep__card p{font-size:.9rem;color:var(--ink-soft);line-height:1.5;margin:0}
@media (max-width:640px){
.journey__rail{left:9px}
.jstep{grid-template-columns:1fr}
.jstep__dot{left:9px}
.jstep__card{grid-column:1!important;margin:0 0 0 34px!important;text-align:left!important}
}
@media (prefers-reduced-motion:reduce){.jstep__card{opacity:1;transform:none}}
/* =========================================================
v42 — SETUP COST CALCULATOR
========================================================= */
.calc{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1.05fr .95fr;
gap:clamp(1.4rem,3vw,2.4rem);align-items:start}
.calc__form{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
padding:clamp(1.2rem,2.6vw,1.9rem);display:flex;flex-direction:column;gap:1.3rem;
box-shadow:var(--shadow-card)}
.calc__field{display:flex;flex-direction:column;gap:.6rem}
.calc__field[hidden]{display:none}
.calc__label{font:600 .85rem/1 var(--sans);color:var(--ink);display:flex;justify-content:space-between;align-items:center;gap:1rem}
.calc__label b{color:var(--emerald);font-weight:700}
.calc__row2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.calc__input{width:100%;border:1px solid var(--line);border-radius:var(--r-sm);padding:.85rem 1rem;
font:500 .95rem var(--sans);color:var(--ink);background:var(--paper);transition:border-color .25s,box-shadow .25s}
.calc__input:focus{outline:none;border-color:var(--emerald);box-shadow:0 0 0 3px rgba(36,132,108,.14)}
.calc__input::placeholder{color:var(--ink-soft);opacity:.7}
.calc__quote{font-size:1rem;line-height:1.6;color:rgba(255,255,255,.9);margin-bottom:1.2rem}
.calc__quote b{color:var(--gold)}
@media (max-width:520px){.calc__row2{grid-template-columns:1fr}}
/* segmented control */
.seg{display:flex;gap:.3rem;background:var(--block);border:1px solid var(--line);border-radius:100px;padding:.28rem}
.seg__btn{flex:1;font:600 .84rem/1 var(--sans);color:var(--ink-soft);padding:.65em .4em;border-radius:100px;
transition:background .3s var(--ease),color .3s var(--ease)}
.seg__btn.is-on{background:linear-gradient(120deg,#0C1E1C 0%,#2E9A7C 100%);color:#fff;box-shadow:0 8px 18px -10px rgba(12,30,28,.6)}
html[data-theme="dark"] .seg__btn.is-on{background:linear-gradient(120deg,#1C6D59 0%,#3EC7A2 100%);color:#07130f}
/* select */
.calc__select{width:100%;appearance:none;-webkit-appearance:none;border:1px solid var(--line);border-radius:var(--r-sm);
padding:.85rem 2.4rem .85rem 1rem;font:500 .95rem var(--sans);color:var(--ink);background-color:var(--paper);cursor:pointer;
background-image:url("data:image/svg+xml;utf8,");
background-repeat:no-repeat;background-position:right 1rem center;background-size:13px}
.calc__select:focus{outline:none;border-color:var(--emerald);box-shadow:0 0 0 3px rgba(36,132,108,.14)}
/* range */
.calc__range{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:100px;
background:var(--block);border:1px solid var(--line);outline:none;cursor:pointer}
.calc__range::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;
background:linear-gradient(120deg,#0C1E1C 0%,#2E9A7C 100%);border:3px solid var(--card);
box-shadow:0 5px 14px -5px rgba(12,30,28,.7);cursor:pointer}
.calc__range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;border:3px solid var(--card);
background:#1C6D59;box-shadow:0 5px 14px -5px rgba(12,30,28,.7);cursor:pointer}
/* add-ons */
.calc__addons{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.chk{display:flex;align-items:center;gap:.6rem;font:500 .87rem/1.3 var(--sans);color:var(--ink);
background:var(--block);border:1px solid var(--line);border-radius:var(--r-sm);padding:.72rem .8rem;cursor:pointer;
transition:border-color .25s var(--ease),background .25s var(--ease)}
.chk input{appearance:none;-webkit-appearance:none;width:18px;height:18px;border-radius:5px;border:2px solid var(--line);
flex:0 0 auto;position:relative;cursor:pointer;transition:.22s var(--ease)}
.chk input:checked{background:var(--emerald);border-color:var(--emerald)}
.chk input:checked::after{content:"✓";position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:.68rem;font-weight:700}
.chk:has(input:checked){border-color:var(--emerald);background:rgba(36,132,108,.09)}
/* result card */
.calc__out{position:sticky;top:96px}
.calc__card{position:relative;overflow:hidden;border-radius:var(--r-md);color:#fff;
background:radial-gradient(120% 130% at 80% 0%,var(--emerald),#12463a 55%,var(--emerald-ink));
padding:clamp(1.3rem,2.8vw,2rem);box-shadow:0 34px 70px -46px rgba(12,30,28,.7)}
.calc__card::before{content:"";position:absolute;inset:0;background-image:url("../assets/pattern.svg");
background-size:170px 124px;opacity:.26;pointer-events:none}
.calc__card>*{position:relative;z-index:2}
.calc__outlabel{font:600 .76rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.72)}
.calc__total{display:flex;align-items:baseline;gap:.5rem;margin:.55rem 0 1.15rem}
.calc__cur{font:600 1rem var(--sans);color:var(--gold)}
.calc__total b{font-family:var(--display);font-weight:700;font-size:clamp(2.1rem,5vw,3.1rem);letter-spacing:-.02em;line-height:1}
.calc__lines{list-style:none;display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.2rem}
.calc__lines li{display:flex;justify-content:space-between;gap:1rem;font-size:.87rem;color:rgba(255,255,255,.84);
padding-bottom:.5rem;border-bottom:1px solid rgba(255,255,255,.14)}
.calc__lines li:last-child{border-bottom:0;padding-bottom:0}
.calc__lines b{font-weight:600;color:#fff;white-space:nowrap}
.calc__card .btn{width:100%;justify-content:center;background:var(--paper);color:var(--emerald-ink)}
.calc__card .btn:hover{background:#fff}
.calc__note{margin-top:.9rem;font-size:.73rem;line-height:1.55;color:rgba(255,255,255,.62);font-style:italic}
@media (max-width:860px){.calc{grid-template-columns:1fr}.calc__out{position:static}}
@media (max-width:520px){.calc__addons{grid-template-columns:1fr}}
/* menu open: nav blends into the dark overlay (no light "stuck banner" strip) */
html.menu-open .nav,html.menu-open .nav.scrolled{background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
html.menu-open .nav__brand img{filter:brightness(0) invert(1)}
html.menu-open .progress{opacity:0}
@media (max-width:600px){
/* hero: the rating pill overlapped the "20+ years" badge — the ★ proof line
above the photo already shows it, so drop the pill and keep just the badge */
.heropill{display:none}
/* mock rows: let the label wrap while the value stays put, aligned to the top line */
.mrow{align-items:flex-start;gap:.75rem;font-size:.9rem}
.mrow>*:last-child{flex:0 0 auto;white-space:nowrap}
.mrow>*:first-child{min-width:0}
}
/* =========================================================
NAV DROPDOWN (Services)
========================================================= */
.navdrop{position:relative;display:inline-flex;align-items:center}
.navdrop__t{display:inline-flex;align-items:center;gap:.34em}
.navdrop__c{width:12px;height:12px;opacity:.6;transition:transform .35s var(--ease),opacity .3s}
.navdrop:hover .navdrop__c,.navdrop:focus-within .navdrop__c{transform:rotate(180deg);opacity:1}
.navdrop__panel{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(10px);
margin-top:18px;min-width:296px;display:flex;flex-direction:column;gap:2px;
background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-card);
padding:.45rem;opacity:0;visibility:hidden;pointer-events:none;z-index:940;
transition:opacity .32s var(--ease),transform .32s var(--ease),visibility .32s}
.navdrop__panel::before{content:"";position:absolute;left:0;right:0;top:-20px;height:20px} /* hover bridge */
.navdrop:hover .navdrop__panel,.navdrop:focus-within .navdrop__panel{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.nav__links .navdrop__panel a{display:block;padding:.6rem .72rem;border-radius:12px;opacity:1;
transition:background .25s var(--ease),transform .25s var(--ease)}
.nav__links .navdrop__panel a b{display:block;font:600 .875rem/1.3 var(--sans);color:var(--ink);transition:color .25s}
.nav__links .navdrop__panel a span{display:block;font:400 .765rem/1.35 var(--sans);color:var(--ink-soft);margin-top:1px}
.nav__links .navdrop__panel a:hover{background:var(--block)}
.nav__links .navdrop__panel a:hover b{color:var(--emerald)}
.nav__links .navdrop__panel a.navdrop__cta{margin-top:.3rem;border-top:1px solid var(--line);border-radius:0 0 13px 13px;
padding-top:.7rem;font:600 .82rem/1 var(--sans);color:var(--emerald)}
.nav__links .navdrop__panel a.navdrop__cta:hover{background:var(--block)}
.row{scroll-margin-top:120px} /* fixed nav clearance for #svc-* anchors */
/* mobile overlay sub-menu */
@media (max-width:900px){.navdrop__panel{display:none}}
@media (prefers-reduced-motion:reduce){.navdrop__panel{transition:none}.navdrop__c{transition:none}}
/* service rows as links */
a.row{text-decoration:none;color:inherit}
a.row .row__t::after{content:"→";margin-left:.45em;color:var(--emerald);display:inline-block;opacity:0;
transform:translateX(-5px);transition:opacity .3s var(--ease),transform .3s var(--ease)}
a.row:hover .row__t::after{opacity:1;transform:translateX(0)}
/* service-page photo banner: taller than the About 3:1 so faces AND handshakes stay in frame */
.bizbanner--svc{aspect-ratio:21/9;margin-top:0}
@media (max-width:600px){.bizbanner--svc{aspect-ratio:4/3}}
/* five-step process (Corporate Banking): 5 across on desktop, 3+2 on tablet, stacked on phones */
.steps--5{grid-template-columns:repeat(5,1fr);gap:1.1rem}
.steps--5 .step{padding:1.6rem 1.4rem}
@media (max-width:1100px){.steps--5{grid-template-columns:repeat(3,1fr)}}
@media (max-width:900px){.steps--5{grid-template-columns:1fr 1fr}.steps--5 .step:last-child{grid-column:1/-1}}
@media (max-width:520px){.steps--5{grid-template-columns:1fr}}
/* =========================================================
CLIENT REVIEWS — mint panel, founder cut-out, floating cards
========================================================= */
.reviews{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:.92fr 1.12fr;gap:clamp(1.5rem,4vw,3.5rem);
align-items:stretch;border-radius:var(--r);overflow:hidden;position:relative;padding:0 clamp(1.4rem,4vw,3.4rem);
background:radial-gradient(70% 90% at 80% 30%,rgba(255,255,255,.75),rgba(255,255,255,0) 60%),
linear-gradient(160deg,#E1EFE5 0%,#EEF6F0 48%,#DCEBE1 100%);
box-shadow:inset 0 0 0 1px rgba(36,132,108,.10)}
.reviews::before{content:"";position:absolute;inset:auto 0 0 0;height:48%;pointer-events:none;opacity:.55;
background:repeating-linear-gradient(90deg,rgba(255,255,255,.0) 0 7%,rgba(255,255,255,.55) 7% 13%,rgba(255,255,255,0) 13% 19%,rgba(255,255,255,.35) 19% 22%);
-webkit-mask:linear-gradient(0deg,#000 0%,transparent 100%);mask:linear-gradient(0deg,#000 0%,transparent 100%)}
.reviews__copy{position:relative;z-index:2;padding:clamp(2.6rem,5vw,4.4rem) 0;display:flex;flex-direction:column;align-items:flex-start;gap:1.1rem}
.reviews__copy .h2{margin-top:.2rem}
.reviews__score{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem .5rem;font-size:.95rem;color:var(--ink-soft)}
.reviews__score .stars{color:var(--gold);letter-spacing:.1em}
.reviews__score b{color:var(--ink);font-weight:700}
.reviews__checks{list-style:none;display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;margin:.2rem 0 .6rem}
.reviews__checks li{display:flex;align-items:center;gap:.5rem;font-size:.95rem;color:var(--ink)}
.reviews__checks li::before{content:"✓";display:grid;place-items:center;width:1.3rem;height:1.3rem;border-radius:50%;
font-size:.72rem;font-weight:700;color:var(--ink);background:rgba(17,33,28,.10)}
.reviews__stage{position:relative;min-height:600px}
.reviews__glow{position:absolute;left:50%;bottom:-10%;width:120%;height:90%;margin-left:-60%;border-radius:50%;
background:radial-gradient(closest-side,rgba(36,132,108,.20),rgba(36,132,108,0));pointer-events:none}
.reviews__person{position:absolute;bottom:0;left:50%;height:92%;width:auto;transform:translateX(-51%);z-index:1;
filter:drop-shadow(0 30px 40px rgba(12,30,28,.18))}
.rcard{position:absolute;z-index:2;width:min(250px,44%)}
.rcard__in{background:#fff;color:#11211C;border:1px solid rgba(17,33,28,.07);border-radius:18px;padding:1rem 1.1rem 1.05rem;
box-shadow:0 26px 54px -26px rgba(12,30,28,.42);animation:rfloat 6.5s ease-in-out infinite}
.rcard--1{top:6%;left:-4%}
.rcard--2{top:34%;right:-3%}.rcard--2 .rcard__in{animation-delay:-2.2s}
.rcard--3{bottom:5%;left:-3%}.rcard--3 .rcard__in{animation-delay:-4.3s}
@keyframes rfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.rcard__top{display:flex;align-items:center;gap:.6rem;margin-bottom:.65rem}
.rcard__av{width:2.3rem;height:2.3rem;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;
background:linear-gradient(135deg,#0C1E1C,#2E9A7C);box-shadow:0 0 0 3px #E3EFE8}
.rcard__av svg{width:1rem;height:1rem;fill:var(--gold)}
.rcard__who{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.rcard__who b{font:600 .9rem/1.25 var(--sans);color:#11211C}
.rcard__who span{font-size:.76rem;color:#586761}
.rcard__tag{font:600 .64rem/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;
color:#165645;background:#E3EFE8;border-radius:100px;padding:.38rem .55rem;white-space:nowrap}
.rcard blockquote{font:500 .86rem/1.5 var(--sans);color:#11211C;border-left:3px solid #2E9A7C;padding-left:.7rem;margin:0}
.rcard__foot{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-top:.65rem}
.rcard__stars{color:var(--gold);font-size:.8rem;letter-spacing:.12em}
.reviews__note{text-align:center;font-size:.8rem;color:var(--ink-soft);margin-top:1.1rem;font-style:italic}
html[data-theme="dark"] .reviews{background:radial-gradient(70% 90% at 80% 30%,rgba(52,164,136,.18),rgba(0,0,0,0) 60%),
linear-gradient(160deg,#12261F 0%,#16302A 50%,#0F211C 100%);box-shadow:inset 0 0 0 1px rgba(237,241,236,.08)}
html[data-theme="dark"] .reviews::before{opacity:.08}
html[data-theme="dark"] .reviews__checks li::before{color:#EDF4EE;background:rgba(237,241,236,.14)}
@media (max-width:980px){
.reviews{grid-template-columns:1fr;padding:0 1.3rem}
.reviews__copy{padding:2.4rem 0 0}
.reviews__stage{min-height:0;display:flex;flex-direction:column;align-items:center;gap:.8rem;padding-bottom:1.6rem}
.reviews__person{position:relative;left:auto;margin:0;height:auto;width:min(270px,70%);order:0}
.rcard{position:relative;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important;width:100%;max-width:440px;margin-left:auto;margin-right:auto}
.reviews__person{transform:none}
.rcard--1{margin-top:-5.5rem}
.reviews__glow{bottom:auto;top:0;height:60%}
}
@media (prefers-reduced-motion:reduce){.rcard__in{animation:none}}
.reviews__count{white-space:nowrap}
/* Google review wall + Google marks */
.gmark{width:1em;height:1em;display:inline-block;vertical-align:-.12em}
.rcard__av{background:#fff;box-shadow:0 0 0 1px rgba(17,33,28,.08),0 4px 10px -4px rgba(12,30,28,.25)}
.rcard__av .gmark{width:1.15rem;height:1.15rem}
a.reviews__count{color:var(--ink-soft);text-decoration:underline;text-decoration-color:rgba(36,132,108,.35);text-underline-offset:3px}
a.reviews__count:hover{color:var(--emerald)}
.gwall-head{max-width:var(--maxw);margin:2.2rem auto 1.1rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.gwall-score{display:flex;align-items:center;gap:.45rem;font-size:1rem;color:var(--ink-soft)}
.gwall-score .stars{color:var(--gold);letter-spacing:.1em}
.gwall-score b{color:var(--ink);font-size:1.15rem}
padding:1.25rem 1.3rem 1.2rem;box-shadow:var(--shadow-card);display:flex;flex-direction:column;gap:.8rem}
.gcard__av{width:2.4rem;height:2.4rem;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;font:700 .85rem/1 var(--sans);
color:#fff;background:linear-gradient(135deg,#1C6D59,#2E9A7C)}
.gcard:nth-child(3n) .gcard__av{background:linear-gradient(135deg,#0C1E1C,#3a5a52)}
.gcard__who b{font:600 .95rem/1.25 var(--sans);color:var(--ink)}
.gcard__stars{margin-left:auto;color:var(--gold);font-size:.82rem;letter-spacing:.1em;white-space:nowrap}
.gcard__tag{align-self:flex-start;font:600 .64rem/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:#165645;
background:#E3EFE8;border-radius:100px;padding:.4rem .6rem}
html[data-theme="dark"] .gcard__tag{color:#BFE6D6;background:rgba(52,164,136,.18)}
/* =========================================================
MOBILE MENU v2 — compact, layered, animated
========================================================= */
.menu__bg{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;
background:url("../assets/pattern.svg") 0 0/220px auto, radial-gradient(120% 70% at 100% 0%,#17463a 0%,rgba(12,30,28,0) 60%)}
.menu__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,30,28,.55),rgba(12,30,28,.92) 70%)}
.menu__orb{position:absolute;border-radius:50%;filter:blur(40px);opacity:.55}
.menu.open .menu__orb{animation:orbDrift 14s ease-in-out infinite alternate}
.menu.open .menu__orb--b{animation-duration:18s}
.menu__orb--a{width:260px;height:260px;top:-60px;right:-80px;background:#2E9A7C}
.menu__orb--b{width:220px;height:220px;bottom:6%;left:-90px;background:#DEA35E;opacity:.28}
@keyframes orbDrift{to{transform:translate(-40px,60px) scale(1.15)}}
.menu__nav{display:flex;flex-direction:column;gap:.15rem;position:relative}
.menu__link{display:flex;align-items:center;gap:.9rem;padding:.75rem .9rem;border-radius:16px;color:#fff;
font:600 clamp(1.45rem,6.4vw,1.85rem)/1.1 var(--display);letter-spacing:-.01em;position:relative;overflow:hidden;
transition:background .3s,transform .2s}
.menu__no{font:600 .72rem/1 var(--sans);color:var(--gold);letter-spacing:.08em;width:1.4rem}
.menu__t{flex:1}
.menu__link svg{width:1.1rem;height:1.1rem;color:var(--gold);opacity:.55;transition:transform .35s var(--ease),opacity .3s}
.menu__link:active{transform:scale(.97)}
.menu__link:hover svg,.menu__link.is-current svg{opacity:1;transform:translateX(3px)}
.menu__link.is-current{background:linear-gradient(100deg,rgba(46,154,124,.28),rgba(46,154,124,.06));box-shadow:inset 0 0 0 1px rgba(222,163,94,.22)}
.menu__link.is-current::before{content:"";position:absolute;left:0;top:22%;bottom:22%;width:3px;border-radius:3px;background:var(--gold);box-shadow:0 0 12px var(--gold)}
.menu__link::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.12) 50%,transparent 70%);
transform:translateX(-120%);pointer-events:none}
.menu.open .menu__link::after{animation:menuShine 1.1s var(--ease) calc(.35s + var(--i,0)*.07s) 1 both}
@keyframes menuShine{to{transform:translateX(120%)}}
.menu__sub{display:grid;grid-template-columns:1fr 1fr;gap:.45rem;margin:.15rem 0 .55rem 3.2rem}
.menu__chip{font:500 .82rem/1.25 var(--sans);color:rgba(255,255,255,.78);padding:.62rem .7rem;border-radius:12px;
background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);transition:background .25s,border-color .25s,color .25s,transform .2s}
.menu__chip:active{transform:scale(.96)}
.menu__chip:hover,.menu__chip.is-current{color:#fff;border-color:rgba(222,163,94,.5);background:rgba(222,163,94,.12)}
.menu__acts{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin-top:1.4rem}
.menu__act{display:flex;flex-direction:column;align-items:center;gap:.45rem;padding:.85rem .4rem;border-radius:16px;color:#fff;
font:600 .78rem/1 var(--sans);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);transition:transform .2s,background .25s}
.menu__act svg{width:1.3rem;height:1.3rem;color:var(--gold)}
.menu__act:active{transform:scale(.95);background:rgba(46,154,124,.25)}
.menu__cta{margin-top:.9rem;justify-content:center;width:100%;padding:1rem 1.2rem;font-size:1rem}
.menu__cta svg{width:1.05rem;height:1.05rem}
/* staggered entrance */
.menu__link,.menu__chip,.menu__acts,.menu__cta{opacity:0;transform:translateY(16px);
transition:opacity .5s var(--ease),transform .55s var(--ease),background .3s,border-color .25s,color .25s;transition-delay:0s}
.menu.open .menu__link,.menu.open .menu__chip,.menu.open .menu__acts,.menu.open .menu__cta{opacity:1;transform:none;transition-delay:calc(.18s + var(--i,0)*.045s)}
@media (prefers-reduced-motion:reduce){.menu__orb,.menu.open .menu__link::after{animation:none}
.menu__link,.menu__chip,.menu__acts,.menu__cta{opacity:1;transform:none;transition:none}}
/* =========================================================
FOOTER v2 — columns + contact rows with icons
========================================================= */
.footer__top{display:grid;grid-template-columns:1.35fr .7fr 1fr 1.25fr;gap:2.2rem;align-items:start}
.footer__col{display:flex;flex-direction:column;gap:.7rem}
.footer__col h4{font:600 .75rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--emerald);margin-bottom:.35rem}
.footer__col a{font:500 .9rem/1.35 var(--sans);color:var(--ink-soft);transition:color .25s,padding-left .3s}
.footer__col a:hover{color:var(--emerald);padding-left:.2rem}
.footer__contact ul{list-style:none;display:flex;flex-direction:column;gap:.85rem}
.footer__contact li{display:flex;align-items:flex-start;gap:.7rem;font-size:.9rem;line-height:1.45;color:var(--ink-soft)}
.footer__contact li a{padding:0}
.fic{width:2.1rem;height:2.1rem;flex:0 0 auto;border-radius:10px;display:grid;place-items:center;color:var(--emerald);
background:rgba(36,132,108,.1);border:1px solid rgba(36,132,108,.16);margin-top:-.25rem;transition:background .25s,color .25s,transform .25s}
.fic svg{width:1rem;height:1rem}
.footer__contact li:hover .fic{background:var(--emerald);color:#fff;transform:translateY(-2px)}
.footer__made{color:var(--ink-soft)}
html[data-theme="dark"] .fic{color:#6FD3B4;background:rgba(52,164,136,.14);border-color:rgba(52,164,136,.25)}
@media (max-width:980px){.footer__top{grid-template-columns:1fr 1fr}.footer__brand{grid-column:1/-1}}
@media (max-width:560px){.footer__top{grid-template-columns:1fr 1fr;gap:1.8rem 1.2rem}.footer__contact{grid-column:1/-1}}
/* =========================================================
MOBILE TOUCH POLISH — press feedback + button sheen
========================================================= */
@media (hover:none){
.btn,.qcard,.step,.gcard,.rcard__in,.row,.calc__form .seg button,.social__a{-webkit-tap-highlight-color:transparent}
.btn:active{transform:scale(.96)}
.gcard:active,.step:active,.row:active{transform:scale(.985);transition:transform .15s}
.btn--gold{position:relative;overflow:hidden}
.btn--gold::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.28) 50%,transparent 65%);
transform:translateX(-130%);animation:btnSheen 3.8s ease-in-out 1.5s infinite;pointer-events:none}
}
@keyframes btnSheen{0%,55%{transform:translateX(-130%)}100%{transform:translateX(130%)}}
@media (prefers-reduced-motion:reduce){.btn--gold::after{animation:none}}
.gcard blockquote{flex:1}
background:radial-gradient(90% 80% at 100% 0%,rgba(222,163,94,.28),rgba(222,163,94,0) 60%),linear-gradient(150deg,#0C1E1C 0%,#1C6D59 100%);
position:relative;overflow:hidden}
.gcard--cta>*{position:relative}
.gcard--cta p{font-size:.92rem;line-height:1.55;color:rgba(255,255,255,.78)}
.gcard--cta .btn--gold{background:var(--paper);color:var(--emerald-ink);box-shadow:none}
@media (max-width:980px){
.rcard--2,.rcard--3{display:none}
.reviews__stage{padding-bottom:1.4rem}
.rcard--1{margin-top:-3rem;max-width:min(100%,360px)}
}
/* review orbit (JS sets left/top in px) */
.reviews__stage.is-orbit .rcard{left:0;top:0;right:auto;bottom:auto;will-change:transform;backface-visibility:hidden;
transition:transform .8s cubic-bezier(.22,1,.36,1),opacity .32s ease}
.reviews__stage.is-orbit .rcard.rcard--jump{transition:none}
.reviews__stage.is-orbit .rcard[data-slot="1"]{z-index:3}
.rcard.is-out{opacity:0}
@media (max-width:980px){.reviews__stage.is-orbit .rcard{left:auto!important;top:auto!important;transform:none!important;transition:opacity .45s ease}}
/* jurisdiction logo strip */
.marquee__track.is-logos{gap:clamp(2.4rem,4.2vw,3.8rem);align-items:center}
.mq-logo{display:flex;align-items:center;height:52px}
.mq-logo img{width:auto;display:block;opacity:.92;transition:filter .35s var(--ease),opacity .35s var(--ease)} /* light: full colour */
.mq-logo:hover img{opacity:1}
html[data-theme="dark"] .mq-logo img{filter:grayscale(1) invert(1) brightness(1.25);opacity:.72}
html[data-theme="dark"] .mq-logo:hover img{opacity:1}
@media (max-width:600px){.marquee__track.is-logos{gap:1.8rem}.mq-logo img{transform:scale(.8);transform-origin:center}}
.reviews__foot{max-width:var(--maxw);margin:1.5rem auto 0;display:flex;align-items:center;justify-content:center;gap:1rem 1.8rem;flex-wrap:wrap}
.reviews__foot .btn svg{width:1.05em;height:1.05em}
/* ===== site-themed form controls (replace native select/datalist popups) ===== */
:root{color-scheme:light}
html[data-theme="dark"]{color-scheme:dark}
input:-webkit-autofill,input:-webkit-autofill:focus,textarea:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--card) inset;-webkit-text-fill-color:var(--ink);caret-color:var(--ink)}
input::-webkit-calendar-picker-indicator{display:none!important}
.bzx-select,.bzx-ac{position:relative}
.field .bzx-select{display:block}
.bzx-native{position:absolute!important;opacity:0!important;pointer-events:none!important;width:1px!important;height:1px!important;min-height:0!important;padding:0!important;border:0!important;left:0;bottom:0}
.bzx-select--calc .bzx-select__btn{width:100%;appearance:none;-webkit-appearance:none;border:1px solid var(--line);border-radius:var(--r-sm);
padding:.85rem 2.4rem .85rem 1rem;font:500 .95rem var(--sans);color:var(--ink);background-color:var(--paper);cursor:pointer;
background-image:url("data:image/svg+xml;utf8,");
background-repeat:no-repeat;background-position:right 1rem center;background-size:13px}
.field .bzx-select__btn{width:100%;background:var(--paper);border:1px solid var(--line);border-radius:12px;
padding:1.5rem .95rem .5rem;color:var(--ink);font:400 1rem/1.2 var(--sans);transition:border-color .25s,box-shadow .25s;
appearance:none;-webkit-appearance:none}
.bzx-select__btn{display:flex;align-items:center;justify-content:space-between;gap:.6rem;text-align:left;cursor:pointer;font:inherit;color:var(--ink);appearance:none;-webkit-appearance:none;background-image:none;min-height:3.2rem}
.bzx-select__btn svg{width:1rem;height:1rem;flex:0 0 auto;color:var(--ink-soft);transition:transform .3s var(--ease)}
.bzx-select.is-open .bzx-select__btn svg{transform:rotate(180deg)}
.bzx-select.is-open .bzx-select__btn,.bzx-select__btn:focus{outline:none;border-color:var(--emerald);box-shadow:0 0 0 3px rgba(36,132,108,.14)}
.field.is-focus label,.field.has-value label{top:.7rem;transform:translateY(0) scale(.72);color:var(--emerald)}
.bzx-pop{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:60;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-lift);padding:.35rem;max-height:272px;overflow:auto;
opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s var(--ease),transform .2s var(--ease),visibility .2s}
.is-open>.bzx-pop{opacity:1;visibility:visible;transform:none}
.bzx-opt{padding:.62rem .8rem;border-radius:10px;font:500 .92rem/1.3 var(--sans);color:var(--ink);cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:.6rem}
.bzx-opt:hover,.bzx-opt.is-active{background:var(--block)}
.bzx-opt.is-selected{color:var(--emerald)}
.bzx-opt.is-selected::after{content:"✓";font-weight:700}
/* ===== light islands → soft green (not pure white), both themes ===== */
.mock{--card:#E3EDE5}
.mockcard,.rcard__in,.hmsg__bubble{background:#E3EDE5}
.herochat{background:linear-gradient(160deg,rgba(227,237,229,.94),rgba(227,237,229,.82));border-color:rgba(255,255,255,.6)}
.feat__text h3+.lead{margin-top:1rem}
.bzx-select--calc .bzx-select__btn,.field .bzx-select__btn{background-image:none;padding-right:1rem}
.hmsg{align-items:flex-start}
.hmsg__av{margin-top:1.1rem}
.hmsg__stars{margin:.3rem 0 0 .2rem}
/* ===== phone country-code picker ===== */
.bzx-phone{position:relative;display:flex;align-items:stretch}
.bzx-phone input{flex:1;min-width:0;border-top-left-radius:0!important;border-bottom-left-radius:0!important;border-left:0!important}
.bzx-phone__cc{display:flex;align-items:center;gap:.4rem;padding:0 .8rem 0 .9rem;border:1px solid var(--line);border-right:0;background:var(--paper);color:var(--ink);font:600 .92rem/1 var(--sans);cursor:pointer;border-radius:12px 0 0 12px;white-space:nowrap;transition:border-color .2s,box-shadow .2s}
.bzx-phone--calc .bzx-phone__cc{border-radius:var(--r-sm) 0 0 var(--r-sm);background:var(--card)}
.bzx-phone__cc svg{width:.9rem;height:.9rem;color:var(--ink-soft)}
.bzx-phone__flag{font-size:1.15em;line-height:1}
.bzx-phone.is-open .bzx-phone__cc{border-color:var(--emerald)}
.bzx-phone input:focus{border-left:0!important}
.bzx-phone input:focus~.bzx-phone__cc{border-color:var(--emerald)}
.bzx-pop--cc{max-height:320px;padding:.35rem;display:flex;flex-direction:column}
.bzx-pop--cc>div{overflow:auto;flex:1}
.bzx-pop__search{width:100%;margin-bottom:.35rem;padding:.55rem .75rem;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);font:500 .88rem var(--sans)}
.bzx-pop__search:focus{outline:none;border-color:var(--emerald)}
.bzx-pop--cc .bzx-opt small{color:var(--ink-soft);font-weight:500}
.bzx-pop--cc .bzx-opt.is-selected::after{content:none}
.field .bzx-phone label{left:calc(var(--cc-w,6rem) + .98rem)}
/* ===== hero founder carousel ===== */
.herostage{background:radial-gradient(90% 70% at 70% 100%,rgba(36,132,108,.28),rgba(36,132,108,0) 60%),radial-gradient(70% 50% at 20% 0%,rgba(222,163,94,.18),rgba(222,163,94,0) 60%),linear-gradient(180deg,#F3F8F4,#DFEAE2)}
.herostage::before{background:url("../assets/pattern.svg") center/150px 108px;opacity:.18}
.herostage::after{content:"";position:absolute;left:0;right:0;bottom:0;height:34%;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(12,30,28,0),rgba(12,30,28,.16))}
html[data-theme="dark"] .herostage{background:radial-gradient(90% 70% at 70% 100%,rgba(52,164,136,.32),rgba(52,164,136,0) 60%),radial-gradient(70% 50% at 20% 0%,rgba(228,176,114,.14),transparent 60%),linear-gradient(180deg,#14281F,#0E1F1A)}
.herostage__slides{position:absolute;inset:0;z-index:2}
.hslide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .8s var(--ease),visibility .8s}
.hslide.is-active{opacity:1;visibility:visible}
.hslide__person{position:absolute;right:-2%;bottom:0;height:84%;width:auto;max-width:78%;object-fit:contain;object-position:bottom;filter:drop-shadow(0 28px 36px rgba(12,30,28,.38));transform:translateY(14px) scale(.98);transition:transform .9s var(--ease)}
.hslide.is-active .hslide__person{transform:none}
.hcard{position:absolute;z-index:3;background:#F4F9F5;color:#11211C;border-radius:16px;border:1px solid rgba(255,255,255,.7);box-shadow:0 30px 60px -28px rgba(12,30,28,.5),0 2px 0 rgba(255,255,255,.6) inset;padding:.85rem .95rem;font:500 .74rem/1.35 var(--sans);opacity:0;transform:translateY(16px) rotate(0deg)}
.hslide.is-active .hcard{animation:hcardIn .7s var(--ease) both}
.hslide.is-active .hcard--b{animation-delay:.25s}
@keyframes hcardIn{from{opacity:0;transform:translateY(18px) rotate(var(--rot,0deg)) scale(.97)}to{opacity:1;transform:translateY(0) rotate(var(--rot,0deg))}}
.hcard--a{--rot:-4deg;left:4%;top:17%;width:min(62%,300px)}
.hcard--b{--rot:3deg;right:3%;bottom:8%;width:min(64%,310px)}
.hcard__who{display:flex;align-items:center;gap:.6rem;margin-bottom:.7rem}
.hcard__who b{display:block;font-size:.86rem;font-weight:700;line-height:1.2}
.hcard__who span{display:block;color:#586761;font-size:.7rem}
.hcard__av{position:relative;width:2rem;height:2rem;border-radius:50%;background:#DCE9E1;color:#1C6D59;display:grid;place-items:center;font:700 .66rem/1 var(--sans);flex:0 0 auto}
.hcard__av i{position:absolute;right:-1px;bottom:-1px;width:.55rem;height:.55rem;border-radius:50%;background:#2E9A7C;border:2px solid #F4F9F5}
.hcard__wf{background:#FBF1E3;border-radius:12px;padding:.6rem .7rem}
.hcard__wfhead{display:flex;justify-content:space-between;gap:.5rem;font-size:.6rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#8A6A3F;margin-bottom:.3rem}
.hcard__wfhead span:last-child{letter-spacing:0;text-transform:none;font-weight:500;color:#9A8468}
.hcard__wf>b{display:block;color:#C6893F;font-size:.8rem;font-weight:700}
.hcard__wf>span{display:block;color:#7A6246;font-size:.68rem;margin:.1rem 0 .45rem}
.hcard__bar{height:.4rem;border-radius:100px;background:rgba(198,137,63,.18);overflow:hidden}
.hcard__bar i{display:block;height:100%;border-radius:100px;background:linear-gradient(90deg,#C6893F,#DEA35E)}
.hslide.is-active .hcard__bar i{animation:hbar 1.2s var(--ease) .4s both}
@keyframes hbar{from{transform:scaleX(0);transform-origin:left}to{transform:none}}
.hcard__next{display:flex;align-items:center;gap:.4rem;margin-top:.6rem;color:#586761;font-size:.7rem}
.hcard__next i{width:.42rem;height:.42rem;border-radius:50%;background:#24846C;flex:0 0 auto}
.hcard__nhead{display:flex;align-items:center;gap:.5rem}
.hcard__nhead b{font-size:.8rem;font-weight:700;line-height:1.25;flex:1}
.hcard__nhead>span:last-child{color:#8A978F;font-size:.64rem;white-space:nowrap}
.hcard__chk{width:1.25rem;height:1.25rem;border-radius:50%;border:2px solid #C6893F;color:#C6893F;display:grid;place-items:center;flex:0 0 auto}
.hcard__chk svg{width:.7rem;height:.7rem}
.hcard__ref{color:#586761;font-size:.68rem;margin:.45rem 0 .5rem}
.hcard__file{display:flex;align-items:center;gap:.55rem;background:#FBF1E3;border-radius:10px;padding:.5rem .6rem}
.hcard__file b{display:block;font-size:.72rem;font-weight:700}
.hcard__file span{display:block;color:#7A6246;font-size:.64rem}
.hcard__fic{width:1.6rem;height:1.6rem;border-radius:8px;background:#fff;color:#C6893F;display:grid;place-items:center;flex:0 0 auto}
.hcard__fic svg{width:.9rem;height:.9rem}
.hcard__link{display:inline-block;margin-top:.55rem;color:#C6893F;font-weight:700;font-size:.72rem;text-decoration:none}
@media (max-width:980px){.hcard{font-size:.7rem;padding:.7rem .8rem}.hcard--a{width:min(60%,270px);top:14%}.hcard--b{width:min(62%,280px);bottom:6%}.hslide__person{height:80%}}
@media (prefers-reduced-motion:reduce){.hslide.is-active .hcard,.hslide.is-active .hcard__bar i{animation:none;opacity:1;transform:rotate(var(--rot,0deg))}.hslide__person{transition:none}}
/* cut-out founders: undo the old full-bleed hero img rule */
.herophoto.herostage img.hslide__person{top:auto;left:auto;right:0;bottom:0;width:auto;height:80%;max-width:72%}
.hcard--a{left:4%;top:15%;width:min(58%,290px)}
@media (max-width:980px){.herophoto.herostage img.hslide__person{height:76%;max-width:70%}}
@media (max-width:980px){
.hcard{font-size:.62rem;padding:.6rem .7rem;border-radius:13px}
.hcard--a{left:3%;top:13%;width:min(52%,230px)}.hcard--b{right:2%;bottom:4%;width:min(56%,245px)}
.hcard__who b{font-size:.74rem}.hcard__wf>b{font-size:.7rem}.hcard__nhead b{font-size:.7rem}.hcard__av{width:1.7rem;height:1.7rem}
.herophoto.herostage img.hslide__person{right:-5%;height:74%;max-width:76%}
}
/* ===== hero carousel: chat-style card ===== */
.hchat{position:absolute;z-index:3;left:4%;top:12%;width:min(62%,330px);background:#F4F9F5;color:#11211C;border-radius:18px;border:1px solid rgba(255,255,255,.75);box-shadow:0 34px 64px -30px rgba(12,30,28,.55);overflow:hidden;font:500 .74rem/1.4 var(--sans);opacity:0}
.hslide.is-active .hchat{animation:hcardIn .7s var(--ease) both}
.hchat__head{display:flex;align-items:center;gap:.55rem;padding:.65rem .8rem;background:#fff;border-bottom:1px solid rgba(17,33,28,.07)}
.hchat__head b{display:block;font-size:.82rem;font-weight:700;line-height:1.15}
.hchat__head>div>span{display:block;color:#586761;font-size:.64rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}
.hchat__av{position:relative;width:1.9rem;height:1.9rem;border-radius:50%;background:#DCE9E1;color:#1C6D59;display:grid;place-items:center;font:700 .62rem/1 var(--sans);flex:0 0 auto}
.hchat__av i{position:absolute;right:-1px;bottom:-1px;width:.5rem;height:.5rem;border-radius:50%;background:#2E9A7C;border:2px solid #fff}
.hchat__live{margin-left:auto;font-size:.62rem;color:#24846C;font-weight:600}
.hchat__live::before{content:"";display:inline-block;width:.4rem;height:.4rem;border-radius:50%;background:#2E9A7C;margin-right:.3rem;vertical-align:middle}
.hchat__body{padding:.7rem .7rem .5rem;display:flex;flex-direction:column;gap:.4rem;background:radial-gradient(circle at 20% 10%,rgba(36,132,108,.06),transparent 50%),#EEF4EF}
.hmsg{position:relative;max-width:86%;padding:.5rem .65rem .3rem;border-radius:14px;opacity:0;transform:translateY(8px) scale(.97)}
.hslide.is-active .hmsg,.hslide.is-active .hchat__sys{animation:hmsgPop .45s var(--ease) var(--d,0s) both}
@keyframes hmsgPop{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
.hmsg p{margin:0;font-size:.76rem}
.hmsg--them{align-self:flex-start;background:#fff;border-bottom-left-radius:4px;box-shadow:0 2px 6px -4px rgba(12,30,28,.3)}
.hmsg--us{align-self:flex-end;background:linear-gradient(120deg,#1C6D59,#2E9A7C);color:#fff;border-bottom-right-radius:4px}
.hmsg--us p{font-weight:600}
.hchat__time{display:block;text-align:right;font-style:normal;font-size:.58rem;opacity:.65;margin-top:.15rem}
.hchat__time svg{width:.75rem;height:.75rem;vertical-align:-2px;color:#9AD9C5}
.hmsg--them .hchat__time svg{display:none}
.hmsg__steps{display:block;font-size:.62rem;opacity:.85;margin-top:.2rem}
.hmsg__bar{display:block;height:.32rem;border-radius:100px;background:rgba(255,255,255,.25);margin-top:.3rem;overflow:hidden}
.hmsg__bar i{display:block;height:100%;border-radius:100px;background:#E4B072}
.hslide.is-active .hmsg__bar i{animation:hbar 1s var(--ease) 1.3s both}
.hmsg--doc{display:grid;grid-template-columns:auto 1fr;gap:.5rem;align-items:center;background:#fff;color:#11211C;border:1px solid rgba(17,33,28,.08)}
.hmsg--doc b{display:block;font-size:.7rem;font-weight:700;word-break:break-all}
.hmsg--doc>div>span{display:block;color:#586761;font-size:.62rem}
.hmsg--doc .hchat__time{grid-column:1/-1;color:#586761}
.hmsg--doc .hchat__time svg{color:#2E9A7C}
.hmsg__fic{width:1.7rem;height:1.7rem;border-radius:9px;background:#FBF1E3;color:#C6893F;display:grid;place-items:center}
.hmsg__fic svg{width:.95rem;height:.95rem}
.hchat__sys{align-self:center;display:flex;align-items:center;gap:.35rem;font-size:.62rem;color:#586761;background:rgba(255,255,255,.7);border-radius:100px;padding:.25rem .6rem;margin-top:.15rem;opacity:0}
.hchat__sys i{width:.38rem;height:.38rem;border-radius:50%;background:#C6893F}
.hchat__foot{display:flex;align-items:center;gap:.5rem;padding:.5rem .7rem;background:#fff;border-top:1px solid rgba(17,33,28,.07)}
.hchat__foot span{flex:1;font-size:.68rem;color:#8A978F;background:#EEF4EF;border-radius:100px;padding:.4rem .7rem}
.hchat__foot b{width:1.7rem;height:1.7rem;border-radius:50%;background:#24846C;color:#fff;display:grid;place-items:center}
.hchat__foot b svg{width:.8rem;height:.8rem}
.hslide .hcard{display:none}
@media (max-width:980px){.hchat{left:3%;top:10%;width:min(60%,250px);font-size:.66rem}.hmsg p{font-size:.68rem}.hchat__head>div>span{max-width:110px}}
.hmsg__tag{display:inline-block;margin-top:.35rem;font-size:.6rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:rgba(255,255,255,.18);border-radius:100px;padding:.2rem .55rem}
.hchat__sys em{font-style:normal;color:#DEA35E;letter-spacing:.08em;font-size:.6rem}
.hchat .hmsg{display:block;max-width:88%}
.hchat .hmsg p{margin:0 0 .1rem;font-size:.76rem;line-height:1.4}
.hchat .hmsg--them p{color:#11211C}
/* ===== hero stage: frameless (no card/border), person stands beside the chat ===== */
.herophoto.herostage{border:0;box-shadow:none;background:none;overflow:visible;border-radius:0}
.herophoto.herostage::before,.herophoto.herostage::after{display:none}
html[data-theme="dark"] .herophoto.herostage{background:none}
.herostage__slides{overflow:visible}
.hslide{overflow:visible}
.hslide::before{content:"";position:absolute;right:-6%;bottom:-6%;width:78%;height:78%;border-radius:50%;background:radial-gradient(closest-side,rgba(36,132,108,.22),rgba(36,132,108,0));z-index:0;pointer-events:none}
html[data-theme="dark"] .hslide::before{background:radial-gradient(closest-side,rgba(52,164,136,.28),rgba(52,164,136,0))}
.herophoto.herostage img.hslide__person{right:0;bottom:0;height:86%;max-width:62%;filter:drop-shadow(0 30px 40px rgba(12,30,28,.28))}
.hchat{left:0;top:9%;width:min(56%,300px);z-index:3}
.heropill{left:0}.herobadge{right:0}
@media (max-width:980px){.herophoto.herostage img.hslide__person{right:0;height:80%;max-width:60%}.hchat{left:0;top:9%;width:min(58%,250px)}}
.herophoto.herostage img.hslide__person{object-fit:contain!important;object-position:right bottom!important}
/* glass pill/badge readable on the frameless light backdrop (dark theme keeps the white glass) */
html:not([data-theme="dark"]) .heropill,html:not([data-theme="dark"]) .herobadge{background:rgba(17,33,28,.06);border-color:rgba(17,33,28,.14);color:var(--ink);text-shadow:none;box-shadow:0 10px 24px -16px rgba(12,30,28,.35)}
html:not([data-theme="dark"]) .heropill .stars{color:var(--gold-d)}
/* ===== hero carousel on phones: person centred up top, chat full-width docked at the bottom ===== */
@media (max-width:680px){
.herophoto.herostage{aspect-ratio:4/5.2}
.hslide::before{left:50%;right:auto;bottom:auto;top:4%;width:80%;height:60%;transform:translateX(-50%)}
.herophoto.herostage img.hslide__person{left:50%;right:auto;top:0;bottom:auto;height:62%;max-width:86%;transform:translate(-50%,14px) scale(.98)}
.hslide.is-active .hslide__person{transform:translate(-50%,0)}
.hchat{left:0;right:0;width:auto;top:auto;bottom:0;font-size:.72rem;border-radius:16px}
.hchat__body{padding:.6rem .6rem .45rem;gap:.35rem}
.hchat .hmsg{max-width:84%}.hchat .hmsg p{font-size:.74rem}
.hchat__head{padding:.55rem .7rem}.hchat__head>div>span{max-width:160px}
.hchat__foot{padding:.4rem .6rem}
.herobadge{top:0;right:0;font-size:.72rem}
}
@media (prefers-reduced-motion:reduce) and (max-width:680px){.hslide__person{transform:translate(-50%,0)!important}}
@media (max-width:680px){
.herophoto.herostage{aspect-ratio:4/4.9}
.herophoto.herostage img.hslide__person{object-position:center top!important;top:2%;height:60%}
}
@media (max-width:680px){
.herophoto.herostage img.hslide__person,.hslide.is-active .hslide__person{left:0;right:0;margin:0 auto;transform:none!important;transition:none}
.hero{padding-bottom:1.5rem}
}
/* ===== hero v3: living background (mesh blobs + dot grid + cursor light + self-drawing Dubai skyline) ===== */
.hero{--mx:50%;--my:40%}
.hero__bg{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.hero__grid{position:relative;z-index:1}
.blob{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55;will-change:transform}
.blob--1{width:52vw;height:52vw;left:-14vw;top:-22vw;background:radial-gradient(circle,rgba(36,132,108,.55),rgba(36,132,108,0) 65%);animation:blobA 22s ease-in-out infinite alternate}
.blob--2{width:40vw;height:40vw;right:-10vw;top:-8vw;background:radial-gradient(circle,rgba(222,163,94,.45),rgba(222,163,94,0) 65%);animation:blobB 26s ease-in-out infinite alternate}
.blob--3{width:36vw;height:36vw;left:30vw;bottom:-22vw;background:radial-gradient(circle,rgba(62,199,162,.4),rgba(62,199,162,0) 65%);animation:blobC 30s ease-in-out infinite alternate}
@keyframes blobA{to{transform:translate(12vw,8vw) scale(1.12)}}
@keyframes blobB{to{transform:translate(-10vw,10vw) scale(.92)}}
@keyframes blobC{to{transform:translate(-14vw,-6vw) scale(1.08)}}
.hero__dots{position:absolute;inset:0;background-image:radial-gradient(rgba(17,33,28,.22) 1px,transparent 1.4px);background-size:26px 26px;
-webkit-mask:radial-gradient(42% 50% at var(--mx) var(--my),#000 0%,rgba(0,0,0,.35) 45%,transparent 100%);mask:radial-gradient(42% 50% at var(--mx) var(--my),#000 0%,rgba(0,0,0,.35) 45%,transparent 100%);transition:-webkit-mask-position .2s,mask-position .2s}
html[data-theme="dark"] .hero__dots{background-image:radial-gradient(rgba(237,241,236,.26) 1px,transparent 1.4px)}
html[data-theme="dark"] .blob{opacity:.5}
.skyline{position:absolute;left:0;right:0;bottom:-2px;width:100%;height:clamp(90px,12vw,170px);color:var(--emerald);opacity:.5}
html[data-theme="dark"] .skyline{color:#3EC7A2;opacity:.45}
.sk{stroke-dasharray:1;stroke-dashoffset:1;animation:skDraw 2.2s var(--ease) var(--d,0s) forwards}
@keyframes skDraw{to{stroke-dashoffset:0}}
.hero{overflow:hidden}
/* headline: word-by-word rise + highlighter sweep under the accent */
.hero h1 .w{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.08em;margin-bottom:-.08em}
.hero h1 .w>i{display:inline-block;font-style:normal;transform:translateY(110%);animation:wordUp .9s var(--ease) var(--d,0s) forwards}
@keyframes wordUp{to{transform:none}}
.hero h1 em{position:relative;display:inline-block;z-index:0}
.hero h1 em::before{content:"";position:absolute;left:-.06em;right:-.06em;bottom:.08em;height:.42em;background:linear-gradient(90deg,rgba(222,163,94,.32),rgba(222,163,94,.14));border-radius:.2em;z-index:-1;transform:scaleX(0);transform-origin:left;animation:hlSweep 1s var(--ease) 1.25s forwards}
@keyframes hlSweep{to{transform:scaleX(1)}}
/* floating stat chips with gentle drift + pointer parallax */
.hchip{position:absolute;z-index:4;display:flex;flex-direction:column;gap:.1rem;padding:.6rem .85rem;border-radius:14px;background:rgba(255,255,255,.72);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);border:1px solid rgba(255,255,255,.75);box-shadow:0 20px 40px -24px rgba(12,30,28,.45);color:var(--ink);font:500 .72rem/1.2 var(--sans);white-space:nowrap;transform:translate3d(var(--px,0),var(--py,0),0);transition:transform .6s var(--ease);pointer-events:none}
.hchip b{font:700 .95rem/1.1 var(--display);color:var(--ink)}
.hchip small{color:var(--ink-soft);font-size:.66rem}
.hchip--1{left:-6%;top:56%;animation:chipBob 6s ease-in-out infinite}
.hchip--2{left:2%;bottom:-3%;animation:chipBob 7s ease-in-out 1.5s infinite}
.hchip--3{right:-4%;top:38%;animation:chipBob 8s ease-in-out .8s infinite}
@keyframes chipBob{0%,100%{margin-top:0}50%{margin-top:-10px}}
html[data-theme="dark"] .hchip{background:rgba(22,39,31,.75);border-color:rgba(255,255,255,.1);color:var(--ink)}
html[data-theme="dark"] .hchip b{color:#fff}
@media (max-width:980px){.hchip--1{left:0;top:auto;bottom:-6%}.hchip--2{display:none}.hchip--3{right:0;top:2%}.hchip{font-size:.66rem;padding:.5rem .7rem}.hchip b{font-size:.85rem}}
@media (max-width:680px){.hchip{display:none}.skyline{height:70px;opacity:.4}.blob{filter:blur(40px)}}
@media (prefers-reduced-motion:reduce){.blob,.hchip,.sk,.hero h1 .w>i,.hero h1 em::before{animation:none!important}.sk{stroke-dashoffset:0}.hero h1 .w>i{transform:none}.hero h1 em::before{transform:none}}
.hchip--1{left:-8%;top:70%}
.hchip--3{right:-5%;top:34%}
/* ===== hero: two-person conversation (advisor left ↔ reviewer right, speech bubbles between them) ===== */
.hchat{display:none!important}
.herophoto.herostage img.hslide__person{right:2%;height:78%;max-width:54%}
.convo__adv{position:absolute;left:0;bottom:0;z-index:2;height:64%;width:auto;max-width:46%;object-fit:contain;object-position:left bottom;transform:scaleX(-1);filter:drop-shadow(0 26px 34px rgba(12,30,28,.26))}
.convo__tag{position:absolute;z-index:4;display:inline-flex;flex-direction:column;align-items:flex-start;gap:.05rem;padding:.4rem .7rem;border-radius:12px;background:rgba(255,255,255,.8);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.8);box-shadow:0 14px 28px -18px rgba(12,30,28,.4);color:var(--ink);font:600 .72rem/1.2 var(--sans);white-space:nowrap}
.convo__tag small{font-weight:500;color:var(--ink-soft);font-size:.64rem}
.convo__tag--adv{left:2%;bottom:30%;flex-direction:row;align-items:center;gap:.4rem}
.convo__tag--adv i{width:.5rem;height:.5rem;border-radius:50%;background:#2E9A7C;box-shadow:0 0 0 3px rgba(46,154,124,.25)}
.convo__tag--rev{right:2%;bottom:30%;align-items:flex-end;opacity:0}
.hslide.is-active .convo__tag--rev{animation:hmsgPop .5s var(--ease) .1s both}
html[data-theme="dark"] .convo__tag{background:rgba(22,39,31,.82);border-color:rgba(255,255,255,.1)}
.bub{position:absolute;z-index:5;max-width:58%;padding:.75rem .9rem;border-radius:18px;font:500 .8rem/1.4 var(--sans);box-shadow:0 24px 44px -26px rgba(12,30,28,.5);opacity:0;transform:translateY(10px) scale(.96)}
.hslide.is-active .bub{animation:hmsgPop .5s var(--ease) var(--d,0s) both}
.bub p{margin:0}
.bub::after{content:"";position:absolute;width:16px;height:16px;background:inherit;transform:rotate(45deg);border-radius:3px}
.bub--them{right:4%;top:2%;background:#fff;color:#11211C;border-bottom-right-radius:6px}
.bub--them::after{right:22px;bottom:-6px}
.bub--us{left:2%;top:22%;background:linear-gradient(120deg,#1C6D59,#2E9A7C);color:#fff;border-bottom-left-radius:6px}
.bub--us p{font-weight:600}
.bub--us::after{left:22px;bottom:-6px;background:#2a8f74}
.bub__meta{display:block;margin-top:.35rem;font-size:.62rem;opacity:.7}
.bub__meta em{font-style:normal;color:#DEA35E;letter-spacing:.06em;opacity:1}
.bub__meta svg{width:.8rem;height:.8rem;vertical-align:-2px;color:#9AD9C5}
.bub__tag{display:inline-block;margin-top:.4rem;font-size:.6rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:rgba(255,255,255,.2);border-radius:100px;padding:.2rem .55rem}
.bub--typing{left:2%;top:24%;display:inline-flex;gap:.3rem;padding:.7rem .85rem;background:#fff;border-bottom-left-radius:6px}
.bub--typing::after{left:18px;bottom:-6px}
.bub--typing i{width:.42rem;height:.42rem;border-radius:50%;background:#8A978F;animation:hdot 1s ease-in-out infinite}
.bub--typing i:nth-child(2){animation-delay:.15s}.bub--typing i:nth-child(3){animation-delay:.3s}
@keyframes hdot{0%,100%{transform:translateY(0);opacity:.35}50%{transform:translateY(-4px);opacity:.9}}
.hslide.is-active .bub--typing{animation:typingShow 1.2s var(--ease) 1.5s both}
@keyframes typingShow{0%{opacity:0;transform:translateY(10px) scale(.96)}20%,80%{opacity:1;transform:none}100%{opacity:0;transform:none}}
html[data-theme="dark"] .bub--them,html[data-theme="dark"] .bub--typing{background:#EEF4EF}
.hchip--1{left:auto;right:-8%;top:62%}
.hchip--3{right:-6%;top:12%}
.hchip--2{left:-4%;bottom:-4%}
@media (max-width:980px){
.herophoto.herostage img.hslide__person{right:0;height:70%;max-width:52%}
.convo__adv{height:58%;max-width:44%}
.bub{max-width:64%;font-size:.72rem;padding:.6rem .75rem}
.bub--them{top:0;right:2%}.bub--us,.bub--typing{top:24%}
.convo__tag{font-size:.66rem}
}
@media (max-width:680px){
.herophoto.herostage{aspect-ratio:4/4.6}
.herophoto.herostage img.hslide__person,.hslide.is-active .hslide__person{left:auto;right:0;margin:0;object-position:right bottom!important;top:auto;bottom:0;height:52%;max-width:50%}
.convo__adv{height:46%;max-width:46%}
.bub{max-width:80%;font-size:.72rem}
.bub--them{top:0;right:0}.bub--us,.bub--typing{top:30%;left:0}
.convo__tag--adv,.convo__tag--rev{bottom:48%}.convo__tag--rev{right:0}.convo__tag--adv{left:0}
.hslide::before{display:none}
}
@media (prefers-reduced-motion:reduce){.hslide.is-active .bub,.hslide.is-active .convo__tag--rev{animation:none;opacity:1;transform:none}.bub--typing{display:none}}
/* conversation layout tune-up */
.herophoto.herostage img.convo__adv{top:auto;left:0;right:auto;bottom:0;width:auto;height:58%;max-width:44%;object-fit:contain!important;object-position:left bottom!important}
.herophoto.herostage img.hslide__person{right:2%;height:74%;max-width:50%}
.bub--them{top:11%;right:2%;max-width:52%}
.bub--us,.bub--typing{top:31%;left:0;max-width:50%}
.convo__tag--adv{left:2%;bottom:24%}.convo__tag--rev{right:2%;bottom:22%}
.hchip--3{right:auto;left:-8%;top:8%}
@media (max-width:980px){.herophoto.herostage img.convo__adv{height:52%;max-width:42%}.herophoto.herostage img.hslide__person{height:66%;max-width:50%}.bub--them{top:9%}.bub--us,.bub--typing{top:32%}}
@media (max-width:680px){
.herophoto.herostage img.convo__adv{height:44%;max-width:46%}
.herophoto.herostage img.hslide__person,.hslide.is-active .hslide__person{height:50%;max-width:50%}
.bub--them{top:0;right:0;max-width:82%}.bub--us,.bub--typing{top:27%;left:0;max-width:78%}
.convo__tag--adv,.convo__tag--rev{bottom:46%}
}
@media (max-width:680px){.herostage .herobadge{display:none}}
/* conversation scene: compact sizing */
.herophoto.herostage{aspect-ratio:4/4.1}
.herophoto.herostage img.convo__adv{height:50%;max-width:38%}
.herophoto.herostage img.hslide__person{height:62%;max-width:42%;right:4%}
.bub{font-size:.72rem;padding:.6rem .75rem;border-radius:15px;box-shadow:0 18px 34px -22px rgba(12,30,28,.45)}
.bub::after{width:12px;height:12px}
.bub--them{top:14%;right:6%;max-width:46%}
.bub--us,.bub--typing{top:36%;left:4%;max-width:42%}
.bub--typing{padding:.55rem .7rem}
.bub__meta{font-size:.58rem;margin-top:.25rem}
.bub__tag{font-size:.55rem;margin-top:.3rem}
.convo__tag{font-size:.64rem;padding:.3rem .55rem;border-radius:10px}
.convo__tag small{font-size:.58rem}
.convo__tag--adv{left:4%;bottom:20%}.convo__tag--rev{right:4%;bottom:18%}
.hchip{font-size:.66rem;padding:.5rem .7rem}.hchip b{font-size:.84rem}
.hchip--1{right:-4%;top:58%}.hchip--3{left:-4%;top:12%}.hchip--2{left:0;bottom:0}
@media (max-width:980px){.herophoto.herostage img.convo__adv{height:46%;max-width:38%}.herophoto.herostage img.hslide__person{height:56%;max-width:42%}.bub--them{top:12%}.bub--us,.bub--typing{top:36%}}
@media (max-width:680px){
.herophoto.herostage{aspect-ratio:4/3.9}
.herophoto.herostage img.convo__adv{height:40%;max-width:40%}
.herophoto.herostage img.hslide__person,.hslide.is-active .hslide__person{height:46%;max-width:44%}
.bub{font-size:.68rem}.bub--them{top:0;right:0;max-width:76%}.bub--us,.bub--typing{top:30%;left:0;max-width:72%}
.convo__tag--adv,.convo__tag--rev{bottom:42%}
}
/* ===== hero v4: glass bento panel (chat · rating · progress · price), 3D tilt on hover ===== */
.hero__visual::before{display:none}
.bento{display:grid;grid-template-columns:1.28fr 1fr;grid-auto-rows:auto;gap:.85rem;perspective:1200px}
.tile{--rx:0deg;--ry:0deg;--gx:50%;--gy:50%;position:relative;border-radius:22px;padding:1.05rem 1.1rem;background:linear-gradient(160deg,rgba(255,255,255,.82),rgba(255,255,255,.62));backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);border:1px solid rgba(255,255,255,.8);box-shadow:0 30px 60px -34px rgba(12,30,28,.45),inset 0 1px 0 rgba(255,255,255,.9);color:var(--ink);transform:rotateX(var(--rx)) rotateY(var(--ry));transform-style:preserve-3d;transition:transform .35s var(--ease),box-shadow .35s;will-change:transform;overflow:hidden;opacity:0;translate:0 18px}
.tile::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(260px 200px at var(--gx) var(--gy),rgba(255,255,255,.55),transparent 70%);opacity:0;transition:opacity .3s}
.tile:hover::after{opacity:1}
.tile:hover{box-shadow:0 40px 70px -34px rgba(12,30,28,.55),inset 0 1px 0 rgba(255,255,255,.9)}
.hero__visual.in .tile{animation:tileIn .8s var(--ease) both}
.hero__visual.in .tile--chat{animation-delay:.05s}.hero__visual.in .tile--rating{animation-delay:.18s}.hero__visual.in .tile--status{animation-delay:.3s}.hero__visual.in .tile--price{animation-delay:.42s}
@keyframes tileIn{from{opacity:0;translate:0 18px}to{opacity:1;translate:0 0}}
html[data-theme="dark"] .tile{background:linear-gradient(160deg,rgba(22,39,31,.86),rgba(18,33,29,.7));border-color:rgba(255,255,255,.1);box-shadow:0 30px 60px -34px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.06)}
html[data-theme="dark"] .tile::after{background:radial-gradient(260px 200px at var(--gx) var(--gy),rgba(62,199,162,.16),transparent 70%)}
.tile--chat{grid-row:1/3;display:flex;flex-direction:column;min-height:300px}
.tile--price{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.tile__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.7rem}
.tile__live{display:inline-flex;align-items:center;gap:.4rem;font:600 .66rem/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
.tile__live i{width:.5rem;height:.5rem;border-radius:50%;background:#2E9A7C;box-shadow:0 0 0 0 rgba(46,154,124,.5);animation:livePulse 2s ease-out infinite}
@keyframes livePulse{to{box-shadow:0 0 0 8px rgba(46,154,124,0)}}
.tile__pill{font:700 .7rem/1 var(--sans);color:var(--gold-d);background:rgba(222,163,94,.16);border-radius:100px;padding:.35em .6em}
.tile__kicker{display:block;font:600 .66rem/1.2 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
.tile__big{display:block;font:600 2.6rem/1 var(--display);letter-spacing:-.03em;margin:.35rem 0 .15rem}
.tile__big small{font-size:.9rem;color:var(--ink-soft);font-weight:500;letter-spacing:0}
.tile__stars{display:block;color:var(--gold);letter-spacing:.12em;font-size:.82rem}
.tile__link{display:inline-block;margin-top:.55rem;font:600 .74rem/1 var(--sans);color:var(--emerald);text-decoration:none}
.tile__link:hover{text-decoration:underline}
.tile__price{display:block;font:600 1.35rem/1.1 var(--display);margin:.25rem 0 .2rem}
.tile--price small{display:block;color:var(--ink-soft);font-size:.74rem}
.tile--price .btn{flex:0 0 auto;padding:.7rem 1.1rem;font-size:.84rem}
/* chat tile */
.bchat{position:relative;flex:1;min-height:208px}
.bslide{position:absolute;inset:0;display:flex;flex-direction:column;gap:.45rem}
.bslide__who{display:flex;align-items:center;gap:.55rem;margin-bottom:.15rem}
.bslide__who img,.bslide__av{width:2.1rem;height:2.1rem;border-radius:50%;object-fit:cover;object-position:50% 6%;background:#DCE9E1;flex:0 0 auto;box-shadow:0 0 0 2px rgba(255,255,255,.9)}
.bslide__av{display:grid;place-items:center;font:700 .68rem/1 var(--sans);color:#1C6D59}
.bslide__who b{display:block;font-size:.82rem;font-weight:700;line-height:1.15}
.bslide__who span{display:block;font-size:.64rem;color:var(--ink-soft)}
.bslide__who em{font-style:normal;color:var(--gold);letter-spacing:.06em}
.bslide__who time{margin-left:auto;font-size:.62rem;color:var(--ink-faint,#8A978F)}
.bmsg{max-width:88%;padding:.55rem .7rem;border-radius:14px;font:500 .76rem/1.4 var(--sans);opacity:0;transform:translateY(8px) scale(.97)}
.hslide.is-active .bmsg{animation:hmsgPop .45s var(--ease) var(--d,0s) both}
.bmsg p{margin:0}
.bmsg--them{align-self:flex-start;background:#fff;color:#11211C;border-bottom-left-radius:4px;box-shadow:0 2px 8px -4px rgba(12,30,28,.3)}
.bmsg--us{align-self:flex-end;background:linear-gradient(120deg,#1C6D59,#2E9A7C);color:#fff;border-bottom-right-radius:4px}
.bmsg--us p{font-weight:600}
.bmsg time{display:block;text-align:right;font-size:.58rem;opacity:.7;margin-top:.15rem}
.bmsg time svg{width:.75rem;height:.75rem;vertical-align:-2px;color:#9AD9C5}
.bmsg__tag{display:inline-block;margin-top:.3rem;font-size:.56rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:rgba(255,255,255,.2);border-radius:100px;padding:.18rem .5rem}
.bmsg--typing{align-self:flex-start;display:inline-flex;gap:.28rem;padding:.6rem .75rem;background:#fff;border-bottom-left-radius:4px}
.bmsg--typing i{width:.38rem;height:.38rem;border-radius:50%;background:#8A978F;animation:hdot 1s ease-in-out infinite}
.bmsg--typing i:nth-child(2){animation-delay:.15s}.bmsg--typing i:nth-child(3){animation-delay:.3s}
.hslide.is-active .bmsg--typing{animation:typingShow 1.1s var(--ease) 1.2s both}
html[data-theme="dark"] .bmsg--them,html[data-theme="dark"] .bmsg--typing{background:#EEF4EF}
.bchat__foot{display:flex;align-items:center;gap:.5rem;margin-top:.6rem;padding-top:.6rem;border-top:1px solid var(--line)}
.bchat__foot span{flex:1;font-size:.7rem;color:var(--ink-faint,#8A978F);background:rgba(17,33,28,.05);border-radius:100px;padding:.45rem .75rem}
html[data-theme="dark"] .bchat__foot span{background:rgba(255,255,255,.06)}
.bchat__foot b{width:1.8rem;height:1.8rem;border-radius:50%;background:var(--emerald);color:#fff;display:grid;place-items:center}
.bchat__foot b svg{width:.8rem;height:.8rem}
/* progress ring tile */
.tile--status{display:flex;align-items:center;gap:.9rem}
.ring{position:relative;width:5rem;height:5rem;flex:0 0 auto}
.ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:7;stroke-linecap:round}
.ring__bg{stroke:rgba(17,33,28,.08)}
html[data-theme="dark"] .ring__bg{stroke:rgba(255,255,255,.1)}
.ring__fg{stroke:url(#ringGrad),#24846C;stroke:#24846C;stroke-dasharray:100;stroke-dashoffset:100}
.hero__visual.in .ring__fg{animation:ringFill 1.6s var(--ease) .6s forwards}
@keyframes ringFill{to{stroke-dashoffset:25}}
.ring b{position:absolute;inset:0;display:grid;place-items:center;font:600 1.3rem/1 var(--display)}
.ring b small{font-size:.7rem;color:var(--ink-soft);font-weight:500}
.steps-mini{list-style:none;margin:0;padding:0;display:grid;gap:.3rem;font:500 .74rem/1.2 var(--sans)}
.steps-mini li{display:flex;align-items:center;gap:.45rem}
.steps-mini li::before{content:"✓";width:1rem;height:1rem;border-radius:50%;display:grid;place-items:center;font-size:.6rem;font-weight:700;background:#24846C;color:#fff;flex:0 0 auto}
.steps-mini li.wip::before{content:"";background:var(--gold);box-shadow:0 0 0 3px rgba(222,163,94,.25);animation:livePulse 1.8s ease-out infinite}
.steps-mini li.wip{color:var(--ink-soft)}
/* retire previous hero layers */
.hchip,.convo__adv,.convo__tag,.heropill,.herobadge{display:none!important}
@media (max-width:980px){.bento{grid-template-columns:1fr 1fr}.tile--chat{grid-column:1/-1;grid-row:auto;min-height:0}.tile--price{flex-wrap:wrap}}
@media (max-width:520px){.bento{grid-template-columns:1fr;gap:.7rem}.tile{padding:.95rem 1rem;border-radius:18px}.tile--status{gap:.7rem}.tile__big{font-size:2.2rem}.tile--price .btn{width:100%;justify-content:center}}
@media (prefers-reduced-motion:reduce){.tile,.ring__fg,.tile__live i,.steps-mini li.wip::before{animation:none!important}.tile{opacity:1;translate:0 0;transform:none}.ring__fg{stroke-dashoffset:25}.hslide.is-active .bmsg{animation:none;opacity:1;transform:none}.bmsg--typing{display:none}}
.tile--chat{min-height:350px}
.bchat{min-height:252px}
.tile--chat{min-height:392px}
.bchat{min-height:292px}
@media (max-width:980px){.tile--chat{min-height:0}.bchat{min-height:270px}}
/* ===== hero v5: licence builder card ===== */
.bento{display:none!important}
.lic{--rx:0deg;--ry:0deg;--gx:50%;--gy:50%;position:relative;border-radius:26px;overflow:hidden;background:var(--card);border:1px solid var(--line);box-shadow:0 50px 100px -50px rgba(12,30,28,.55);transform:rotateX(var(--rx)) rotateY(var(--ry));transform-style:preserve-3d;transition:transform .4s var(--ease);will-change:transform;color:var(--ink)}
.hero__visual{perspective:1400px}
.lic__photo{position:relative;height:clamp(120px,15vw,170px);overflow:hidden}
.lic__photo img{width:100%;height:100%;object-fit:cover;object-position:50% 45%;transform:scale(1.06);transition:transform 6s linear}
.hero__visual.in .lic__photo img{transform:scale(1)}
.lic__photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,30,28,.05),rgba(12,30,28,.45))}
.lic__photo-cap{position:absolute;left:1rem;bottom:.85rem;z-index:2;display:inline-flex;align-items:center;gap:.45rem;padding:.4em .8em;border-radius:100px;background:rgba(255,255,255,.18);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.4);color:#fff;font:600 .72rem/1 var(--sans)}
.lic__photo-cap i{width:.5rem;height:.5rem;border-radius:50%;background:#3EC7A2;box-shadow:0 0 0 0 rgba(62,199,162,.6);animation:livePulse 2s ease-out infinite}
.lic__doc{position:relative;padding:1.1rem 1.3rem 1.2rem;background:
radial-gradient(120% 90% at 100% 0%,rgba(222,163,94,.10),transparent 55%),
repeating-linear-gradient(0deg,transparent 0 18px,rgba(17,33,28,.035) 18px 19px),var(--card)}
.lic__head{display:flex;align-items:center;justify-content:space-between;gap:.8rem;font:600 .66rem/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);padding-bottom:.7rem;border-bottom:1px dashed var(--line)}
.lic__brand{display:inline-flex;align-items:center;gap:.4rem}
.lic__brand img{width:1.05rem;height:1.05rem;object-fit:contain}
.lic__no b{color:var(--ink);letter-spacing:.04em;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.lic__title{font:600 1.45rem/1.1 var(--display);margin:.85rem 0 .7rem;letter-spacing:-.01em}
.lic__title small{font:500 .78rem var(--sans);color:var(--ink-soft);letter-spacing:0}
.lic__fields{margin:0;display:grid;gap:.5rem;max-width:68%}
.lic__fields>div{display:grid;grid-template-columns:5.6rem 1fr;align-items:baseline;gap:.6rem}
.lic__fields dt{font:600 .64rem/1.2 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
.lic__fields dd{margin:0;font:600 .92rem/1.25 var(--sans);min-height:1.2em;border-bottom:1px solid var(--line);padding-bottom:.25rem}
.lic__fields dd.is-typing::after{content:"";display:inline-block;width:2px;height:.95em;background:var(--emerald);margin-left:2px;vertical-align:-2px;animation:caret 1s steps(2) infinite}
@keyframes caret{50%{opacity:0}}
.lic__qr{position:absolute;right:1.3rem;top:4.1rem;width:3.1rem;height:3.1rem;display:grid;grid-template-columns:repeat(7,1fr);gap:1px;padding:3px;background:#fff;border:1px solid var(--line);border-radius:6px}
.lic__qr i{display:block;border-radius:1px;background:transparent}
.lic__qr i.on{background:#11211C}
html[data-theme="dark"] .lic__qr{background:#EEF4EF}
.lic__stamp{position:absolute;right:1.2rem;top:8.6rem;width:6.6rem;height:6.6rem;border-radius:50%;border:3px double var(--gold-d);color:var(--gold-d);display:grid;place-content:center;text-align:center;transform:rotate(-14deg) scale(2.2);opacity:0;mix-blend-mode:multiply;pointer-events:none}
.lic__stamp span{display:block;font:800 1.05rem/1 var(--display);letter-spacing:.14em;text-transform:uppercase}
.lic__stamp small{display:block;font:600 .58rem/1.3 var(--sans);letter-spacing:.06em;margin-top:.2rem}
.lic__stamp::before{content:"";position:absolute;inset:7px;border-radius:50%;border:1px solid var(--gold-d);opacity:.6}
.lic__stamp.in{animation:stampIn .5s cubic-bezier(.2,1.4,.4,1) forwards}
@keyframes stampIn{from{transform:rotate(-14deg) scale(2.2);opacity:0}60%{opacity:.95}to{transform:rotate(-14deg) scale(1);opacity:.9}}
html[data-theme="dark"] .lic__stamp{mix-blend-mode:normal;color:var(--gold);border-color:var(--gold)}
.lic.is-issued{box-shadow:0 50px 100px -50px rgba(12,30,28,.55),0 0 0 6px rgba(222,163,94,.12)}
.lic__steps{list-style:none;margin:1.1rem 0 0;padding:.8rem 0 0;border-top:1px dashed var(--line);display:grid;grid-template-columns:repeat(4,1fr);gap:.4rem;counter-reset:st}
.lic__steps li{position:relative;padding-left:1.45rem;font:600 .68rem/1.2 var(--sans);color:var(--ink-faint,#8A978F)}
.lic__steps li::before{content:"";position:absolute;left:0;top:0;width:1.05rem;height:1.05rem;border-radius:50%;border:1.5px solid var(--line);background:transparent;transition:background .3s,border-color .3s}
.lic__steps li.wip{color:var(--ink)}
.lic__steps li.wip::before{border-color:var(--gold);box-shadow:0 0 0 3px rgba(222,163,94,.22);animation:livePulse 1.6s ease-out infinite}
.lic__steps li.ok{color:var(--ink)}
.lic__steps li.ok::before{content:"✓";background:var(--emerald);border-color:var(--emerald);color:#fff;font-size:.6rem;font-weight:700;display:grid;place-items:center}
.lic__zones{border-top:1px solid var(--line);background:var(--block);padding:.7rem 1.3rem .75rem}
.lic__zones>span{display:block;font:600 .6rem/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.5rem}
.lic__logos{overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.lic__logos>div{display:flex;gap:1.6rem;width:max-content;animation:licMq 40s linear infinite}
.lic__logos img{height:22px;width:auto;object-fit:contain;opacity:.85}
html[data-theme="dark"] .lic__logos img{filter:grayscale(1) invert(1) brightness(1.25);opacity:.7}
@keyframes licMq{to{transform:translateX(-50%)}}
.hero__visual.in .lic{animation:tileIn .9s var(--ease) both}
@media (max-width:980px){.lic__fields{max-width:100%}.lic__qr{display:none}.lic__stamp{top:auto;bottom:5.4rem;right:1rem;width:5.4rem;height:5.4rem}.lic__stamp span{font-size:.85rem}}
@media (max-width:520px){.lic__doc{padding:1rem 1rem 1.1rem}.lic__steps{grid-template-columns:1fr 1fr}.lic__fields>div{grid-template-columns:4.6rem 1fr}.lic__fields dd{font-size:.84rem}.lic__stamp{bottom:6.2rem;right:.6rem;width:4.8rem;height:4.8rem}.lic__title{font-size:1.25rem}}
@media (prefers-reduced-motion:reduce){.lic,.lic__logos>div,.lic__photo img,.lic__photo-cap i,.lic__steps li.wip::before{animation:none!important;transition:none!important}.lic__stamp{opacity:.9;transform:rotate(-14deg)}}
.hero__visual,.lic,.lic__zones,.lic__logos{min-width:0}
.cdetail .cdetail__v{text-decoration:none;color:inherit}
.cdetail a.cdetail__v:hover{color:var(--emerald)}
/* calculator: primary CTA lives at the end of the form; the estimate card keeps a quiet secondary one */
.calc__actions{margin-top:1.4rem;padding-top:1.2rem;border-top:1px solid var(--line);display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.calc__actions .btn{flex:1 1 auto;justify-content:center}
.calc__hint{font-size:.78rem;color:var(--ink-soft);flex:1 1 14rem}
.calc__cardbtn{width:100%;justify-content:center}
@media (max-width:980px){.calc__cardbtn{display:none}}
/* ===== hero v6: founder carousel (frameless person + two floating status cards) ===== */
.lic,.bento{display:none!important}
.fc{position:relative;aspect-ratio:4/4.3;min-width:0}
.fc::before{content:"";position:absolute;left:50%;bottom:-4%;width:92%;height:70%;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(36,132,108,.22),rgba(36,132,108,0));pointer-events:none}
html[data-theme="dark"] .fc::before{background:radial-gradient(closest-side,rgba(52,164,136,.3),rgba(52,164,136,0))}
.fc__slides{position:absolute;inset:0}
.fc__slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .8s var(--ease),visibility .8s}
.fc__slide.is-active{opacity:1;visibility:visible}
.fc__person{position:absolute;right:0;bottom:0;height:88%;width:auto;max-width:66%;object-fit:contain;object-position:right bottom;filter:drop-shadow(0 30px 40px rgba(12,30,28,.3));transform:translateY(14px) scale(.98);transition:transform .9s var(--ease)}
.fc__slide.is-active .fc__person{transform:none}
.fcard{position:absolute;z-index:3;background:#F4F9F5;color:#11211C;border-radius:16px;border:1px solid rgba(255,255,255,.75);box-shadow:0 30px 60px -28px rgba(12,30,28,.5),inset 0 2px 0 rgba(255,255,255,.6);padding:.85rem .95rem;font:500 .74rem/1.35 var(--sans);opacity:0}
.fc__slide.is-active .fcard{animation:hcardIn .7s var(--ease) both}
.fc__slide.is-active .fcard--b{animation-delay:.25s}
.fcard--a{--rot:-4deg;left:0;top:14%;width:min(58%,290px)}
.fcard--b{--rot:3deg;right:-2%;bottom:6%;width:min(62%,310px)}
.fcard__who{display:flex;align-items:flex-start;gap:.6rem;margin-bottom:.7rem}
.fcard__who b{display:block;font-size:.86rem;font-weight:700;line-height:1.2}
.fcard__who span{display:block;color:#586761;font-size:.68rem;line-height:1.3}
.fcard__av{position:relative;width:2rem;height:2rem;border-radius:50%;background:#DCE9E1;color:#1C6D59;display:grid;place-items:center;font:700 .66rem/1 var(--sans);flex:0 0 auto}
.fcard__av i{position:absolute;right:-1px;bottom:-1px;width:.55rem;height:.55rem;border-radius:50%;background:#2E9A7C;border:2px solid #F4F9F5}
.fcard__wf{background:#FBF1E3;border-left:3px solid #C6893F;border-radius:10px;padding:.6rem .7rem}
.fcard__wfhead{display:flex;justify-content:space-between;gap:.5rem;font-size:.58rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#8A6A3F;margin-bottom:.3rem}
.fcard__wfhead span:last-child{letter-spacing:0;text-transform:none;font-weight:500;color:#9A8468}
.fcard__wf>b{display:block;color:#C6893F;font-size:.8rem;font-weight:700}
.fcard__wf>span{display:block;color:#7A6246;font-size:.66rem;margin:.1rem 0 .45rem}
.fcard__bar{height:.38rem;border-radius:100px;background:rgba(198,137,63,.18);overflow:hidden}
.fcard__bar i{display:block;height:100%;border-radius:100px;background:linear-gradient(90deg,#C6893F,#DEA35E)}
.fc__slide.is-active .fcard__bar i{animation:hbar 1.2s var(--ease) .4s both}
.fcard__next{display:flex;align-items:center;gap:.4rem;margin-top:.6rem;color:#586761;font-size:.7rem}
.fcard__next i{width:.42rem;height:.42rem;border-radius:50%;background:#C6893F;flex:0 0 auto}
.fcard__nhead{display:flex;align-items:center;gap:.5rem}
.fcard__nhead b{font-size:.8rem;font-weight:700;line-height:1.25;flex:1}
.fcard__nhead>span:last-child{color:#8A978F;font-size:.62rem;white-space:nowrap}
.fcard__chk{width:1.25rem;height:1.25rem;border-radius:50%;border:2px solid #C6893F;color:#C6893F;display:grid;place-items:center;flex:0 0 auto}
.fcard__chk svg{width:.7rem;height:.7rem}
.fcard__ref{color:#586761;font-size:.68rem;margin:.45rem 0 .5rem}
.fcard__file{display:flex;align-items:center;gap:.55rem;background:#FBF1E3;border-radius:10px;padding:.5rem .6rem}
.fcard__file b{display:block;font-size:.72rem;font-weight:700;word-break:break-all}
.fcard__file span{display:block;color:#7A6246;font-size:.64rem}
.fcard__fic{width:1.6rem;height:1.6rem;border-radius:8px;background:#fff;color:#C6893F;display:grid;place-items:center;flex:0 0 auto}
.fcard__fic svg{width:.9rem;height:.9rem}
.fcard__link{display:inline-block;margin-top:.55rem;color:#C6893F;font-weight:700;font-size:.72rem;text-decoration:none}
@media (max-width:980px){.fc{aspect-ratio:4/4.2}.fc__person{height:82%;max-width:62%}.fcard{font-size:.68rem;padding:.7rem .8rem}.fcard--a{width:min(56%,260px);top:10%}.fcard--b{width:min(60%,270px);bottom:4%}}
@media (max-width:680px){
.fc{aspect-ratio:4/4.6}
.fc__person{right:0;height:70%;max-width:64%;object-position:right bottom}
.fcard{font-size:.62rem;padding:.6rem .7rem;border-radius:13px}
.fcard--a{left:0;top:2%;width:min(60%,240px)}.fcard--b{right:0;bottom:2%;width:min(64%,250px)}
.fcard__who b{font-size:.74rem}.fcard__wf>b{font-size:.7rem}.fcard__nhead b{font-size:.7rem}.fcard__av{width:1.7rem;height:1.7rem}
}
@media (prefers-reduced-motion:reduce){.fc__slide.is-active .fcard,.fc__slide.is-active .fcard__bar i{animation:none;opacity:1;transform:rotate(var(--rot,0deg))}.fc__person{transition:none;transform:none}}
@media (max-width:680px){.fc{aspect-ratio:4/4.8}.fc__person{right:-4%;height:78%;max-width:74%}.fcard--a{top:0;width:min(58%,230px)}.fcard--b{bottom:0;width:min(62%,240px)}}
/* hero v6 cards — Biznexa copy: setup timeline card + approved-document card */
.fcard--a{--rot:-3deg;left:0;top:12%;width:min(60%,300px);padding:.9rem 1rem}
.fcard--b{--rot:2.5deg;right:-2%;bottom:7%;width:min(58%,290px);padding:.9rem 1rem .95rem}
.fcard__top{display:flex;align-items:center;gap:.6rem;margin-bottom:.75rem}
.fcard__top b{display:block;font-size:.86rem;font-weight:700;line-height:1.15}
.fcard__top>div>span{display:block;color:#586761;font-size:.66rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}
.fcard__chip{margin-left:auto;font:700 .56rem/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:#1C6D59;background:#DCE9E1;border-radius:100px;padding:.35em .6em;white-space:nowrap;font-style:normal}
.fcard__tl{list-style:none;margin:0;padding:0 0 0 1.1rem;position:relative;display:grid;gap:.45rem}
.fcard__tl::before{content:"";position:absolute;left:.33rem;top:.5rem;bottom:.5rem;width:2px;background:#DCE9E1;border-radius:2px}
.fcard__tl li{position:relative;display:flex;justify-content:space-between;gap:.6rem;font-size:.72rem;line-height:1.3;opacity:0}
.fc__slide.is-active .fcard__tl li{animation:hmsgPop .4s var(--ease) calc(.35s + var(--i) * .18s) both}
.fcard__tl li::before{content:"";position:absolute;left:-1.1rem;top:.18rem;width:.8rem;height:.8rem;border-radius:50%;background:#24846C;border:2px solid #F4F9F5;box-shadow:0 0 0 1px #24846C}
.fcard__tl li.ok::before{background:#24846C url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/60% no-repeat}
.fcard__tl li.now{font-weight:700;color:#C6893F}
.fcard__tl li.now::before{background:#fff;box-shadow:0 0 0 1px #C6893F,0 0 0 4px rgba(198,137,63,.22);animation:livePulse 1.6s ease-out infinite}
.fcard__tl li small{color:#8A978F;font-weight:500;white-space:nowrap}
.fcard__tl li.now small{color:#C6893F}
.fcard__eta{display:flex;align-items:center;gap:.4rem;margin-top:.7rem;padding-top:.6rem;border-top:1px dashed rgba(17,33,28,.12);font-size:.68rem;color:#586761}
.fcard__eta svg{width:.85rem;height:.85rem;color:#24846C;flex:0 0 auto}
.fcard__seal{width:2.2rem;height:2.2rem;border-radius:50%;background:linear-gradient(135deg,#1C6D59,#2E9A7C);color:#fff;display:grid;place-items:center;margin-bottom:.6rem;box-shadow:0 8px 18px -8px rgba(28,109,89,.7)}
.fcard__seal svg{width:1rem;height:1rem}
.fcard__doc b{display:block;font-size:.84rem;font-weight:700;line-height:1.2}
.fcard__doc span{display:block;color:#586761;font-size:.68rem;line-height:1.4;margin-top:.2rem}
.fcard__doc code{display:inline-block;margin-top:.45rem;font:600 .62rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:#1C6D59;background:#EEF4EF;border-radius:6px;padding:.35em .5em;letter-spacing:.04em}
.fcard__cta{display:inline-flex;align-items:center;gap:.3rem;margin-top:.7rem;font:700 .7rem/1 var(--sans);color:#C6893F;text-decoration:none}
.fcard__cta svg{width:.8rem;height:.8rem}
.fcard__who,.fcard__wf,.fcard__next,.fcard__nhead,.fcard__ref,.fcard__file,.fcard__link{display:none}
@media (max-width:680px){.fcard--a{top:0;width:min(62%,240px);padding:.7rem .75rem}.fcard--b{bottom:0;width:min(60%,235px);padding:.7rem .75rem}.fcard__tl li{font-size:.64rem}.fcard__top>div>span{max-width:110px}}
/* hero v6.2 — overlap fixes + creative layer */
.fcard__top{position:relative;padding-right:0;flex-wrap:wrap}
.fcard__top>div{flex:1;min-width:0}
.fcard__top>div>span{white-space:normal;overflow:visible;text-overflow:clip;max-width:none}
.fcard__chip{margin-left:0;flex:0 0 auto;order:-1;width:100%;width:auto;position:absolute;right:0;top:-.1rem}
.fcard__top>div>b{padding-right:7.2rem}
.fcard__tl{padding-left:1.25rem}
.fcard__tl li{align-items:baseline}
.fcard__tl li::before{top:.12rem;width:.78rem;height:.78rem}
.fcard__tl li.now::before{animation:nowPulse 1.6s ease-out infinite;box-shadow:0 0 0 1px #C6893F}
@keyframes nowPulse{0%{box-shadow:0 0 0 1px #C6893F,0 0 0 0 rgba(198,137,63,.35)}100%{box-shadow:0 0 0 1px #C6893F,0 0 0 6px rgba(198,137,63,0)}}
.fcard__tl li small{align-self:baseline;line-height:inherit}
.fc{--px:0px;--py:0px}
.fc__slides{transform:translate3d(var(--px),var(--py),0);transition:transform .5s var(--ease)}
.fc__person{transform:translate3d(calc(var(--px) * -.6),calc(var(--py) * -.6),0)}
.fc__slide.is-active .fc__person{transform:translate3d(calc(var(--px) * -.6),calc(var(--py) * -.6),0)}
.fc__orbit{position:absolute;left:50%;top:52%;width:92%;aspect-ratio:1;transform:translate(-50%,-50%);pointer-events:none;z-index:0}
.fc__orbit i{position:absolute;inset:0;border-radius:50%;border:1.5px dashed rgba(36,132,108,.28);animation:orbitSpin 60s linear infinite}
.fc__orbit i:nth-child(2){inset:12%;border-style:solid;border-color:rgba(222,163,94,.22);animation-direction:reverse;animation-duration:45s}
.fc__orbit i::after{content:"";position:absolute;top:-6px;left:50%;width:11px;height:11px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 5px rgba(222,163,94,.18)}
.fc__orbit i:nth-child(2)::after{background:var(--emerald);box-shadow:0 0 0 5px rgba(36,132,108,.16);top:auto;bottom:-6px}
@keyframes orbitSpin{to{transform:rotate(360deg)}}
html[data-theme="dark"] .fc__orbit i{border-color:rgba(62,199,162,.3)}html[data-theme="dark"] .fc__orbit i:nth-child(2){border-color:rgba(228,176,114,.28)}
.fc__badge{position:absolute;z-index:4;left:34%;bottom:3%;display:inline-flex;align-items:center;gap:.4rem;padding:.5em .85em;border-radius:100px;background:linear-gradient(120deg,#0C1E1C,#2E9A7C);color:#fff;font:600 .7rem/1 var(--sans);box-shadow:0 14px 30px -14px rgba(12,30,28,.6);opacity:0;white-space:nowrap}
.fc__badge svg{width:.85rem;height:.85rem;color:var(--gold)}
.fc__slide.is-active .fc__badge{animation:badgeIn .6s cubic-bezier(.2,1.3,.4,1) 1.1s both}
@keyframes badgeIn{from{opacity:0;transform:translateY(10px) scale(.8)}to{opacity:1;transform:none}}
.fc__dots{position:absolute;left:0;bottom:-2.2rem;display:flex;gap:.4rem;z-index:5}
.fc__dots button{width:.55rem;height:.55rem;border-radius:100px;border:0;background:rgba(17,33,28,.18);cursor:pointer;padding:0;transition:width .35s var(--ease),background .3s}
.fc__dots button.is-on{width:1.6rem;background:var(--emerald)}
html[data-theme="dark"] .fc__dots button{background:rgba(237,241,236,.22)}html[data-theme="dark"] .fc__dots button.is-on{background:var(--emerald)}
@media (max-width:680px){.fc__badge{left:0;bottom:30%;font-size:.62rem}.fc__dots{bottom:-1.6rem;left:50%;transform:translateX(-50%)}.fcard__top>div>b{padding-right:0}.fcard__chip{position:static;order:3;margin-top:.3rem}}
@media (prefers-reduced-motion:reduce){.fc__orbit i,.fcard__tl li.now::before{animation:none}.fc__slide.is-active .fc__badge{animation:none;opacity:1}}
@media (max-width:680px){
.fcard--a{width:min(66%,250px)}
.fcard__top{flex-wrap:nowrap;padding-right:0}
.fcard__top>div>b{padding-right:0;font-size:.74rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fcard__top>div>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}
.fcard__chip{position:static;order:0;margin:0 0 0 auto;font-size:.5rem;padding:.3em .5em}
.fc__badge{left:auto;right:0;bottom:36%}
}
@media (max-width:680px){.fc__badge{left:auto;right:0;bottom:auto;top:30%;font-size:.6rem}}
@media (max-width:680px){.fc__badge{display:none}}
/* showcase frame: landscape to fit the wide skyline photo */
.show__img{aspect-ratio:16/10}
.show__img img{top:0;height:100%;object-position:50% 40%}
@media (max-width:980px){.show__stage{max-width:none}}
/* banking banner: keep the card + hand in frame */
.bizbanner--svc img[src*="svc-banking2"]{object-position:50% 72%}
.bizbanner--svc img[src*="svc-pro2"]{object-position:50% 42%}
.bizbanner--svc img[src*="svc-vat2"]{object-position:50% 58%}
.bizbanner--svc img[src*="svc-sponsor2"]{object-position:50% 40%}
/* about hero: client aerial Downtown photo */
body[data-page="about"] .phero__panel{background:linear-gradient(110deg,rgba(9,20,18,.9) 0%,rgba(12,30,28,.66) 46%,rgba(28,109,89,.32) 100%),url("../assets/about-downtown.webp") center 42%/cover no-repeat}
.bizbanner img[src*="about-team2"]{object-position:50% 55%}
.reviews__person{transition:opacity .42s ease,transform .42s ease}
.reviews__person.is-swap{opacity:0;transform:translateX(-51%) translateY(10px)}
@media (max-width:980px){.reviews__person.is-swap{transform:translateY(10px)}}
.bizbanner--svc img[src*="svc-banking3"]{object-position:50% 30%}
.bizbanner--svc img[src*="svc-vat3"]{object-position:60% 35%}
/* no highlighter bar behind the hero accent */
.hero h1 em::before{display:none!important}
/* estimate-card secondary button: readable in both themes (was paper bg + dark ink → invisible in dark mode) */
.calc__card .calc__cardbtn{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.45);box-shadow:none}
.calc__card .calc__cardbtn:hover{background:#fff;color:#0C1E1C;border-color:#fff}
.bizbanner--svc img[src*="svc-sponsor3"]{object-position:55% 38%}
/* light photos: deeper scrim behind the caption */
.bizbanner--light::before{background:linear-gradient(90deg,rgba(12,30,28,.72) 0%,rgba(12,30,28,.38) 34%,rgba(12,30,28,0) 58%),linear-gradient(0deg,rgba(12,30,28,.55) 0%,rgba(12,30,28,0) 45%)!important}
/* ===== hero v7: Dubai arch window (replaces the founder carousel — nothing in common with firstchapter.ae) ===== */
.fc{display:none!important}
.arch{position:relative;width:min(100%,470px);margin-left:auto;margin-right:clamp(0px,2vw,24px);padding:0 0 3.2rem 2.4rem}
.arch__pattern{position:absolute;left:0;bottom:1.2rem;width:72%;height:62%;border-radius:22px;z-index:0;opacity:.9;
background-color:rgba(222,163,94,.10);
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44'%3E%3Cg fill='none' stroke='%23C6893F' stroke-opacity='.55' stroke-width='1.1'%3E%3Cpath d='M22 2l6 14 14 6-14 6-6 14-6-14-14-6 14-6z'/%3E%3Ccircle cx='22' cy='22' r='5'/%3E%3C/g%3E%3C/svg%3E");
background-size:44px 44px;-webkit-mask:linear-gradient(135deg,#000 30%,transparent 95%);mask:linear-gradient(135deg,#000 30%,transparent 95%)}
html[data-theme="dark"] .arch__pattern{background-color:rgba(228,176,114,.07);opacity:.75}
.arch__frame{position:relative;z-index:1;aspect-ratio:4/5.1;border-radius:999px 999px 26px 26px;overflow:hidden;box-shadow:0 50px 90px -45px rgba(12,30,28,.6);background:#0C1E1C}
.arch__frame::after{content:"";position:absolute;inset:10px;border-radius:999px 999px 18px 18px;border:1px solid rgba(255,255,255,.55);pointer-events:none;z-index:3}
.arch__frame::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(12,30,28,0) 55%,rgba(12,30,28,.55) 100%)}
.arch__imgs{position:absolute;inset:0}
.arch__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.12);transition:opacity 1.4s ease,transform 7s linear}
.arch__img.is-active{opacity:1;transform:scale(1)}
.arch__cap{position:absolute;z-index:4;left:50%;bottom:1.4rem;transform:translateX(-50%);display:inline-flex;align-items:center;gap:.45rem;white-space:nowrap;padding:.45em .9em;border-radius:100px;background:rgba(255,255,255,.16);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.35);color:#fff;font:600 .74rem/1 var(--sans);transition:opacity .35s ease}
.arch__cap.is-swap{opacity:0}
.arch__cap i{width:.45rem;height:.45rem;border-radius:50%;background:var(--gold)}
.seal{position:absolute;z-index:3;left:0;top:38%;width:7.4rem;height:7.4rem;border-radius:50%;background:var(--emerald-ink);color:#fff;display:grid;place-items:center;box-shadow:0 24px 44px -20px rgba(12,30,28,.7)}
html[data-theme="dark"] .seal{background:#E4B072;color:#0C1E1C}
.seal__ring{position:absolute;inset:0;width:100%;height:100%;animation:sealSpin 22s linear infinite}
.seal__ring text{font:700 9.2px/1 var(--sans);letter-spacing:.24em;fill:currentColor;opacity:.85}
@keyframes sealSpin{to{transform:rotate(360deg)}}
.seal__core{position:relative;text-align:center;line-height:1}
.seal__core small{display:block;font:600 .56rem/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;opacity:.75;margin-bottom:.2rem}
.seal__core b{font:700 1.35rem/1 var(--display);color:var(--gold)}
html[data-theme="dark"] .seal__core b{color:#0C1E1C}
.arch__stats{position:absolute;z-index:3;right:-4%;bottom:0;margin:0;padding:.75rem 1rem;list-style:none;display:flex;gap:1.1rem;background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-card)}
.arch__stats li{display:flex;flex-direction:column;line-height:1.1}
.arch__stats b{font:700 1.05rem/1 var(--display);color:var(--ink)}
.arch__stats span{font-size:.66rem;color:var(--ink-soft);margin-top:.2rem;white-space:nowrap}
.arch__stats li+li{padding-left:1.1rem;border-left:1px solid var(--line)}
@media (max-width:980px){.arch{margin:0 auto;width:min(100%,420px)}}
@media (max-width:520px){.arch{padding:0 0 3rem 1.2rem}.seal{width:5.8rem;height:5.8rem;top:42%}.seal__core b{font-size:1.05rem}.seal__ring text{font-size:9.6px}.arch__stats{right:0;left:1.2rem;justify-content:space-between;gap:.6rem;padding:.6rem .8rem}.arch__stats li+li{padding-left:.6rem}.arch__stats b{font-size:.92rem}.arch__stats span{font-size:.6rem}}
@media (prefers-reduced-motion:reduce){.seal__ring{animation:none}.arch__img{transition:none;transform:none}}
.seal__ring text{letter-spacing:0;font-size:8.6px}
/* ===== hero v8: founder pops out of an emerald arch (people kept, own style) ===== */
.arch{display:none!important}
.pa{--stay:6000ms;position:relative;width:min(100%,500px);margin-left:auto;aspect-ratio:5/5.6;padding-bottom:0}
.pa__arch{position:absolute;left:9%;right:9%;top:16%;bottom:9%;border-radius:999px 999px 30px 30px;overflow:hidden;
background:radial-gradient(120% 80% at 50% 100%,#2E9A7C 0%,#1C6D59 45%,#0C1E1C 100%);box-shadow:0 50px 90px -45px rgba(12,30,28,.65)}
.pa__arch::after{content:"";position:absolute;inset:10px;border-radius:999px 999px 22px 22px;border:1px solid rgba(228,176,114,.45)}
.pa__pattern{position:absolute;inset:0;opacity:.35;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44'%3E%3Cg fill='none' stroke='%23E4B072' stroke-opacity='.6' stroke-width='1'%3E%3Cpath d='M22 2l6 14 14 6-14 6-6 14-6-14-14-6 14-6z'/%3E%3Ccircle cx='22' cy='22' r='5'/%3E%3C/g%3E%3C/svg%3E");background-size:44px 44px;
-webkit-mask:linear-gradient(180deg,#000 0%,transparent 75%);mask:linear-gradient(180deg,#000 0%,transparent 75%)}
.pa__glow{position:absolute;left:50%;top:18%;width:70%;aspect-ratio:1;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(228,176,114,.45),rgba(228,176,114,0))}
.pa__people{position:absolute;left:0;right:0;top:0;bottom:9%;z-index:2;pointer-events:none}
.pa__person{position:absolute;left:50%;bottom:0;height:100%;width:auto;max-width:96%;object-fit:contain;object-position:bottom center;
transform:translate(-50%,24px) scale(.97);opacity:0;transition:opacity .7s ease,transform .9s cubic-bezier(.2,1,.3,1);filter:drop-shadow(0 22px 30px rgba(0,0,0,.28))}
.pa__person.is-active{opacity:1;transform:translate(-50%,0) scale(1)}
.pa__seal{left:0;top:24%;width:6.6rem;height:6.6rem;z-index:4}
.plate{position:absolute;z-index:5;left:4%;right:4%;bottom:0;display:flex;align-items:center;gap:.85rem;padding:.75rem .9rem;border-radius:18px;
background:var(--card);border:1px solid var(--line);box-shadow:0 26px 50px -28px rgba(12,30,28,.55);transition:opacity .26s ease,transform .26s ease}
.plate.is-swap{opacity:0;transform:translateY(6px)}
.plate::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:3px;border-radius:3px;background:linear-gradient(var(--gold),var(--emerald))}
.plate__stamp{flex:0 0 auto;width:3.1rem;height:3.1rem;border-radius:50%;border:2px dashed var(--gold-d);color:var(--gold-d);display:grid;place-items:center;transform:rotate(-12deg);position:relative}
.plate__stamp svg{width:1.1rem;height:1.1rem;margin-top:-.45rem}
.plate__stamp em{position:absolute;bottom:.5rem;left:0;right:0;text-align:center;font:800 .44rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;font-style:normal}
.plate__txt{min-width:0;flex:1}
.plate__txt b{display:block;font:700 1rem/1.15 var(--display);color:var(--ink)}
.plate__txt span{display:block;font-size:.74rem;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.plate__badge{flex:0 0 auto;font:600 .68rem/1.2 var(--sans);color:#1C6D59;background:rgba(36,132,108,.12);border-radius:100px;padding:.45em .75em;max-width:9.5rem;text-align:center}
html[data-theme="dark"] .plate__badge{color:#6FD3B4;background:rgba(52,164,136,.18)}
.pa__rail{position:absolute;z-index:4;right:0;top:20%;display:flex;flex-direction:column;gap:.45rem}
.pa__av{position:relative;width:2.7rem;height:2.7rem;border-radius:50%;padding:0;border:0;background:var(--card);cursor:pointer;box-shadow:0 8px 18px -10px rgba(12,30,28,.5);transition:transform .25s}
.pa__av:hover{transform:scale(1.08)}
.pa__av img{position:absolute;inset:3px;width:calc(100% - 6px);height:calc(100% - 6px);border-radius:50%;object-fit:cover;object-position:50% 0;background:#DCE9E1;transform-origin:50% 0}
.pa__av svg{position:absolute;inset:-2px;width:calc(100% + 4px);height:calc(100% + 4px);transform:rotate(-90deg);z-index:1}
.pa__av circle{fill:none;stroke:var(--line);stroke-width:2}
.pa__av.is-on circle{stroke:var(--emerald);stroke-width:2.4;stroke-dasharray:116;stroke-dashoffset:116;animation:avRing var(--stay) linear forwards}
.pa.is-paused .pa__av.is-on circle{animation-play-state:paused}
@keyframes avRing{to{stroke-dashoffset:0}}
.pa__av:not(.is-on) img{filter:grayscale(.5);opacity:.75}
@media (max-width:980px){.pa{margin:0 auto;width:min(100%,460px)}}
@media (max-width:520px){
.pa{aspect-ratio:auto;height:auto;padding-bottom:7.6rem}
.pa__stage-h{display:none}
.pa{min-height:30rem}
.pa__arch{left:6%;right:6%;top:12%;bottom:10.5rem}
.pa__people{bottom:10.5rem}
.pa__seal{width:5.2rem;height:5.2rem;top:16%}.pa__seal .seal__core b{font-size:1rem}
.plate{bottom:3.6rem;left:0;right:0;gap:.6rem;padding:.65rem .75rem}.plate__stamp{width:2.6rem;height:2.6rem}.plate__txt b{font-size:.9rem}.plate__badge{display:none!important}
.pa__rail{top:auto;bottom:0;left:0;right:0;flex-direction:row;justify-content:center;gap:.4rem}.pa__av{width:2.3rem;height:2.3rem}
}
@media (prefers-reduced-motion:reduce){.pa__person{transition:none}.pa__av.is-on circle{animation:none;stroke-dashoffset:0}}
.pa__av img{transform:scale(2.3);transform-origin:50% 4%}
.pa__av{overflow:hidden}
.pa__av svg{inset:0;width:100%;height:100%}
/* mobile fixes: calculator column can't grow past the screen; hero buttons never squeeze their label */
@media (max-width:860px){.calc{grid-template-columns:minmax(0,1fr)}.calc__form,.calc__out{min-width:0}}
@media (max-width:520px){.hero__cta .btn{flex:1 1 auto;justify-content:center}}
@media (max-width:520px){.pa{min-height:28rem}.pa__arch,.pa__people{bottom:7rem}}
/* mobile: comfortable tap targets in the footer; calculator CTA label never clipped */
@media (max-width:680px){
.footer__col a{display:inline-block;padding:.55rem 0}
.calc__actions .btn{white-space:normal;text-align:center;line-height:1.25;padding-top:.85rem;padding-bottom:.85rem}
}
/* dark mode: light "island" cards keep light-theme accents so their pills/stars stay readable */
html[data-theme="dark"] .mock,html[data-theme="dark"] .rcard__in{--emerald:#1C6D59;--emerald-2:#165645;--gold:#B87A33;--gold-d:#A8742F}
html[data-theme="dark"] .mock .pill--ok{color:#165645;background:rgba(36,132,108,.16)}
html[data-theme="dark"] .rcard__stars{color:#B87A33}
html[data-theme="dark"] .rcard__stars{color:#9A6424}
/* ===== chatbot (side launcher above the WhatsApp button) ===== */
.cb__launch{position:fixed;right:1.4rem;bottom:calc(1.4rem + 54px + .75rem);z-index:801;width:54px;height:54px;border-radius:50%;border:0;cursor:pointer;color:#fff;
background:linear-gradient(135deg,#0C1E1C,#24846C);box-shadow:0 14px 30px -10px rgba(12,30,28,.6);display:grid;place-items:center;transition:transform .3s var(--ease),opacity .25s}
.cb__launch:hover{transform:translateY(-2px) scale(1.04)}
.cb__launch svg{width:26px;height:26px}
.cb__launch svg path:last-child{color:var(--gold)}
html[data-theme="dark"] .cb__launch{background:linear-gradient(135deg,#1C6D59,#3EC7A2);color:#07130f}
.cb__dot{position:absolute;top:6px;right:6px;width:11px;height:11px;border-radius:50%;background:var(--gold);border:2px solid #fff;opacity:0;transform:scale(.5);transition:.3s}
.cb.has-dot .cb__dot{opacity:1;transform:none;animation:livePulse 2s ease-out infinite}
.cb.is-open .cb__launch{opacity:0;pointer-events:none;transform:scale(.8)}
.cb__teaser{position:fixed;right:calc(1.4rem + 54px + .8rem);bottom:calc(1.4rem + 54px + .95rem);z-index:801;display:flex;align-items:center;gap:.4rem;max-width:250px;padding:.55rem .6rem .55rem .9rem;border-radius:16px 16px 4px 16px;
background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow-lift);color:var(--ink);font:500 .8rem/1.35 var(--sans);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(8px);transition:.35s var(--ease)}
.cb__teaser.is-on{opacity:1;visibility:visible;transform:none}
.cb__teaser button{border:0;background:none;color:var(--ink-soft);font-size:1.1rem;line-height:1;cursor:pointer;padding:0 .2rem}
.cb__panel{position:fixed;right:1.4rem;bottom:1.4rem;z-index:950;width:min(380px,calc(100vw - 2.8rem));height:min(600px,calc(100vh - 7rem));display:flex;flex-direction:column;
background:var(--card);border:1px solid var(--line);border-radius:22px;box-shadow:0 40px 90px -30px rgba(12,30,28,.55);overflow:hidden;
opacity:0;visibility:hidden;transform:translateY(16px) scale(.98);transform-origin:bottom right;transition:opacity .28s ease,transform .32s var(--ease),visibility .28s}
.cb.is-open .cb__panel{opacity:1;visibility:visible;transform:none}
.cb__head{display:flex;align-items:center;gap:.65rem;padding:.85rem .8rem .85rem 1rem;background:radial-gradient(120% 140% at 85% 0%,#2E9A7C,#12463a 55%,#0C1E1C);color:#fff}
.cb__head img{width:34px;height:34px;object-fit:contain;flex:0 0 auto}
.cb__head>div{flex:1;min-width:0}
.cb__head b{display:block;font:600 .95rem/1.2 var(--display)}
.cb__head span{display:flex;align-items:center;gap:.35rem;font-size:.68rem;color:rgba(255,255,255,.72);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cb__head span i{width:.45rem;height:.45rem;border-radius:50%;background:#3EC7A2;flex:0 0 auto}
.cb__hbtn{width:34px;height:34px;border-radius:10px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);color:#fff;display:grid;place-items:center;cursor:pointer;flex:0 0 auto}
.cb__hbtn:hover{background:rgba(255,255,255,.16)}
.cb__hbtn svg{width:16px;height:16px}
.cb__body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:1rem .9rem .6rem;display:flex;flex-direction:column;gap:.55rem;background:var(--paper)}
.cb__msg{max-width:86%;padding:.65rem .8rem;border-radius:16px;font:400 .86rem/1.45 var(--sans);animation:hmsgPop .3s var(--ease) both;word-wrap:break-word}
.cb__msg--bot{align-self:flex-start;background:var(--card);color:var(--ink);border:1px solid var(--line);border-bottom-left-radius:5px}
.cb__msg--user{align-self:flex-end;background:linear-gradient(120deg,#1C6D59,#2E9A7C);color:#fff;border-bottom-right-radius:5px}
.cb__msg b{font-weight:600}
.cb__link{display:inline-block;margin-top:.5rem;font-weight:600;font-size:.8rem;color:var(--emerald);text-decoration:none}
.cb__link:hover{text-decoration:underline}
.cb__typing{display:inline-flex;gap:.28rem;padding:.15rem 0}
.cb__typing i{width:.4rem;height:.4rem;border-radius:50%;background:var(--ink-soft);animation:hdot 1s ease-in-out infinite}
.cb__typing i:nth-child(2){animation-delay:.15s}.cb__typing i:nth-child(3){animation-delay:.3s}
.cb__chips{display:flex;flex-wrap:wrap;gap:.4rem;padding:.15rem 0 .2rem}
.cb__chip{border:1px solid rgba(36,132,108,.35);background:var(--card);color:var(--emerald);border-radius:100px;padding:.45rem .8rem;font:600 .76rem/1 var(--sans);cursor:pointer;transition:background .2s,color .2s}
.cb__chip:hover{background:var(--emerald);color:#fff}
.cb__chip--wa{background:#25D366;border-color:#25D366;color:#fff}
.cb__form{display:flex;gap:.5rem;padding:.7rem .75rem;border-top:1px solid var(--line);background:var(--card)}
.cb__input{flex:1;min-width:0;border:1px solid var(--line);border-radius:100px;background:var(--paper);color:var(--ink);padding:.7rem 1rem;font:400 .88rem var(--sans)}
.cb__input:focus{outline:none;border-color:var(--emerald);box-shadow:0 0 0 3px rgba(36,132,108,.14)}
.cb__send{width:42px;height:42px;border-radius:50%;border:0;background:var(--emerald);color:#fff;display:grid;place-items:center;cursor:pointer;flex:0 0 auto}
.cb__send svg{width:17px;height:17px}
.cb__note{margin:0;padding:0 1rem .6rem;background:var(--card);font-size:.64rem;color:var(--ink-soft);text-align:center}
@media (max-width:520px){
.cb__panel{right:0;left:0;bottom:0;width:100%;height:calc(100% - 4.5rem);max-height:none;border-radius:22px 22px 0 0;border-bottom:0}
.cb__msg{font-size:.9rem}
}
@media (prefers-reduced-motion:reduce){.cb__panel,.cb__launch,.cb__teaser{transition:none}.cb.has-dot .cb__dot,.cb__msg{animation:none}}
.cb__link{display:table;margin-top:.55rem}
/* chat launcher = the Biznexa logo star (4-point, arc-sided), gentle twinkle */
.cb__launch svg.cb__star{width:26px;height:26px;filter:drop-shadow(0 0 6px rgba(240,200,138,.45));transition:transform .5s var(--ease)}
.cb__launch:hover svg.cb__star{transform:rotate(90deg) scale(1.08)}
.cb__launch svg.cb__star{animation:cbTwinkle 4.5s ease-in-out infinite}
@keyframes cbTwinkle{0%,82%,100%{transform:scale(1)}88%{transform:scale(1.18) rotate(45deg)}94%{transform:scale(.94) rotate(90deg)}}
.cb__launch:hover svg.cb__star{animation:none}
html[data-theme="dark"] .cb__launch{background:linear-gradient(135deg,#0C1E1C,#1C6D59)}
@media (prefers-reduced-motion:reduce){.cb__launch svg.cb__star{animation:none}}
.cb__launch svg.cb__star{width:32px;height:32px}
/* ===== hero v8.1: founder in front of the Biznexa logo star (replaces the arch) ===== */
.pa__burst{position:absolute;left:0;right:0;top:0;bottom:9%;width:100%;height:91%;z-index:1;overflow:visible;filter:drop-shadow(0 40px 50px rgba(12,30,28,.35))}
.pa__ring{transform-origin:250px 262px;animation:paSpin 90s linear infinite}
@keyframes paSpin{to{transform:rotate(360deg)}}
.pa__twinkle{transform-box:fill-box;transform-origin:center;animation:paTwinkle 3.6s ease-in-out infinite}
.pa__twinkle--2{animation-delay:1.8s}
@keyframes paTwinkle{0%,100%{transform:scale(1);opacity:.95}50%{transform:scale(.55) rotate(45deg);opacity:.5}}
html[data-theme="dark"] .pa__burst{filter:drop-shadow(0 0 40px rgba(52,164,136,.25))}
@media (max-width:520px){.pa__burst{bottom:7rem;height:auto;top:4%}}
@media (prefers-reduced-motion:reduce){.pa__ring,.pa__twinkle{animation:none}}
/* hero v8.2: neutral modern panel (no dome arch, no 8-point lattice) — rounded panel + the logo's own concentric arcs + gold logo star */
.pa__arch{border-radius:34px;background:linear-gradient(150deg,#0C1E1C 0%,#164a3d 42%,#24846C 100%)}
.pa__arch::after{border-radius:26px;border-color:rgba(228,176,114,.38)}
.pa__pattern{inset:auto auto -1px -1px;width:78%;aspect-ratio:1;height:auto;opacity:1;background-image:none;-webkit-mask:none;mask:none;
background:repeating-radial-gradient(circle at 0 100%,transparent 0 34px,rgba(255,255,255,.07) 34px 58px)}
.pa__glow{left:auto;right:-12%;top:-10%;width:75%;transform:none;background:radial-gradient(closest-side,rgba(228,176,114,.34),rgba(228,176,114,0))}
.pa__lstar{position:absolute;right:9%;top:9%;width:2.4rem;height:2.4rem;filter:drop-shadow(0 0 10px rgba(228,176,114,.55));animation:paTwinkle 4s ease-in-out infinite;transform-origin:center}
@media (prefers-reduced-motion:reduce){.pa__lstar{animation:none}}
.bizbanner img[src*="about-team3"]{object-position:50% 30%}
/* about hero: client futuristic skyline (bright sky → stronger left scrim) */
body[data-page="about"] .phero__panel{background:linear-gradient(105deg,rgba(9,20,18,.92) 0%,rgba(12,30,28,.78) 38%,rgba(12,30,28,.35) 68%,rgba(28,109,89,.15) 100%),url("../assets/about-future.webp") 60% 40%/cover no-repeat}
@media (max-width:680px){body[data-page="about"] .phero__panel{background:linear-gradient(180deg,rgba(9,20,18,.6) 0%,rgba(12,30,28,.88) 60%,rgba(9,20,18,.94) 100%),url("../assets/about-future.webp") 55% 30%/cover no-repeat}}
@media (max-width:680px){body[data-page="about"] .phero__panel{background:linear-gradient(180deg,rgba(9,20,18,.25) 0%,rgba(12,30,28,.62) 38%,rgba(9,20,18,.9) 70%,rgba(9,20,18,.95) 100%),url("../assets/about-future.webp") 62% 20%/cover no-repeat}}
/* banner that shows the whole photo (no crop, no parallax over-scan) */
.bizbanner--fit,.bizbanner--svc.bizbanner--fit{aspect-ratio:2000/1232}
.bizbanner img.is-fit{top:0;height:100%;object-fit:cover;object-position:center}
@media (max-width:600px){.bizbanner--svc.bizbanner--fit{aspect-ratio:2000/1232}}
@media (max-width:600px){
.bizbanner--svc.bizbanner--fit{aspect-ratio:auto;background:var(--emerald-ink)}
.bizbanner--fit img.is-fit{position:static;display:block;width:100%;height:auto;aspect-ratio:2000/1232}
.bizbanner--fit::before{display:none}
.bizbanner--fit .bizbanner__cap{position:static;max-width:none;padding:1rem 1.1rem 1.15rem}
}
/* about hero: client "child at the window" skyline photo */
body[data-page="about"] .phero__panel{background:linear-gradient(105deg,rgba(9,20,18,.9) 0%,rgba(12,30,28,.72) 36%,rgba(12,30,28,.25) 66%,rgba(28,109,89,.08) 100%),url("../assets/about-window.webp") 70% 45%/cover no-repeat}
@media (max-width:680px){body[data-page="about"] .phero__panel{background:linear-gradient(180deg,rgba(9,20,18,.25) 0%,rgba(12,30,28,.62) 38%,rgba(9,20,18,.9) 70%,rgba(9,20,18,.95) 100%),url("../assets/about-window.webp") 58% 30%/cover no-repeat}}
/* full-fit visa banner: caption top-centre over the sky inside the arch (desktop/tablet) */
@media (min-width:601px){
.bizbanner--fit .bizbanner__cap{left:50%;right:auto;top:clamp(1.4rem,4.5vw,3.2rem);bottom:auto;transform:translateX(-50%);text-align:center;max-width:36ch;width:max-content}
.bizbanner--fit::before{background:linear-gradient(180deg,rgba(9,20,18,.62) 0%,rgba(9,20,18,.32) 24%,rgba(9,20,18,0) 46%)!important}
.bizbanner--fit .bizbanner__cap b,.bizbanner--fit .bizbanner__cap span{text-shadow:0 2px 14px rgba(0,0,0,.35)}
}
/* showcase: tall portrait photo shown in its own shape (no crop, no parallax over-scan) */
.show__img{aspect-ratio:1143/2000;max-width:430px;margin-left:auto}
.show__img img.is-fit{top:0;height:100%;object-fit:cover;object-position:center}
@media (max-width:980px){.show__img{max-width:380px;margin:0 auto}}
/* about hero: back to the futuristic skyline (client preferred it) */
body[data-page="about"] .phero__panel{background:linear-gradient(105deg,rgba(9,20,18,.92) 0%,rgba(12,30,28,.78) 38%,rgba(12,30,28,.35) 68%,rgba(28,109,89,.15) 100%),url("../assets/about-future.webp") 60% 40%/cover no-repeat}
@media (max-width:680px){body[data-page="about"] .phero__panel{background:linear-gradient(180deg,rgba(9,20,18,.25) 0%,rgba(12,30,28,.62) 38%,rgba(9,20,18,.9) 70%,rgba(9,20,18,.95) 100%),url("../assets/about-future.webp") 62% 20%/cover no-repeat}}
/* about story banner: a bit taller (16:9) to suit the 3:2 team photo; crop only the ceiling */
.bizbanner--about{aspect-ratio:16/9}
.bizbanner--about img.is-fit{top:0;height:100%;object-fit:cover;object-position:50% 72%}
@media (max-width:600px){.bizbanner--about{aspect-ratio:4/3}.bizbanner--about img.is-fit{object-position:58% 70%}}
@media (max-width:600px){
.bizbanner--about{aspect-ratio:auto;background:var(--emerald-ink)}
.bizbanner--about img.is-fit{position:static;display:block;width:100%;height:auto;aspect-ratio:4/3;object-position:58% 70%}
.bizbanner--about::before{display:none}
.bizbanner--about .bizbanner__cap{position:static;max-width:none;padding:1rem 1.1rem 1.15rem}
}
/* showcase: trim ~16% off the bottom of the tall photo, a bit wider, centred in its column */
.show__img{aspect-ratio:0.68;max-width:470px;margin:0 auto}
.show__img img.is-fit{object-position:50% 0%}
@media (max-width:980px){.show__img{max-width:380px}}
/* about banner: shorter (client: too big) — crop ceiling + a little table, keep all heads */
@media (min-width:601px){.bizbanner--about{aspect-ratio:2.05/1}.bizbanner--about img.is-fit{object-position:50% 58%}}
/* legal pages */
.legal__wrap{max-width:760px;margin:0 auto}
.legal__h1{font:600 clamp(2rem,4.2vw,3rem)/1.1 var(--display);color:var(--ink);margin:.9rem 0 .4rem;letter-spacing:-.02em}
.legal__date{color:var(--ink-soft);font-size:.85rem;margin:0 0 1.6rem}
.legal__lead{font-size:1.05rem;color:var(--ink-soft);line-height:1.7;padding-bottom:1.4rem;border-bottom:1px solid var(--line)}
.legal h2{font:600 1.2rem/1.3 var(--display);color:var(--ink);margin:2rem 0 .6rem}
.legal p,.legal li{color:var(--ink-soft);line-height:1.75;font-size:.98rem}
.legal ul{padding-left:1.2rem;margin:.4rem 0}
.legal li{margin:.35rem 0}
.legal li b{color:var(--ink);font-weight:600}
.legal a{color:var(--emerald);text-decoration:underline;text-underline-offset:2px}
.footer__bar a{color:inherit;text-decoration:none}
.form-note a{color:var(--emerald);text-decoration:underline}
/* ===== personalised-offer popup ===== */
html.ofr-lock{overflow:hidden}
.ofr{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:1.2rem;visibility:hidden;pointer-events:none}
.ofr.is-open{visibility:visible;pointer-events:auto}
.ofr__scrim{position:absolute;inset:0;background:rgba(9,20,18,.55);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);opacity:0;transition:opacity .35s ease}
.ofr.is-open .ofr__scrim{opacity:1}
.ofr__card{position:relative;width:min(780px,100%);display:grid;grid-template-columns:.95fr 1.05fr;background:var(--card);border:1px solid var(--line);border-radius:26px;overflow:hidden;box-shadow:0 50px 100px -40px rgba(0,0,0,.6);
opacity:0;transform:translateY(24px) scale(.97);transition:opacity .4s var(--ease),transform .45s var(--ease)}
.ofr.is-open .ofr__card{opacity:1;transform:none}
.ofr__x{position:absolute;top:.8rem;right:.8rem;z-index:2;width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--ink);display:grid;place-items:center;cursor:pointer}
.ofr__x svg{width:16px;height:16px}
.ofr__side{position:relative;padding:2rem 1.8rem;color:#fff;background:radial-gradient(120% 120% at 0% 100%,rgba(255,255,255,.07) 0 30%,transparent 30.5%),radial-gradient(150% 120% at 85% 0%,#2E9A7C,#12463a 55%,#0C1E1C);overflow:hidden}
.ofr__side::after{content:"";position:absolute;left:-30%;bottom:-40%;width:110%;aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(circle,transparent 0 26px,rgba(255,255,255,.06) 26px 44px);pointer-events:none}
.ofr__star{display:inline-grid;place-items:center;width:2.6rem;height:2.6rem;color:var(--gold);filter:drop-shadow(0 0 10px rgba(228,176,114,.5))}
.ofr__star svg{width:100%;height:100%}
.ofr__eyebrow{display:block;margin-top:.9rem;font:700 .7rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.ofr__side h2{position:relative;z-index:1;font:600 clamp(1.5rem,2.6vw,1.95rem)/1.15 var(--display);margin:.6rem 0 1.2rem;color:#fff}
.ofr__side ul{position:relative;z-index:1;list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
.ofr__side li{display:flex;gap:.55rem;align-items:flex-start;font-size:.9rem;color:rgba(255,255,255,.88);line-height:1.4}
.ofr__side li::before{content:"";flex:0 0 auto;width:1.1rem;height:1.1rem;margin-top:.1rem;border-radius:50%;background:#2E9A7C url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/60% no-repeat}
.ofr__form,.ofr__done{padding:2rem 1.8rem 1.6rem;display:flex;flex-direction:column}
.ofr__text{color:var(--ink-soft);font-size:.92rem;line-height:1.55;margin:0 2rem .9rem 0}
.ofr__lbl{font:600 .76rem/1 var(--sans);color:var(--ink);margin:.75rem 0 .4rem}
.ofr__form .calc__input,.ofr__form .bzx-select__btn{background:var(--paper)}
.ofr__hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.ofr__btn{margin-top:1.1rem;justify-content:center;width:100%}
.ofr__msg{min-height:1.1em;margin:.55rem 0 0;font-size:.8rem;color:#C43E3E;font-weight:600}
.ofr__msg:empty{display:none}
.ofr__note{margin:.6rem 0 0;font-size:.72rem;color:var(--ink-soft);text-align:center}
.ofr__note a{color:var(--emerald);text-decoration:underline}
.ofr__done{align-items:flex-start;justify-content:center}
.ofr__done[hidden],.ofr__form[hidden]{display:none}
.ofr__done h3{font:600 1.5rem/1.2 var(--display);color:var(--ink);margin:.7rem 0 .4rem}
.ofr__done p{color:var(--ink-soft);margin:0 0 1.2rem;line-height:1.55}
@media (max-width:680px){
.ofr{place-items:end center;padding:0}
.ofr__card{grid-template-columns:1fr;border-radius:24px 24px 0 0;max-height:92vh;overflow-y:auto;transform:translateY(40px)}
.ofr__side{padding:1.4rem 1.3rem 1.2rem}.ofr__side h2{font-size:1.35rem;margin:.4rem 0 .8rem}.ofr__side ul{gap:.4rem}.ofr__side li{font-size:.82rem}.ofr__star{width:2rem;height:2rem}.ofr__eyebrow{margin-top:.5rem}
.ofr__form,.ofr__done{padding:1.2rem 1.3rem 1.4rem}
.ofr__x{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.25);color:#fff}
}
@media (prefers-reduced-motion:reduce){.ofr__card,.ofr__scrim{transition:none}}
.bzx-select.is-ph .bzx-select__val{color:var(--ink-soft);font-weight:400}
.ofr__logo{position:relative;z-index:1;display:block;width:150px;height:auto;filter:drop-shadow(0 0 12px rgba(228,176,114,.25))}
@media (max-width:680px){.ofr__logo{width:118px}}
/* ===== blog ===== */
.blog__head{max-width:760px;margin:0 auto 2.6rem;text-align:center}
.blog__h1,.post__h1{font:600 clamp(2rem,4.4vw,3.1rem)/1.1 var(--display);color:var(--ink);letter-spacing:-.02em;margin:.9rem 0 .7rem}
.blog__lead{color:var(--ink-soft);font-size:1.08rem;line-height:1.65}
.blog__empty{text-align:center;color:var(--ink-soft)}
.bgrid{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem}
.bgrid--2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:900px}
.bcard{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow-card);transition:transform .35s var(--ease),box-shadow .35s}
.bcard:hover{transform:translateY(-4px);box-shadow:0 30px 60px -36px rgba(12,30,28,.5)}
.bcard__img{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--block)}
.bcard__img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.bcard:hover .bcard__img img{transform:scale(1.05)}
.bcard__body{display:flex;flex-direction:column;flex:1;padding:1.2rem 1.3rem 1.3rem}
.bcard__meta{display:flex;align-items:center;gap:.6rem;font-size:.76rem;color:var(--ink-soft);margin-bottom:.6rem}
.bcard__cat{font-weight:600;color:var(--emerald);background:rgba(36,132,108,.1);border-radius:100px;padding:.3em .7em}
.bcard__title{font:600 1.18rem/1.3 var(--display);margin:0 0 .5rem}
.bcard__title a{color:var(--ink);text-decoration:none}
.bcard__title a:hover{color:var(--emerald)}
.bcard__ex{color:var(--ink-soft);font-size:.9rem;line-height:1.6;margin:0 0 1rem;flex:1}
.bcard__more{font:600 .85rem/1 var(--sans);color:var(--emerald);text-decoration:none}
.post__wrap{max-width:740px;margin:0 auto}
.post__crumbs{display:flex;flex-wrap:wrap;gap:.45rem;font-size:.8rem;color:var(--ink-soft)}
.post__crumbs a{color:var(--emerald);text-decoration:none}
.post__meta{color:var(--ink-soft);font-size:.88rem;margin:0 0 1.6rem}
.post__cover{margin:0 0 2rem;border-radius:var(--r-md);overflow:hidden;aspect-ratio:16/9;box-shadow:var(--shadow-card)}
.post__cover img{width:100%;height:100%;object-fit:cover}
.post__body{font-size:1.04rem;line-height:1.8;color:var(--ink-soft)}
.post__body h2{font:600 1.45rem/1.3 var(--display);color:var(--ink);margin:2.2rem 0 .7rem;scroll-margin-top:6rem}
.post__body h3{font:600 1.15rem/1.35 var(--display);color:var(--ink);margin:1.6rem 0 .5rem}
.post__body p{margin:0 0 1.1rem}
.post__body ul,.post__body ol{margin:0 0 1.2rem;padding-left:1.3rem}
.post__body li{margin:.4rem 0}
.post__body b{color:var(--ink);font-weight:600}
.post__body a{color:var(--emerald);text-decoration:underline;text-underline-offset:2px}
.post__cta{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;flex-wrap:wrap;margin-top:2.6rem;padding:1.4rem 1.5rem;border-radius:var(--r-md);background:radial-gradient(130% 140% at 90% 0%,#2E9A7C,#12463a 55%,#0C1E1C);color:#fff}
.post__cta b{display:block;font:600 1.15rem/1.3 var(--display);margin-bottom:.25rem}
.post__cta span{color:rgba(255,255,255,.78);font-size:.9rem}
.post__cta .btn{background:#fff;color:#0C1E1C}
.post__related h2{text-align:center;font:600 1.6rem/1.2 var(--display);color:var(--ink);margin:0 0 1.6rem}
@media (max-width:980px){.bgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.bgrid,.bgrid--2{grid-template-columns:minmax(0,1fr)}.post__cta{flex-direction:column;align-items:flex-start}}
/* visa full-fit banner: smaller (client: reduce size) — whole photo still shown */
@media (min-width:601px){.bizbanner--fit{max-width:880px;margin-left:auto;margin-right:auto}}