:root{
  --vn-space-1:4px;--vn-space-2:8px;--vn-space-3:12px;--vn-space-4:16px;--vn-space-5:20px;--vn-space-6:24px;--vn-space-8:32px;--vn-space-10:40px;--vn-space-12:48px;
  --vn-radius-sm:8px;--vn-radius-md:14px;--vn-radius-lg:20px;--vn-radius-xl:28px;
  --vn-accent:#2563eb;--vn-accent-2:#0ea5e9;--vn-dark:#101828;--vn-ink:#0f172a;--vn-text:#172033;--vn-muted:#667085;--vn-soft:#f6f9fc;--vn-line:#e4ebf5;--vn-card:#fff;--vn-radius:22px;--vn-shadow:0 18px 48px rgba(16,24,40,.08);--vn-shadow-soft:0 10px 28px rgba(16,24,40,.055);--vn-container:1160px
}

*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-height:100vh;margin:0;display:flex;flex-direction:column;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--vn-text);background:#fff;line-height:1.55;text-rendering:optimizeLegibility}a{color:inherit}p{margin:0}h1,h2,h3,h4{margin:0;line-height:1.06;letter-spacing:-.045em;color:var(--vn-dark)}h1{font-size:clamp(42px,5vw,70px)}h2{font-size:clamp(34px,4vw,56px)}h3{font-size:clamp(20px,2vw,28px)}img,svg{max-width:100%;height:auto}.site-main{flex:1}.screen-reader-text,.skip-link{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}.skip-link:focus{z-index:9999;width:auto;height:auto;clip:auto;top:12px;left:12px;padding:10px 14px;background:#fff;border:1px solid var(--vn-line);border-radius:12px}
.vn-container,.vn-container--wide,.vn-container--content,.vn-container--pricing,.vn-container--process,.vn-container--compact{width:min(100% - 42px,var(--vn-container));margin-inline:auto}.vn-container--wide{--vn-container:1240px}.vn-container--compact{--vn-container:920px}.vn-container--full{width:min(100% - 24px,1480px);margin-inline:auto}.section{padding:clamp(58px,7vw,94px) 0}.section--soft{background:linear-gradient(180deg,#f7faff,#fff)}.section-heading{max-width:760px;margin-bottom:28px}.section-heading p:not(.eyebrow){margin-top:12px;color:var(--vn-muted);font-size:17px;max-width:710px}.eyebrow{margin:0 0 12px;color:var(--vn-accent);font-size:12px;font-weight:950;letter-spacing:.12em;text-transform:uppercase}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:12px 20px;border-radius:999px;text-decoration:none;font-weight:900;border:1px solid transparent;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.btn:hover{transform:translateY(-1px)}.btn--primary{background:var(--vn-accent);color:#fff;box-shadow:0 14px 30px rgba(37,99,235,.26)}.btn--secondary,.btn--ghost{background:#fff;color:#111827;border-color:var(--vn-line)}.btn--full{width:100%}.text-link{color:var(--vn-accent);text-decoration:none;font-weight:900}.icon-badge{width:50px;height:50px;display:grid;place-items:center;border-radius:16px;background:#eef4ff;color:var(--vn-accent);flex:0 0 auto}.icon-badge--small{width:42px;height:42px;border-radius:14px}.icon-badge svg{width:23px;height:23px;fill:currentColor}.card,.system-module,.level-card,.ai-widget-card,.ai-widget-feature,.use-case-card,.project-card,.process-step,.faq-item{background:#fff;border:1px solid var(--vn-line);border-radius:var(--vn-radius);box-shadow:var(--vn-shadow-soft)}
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:blur(14px);border-bottom:1px solid rgba(228,235,245,.86);transition:box-shadow .18s ease}.site-header.is-scrolled{box-shadow:0 10px 28px rgba(16,24,40,.08)}.site-header__inner{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:10px 0}.site-brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none}.site-brand__mark{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:#0f172a;color:#fff;font-weight:950}.site-brand__text{display:grid;line-height:1.12}.site-brand__text strong{font-size:var(--vn-brand-size,20px);letter-spacing:-.04em}.site-brand__text small{color:var(--vn-muted);font-weight:650}.site-nav{display:none}.site-nav__menu{display:flex;gap:var(--vn-nav-gap,24px);margin:0;padding:0;list-style:none}.site-nav__menu a{text-decoration:none;color:#263449;font-size:var(--vn-nav-size,14px);font-weight:900}.site-header__actions{display:flex;align-items:center;gap:12px}.menu-toggle{width:42px;height:42px;display:grid;place-items:center;background:#fff;border:1px solid var(--vn-line);border-radius:14px}.menu-toggle span:not(.screen-reader-text){display:block;width:18px;height:2px;background:#111827;margin:2px}.mobile-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.44);z-index:80}.mobile-drawer{position:fixed;top:0;right:0;width:min(88vw,380px);height:100vh;z-index:90;background:#fff;transform:translateX(105%);transition:transform .24s ease;padding:22px;box-shadow:-20px 0 44px rgba(16,24,40,.18)}.mobile-drawer.is-open{transform:none}.mobile-drawer__close{border:0;background:#eef4ff;padding:10px 14px;border-radius:12px;font-weight:900}.mobile-menu{list-style:none;margin:28px 0;padding:0;display:grid;gap:12px}.mobile-menu a{text-decoration:none;font-weight:900}.mobile-drawer__contact{display:grid;gap:8px;margin-top:18px;color:var(--vn-muted)}
.hero--v8{padding:clamp(78px,10vw,132px) 0 56px;background:radial-gradient(circle at 80% 10%,rgba(37,99,235,.11),transparent 34%),linear-gradient(180deg,#fff,#f7faff)}.hero__grid{display:grid;gap:42px;align-items:center}.hero__content--v8{max-width:720px}.hero__text{margin-top:22px;color:#4b5d76;font-size:clamp(18px,2.1vw,23px);max-width:720px}.hero__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.proof-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}.proof-row span{padding:8px 12px;border:1px solid var(--vn-line);background:#fff;border-radius:999px;color:#344054;font-size:13px;font-weight:850}.system-visual{justify-self:end;max-width:420px;width:100%;padding:24px;border:1px solid rgba(37,99,235,.18);border-radius:32px;background:linear-gradient(145deg,#fff,#f3f7ff);box-shadow:var(--vn-shadow)}.system-visual__badge{display:inline-flex;padding:7px 10px;border-radius:999px;background:#eaf1ff;color:var(--vn-accent);font-size:12px;font-weight:950;letter-spacing:.08em;text-transform:uppercase}.system-visual__core{margin-top:18px;padding:20px;border-radius:22px;background:#101828;color:#fff}.system-visual__core strong{display:block;color:#fff;font-size:28px;letter-spacing:-.05em}.system-visual__core span{display:block;margin-top:7px;color:rgba(255,255,255,.72)}.system-visual__modules{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.system-visual__modules div{padding:14px;border:1px solid var(--vn-line);border-radius:18px;background:#fff}.system-visual__modules strong{display:block;color:var(--vn-dark)}.system-visual__modules span{display:block;margin-top:4px;color:var(--vn-muted);font-size:13px}
.services-section--v8{padding-top:clamp(64px,8vw,104px)}.system-module-grid{display:grid;gap:14px}.system-module{padding:20px;display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;transition:transform .18s ease,box-shadow .18s ease}.system-module:hover{transform:translateY(-2px);box-shadow:var(--vn-shadow)}.system-module h3{font-size:22px}.system-module p:not(.module-label){margin-top:7px;color:var(--vn-muted)}.module-label{margin-bottom:7px;color:var(--vn-accent);font-size:11px;font-weight:950;letter-spacing:.1em;text-transform:uppercase}
.packages-section--v8{background:#fff}.level-grid{display:grid;gap:12px}.level-card{position:relative;display:grid;gap:18px;align-items:center;padding:20px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.level-card:hover{transform:translateY(-2px);box-shadow:var(--vn-shadow)}.level-card.is-recommended{border-color:rgba(37,99,235,.42);box-shadow:0 18px 52px rgba(37,99,235,.11)}.level-card.is-custom{background:linear-gradient(135deg,#f8fbff,#fff)}.level-card__head p:not(.eyebrow){margin-top:8px;color:var(--vn-muted)}.level-card__badge{display:inline-flex;margin-top:12px;padding:6px 10px;border-radius:999px;background:var(--vn-accent);color:#fff;font-size:12px;font-weight:950}.level-card__prices{display:grid;grid-template-columns:1fr 1fr;gap:10px}.level-card__prices span{min-height:84px;padding:14px;border:1px solid var(--vn-line);border-radius:18px;background:#f8fafc}.level-card__prices small{display:block;color:#667085;font-size:11px;font-weight:950;letter-spacing:.08em;text-transform:uppercase}.level-card__prices strong{display:block;margin-top:5px;color:var(--vn-dark);font-size:24px;line-height:1.05;letter-spacing:-.04em;white-space:nowrap}.level-card__prices em{display:block;margin-top:4px;color:var(--vn-muted);font-size:12px;font-style:normal}.level-card__features{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}.level-card__features li{padding:7px 10px;border:1px solid var(--vn-line);border-radius:999px;background:#fff;color:#344054;font-size:13px;font-weight:750}.pricing-disclaimer{max-width:860px;margin:18px auto 0;padding:13px 18px;text-align:center;border:1px solid var(--vn-line);border-radius:18px;background:#fff;color:var(--vn-muted);font-size:14px}
.ai-widget-section{background:linear-gradient(180deg,#0f172a,#16213a);color:#fff}.ai-widget-section h2,.ai-widget-section h3{color:#fff}.ai-widget-section .section-heading p:not(.eyebrow){color:rgba(255,255,255,.72)}.ai-widget-layout{display:grid;gap:28px;align-items:center}.ai-widget-note{margin-top:22px;padding:18px;border:1px solid rgba(255,255,255,.14);border-radius:20px;background:rgba(255,255,255,.06);display:grid;gap:6px}.ai-widget-note span{color:rgba(255,255,255,.72)}.ai-widget-card{max-width:420px;justify-self:end;padding:18px;border-color:rgba(255,255,255,.14);background:#fff;color:var(--vn-text);box-shadow:0 22px 64px rgba(0,0,0,.22)}.ai-widget-card__header{display:flex;align-items:center;gap:10px;padding-bottom:14px;border-bottom:1px solid var(--vn-line)}.ai-widget-card__header span{width:34px;height:34px;border-radius:12px;background:#eaf1ff}.ai-message{max-width:86%;margin-top:14px;padding:12px 14px;border-radius:16px;font-weight:700}.ai-message--bot{background:#f3f6fb}.ai-message--user{margin-left:auto;background:var(--vn-accent);color:#fff}.ai-widget-actions{display:flex;gap:8px;margin-top:16px}.ai-widget-actions span{flex:1;text-align:center;padding:9px;border-radius:999px;background:#eef4ff;color:var(--vn-accent);font-size:12px;font-weight:900}.ai-widget-grid{display:grid;gap:12px;margin-top:22px}.ai-widget-feature{padding:18px;border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.06);box-shadow:none}.ai-widget-feature p{margin-top:8px;color:rgba(255,255,255,.72)}
.use-cases-section{background:#f7faff}.use-case-grid{display:grid;gap:14px}.use-case-card{padding:20px}.use-case-card p{margin-top:8px;color:var(--vn-muted)}.use-case-card span{display:inline-flex;margin-top:14px;padding:7px 10px;border-radius:999px;background:#eef4ff;color:var(--vn-accent);font-size:12px;font-weight:950}
.projects-section{background:#fff}.project-grid{display:grid;gap:18px}.project-card{padding:16px;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease}.project-card:hover{transform:translateY(-2px);box-shadow:var(--vn-shadow)}.project-card__body{display:grid;gap:10px;padding:12px 2px 2px}.project-card__body p{color:var(--vn-muted)}.project-meta{display:flex;flex-wrap:wrap;gap:7px}.project-meta span{padding:6px 9px;border:1px solid var(--vn-line);border-radius:999px;background:#fff;color:var(--vn-muted);font-size:12px;font-weight:800}
.process-section{background:#fff}.process-steps--v8{display:grid;gap:14px}.process-step{padding:22px;display:grid;gap:10px}.process-step__number{width:38px;height:38px;display:grid;place-items:center;color:var(--vn-accent);background:#eef4ff;border-radius:50%;font-weight:950}.process-step p{color:var(--vn-muted)}.faq-section{background:#f6f9ff}.faq-list{display:grid;gap:12px}.faq-item{padding:18px 22px}.faq-item summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:14px;font-weight:900}.faq-item summary::after{content:"+";width:28px;height:28px;display:grid;place-items:center;flex:0 0 auto;color:var(--vn-accent);background:#eef4ff;border-radius:50%}.faq-item[open] summary::after{content:"-"}.faq-item div{margin-top:12px;color:var(--vn-muted)}.contact-section{background:#fff}.contact-card{padding:clamp(28px,5vw,54px);display:grid;gap:24px;align-items:center;border-radius:30px;background:var(--vn-dark);color:#fff;box-shadow:var(--vn-shadow)}.contact-card h2{color:#fff}.contact-card .eyebrow{color:#93c5fd}.contact-card p{color:rgba(255,255,255,.72)}.contact-card__actions{display:flex;flex-wrap:wrap;gap:12px}.site-footer{flex-shrink:0;padding:38px 0;color:rgba(255,255,255,.75);background:#0b1220}.site-footer__inner{display:grid;gap:22px}.site-footer strong,.site-footer a{color:#fff;text-decoration:none}.site-footer__brand p{margin-top:8px;max-width:540px}.site-footer__contact{display:grid;gap:8px}.site-footer__copy{padding-top:18px;border-top:1px solid rgba(255,255,255,.12)}
.billing-page{padding:72px 0}.billing-grid{display:grid;gap:24px}.billing-card{padding:26px;background:#fff;border:1px solid var(--vn-line);border-radius:var(--vn-radius);box-shadow:var(--vn-shadow-soft)}.billing-list{display:grid;gap:12px;margin:0}.billing-row{display:grid;gap:4px;padding-bottom:12px;border-bottom:1px solid var(--vn-line)}.billing-row dt{color:var(--vn-muted);font-size:13px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}.billing-row dd{margin:0;font-weight:800}.billing-steps{margin:0;padding-left:20px;color:var(--vn-muted)}.billing-note{margin-top:18px;padding:14px;border-radius:16px;background:rgba(37,99,235,.055);color:#344054}
[data-vn-animate]{opacity:1}.has-vn-animations [data-vn-animate]{opacity:0;transform:translateY(14px);transition:opacity .45s ease,transform .45s ease}.has-vn-animations [data-vn-animate="fade-in"]{transform:none}.has-vn-animations [data-vn-animate="soft-scale"]{transform:scale(.98)}.has-vn-animations [data-vn-animate].is-visible{opacity:1;transform:none}
@media (min-width:760px){.hero__grid,.ai-widget-layout,.contact-card,.billing-grid{grid-template-columns:1.05fr .85fr}.system-module-grid,.use-case-grid,.project-grid,.process-steps--v8{grid-template-columns:repeat(3,minmax(0,1fr))}.ai-widget-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.level-card{grid-template-columns:1.35fr 1.05fr 1.4fr auto}.site-footer__inner{grid-template-columns:1.2fr .8fr;align-items:start}.site-footer__copy{grid-column:1/-1}}
@media (min-width:1180px){.site-nav{display:block}.menu-toggle{display:none}}
@media (max-width:980px){.system-visual,.ai-widget-card{justify-self:stretch;max-width:none}.site-header__cta{display:none}.level-card__prices{grid-template-columns:1fr}}
@media (max-width:720px){.vn-container,.vn-container--wide,.vn-container--content,.vn-container--pricing,.vn-container--process,.vn-container--compact{width:min(100% - 28px,var(--vn-container))}.admin-bar .site-header{top:0}.site-brand__text small{display:none}.hero--v8{padding-top:52px}.section{padding:50px 0}.system-visual__modules,.level-card__prices{grid-template-columns:1fr}.ai-widget-actions{flex-direction:column}.proof-row span{font-size:12px}.level-card__features{display:grid}.project-grid,.system-module-grid,.use-case-grid,.process-steps--v8,.ai-widget-grid{grid-template-columns:1fr}}

/* v8.1 visual rhythm and compact product matrix */
.section{padding:clamp(46px,5.8vw,78px) 0}.section-heading{margin-bottom:22px}.section-heading p:not(.eyebrow){font-size:16px;line-height:1.65}.hero--v8{padding:clamp(64px,8vw,104px) 0 42px;background:radial-gradient(circle at 82% 14%,rgba(37,99,235,.10),transparent 30%),linear-gradient(180deg,#fff 0%,#f6f9ff 100%)}.hero__grid{gap:clamp(28px,5vw,56px)}.hero__content--v8 h1{max-width:760px;font-size:clamp(42px,6.4vw,76px);line-height:.96;letter-spacing:0}.hero__text{margin-top:18px;font-size:clamp(17px,1.5vw,21px);line-height:1.65}.proof-row{margin-top:20px}.proof-row span{padding:7px 11px}.system-visual{max-width:440px;border-radius:26px;padding:20px}.system-visual__core{padding:18px;border-radius:18px}.system-visual__modules div{border-radius:14px;padding:12px}.system-module{border-radius:18px;padding:18px}.packages-section--v8{background:#fff}.level-grid{gap:10px}.level-card{grid-template-columns:1.25fr .95fr 1.25fr auto;padding:16px 18px;border-radius:18px;box-shadow:0 10px 32px rgba(15,23,42,.06)}.level-card__head p:not(.eyebrow){margin-top:6px}.level-card__prices{gap:8px}.level-card__prices span{min-height:72px;border-radius:14px;padding:11px 12px}.level-card__prices strong{font-size:22px}.level-card__features li{padding:6px 9px;font-size:12px}.pricing-disclaimer{margin-top:14px;border-radius:14px}.ai-widget-card,.ai-widget-feature,.use-case-card,.project-card,.process-step,.faq-item{border-radius:18px}.ai-widget-section .section-heading{margin-bottom:16px}.ai-widget-grid{margin-top:16px}.use-case-card{padding:20px}.project-card{padding:12px}.project-card__body{padding:10px 2px 2px}.process-step{padding:18px}.faq-item{padding:15px 18px}.contact-card{border-radius:24px;padding:clamp(24px,4vw,42px)}

@media (max-width:980px){.level-card{grid-template-columns:1fr;gap:13px}.level-card__features{display:flex}.level-card .btn{justify-self:start}}
@media (max-width:720px){.section{padding:42px 0}.hero--v8{padding-top:46px}.hero__content--v8 h1{font-size:clamp(38px,13vw,54px);line-height:.98}.hero__text{font-size:17px}.hero__actions .btn{width:100%}.system-visual{max-width:none}.level-card{padding:15px}.level-card__prices{grid-template-columns:1fr 1fr}.level-card__features{display:grid;grid-template-columns:1fr}.contact-card__actions .btn{width:100%}}

/* v8.2 copy polish and product-level readability */
.packages-section--v8{padding-top:clamp(42px,5vw,68px)}.level-card{grid-template-columns:minmax(220px,.9fr) minmax(280px,1.1fr) minmax(260px,1fr) auto;gap:14px}.level-card__prices{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:stretch}.level-price,.level-note{border:1px solid var(--vn-line);border-radius:14px;background:#f8fafc;padding:11px 12px}.level-price small,.level-note span,.level-card__included>span{display:block;color:#667085;font-size:11px;font-weight:950;letter-spacing:.08em;text-transform:uppercase}.level-price strong,.level-note strong{display:block;margin-top:5px;color:var(--vn-dark);font-size:22px;line-height:1.05;letter-spacing:0;white-space:nowrap}.level-price em{display:block;margin-top:5px;color:var(--vn-muted);font-size:12px;font-style:normal;line-height:1.35}.level-note{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff}.level-note strong{margin-top:0;font-size:14px;white-space:normal}.level-card__included{display:grid;gap:8px}.level-card__included ul{display:flex;flex-wrap:wrap;gap:7px;margin:0;padding:0;list-style:none}.level-card__included li{padding:6px 9px;border:1px solid var(--vn-line);border-radius:999px;background:#fff;color:#344054;font-size:12px;font-weight:750}.ai-widget-actions span,.proof-row span,.project-meta span{line-height:1.25}.site-footer__brand p{max-width:660px}

@media (max-width:980px){.level-card{grid-template-columns:1fr}.level-card__prices{grid-template-columns:1fr 1fr}.level-card__included ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.level-card .btn{justify-self:start}}
@media (max-width:620px){.level-card__prices{grid-template-columns:1fr}.level-note{grid-column:auto}.level-card__included ul{grid-template-columns:1fr}.level-price strong{white-space:normal}.packages-section--v8{padding-top:38px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.has-vn-animations [data-vn-animate]{opacity:1;transform:none}}

/* v8.4 visual-admin-polish */
:root{--vn-radius:18px;--vn-shadow:0 18px 46px rgba(15,23,42,.08);--vn-shadow-soft:0 8px 24px rgba(15,23,42,.055)}
h1,h2,h3,h4{letter-spacing:0}.section{padding:clamp(42px,5.2vw,72px) 0}.section-heading{max-width:780px;margin-bottom:20px}.section-heading p:not(.eyebrow){max-width:680px;color:#536173}.hero--v8{padding:clamp(58px,7vw,92px) 0 40px;background:linear-gradient(180deg,#fff 0%,#f7faff 74%,#fff 100%)}.hero__content--v8 h1{max-width:800px;font-size:clamp(40px,5.8vw,70px);line-height:1.01}.hero__text{max-width:690px;margin-top:16px}.hero__actions{margin-top:24px}.proof-row{margin-top:18px}.proof-row span{background:#fff;box-shadow:0 6px 18px rgba(15,23,42,.035)}.system-visual{border-radius:24px;padding:18px;background:linear-gradient(145deg,#fff,#f5f8ff)}.system-visual__core strong{font-size:25px}.system-visual__modules{gap:8px}.system-visual__modules div{padding:11px;border-radius:13px}.system-module-grid,.use-case-grid,.process-steps--v8{gap:12px}.system-module,.use-case-card,.process-step,.faq-item{padding:18px;border-radius:16px}.system-module:hover,.level-card:hover,.project-card:hover{transform:translateY(-1px)}.level-card{gap:12px;padding:15px 16px;border-radius:16px}.level-card__prices{gap:7px}.level-price,.level-note{border-radius:12px}.level-card__included strong{font-size:14px;line-height:1.35}.level-card__included li{background:#f9fbff}.ai-widget-section{background:linear-gradient(180deg,#111827,#17223a)}.ai-widget-card{border-radius:20px}.ai-widget-note{border-radius:16px}.project-card{border-radius:16px;padding:12px}.contact-card{position:relative;overflow:hidden;border-radius:22px}.contact-card::after{content:"";position:absolute;inset:auto -12% -35% auto;width:320px;height:320px;border-radius:50%;background:rgba(37,99,235,.18);pointer-events:none}.contact-card>*{position:relative}.site-footer{padding:34px 0;background:#0a1020}.site-footer__inner{gap:18px}
@media (min-width:760px){.hero__grid{grid-template-columns:1.08fr .78fr}.contact-card{grid-template-columns:1.25fr .75fr}.level-card{grid-template-columns:minmax(220px,.95fr) minmax(300px,1.05fr) minmax(250px,.95fr) auto}}
@media (max-width:720px){.section{padding:38px 0}.hero--v8{padding-top:42px}.hero__content--v8 h1{font-size:clamp(36px,11vw,50px)}.level-card__prices{grid-template-columns:1fr}.level-note{grid-column:auto}.ai-widget-card{border-radius:16px}.contact-card{padding:24px 20px}.site-footer{padding:28px 0}}

/* v9.0 visual experience polish */
:root{--vn-navy:#07111f;--vn-navy-2:#0c1b31;--vn-blue:#2f7cf6;--vn-cyan:#65d5ff}
.hero--v8{position:relative;overflow:hidden;background:radial-gradient(circle at 78% 12%,rgba(47,124,246,.32),transparent 31%),radial-gradient(circle at 18% 22%,rgba(101,213,255,.13),transparent 34%),linear-gradient(145deg,#07111f 0%,#0b1729 52%,#10213a 100%);color:#fff}
.hero--v8::after{content:"";position:absolute;inset:auto -18% -38% 54%;height:420px;border-radius:50%;background:rgba(47,124,246,.18);filter:blur(28px);pointer-events:none}.hero--v8 .hero__grid{position:relative;z-index:1}.hero--v8 h1,.hero--v8 h2,.hero--v8 h3{color:#fff}.hero--v8 .hero__text{color:rgba(255,255,255,.74)}.hero--v8 .eyebrow{color:#93c5fd}.hero--v8 .btn--secondary{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);color:#fff}.hero--v8 .proof-row span{border-color:rgba(255,255,255,.15);background:rgba(255,255,255,.08);box-shadow:none;color:rgba(255,255,255,.82)}
.system-visual{position:relative;border-color:rgba(147,197,253,.26);background:linear-gradient(160deg,rgba(255,255,255,.14),rgba(255,255,255,.06));box-shadow:0 28px 80px rgba(0,0,0,.28);backdrop-filter:blur(18px)}.system-visual__badge{background:rgba(147,197,253,.16);color:#bfdbfe}.system-visual__core{background:linear-gradient(145deg,#0b1220,#1d4ed8);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}.system-visual__modules{grid-template-columns:1fr}.system-visual__modules .system-flow__step{position:relative;display:grid;grid-template-columns:34px 1fr;gap:2px 10px;padding:13px 14px 13px 12px;border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.09);color:#fff}.system-flow__step i{grid-row:1/3;width:28px;height:28px;border-radius:10px;background:linear-gradient(135deg,#60a5fa,#2563eb);box-shadow:0 10px 22px rgba(37,99,235,.34)}.system-visual__modules .system-flow__step strong{color:#fff}.system-visual__modules .system-flow__step span{color:rgba(255,255,255,.70)}.system-flow__step:not(:last-child)::after{content:"";position:absolute;left:25px;bottom:-11px;width:2px;height:10px;background:rgba(147,197,253,.38)}
.system-module,.use-case-card,.process-step{position:relative;overflow:hidden}.system-module::after,.use-case-card::after,.process-step::after{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,var(--vn-blue),transparent);opacity:.55}.system-module .icon-badge{background:linear-gradient(135deg,#eef6ff,#e0ecff);box-shadow:inset 0 0 0 1px rgba(37,99,235,.08)}.system-module h3,.use-case-card h3{font-size:20px}.system-module p:not(.module-label),.use-case-card p{line-height:1.55}
.level-card{background:linear-gradient(180deg,#fff,#fbfdff);border-color:#dfe8f6}.level-card.is-recommended{transform:translateY(-1px);border-color:rgba(47,124,246,.72);background:linear-gradient(180deg,#f8fbff,#fff);box-shadow:0 22px 58px rgba(37,99,235,.16)}.level-card.is-recommended::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:linear-gradient(180deg,#60a5fa,#2563eb);border-radius:16px 0 0 16px}.level-card__badge{background:linear-gradient(135deg,#2563eb,#1d4ed8);box-shadow:0 12px 24px rgba(37,99,235,.22)}.level-price{background:#fff}.level-price--setup{border-color:#bfdbfe}.level-card__included strong{color:#0f172a}.level-card .btn{white-space:nowrap}
.ai-widget-section{position:relative;overflow:hidden;background:radial-gradient(circle at 75% 20%,rgba(47,124,246,.28),transparent 28%),linear-gradient(150deg,#07111f 0%,#0f1d33 54%,#111827 100%)}.ai-widget-card{position:relative;border:1px solid rgba(147,197,253,.28);box-shadow:0 30px 80px rgba(0,0,0,.32)}.ai-widget-card__header span{display:grid;place-items:center;background:radial-gradient(circle at 34% 30%,#93c5fd,#2563eb 62%,#0f172a);border-radius:999px}.ai-widget-card__header span::after{content:"AI";color:#fff;font-size:11px;font-weight:950}.ai-widget-actions{flex-wrap:wrap}.ai-widget-actions span{flex:0 0 auto;background:#eff6ff;border:1px solid #dbeafe}.ai-widget-feature{border-color:rgba(147,197,253,.18);background:rgba(255,255,255,.075);backdrop-filter:blur(10px)}.ai-widget-note{background:rgba(255,255,255,.075)}
.use-case-card span{background:#0f172a;color:#fff}.project-card{background:linear-gradient(180deg,#fff,#fbfdff)}.project-meta span{background:#f8fafc;color:#475569}.process-step{background:linear-gradient(180deg,#fff,#f9fbff)}.process-step__number{box-shadow:inset 0 0 0 1px rgba(37,99,235,.1)}
.contact-card{background:radial-gradient(circle at 84% 18%,rgba(96,165,250,.28),transparent 30%),linear-gradient(135deg,#07111f,#10213a)}.contact-card__actions{align-content:center}.contact-card__hint{width:100%;color:rgba(255,255,255,.70);font-size:13px;font-weight:750}.contact-card .btn--secondary{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);color:#fff}
@media (min-width:760px){.system-visual__modules{grid-template-columns:1fr}.ai-widget-layout{grid-template-columns:1fr .78fr}.contact-card__actions{justify-content:flex-end}}
@media (max-width:720px){.hero--v8{padding-bottom:34px}.system-visual__modules .system-flow__step{grid-template-columns:30px 1fr}.level-card .btn{width:100%}.contact-card__actions{display:grid}.contact-card__actions .btn{width:100%}}

/* v8.8 compact conversion polish */
.hero--v8 {
    min-height: auto;
    padding: clamp(46px, 5.8vw, 76px) 0 clamp(30px, 4vw, 46px);
}

.hero__grid {
    gap: clamp(24px, 4vw, 44px);
}

.hero__content--v8 h1 {
    max-width: 760px;
    font-size: clamp(38px, 5vw, 62px);
    line-height: 1.02;
}

.hero__text {
    max-width: 620px;
    margin-top: 14px;
    font-size: clamp(16px, 1.35vw, 19px);
    line-height: 1.58;
}

.hero__actions {
    margin-top: 20px;
}

.proof-row {
    margin-top: 16px;
}

.system-visual {
    max-width: 390px;
    padding: 16px;
    border-radius: 20px;
}

.system-visual__badge {
    padding: 6px 9px;
    font-size: 11px;
}

.system-visual__core {
    margin-top: 12px;
    padding: 14px;
    border-radius: 15px;
}

.system-visual__core strong {
    font-size: 21px;
    letter-spacing: 0;
}

.system-visual__core span {
    font-size: 13px;
}

.system-visual__modules {
    gap: 7px;
    margin-top: 9px;
}

.system-visual__modules .system-flow__step {
    grid-template-columns: 28px 1fr;
    padding: 10px 11px;
}

.system-flow__step i {
    width: 23px;
    height: 23px;
    border-radius: 8px;
}

.system-flow__step:not(:last-child)::after {
    left: 21px;
    bottom: -8px;
    height: 7px;
}

.packages-section--v8 {
    padding-top: clamp(34px, 4vw, 54px);
}

.level-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.level-card {
    display: flex;
    min-height: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 13px;
    padding: 17px;
    border-radius: 16px;
}

.level-card:hover,
.level-card.is-recommended {
    transform: none;
}

.level-card.is-recommended::before {
    inset: 0 0 auto 0;
    width: auto;
    height: 4px;
    border-radius: 16px 16px 0 0;
}

.level-card__head h3 {
    margin-bottom: 8px;
    font-size: 22px;
}

.level-card__head p:not(.eyebrow) {
    min-height: 42px;
    font-size: 14px;
    line-height: 1.45;
}

.level-card__badge {
    margin-top: 8px;
    padding: 5px 8px;
    font-size: 11px;
    line-height: 1.25;
}

.level-card__prices {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

.level-price,
.level-note {
    padding: 10px 11px;
}

.level-price strong {
    font-size: 21px;
    white-space: normal;
}

.level-note {
    grid-column: auto;
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
}

.level-card__included {
    flex: 1;
}

.level-card__included strong {
    font-size: 13px;
}

.level-card__included ul {
    display: grid;
    gap: 6px;
}

.level-card__included li {
    border: 0;
    padding: 0 0 0 15px;
    background: transparent;
    position: relative;
}

.level-card__included li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .65em;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--vn-accent);
}

.level-card .btn {
    width: 100%;
    min-height: 42px;
    padding: 10px 14px;
}

.ai-widget-section {
    padding: clamp(38px, 4.8vw, 64px) 0;
}

.ai-widget-layout {
    gap: 22px;
}

.ai-widget-note {
    margin-top: 16px;
    padding: 15px;
}

.ai-widget-cta {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 10px;
}

.ai-widget-card {
    max-width: 360px;
    padding: 15px;
}

.ai-message {
    margin-top: 11px;
    padding: 10px 12px;
    font-size: 14px;
}

.ai-widget-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.ai-widget-feature {
    padding: 15px;
}

.ai-widget-feature h3 {
    font-size: 17px;
}

.projects-section {
    padding-top: clamp(36px, 4.6vw, 62px);
}

.project-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.project-card {
    display: flex;
    flex-direction: column;
    padding: 0;
    overflow: hidden;
}

.project-media {
    aspect-ratio: 1.08 / .72;
    background: #eef4ff;
    overflow: hidden;
}

.project-card__image {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.project-placeholder {
    height: 100%;
    display: grid;
    align-content: end;
    gap: 8px;
    padding: 18px;
    background: linear-gradient(145deg, #0f172a, #1d4ed8);
    color: #fff;
}

.project-placeholder span {
    width: max-content;
    max-width: 100%;
    padding: 5px 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .14);
    color: rgba(255, 255, 255, .78);
    font-size: 11px;
    font-weight: 900;
}

.project-placeholder strong {
    color: #fff;
    font-size: 22px;
    line-height: 1.1;
}

.project-card__body {
    flex: 1;
    padding: 15px;
}

.project-card__topline {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.project-card__topline .eyebrow {
    margin-bottom: 0;
}

.project-card__topline span {
    flex: 0 0 auto;
    padding: 5px 7px;
    border-radius: 999px;
    background: #eff6ff;
    color: #1d4ed8;
    font-size: 11px;
    font-weight: 900;
}

.project-card--example_solution .project-card__topline span {
    background: #f8fafc;
    color: #475569;
}

.project-card__body h3 {
    margin-top: 4px;
    font-size: 21px;
}

.project-card__body p {
    font-size: 14px;
    line-height: 1.5;
}

.project-meta {
    gap: 5px;
}

.project-meta span {
    border-radius: 8px;
    font-size: 11px;
}

@media (max-width: 1120px) {
    .level-grid,
    .project-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .hero--v8 {
        padding-top: 36px;
    }

    .hero__content--v8 h1 {
        font-size: clamp(34px, 10vw, 46px);
    }

    .system-visual {
        padding: 14px;
    }

    .level-grid,
    .project-grid,
    .ai-widget-grid {
        grid-template-columns: 1fr;
    }

    .level-card__head p:not(.eyebrow) {
        min-height: 0;
    }

    .ai-widget-card {
        max-width: none;
    }

    .ai-widget-cta .btn {
        width: 100%;
    }
}

/* corrective product/project cards */
.level-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.level-card {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 18px;
    border-radius: 16px;
    background: linear-gradient(180deg, #fff, #fbfdff);
    border: 1px solid #dfe8f6;
}

.level-card.is-recommended {
    border-color: rgba(37, 99, 235, .7);
    box-shadow: 0 20px 46px rgba(37, 99, 235, .14);
}

.level-card.is-recommended::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 4px;
    border-radius: 16px 16px 0 0;
    background: linear-gradient(90deg, #60a5fa, #2563eb);
}

.level-card__head h3 {
    margin-bottom: 8px;
    font-size: 22px;
}

.level-card__head p:not(.eyebrow) {
    color: var(--vn-muted);
    font-size: 14px;
    line-height: 1.45;
}

.level-card__badge {
    display: inline-flex;
    margin-top: 8px;
    padding: 5px 9px;
    border-radius: 999px;
    background: #2563eb;
    color: #fff;
    font-size: 11px;
    font-weight: 950;
    line-height: 1.25;
}

.level-card__prices {
    display: grid;
    gap: 8px;
}

.level-card__prices > div {
    padding: 10px 11px;
    border: 1px solid var(--vn-line);
    border-radius: 12px;
    background: #fff;
}

.level-card__prices small,
.level-card__included > span {
    display: block;
    color: #667085;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.level-card__prices strong {
    display: block;
    margin-top: 5px;
    color: var(--vn-dark);
    font-size: 22px;
    line-height: 1.05;
}

.level-card__prices em {
    display: block;
    margin-top: 5px;
    color: var(--vn-muted);
    font-size: 12px;
    font-style: normal;
    line-height: 1.35;
}

.level-card__included {
    display: grid;
    flex: 1;
    gap: 8px;
}

.level-card__included strong {
    color: #0f172a;
    font-size: 14px;
    line-height: 1.35;
}

.level-card__included ul {
    display: grid;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.level-card__included li {
    position: relative;
    padding-left: 15px;
    color: #344054;
    font-size: 13px;
    line-height: 1.35;
}

.level-card__included li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .58em;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--vn-accent);
}

@media (max-width: 1120px) {
    .level-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .level-grid {
        grid-template-columns: 1fr;
    }
}

/* v8.9 final public polish */
html {
    scroll-padding-top: calc(var(--vn-header-height, 72px) + 18px);
}

body.vn-menu-open {
    overflow: hidden;
}

.admin-bar .site-header {
    top: 32px;
}

.site-header {
    background: rgba(255, 255, 255, .94);
}

.site-header__inner {
    min-height: 66px;
}

.site-nav__menu a {
    position: relative;
    white-space: nowrap;
}

.site-nav__menu a::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -7px;
    left: 0;
    height: 2px;
    border-radius: 999px;
    background: var(--vn-accent);
    opacity: 0;
    transform: scaleX(.72);
    transition: opacity .18s ease, transform .18s ease;
}

.site-nav__menu a:hover::after,
.site-nav__menu a:focus-visible::after {
    opacity: 1;
    transform: scaleX(1);
}

.mobile-drawer {
    overflow-y: auto;
}

.admin-bar .mobile-drawer {
    top: 32px;
    height: calc(100vh - 32px);
}

.hero--v8 {
    min-height: clamp(560px, 72vh, 760px);
    display: grid;
    align-items: center;
}

.hero--v8::before {
    content: "";
    position: absolute;
    inset: 9% 7% auto auto;
    width: min(36vw, 420px);
    aspect-ratio: 1;
    border: 1px solid rgba(147, 197, 253, .18);
    border-radius: 50%;
    background: radial-gradient(circle at 35% 35%, rgba(96, 165, 250, .38), transparent 36%);
    opacity: .72;
    pointer-events: none;
}

.hero__content--v8 h1 {
    max-width: 820px;
    text-wrap: balance;
}

.hero__text {
    text-wrap: pretty;
}

.section {
    padding: clamp(40px, 4.8vw, 66px) 0;
}

.services-section--v8,
.packages-section--v8,
.projects-section {
    padding-top: clamp(34px, 4.2vw, 58px);
}

.level-grid {
    align-items: stretch;
}

.level-card {
    min-width: 0;
}

.level-card__prices > div {
    min-width: 0;
}

.level-card__prices strong {
    overflow-wrap: anywhere;
}

.level-card .btn {
    margin-top: auto;
}

.project-media {
    position: relative;
    aspect-ratio: 1 / 1;
    border-bottom: 1px solid var(--vn-line);
}

.project-gallery {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: #eef4ff;
}

.project-gallery__image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    animation: vn-project-gallery 12s infinite;
}

.project-gallery__image:nth-child(1) {
    opacity: 1;
    animation-delay: 0s;
}

.project-gallery__image:nth-child(2) {
    animation-delay: 3s;
}

.project-gallery__image:nth-child(3) {
    animation-delay: 6s;
}

.project-gallery__image:nth-child(4) {
    animation-delay: 9s;
}

@keyframes vn-project-gallery {
    0%, 22% {
        opacity: 1;
        transform: scale(1);
    }

    30%, 100% {
        opacity: 0;
        transform: scale(1.025);
    }
}

.scroll-top {
    position: fixed;
    right: 18px;
    bottom: 92px;
    z-index: 99990;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 999px;
    background: #0f172a;
    color: #fff;
    cursor: pointer;
    display: grid;
    place-items: center;
    font: inherit;
    font-size: 18px;
    font-weight: 900;
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px);
    transition: opacity .18s ease, transform .18s ease, box-shadow .18s ease;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .24);
}

.scroll-top.is-visible {
    opacity: 1;
    pointer-events: auto;
    transform: none;
}

.scroll-top:hover {
    box-shadow: 0 18px 42px rgba(15, 23, 42, .3);
}

@media (max-width: 782px) {
    .admin-bar .site-header {
        top: 46px;
    }

    .admin-bar .mobile-drawer {
        top: 46px;
        height: calc(100vh - 46px);
    }
}

@media (max-width: 720px) {
    .hero--v8 {
        min-height: auto;
        padding-top: 36px;
    }

    .scroll-top {
        right: 14px;
        bottom: 82px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .project-gallery__image {
        animation: none;
        opacity: 0;
        transform: none;
    }

    .project-gallery__image:first-child {
        opacity: 1;
    }
}

/* VNTech 2.8.0 final stabilization: content visible, no nested overflow. */
.home.has-vn-animations [data-vn-animate],
.home [data-vn-animate] {
    opacity: 1 !important;
    transform: none !important;
}

.home .hero,
.home .hero-dashboard,
.home .hero-dashboard__shell,
.home .hero-dashboard__content,
.home .hero-dashboard__table,
.home .system-module,
.home .level-card,
.home .project-card,
.home .project-spotlight,
.home .ai-advisor-wrap,
.home .use-case-card,
.home .process-step,
.home .faq-item,
.home .contact-conversion,
.home .site-footer {
    min-width: 0;
    max-width: 100%;
}

.home .hero {
    overflow: hidden;
}

.home .hero-dashboard__shell,
.home .project-card,
.home .level-card,
.home .process-step {
    overflow: hidden;
}

.home .hero-dashboard__topbar,
.home .hero-dashboard__stats,
.home .hero-dashboard__table span,
.home .process-step,
.home .project-action,
.home .btn,
.home .text-link {
    overflow-wrap: anywhere;
}

.home .hero-dashboard__topbar nav {
    flex-wrap: wrap;
}

.home .hero-dashboard__wave {
    max-width: 100%;
    overflow: hidden;
}

.home .process-steps--v272 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.home .process-step--v272 {
    width: auto;
}

@media (max-width: 1180px) {
    .home .process-steps--v272 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .home .process-steps--v272 {
        grid-template-columns: minmax(0, 1fr);
    }

    .home .hero-dashboard__content,
    .home .hero-dashboard__stats {
        grid-template-columns: minmax(0, 1fr);
    }

    .home .hero-dashboard__table span {
        grid-template-columns: minmax(0, 1fr);
    }

    .home .hero-dashboard__table span i {
        justify-self: start;
    }

    .home .hero-dashboard__wave {
        display: none;
    }

    .home .hero::before,
    .home .hero::after {
        display: none !important;
    }
}

/* VNTech 2.7.6 - final cascade guard for the accepted micro-fix scope */
.packages-section--v272 {
    background:
        radial-gradient(circle at 82% 10%, rgba(37, 99, 235, .10), transparent 28%),
        linear-gradient(180deg, #f7fbff 0%, #edf4fd 100%);
}

.packages-stage--v272 {
    color: #07122b;
    border-color: rgba(37, 99, 235, .16);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .98) 0%, rgba(244, 248, 255, .96) 100%);
    box-shadow: 0 24px 58px rgba(15, 23, 42, .10);
}

.packages-stage--v272::before {
    opacity: .34;
    background: linear-gradient(90deg, transparent, rgba(37, 99, 235, .34), transparent);
}

.packages-stage--v272 .section-heading h2 {
    color: #061126;
}

.packages-stage--v272 .section-heading p:not(.eyebrow) {
    color: #334155;
}

.packages-stage--v272 .eyebrow,
.packages-stage--v272 .level-card .eyebrow {
    color: #1d4ed8;
}

.packages-stage--v272 .level-card {
    color: #07122b;
    border: 1px solid rgba(148, 163, 184, .30);
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    box-shadow: 0 16px 38px rgba(15, 23, 42, .075);
}

.packages-stage--v272 .level-card:hover,
.packages-stage--v272 .level-card:focus-within,
.packages-stage--v272 .level-card.has-open-details {
    border-color: rgba(37, 99, 235, .42);
    box-shadow: 0 24px 52px rgba(15, 23, 42, .12);
}

.packages-stage--v272 .level-card.is-recommended {
    border-color: rgba(29, 78, 216, .62);
    background: linear-gradient(180deg, #ffffff 0%, #eef5ff 100%);
    box-shadow: 0 26px 62px rgba(37, 99, 235, .18);
}

.packages-stage--v272 .level-card::before {
    background: linear-gradient(90deg, rgba(37, 99, 235, .82), rgba(14, 165, 233, .30));
    opacity: .86;
}

.packages-stage--v272 .level-card__title,
.packages-stage--v272 .level-card__head h3 {
    color: #061126;
}

.packages-stage--v272 .level-card__head p:not(.eyebrow) {
    color: #334155;
}

.packages-stage--v272 .level-card__badge {
    color: #ffffff;
    background: linear-gradient(135deg, #1557f0, #0f3fd7);
    box-shadow: 0 10px 22px rgba(37, 99, 235, .22);
}

.packages-stage--v272 .level-card__pricing {
    border: 1px solid rgba(37, 99, 235, .18);
    background:
        radial-gradient(circle at 88% 12%, rgba(59, 130, 246, .26), transparent 34%),
        linear-gradient(135deg, #07111f 0%, #0f2340 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

.packages-stage--v272 .level-card.is-recommended .level-card__pricing {
    background:
        radial-gradient(circle at 86% 10%, rgba(147, 197, 253, .32), transparent 34%),
        linear-gradient(135deg, #0b4cff 0%, #0f2d8f 100%);
}

.packages-stage--v272 .level-card__pricing strong {
    color: #ffffff;
}

.packages-stage--v272 .level-card__pricing span {
    color: #dbeafe;
}

.packages-stage--v272 .level-card__details {
    color: #334155;
    border: 1px solid rgba(148, 163, 184, .30);
    background: #ffffff;
}

.packages-stage--v272 .level-card__details summary {
    color: #0f172a;
    font-weight: 950;
    cursor: pointer;
}

.packages-stage--v272 .level-card__details summary::after {
    color: #ffffff;
    background: #1557f0;
}

.packages-stage--v272 .level-card__details[open] {
    border-color: rgba(37, 99, 235, .34);
    background: #ffffff;
    box-shadow: inset 0 0 0 1px rgba(37, 99, 235, .08);
}

.packages-stage--v272 .level-card__details-body,
.packages-stage--v272 .level-card__details-body p,
.packages-stage--v272 .level-card__disclaimer {
    color: #334155;
}

.packages-stage--v272 .level-card__orientation,
.packages-stage--v272 .level-card__features li,
.packages-stage--v272 .level-card__terms div {
    color: #0f172a;
    border-color: rgba(148, 163, 184, .28);
    background: #f8fafc;
}

.packages-stage--v272 .level-card__orientation span,
.packages-stage--v272 .level-card__terms dt {
    color: #1d4ed8;
}

.packages-stage--v272 .level-card__terms dd,
.packages-stage--v272 .level-card__orientation strong {
    color: #0f172a;
}

.packages-stage--v272 .level-card__actions .btn--ghost {
    color: #0f3fd7;
    border-color: rgba(37, 99, 235, .38);
    background: #ffffff;
}

.packages-stage--v272 .level-card__actions .btn--ghost:hover,
.packages-stage--v272 .level-card__actions .btn--ghost:focus-visible {
    color: #ffffff;
    background: #1557f0;
    border-color: #1557f0;
}

.packages-section--v272 .pricing-disclaimer--v26 {
    color: #334155;
    border-color: rgba(148, 163, 184, .30);
    background: rgba(255, 255, 255, .92);
}

@media (min-width: 761px) {
    .scroll-top {
        right: 84px !important;
        bottom: 22px !important;
        width: 46px !important;
        height: 46px !important;
        border-radius: 16px !important;
    }
}

.site-footer--v276 .site-footer__inner--patch2 {
    padding-top: 20px;
    padding-bottom: 58px;
}

.site-footer--v276 .site-footer__grid {
    gap: clamp(16px, 3vw, 26px);
}

.site-footer--v276 .site-footer__brand-row {
    margin-bottom: 8px;
}

.site-footer--v276 .site-footer__brand p {
    margin-top: 8px;
    line-height: 1.5;
}

.site-footer--v276 .site-footer__trust {
    margin-top: 10px;
    padding: 6px 10px;
    line-height: 1.28;
}

.site-footer--v276 .site-footer__heading {
    margin-bottom: 10px;
}

.site-footer--v276 .site-footer__links,
.site-footer--v276 .site-footer__contact-list {
    gap: 7px;
}

.site-footer--v276 .site-footer__bottom {
    margin-top: 14px;
    padding-top: 10px;
}

@media (max-width: 760px) {
    .packages-stage--v272 {
        padding: 20px 14px;
    }

    .packages-stage--v272 .level-card {
        padding: 18px;
    }

    .packages-stage--v272 .level-card__title,
    .packages-stage--v272 .level-card__head h3 {
        font-size: 21px;
    }

    .packages-stage--v272 .level-card__head p:not(.eyebrow),
    .packages-stage--v272 .level-card__details-body,
    .packages-stage--v272 .level-card__details-body p {
        font-size: 14px;
        line-height: 1.55;
    }

    .packages-stage--v272 .level-card__pricing strong {
        font-size: 28px;
    }

    .packages-stage--v272 .level-card__details summary {
        min-height: 44px;
        font-size: 15px;
    }

    .site-footer--v276 .site-footer__inner--patch2 {
        padding-top: 18px;
        padding-bottom: 62px;
    }

    .site-footer--v276 .site-footer__grid {
        gap: 18px;
    }

    .site-footer--v276 .site-footer__bottom {
        margin-top: 12px;
    }
}

/* VNTech 2.7.6 - final readability, floating controls, footer height micro-fix */
.packages-section--v272 {
    background:
        radial-gradient(circle at 82% 10%, rgba(37, 99, 235, .10), transparent 28%),
        linear-gradient(180deg, #f7fbff 0%, #edf4fd 100%);
}

.packages-stage--v272 {
    color: #07122b;
    border-color: rgba(37, 99, 235, .16);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .98) 0%, rgba(244, 248, 255, .96) 100%);
    box-shadow: 0 24px 58px rgba(15, 23, 42, .10);
}

.packages-stage--v272::before {
    opacity: .34;
    background: linear-gradient(90deg, transparent, rgba(37, 99, 235, .34), transparent);
}

.packages-stage--v272 .section-heading h2 {
    color: #061126;
}

.packages-stage--v272 .section-heading p:not(.eyebrow) {
    color: #334155;
}

.packages-stage--v272 .eyebrow {
    color: #1d4ed8;
}

.packages-stage--v272 .level-card {
    color: #07122b;
    border: 1px solid rgba(148, 163, 184, .30);
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    box-shadow: 0 16px 38px rgba(15, 23, 42, .075);
}

.packages-stage--v272 .level-card:hover,
.packages-stage--v272 .level-card:focus-within,
.packages-stage--v272 .level-card.has-open-details {
    border-color: rgba(37, 99, 235, .42);
    box-shadow: 0 24px 52px rgba(15, 23, 42, .12);
}

.packages-stage--v272 .level-card.is-recommended {
    border-color: rgba(29, 78, 216, .62);
    background:
        linear-gradient(180deg, #ffffff 0%, #eef5ff 100%);
    box-shadow: 0 26px 62px rgba(37, 99, 235, .18);
}

.packages-stage--v272 .level-card::before {
    background: linear-gradient(90deg, rgba(37, 99, 235, .82), rgba(14, 165, 233, .30));
    opacity: .86;
}

.packages-stage--v272 .level-card .eyebrow {
    color: #1d4ed8;
}

.packages-stage--v272 .level-card__title,
.packages-stage--v272 .level-card__head h3 {
    color: #061126;
}

.packages-stage--v272 .level-card__head p:not(.eyebrow) {
    color: #334155;
}

.packages-stage--v272 .level-card__badge {
    color: #ffffff;
    background: linear-gradient(135deg, #1557f0, #0f3fd7);
    box-shadow: 0 10px 22px rgba(37, 99, 235, .22);
}

.packages-stage--v272 .level-card__pricing {
    border: 1px solid rgba(37, 99, 235, .18);
    background:
        radial-gradient(circle at 88% 12%, rgba(59, 130, 246, .26), transparent 34%),
        linear-gradient(135deg, #07111f 0%, #0f2340 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

.packages-stage--v272 .level-card.is-recommended .level-card__pricing {
    background:
        radial-gradient(circle at 86% 10%, rgba(147, 197, 253, .32), transparent 34%),
        linear-gradient(135deg, #0b4cff 0%, #0f2d8f 100%);
}

.packages-stage--v272 .level-card__pricing strong {
    color: #ffffff;
}

.packages-stage--v272 .level-card__pricing span {
    color: #dbeafe;
}

.packages-stage--v272 .level-card__details {
    border: 1px solid rgba(148, 163, 184, .30);
    background: #ffffff;
    color: #334155;
}

.packages-stage--v272 .level-card__details summary {
    color: #0f172a;
    font-weight: 950;
    cursor: pointer;
}

.packages-stage--v272 .level-card__details summary::after {
    color: #ffffff;
    background: #1557f0;
}

.packages-stage--v272 .level-card__details[open] {
    border-color: rgba(37, 99, 235, .34);
    background: #ffffff;
    box-shadow: inset 0 0 0 1px rgba(37, 99, 235, .08);
}

.packages-stage--v272 .level-card__details-body,
.packages-stage--v272 .level-card__details-body p,
.packages-stage--v272 .level-card__disclaimer {
    color: #334155;
}

.packages-stage--v272 .level-card__orientation,
.packages-stage--v272 .level-card__features li,
.packages-stage--v272 .level-card__terms div {
    border-color: rgba(148, 163, 184, .28);
    background: #f8fafc;
    color: #0f172a;
}

.packages-stage--v272 .level-card__orientation span,
.packages-stage--v272 .level-card__terms dt {
    color: #1d4ed8;
}

.packages-stage--v272 .level-card__terms dd,
.packages-stage--v272 .level-card__orientation strong {
    color: #0f172a;
}

.packages-stage--v272 .level-card__actions .btn--ghost {
    color: #0f3fd7;
    border-color: rgba(37, 99, 235, .38);
    background: #ffffff;
}

.packages-stage--v272 .level-card__actions .btn--ghost:hover,
.packages-stage--v272 .level-card__actions .btn--ghost:focus-visible {
    color: #ffffff;
    background: #1557f0;
    border-color: #1557f0;
}

.packages-section--v272 .pricing-disclaimer--v26 {
    color: #334155;
    border-color: rgba(148, 163, 184, .30);
    background: rgba(255, 255, 255, .92);
}

@media (min-width: 761px) {
    .scroll-top {
        right: 84px;
        bottom: 22px;
        width: 46px;
        height: 46px;
        border-radius: 16px;
    }
}

.site-footer--v276 .site-footer__inner--patch2 {
    padding-top: 20px;
    padding-bottom: 58px;
}

.site-footer--v276 .site-footer__grid {
    gap: clamp(16px, 3vw, 26px);
}

.site-footer--v276 .site-footer__brand-row {
    margin-bottom: 8px;
}

.site-footer--v276 .site-footer__brand p {
    margin-top: 8px;
    line-height: 1.5;
}

.site-footer--v276 .site-footer__trust {
    margin-top: 10px;
    padding: 6px 10px;
    line-height: 1.28;
}

.site-footer--v276 .site-footer__heading {
    margin-bottom: 10px;
}

.site-footer--v276 .site-footer__links,
.site-footer--v276 .site-footer__contact-list {
    gap: 7px;
}

.site-footer--v276 .site-footer__bottom {
    margin-top: 14px;
    padding-top: 10px;
}

@media (max-width: 760px) {
    .packages-stage--v272 {
        padding: 20px 14px;
    }

    .packages-stage--v272 .level-card {
        padding: 18px;
    }

    .packages-stage--v272 .level-card__title,
    .packages-stage--v272 .level-card__head h3 {
        font-size: 21px;
    }

    .packages-stage--v272 .level-card__head p:not(.eyebrow),
    .packages-stage--v272 .level-card__details-body,
    .packages-stage--v272 .level-card__details-body p {
        font-size: 14px;
        line-height: 1.55;
    }

    .packages-stage--v272 .level-card__pricing strong {
        font-size: 28px;
    }

    .packages-stage--v272 .level-card__details summary {
        min-height: 44px;
        font-size: 15px;
    }

    .site-footer--v276 .site-footer__inner--patch2 {
        padding-top: 18px;
        padding-bottom: 62px;
    }

    .site-footer--v276 .site-footer__grid {
        gap: 18px;
    }

    .site-footer--v276 .site-footer__bottom {
        margin-top: 12px;
    }
}

/* v0.9.0 hero identity and premium brand correction */
.site-brand {
    gap: 11px;
}

.site-brand__mark--vn {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    background: transparent;
    box-shadow: 0 14px 32px rgba(15, 23, 42, .16);
}

.site-brand__mark--vn svg {
    display: block;
    width: 44px;
    height: 44px;
}

.site-brand__mark-bg {
    fill: #07111f;
}

.site-brand__mark-v {
    fill: #fff;
}

.site-brand__mark-n {
    fill: #60a5fa;
    opacity: .95;
}

.site-brand__text strong {
    color: #07111f;
    font-weight: 950;
}

.site-brand__text small {
    color: #526173;
    font-size: 12px;
    letter-spacing: .02em;
}

.hero--v8 {
    min-height: clamp(520px, 68vh, 700px);
    background:
        linear-gradient(rgba(147, 197, 253, .08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(147, 197, 253, .07) 1px, transparent 1px),
        radial-gradient(circle at 18% 24%, rgba(96, 165, 250, .26), transparent 30%),
        radial-gradient(circle at 82% 16%, rgba(45, 212, 191, .15), transparent 30%),
        linear-gradient(145deg, #06101f 0%, #09192f 52%, #10213a 100%);
    background-size: auto, 72px 72px, auto, auto, auto;
}

.hero--v8::before {
    inset: 11% 4% auto auto;
    width: min(38vw, 460px);
    background:
        radial-gradient(circle at 35% 35%, rgba(96, 165, 250, .48), transparent 34%),
        conic-gradient(from 180deg, rgba(96, 165, 250, .28), transparent, rgba(45, 212, 191, .18), transparent);
    animation: vn-hero-orbit 12s ease-in-out infinite alternate;
}

.hero--v8::after {
    inset: auto -14% -42% 48%;
    height: 520px;
    background: rgba(37, 99, 235, .26);
    animation: vn-hero-glow 10s ease-in-out infinite alternate;
}

.hero__content--v8 h1 {
    font-size: clamp(40px, 5.4vw, 70px);
    line-height: 1;
}

.hero__accent {
    color: #60a5fa;
    text-shadow: 0 0 36px rgba(96, 165, 250, .36);
}

.hero--v8 .system-visual {
    max-width: 350px;
    justify-self: center;
    padding: 14px;
    border-radius: 22px;
    transform: rotate(-1deg);
}

.hero--v8 .system-visual__core {
    padding: 14px;
}

.hero--v8 .system-visual__core strong {
    font-size: 21px;
}

@keyframes vn-hero-orbit {
    from {
        opacity: .56;
        transform: translate3d(0, 0, 0) rotate(0deg);
    }

    to {
        opacity: .88;
        transform: translate3d(-16px, 10px, 0) rotate(8deg);
    }
}

@keyframes vn-hero-glow {
    from {
        opacity: .46;
        transform: translate3d(0, 0, 0) scale(1);
    }

    to {
        opacity: .72;
        transform: translate3d(-22px, -12px, 0) scale(1.04);
    }
}

@media (max-width: 760px) {
    .site-brand__mark--vn,
    .site-brand__mark--vn svg {
        width: 40px;
        height: 40px;
    }

    .hero--v8 {
        min-height: auto;
        background-size: auto, 48px 48px, auto, auto, auto;
    }

    .hero--v8 .system-visual {
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .hero--v8::before,
    .hero--v8::after {
        animation: none;
    }
}

/* v0.9.1 business reposition, product cards and package details */
.site-brand__mark--wordmark {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: #07111f;
    color: #fff;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .16);
}

.site-brand__mark--wordmark svg {
    width: 25px;
    height: 25px;
    fill: currentColor;
}

.hero--v8 {
    min-height: auto;
    background:
        linear-gradient(rgba(147, 197, 253, .08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(147, 197, 253, .07) 1px, transparent 1px),
        linear-gradient(145deg, #07111f 0%, #0b1729 58%, #10213a 100%);
    background-size: 48px 48px, 48px 48px, auto;
}

.hero--v8::before {
    inset: 0;
    width: auto;
    height: auto;
    background:
        linear-gradient(120deg, rgba(96, 165, 250, .14), transparent 34%),
        linear-gradient(180deg, transparent 0%, rgba(255, 255, 255, .04) 100%);
    animation: none;
    filter: none;
    pointer-events: none;
}

.hero--v8::after {
    inset: 13% max(22px, calc((100vw - 1180px) / 2)) auto auto;
    width: min(30vw, 340px);
    height: 230px;
    border: 1px solid rgba(147, 197, 253, .18);
    border-radius: 18px;
    background:
        linear-gradient(90deg, rgba(147, 197, 253, .30) 0 18%, transparent 18% 100%),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, .12) 0 1px, transparent 1px 34px),
        linear-gradient(145deg, rgba(255, 255, 255, .10), rgba(255, 255, 255, .035));
    animation: none;
    filter: none;
    opacity: .48;
}

.hero--v8 .system-visual {
    max-width: 380px;
    transform: none;
    background: linear-gradient(160deg, rgba(255, 255, 255, .13), rgba(255, 255, 255, .055));
}

.hero--v8 .system-visual__core {
    background: #0b1220;
}

.level-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.level-card {
    align-items: stretch;
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 18px;
}

.level-card__head h3,
.level-card__title {
    font-size: 22px;
    line-height: 1.1;
}

.level-card__commercial {
    width: 100%;
}

.level-card__prices {
    grid-template-columns: 1fr;
}

.level-card__prices > div,
.level-price,
.level-note {
    min-height: 0;
    padding: 11px 12px;
}

.level-note {
    grid-column: auto;
}

.level-note strong,
.level-price strong {
    white-space: normal;
}

.level-card__included ul {
    display: grid;
    gap: 6px;
}

.level-card__included li {
    border-radius: 10px;
}

.level-card__actions {
    display: grid;
    gap: 8px;
    margin-top: auto;
}

.use-case-card p strong {
    color: #0f172a;
}

.process-steps--v8 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1180px) {
    .level-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .site-brand__mark--wordmark {
        width: 36px;
        height: 36px;
    }

    .hero--v8::after {
        display: none;
    }

    .level-grid,
    .process-steps--v8 {
        grid-template-columns: 1fr;
    }

}

.ai-widget-section {
    background: #f7faff;
    color: var(--vn-text);
}

.ai-widget-section h2,
.ai-widget-section h3 {
    color: var(--vn-dark);
}

.ai-widget-section .section-heading {
    max-width: 680px;
}

.ai-widget-section .section-heading p:not(.eyebrow),
.ai-widget-feature p,
.ai-widget-note span {
    color: var(--vn-muted);
}

.ai-widget-layout {
    align-items: start;
    grid-template-columns: minmax(0, 1.1fr) minmax(260px, .7fr);
}

.ai-widget-note {
    margin-top: 14px;
    padding: 14px;
    border-color: #e2e8f0;
    background: #fff;
}

.ai-widget-card {
    max-width: 340px;
    padding: 14px;
    border-color: #dbe7f6;
    box-shadow: 0 16px 36px rgba(15, 23, 42, .08);
}

.ai-message {
    padding: 10px 12px;
    font-size: 13px;
}

.ai-widget-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 14px;
}

.ai-widget-feature {
    padding: 14px;
    border-color: #e2e8f0;
    background: #fff;
}

@media (max-width: 980px) {
    .ai-widget-layout,
    .ai-widget-grid {
        grid-template-columns: 1fr;
    }

    .ai-widget-card {
        max-width: none;
        justify-self: stretch;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ai-widget-section * {
        animation: none !important;
    }
}

/* v0.9.5 header, hero and product-level consolidation */
.site-header__inner {
    gap: 18px;
    padding: 8px 0;
}

.site-brand {
    gap: 10px;
}

.site-brand__logo {
    display: inline-flex;
    align-items: center;
}

.site-brand__logo img {
    max-height: 38px;
    width: auto;
}

.site-brand--custom_logo_only .site-brand__logo img {
    max-height: 40px;
}

.site-brand__mark,
.site-brand__mark--wordmark {
    display: none !important;
}

.site-brand__text strong {
    font-size: 20px;
    line-height: 1;
}

.site-brand__text small {
    color: #5d6b7e;
    font-size: 11px;
    font-weight: 760;
}

.site-nav__menu {
    gap: 20px;
}

.site-header__cta {
    min-height: 40px;
    padding: 10px 16px;
}

.hero--v8 {
    min-height: auto;
    padding: clamp(42px, 5.8vw, 74px) 0 clamp(30px, 4vw, 46px);
    background:
        linear-gradient(rgba(147, 197, 253, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(147, 197, 253, .045) 1px, transparent 1px),
        radial-gradient(circle at 78% 22%, rgba(96, 165, 250, .14), transparent 30%),
        linear-gradient(145deg, #07111f 0%, #0a1525 58%, #0e1d33 100%);
    background-size: 54px 54px, 54px 54px, auto, auto;
}

.hero--v8::after {
    display: none !important;
}

.hero--v8::before {
    background: linear-gradient(120deg, rgba(96, 165, 250, .08), transparent 42%);
    opacity: .65;
}

.hero--v8 .hero__grid {
    gap: clamp(24px, 4vw, 44px);
}

.hero--v8 .hero__grid::before {
    right: clamp(12px, 2vw, 28px);
    width: min(30vw, 320px);
    opacity: .14;
    box-shadow: none;
}

.hero--v8 .hero__grid::after {
    right: clamp(10px, 1.8vw, 24px);
    bottom: 10%;
    width: min(18vw, 170px);
    opacity: .16;
    box-shadow: none;
}

.hero__content--v8 h1 {
    max-width: 760px;
    font-size: clamp(34px, 4.6vw, 58px);
    line-height: 1.05;
}

.hero__text {
    max-width: 660px;
    margin-top: 15px;
    font-size: clamp(16px, 1.3vw, 19px);
    line-height: 1.62;
}

.hero__actions {
    margin-top: 22px;
}

.proof-row {
    gap: 8px;
    margin-top: 18px;
}

.proof-row span {
    padding: 7px 10px;
    font-size: 12px;
}

.service-preview {
    position: relative;
    z-index: 2;
    justify-self: end;
    width: min(100%, 286px);
}

.service-preview__browser {
    overflow: hidden;
    border: 1px solid rgba(226, 232, 240, .92);
    border-radius: 14px;
    background: linear-gradient(180deg, #ffffff, #f5f8ff);
    box-shadow: 0 16px 38px rgba(2, 6, 23, .18);
}

.service-preview__bar {
    display: flex;
    gap: 5px;
    padding: 9px 10px;
    border-bottom: 1px solid #e2e8f0;
}

.service-preview__bar span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #cbd5e1;
}

.service-preview__hero {
    height: 76px;
    margin: 12px;
    border-radius: 11px;
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .88) 0 36%, transparent 36%),
        repeating-linear-gradient(0deg, #dbeafe 0 7px, transparent 7px 17px),
        linear-gradient(135deg, #eff6ff, #ffffff);
}

.service-preview__lines {
    display: grid;
    gap: 7px;
    padding: 0 12px 13px;
}

.service-preview__lines i {
    display: block;
    height: 8px;
    border-radius: 999px;
    background: #e2e8f0;
}

.service-preview__lines i:nth-child(2) {
    width: 72%;
}

.service-preview__lines i:nth-child(3) {
    width: 56%;
}

.service-preview__status {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 10px;
}

.service-status-pill {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 6px 9px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 999px;
    background: rgba(255, 255, 255, .075);
    color: rgba(255, 255, 255, .82);
    font-size: 12px;
    font-weight: 850;
}

.level-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.level-card {
    min-height: 0;
    gap: 9px;
    padding: 14px;
    border-radius: 14px;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .045);
}

.level-card:hover {
    transform: translateY(-1px);
}

.level-card.is-recommended {
    border-color: rgba(37, 99, 235, .50);
    box-shadow: 0 12px 28px rgba(37, 99, 235, .10);
}

.level-card.is-recommended::before {
    width: 3px;
    border-radius: 14px 0 0 14px;
}

.level-card__head .eyebrow {
    margin-bottom: 6px;
}

.level-card__title,
.level-card__head h3 {
    font-size: 21px;
}

.level-card__head p:not(.eyebrow) {
    font-size: 13px;
    line-height: 1.42;
}

.level-card__badge {
    margin-top: 7px;
    padding: 5px 8px;
    font-size: 11px;
    box-shadow: none;
}

.level-card__commercial,
.level-card__prices,
.level-price,
.level-note {
    display: none !important;
}

.level-card__pricing {
    display: grid;
    gap: 2px;
    margin-top: 2px;
}

.level-card__pricing strong {
    color: #0f172a;
    font-size: 24px;
    font-weight: 950;
    line-height: 1.05;
    letter-spacing: 0;
}

.level-card__pricing span {
    color: #475569;
    font-size: 15px;
    font-weight: 850;
    line-height: 1.2;
}

.level-card__included {
    flex: 1;
    gap: 7px;
}

.level-card__included strong,
.level-card__included > span {
    display: none;
}

.level-card__included ul {
    display: grid;
    gap: 5px;
}

.level-card__included li {
    padding: 0 0 0 14px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #475569;
    font-size: 12px;
    line-height: 1.35;
    position: relative;
}

.level-card__included li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .55em;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #2563eb;
}

.level-card__actions {
    gap: 7px;
}

.level-card__actions .btn {
    min-height: 38px;
    padding: 8px 12px;
    font-size: 13px;
}

@media (max-width: 1180px) {
    .level-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 980px) {
    .service-preview {
        justify-self: stretch;
        width: 100%;
    }
}

@media (max-width: 720px) {
    .site-brand__logo img {
        max-height: 34px;
    }

    .site-brand__text strong {
        font-size: 18px;
    }

    .hero--v8 {
        padding-top: 36px;
        background-size: 42px 42px, 42px 42px, auto, auto;
    }

    .hero--v8 .hero__grid::before,
    .hero--v8 .hero__grid::after {
        display: none;
    }

    .level-grid {
        grid-template-columns: 1fr;
    }

    .level-card {
        padding: 14px;
    }
}

/* Website Patch 1: conversion-critical hero, services and packages polish */
.hero--v8 {
    padding: clamp(44px, 6vw, 82px) 0 clamp(38px, 5vw, 62px);
    background:
        linear-gradient(rgba(147, 197, 253, .045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(147, 197, 253, .035) 1px, transparent 1px),
        radial-gradient(circle at 76% 22%, rgba(59, 130, 246, .18), transparent 32%),
        linear-gradient(145deg, #07111f 0%, #0a1526 56%, #10213a 100%);
    background-size: 56px 56px, 56px 56px, auto, auto;
}

.hero--v8 .hero__grid {
    grid-template-columns: minmax(0, 1.03fr) minmax(340px, .72fr);
    gap: clamp(28px, 5vw, 74px);
    align-items: center;
}

.hero__content--v8 {
    max-width: 760px;
}

.hero-ai-badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 34px;
    margin: 0 0 14px;
    padding: 6px 11px 6px 7px;
    border: 1px solid rgba(147, 197, 253, .24);
    border-radius: 999px;
    background: rgba(255, 255, 255, .07);
    color: rgba(255, 255, 255, .9);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 14px 32px rgba(15, 23, 42, .18);
}

.hero-ai-badge span,
.service-preview__ai-card span {
    display: inline-grid;
    place-items: center;
    width: 23px;
    height: 23px;
    border-radius: 999px;
    background: linear-gradient(135deg, #60a5fa, #2563eb);
    color: #fff;
    font-size: 10px;
    font-weight: 950;
    line-height: 1;
}

.hero-ai-badge strong {
    color: #fff;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 0;
}

.hero__content--v8 h1 {
    max-width: 760px;
    font-size: clamp(36px, 4.9vw, 64px);
    line-height: 1.04;
}

.hero__text {
    max-width: 650px;
    color: rgba(255, 255, 255, .76);
    font-size: clamp(16px, 1.4vw, 20px);
}

.hero__actions {
    align-items: center;
    gap: 12px;
}

.hero--v8 .btn {
    min-height: 48px;
    padding-inline: 22px;
    box-shadow: none;
}

.hero--v8 .btn--primary {
    background: linear-gradient(135deg, #3b82f6, #2563eb);
    box-shadow: 0 18px 38px rgba(37, 99, 235, .28);
}

.hero--v8 .btn--primary:hover,
.hero--v8 .btn--primary:focus-visible {
    box-shadow: 0 22px 46px rgba(37, 99, 235, .34);
}

.hero--v8 .btn--secondary {
    background: rgba(255, 255, 255, .075);
    border-color: rgba(255, 255, 255, .18);
}

.hero--v8 .btn:focus-visible,
.level-card .btn:focus-visible {
    outline: 3px solid rgba(96, 165, 250, .45);
    outline-offset: 3px;
}

.proof-row--v8 {
    max-width: 680px;
}

.proof-row--v8 span {
    border-color: rgba(255, 255, 255, .14);
    background: rgba(255, 255, 255, .075);
    color: rgba(255, 255, 255, .82);
}

.service-preview {
    width: min(100%, 430px);
    justify-self: end;
}

.service-preview__browser {
    position: relative;
    overflow: visible;
    padding: 0 0 18px;
    border: 1px solid rgba(226, 232, 240, .34);
    border-radius: 24px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .18), rgba(255, 255, 255, .075)),
        rgba(255, 255, 255, .08);
    box-shadow: 0 28px 82px rgba(2, 6, 23, .34);
    backdrop-filter: blur(18px);
}

.service-preview__bar {
    padding: 13px 15px;
    border-bottom-color: rgba(255, 255, 255, .13);
}

.service-preview__hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, .7fr) minmax(100px, .3fr);
    gap: 12px;
    height: auto;
    min-height: 116px;
    margin: 16px;
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 18px;
    background:
        radial-gradient(circle at 82% 18%, rgba(96, 165, 250, .28), transparent 32%),
        linear-gradient(135deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, .06));
}

.service-preview__hero span,
.service-preview__hero i {
    display: block;
    border-radius: 999px;
    background: rgba(255, 255, 255, .76);
}

.service-preview__hero span {
    align-self: end;
    height: 16px;
    box-shadow: 0 -30px 0 rgba(255, 255, 255, .92), 0 -58px 0 rgba(96, 165, 250, .9);
}

.service-preview__hero i {
    align-self: stretch;
    min-height: 74px;
    border-radius: 18px;
    background:
        linear-gradient(180deg, rgba(37, 99, 235, .92), rgba(96, 165, 250, .58)),
        #2563eb;
}

.service-preview__content {
    display: grid;
    gap: 8px;
    margin: 0 16px;
    padding: 0 2px;
}

.service-preview__content strong {
    color: #fff;
    font-size: 18px;
    line-height: 1.22;
}

.service-preview__content p {
    color: rgba(255, 255, 255, .7);
    font-size: 13px;
    line-height: 1.45;
}

.service-preview__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 5px;
}

.service-preview__chips span,
.service-status-pill {
    border-color: rgba(255, 255, 255, .14);
    background: rgba(255, 255, 255, .08);
    color: rgba(255, 255, 255, .84);
}

.service-preview__chips span {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 6px 10px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 850;
}

.service-preview__ai-card {
    position: absolute;
    right: -18px;
    bottom: 52px;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 9px;
    max-width: min(220px, 70%);
    padding: 10px 12px;
    border: 1px solid rgba(219, 234, 254, .74);
    border-radius: 16px;
    background: rgba(255, 255, 255, .92);
    color: #0f172a;
    box-shadow: 0 18px 42px rgba(2, 6, 23, .24);
}

.service-preview__ai-card strong {
    font-size: 13px;
    line-height: 1.2;
}

.service-preview__lines {
    padding: 14px 18px 0;
}

.service-preview__lines i {
    background: rgba(255, 255, 255, .22);
}

.service-preview__status {
    gap: 8px;
    margin-top: 13px;
}

.services-section--v8 {
    position: relative;
    background:
        linear-gradient(180deg, #f7faff 0%, #fff 100%);
}

.services-section--v8 .section-heading {
    max-width: 820px;
}

.system-module-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.system-module {
    min-height: 100%;
    padding: 20px;
    border-color: rgba(191, 219, 254, .72);
    border-radius: 20px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(248, 251, 255, .96)),
        #fff;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .055);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.system-module::after {
    opacity: .42;
}

.system-module:hover,
.system-module:focus-within {
    transform: translateY(-3px);
    border-color: rgba(37, 99, 235, .38);
    box-shadow: 0 22px 54px rgba(15, 23, 42, .09);
}

.system-module.is-featured {
    border-color: rgba(37, 99, 235, .36);
    box-shadow: 0 20px 48px rgba(37, 99, 235, .08);
}

.system-module .icon-badge {
    width: 46px;
    height: 46px;
    border-radius: 15px;
    background: linear-gradient(135deg, #eff6ff, #dbeafe);
}

.system-module__body {
    min-width: 0;
}

.system-module__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 7px;
}

.system-module__meta span {
    color: #9aa8bc;
    font-size: 12px;
    font-weight: 950;
    letter-spacing: .08em;
}

.system-module .module-label {
    margin: 0;
    color: #2563eb;
}

.system-module h3 {
    color: #07111f;
    font-size: 21px;
    line-height: 1.16;
}

.system-module p:not(.module-label) {
    color: #536173;
    font-size: 15px;
    line-height: 1.58;
}

.packages-section--v8 {
    position: relative;
    background:
        radial-gradient(circle at 18% 12%, rgba(37, 99, 235, .075), transparent 26%),
        linear-gradient(180deg, #fff 0%, #f7faff 100%);
}

.packages-section--v8 .section-heading {
    max-width: 780px;
    margin-inline: auto;
    text-align: center;
}

.level-grid {
    width: min(100%, 1180px);
    margin-inline: auto;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    align-items: stretch;
}

.level-card {
    min-height: 100%;
    padding: 20px;
    border: 1px solid rgba(191, 219, 254, .76);
    border-radius: 20px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .95), rgba(248, 251, 255, .95)),
        #fff;
    box-shadow: 0 16px 40px rgba(15, 23, 42, .065);
}

.level-card:hover,
.level-card:focus-within {
    transform: translateY(-3px);
    border-color: rgba(37, 99, 235, .36);
    box-shadow: 0 24px 58px rgba(15, 23, 42, .10);
}

.level-card.is-recommended {
    border-color: rgba(37, 99, 235, .62);
    background:
        linear-gradient(180deg, rgba(239, 246, 255, .96), rgba(255, 255, 255, .98)),
        #fff;
    box-shadow: 0 26px 70px rgba(37, 99, 235, .16);
}

.level-card.is-recommended::before {
    width: auto;
    height: 4px;
    inset: 0 18px auto 18px;
    border-radius: 0 0 999px 999px;
    background: linear-gradient(90deg, #60a5fa, #2563eb, #38bdf8);
}

.level-card__head .eyebrow {
    color: #2563eb;
    font-size: 11px;
}

.level-card__title,
.level-card__head h3 {
    color: #07111f;
    font-size: clamp(22px, 2vw, 27px);
}

.level-card__head p:not(.eyebrow) {
    color: #536173;
    font-size: 14px;
    line-height: 1.5;
}

.level-card__pricing {
    margin-top: 4px;
    padding: 14px;
    border: 1px solid rgba(226, 232, 240, .88);
    border-radius: 16px;
    background: rgba(255, 255, 255, .76);
}

.level-card__pricing strong {
    color: #07111f;
    font-size: clamp(25px, 2.5vw, 32px);
}

.level-card__pricing span {
    margin-top: 5px;
    color: #2563eb;
    font-size: 15px;
}

.level-card__included li {
    color: #334155;
    font-size: 13px;
}

.level-card__actions {
    gap: 9px;
}

.level-card__actions .btn {
    min-height: 42px;
    border-radius: 999px;
}

.level-card__actions .btn--secondary {
    background: #fff;
    border-color: rgba(191, 219, 254, .9);
    color: #0f172a;
}

.pricing-disclaimer--v8 {
    background: rgba(255, 255, 255, .72);
    border-color: rgba(191, 219, 254, .8);
}

@media (max-width: 1180px) {
    .hero--v8 .hero__grid,
    .level-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .service-preview {
        justify-self: stretch;
        width: 100%;
    }
}

@media (max-width: 860px) {
    .hero--v8 .hero__grid,
    .system-module-grid,
    .level-grid {
        grid-template-columns: 1fr;
    }

    .service-preview {
        max-width: 520px;
        justify-self: start;
    }

    .system-module-grid {
        gap: 14px;
    }
}

@media (max-width: 720px) {
    .hero--v8 {
        padding-top: 34px;
        background-size: 42px 42px, 42px 42px, auto, auto;
    }

    .hero-ai-badge {
        margin-bottom: 12px;
    }

    .hero__actions {
        display: grid;
    }

    .hero__actions .btn {
        width: 100%;
    }

    .proof-row--v8 {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .proof-row--v8 span {
        text-align: center;
    }

    .service-preview {
        max-width: none;
    }

    .service-preview__ai-card {
        position: static;
        max-width: none;
        margin: 12px 16px 0;
    }

    .service-preview__hero {
        grid-template-columns: 1fr;
        min-height: 104px;
    }

    .service-preview__hero i {
        min-height: 48px;
    }

    .system-module {
        grid-template-columns: 42px 1fr;
        padding: 18px;
    }

    .level-card {
        padding: 18px;
    }

}

/* Website Patch 2: contact conversion section and professional footer */
.contact-section--patch2 {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(180deg, #fff 0%, #f6f9ff 58%, #fff 100%);
}

.contact-section--patch2::before {
    content: "";
    position: absolute;
    inset: 12% auto auto -14%;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    background: rgba(37, 99, 235, .08);
    pointer-events: none;
}

.contact-conversion {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(320px, .88fr);
    gap: clamp(24px, 5vw, 58px);
    align-items: stretch;
}

.contact-conversion .section-heading {
    margin-bottom: 0;
}

.contact-conversion .section-heading h2 {
    max-width: 720px;
}

.contact-helper {
    margin-top: clamp(22px, 3vw, 32px);
}

.contact-helper strong,
.contact-next-step strong {
    display: block;
    color: #0f172a;
    font-size: 15px;
    font-weight: 950;
}

.contact-helper__list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 14px 0 0;
    padding: 0;
    list-style: none;
}

.contact-helper__list li {
    position: relative;
    min-height: 58px;
    padding: 13px 14px 13px 42px;
    border: 1px solid rgba(191, 219, 254, .78);
    border-radius: 16px;
    background: rgba(255, 255, 255, .82);
    color: #344054;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.35;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .045);
}

.contact-helper__list li::before {
    content: "";
    position: absolute;
    top: 17px;
    left: 15px;
    width: 12px;
    height: 12px;
    border: 4px solid #dbeafe;
    border-radius: 50%;
    background: var(--vn-accent);
    box-shadow: 0 0 0 1px rgba(37, 99, 235, .15);
}

.contact-next-step {
    margin-top: 16px;
    padding: 18px 20px;
    border: 1px solid rgba(226, 232, 240, .92);
    border-radius: 18px;
    background: rgba(255, 255, 255, .72);
}

.contact-next-step p {
    margin-top: 8px;
    color: #536173;
    line-height: 1.65;
}

.contact-method-card {
    display: grid;
    align-content: start;
    gap: 20px;
    padding: clamp(22px, 3.2vw, 34px);
    border: 1px solid rgba(191, 219, 254, .9);
    border-radius: 24px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(248, 251, 255, .96)),
        #fff;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .1);
}

.contact-method-card h3 {
    color: #07111f;
    font-size: clamp(24px, 3vw, 34px);
    line-height: 1.08;
}

.contact-method-card__channels,
.contact-method-card__actions {
    display: grid;
    gap: 10px;
}

.contact-channel {
    display: grid;
    gap: 4px;
    padding: 14px 16px;
    border: 1px solid rgba(226, 232, 240, .94);
    border-radius: 16px;
    background: #fff;
    color: #101828;
    text-decoration: none;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.contact-channel span {
    color: #667085;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.contact-channel strong {
    color: #0f172a;
    font-size: 16px;
    line-height: 1.3;
    word-break: break-word;
}

.contact-channel:hover,
.contact-channel:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(37, 99, 235, .38);
    box-shadow: 0 14px 34px rgba(37, 99, 235, .09);
    outline: none;
}

.contact-method-card .btn--secondary {
    background: #fff;
    border-color: rgba(191, 219, 254, .92);
    color: #0f172a;
}

.contact-method-card .btn:focus-visible {
    outline: 3px solid rgba(37, 99, 235, .3);
    outline-offset: 3px;
}

.site-footer--patch2 {
    padding: 0;
    background:
        radial-gradient(circle at 82% 0%, rgba(37, 99, 235, .2), transparent 32%),
        linear-gradient(180deg, #07111f 0%, #0a1020 100%);
    color: rgba(255, 255, 255, .72);
}

.site-footer__inner--patch2 {
    display: block;
    padding: clamp(42px, 6vw, 70px) 0 24px;
}

.site-footer__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(180px, .78fr) minmax(220px, .9fr);
    gap: clamp(26px, 5vw, 64px);
    align-items: start;
}

.site-footer__column {
    min-width: 0;
}

.site-footer__brand-title {
    display: block;
    color: #fff;
    font-size: 26px;
    font-weight: 950;
    letter-spacing: 0;
    line-height: 1;
}

.site-footer__brand p {
    max-width: 520px;
    margin-top: 14px;
    color: rgba(255, 255, 255, .72);
    line-height: 1.65;
}

.site-footer__trust {
    display: inline-flex;
    max-width: 520px;
    margin-top: 18px;
    padding: 9px 12px;
    border: 1px solid rgba(147, 197, 253, .18);
    border-radius: 999px;
    background: rgba(255, 255, 255, .06);
    color: rgba(255, 255, 255, .82);
    font-size: 13px;
    font-weight: 800;
    line-height: 1.35;
}

.site-footer__heading {
    margin: 0 0 14px;
    color: #93c5fd;
    font-size: 12px;
    font-weight: 950;
    letter-spacing: .1em;
    line-height: 1.2;
    text-transform: uppercase;
}

.site-footer__links,
.site-footer__contact-list {
    display: grid;
    gap: 9px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.site-footer__links a,
.site-footer__contact-list a {
    display: inline-flex;
    width: fit-content;
    max-width: 100%;
    color: rgba(255, 255, 255, .82);
    text-decoration: none;
    font-weight: 800;
    line-height: 1.35;
    overflow-wrap: anywhere;
    transition: color .18s ease, transform .18s ease;
}

.site-footer__links a:hover,
.site-footer__links a:focus-visible,
.site-footer__contact-list a:hover,
.site-footer__contact-list a:focus-visible {
    color: #fff;
    transform: translateX(2px);
    outline: none;
}

.site-footer__links a:focus-visible,
.site-footer__contact-list a:focus-visible {
    text-decoration: underline;
    text-underline-offset: 4px;
}

.site-footer__bottom {
    margin-top: clamp(28px, 5vw, 48px);
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, .12);
}

.site-footer__bottom p {
    color: rgba(255, 255, 255, .58);
    font-size: 13px;
    line-height: 1.5;
}

@media (max-width: 900px) {
    .contact-conversion {
        grid-template-columns: 1fr;
    }

    .contact-method-card {
        max-width: 560px;
    }

    .site-footer__grid {
        grid-template-columns: 1fr 1fr;
    }

    .site-footer__brand {
        grid-column: 1 / -1;
    }
}

@media (max-width: 640px) {
    .contact-section--patch2::before {
        display: none;
    }

    .contact-helper__list,
    .site-footer__grid {
        grid-template-columns: 1fr;
    }

    .contact-helper__list li {
        min-height: 0;
    }

    .contact-method-card {
        padding: 20px;
        border-radius: 20px;
    }

    .site-footer__inner--patch2 {
        padding-top: 38px;
        padding-bottom: 84px;
    }

    .site-footer__trust {
        border-radius: 16px;
    }

    .site-footer__contact-list {
        padding-right: 58px;
    }
}

/* Website Patch 3: middle trust/proof rhythm */
.ai-widget-section--patch3 {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(180deg, #fff 0%, #f6f9ff 54%, #fff 100%);
    color: #172033;
}

.ai-widget-section--patch3::before {
    content: "";
    position: absolute;
    inset: 8% -12% auto auto;
    width: 480px;
    height: 480px;
    border-radius: 50%;
    background: rgba(37, 99, 235, .08);
    pointer-events: none;
}

.ai-widget-section--patch3 h2,
.ai-widget-section--patch3 h3 {
    color: #07111f;
}

.ai-widget-section--patch3 .section-heading p:not(.eyebrow) {
    color: #536173;
}

.ai-advisor-wrap {
    position: relative;
}

.ai-advisor-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.06fr) minmax(340px, .94fr);
    gap: clamp(28px, 5vw, 64px);
    align-items: center;
}

.ai-advisor-copy .section-heading {
    margin-bottom: 0;
}

.ai-advisor-note {
    margin-top: 22px;
    padding: 18px 20px;
    border: 1px solid rgba(191, 219, 254, .78);
    border-radius: 18px;
    background: rgba(255, 255, 255, .82);
    box-shadow: 0 12px 32px rgba(15, 23, 42, .045);
}

.ai-advisor-note strong {
    display: block;
    color: #0f172a;
    font-weight: 950;
}

.ai-advisor-note p,
.ai-advisor-disclaimer {
    margin-top: 8px;
    color: #536173;
    line-height: 1.65;
}

.ai-advisor-cta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 20px;
}

.ai-advisor-disclaimer {
    max-width: 650px;
    font-size: 14px;
}

.ai-advisor-mockup {
    position: relative;
    display: grid;
    gap: 14px;
    width: min(100%, 520px);
    justify-self: end;
    padding: clamp(18px, 3vw, 28px);
    border: 1px solid rgba(191, 219, 254, .92);
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .94), rgba(248, 251, 255, .94)),
        #fff;
    box-shadow: 0 28px 80px rgba(15, 23, 42, .11);
}

.ai-advisor-mockup__header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(226, 232, 240, .94);
}

.ai-advisor-mockup__header > span {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 14px;
    background: linear-gradient(135deg, #2563eb, #60a5fa);
    color: #fff;
    font-size: 12px;
    font-weight: 950;
}

.ai-advisor-mockup__header strong,
.ai-advisor-mockup__header small {
    display: block;
    line-height: 1.25;
}

.ai-advisor-mockup__header small {
    margin-top: 3px;
    color: #667085;
    font-weight: 750;
}

.ai-widget-section--patch3 .ai-message {
    max-width: 92%;
    margin-top: 0;
    line-height: 1.5;
}

.ai-widget-section--patch3 .ai-message--bot {
    border: 1px solid #dbeafe;
    background: #eff6ff;
}

.ai-widget-section--patch3 .ai-message--user {
    background: #2563eb;
}

.ai-advisor-mockup__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ai-advisor-mockup__chips span {
    padding: 7px 10px;
    border: 1px solid rgba(191, 219, 254, .84);
    border-radius: 999px;
    background: #fff;
    color: #1e3a8a;
    font-size: 12px;
    font-weight: 900;
}

.ai-advisor-benefits {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-top: clamp(24px, 4vw, 38px);
}

.ai-widget-section--patch3 .ai-widget-feature,
.ai-advisor-benefit {
    padding: 18px;
    border-color: rgba(226, 232, 240, .96);
    background: rgba(255, 255, 255, .86);
    box-shadow: 0 12px 34px rgba(15, 23, 42, .055);
}

.ai-widget-section--patch3 .ai-widget-feature p {
    margin-top: 8px;
    color: #536173;
}

.projects-section--patch3 {
    background: #fff;
    padding-top: clamp(42px, 5.4vw, 72px);
    padding-bottom: clamp(36px, 5vw, 64px);
}

.projects-section--patch3 .section-heading {
    max-width: 700px;
}

.project-grid--proof {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.project-card--proof {
    display: grid;
    grid-template-columns: minmax(124px, 176px) minmax(0, 1fr);
    gap: 16px;
    align-items: stretch;
    padding: 14px;
    border-color: rgba(226, 232, 240, .96);
    box-shadow: 0 10px 34px rgba(15, 23, 42, .055);
}

.project-card--proof:hover {
    border-color: rgba(37, 99, 235, .24);
}

.project-card--proof .project-media {
    min-height: 0;
    aspect-ratio: auto;
    overflow: hidden;
    border-radius: 16px;
    border-bottom: 0;
    background: linear-gradient(135deg, #eff6ff, #f8fafc);
}

.project-card--proof .project-card__image,
.project-card--proof .project-gallery,
.project-card--proof .project-placeholder {
    width: 100%;
    height: 100%;
    min-height: 0;
    object-fit: cover;
}

.project-card--proof .project-placeholder {
    min-height: 100%;
    padding: 16px;
}

.project-card--proof .project-card__body {
    align-content: start;
    padding: 4px 2px;
}

.project-card__topline {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.project-card__topline .eyebrow {
    margin: 0;
}

.project-card__topline span {
    padding: 5px 8px;
    border: 1px solid #dbeafe;
    border-radius: 999px;
    background: #eff6ff;
    color: #1d4ed8;
    font-size: 11px;
    font-weight: 950;
}

.project-card--proof h3 {
    font-size: 23px;
}

.project-card--proof .text-link:focus-visible {
    outline: 3px solid rgba(37, 99, 235, .24);
    outline-offset: 4px;
    border-radius: 8px;
}

.project-empty-proof {
    max-width: 760px;
    padding: 20px 22px;
    border: 1px dashed rgba(148, 163, 184, .7);
    border-radius: 18px;
    background: #f8fafc;
    color: #536173;
}

.use-cases-section {
    background: linear-gradient(180deg, #fff 0%, #f8fbff 100%);
}

.use-case-card {
    box-shadow: 0 10px 30px rgba(15, 23, 42, .045);
}

.process-section--patch3 {
    background:
        linear-gradient(180deg, #f8fbff 0%, #fff 100%);
}

.process-section--patch3 .section-heading {
    max-width: 720px;
}

.process-steps--path {
    position: relative;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.process-step--path {
    position: relative;
    grid-template-columns: 48px 1fr;
    gap: 14px;
    align-items: start;
    min-height: 178px;
    padding: 20px;
    border-color: rgba(226, 232, 240, .96);
    box-shadow: 0 12px 34px rgba(15, 23, 42, .05);
}

.process-step--path::after {
    content: "";
    position: absolute;
    inset: 18px 18px auto auto;
    width: 42px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(37, 99, 235, .38), transparent);
}

.process-step--path .process-step__number {
    width: 46px;
    height: 46px;
    border: 1px solid #bfdbfe;
    border-radius: 16px;
    background: #eff6ff;
    color: #1d4ed8;
    font-size: 13px;
}

.process-step__content h3 {
    font-size: 20px;
    line-height: 1.2;
}

.process-step__content p {
    margin-top: 8px;
    line-height: 1.62;
}

.faq-section--patch3 {
    background: #fff;
}

.faq-section--patch3 .section-heading {
    max-width: 720px;
}

.faq-list--patch3 {
    gap: 10px;
}

.faq-item--patch3 {
    padding: 0;
    overflow: hidden;
    border-color: rgba(226, 232, 240, .96);
    border-radius: 16px;
    box-shadow: 0 8px 26px rgba(15, 23, 42, .045);
}

.faq-item--patch3 summary {
    min-height: 64px;
    padding: 18px 20px;
    color: #0f172a;
    line-height: 1.35;
}

.faq-item--patch3 summary:focus-visible {
    outline: 3px solid rgba(37, 99, 235, .24);
    outline-offset: -3px;
}

.faq-item--patch3 .faq-item__content {
    margin-top: 0;
    padding: 0 20px 20px;
    color: #536173;
    line-height: 1.7;
}

.faq-item--patch3 .faq-item__content p + p {
    margin-top: 10px;
}

.faq-section--patch3 + .contact-section--patch2 {
    padding-top: clamp(48px, 6vw, 78px);
}

@media (max-width: 1080px) {
    .ai-advisor-layout,
    .project-grid--proof {
        grid-template-columns: 1fr;
    }

    .ai-advisor-mockup {
        justify-self: start;
    }

    .ai-advisor-benefits,
    .process-steps--path {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .ai-widget-section--patch3::before {
        display: none;
    }

    .ai-advisor-layout,
    .ai-advisor-benefits,
    .process-steps--path {
        grid-template-columns: 1fr;
    }

    .ai-advisor-cta {
        display: grid;
    }

    .ai-advisor-cta .btn {
        width: 100%;
    }

    .ai-advisor-mockup {
        width: 100%;
        border-radius: 20px;
    }

    .project-card--proof {
        grid-template-columns: 1fr;
    }

    .project-card--proof .project-media,
    .project-card--proof .project-card__image,
    .project-card--proof .project-gallery,
    .project-card--proof .project-placeholder {
        min-height: 180px;
    }

    .process-step--path {
        min-height: 0;
    }

    .faq-item--patch3 summary {
        padding: 16px 18px;
    }

    .faq-item--patch3 .faq-item__content {
        padding-inline: 18px;
    }
}

/* VNTech 2.5.0 release polish */
html {
    scroll-padding-top: calc(var(--vn-header-height, 72px) + 18px);
}

.site-header__inner {
    min-height: 68px;
    gap: clamp(16px, 3vw, 34px);
    padding-block: 9px;
}

.site-nav__menu {
    align-items: center;
}

.site-nav__menu a,
.mobile-menu a {
    border-radius: 10px;
}

.site-nav__menu a:focus-visible,
.mobile-menu a:focus-visible,
.project-drawer summary:focus-visible,
.level-card__details summary:focus-visible,
[data-vn-open-ai-widget]:focus-visible {
    outline: 3px solid rgba(37, 99, 235, .28);
    outline-offset: 4px;
}

.mobile-drawer {
    padding: 22px;
}

.mobile-drawer__contact a:empty {
    display: none;
}

.hero--v25 {
    position: relative;
    overflow: hidden;
    padding: clamp(48px, 6.5vw, 86px) 0 clamp(30px, 5vw, 56px);
    background:
        radial-gradient(circle at 78% 16%, rgba(14, 165, 233, .26), transparent 30%),
        linear-gradient(140deg, #07111f 0%, #0d2038 56%, #102d45 100%);
    color: #fff;
}

.hero--v25 h1,
.hero--v25 h2,
.hero--v25 h3 {
    color: #fff;
}

.hero--v25 .eyebrow {
    color: #9bdcff;
}

.hero__grid--v25 {
    display: grid;
    grid-template-columns: minmax(0, 1.04fr) minmax(320px, .76fr);
    gap: clamp(28px, 5vw, 58px);
    align-items: center;
}

.hero__content--v25 {
    max-width: 720px;
}

.hero__content--v25 h1 {
    max-width: 760px;
    font-size: clamp(36px, 4.8vw, 62px);
    line-height: 1.05;
    text-wrap: balance;
}

.hero-ai-badge--v25 {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 14px;
    padding: 7px 11px;
    border: 1px solid rgba(147, 197, 253, .26);
    border-radius: 999px;
    background: rgba(255, 255, 255, .08);
    color: rgba(255, 255, 255, .88);
    font-size: 13px;
}

.hero-ai-badge--v25 span {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, #2dd4bf, #2563eb);
    color: #fff;
    font-size: 11px;
    font-weight: 950;
}

.hero--v25 .hero__text {
    max-width: 630px;
    color: rgba(255, 255, 255, .76);
}

.hero--v25 .btn--secondary {
    border-color: rgba(255, 255, 255, .22);
    background: rgba(255, 255, 255, .08);
    color: #fff;
}

.proof-row--v25 span {
    border-color: rgba(255, 255, 255, .14);
    background: rgba(255, 255, 255, .08);
    color: rgba(255, 255, 255, .84);
}

.hero-service-card {
    display: grid;
    gap: 14px;
}

.hero-service-card__preview {
    position: relative;
    overflow: hidden;
    padding: 18px;
    border: 1px solid rgba(147, 197, 253, .24);
    border-radius: 26px;
    background: linear-gradient(160deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, .07));
    box-shadow: 0 28px 78px rgba(0, 0, 0, .28);
    backdrop-filter: blur(16px);
}

.hero-service-card__preview::before {
    content: "";
    position: absolute;
    inset: auto -20% -36% 36%;
    height: 220px;
    border-radius: 50%;
    background: rgba(45, 212, 191, .2);
    filter: blur(18px);
}

.hero-service-card__panel {
    position: relative;
    display: grid;
    gap: 10px;
    min-height: 230px;
    align-content: end;
    padding: 22px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 20px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .04)),
        linear-gradient(145deg, rgba(37, 99, 235, .24), rgba(15, 23, 42, .12));
}

.hero-service-card__kicker,
.ai-scenario-card__tag {
    width: max-content;
    max-width: 100%;
    padding: 5px 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .12);
    color: rgba(255, 255, 255, .78);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.hero-service-card__panel strong {
    color: #fff;
    font-size: clamp(24px, 3vw, 34px);
    line-height: 1.08;
}

.hero-service-card__panel p {
    color: rgba(255, 255, 255, .72);
}

.hero-service-card__status {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}

.hero-service-card__status span {
    display: grid;
    gap: 3px;
    min-height: 72px;
    padding: 11px;
    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 14px;
    background: rgba(255, 255, 255, .08);
}

.hero-service-card__status strong {
    color: #fff;
    font-size: 13px;
}

.hero-service-card__status small {
    color: rgba(255, 255, 255, .68);
    line-height: 1.35;
}

.hero-service-card__chips {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.hero-service-card__chips span {
    min-height: 42px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(147, 197, 253, .2);
    border-radius: 999px;
    background: rgba(255, 255, 255, .08);
    color: rgba(255, 255, 255, .82);
    font-size: 13px;
    font-weight: 900;
}

.services-section--v25 {
    background: linear-gradient(180deg, #fff 0%, #f7fbff 100%);
}

.system-module-grid--v25 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.system-module--v25 {
    grid-template-columns: 62px 1fr;
    min-height: 188px;
    padding: 24px;
    border-radius: 20px;
}

.system-module--v25::after {
    height: 4px;
    background: linear-gradient(90deg, #2563eb, #2dd4bf, transparent);
}

.icon-badge--large {
    width: 56px;
    height: 56px;
    border-radius: 18px;
}

.icon-badge--large svg {
    width: 28px;
    height: 28px;
}

.system-module__description {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.system-module__link {
    margin-top: 10px;
}

.level-grid--v25 {
    align-items: stretch;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.level-card--v25 {
    min-height: 100%;
    padding: 20px;
    border-radius: 20px;
    background: #fff;
}

.level-card--v25.is-recommended {
    border-color: rgba(37, 99, 235, .46);
    background:
        linear-gradient(160deg, rgba(239, 246, 255, .96), rgba(255, 255, 255, .98)),
        #fff;
    box-shadow: 0 22px 58px rgba(37, 99, 235, .14);
}

.level-card--v25.is-recommended::before {
    inset: 0 0 auto 0;
    width: auto;
    height: 4px;
    border-radius: 20px 20px 0 0;
    background: linear-gradient(90deg, #2563eb, #2dd4bf);
}

.level-card--v25 .level-card__head p:not(.eyebrow) {
    min-height: 0;
}

.level-card--v25 .level-card__badge {
    background: #e0f2fe;
    color: #075985;
    box-shadow: none;
}

.level-card__details {
    margin-top: auto;
    border: 1px solid rgba(226, 232, 240, .92);
    border-radius: 15px;
    background: rgba(248, 250, 252, .7);
    overflow: hidden;
}

.level-card__details summary {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 46px;
    padding: 12px 14px;
    color: #0f172a;
    font-weight: 900;
}

.level-card__details summary::after {
    content: "+";
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #e0f2fe;
    color: #0369a1;
}

.level-card__details[open] summary::after {
    content: "-";
}

.level-card__details-body {
    display: grid;
    gap: 12px;
    padding: 0 14px 14px;
    color: #536173;
    font-size: 14px;
    line-height: 1.6;
}

.level-card__orientation {
    display: grid;
    gap: 3px;
    padding: 10px 11px;
    border-radius: 12px;
    background: #fff;
}

.level-card__orientation span,
.level-card__terms dt {
    color: #64748b;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.level-card__orientation strong {
    color: #0f172a;
}

.level-card__features {
    display: grid;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.level-card__terms {
    display: grid;
    gap: 8px;
    margin: 0;
}

.level-card__terms div {
    display: grid;
    gap: 2px;
}

.level-card__terms dd {
    margin: 0;
    color: #0f172a;
    font-weight: 800;
}

.level-card__disclaimer {
    padding: 10px 11px;
    border-radius: 12px;
    background: #eff6ff;
    color: #475569;
}

.ai-widget-section--v25 {
    background:
        radial-gradient(circle at 82% 12%, rgba(37, 99, 235, .16), transparent 30%),
        linear-gradient(180deg, #f8fbff 0%, #fff 100%);
    color: var(--vn-text);
}

.ai-widget-section--v25 h2,
.ai-widget-section--v25 h3 {
    color: #0f172a;
}

.ai-widget-section--v25 .section-heading p:not(.eyebrow) {
    color: #536173;
}

.ai-advisor-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 360px);
    gap: 24px;
    align-items: end;
}

.ai-advisor-action {
    display: grid;
    gap: 10px;
    justify-items: start;
}

.ai-advisor-action p {
    color: #536173;
    font-size: 14px;
    line-height: 1.55;
}

.ai-advisor-note--v25 {
    max-width: 820px;
    margin: 0 0 18px;
    border-color: rgba(191, 219, 254, .8);
    background: rgba(255, 255, 255, .74);
}

.ai-scenario-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.ai-scenario-card {
    display: grid;
    gap: 12px;
    padding: 22px;
    border: 1px solid rgba(226, 232, 240, .95);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 14px 38px rgba(15, 23, 42, .06);
}

.ai-scenario-card__tag {
    background: #ecfeff;
    color: #0e7490;
}

.ai-scenario-card h3 {
    font-size: 21px;
    line-height: 1.18;
}

.ai-scenario-card__answer {
    color: #0f172a;
    font-weight: 900;
}

.ai-scenario-card__note {
    color: #64748b;
    font-size: 14px;
}

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

.project-card--v25 {
    padding: 0;
    border-radius: 20px;
}

.project-card--v25 .project-media {
    aspect-ratio: 16 / 10;
    border-radius: 20px 20px 0 0;
}

.project-card--v25 .project-card__body {
    padding: 18px;
}

.project-drawer {
    margin-top: 6px;
    border-top: 1px solid rgba(226, 232, 240, .9);
}

.project-drawer summary {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    color: var(--vn-accent);
    font-weight: 950;
}

.project-drawer summary::after {
    content: "↓";
    font-size: 13px;
}

.project-drawer[open] summary::after {
    content: "↑";
}

.project-drawer__panel {
    display: grid;
    gap: 14px;
    padding: 12px 0 0;
}

.project-drawer__panel h4 {
    color: #0f172a;
    font-size: 20px;
}

.project-drawer__facts {
    display: grid;
    gap: 10px;
    margin: 0;
}

.project-drawer__facts div {
    display: grid;
    gap: 4px;
}

.project-drawer__facts dt,
.project-drawer__modules strong {
    color: #64748b;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.project-drawer__facts dd {
    margin: 0;
    color: #334155;
}

.project-drawer__modules {
    display: grid;
    gap: 8px;
}

.project-drawer__modules ul {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.project-drawer__modules li {
    padding: 6px 9px;
    border-radius: 999px;
    background: #f1f5f9;
    color: #334155;
    font-size: 12px;
    font-weight: 800;
}

.project-drawer__external {
    width: fit-content;
}

.use-cases-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: end;
}

.use-case-grid--v25 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.use-case-card--v25 {
    display: grid;
    gap: 10px;
    padding: 20px;
}

.use-case-card--v25 p {
    margin: 0;
    font-size: 14px;
}

.use-case-card__recommendation {
    color: #0f172a;
    font-weight: 850;
}

.process-steps--v25 {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    align-items: start;
}

.process-step--v25 {
    position: relative;
    min-height: 214px;
    padding: 24px 22px;
    border-radius: 22px;
}

.process-step--v25:nth-child(even) {
    margin-top: 42px;
}

.process-step--v25::before {
    content: "";
    position: absolute;
    top: 46px;
    left: calc(100% - 5px);
    width: 28px;
    height: 2px;
    background: linear-gradient(90deg, rgba(37, 99, 235, .36), transparent);
}

.process-step--v25:last-child::before {
    display: none;
}

.process-step--v25 .process-step__number {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: linear-gradient(135deg, #2563eb, #0ea5e9);
    color: #fff;
}

.contact-section--v25 {
    padding-top: clamp(42px, 5vw, 68px);
    background: linear-gradient(180deg, #fff 0%, #f8fbff 100%);
}

.contact-section--v25::before {
    opacity: .45;
}

.contact-section--v25 .contact-conversion {
    gap: clamp(20px, 4vw, 44px);
}

.contact-section--v25 .contact-helper {
    margin-top: 22px;
}

.contact-section--v25 .contact-helper__list li {
    min-height: 0;
    box-shadow: none;
}

.site-footer__inner--patch2 {
    padding: clamp(30px, 4vw, 46px) 0 18px;
}

.site-footer__grid {
    gap: clamp(20px, 4vw, 42px);
}

.site-footer__brand p {
    margin-top: 10px;
    line-height: 1.55;
}

.site-footer__trust {
    margin-top: 12px;
}

.site-footer__bottom {
    margin-top: clamp(20px, 3vw, 30px);
    padding-top: 14px;
}

@media (max-width: 1180px) {
    .hero__grid--v25,
    .ai-advisor-header {
        grid-template-columns: 1fr;
    }

    .hero-service-card {
        max-width: 620px;
    }

    .level-grid--v25,
    .use-case-grid--v25,
    .process-steps--v25 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .project-grid--v25 {
        grid-template-columns: 1fr;
    }

    .process-step--v25:nth-child(even) {
        margin-top: 0;
    }
}

@media (max-width: 760px) {
    .hero--v25 {
        padding-top: 34px;
        padding-bottom: 30px;
    }

    .hero__content--v25 h1 {
        font-size: clamp(34px, 10.4vw, 48px);
    }

    .hero--v25 .hero__text {
        font-size: 16px;
        line-height: 1.58;
    }

    .hero__actions,
    .ai-advisor-action {
        display: grid;
    }

    .hero__actions .btn,
    .ai-advisor-action .btn {
        width: 100%;
    }

    .hero-service-card__panel {
        min-height: 180px;
        padding: 18px;
    }

    .hero-service-card__status,
    .hero-service-card__chips,
    .system-module-grid--v25,
    .level-grid--v25,
    .ai-scenario-grid,
    .use-case-grid--v25,
    .process-steps--v25,
    .use-cases-header {
        grid-template-columns: 1fr;
    }

    .hero-service-card {
        display: none;
    }

    .system-module--v25 {
        grid-template-columns: 48px 1fr;
        min-height: 0;
        padding: 18px;
    }

    .icon-badge--large {
        width: 48px;
        height: 48px;
    }

    .level-card--v25,
    .ai-scenario-card,
    .use-case-card--v25,
    .process-step--v25 {
        border-radius: 18px;
    }

    .project-card--v25 .project-media {
        min-height: 0;
    }

    .contact-section--v25 {
        padding-top: 38px;
    }

    .site-footer__inner--patch2 {
        padding-top: 30px;
        padding-bottom: 72px;
    }

    .scroll-top {
        right: auto;
        left: 14px;
        bottom: 82px;
    }
}

/* VNTech 2.6.0 - Premium Visual Realism Pass */
:root {
    --vn-navy: #07111f;
    --vn-ink: #0f172a;
    --vn-muted: #5b6678;
    --vn-blue: #2563eb;
    --vn-cyan: #0ea5e9;
    --vn-surface: #f8fafc;
    --vn-border: rgba(15, 23, 42, .11);
    --vn-radius-lg: 24px;
    --vn-shadow-soft: 0 22px 70px rgba(15, 23, 42, .12);
}

body {
    color: var(--vn-ink);
    background: #fff;
}

.site-header {
    border-bottom: 1px solid rgba(226, 232, 240, .86);
    background: rgba(255, 255, 255, .88);
    box-shadow: 0 12px 38px rgba(15, 23, 42, .05);
    backdrop-filter: blur(18px);
}

.site-header.is-scrolled {
    box-shadow: 0 14px 42px rgba(15, 23, 42, .1);
}

.site-header__inner {
    min-height: 70px;
}

.site-brand {
    gap: 12px;
}

.site-brand__mark {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border: 1px solid rgba(37, 99, 235, .25);
    border-radius: 14px;
    background:
        linear-gradient(135deg, rgba(37, 99, 235, .14), rgba(14, 165, 233, .12)),
        #fff;
    box-shadow: 0 12px 28px rgba(37, 99, 235, .16);
    color: var(--vn-blue);
    font-size: 14px;
    font-weight: 950;
}

.site-brand--text_only .site-brand__mark {
    display: grid !important;
}

.site-brand__mark span {
    transform: translateY(1px);
}

.site-nav__menu > li > a {
    border-radius: 999px;
    color: #263244;
    font-weight: 780;
}

.site-nav__menu > li > a:hover,
.site-nav__menu > li > a:focus-visible {
    background: #eef5ff;
    color: var(--vn-blue);
}

@media (min-width: 1280px) {
    .menu-toggle {
        display: none !important;
    }
}

.hero--v26 {
    position: relative;
    overflow: hidden;
    padding: clamp(58px, 7vw, 104px) 0 clamp(42px, 6vw, 76px);
    background:
        radial-gradient(circle at 82% 18%, rgba(14, 165, 233, .24), transparent 28%),
        radial-gradient(circle at 10% 12%, rgba(37, 99, 235, .18), transparent 26%),
        linear-gradient(135deg, #07111f 0%, #0c1728 54%, #10223b 100%);
    color: #fff;
}

.site-main > section[id] {
    scroll-margin-top: calc(var(--vn-header-height, 72px) + 18px);
}

.hero--v26::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);
    background-size: 46px 46px;
    mask-image: linear-gradient(90deg, rgba(0, 0, 0, .72), rgba(0, 0, 0, .2));
    pointer-events: none;
}

.hero--v26::after {
    content: "";
    position: absolute;
    right: -14%;
    bottom: -42%;
    width: 520px;
    height: 520px;
    border-radius: 50%;
    background: rgba(14, 165, 233, .18);
    filter: blur(32px);
    pointer-events: none;
}

.hero--v26 .hero__grid--v26 {
    position: relative;
    z-index: 1;
    grid-template-columns: minmax(0, 1.04fr) minmax(360px, .78fr);
    gap: clamp(30px, 5vw, 72px);
}

.hero--v26 .eyebrow {
    color: #91d7ff;
}

.hero__content--v26 h1 {
    max-width: 800px;
    color: #fff;
    font-size: clamp(38px, 4.6vw, 62px);
    line-height: 1.02;
}

.hero--v26 .hero__text {
    max-width: 690px;
    color: rgba(255, 255, 255, .76);
}

.hero--v26 .btn--secondary {
    border-color: rgba(255, 255, 255, .24);
    background: rgba(255, 255, 255, .08);
    color: #fff;
}

.hero-ai-badge--v25 {
    width: fit-content;
    border-color: rgba(125, 211, 252, .32);
    background: rgba(255, 255, 255, .08);
    color: #e0f2fe;
}

.hero-ai-badge--v25 span {
    background: linear-gradient(135deg, var(--vn-blue), var(--vn-cyan));
}

.hero--v26 .proof-row span {
    border-color: rgba(255, 255, 255, .16);
    background: rgba(255, 255, 255, .08);
    color: rgba(255, 255, 255, .84);
    box-shadow: none;
}

.hero-delivery-panel {
    display: grid;
    gap: 18px;
    width: min(100%, 470px);
    justify-self: end;
    padding: 22px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 28px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .055)),
        rgba(7, 17, 31, .64);
    box-shadow: 0 28px 90px rgba(0, 0, 0, .34);
    backdrop-filter: blur(16px);
}

.hero-delivery-panel__header {
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 22px;
    background: rgba(255, 255, 255, .07);
}

.hero-delivery-panel__header span {
    display: inline-flex;
    margin-bottom: 10px;
    color: #93c5fd;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.hero-delivery-panel__header strong {
    display: block;
    color: #fff;
    font-size: 24px;
    line-height: 1.15;
}

.hero-delivery-panel__header p {
    margin: 10px 0 0;
    color: rgba(255, 255, 255, .72);
    line-height: 1.55;
}

.hero-delivery-panel__layers {
    position: relative;
    display: grid;
    gap: 10px;
}

.hero-delivery-panel__layers::before {
    content: "";
    position: absolute;
    top: 24px;
    bottom: 24px;
    left: 25px;
    width: 1px;
    background: linear-gradient(180deg, rgba(14, 165, 233, .1), rgba(14, 165, 233, .72), rgba(14, 165, 233, .1));
}

.hero-delivery-panel__layer {
    position: relative;
    display: grid;
    grid-template-columns: 50px 1fr;
    gap: 12px;
    align-items: center;
    min-height: 72px;
    padding: 12px 14px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 18px;
    background: rgba(255, 255, 255, .075);
}

.hero-delivery-panel__layer i {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--vn-blue), var(--vn-cyan));
    color: #fff;
    font-style: normal;
    font-size: 12px;
    font-weight: 950;
}

.hero-delivery-panel__layer strong {
    display: block;
    color: #fff;
    font-size: 15px;
}

.hero-delivery-panel__layer small {
    grid-column: 2;
    display: block;
    margin-top: 3px;
    color: rgba(255, 255, 255, .66);
    font-size: 13px;
    line-height: 1.35;
}

.hero-delivery-panel__chips {
    justify-content: flex-start;
}

.services-section--v26,
.use-cases-section--v26,
.process-section--v26 {
    background: linear-gradient(180deg, #f8fbff 0%, #fff 100%);
}

.system-module-grid--v26 {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 16px;
}

.system-module--v26 {
    grid-column: span 2;
    min-height: 226px;
    border: 1px solid var(--vn-border);
    border-radius: var(--vn-radius-lg);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(248, 250, 252, .92)),
        #fff;
    box-shadow: 0 16px 44px rgba(15, 23, 42, .06);
}

.system-module--primary {
    grid-column: span 3;
    min-height: 268px;
    background:
        radial-gradient(circle at 88% 12%, rgba(14, 165, 233, .14), transparent 34%),
        #fff;
}

.system-module--v26 .system-module__description {
    color: var(--vn-muted);
}

.system-module--v26:hover,
.level-card--v26:hover,
.project-card--v26:hover,
.use-case-card--v26:hover {
    transform: translateY(-3px);
    box-shadow: var(--vn-shadow-soft);
}

.packages-section--v26 {
    background: #fff;
}

.level-grid--v26 {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.level-card--v26 {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-height: 100%;
    padding: 24px;
    border: 1px solid var(--vn-border);
    border-radius: var(--vn-radius-lg);
    background: #fff;
    box-shadow: 0 18px 54px rgba(15, 23, 42, .07);
}

.level-card--v26.is-recommended {
    border-color: rgba(37, 99, 235, .35);
    background:
        radial-gradient(circle at 90% 0%, rgba(37, 99, 235, .12), transparent 34%),
        #fff;
}

.level-card--v26 .level-card__pricing {
    display: grid;
    gap: 6px;
    padding: 16px;
    border: 1px solid #dbeafe;
    border-radius: 18px;
    background: #f8fbff;
}

.level-card--v26 .level-card__pricing strong {
    color: var(--vn-ink);
    font-size: clamp(24px, 2.4vw, 34px);
    line-height: 1;
}

.level-card--v26 .level-card__pricing span,
.level-card--v26 .level-card__head p {
    color: var(--vn-muted);
}

.level-card--v26 .level-card__details {
    margin-top: auto;
}

.level-card--v26 .level-card__details summary,
.project-drawer--v26 summary {
    cursor: pointer;
    color: var(--vn-blue);
    font-weight: 880;
}

.pricing-disclaimer--v26 {
    max-width: 820px;
    margin-inline: auto;
    color: var(--vn-muted);
    text-align: center;
}

.ai-widget-section--v26 {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 16% 0%, rgba(14, 165, 233, .2), transparent 32%),
        linear-gradient(135deg, #07111f 0%, #101b2d 100%);
    color: #fff;
}

.ai-widget-section--v26 .section-heading h2,
.ai-widget-section--v26 .section-heading p:not(.eyebrow) {
    color: #fff;
}

.ai-widget-section--v26 .section-heading p:not(.eyebrow),
.ai-advisor-action p,
.ai-advisor-note--v26 p {
    color: rgba(255, 255, 255, .72);
}

.ai-advisor-note--v26,
.ai-scenario-card--v26 {
    border: 1px solid rgba(255, 255, 255, .13);
    background: rgba(255, 255, 255, .075);
    box-shadow: none;
}

.ai-scenario-grid--v26 {
    gap: 16px;
}

.ai-scenario-card--v26 h3,
.ai-advisor-note--v26 strong {
    color: #fff;
}

.ai-scenario-card--v26 .ai-scenario-card__answer {
    color: #e0f2fe;
}

.ai-scenario-card--v26 .ai-scenario-card__note {
    color: rgba(255, 255, 255, .62);
}

.projects-section--v26 {
    background: #fff;
}

.project-grid--v26 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.project-card--v26 {
    overflow: hidden;
    padding: 0;
    border: 1px solid var(--vn-border);
    border-radius: var(--vn-radius-lg);
    background: #fff;
    box-shadow: 0 16px 48px rgba(15, 23, 42, .07);
}

.project-card--v26 .project-media {
    aspect-ratio: 16 / 10;
    min-height: 0;
    border-radius: 0;
    background: #eef2f7;
}

.project-card--v26 .project-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.project-card--v26 .project-card__body {
    display: grid;
    gap: 12px;
    padding: 18px;
}

.project-drawer--v26 .project-drawer__panel {
    max-height: min(380px, 58vh);
    overflow: auto;
    padding-right: 4px;
}

.use-cases-header {
    grid-template-columns: minmax(0, 760px);
}

.use-case-grid--v26 {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 14px;
}

.use-case-card--v26 {
    min-height: 238px;
    border: 1px solid var(--vn-border);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 14px 40px rgba(15, 23, 42, .055);
}

.use-cases-reveal {
    display: flex;
    justify-content: center;
    margin-top: 22px;
}

.process-steps--v26 {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.process-steps--v26::before {
    content: "";
    position: absolute;
    top: 48px;
    right: 9%;
    left: 9%;
    height: 2px;
    background: linear-gradient(90deg, rgba(37, 99, 235, .08), rgba(37, 99, 235, .42), rgba(14, 165, 233, .08));
}

.process-step--v26 {
    position: relative;
    min-height: 220px;
    margin-top: 0 !important;
    border: 1px solid var(--vn-border);
    border-radius: var(--vn-radius-lg);
    background: #fff;
    box-shadow: 0 16px 44px rgba(15, 23, 42, .06);
}

.process-step--v26::before {
    display: none;
}

.process-step--v26 .process-step__number {
    position: relative;
    z-index: 1;
    box-shadow: 0 12px 30px rgba(37, 99, 235, .24);
}

.contact-section--v26 {
    background:
        radial-gradient(circle at 0% 10%, rgba(14, 165, 233, .12), transparent 28%),
        linear-gradient(180deg, #fff 0%, #f8fbff 100%);
}

.contact-section--v26 .contact-conversion {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(320px, .72fr);
    align-items: start;
}

.contact-method-card {
    border: 1px solid var(--vn-border);
    border-radius: var(--vn-radius-lg);
    background: #fff;
    box-shadow: var(--vn-shadow-soft);
}

.contact-response-card {
    display: grid;
    gap: 12px;
    margin: 16px 0 18px;
    padding: 0 0 16px;
    border-bottom: 1px solid #dbeafe;
    background: transparent;
}

.contact-response-card strong {
    color: var(--vn-ink);
}

.contact-response-card ol {
    display: grid;
    gap: 10px;
    margin: 0;
    padding-left: 22px;
    color: var(--vn-muted);
}

.site-footer {
    background: #07111f;
}

.site-footer__inner--patch2 {
    padding-top: 28px;
    padding-bottom: 18px;
}

.site-footer__grid {
    display: grid;
    grid-template-columns: 1.25fr .8fr .95fr;
    gap: clamp(18px, 4vw, 44px);
}

.site-footer__brand p,
.site-footer__links,
.site-footer__contact-list {
    font-size: 14px;
}

.site-footer__bottom {
    margin-top: 18px;
}

.scroll-top {
    right: 14px;
    bottom: 16px;
    left: auto;
    z-index: 9998;
}

@media (max-width: 1180px) {
    .hero--v26 .hero__grid--v26,
    .contact-section--v26 .contact-conversion {
        grid-template-columns: 1fr;
    }

    .hero-delivery-panel {
        justify-self: stretch;
        max-width: 640px;
    }

    .system-module-grid--v26,
    .level-grid--v26,
    .project-grid--v26,
    .use-case-grid--v26,
    .process-steps--v26,
    .site-footer__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .system-module--v26,
    .system-module--primary {
        grid-column: span 1;
        min-height: 0;
    }

    .process-steps--v26::before {
        display: none;
    }
}

@media (max-width: 760px) {
    .hero--v26 {
        padding-top: 42px;
    }

    .hero__content--v26 h1 {
        font-size: clamp(32px, 9.5vw, 44px);
    }

    .hero-delivery-panel {
        display: none;
    }

    .system-module-grid--v26,
    .level-grid--v26,
    .project-grid--v26,
    .use-case-grid--v26,
    .process-steps--v26,
    .site-footer__grid {
        grid-template-columns: 1fr;
    }

    .level-card--v26,
    .project-card--v26,
    .use-case-card--v26,
    .process-step--v26 {
        border-radius: 18px;
    }

    .process-steps--v26 {
        padding-left: 18px;
    }

    .process-steps--v26::after {
        content: "";
        position: absolute;
        top: 20px;
        bottom: 20px;
        left: 0;
        width: 2px;
        background: linear-gradient(180deg, rgba(37, 99, 235, .08), rgba(37, 99, 235, .38), rgba(14, 165, 233, .08));
    }

    .contact-section--v26 .contact-conversion {
        grid-template-columns: 1fr;
    }

    .site-footer__inner--patch2 {
        padding-bottom: 84px;
    }

    .scroll-top {
        right: 14px;
        bottom: 16px;
        left: auto;
    }
}

/* VNTech 2.7.0 - Premium Art Direction + Interaction Pass */
:root {
    --vn-studio-ink: #08111f;
    --vn-studio-deep: #0b1727;
    --vn-studio-panel: #111f32;
    --vn-studio-line: rgba(148, 163, 184, .22);
    --vn-studio-soft: #eef3f8;
    --vn-studio-warm: #f8fafc;
    --vn-studio-cyan: #38bdf8;
    --vn-studio-blue: #2563eb;
    --vn-studio-text: #dbe7f3;
}

body {
    background:
        linear-gradient(180deg, #fff 0%, #f4f7fb 22%, #fff 100%);
}

.section {
    position: relative;
}

.site-header {
    background: rgba(255, 255, 255, .92);
    border-bottom-color: rgba(15, 23, 42, .08);
    box-shadow: 0 10px 30px rgba(15, 23, 42, .055);
}

.site-header__inner {
    min-height: 64px;
}

.site-brand--text_only .site-brand__mark {
    width: 42px;
    height: 42px;
    border-radius: 14px 14px 14px 6px;
    border-color: rgba(37, 99, 235, .38);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .92), rgba(219, 234, 254, .9)),
        #fff;
    box-shadow: 0 14px 34px rgba(37, 99, 235, .16), inset 0 0 0 1px rgba(255, 255, 255, .7);
    color: #1d4ed8;
}

.site-nav__menu > li > a {
    position: relative;
    padding: 8px 0;
    border-radius: 0;
}

.site-nav__menu > li > a::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 2px;
    left: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--vn-studio-blue), var(--vn-studio-cyan));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .18s ease;
}

.site-nav__menu > li > a:hover,
.site-nav__menu > li > a:focus-visible {
    background: transparent;
    color: #0f172a;
}

.site-nav__menu > li > a:hover::after,
.site-nav__menu > li > a:focus-visible::after {
    transform: scaleX(1);
}

.site-header__cta {
    padding: 11px 18px;
    box-shadow: 0 12px 28px rgba(37, 99, 235, .2);
}

.hero--v27 {
    min-height: min(760px, calc(100vh - var(--vn-header-height, 64px)));
    padding: clamp(52px, 6.4vw, 92px) 0 clamp(54px, 6vw, 88px);
    background:
        linear-gradient(118deg, rgba(56, 189, 248, .12), transparent 31%),
        radial-gradient(circle at 86% 18%, rgba(59, 130, 246, .26), transparent 30%),
        radial-gradient(circle at 6% 74%, rgba(14, 165, 233, .14), transparent 29%),
        linear-gradient(135deg, #06101f 0%, #0a1628 52%, #0f2740 100%);
}

.hero--v27::before {
    opacity: .8;
    background-image:
        linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px),
        linear-gradient(135deg, transparent 0 48%, rgba(255, 255, 255, .055) 49%, transparent 50%);
    background-size: 42px 42px, 42px 42px, 180px 180px;
}

.hero--v27::after {
    right: -10%;
    bottom: -28%;
    width: 650px;
    height: 650px;
    background: radial-gradient(circle, rgba(56, 189, 248, .2), rgba(37, 99, 235, .08) 48%, transparent 68%);
}

.hero--v27 .hero__grid--v27 {
    grid-template-columns: minmax(0, .98fr) minmax(390px, .72fr);
    align-items: center;
}

.hero__content--v27 h1 {
    max-width: 760px;
    font-size: clamp(38px, 4.1vw, 58px);
}

.hero--v27 .hero__text {
    max-width: 650px;
    color: rgba(219, 231, 243, .82);
    font-size: clamp(17px, 1.45vw, 21px);
}

.hero--v27 .hero-ai-badge {
    border-color: rgba(56, 189, 248, .42);
    background: linear-gradient(90deg, rgba(15, 23, 42, .72), rgba(37, 99, 235, .16));
}

.hero--v27 .hero__actions {
    align-items: center;
}

.hero--v27 .proof-row {
    gap: 8px;
}

.hero--v27 .proof-row span {
    padding: 8px 12px;
    border-radius: 12px;
    background: rgba(15, 23, 42, .44);
}

.hero-delivery-panel--v27 {
    position: relative;
    overflow: hidden;
    width: min(100%, 500px);
    border-color: rgba(148, 163, 184, .28);
    background:
        linear-gradient(160deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .055)),
        rgba(8, 17, 31, .74);
    transform: rotate(-1deg);
}

.hero-delivery-panel--v27 > * {
    transform: rotate(1deg);
}

.hero-delivery-panel--v27::before {
    content: "";
    position: absolute;
    inset: 18px auto 18px 42px;
    width: 2px;
    border-radius: 999px;
    background: linear-gradient(180deg, transparent, rgba(56, 189, 248, .7), transparent);
}

.hero-delivery-panel--v27 .hero-delivery-panel__layer {
    grid-template-columns: 48px 1fr;
    min-height: 78px;
    background: rgba(15, 23, 42, .42);
}

.hero-delivery-panel--v27 .hero-delivery-panel__layer:hover {
    border-color: rgba(56, 189, 248, .44);
    transform: translateX(4px);
}

.services-section--v27 {
    overflow: hidden;
    background:
        linear-gradient(120deg, rgba(15, 23, 42, .035), transparent 34%),
        linear-gradient(180deg, #edf3f8 0%, #f8fbff 100%);
}

.services-section--v27::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(90deg, rgba(15, 23, 42, .045) 1px, transparent 1px);
    background-size: 72px 72px;
    pointer-events: none;
}

.system-module-grid--v27 {
    position: relative;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 14px;
}

.system-module-grid--v27::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 5%;
    left: 5%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(37, 99, 235, .28), transparent);
}

.system-module--v27 {
    position: relative;
    grid-column: span 3;
    min-height: 180px;
    padding: 20px;
    border-color: rgba(51, 65, 85, .12);
    background: rgba(255, 255, 255, .76);
    backdrop-filter: blur(10px);
}

.system-module--v27.system-module--primary {
    grid-column: span 6;
    min-height: 220px;
    grid-template-columns: 64px 1fr;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .92), rgba(226, 232, 240, .74)),
        #fff;
}

.system-module--v27 .icon-badge {
    transition: transform .18s ease, box-shadow .18s ease;
}

.system-module--v27:hover .icon-badge,
.system-module--v27:focus-within .icon-badge {
    transform: translateY(-2px) rotate(-3deg);
    box-shadow: 0 14px 30px rgba(37, 99, 235, .18);
}

.system-module__outcome {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid rgba(37, 99, 235, .14);
    color: #1e40af;
    font-size: 13px;
    font-weight: 850;
}

.packages-section--v27 {
    overflow: hidden;
    padding: clamp(58px, 7vw, 90px) 0;
    background:
        radial-gradient(circle at 74% 18%, rgba(56, 189, 248, .18), transparent 30%),
        linear-gradient(135deg, #07111f 0%, #111f32 100%);
    color: #fff;
}

.packages-section--v27 .section-heading h2,
.packages-section--v27 .section-heading p:not(.eyebrow) {
    color: #fff;
}

.packages-section--v27 .section-heading p:not(.eyebrow) {
    color: rgba(219, 231, 243, .72);
}

.packages-stage--v27 {
    position: relative;
}

.level-grid--v27 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    max-width: 1120px;
    margin: 0 auto;
}

.level-card--v27 {
    min-height: 560px;
    border-color: rgba(148, 163, 184, .24);
    background: linear-gradient(180deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .055));
    color: #fff;
    box-shadow: 0 24px 80px rgba(0, 0, 0, .24);
}

.level-card--v27.is-recommended {
    transform: translateY(-12px);
    border-color: rgba(56, 189, 248, .7);
    background:
        radial-gradient(circle at 88% 0%, rgba(56, 189, 248, .22), transparent 40%),
        linear-gradient(180deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, .065));
    box-shadow: 0 34px 110px rgba(37, 99, 235, .28);
}

.level-card--v27 h3,
.level-card--v27 .level-card__pricing strong {
    color: #fff;
}

.level-card--v27 .level-card__head p,
.level-card--v27 .level-card__pricing span,
.level-card--v27 .level-card__details-body,
.level-card--v27 .level-card__disclaimer {
    color: rgba(219, 231, 243, .72);
}

.level-card--v27 .level-card__pricing {
    border-color: rgba(56, 189, 248, .18);
    background: rgba(8, 17, 31, .5);
}

.level-card--v27 .level-card__details {
    border-top: 1px solid rgba(148, 163, 184, .18);
    padding-top: 12px;
}

.level-card--v27 .level-card__details[open] {
    border-color: rgba(56, 189, 248, .38);
}

.level-card--v27 .level-card__details summary {
    color: #bae6fd;
}

.level-card--v27 .level-card__features li,
.level-card--v27 .level-card__orientation,
.level-card--v27 .level-card__terms div {
    background: rgba(255, 255, 255, .07);
    border-color: rgba(148, 163, 184, .16);
}

.level-card--v27.is-custom {
    border-color: rgba(226, 232, 240, .86);
    background:
        radial-gradient(circle at 88% 8%, rgba(56, 189, 248, .12), transparent 34%),
        #f8fafc;
    color: #0f172a;
}

.level-card--v27.is-custom h3,
.level-card--v27.is-custom .level-card__details-body,
.level-card--v27.is-custom .level-card__features li,
.level-card--v27.is-custom .level-card__orientation,
.level-card--v27.is-custom .level-card__terms div {
    color: #0f172a;
}

.level-card--v27.is-custom .level-card__head p,
.level-card--v27.is-custom .level-card__disclaimer,
.level-card--v27.is-custom .level-card__pricing span {
    color: #475569;
}

.level-card--v27.is-custom .level-card__pricing {
    border-color: rgba(15, 23, 42, .12);
    background: linear-gradient(135deg, #9aa6b2, #7f8b98);
}

.level-card--v27.is-custom .level-card__pricing strong {
    color: #fff;
}

.level-card--v27.is-custom .level-card__details summary {
    color: #1d4ed8;
}

.level-card--v27.is-custom .level-card__features li,
.level-card--v27.is-custom .level-card__orientation,
.level-card--v27.is-custom .level-card__terms div {
    background: #fff;
    border-color: rgba(15, 23, 42, .1);
}

.packages-section--v27 .pricing-disclaimer--v26 {
    border-color: rgba(148, 163, 184, .22);
    background: rgba(255, 255, 255, .08);
    color: rgba(219, 231, 243, .82);
}

.ai-widget-section--v27 {
    background:
        linear-gradient(120deg, rgba(37, 99, 235, .08), transparent 34%),
        linear-gradient(180deg, #f8fbff 0%, #eef4f8 100%);
    color: var(--vn-ink);
}

.ai-widget-section--v27 .section-heading h2 {
    color: var(--vn-ink);
}

.ai-widget-section--v27 .section-heading p:not(.eyebrow),
.ai-widget-section--v27 .ai-advisor-action p {
    color: #526173;
}

.ai-advisor-demo--v27 {
    display: grid;
    grid-template-columns: minmax(0, .76fr) minmax(0, 1.24fr);
    gap: 18px;
    align-items: start;
}

.ai-advisor-note--v27 {
    display: grid;
    align-content: center;
    min-height: 0;
    border-color: rgba(37, 99, 235, .13);
    background: #fff;
    box-shadow: 0 18px 48px rgba(15, 23, 42, .07);
}

.ai-advisor-note--v27 strong,
.ai-scenario-card--v27 h3 {
    color: var(--vn-ink);
}

.ai-advisor-note--v27 p,
.ai-scenario-card--v27 .ai-scenario-card__note {
    color: #526173;
}

.ai-scenario-grid--v27 {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 14px;
}

.ai-scenario-card--v27 {
    border-color: rgba(37, 99, 235, .14);
    background: rgba(255, 255, 255, .84);
    color: var(--vn-ink);
}

.ai-scenario-card--v27.is-active {
    grid-row: auto;
    background:
        radial-gradient(circle at 88% 10%, rgba(56, 189, 248, .18), transparent 34%),
        #fff;
}

.ai-scenario-card--v27 .ai-scenario-card__answer {
    color: #1d4ed8;
}

.ai-capability-chips--v27 {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

.ai-capability-chips--v27 span {
    padding: 9px 12px;
    border: 1px solid rgba(37, 99, 235, .14);
    border-radius: 999px;
    background: #fff;
    color: #1e3a8a;
    font-size: 13px;
    font-weight: 850;
}

.projects-section--v27 {
    background:
        linear-gradient(180deg, #101b2d 0%, #0b1727 52%, #f6f9fc 52%, #f6f9fc 100%);
    color: #fff;
}

.projects-section--v27 .section-heading h2,
.projects-section--v27 .section-heading p:not(.eyebrow) {
    color: #fff;
}

.project-grid--v27 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
}

.project-card--v27 {
    border-color: rgba(148, 163, 184, .26);
    background: #fff;
    color: var(--vn-ink);
}

.project-card--v27.is-active {
    outline: 2px solid rgba(56, 189, 248, .7);
    outline-offset: 3px;
}

.project-card--v27 .project-media {
    overflow: hidden;
}

.project-card--v27 .project-card__image {
    transition: transform .35s ease;
}

.project-card--v27:hover .project-card__image,
.project-card--v27:focus-within .project-card__image {
    transform: scale(1.035);
}

.project-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    margin-top: 4px;
}

.project-spotlight-trigger {
    border: 0;
    background: transparent;
    padding: 0;
    color: #2563eb;
    font: inherit;
    font-weight: 900;
    cursor: pointer;
}

.project-spotlight-trigger:hover,
.project-spotlight-trigger:focus-visible {
    color: #1d4ed8;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.project-spotlight--v27 {
    margin-top: 22px;
    padding: clamp(20px, 3vw, 30px);
    border: 1px solid rgba(37, 99, 235, .16);
    border-radius: 26px;
    background:
        radial-gradient(circle at 92% 0%, rgba(56, 189, 248, .14), transparent 36%),
        #fff;
    color: var(--vn-ink);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .12);
}

.project-spotlight--v27[hidden],
.project-spotlight__panel[hidden] {
    display: none !important;
}

.project-spotlight__close {
    float: right;
    border: 1px solid rgba(15, 23, 42, .12);
    border-radius: 999px;
    background: #f8fafc;
    padding: 8px 12px;
    color: #334155;
    font-weight: 850;
}

.project-spotlight__panel {
    display: grid;
    grid-template-columns: minmax(0, .85fr) minmax(0, 1fr);
    gap: 22px;
    clear: both;
}

.project-spotlight__facts {
    display: grid;
    gap: 10px;
    margin: 0;
}

.project-spotlight__facts div {
    padding: 12px;
    border: 1px solid rgba(37, 99, 235, .12);
    border-radius: 16px;
    background: #f8fbff;
}

.project-spotlight__facts dt,
.project-spotlight__modules strong {
    color: #1d4ed8;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.project-spotlight__facts dd {
    margin: 4px 0 0;
    color: #334155;
}

.project-spotlight__modules {
    grid-column: 1 / -1;
}

.project-spotlight__modules ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 10px 0 0;
    padding: 0;
    list-style: none;
}

.project-spotlight__modules li {
    padding: 7px 10px;
    border-radius: 999px;
    background: #eaf2ff;
    color: #1e3a8a;
    font-size: 12px;
    font-weight: 850;
}

.use-cases-section--v27 {
    background:
        linear-gradient(90deg, rgba(15, 23, 42, .055), transparent 24%),
        #eef3f8;
}

.use-case-grid--v27 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
    gap: 10px;
}

.use-case-card--v27 {
    grid-column: span 2;
    display: grid;
    grid-template-columns: 38px 1fr;
    gap: 8px 12px;
    min-height: 0;
    padding: 16px;
    border-radius: 18px;
    background: rgba(255, 255, 255, .78);
}

.use-case-card--v27:nth-child(1),
.use-case-card--v27:nth-child(2) {
    grid-column: span 3;
}

.use-case-card--v27 .icon-badge {
    grid-row: span 4;
}

.use-case-card--v27 h3,
.use-case-card--v27 p {
    margin: 0;
}

.use-case-card--v27 h3 {
    font-size: 16px;
}

.use-case-card--v27 p {
    font-size: 13px;
    line-height: 1.5;
}

.use-case-card--v27 > span {
    width: fit-content;
    margin-top: 2px;
    background: #dbeafe;
    color: #1e40af;
}

.use-case-card--v27[hidden] {
    display: none;
}

.use-cases-reveal--v27 {
    margin-top: 18px;
}

.process-section--v27 {
    overflow: hidden;
    background:
        radial-gradient(circle at 16% 0%, rgba(56, 189, 248, .12), transparent 32%),
        linear-gradient(135deg, #0b1727 0%, #13243a 100%);
    color: #fff;
}

.process-section--v27 .section-heading h2,
.process-section--v27 .section-heading p:not(.eyebrow) {
    color: #fff;
}

.process-section--v27 .section-heading p:not(.eyebrow) {
    color: rgba(219, 231, 243, .72);
}

.process-steps--v27 {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    padding-top: 28px;
}

.process-steps--v27::before {
    top: 52px;
    right: 12%;
    left: 12%;
    height: 3px;
    background: linear-gradient(90deg, rgba(56, 189, 248, .2), rgba(56, 189, 248, .8), rgba(56, 189, 248, .2));
}

.process-step--v27 {
    border: 0;
    background: transparent;
    box-shadow: none;
    color: rgba(219, 231, 243, .78);
}

.process-step--v27 .process-step__number {
    width: 54px;
    height: 54px;
    margin-bottom: 18px;
    border: 6px solid #13243a;
    background: linear-gradient(135deg, var(--vn-studio-blue), var(--vn-studio-cyan));
}

.process-step--v27 h3 {
    color: #fff;
}

.contact-section--v27 {
    padding-bottom: clamp(34px, 5vw, 58px);
    background:
        linear-gradient(180deg, #f6f9fc 0%, #eef3f8 100%);
}

.contact-section--v27 .contact-conversion {
    grid-template-columns: minmax(0, .92fr) minmax(340px, .68fr);
    padding: clamp(20px, 3.8vw, 38px);
    border: 1px solid rgba(37, 99, 235, .14);
    border-radius: 28px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .92), rgba(255, 255, 255, .76)),
        #fff;
    box-shadow: 0 24px 80px rgba(15, 23, 42, .1);
}

.contact-section--v27 .section-heading {
    margin-bottom: 12px;
}

.contact-method-card {
    box-shadow: 0 18px 54px rgba(15, 23, 42, .09);
}

.site-footer--v27 {
    background: #07111f;
}

.site-footer--v27 .site-footer__inner--patch2 {
    padding-top: 22px;
    padding-bottom: 12px;
}

.site-footer--v27 .site-footer__grid {
    gap: 18px;
}

.site-footer--v27 .site-footer__trust {
    padding: 7px 10px;
    line-height: 1.35;
}

.site-footer--v27 .site-footer__bottom {
    margin-top: 12px;
    padding-top: 10px;
}

.scroll-top {
    border-color: rgba(148, 163, 184, .28);
    background: #0b1727;
    color: #fff;
    box-shadow: none;
}

.services-page--v27 {
    min-height: 70vh;
    background:
        radial-gradient(circle at 84% 8%, rgba(56, 189, 248, .14), transparent 30%),
        linear-gradient(180deg, #f8fbff 0%, #eef3f8 100%);
}

.services-page__hero {
    max-width: 820px;
    margin-bottom: 28px;
}

.services-page__hero > p {
    color: #526173;
    font-size: 18px;
    line-height: 1.65;
}

.services-page__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.services-page__item {
    padding: 22px;
    border: 1px solid rgba(37, 99, 235, .12);
    border-radius: 22px;
    background: rgba(255, 255, 255, .82);
    box-shadow: 0 16px 44px rgba(15, 23, 42, .06);
}

.services-page__item h2 {
    font-size: 24px;
}

.services-page__item strong {
    display: block;
    margin-top: 12px;
    color: #1d4ed8;
}

@media (prefers-reduced-motion: no-preference) {
    .use-case-card--v27,
    .project-spotlight--v27,
    .level-card--v27,
    .system-module--v27 {
        transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    }
}

@media (max-width: 1180px) {
    .hero--v27 .hero__grid--v27,
    .ai-advisor-demo--v27,
    .project-spotlight__panel,
    .contact-section--v27 .contact-conversion {
        grid-template-columns: 1fr;
    }

    .level-grid--v27,
    .project-grid--v27,
    .services-page__grid {
        grid-template-columns: 1fr;
    }

    .level-card--v27.is-recommended {
        transform: none;
    }

    .system-module-grid--v27 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .system-module--v27,
    .system-module--v27.system-module--primary {
        grid-column: span 1;
    }

    .use-case-grid--v27 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .use-case-card--v27,
    .use-case-card--v27:nth-child(1),
    .use-case-card--v27:nth-child(2) {
        grid-column: auto;
    }
}

@media (max-width: 760px) {
    .hero--v27 {
        min-height: 0;
        padding-top: 36px;
        padding-bottom: 42px;
    }

    .hero__content--v27 h1 {
        font-size: clamp(31px, 9vw, 41px);
    }

    .hero--v27 .hero__text {
        font-size: 16px;
    }

    .system-module-grid--v27,
    .use-case-grid--v27,
    .process-steps--v27 {
        grid-template-columns: 1fr;
    }

    .system-module-grid--v27::before,
    .process-steps--v27::before {
        display: none;
    }

    .ai-scenario-grid--v27 {
        grid-template-columns: 1fr;
    }

    .ai-scenario-card--v27.is-active {
        grid-row: auto;
    }

    .project-spotlight--v27 {
        padding: 18px;
    }

    .process-steps--v27 {
        padding-left: 20px;
    }

    .process-steps--v27::after {
        left: 0;
        background: linear-gradient(180deg, rgba(56, 189, 248, .2), rgba(56, 189, 248, .7), rgba(56, 189, 248, .2));
    }

    .contact-section--v27 .contact-conversion {
        padding: 20px;
        border-radius: 22px;
    }
}

/* VNTech 2.7.1 - targeted UI/UX polish fixes */
.packages-section--v271 {
    padding: clamp(48px, 6vw, 76px) 0;
    background:
        radial-gradient(circle at 78% 12%, rgba(56, 189, 248, .20), transparent 28%),
        linear-gradient(135deg, #07111f 0%, #0d1a2c 46%, #13243a 100%);
}

.packages-stage--v271 .section-heading {
    max-width: 720px;
    margin-bottom: 24px;
}

.packages-stage--v271 .section-heading p:not(.eyebrow) {
    color: rgba(226, 237, 248, .82);
}

.level-grid--v271 {
    width: min(100%, 1140px);
    gap: 18px;
    align-items: stretch;
}

.level-card--v271 {
    display: flex;
    flex-direction: column;
    min-height: 500px;
    padding: 24px;
    border-color: rgba(148, 163, 184, .34);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .13), rgba(255, 255, 255, .07)),
        rgba(15, 23, 42, .72);
}

.level-card--v271.is-recommended {
    transform: translateY(-8px);
    border-color: rgba(125, 211, 252, .78);
    background:
        radial-gradient(circle at 88% 0%, rgba(56, 189, 248, .24), transparent 38%),
        linear-gradient(180deg, rgba(255, 255, 255, .18), rgba(255, 255, 255, .08)),
        rgba(15, 35, 58, .84);
}

.level-card--v271 .level-card__head p:not(.eyebrow),
.level-card--v271 .level-card__details-body,
.level-card--v271 .level-card__disclaimer {
    color: rgba(226, 237, 248, .84);
}

.level-card--v271 .level-card__badge {
    background: #e0f2fe;
    color: #075985;
}

.level-card--v271 .level-card__pricing {
    margin-top: 12px;
    padding: 17px;
    border-color: rgba(125, 211, 252, .34);
    background: rgba(3, 10, 22, .56);
}

.level-card--v271 .level-card__pricing strong {
    color: #fff;
    font-size: clamp(29px, 3vw, 38px);
    line-height: 1.02;
}

.level-card--v271 .level-card__pricing span {
    color: #bae6fd;
    font-weight: 850;
}

.level-card--v271 .level-card__details {
    margin-top: 18px;
    border-color: rgba(125, 211, 252, .25);
    background: rgba(8, 17, 31, .42);
}

.level-card--v271 .level-card__details summary {
    color: #f8fafc;
}

.level-card--v271 .level-card__details summary::after {
    background: #7dd3fc;
    color: #07111f;
}

.level-card--v271 .level-card__details summary:focus-visible {
    outline: 3px solid rgba(125, 211, 252, .42);
    outline-offset: 3px;
}

.level-card--v271 .level-card__details[open] {
    border-color: rgba(125, 211, 252, .56);
    background: rgba(8, 17, 31, .62);
}

.level-card--v271 .level-card__orientation,
.level-card--v271 .level-card__features li,
.level-card--v271 .level-card__terms div {
    border-color: rgba(148, 163, 184, .22);
    background: rgba(255, 255, 255, .08);
    color: #e2e8f0;
}

.level-card--v271 .level-card__orientation span,
.level-card--v271 .level-card__terms dt {
    color: #bae6fd;
}

.level-card--v271 .level-card__actions {
    margin-top: auto;
    padding-top: 16px;
}

.level-card--v271.is-custom {
    background:
        radial-gradient(circle at 88% 8%, rgba(56, 189, 248, .14), transparent 34%),
        #f8fafc;
}

.level-card--v271.is-custom .level-card__pricing {
    background: linear-gradient(135deg, #64748b, #475569);
}

.level-card--v271.is-custom .level-card__head p:not(.eyebrow),
.level-card--v271.is-custom .level-card__details-body,
.level-card--v271.is-custom .level-card__disclaimer {
    color: #475569;
}

.level-card--v271.is-custom .level-card__details {
    border-color: rgba(37, 99, 235, .18);
    background: #fff;
}

.level-card--v271.is-custom .level-card__details summary,
.level-card--v271.is-custom .level-card__orientation span,
.level-card--v271.is-custom .level-card__terms dt {
    color: #1d4ed8;
}

.packages-section--v271 .pricing-disclaimer--v26 {
    width: min(100%, 820px);
    margin-top: 16px;
    color: rgba(226, 237, 248, .88);
}

.use-cases-section--v271 {
    padding: clamp(50px, 6vw, 76px) 0;
    background:
        linear-gradient(120deg, rgba(37, 99, 235, .06), transparent 38%),
        linear-gradient(180deg, #edf4fb 0%, #f8fbff 100%);
}

.use-cases-header--v271 .section-heading {
    max-width: 740px;
    margin-inline: auto;
    text-align: center;
}

.use-case-grid--v271 {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 14px;
    width: min(100%, 1120px);
    margin: 28px auto 0;
}

.use-case-card--v271,
.use-case-card--v271:nth-child(1),
.use-case-card--v271:nth-child(2) {
    grid-column: span 3;
}

.use-case-card--v271:nth-child(5) {
    grid-column: 2 / span 3;
}

.use-case-card--v271:nth-child(6) {
    grid-column: 5 / span 3;
}

.use-case-card--v271:nth-child(7) {
    grid-column: 8 / span 3;
}

.use-case-card--v271 {
    min-height: 178px;
    align-content: start;
    border-color: rgba(37, 99, 235, .12);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .92), rgba(248, 251, 255, .86)),
        #fff;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .055);
}

.use-case-card--v271::after {
    opacity: .35;
}

.use-case-card--v271 h3 {
    font-size: 17px;
    line-height: 1.2;
}

.use-case-card--v271 p {
    color: #526173;
}

.use-case-card--v271 .use-case-card__recommendation {
    color: #1e40af;
    font-weight: 850;
}

.use-case-card--v271 > span {
    align-self: end;
    background: #dbeafe;
    color: #1e3a8a;
}

.process-section--v271 {
    padding: clamp(52px, 6.4vw, 82px) 0;
}

.process-section--v271 .section-heading {
    max-width: 760px;
    margin-bottom: 18px;
}

.process-steps--v271 {
    position: relative;
    gap: 18px;
    padding-top: 34px;
}

.process-steps--v271::before {
    top: 61px;
    right: 8%;
    left: 8%;
    height: 4px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(125, 211, 252, .18), rgba(125, 211, 252, .92), rgba(125, 211, 252, .18));
}

.process-step--v271 {
    display: grid;
    align-content: start;
    gap: 14px;
    min-height: 0;
    padding: 0 4px;
}

.process-step--v271::before {
    display: none;
}

.process-step--v271:nth-child(even) {
    margin-top: 0;
}

.process-step--v271 .process-step__number {
    position: relative;
    z-index: 1;
    width: 62px;
    height: 62px;
    margin-bottom: 2px;
    border: 7px solid #12243b;
    box-shadow: 0 16px 42px rgba(56, 189, 248, .22);
}

.process-step--v271 .process-step__content {
    min-height: 150px;
    padding: 18px;
    border: 1px solid rgba(148, 163, 184, .18);
    border-radius: 20px;
    background: rgba(255, 255, 255, .07);
}

.process-step--v271 p {
    color: rgba(226, 237, 248, .82);
    line-height: 1.58;
}

.contact-section--v271 {
    padding-top: clamp(44px, 5.4vw, 70px);
    background:
        linear-gradient(180deg, #f8fbff 0%, #edf4fb 72%, #07111f 72%, #07111f 100%);
}

.contact-section--v271 .contact-conversion {
    gap: clamp(20px, 3vw, 34px);
    align-items: start;
}

.contact-section--v271 .contact-helper {
    margin-top: 20px;
}

.contact-section--v271 .contact-helper__list {
    gap: 9px;
}

.contact-section--v271 .contact-helper__list li {
    min-height: 52px;
}

.contact-section--v271 .contact-next-step {
    margin-top: 14px;
    padding: 16px 18px;
}

.contact-section--v271 .contact-method-card {
    gap: 16px;
    padding: clamp(20px, 2.6vw, 30px);
}

.contact-section--v271 .contact-response-card {
    padding: 0 0 14px;
}

.contact-section--v271 .contact-response-card ol {
    gap: 7px;
}

.projects-section--v271 .project-card--v27 {
    display: flex;
    flex-direction: column;
}

.projects-section--v271 .project-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
}

.projects-section--v271 .project-card__actions {
    margin-top: auto;
    padding-top: 12px;
}

.projects-section--v271 .project-media {
    aspect-ratio: 16 / 10;
}

.projects-section--v271 .project-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.site-footer--v271 .site-footer__inner--patch2 {
    padding-bottom: 86px;
}

.scroll-top {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 100020;
    width: 48px;
    height: 48px;
    border-color: rgba(125, 211, 252, .46);
    background:
        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' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5'/%3E%3Cpath d='M5 12l7-7 7 7'/%3E%3C/svg%3E") center / 24px 24px no-repeat,
        linear-gradient(135deg, #0f172a, #1e3a8a);
    box-shadow: 0 18px 42px rgba(15, 23, 42, .28);
}

.scroll-top span {
    display: block;
    width: 16px;
    height: 16px;
    overflow: visible;
    clip: auto;
    border-top: 4px solid #fff;
    border-left: 4px solid #fff;
    color: transparent;
    font-size: 0;
    transform: rotate(45deg) translate(2px, 2px);
}

.scroll-top::before {
    content: none;
}

.scroll-top::after {
    content: none;
}

.scroll-top:focus-visible {
    outline: 3px solid rgba(125, 211, 252, .46);
    outline-offset: 3px;
}

@media (prefers-reduced-motion: no-preference) {
    .use-case-card--v271:hover,
    .use-case-card--v271:focus-within {
        transform: translateY(-2px);
        border-color: rgba(37, 99, 235, .24);
        box-shadow: 0 20px 46px rgba(15, 23, 42, .08);
    }
}

@media (max-width: 1180px) {
    .level-card--v271.is-recommended {
        transform: none;
    }

    .use-case-grid--v271 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-width: 760px;
    }

    .use-case-card--v271,
    .use-case-card--v271:nth-child(1),
    .use-case-card--v271:nth-child(2),
    .use-case-card--v271:nth-child(5),
    .use-case-card--v271:nth-child(6),
    .use-case-card--v271:nth-child(7) {
        grid-column: auto;
    }
}

@media (max-width: 760px) {
    .packages-section--v271,
    .use-cases-section--v271,
    .process-section--v271 {
        padding-top: 42px;
        padding-bottom: 48px;
    }

    .level-card--v271 {
        min-height: 0;
        padding: 20px;
    }

    .level-card--v271 .level-card__actions {
        margin-top: 14px;
    }

    .use-case-grid--v271 {
        grid-template-columns: 1fr;
        max-width: 440px;
    }

    .use-case-card--v271 {
        min-height: 0;
    }

    .process-steps--v271 {
        grid-template-columns: 1fr;
        gap: 16px;
        padding: 12px 0 0 0;
    }

    .process-steps--v271::before {
        top: 20px;
        bottom: 20px;
        left: 31px;
        right: auto;
        width: 4px;
        height: auto;
        background: linear-gradient(180deg, rgba(125, 211, 252, .18), rgba(125, 211, 252, .85), rgba(125, 211, 252, .18));
    }

    .process-step--v271 {
        grid-template-columns: 64px 1fr;
        align-items: start;
        padding: 0;
    }

    .process-step--v271 .process-step__number {
        width: 58px;
        height: 58px;
        margin: 0;
    }

    .process-step--v271 .process-step__content {
        min-height: 0;
        padding: 16px;
    }

    .contact-section--v271 {
        background: linear-gradient(180deg, #f8fbff 0%, #edf4fb 80%, #07111f 80%, #07111f 100%);
    }

    .contact-section--v271 .contact-helper__list {
        grid-template-columns: 1fr;
    }

    .scroll-top {
        right: 14px;
        bottom: 14px;
        width: 46px;
        height: 46px;
    }
}

@media (max-width: 760px) {

    .process-section--v272 {
        padding-bottom: 132px;
    }

    .process-section--v272 .process-steps--v272 {
        padding-right: 58px;
    }

    .site-footer--v272 .site-footer__inner--patch2 {
        padding-bottom: 148px;
    }
}

/* VNTech 2.7.3 - light reference-match Header/Hero + final visual corrections */
body {
    background:
        radial-gradient(circle at 78% 0%, rgba(37, 99, 235, .09), transparent 34%),
        linear-gradient(180deg, #f7fbff 0%, #eef5ff 42%, #f8fbff 100%);
}

.site-main {
    background: transparent;
}

.site-header--v273 {
    top: 0;
    padding: 18px max(16px, env(safe-area-inset-left)) 8px;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.site-header--v273.is-scrolled {
    background: transparent;
    box-shadow: none;
}

.site-header--v273 .site-header__inner {
    width: min(100%, 1540px);
    min-height: 70px;
    margin-inline: auto;
    padding: 10px 18px 10px 24px;
    border: 1px solid rgba(148, 163, 184, .22);
    border-radius: 28px;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 18px 52px rgba(15, 23, 42, .08);
    backdrop-filter: blur(18px);
}

.site-header--v273 .site-brand__mark,
.site-header--v273 .site-footer__mark {
    border-radius: 13px;
    background: linear-gradient(135deg, #2563eb, #123cd6);
    color: #fff;
}

.site-header--v273 .site-brand__text strong {
    color: #07122b;
    font-size: 24px;
    letter-spacing: 0;
}

.site-header--v273 .site-brand__text small {
    color: #64748b;
    font-size: 13px;
}

.site-header--v273 .site-nav__menu {
    justify-content: center;
}

.site-header--v273 .site-nav__menu > li > a {
    color: #07122b;
    font-size: 15px;
    font-weight: 900;
}

.site-header--v273 .site-nav__menu > li > a:hover,
.site-header--v273 .site-nav__menu > li > a:focus-visible,
.site-header--v273 .site-nav__menu > li > a.is-active {
    color: #174eea;
}

.site-header--v273 .site-header__cta {
    min-height: 54px;
    padding: 0 28px;
    border-radius: 12px;
    background: linear-gradient(135deg, #0b4cff, #133bd8);
    color: #fff;
    box-shadow: 0 14px 28px rgba(37, 99, 235, .25);
}

.site-header--v273 .site-header__cta::after,
.hero--v273 .hero__actions .btn::after {
    content: "→";
    display: inline-block;
    margin-left: 12px;
    transform: translateY(-1px);
    transition: transform .18s ease;
}

.site-header--v273 .site-header__cta:hover::after,
.site-header--v273 .site-header__cta:focus-visible::after,
.hero--v273 .hero__actions .btn:hover::after,
.hero--v273 .hero__actions .btn:focus-visible::after {
    transform: translate(3px, -1px);
}

.hero--v273 {
    min-height: 0;
    padding: 34px 0 46px;
    overflow: hidden;
    background:
        radial-gradient(circle at 80% 16%, rgba(37, 99, 235, .13), transparent 32%),
        radial-gradient(circle at 36% 58%, rgba(96, 165, 250, .14), transparent 34%),
        linear-gradient(180deg, #f8fbff 0%, #eef5ff 100%);
    color: #07122b;
}

.hero--v273::before {
    opacity: 1;
    background:
        radial-gradient(circle, rgba(37, 99, 235, .24) 1px, transparent 1.5px) 48% 8% / 18px 18px,
        linear-gradient(125deg, transparent 52%, rgba(255, 255, 255, .92) 52.4%, transparent 52.8%),
        linear-gradient(154deg, transparent 58%, rgba(37, 99, 235, .11) 58.4%, transparent 58.8%);
    mask-image: linear-gradient(180deg, transparent 0%, #000 16%, #000 72%, transparent 100%);
}

.hero--v273::after {
    right: -140px;
    bottom: 110px;
    width: 720px;
    height: 360px;
    background:
        radial-gradient(ellipse at center, rgba(37, 99, 235, .18), transparent 68%);
}

.hero__container--v273 {
    position: relative;
    z-index: 1;
}

.hero__grid--v273 {
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(560px, 1.08fr);
    gap: 52px;
    align-items: center;
}

.hero__content--v273 {
    color: #07122b;
}

.hero-reference-badge {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    max-width: 100%;
    margin-bottom: 28px;
    padding: 12px 16px;
    border: 1px solid rgba(37, 99, 235, .12);
    border-radius: 999px;
    background: rgba(255, 255, 255, .88);
    box-shadow: 0 14px 36px rgba(15, 23, 42, .06);
    color: #07122b;
}

.hero-reference-badge > span {
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 9px;
    background: #eff6ff;
    color: #174eea;
}

.hero-reference-badge svg {
    width: 18px;
    height: 18px;
    fill: currentColor;
}

.hero-reference-badge strong {
    font-weight: 950;
}

.hero-reference-badge small {
    padding-left: 12px;
    border-left: 1px solid rgba(148, 163, 184, .26);
    color: #64748b;
    font-size: 14px;
}

.hero-reference-badge i {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: #22c55e;
    box-shadow: 0 0 0 5px rgba(34, 197, 94, .12);
}

.hero--v273 .eyebrow {
    color: #174eea;
}

.hero__content--v273 h1 {
    display: grid;
    gap: 2px;
    max-width: 680px;
    margin: 0;
    color: #07122b;
    font-size: 60px;
    line-height: 1.12;
    letter-spacing: 0;
}

.hero__content--v273 h1 mark {
    display: block;
    padding: 0;
    background: transparent;
    color: #1556f0;
}

.hero--v273 .hero__text {
    max-width: 660px;
    margin-top: 24px;
    color: #475569;
    font-size: 19px;
    line-height: 1.75;
}

.hero--v273 .hero__actions {
    gap: 18px;
    margin-top: 30px;
}

.hero--v273 .hero__actions .btn {
    min-height: 58px;
    padding: 0 28px;
    border-radius: 12px;
}

.hero--v273 .hero__actions .btn--primary {
    background: linear-gradient(135deg, #0b4cff, #123bd8);
    color: #fff;
    box-shadow: 0 16px 34px rgba(37, 99, 235, .25);
}

.hero--v273 .hero__actions .btn--secondary {
    border-color: rgba(37, 99, 235, .62);
    background: rgba(255, 255, 255, .82);
    color: #0b4cff;
}

.proof-row--v273 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    max-width: 760px;
    margin-top: 28px;
}

.proof-row--v273 span {
    display: grid;
    grid-template-columns: 40px 1fr;
    gap: 6px 12px;
    align-items: center;
    padding: 0 18px 0 0;
    border: 0;
    border-right: 1px solid rgba(148, 163, 184, .28);
    background: transparent;
    color: #07122b;
}

.proof-row--v273 span:last-child {
    border-right: 0;
}

.proof-row--v273 i {
    display: grid;
    grid-row: span 2;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: #eef4ff;
    color: #174eea;
}

.proof-row--v273 svg {
    width: 22px;
    height: 22px;
    fill: currentColor;
}

.proof-row--v273 strong {
    font-size: 15px;
    font-weight: 950;
}

.proof-row--v273 small {
    color: #64748b;
    font-size: 13px;
}

.hero-dashboard--v273 {
    position: relative;
    min-height: 560px;
    perspective: 1600px;
}

.hero-dashboard__shell {
    position: relative;
    overflow: hidden;
    min-height: 520px;
    padding: 34px;
    border: 1px solid rgba(148, 163, 184, .32);
    border-radius: 30px;
    background:
        radial-gradient(circle at 64% 38%, rgba(37, 99, 235, .38), transparent 28%),
        radial-gradient(circle at 86% 22%, rgba(59, 130, 246, .22), transparent 30%),
        linear-gradient(135deg, #06122b 0%, #07152f 52%, #020817 100%);
    color: #fff;
    box-shadow: 0 36px 80px rgba(15, 23, 42, .22), inset 0 0 0 1px rgba(255, 255, 255, .08);
    transform: rotate(-2deg) skewX(-1deg);
}

.hero-dashboard__topbar {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: center;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(148, 163, 184, .2);
}

.hero-dashboard__topbar > strong {
    font-size: 20px;
    letter-spacing: 0;
}

.hero-dashboard__topbar nav {
    display: flex;
    flex-wrap: wrap;
    gap: 22px;
    color: rgba(226, 237, 248, .72);
    font-size: 13px;
    font-weight: 850;
}

.hero-dashboard__topbar nav span {
    position: relative;
    padding: 8px 0;
}

.hero-dashboard__topbar nav .is-active {
    color: #60a5fa;
}

.hero-dashboard__topbar nav .is-active::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -21px;
    left: 0;
    height: 2px;
    border-radius: 999px;
    background: #2563eb;
}

.hero-dashboard__content {
    position: relative;
    z-index: 2;
    width: 58%;
    padding-top: 44px;
}

.hero-dashboard__copy h2 {
    margin: 0;
    color: #fff;
    font-size: 31px;
    line-height: 1.18;
    letter-spacing: 0;
}

.hero-dashboard__copy p {
    margin: 14px 0 0;
    color: rgba(226, 237, 248, .76);
}

.hero-dashboard__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 26px;
}

.hero-dashboard__stats span {
    display: grid;
    gap: 4px;
    padding: 14px 12px;
    border: 1px solid rgba(148, 163, 184, .18);
    border-radius: 12px;
    background: rgba(255, 255, 255, .065);
}

.hero-dashboard__stats strong {
    color: #60a5fa;
    font-size: 18px;
}

.hero-dashboard__stats small {
    color: rgba(226, 237, 248, .72);
    font-size: 12px;
}

.hero-dashboard__table {
    display: grid;
    gap: 8px;
    margin-top: 22px;
    padding: 14px;
    border: 1px solid rgba(148, 163, 184, .18);
    border-radius: 14px;
    background: rgba(2, 8, 23, .32);
}

.hero-dashboard__table > strong {
    color: #fff;
    font-size: 12px;
}

.hero-dashboard__table span {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 9px 0;
    border-top: 1px solid rgba(148, 163, 184, .13);
}

.hero-dashboard__table em {
    color: #fff;
    font-style: normal;
    font-size: 12px;
}

.hero-dashboard__table small {
    color: rgba(226, 237, 248, .64);
}

.hero-dashboard__table i {
    color: #22c55e;
    font-style: normal;
    font-size: 11px;
}

.hero-dashboard__wave {
    position: absolute;
    z-index: 1;
    top: 150px;
    right: -34px;
    width: 62%;
    height: 190px;
    border-radius: 999px;
    background:
        radial-gradient(ellipse at center, rgba(96, 165, 250, .9), transparent 58%),
        linear-gradient(90deg, transparent, rgba(37, 99, 235, .86), transparent);
    filter: blur(7px);
    opacity: .78;
    transform: rotate(-8deg);
}

.hero-dashboard__wave::after {
    content: "";
    position: absolute;
    inset: 38px -20px;
    border-top: 2px solid rgba(147, 197, 253, .72);
    border-radius: 50%;
}

.hero-ai-card--v273 {
    position: absolute;
    z-index: 4;
    top: 128px;
    right: 18px;
    width: 250px;
    padding: 20px;
    border: 1px solid rgba(37, 99, 235, .16);
    border-radius: 22px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 28px 58px rgba(15, 23, 42, .2);
    color: #07122b;
}

.hero-ai-card__head {
    display: flex;
    align-items: center;
    gap: 10px;
}

.hero-ai-card__head span {
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    background: #174eea;
    color: #fff;
    font-size: 12px;
    font-weight: 950;
}

.hero-ai-card__head strong {
    flex: 1;
    font-weight: 950;
}

.hero-ai-card__head i {
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: #22c55e;
}

.hero-ai-card--v273 p {
    margin: 16px 0;
    color: #334155;
    font-size: 13px;
    line-height: 1.45;
}

.hero-ai-card--v273 ul {
    display: grid;
    gap: 9px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.hero-ai-card--v273 li {
    padding: 9px 10px;
    border: 1px solid rgba(37, 99, 235, .2);
    border-radius: 9px;
    background: #f8fbff;
    color: #174eea;
    font-size: 12px;
    font-weight: 850;
}

.hero-service-strip--v273 {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
    margin-top: 28px;
    padding: 26px;
    border: 1px solid rgba(148, 163, 184, .18);
    border-radius: 24px;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 24px 60px rgba(15, 23, 42, .07);
}

.hero-service-strip--v273 article {
    display: grid;
    grid-template-columns: 64px 1fr;
    gap: 14px;
    align-items: start;
    padding: 0 20px;
    border-right: 1px solid rgba(148, 163, 184, .22);
}

.hero-service-strip--v273 article:last-child {
    border-right: 0;
}

.hero-service-strip--v273 .icon-badge {
    width: 58px;
    height: 58px;
    border-radius: 14px;
    background: linear-gradient(135deg, #0b4cff, #123bd8);
    color: #fff;
    box-shadow: 0 14px 28px rgba(37, 99, 235, .18);
}

.hero-service-strip--v273 .icon-badge svg {
    width: 30px;
    height: 30px;
}

.hero-service-strip--v273 h3 {
    margin: 0;
    color: #07122b;
    font-size: 16px;
    line-height: 1.28;
}

.hero-service-strip--v273 p {
    margin: 8px 0 0;
    color: #64748b;
    font-size: 13px;
    line-height: 1.55;
}

.services-section--v272,
.use-cases-section--v272,
.faq-section--v272 {
    background:
        linear-gradient(180deg, #f8fbff 0%, #eef5ff 100%);
}

.services-section--v272::before,
.use-cases-section--v272::before {
    opacity: .18;
}

.system-module--v272,
.use-case-card--v272,
.faq-item--v272 {
    background: rgba(255, 255, 255, .94);
}

.packages-section--v272 {
    background:
        radial-gradient(circle at 82% 12%, rgba(37, 99, 235, .10), transparent 28%),
        linear-gradient(180deg, #f8fbff 0%, #eef5ff 100%);
    color: #07122b;
}

.packages-section--v272 .section-heading h2,
.packages-section--v272 .section-heading p:not(.eyebrow) {
    color: #07122b;
}

.packages-stage--v272 {
    padding: clamp(28px, 5vw, 58px);
    border: 1px solid rgba(37, 99, 235, .11);
    border-radius: 30px;
    background:
        linear-gradient(135deg, rgba(7, 17, 31, .96), rgba(12, 30, 55, .94));
    color: #fff;
    box-shadow: 0 26px 72px rgba(15, 23, 42, .13);
}

.packages-stage--v272 .section-heading h2,
.packages-stage--v272 .section-heading p:not(.eyebrow) {
    color: #fff;
}

.ai-widget-section--v272,
.projects-section--v272 {
    background:
        radial-gradient(circle at 15% 8%, rgba(37, 99, 235, .08), transparent 28%),
        linear-gradient(180deg, #f8fbff 0%, #eef5ff 100%);
    color: #07122b;
}

.projects-section--v272 .section-heading h2,
.projects-section--v272 .section-heading p:not(.eyebrow) {
    color: #07122b;
}

.process-section--v272 {
    background:
        radial-gradient(circle at 82% 8%, rgba(37, 99, 235, .11), transparent 26%),
        linear-gradient(180deg, #f8fbff 0%, #eef5ff 100%);
    color: #07122b;
}

.process-section--v272 .section-heading h2,
.process-section--v272 .section-heading p:not(.eyebrow) {
    color: #07122b;
}

.process-steps--v272::before {
    background: linear-gradient(90deg, rgba(37, 99, 235, .14), rgba(37, 99, 235, .72), rgba(37, 99, 235, .14));
}

.process-step--v272 .process-step__number {
    border-color: #f8fbff;
}

.process-step--v272 .process-step__content {
    border-color: rgba(37, 99, 235, .12);
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 18px 48px rgba(15, 23, 42, .06);
}

.process-step--v272 h3 {
    color: #07122b;
}

.process-step--v272 p {
    color: #475569;
}

.contact-section--v272 {
    background:
        linear-gradient(180deg, #f8fbff 0%, #eef5ff 76%, #07111f 76%, #07111f 100%);
}

.site-footer__brand-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.site-footer__logo {
    display: inline-flex;
    width: 44px;
    height: 44px;
    overflow: hidden;
    border-radius: 14px;
    background: rgba(255, 255, 255, .08);
}

.site-footer__logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.site-footer__mark {
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(125, 211, 252, .24);
    border-radius: 14px;
    background: linear-gradient(135deg, #2563eb, #0f3fd7);
    color: #fff;
    font-weight: 950;
}

.scroll-top {
    right: 22px;
    bottom: 22px;
    width: 52px;
    height: 52px;
    border-radius: 18px;
}

@media (max-width: 1280px) {
    .hero__grid--v273 {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .hero-dashboard--v273 {
        min-height: 500px;
    }

    .hero-service-strip--v273 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
    }

    .hero-service-strip--v273 article {
        border-right: 0;
        padding: 0;
    }
}

@media (max-width: 900px) {
    .site-header--v273 {
        padding: 12px 14px 6px;
    }

    .site-header--v273 .site-header__inner {
        min-height: 62px;
        padding: 8px 10px 8px 14px;
        border-radius: 20px;
    }

    .site-header--v273 .site-brand__text strong {
        font-size: 20px;
    }

    .site-header--v273 .site-brand__text small {
        display: none;
    }

    .hero--v273 {
        padding-top: 24px;
    }

    .hero__content--v273 h1 {
        font-size: 42px;
    }

    .hero--v273 .hero__text {
        font-size: 17px;
    }

    .hero-reference-badge {
        align-items: flex-start;
        border-radius: 18px;
    }

    .hero-reference-badge small {
        display: none;
    }

    .proof-row--v273 {
        grid-template-columns: 1fr;
    }

    .proof-row--v273 span {
        border-right: 0;
    }

    .hero-dashboard--v273 {
        min-height: 0;
    }

    .hero-dashboard__shell {
        min-height: 0;
        padding: 22px;
        transform: none;
    }

    .hero-dashboard__topbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .hero-dashboard__content {
        width: 100%;
        padding-top: 28px;
    }

    .hero-dashboard__stats {
        grid-template-columns: 1fr;
    }

    .hero-dashboard__table span {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .hero-dashboard__wave {
        top: 160px;
        right: -120px;
        width: 360px;
        opacity: .42;
    }

    .hero-ai-card--v273 {
        position: relative;
        top: auto;
        right: auto;
        width: auto;
        margin: 16px 0 0;
    }

    .hero-service-strip--v273 {
        grid-template-columns: 1fr;
        padding: 18px;
    }

    .hero-service-strip--v273 article {
        grid-template-columns: 54px 1fr;
        padding-bottom: 16px;
        border-bottom: 1px solid rgba(148, 163, 184, .18);
    }

    .hero-service-strip--v273 article:last-child {
        padding-bottom: 0;
        border-bottom: 0;
    }

    .hero-service-strip--v273 .icon-badge {
        width: 48px;
        height: 48px;
    }

    .packages-stage--v272 {
        padding: 22px 14px;
        border-radius: 24px;
    }
}

@media (max-width: 760px) {
    .scroll-top {
        right: 14px;
        bottom: 14px;
        width: 46px;
        height: 46px;
        border-radius: 16px;
    }

    .contact-section--v272 {
        background: linear-gradient(180deg, #f8fbff 0%, #eef5ff 82%, #07111f 82%, #07111f 100%);
    }
}

/* VNTech 2.7.2 - Dynamic UI/UX + Customizer audit polish */
:where(a, button, summary, [tabindex]):focus-visible {
    outline: 3px solid rgba(37, 99, 235, .36);
    outline-offset: 3px;
}

main > section {
    scroll-margin-top: calc(var(--vn-header-height, 72px) + 18px);
}

.site-header--v272 {
    backdrop-filter: blur(18px);
}

.site-header--v272.is-scrolled {
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 16px 42px rgba(15, 23, 42, .08);
}

.site-header--v272 .site-header__inner {
    gap: clamp(12px, 2vw, 26px);
}

.site-header--v272 .site-nav__menu > li > a {
    color: #334155;
    font-weight: 850;
}

.site-header--v272 .site-nav__menu > li > a.is-active,
.site-header--v272 .site-nav__menu > li > a[aria-current="true"] {
    color: #1d4ed8;
}

.site-header--v272 .site-nav__menu > li > a.is-active::after,
.site-header--v272 .site-nav__menu > li > a[aria-current="true"]::after {
    transform: scaleX(1);
}

.site-header--v272 .site-header__cta {
    padding: 10px 16px;
    border-radius: 999px;
}

.mobile-drawer a.is-active {
    color: #1d4ed8;
}

.hero--v272 {
    min-height: min(700px, calc(100vh - var(--vn-header-height, 64px)));
    padding: clamp(44px, 5.8vw, 76px) 0 clamp(48px, 5.6vw, 78px);
    background:
        linear-gradient(112deg, rgba(56, 189, 248, .11), transparent 26%),
        linear-gradient(180deg, rgba(255, 255, 255, .045), transparent 24%),
        linear-gradient(135deg, #06101f 0%, #0a1628 48%, #11253d 100%);
}

.hero--v272::before {
    background-size: 38px 38px, 38px 38px, 150px 150px;
    opacity: .62;
}

.hero--v272 .hero__grid--v272 {
    grid-template-columns: minmax(0, 1fr) minmax(360px, .72fr);
    gap: clamp(28px, 5vw, 70px);
}

.hero__content--v272 h1 {
    max-width: 730px;
    letter-spacing: 0;
}

.hero--v272 .hero__actions {
    gap: 10px;
}

.hero--v272 .proof-row span {
    border: 1px solid rgba(125, 211, 252, .16);
    transition: border-color .18s ease, transform .18s ease, background .18s ease;
}

.hero-delivery-panel--v272 {
    transform: none;
    border-radius: 26px 26px 26px 10px;
    box-shadow: 0 34px 90px rgba(0, 0, 0, .28);
}

.hero-delivery-panel--v272 > * {
    transform: none;
}

.hero-delivery-panel--v272::before {
    left: 40px;
    background: linear-gradient(180deg, transparent, rgba(125, 211, 252, .88), transparent);
}

.hero-delivery-panel--v272::after {
    content: "";
    position: absolute;
    top: 32px;
    right: 28px;
    width: 84px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(125, 211, 252, .75));
}

.hero-delivery-panel--v272 .hero-delivery-panel__layer {
    border-color: rgba(148, 163, 184, .24);
}

.services-section--v272 {
    padding-top: clamp(54px, 6vw, 82px);
    background:
        linear-gradient(90deg, rgba(15, 23, 42, .045) 1px, transparent 1px),
        linear-gradient(180deg, #eef5fb 0%, #f8fbff 100%);
    background-size: 84px 100%, auto;
}

.system-module-grid--v272 {
    gap: 16px;
}

.system-module--v272 {
    isolation: isolate;
    overflow: hidden;
    border-radius: 22px;
}

.system-module--v272::after {
    content: "";
    position: absolute;
    inset: auto 18px 16px 18px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(37, 99, 235, .58), rgba(56, 189, 248, .14));
    transform: scaleX(.32);
    transform-origin: left;
    transition: transform .2s ease;
}

.system-module--v272:hover,
.system-module--v272:focus-within {
    border-color: rgba(37, 99, 235, .24);
    transform: translateY(-3px);
    box-shadow: 0 22px 58px rgba(15, 23, 42, .09);
}

.system-module--v272:hover::after,
.system-module--v272:focus-within::after {
    transform: scaleX(1);
}

.system-module--v272 .system-module__outcome {
    border-top-style: dashed;
}

.packages-section--v272 {
    padding-top: clamp(52px, 6.2vw, 84px);
}

.packages-stage--v272::before {
    content: "";
    position: absolute;
    top: 128px;
    right: max(18px, 6vw);
    left: max(18px, 6vw);
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(125, 211, 252, .36), transparent);
    pointer-events: none;
}

.level-grid--v272 {
    position: relative;
    gap: 20px;
}

.level-card--v272 {
    position: relative;
    overflow: hidden;
    border-radius: 24px;
}

.level-card--v272::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: linear-gradient(90deg, rgba(125, 211, 252, .72), rgba(37, 99, 235, .16));
    opacity: .62;
}

.level-card--v272:hover,
.level-card--v272:focus-within,
.level-card--v272.has-open-details {
    border-color: rgba(125, 211, 252, .66);
    box-shadow: 0 28px 90px rgba(0, 0, 0, .27);
}

.level-card--v272.has-open-details .level-card__details {
    box-shadow: inset 0 0 0 1px rgba(125, 211, 252, .22);
}

.level-card--v272 .level-card__details summary {
    min-height: 46px;
}

.level-card--v272 .level-card__features li::before {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-right: 8px;
    border-radius: 999px;
    background: currentColor;
    opacity: .72;
    vertical-align: middle;
}

.ai-widget-section--v272 {
    padding-top: clamp(54px, 6vw, 82px);
}

.ai-advisor-wrap--v272 {
    position: relative;
}

.ai-advisor-wrap--v272::before {
    content: "";
    position: absolute;
    top: 46%;
    right: 24px;
    left: 24px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(37, 99, 235, .18), transparent);
    pointer-events: none;
}

.ai-scenario-grid--v272 {
    position: relative;
}

.ai-scenario-card--v272 {
    position: relative;
    overflow: hidden;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease;
}

.ai-scenario-card--v272::after {
    content: "";
    position: absolute;
    inset: auto 16px 14px 16px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, #2563eb, #38bdf8);
    opacity: 0;
    transform: scaleX(.3);
    transform-origin: left;
    transition: opacity .18s ease, transform .18s ease;
}

.ai-scenario-card--v272.is-active,
.ai-scenario-card--v272:hover,
.ai-scenario-card--v272:focus-within {
    border-color: rgba(37, 99, 235, .28);
    transform: translateY(-2px);
    box-shadow: 0 22px 58px rgba(15, 23, 42, .09);
}

.ai-scenario-card--v272.is-active::after,
.ai-scenario-card--v272:hover::after,
.ai-scenario-card--v272:focus-within::after {
    opacity: 1;
    transform: scaleX(1);
}

.projects-section--v272 {
    padding-top: clamp(54px, 6vw, 84px);
}

.project-card--v272 {
    overflow: hidden;
    border-radius: 22px;
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.project-card--v272:hover,
.project-card--v272:focus-within,
.project-card--v272.is-active {
    transform: translateY(-3px);
    border-color: rgba(56, 189, 248, .42);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .16);
}

.project-card--v272.is-active {
    outline: 0;
    box-shadow: 0 0 0 3px rgba(125, 211, 252, .32), 0 24px 70px rgba(15, 23, 42, .18);
}

.project-card--v272 .project-media {
    background: #e2e8f0;
}

.project-card--v272 .project-card__actions {
    border-top: 1px solid rgba(15, 23, 42, .08);
}

.project-spotlight--v272 {
    opacity: 0;
    transform: translateY(8px);
    transition: opacity .22s ease, transform .22s ease, border-color .22s ease;
}

.project-spotlight--v272.is-open {
    opacity: 1;
    transform: translateY(0);
    border-color: rgba(37, 99, 235, .24);
}

.project-spotlight--v272 .project-spotlight__close:hover,
.project-spotlight--v272 .project-spotlight__close:focus-visible {
    border-color: rgba(37, 99, 235, .25);
    color: #1d4ed8;
}

.use-cases-section--v272 {
    background:
        linear-gradient(90deg, rgba(37, 99, 235, .055) 1px, transparent 1px),
        linear-gradient(180deg, #edf4fb 0%, #f9fbff 100%);
    background-size: 90px 100%, auto;
}

.use-case-card--v272 {
    position: relative;
    overflow: hidden;
}

.use-case-card--v272::before {
    content: "";
    position: absolute;
    top: 16px;
    right: 16px;
    width: 30px;
    height: 1px;
    background: rgba(37, 99, 235, .22);
}

.use-case-card--v272:hover,
.use-case-card--v272:focus-within {
    border-color: rgba(37, 99, 235, .26);
}

.process-section--v272 {
    background:
        linear-gradient(90deg, rgba(125, 211, 252, .08) 1px, transparent 1px),
        linear-gradient(135deg, #0b1727 0%, #13243a 100%);
    background-size: 94px 100%, auto;
}

.process-step--v272 .process-step__number {
    transition: transform .18s ease, box-shadow .18s ease;
}

.process-step--v272:hover .process-step__number,
.process-step--v272:focus-within .process-step__number {
    transform: translateY(-3px);
    box-shadow: 0 18px 46px rgba(56, 189, 248, .32);
}

.process-step--v272 .process-step__content {
    transition: border-color .18s ease, background .18s ease;
}

.process-step--v272:hover .process-step__content,
.process-step--v272:focus-within .process-step__content {
    border-color: rgba(125, 211, 252, .34);
    background: rgba(255, 255, 255, .095);
}

.faq-section--v272 {
    padding-top: clamp(50px, 5.8vw, 78px);
    background:
        linear-gradient(180deg, #f8fbff 0%, #eef4fb 100%);
}

.faq-list--v272 {
    display: grid;
    gap: 10px;
}

.faq-item--v272 {
    border: 1px solid rgba(37, 99, 235, .11);
    border-radius: 18px;
    background: rgba(255, 255, 255, .88);
    box-shadow: 0 14px 38px rgba(15, 23, 42, .045);
}

.faq-item--v272[open] {
    border-color: rgba(37, 99, 235, .24);
}

.faq-item--v272 summary {
    padding: 18px 20px;
}

.faq-item--v272 .faq-item__content {
    padding: 0 20px 18px;
}

.contact-section--v272 .contact-conversion {
    border-radius: 26px;
}

.contact-section--v272 .contact-helper__list li,
.contact-section--v272 .contact-response-card li,
.contact-section--v272 .contact-channel {
    transition: border-color .18s ease, transform .18s ease, background .18s ease;
}

.contact-section--v272 .contact-helper__list li:hover,
.contact-section--v272 .contact-response-card li:hover,
.contact-section--v272 .contact-channel:hover,
.contact-section--v272 .contact-channel:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(37, 99, 235, .22);
}

.site-footer--v272 {
    position: relative;
}

.site-footer--v272::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(125, 211, 252, .34), transparent);
}

.site-footer--v272 .site-footer__links a,
.site-footer--v272 .site-footer__contact-list a {
    text-underline-offset: 4px;
}

.site-footer--v272 .site-footer__links a:hover,
.site-footer--v272 .site-footer__contact-list a:hover,
.site-footer--v272 .site-footer__links a:focus-visible,
.site-footer--v272 .site-footer__contact-list a:focus-visible {
    color: #bae6fd;
    text-decoration: underline;
}

.scroll-top {
    transition: opacity .18s ease, transform .18s ease, border-color .18s ease;
}

.scroll-top.is-visible {
    transform: translateY(0);
}

.scroll-top:hover,
.scroll-top:focus-visible {
    border-color: rgba(255, 255, 255, .68);
    transform: translateY(-2px);
}

.services-page--v272 .services-page__hero {
    position: relative;
}

.services-page--v272 .services-page__hero::after {
    content: "";
    display: block;
    width: min(220px, 40%);
    height: 2px;
    margin-top: 18px;
    border-radius: 999px;
    background: linear-gradient(90deg, #2563eb, rgba(56, 189, 248, .18));
}

.services-page__item--v272 {
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.services-page__item--v272:hover,
.services-page__item--v272:focus-within {
    transform: translateY(-3px);
    border-color: rgba(37, 99, 235, .22);
    box-shadow: 0 22px 58px rgba(15, 23, 42, .08);
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

@media (max-width: 1180px) {
    .hero--v272 .hero__grid--v272 {
        grid-template-columns: 1fr;
    }

    .packages-stage--v272::before,
    .ai-advisor-wrap--v272::before {
        display: none;
    }
}

@media (max-width: 760px) {
    .site-header--v272 .site-header__inner {
        min-height: 58px;
    }

    .hero--v272 {
        padding-top: 34px;
    }

    .hero--v272 .hero__actions {
        align-items: stretch;
    }

    .hero--v272 .hero__actions .btn {
        width: 100%;
    }

    .system-module--v272:hover,
    .system-module--v272:focus-within,
    .project-card--v272:hover,
    .project-card--v272:focus-within,
    .project-card--v272.is-active {
        transform: none;
    }

    .faq-item--v272 summary {
        padding: 16px;
    }

    .faq-item--v272 .faq-item__content {
        padding: 0 16px 16px;
    }
}

/* VNTech 2.7.3 - final cascade guard for the light reference direction */
.site-header--v272.site-header--v273,
.site-header--v272.site-header--v273.is-scrolled {
    background: transparent;
    box-shadow: none;
}

.site-header--v273 .site-header__inner {
    min-height: 70px;
    gap: clamp(14px, 2vw, 30px);
    padding: 10px 18px 10px 24px;
    border: 1px solid rgba(148, 163, 184, .22);
    border-radius: 28px;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 18px 52px rgba(15, 23, 42, .08);
}

.site-header--v273 .site-nav__menu > li > a {
    color: #07122b;
    font-weight: 900;
}

.site-header--v273 .site-nav__menu > li > a:hover,
.site-header--v273 .site-nav__menu > li > a:focus-visible,
.site-header--v273 .site-nav__menu > li > a.is-active,
.site-header--v273 .site-nav__menu > li > a[aria-current="true"] {
    color: #174eea;
}

.site-header--v273 .site-brand__mark {
    display: grid !important;
}

.site-header--v273 .site-header__cta {
    min-height: 54px;
    padding: 0 28px;
    border-radius: 12px;
    background: linear-gradient(135deg, #0b4cff, #133bd8);
    color: #fff;
    box-shadow: 0 14px 28px rgba(37, 99, 235, .25);
}

.hero--v272.hero--v273 {
    min-height: 0;
    padding: 34px 0 46px;
    background:
        radial-gradient(circle at 80% 16%, rgba(37, 99, 235, .13), transparent 32%),
        radial-gradient(circle at 36% 58%, rgba(96, 165, 250, .14), transparent 34%),
        linear-gradient(180deg, #f8fbff 0%, #eef5ff 100%);
    color: #07122b;
}

.hero--v272.hero--v273::before {
    opacity: 1;
    background:
        radial-gradient(circle, rgba(37, 99, 235, .24) 1px, transparent 1.5px) 48% 8% / 18px 18px,
        linear-gradient(125deg, transparent 52%, rgba(255, 255, 255, .92) 52.4%, transparent 52.8%),
        linear-gradient(154deg, transparent 58%, rgba(37, 99, 235, .11) 58.4%, transparent 58.8%);
}

.hero--v272.hero--v273::after {
    right: -140px;
    bottom: 110px;
    width: 720px;
    height: 360px;
    background: radial-gradient(ellipse at center, rgba(37, 99, 235, .18), transparent 68%);
}

.hero--v273 .hero__grid--v273 {
    grid-template-columns: minmax(0, .92fr) minmax(560px, 1.08fr);
    gap: 52px;
}

.hero--v273 .hero__content--v273 h1 {
    max-width: 680px;
    color: #07122b;
    font-size: 60px;
    line-height: 1.12;
    letter-spacing: 0;
}

.hero--v273 .hero__content--v273 h1 mark {
    color: #1556f0;
}

.hero--v272.hero--v273 .hero__text {
    max-width: 660px;
    margin-top: 24px;
    color: #475569;
    font-size: 19px;
    line-height: 1.75;
}

.hero--v272.hero--v273 .hero__actions {
    gap: 18px;
    margin-top: 30px;
}

.hero--v272.hero--v273 .hero__actions .btn {
    width: auto;
    min-height: 58px;
    padding: 0 28px;
    border-radius: 12px;
}

.hero--v272.hero--v273 .hero__actions .btn--secondary {
    border-color: rgba(37, 99, 235, .62);
    background: rgba(255, 255, 255, .82);
    color: #0b4cff;
}

.hero--v272.hero--v273 .proof-row--v273 span {
    border: 0;
    border-right: 1px solid rgba(148, 163, 184, .28);
    background: transparent;
    box-shadow: none;
    color: #07122b;
}

.hero--v272.hero--v273 .proof-row--v273 span:last-child {
    border-right: 0;
}

.services-section--v272,
.use-cases-section--v272,
.faq-section--v272 {
    background: linear-gradient(180deg, #f8fbff 0%, #eef5ff 100%);
    background-size: auto;
}

.packages-section--v272,
.ai-widget-section--v272,
.projects-section--v272,
.process-section--v272 {
    background:
        radial-gradient(circle at 82% 12%, rgba(37, 99, 235, .10), transparent 28%),
        linear-gradient(180deg, #f8fbff 0%, #eef5ff 100%);
    background-size: auto;
    color: #07122b;
}

.packages-section--v272 .section-heading h2,
.packages-section--v272 .section-heading p:not(.eyebrow),
.ai-widget-section--v272 .section-heading h2,
.ai-widget-section--v272 .section-heading p:not(.eyebrow),
.projects-section--v272 .section-heading h2,
.projects-section--v272 .section-heading p:not(.eyebrow),
.process-section--v272 .section-heading h2,
.process-section--v272 .section-heading p:not(.eyebrow) {
    color: #07122b;
}

.packages-stage--v272 {
    border: 1px solid rgba(37, 99, 235, .11);
    border-radius: 30px;
    background: linear-gradient(135deg, rgba(7, 17, 31, .96), rgba(12, 30, 55, .94));
    color: #fff;
    box-shadow: 0 26px 72px rgba(15, 23, 42, .13);
}

.packages-stage--v272 .section-heading h2,
.packages-stage--v272 .section-heading p:not(.eyebrow) {
    color: #fff;
}

.process-step--v272 .process-step__content {
    border-color: rgba(37, 99, 235, .12);
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 18px 48px rgba(15, 23, 42, .06);
}

.process-step--v272 h3 {
    color: #07122b;
}

.process-step--v272 p {
    color: #475569;
}

@media (max-width: 1280px) {
    .hero--v273 .hero__grid--v273 {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .site-header--v273 .site-header__inner {
        min-height: 62px;
        padding: 8px 10px 8px 14px;
        border-radius: 20px;
    }

    .hero--v272.hero--v273 {
        padding-top: 24px;
    }

    .hero--v273 .hero__content--v273 h1 {
        font-size: 42px;
    }

    .hero--v272.hero--v273 .hero__text {
        font-size: 17px;
    }
}

@media (max-width: 760px) {
    .hero--v272.hero--v273 .hero__actions .btn {
        width: 100%;
    }

    .hero--v272.hero--v273 .proof-row--v273 span {
        border-right: 0;
    }
}

/* VNTech 2.7.4 - final compact scale, AI layout, and freeze QA polish */
.site-main {
    background:
        radial-gradient(circle at 86% 0%, rgba(37, 99, 235, .075), transparent 30%),
        linear-gradient(180deg, #f7fbff 0%, #eef5ff 44%, #f8fbff 100%);
}

.section {
    padding: clamp(40px, 4.8vw, 64px) 0;
}

.section-heading {
    max-width: 720px;
    margin-bottom: 18px;
}

.section-heading h2 {
    font-size: 42px;
    line-height: 1.08;
}

.section-heading p:not(.eyebrow) {
    max-width: 640px;
    font-size: 15px;
    line-height: 1.58;
}

.btn {
    min-height: 48px;
    padding: 0 20px;
    border-radius: 12px;
}

.site-header--v274 {
    padding: 14px max(14px, env(safe-area-inset-left)) 6px;
}

.site-header--v274 .site-header__inner {
    width: min(100%, 1500px);
    min-height: 62px;
    padding: 8px 16px 8px 18px;
    border-radius: 24px;
}

.site-header--v274 .site-brand__mark,
.site-footer--v274 .site-footer__mark {
    width: 40px;
    height: 40px;
    border-radius: 12px;
}

.site-header--v274 .site-brand__logo img {
    max-height: 36px;
}

.site-header--v274 .site-brand__text strong {
    font-size: 22px;
}

.site-header--v274 .site-brand__text small {
    font-size: 12px;
}

.site-header--v274 .site-nav__menu > li > a {
    font-size: 14px;
}

.site-header--v274 .site-header__cta {
    min-height: 48px;
    padding: 0 24px;
}

.hero--v272.hero--v273.hero--v274 {
    padding: 24px 0 36px;
    background:
        radial-gradient(circle at 80% 12%, rgba(37, 99, 235, .10), transparent 29%),
        radial-gradient(circle at 34% 58%, rgba(96, 165, 250, .11), transparent 31%),
        linear-gradient(180deg, #f8fbff 0%, #eef5ff 100%);
}

.hero--v274::before {
    opacity: .72;
    background:
        radial-gradient(circle, rgba(37, 99, 235, .18) 1px, transparent 1.4px) 48% 8% / 22px 22px,
        linear-gradient(154deg, transparent 58%, rgba(37, 99, 235, .08) 58.4%, transparent 58.8%);
}

.hero--v274 .hero__grid--v273 {
    grid-template-columns: minmax(0, .94fr) minmax(500px, 1fr);
    gap: 40px;
}

.hero-reference-badge {
    margin-bottom: 22px;
    padding: 10px 14px;
}

.hero--v273.hero--v274 .hero__content--v273 h1 {
    max-width: 620px;
    font-size: 54px;
    line-height: 1.1;
}

.hero--v272.hero--v273.hero--v274 .hero__text {
    max-width: 600px;
    margin-top: 18px;
    font-size: 17px;
    line-height: 1.62;
}

.hero--v272.hero--v273.hero--v274 .hero__actions {
    gap: 14px;
    margin-top: 24px;
}

.hero--v272.hero--v273.hero--v274 .hero__actions .btn {
    min-height: 50px;
    padding: 0 24px;
}

.proof-row--v273 {
    gap: 14px;
    margin-top: 22px;
}

.proof-row--v273 span {
    grid-template-columns: 34px 1fr;
    gap: 4px 10px;
    padding-right: 14px;
}

.proof-row--v273 i {
    width: 34px;
    height: 34px;
}

.proof-row--v273 svg {
    width: 18px;
    height: 18px;
}

.proof-row--v273 strong {
    font-size: 14px;
}

.proof-row--v273 small {
    font-size: 12px;
}

.hero-dashboard--v273 {
    min-height: 500px;
}

.hero-dashboard__shell {
    min-height: 456px;
    padding: 28px;
    border-radius: 26px;
}

.hero-dashboard__content {
    width: 56%;
    padding-top: 34px;
}

.hero-dashboard__copy h2 {
    font-size: 28px;
}

.hero-dashboard__stats {
    gap: 8px;
    margin-top: 22px;
}

.hero-dashboard__stats span {
    padding: 12px 10px;
}

.hero-dashboard__table {
    margin-top: 18px;
    padding: 12px;
}

.hero-ai-card--v273 {
    top: 116px;
    right: 16px;
    width: 232px;
    padding: 17px;
    border-radius: 20px;
}

.hero-ai-card--v273 p {
    margin: 12px 0;
}

.hero-ai-card--v273 li {
    padding: 8px 9px;
}

.hero-service-strip--v273 {
    margin-top: 22px;
    padding: 20px;
    border-radius: 22px;
}

.hero-service-strip--v273 article {
    grid-template-columns: 52px 1fr;
    gap: 12px;
    padding: 0 16px;
}

.hero-service-strip--v273 .icon-badge {
    width: 48px;
    height: 48px;
}

.hero-service-strip--v273 .icon-badge svg {
    width: 24px;
    height: 24px;
}

.hero-service-strip--v273 h3 {
    font-size: 15px;
}

.hero-service-strip--v273 p {
    margin-top: 6px;
    font-size: 12px;
    line-height: 1.48;
}

.services-section--v272,
.use-cases-section--v272,
.faq-section--v272 {
    background:
        linear-gradient(180deg, #f8fbff 0%, #f1f6fd 100%);
}

.system-module-grid--v272,
.use-case-grid--v272,
.project-grid--v272,
.process-steps--v272 {
    gap: 14px;
}

.system-module--v272 {
    min-height: 0;
    border-radius: 18px;
}

.system-module--v25 {
    padding: 20px;
}

.system-module--primary {
    min-height: 238px;
}

.icon-badge--large {
    width: 50px;
    height: 50px;
}

.packages-section--v272,
.projects-section--v272,
.process-section--v272 {
    padding-top: clamp(42px, 5vw, 66px);
}

.packages-stage--v272 {
    padding: 40px;
    border-radius: 26px;
}

.level-grid--v272 {
    gap: 16px;
}

.level-card--v272 {
    border-radius: 20px;
}

.level-card--v26 {
    gap: 14px;
    padding: 20px;
}

.level-card--v26 .level-card__pricing {
    padding: 14px;
    border-radius: 16px;
}

.level-card--v26 .level-card__pricing strong {
    font-size: 34px;
}

.level-card--v272 .level-card__details summary {
    min-height: 42px;
}

.ai-widget-section--v274 {
    padding-top: clamp(42px, 4.8vw, 64px);
    padding-bottom: clamp(42px, 4.8vw, 64px);
    background:
        radial-gradient(circle at 15% 10%, rgba(37, 99, 235, .09), transparent 27%),
        linear-gradient(180deg, #f8fbff 0%, #eef5ff 100%);
    color: #07122b;
}

.ai-widget-section--v274 .section-heading h2,
.ai-widget-section--v274 .section-heading p:not(.eyebrow) {
    color: #07122b;
}

.ai-advisor-wrap--v274 {
    position: relative;
    padding: 34px;
    border: 1px solid rgba(37, 99, 235, .11);
    border-radius: 26px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .96), rgba(246, 250, 255, .92));
    box-shadow: 0 22px 60px rgba(15, 23, 42, .07);
}

.ai-advisor-wrap--v274::before {
    display: none;
}

.ai-advisor-header--v274 {
    grid-template-columns: minmax(0, 1fr) minmax(240px, 320px);
    gap: 20px;
    align-items: end;
    margin-bottom: 18px;
}

.ai-advisor-header--v274 .section-heading {
    margin-bottom: 0;
}

.ai-advisor-action {
    justify-items: end;
}

.ai-advisor-action p {
    max-width: 300px;
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    text-align: right;
}

.ai-advisor-demo--v274 {
    display: grid;
    grid-template-columns: minmax(250px, .34fr) minmax(0, 1fr);
    gap: 16px;
    align-items: stretch;
}

.ai-advisor-note--v274 {
    display: grid;
    align-content: start;
    gap: 12px;
    min-height: 0;
    margin: 0;
    padding: 20px;
    border: 1px solid rgba(37, 99, 235, .13);
    border-radius: 20px;
    background:
        radial-gradient(circle at 88% 12%, rgba(37, 99, 235, .14), transparent 34%),
        #fff;
    box-shadow: none;
}

.ai-advisor-note__label {
    display: inline-flex;
    width: fit-content;
    padding: 6px 9px;
    border: 1px solid rgba(37, 99, 235, .14);
    border-radius: 999px;
    background: #eff6ff;
    color: #174eea;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ai-advisor-note--v274 strong {
    color: #07122b;
    font-size: 22px;
    line-height: 1.16;
}

.ai-advisor-note--v274 p {
    margin: 0;
    color: #475569;
    font-size: 14px;
    line-height: 1.55;
}

.ai-scenario-grid--v274 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.ai-scenario-card--v274 {
    gap: 9px;
    min-height: 0;
    padding: 18px;
    border: 1px solid rgba(37, 99, 235, .12);
    border-radius: 18px;
    background: rgba(255, 255, 255, .92);
    box-shadow: none;
}

.ai-scenario-card--v274.is-active {
    background:
        radial-gradient(circle at 88% 10%, rgba(56, 189, 248, .14), transparent 34%),
        #fff;
}

.ai-scenario-card--v274 .icon-badge {
    width: 40px;
    height: 40px;
}

.ai-scenario-card--v274 h3 {
    font-size: 17px;
    line-height: 1.22;
}

.ai-scenario-card--v274 .ai-scenario-card__answer {
    color: #1d4ed8;
    font-size: 14px;
}

.ai-scenario-card--v274 .ai-scenario-card__note {
    color: #64748b;
    font-size: 12px;
    line-height: 1.45;
}

.ai-capability-chips--v274 {
    margin-top: 14px;
}

.ai-capability-chips--v274 span {
    padding: 7px 10px;
    font-size: 12px;
}

.use-cases-section--v272 {
    background:
        linear-gradient(180deg, #f1f6fd 0%, #f8fbff 100%);
}

.process-section--v272 {
    background:
        radial-gradient(circle at 84% 8%, rgba(37, 99, 235, .08), transparent 24%),
        linear-gradient(180deg, #f8fbff 0%, #eef5ff 100%);
}

.process-step--v272 .process-step__content {
    padding: 18px;
}

.project-card--v272 {
    border-radius: 18px;
}

.project-card--v26 .project-card__body {
    gap: 10px;
    padding: 16px;
}

.contact-section--v272 {
    background:
        linear-gradient(180deg, #f8fbff 0%, #eef5ff 78%, #07111f 78%, #07111f 100%);
}

.site-footer--v274 .site-footer__grid {
    gap: 30px;
}

.site-footer--v274 .site-footer__inner--patch2 {
    padding-bottom: 112px;
}

.scroll-top {
    right: 22px;
    bottom: 86px;
    width: 46px;
    height: 46px;
    border-radius: 16px;
}

@media (max-width: 1280px) {
    .hero--v274 .hero__grid--v273,
    .ai-advisor-demo--v274 {
        grid-template-columns: 1fr;
    }

    .hero-dashboard--v273 {
        max-width: 760px;
        min-height: 0;
    }

    .hero-service-strip--v273 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ai-scenario-grid--v274 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .section {
        padding: 38px 0;
    }

    .section-heading h2 {
        font-size: 34px;
    }

    .site-header--v274 {
        padding: 12px 14px 6px;
    }

    .site-header--v274 .site-header__inner {
        min-height: 58px;
        border-radius: 20px;
    }

    .site-header--v274 .site-brand__mark {
        width: 38px;
        height: 38px;
    }

    .hero--v272.hero--v273.hero--v274 {
        padding-top: 22px;
    }

    .hero--v273.hero--v274 .hero__content--v273 h1 {
        font-size: 38px;
    }

    .hero--v272.hero--v273.hero--v274 .hero__text {
        font-size: 16px;
    }

    .hero-dashboard__shell {
        padding: 20px;
        transform: none;
    }

    .hero-dashboard__copy h2 {
        font-size: 24px;
    }

    .hero-service-strip--v273 {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .ai-advisor-wrap--v274 {
        padding: 22px;
        border-radius: 22px;
    }

    .ai-advisor-header--v274 {
        grid-template-columns: 1fr;
    }

    .ai-advisor-action {
        justify-items: stretch;
    }

    .ai-advisor-action p {
        max-width: none;
        text-align: left;
    }

    .ai-scenario-grid--v274 {
        grid-template-columns: 1fr;
    }

    .packages-stage--v272 {
        padding: 24px 16px;
    }
}

@media (max-width: 760px) {
    .section {
        padding: 34px 0;
    }

    .section-heading h2 {
        font-size: 30px;
    }

    .hero-reference-badge {
        margin-bottom: 16px;
    }

    .hero--v273.hero--v274 .hero__content--v273 h1 {
        font-size: 36px;
    }

    .hero--v272.hero--v273.hero--v274 .hero__actions .btn {
        min-height: 48px;
    }

    .proof-row--v273 {
        margin-top: 18px;
    }

    .hero-dashboard__topbar nav {
        gap: 14px;
    }

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

    .hero-dashboard__table {
        display: none;
    }

    .hero-ai-card--v273 {
        padding: 15px;
    }

    .hero-service-strip--v273 article {
        grid-template-columns: 46px 1fr;
        padding-bottom: 14px;
    }

    .hero-service-strip--v273 .icon-badge {
        width: 42px;
        height: 42px;
    }

    .system-module--v25,
    .level-card--v26,
    .ai-scenario-card--v274,
    .use-case-card--v25,
    .process-step--v25 {
        padding: 16px;
    }

    .level-card--v26 .level-card__pricing strong {
        font-size: 28px;
    }

    .ai-advisor-wrap--v274 {
        padding: 16px;
    }

    .ai-advisor-note--v274 {
        padding: 16px;
    }

    .site-footer--v274 .site-footer__inner--patch2 {
        padding-bottom: 126px;
    }

    .scroll-top {
        right: 14px;
        bottom: 70px;
        width: 44px;
        height: 44px;
        border-radius: 15px;
    }
}

/* VNTech 2.7.5 - owner QA corrective polish: deeper surfaces, real mobile layout, widget state safety */
.site-main {
    background:
        linear-gradient(180deg, #eef4fc 0%, #f6f9fd 16%, #eaf1fb 52%, #f4f7fb 100%);
}

.section {
    position: relative;
}

.section--soft,
.services-section--v272,
.use-cases-section--v272,
.faq-section--v272 {
    background:
        linear-gradient(180deg, #edf3fb 0%, #f7faff 48%, #eaf1f9 100%);
}

.packages-section--v272,
.projects-section--v272,
.process-section--v272 {
    background:
        linear-gradient(180deg, #f6f9fd 0%, #eaf1fb 100%);
}

.site-header--v275 {
    padding-top: 12px;
}

.site-header--v275 .site-header__inner {
    border: 1px solid rgba(148, 163, 184, .24);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(247, 250, 255, .94));
    box-shadow: 0 18px 54px rgba(15, 23, 42, .12);
}

.site-header--v275.is-scrolled .site-header__inner {
    box-shadow: 0 16px 40px rgba(15, 23, 42, .14);
}

.site-header--v275 .menu-toggle {
    position: relative;
    width: 42px;
    height: 42px;
    border-radius: 14px;
    background:
        linear-gradient(180deg, #fff, #f4f8ff);
    box-shadow: inset 0 0 0 1px rgba(37, 99, 235, .08);
}

.site-header--v275 .menu-toggle span:not(.screen-reader-text) {
    width: 18px;
    margin: 2px auto;
    border-radius: 999px;
}

.hero--v272.hero--v273.hero--v274.hero--v275 {
    overflow: hidden;
    background:
        linear-gradient(142deg, rgba(255, 255, 255, .96) 0%, rgba(239, 246, 255, .94) 47%, rgba(219, 231, 248, .94) 100%);
}

.hero--v275::before {
    opacity: .58;
    background:
        radial-gradient(circle, rgba(37, 99, 235, .18) 1px, transparent 1.5px) 50% 8% / 22px 22px,
        linear-gradient(154deg, transparent 59%, rgba(37, 99, 235, .075) 59.3%, transparent 60%);
}

.hero--v275 .hero__container--v273 {
    position: relative;
}

.hero--v275 .hero__container--v273::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(37, 99, 235, .22), transparent);
    pointer-events: none;
}

.hero--v275 .hero-reference-badge {
    border-color: rgba(37, 99, 235, .14);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(245, 249, 255, .92));
    box-shadow: 0 14px 34px rgba(15, 23, 42, .07);
}

.hero--v273.hero--v274.hero--v275 .hero__content--v273 h1 {
    color: #061126;
}

.hero--v273.hero--v274.hero--v275 .hero__content--v273 h1 mark {
    color: #1557f0;
    text-shadow: 0 10px 26px rgba(37, 99, 235, .16);
}

.hero--v275 .hero__actions .btn {
    box-shadow: 0 16px 36px rgba(37, 99, 235, .20);
}

.hero--v275 .hero__actions .btn--secondary {
    box-shadow: inset 0 0 0 1px rgba(37, 99, 235, .18), 0 12px 28px rgba(15, 23, 42, .05);
}

.hero--v275 .proof-row--v273 span {
    border-color: rgba(148, 163, 184, .22);
    background: rgba(255, 255, 255, .66);
}

.hero--v275 .hero-dashboard__shell {
    border-color: rgba(148, 163, 184, .26);
    box-shadow: 0 28px 70px rgba(15, 23, 42, .24), inset 0 1px 0 rgba(255, 255, 255, .10);
}

.hero--v275 .hero-dashboard__wave {
    opacity: .86;
}

.hero--v275 .hero-ai-card--v273 {
    box-shadow: 0 22px 46px rgba(15, 23, 42, .20);
}

.hero--v275 .hero-service-strip--v273 {
    border: 1px solid rgba(148, 163, 184, .22);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(247, 250, 255, .92));
    box-shadow: 0 24px 54px rgba(15, 23, 42, .10);
}

.system-module--v272,
.level-card--v272,
.project-card--v272,
.use-case-card--v272,
.faq-item--v272 {
    border-color: rgba(148, 163, 184, .22);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(248, 251, 255, .90));
    box-shadow: 0 14px 34px rgba(15, 23, 42, .055);
}

.system-module--v272 {
    position: relative;
    overflow: hidden;
}

.system-module--v272::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 3px;
    background: linear-gradient(90deg, rgba(37, 99, 235, .80), rgba(14, 165, 233, .32), transparent);
    opacity: .42;
    pointer-events: none;
}

.system-module--v272:hover,
.system-module--v272:focus-within,
.level-card--v272:hover,
.level-card--v272:focus-within,
.project-card--v272:hover,
.project-card--v272:focus-within,
.use-case-card--v272:hover,
.use-case-card--v272:focus-within,
.process-step--v272:hover,
.process-step--v272:focus-within {
    transform: translateY(-3px);
    box-shadow: 0 24px 54px rgba(15, 23, 42, .11);
}

.packages-stage--v272 {
    border: 1px solid rgba(148, 163, 184, .20);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .94), rgba(238, 245, 255, .88));
    box-shadow: 0 26px 64px rgba(15, 23, 42, .09);
}

.level-card--v272.is-recommended {
    border-color: rgba(37, 99, 235, .42);
    background:
        linear-gradient(180deg, #ffffff 0%, #eff6ff 100%);
    box-shadow: 0 28px 66px rgba(37, 99, 235, .15);
}

.level-card--v272.has-open-details {
    border-color: rgba(37, 99, 235, .30);
}

.level-card--v272 .level-card__details summary:focus-visible,
.faq-item--v272 summary:focus-visible,
.project-spotlight__close:focus-visible,
.menu-toggle:focus-visible,
.mobile-drawer__close:focus-visible {
    outline: 3px solid rgba(37, 99, 235, .25);
    outline-offset: 3px;
}

.project-media {
    overflow: hidden;
}

.project-card--v272 .project-card__image {
    transition: transform .28s ease;
}

.project-card--v272:hover .project-card__image,
.project-card--v272:focus-within .project-card__image {
    transform: scale(1.035);
}

.ai-widget-section--v275 {
    background:
        linear-gradient(180deg, #eaf1fb 0%, #f7faff 52%, #e9f1fb 100%);
}

.ai-advisor-wrap--v275 {
    border-color: rgba(148, 163, 184, .22);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .95), rgba(238, 245, 255, .90));
    box-shadow: 0 26px 62px rgba(15, 23, 42, .09);
}

.ai-advisor-note--v275,
.ai-scenario-card--v275 {
    border-color: rgba(148, 163, 184, .22);
    background:
        linear-gradient(180deg, #fff, #f5f9ff);
}

.ai-scenario-card--v275 {
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.ai-scenario-card--v275:hover,
.ai-scenario-card--v275:focus-within,
.ai-scenario-card--v275.is-active {
    transform: translateY(-2px);
    border-color: rgba(37, 99, 235, .28);
    box-shadow: 0 18px 36px rgba(37, 99, 235, .10);
}

.process-step--v272 {
    border-color: rgba(148, 163, 184, .22);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .94), rgba(241, 246, 253, .92));
}

.contact-section--v272 {
    background:
        linear-gradient(180deg, #eaf1fb 0%, #f7faff 68%, #07111f 68%, #07111f 100%);
}

.contact-section--v272 .contact-conversion {
    border-color: rgba(148, 163, 184, .24);
    box-shadow: 0 28px 72px rgba(15, 23, 42, .12);
}

.site-footer--v275 {
    background:
        linear-gradient(180deg, #07111f 0%, #050d19 100%);
}

.site-footer--v275 .site-footer__inner--patch2 {
    padding-bottom: 82px;
}

.scroll-top {
    z-index: 100020;
    box-shadow: 0 14px 30px rgba(15, 23, 42, .24);
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease, box-shadow .18s ease;
}

.scroll-top:hover,
.scroll-top:focus-visible {
    box-shadow: 0 18px 40px rgba(37, 99, 235, .28);
}

.mobile-backdrop {
    background: rgba(3, 9, 22, .56);
    backdrop-filter: blur(8px);
}

.mobile-drawer {
    border: 1px solid rgba(148, 163, 184, .22);
    background:
        linear-gradient(180deg, #ffffff 0%, #f5f8ff 62%, #edf4ff 100%);
    box-shadow: -22px 0 60px rgba(15, 23, 42, .24);
}

.mobile-drawer__close {
    min-height: 42px;
    color: #061126;
    background:
        linear-gradient(180deg, #f7faff, #eaf2ff);
}

.mobile-menu a {
    display: flex;
    align-items: center;
    min-height: 38px;
    color: #101827;
}

.mobile-menu a:hover,
.mobile-menu a:focus-visible,
.mobile-menu a.is-active {
    color: #1557f0;
}

.mobile-drawer .btn {
    min-height: 48px;
    box-shadow: 0 16px 34px rgba(37, 99, 235, .18);
}

.mobile-drawer__contact a {
    color: #475569;
}

@media (max-width: 1180px) {
    .hero--v275 .hero__grid--v273 {
        gap: 28px;
    }

    .hero--v275 .hero-dashboard--v273 {
        justify-self: center;
        width: min(100%, 760px);
    }
}

@media (max-width: 900px) {
    .site-header--v275 {
        padding: 10px 14px 6px;
    }

    .hero--v272.hero--v273.hero--v274.hero--v275 {
        padding-top: 16px;
        padding-bottom: 28px;
    }

    .hero--v275 .hero__grid--v273 {
        gap: 24px;
    }

    .hero--v273.hero--v274.hero--v275 .hero__content--v273 h1 {
        max-width: 560px;
        font-size: 37px;
    }

    .hero--v275 .hero-dashboard--v273 {
        margin-top: 4px;
    }

    .hero--v275 .hero-dashboard__shell {
        min-height: 350px;
        padding: 22px;
        transform: none;
    }

    .hero--v275 .hero-dashboard__content {
        width: min(100%, 430px);
        padding-top: 26px;
    }

    .hero--v275 .hero-ai-card--v273 {
        top: auto;
        right: 18px;
        bottom: 18px;
        width: min(250px, 42vw);
    }

    .hero--v275 .hero-service-strip--v273 {
        margin-top: 18px;
    }

    .ai-advisor-wrap--v275 {
        box-shadow: 0 20px 46px rgba(15, 23, 42, .09);
    }
}

@media (max-width: 760px) {
    .site-main {
        background:
            linear-gradient(180deg, #eaf1fb 0%, #f7faff 28%, #edf3fb 100%);
    }

    .section {
        padding: 30px 0;
    }

    .section-heading {
        margin-bottom: 16px;
    }

    .section-heading h2 {
        font-size: 28px;
        line-height: 1.12;
    }

    .site-header--v275 {
        padding: 10px 14px 6px;
    }

    .site-header--v275 .site-header__inner {
        min-height: 56px;
        padding: 8px 12px;
        border-radius: 19px;
    }

    .site-header--v275 .site-brand {
        gap: 10px;
    }

    .site-header--v275 .site-brand__mark {
        width: 36px;
        height: 36px;
        border-radius: 11px;
    }

    .site-header--v275 .site-brand__text strong {
        font-size: 22px;
    }

    .site-header--v275 .site-brand__text small {
        display: none;
    }

    .site-header--v275 .menu-toggle {
        width: 40px;
        height: 40px;
        border-radius: 14px;
    }

    .mobile-drawer {
        top: 10px;
        right: 10px;
        bottom: auto;
        left: auto;
        width: min(370px, calc(100vw - 20px));
        height: auto;
        max-height: calc(100vh - 20px);
        padding: 18px;
        border-radius: 24px;
        overflow: auto;
        transform: translateX(calc(100% + 18px));
    }

    .mobile-drawer.is-open {
        transform: none;
    }

    .mobile-menu {
        gap: 8px;
        margin: 20px 0;
    }

    .mobile-menu a {
        min-height: 36px;
        font-size: 17px;
    }

    .mobile-drawer__contact {
        margin-top: 14px;
        padding-top: 14px;
        border-top: 1px solid rgba(148, 163, 184, .22);
    }

    .hero--v272.hero--v273.hero--v274.hero--v275 {
        padding-top: 14px;
        padding-bottom: 22px;
    }

    .hero--v275 .hero-reference-badge {
        width: fit-content;
        max-width: 100%;
        margin-bottom: 14px;
        padding: 9px 12px;
    }

    .hero--v275 .hero-reference-badge small {
        display: none;
    }

    .hero--v273.hero--v274.hero--v275 .hero__content--v273 h1 {
        font-size: 34px;
        line-height: 1.12;
    }

    .hero--v272.hero--v273.hero--v274.hero--v275 .hero__text {
        margin-top: 14px;
        font-size: 15.5px;
        line-height: 1.58;
    }

    .hero--v272.hero--v273.hero--v274.hero--v275 .hero__actions {
        gap: 10px;
        margin-top: 20px;
    }

    .hero--v272.hero--v273.hero--v274.hero--v275 .hero__actions .btn {
        width: 100%;
        min-height: 48px;
    }

    .hero--v275 .proof-row--v273 {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
        margin-top: 18px;
    }

    .hero--v275 .proof-row--v273 span {
        grid-template-columns: 32px 1fr;
        padding: 8px 0;
        border-right: 0;
        background: transparent;
        box-shadow: none;
    }

    .hero--v275 .hero-dashboard--v273 {
        width: 100%;
        margin-top: 20px;
        min-height: 0;
    }

    .hero--v275 .hero-dashboard__shell {
        min-height: 306px;
        padding: 20px;
        border-radius: 24px;
    }

    .hero--v275 .hero-dashboard__topbar {
        gap: 14px;
    }

    .hero--v275 .hero-dashboard__topbar nav {
        gap: 12px;
        overflow: hidden;
    }

    .hero--v275 .hero-dashboard__topbar nav span {
        font-size: 12px;
        white-space: nowrap;
    }

    .hero--v275 .hero-dashboard__content {
        width: 100%;
        max-width: 330px;
        padding-top: 24px;
    }

    .hero--v275 .hero-dashboard__copy h2 {
        max-width: 260px;
        font-size: 25px;
    }

    .hero--v275 .hero-dashboard__copy p {
        max-width: 220px;
        font-size: 14px;
    }

    .hero--v275 .hero-dashboard__stats {
        width: 100%;
        max-width: 260px;
        gap: 8px;
        margin-top: 18px;
    }

    .hero--v275 .hero-dashboard__stats span {
        min-width: 0;
        padding: 10px 7px;
    }

    .hero--v275 .hero-dashboard__stats strong {
        font-size: 17px;
    }

    .hero--v275 .hero-dashboard__stats small {
        font-size: 10px;
        overflow-wrap: anywhere;
    }

    .hero--v275 .hero-dashboard__wave {
        right: -28%;
        bottom: 14%;
        width: 86%;
        opacity: .64;
    }

    .hero--v275 .hero-ai-card--v273 {
        display: none;
    }

    .hero--v275 .hero-service-strip--v273 {
        margin-top: 16px;
        padding: 12px 14px;
        border-radius: 22px;
    }

    .hero--v275 .hero-service-strip--v273 article {
        grid-template-columns: 42px 1fr;
        gap: 12px;
        padding: 13px 52px 13px 0;
        border-bottom: 1px solid rgba(148, 163, 184, .18);
    }

    .hero--v275 .hero-service-strip--v273 article:last-child {
        padding-bottom: 0;
        border-bottom: 0;
    }

    .hero--v275 .hero-service-strip--v273 h3 {
        font-size: 16px;
    }

    .hero--v275 .hero-service-strip--v273 p {
        font-size: 13px;
    }

    .packages-stage--v272 {
        border-radius: 22px;
        background:
            linear-gradient(180deg, rgba(255, 255, 255, .95), rgba(238, 245, 255, .90));
    }

    .ai-widget-section--v275 {
        padding-top: 32px;
        padding-bottom: 32px;
    }

    .ai-advisor-wrap--v275 {
        padding: 16px;
        border-radius: 22px;
    }

    .ai-advisor-demo--v275 {
        gap: 12px;
    }

    .ai-advisor-note--v275,
    .ai-scenario-card--v275 {
        border-radius: 17px;
    }

    .ai-capability-chips--v275 {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .contact-section--v272 {
        background:
            linear-gradient(180deg, #eaf1fb 0%, #f7faff 58%, #07111f 58%, #07111f 100%);
    }

    .site-footer--v275 .site-footer__inner--patch2 {
        padding-bottom: 76px;
    }

    .scroll-top {
        right: 64px;
        bottom: 14px;
        width: 42px;
        height: 42px;
        border-radius: 15px;
    }
}

@media (max-width: 420px) {
    .hero--v273.hero--v274.hero--v275 .hero__content--v273 h1 {
        font-size: 32px;
    }

    .hero--v275 .hero-dashboard__topbar nav span:nth-child(n+4) {
        display: none;
    }

    .hero--v275 .hero-dashboard__shell {
        min-height: 292px;
    }

    .hero--v275 .hero-dashboard__stats {
        max-width: 246px;
    }

    .mobile-drawer {
        width: calc(100vw - 20px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .system-module--v272,
    .level-card--v272,
    .project-card--v272,
    .use-case-card--v272,
    .process-step--v272,
    .ai-scenario-card--v275,
    .project-card--v272 .project-card__image,
    .scroll-top {
        transition: none;
    }

    .system-module--v272:hover,
    .system-module--v272:focus-within,
    .level-card--v272:hover,
    .level-card--v272:focus-within,
    .project-card--v272:hover,
    .project-card--v272:focus-within,
    .use-case-card--v272:hover,
    .use-case-card--v272:focus-within,
    .process-step--v272:hover,
    .process-step--v272:focus-within,
    .ai-scenario-card--v275:hover,
    .ai-scenario-card--v275:focus-within {
        transform: none;
    }
}

/* VNTech 2.7.6 - EOF cascade guard for live visual QA */
.packages-stage--v272 {
    color: #07122b;
    border-color: rgba(37, 99, 235, .16);
    background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(244, 248, 255, .96));
}

.packages-stage--v272 .section-heading h2,
.packages-stage--v272 .level-card__title,
.packages-stage--v272 .level-card__head h3 {
    color: #061126;
}

.packages-stage--v272 .section-heading p:not(.eyebrow),
.packages-stage--v272 .level-card__head p:not(.eyebrow),
.packages-stage--v272 .level-card__details,
.packages-stage--v272 .level-card__details-body,
.packages-stage--v272 .level-card__details-body p,
.packages-stage--v272 .level-card__disclaimer {
    color: #334155;
}

.packages-stage--v272 .level-card {
    color: #07122b;
    border-color: rgba(148, 163, 184, .30);
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    box-shadow: 0 16px 38px rgba(15, 23, 42, .075);
}

.packages-stage--v272 .level-card.is-recommended {
    border-color: rgba(29, 78, 216, .62);
    background: linear-gradient(180deg, #ffffff, #eef5ff);
}

.packages-stage--v272 .level-card__pricing {
    border-color: rgba(37, 99, 235, .18);
    background: linear-gradient(135deg, #07111f, #0f2340);
}

.packages-stage--v272 .level-card.is-recommended .level-card__pricing {
    background: linear-gradient(135deg, #0b4cff, #0f2d8f);
}

.packages-stage--v272 .level-card__pricing strong {
    color: #ffffff;
}

.packages-stage--v272 .level-card__pricing span {
    color: #dbeafe;
}

.packages-stage--v272 .level-card__details {
    border-color: rgba(148, 163, 184, .30);
    background: #ffffff;
}

.packages-stage--v272 .level-card__details summary {
    color: #0f172a;
    cursor: pointer;
}

.packages-stage--v272 .level-card__details summary::after {
    color: #ffffff;
    background: #1557f0;
}

.packages-section--v272 .pricing-disclaimer--v26 {
    color: #334155;
    background: rgba(255, 255, 255, .92);
}

@media (min-width: 761px) {
    .scroll-top {
        right: 84px !important;
        bottom: 22px !important;
        width: 46px !important;
        height: 46px !important;
        border-radius: 16px !important;
    }
}

.site-footer--v276 .site-footer__inner--patch2 {
    padding-top: 20px;
    padding-bottom: 58px;
}

.site-footer--v276 .site-footer__grid {
    gap: clamp(16px, 3vw, 26px);
}

.site-footer--v276 .site-footer__brand-row {
    margin-bottom: 8px;
}

.site-footer--v276 .site-footer__brand p {
    margin-top: 8px;
    line-height: 1.5;
}

.site-footer--v276 .site-footer__trust {
    margin-top: 10px;
    padding: 6px 10px;
    line-height: 1.28;
}

.site-footer--v276 .site-footer__heading {
    margin-bottom: 10px;
}

.site-footer--v276 .site-footer__links,
.site-footer--v276 .site-footer__contact-list {
    gap: 7px;
}

.site-footer--v276 .site-footer__bottom {
    margin-top: 14px;
    padding-top: 10px;
}

@media (max-width: 760px) {
    .packages-stage--v272 {
        padding: 20px 14px;
    }

    .packages-stage--v272 .level-card {
        padding: 18px;
    }

    .site-footer--v276 .site-footer__inner--patch2 {
        padding-top: 18px;
        padding-bottom: 62px;
    }
}

/* VNTech 2.7.6 - open package details readability guard */
.packages-stage--v272 .level-card .level-card__details[open],
.packages-stage--v272 .level-card.has-open-details .level-card__details {
    color: #334155 !important;
    border-color: rgba(37, 99, 235, .30) !important;
    background: #ffffff !important;
    box-shadow: inset 0 0 0 1px rgba(37, 99, 235, .08) !important;
}

.packages-stage--v272 .level-card .level-card__details[open] summary,
.packages-stage--v272 .level-card.has-open-details .level-card__details summary {
    color: #0f172a !important;
}

.packages-stage--v272 .level-card .level-card__details[open] .level-card__details-body,
.packages-stage--v272 .level-card .level-card__details[open] .level-card__details-body p,
.packages-stage--v272 .level-card.has-open-details .level-card__details-body,
.packages-stage--v272 .level-card.has-open-details .level-card__details-body p,
.packages-stage--v272 .level-card.has-open-details .level-card__disclaimer {
    color: #334155 !important;
}

.packages-stage--v272 .level-card .level-card__orientation,
.packages-stage--v272 .level-card .level-card__features li,
.packages-stage--v272 .level-card .level-card__terms div {
    color: #0f172a !important;
    border-color: rgba(148, 163, 184, .28) !important;
    background: #f8fafc !important;
}

.packages-stage--v272 .level-card .level-card__orientation span,
.packages-stage--v272 .level-card .level-card__terms dt {
    color: #1d4ed8 !important;
}

.packages-stage--v272 .level-card .level-card__orientation strong,
.packages-stage--v272 .level-card .level-card__terms dd {
    color: #0f172a !important;
}

/* VNTech 2.7.7 - mobile hamburger polish only */
.site-header--v277 .menu-toggle {
    position: relative;
    flex: 0 0 44px;
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(148, 163, 184, .34);
    border-radius: 15px;
    background: linear-gradient(180deg, #ffffff 0%, #f6f9ff 100%);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .72), 0 8px 20px rgba(15, 23, 42, .07);
    transform: none;
    -webkit-tap-highlight-color: transparent;
}

.site-header--v277 .menu-toggle span:not(.screen-reader-text) {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 19px;
    height: 2px;
    margin: 0;
    border-radius: 999px;
    background: #061126;
    transform-origin: center;
    transition: transform .18s ease, opacity .18s ease, background .18s ease;
}

.site-header--v277 .menu-toggle span:not(.screen-reader-text):nth-child(1) {
    transform: translate(-50%, calc(-50% - 6px));
}

.site-header--v277 .menu-toggle span:not(.screen-reader-text):nth-child(2) {
    transform: translate(-50%, -50%);
}

.site-header--v277 .menu-toggle span:not(.screen-reader-text):nth-child(3) {
    transform: translate(-50%, calc(-50% + 6px));
}

.site-header--v277 .menu-toggle:hover,
.site-header--v277 .menu-toggle:focus-visible {
    border-color: rgba(37, 99, 235, .34);
    background: linear-gradient(180deg, #ffffff 0%, #eef5ff 100%);
    box-shadow: inset 0 0 0 1px rgba(37, 99, 235, .06), 0 12px 26px rgba(37, 99, 235, .12);
}

.site-header--v277 .menu-toggle:active {
    transform: translateY(1px);
}

.site-header--v277 .menu-toggle[aria-expanded="true"] {
    border-color: rgba(37, 99, 235, .44);
    background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
}

.site-header--v277 .menu-toggle[aria-expanded="true"] span:not(.screen-reader-text):nth-child(1) {
    transform: translate(-50%, -50%) rotate(45deg);
}

.site-header--v277 .menu-toggle[aria-expanded="true"] span:not(.screen-reader-text):nth-child(2) {
    opacity: 0;
}

.site-header--v277 .menu-toggle[aria-expanded="true"] span:not(.screen-reader-text):nth-child(3) {
    transform: translate(-50%, -50%) rotate(-45deg);
}

@media (min-width: 1180px) {
    .site-header--v277 .menu-toggle {
        display: none;
    }
}

@media (max-width: 760px) {
    .site-header--v277 .site-header__inner {
        align-items: center;
    }

    .site-header--v277 .site-header__actions {
        align-items: center;
        flex: 0 0 auto;
    }

    .site-header--v277 .menu-toggle {
        width: 44px;
        min-width: 44px;
        height: 44px;
        min-height: 44px;
        border-radius: 15px;
    }
}

/* VNTech 2.7.8 - package support meta */
.packages-stage--v272 .level-card__support-meta {
    display: grid;
    gap: 7px;
    margin: 2px 0 4px;
}

.packages-stage--v272 .level-card__support-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 34px;
    padding: 7px 10px;
    border: 1px solid rgba(191, 219, 254, .86);
    border-radius: 12px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    color: #10203a;
    font-size: 13px;
    line-height: 1.22;
}

.packages-stage--v272 .level-card__support-row span {
    flex: 0 0 auto;
    color: #64748b;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.packages-stage--v272 .level-card__support-row strong {
    min-width: 0;
    color: #0f172a;
    font-size: 13px;
    font-weight: 900;
    text-align: right;
}

@media (max-width: 760px) {
    .packages-stage--v272 .level-card__support-meta {
        gap: 6px;
    }

    .packages-stage--v272 .level-card__support-row {
        min-height: 32px;
        padding: 7px 9px;
        font-size: 12px;
    }

    .packages-stage--v272 .level-card__support-row span {
        font-size: 9px;
    }

    .packages-stage--v272 .level-card__support-row strong {
        font-size: 12px;
    }
}

/* VNTech 2.7.8 final correction - packages and real AI widget UI */
.packages-stage--v272 .level-grid--v272 {
    width: min(100%, 1120px);
    margin: 26px auto 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    justify-content: center;
    gap: 18px;
}

.packages-stage--v272 .level-card {
    display: grid;
    grid-template-columns: 1fr;
    align-content: start;
    gap: 16px;
    min-height: 0;
    padding: 20px;
}

.packages-stage--v272 .level-card__head {
    min-height: 118px;
}

.packages-stage--v272 .level-card__title {
    line-height: 1.08;
}

.packages-stage--v272 .level-card__pricing {
    min-height: 92px;
    display: grid;
    align-content: center;
}

.packages-stage--v272 .level-card__support-meta {
    gap: 8px;
    margin: 0;
}

.packages-stage--v272 .level-card__support-row {
    min-height: 36px;
    border-color: rgba(37, 99, 235, .24);
    background: rgba(255, 255, 255, .94);
}

.packages-stage--v272 .level-card__details {
    margin-top: 2px;
}

.packages-stage--v272 .level-card__actions {
    align-self: end;
    margin-top: 10px;
}

.packages-section--v272 .pricing-disclaimer--v26 {
    max-width: 760px;
    margin-top: 16px;
    line-height: 1.45;
}

@media (max-width: 1180px) {
    .packages-stage--v272 .level-grid--v272 {
        width: min(100%, 760px);
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .packages-stage--v272 .level-grid--v272 {
        width: min(100%, 370px);
        grid-template-columns: 1fr;
        gap: 16px;
        margin-top: 18px;
    }

    .packages-stage--v272 .level-card {
        padding: 18px;
        gap: 14px;
    }

    .packages-stage--v272 .level-card__head {
        min-height: 0;
    }

    .packages-stage--v272 .level-card__pricing {
        min-height: 82px;
    }

    .packages-stage--v272 .level-card__support-row {
        min-height: 33px;
    }
}

body.vntech-ai-widget-open .scroll-top {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px);
}

/* VNTech final frontend UX acceptance pass */
@media (min-width: 761px) {
    .scroll-top {
        right: 22px !important;
        bottom: 88px !important;
        width: 46px !important;
        height: 46px !important;
        border-radius: 16px !important;
    }
}

@media (max-width: 760px) {
    .scroll-top {
        right: max(18px, env(safe-area-inset-right)) !important;
        bottom: max(84px, calc(env(safe-area-inset-bottom) + 84px)) !important;
        width: 44px !important;
        height: 44px !important;
        border-radius: 15px !important;
    }
}

body.vntech-ai-widget-open .scroll-top {
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateY(10px) !important;
}

.packages-stage--v272 .level-card__details {
    align-self: stretch;
    border-radius: 15px;
}

.packages-stage--v272 .level-card__details summary {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    min-height: 64px;
    padding: 0 16px !important;
    line-height: 1.2;
}

.packages-stage--v272 .level-card__details summary::after {
    display: grid !important;
    place-items: center !important;
    flex: 0 0 28px !important;
    width: 28px !important;
    height: 28px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    line-height: 1 !important;
}

.packages-stage--v272 .level-card__details[open] summary::after {
    transform: rotate(45deg);
}

.packages-stage--v272 .level-card__support-row {
    display: grid;
    grid-template-columns: minmax(82px, .72fr) minmax(0, 1fr);
    align-items: center;
}

.packages-stage--v272 .level-card__support-row strong {
    overflow-wrap: anywhere;
}

.packages-stage--v272 .level-card__actions {
    display: grid;
}

.contact-section--v272 .contact-helper__list {
    align-items: stretch;
}

.contact-section--v272 .contact-helper__list li,
.contact-section--v272 .contact-response-card li,
.contact-section--v272 .contact-channel {
    min-height: 56px;
    display: flex;
    align-items: center;
}

.contact-section--v272 .contact-response-card ol {
    display: grid;
    gap: 10px;
}

.contact-section--v272 .contact-method-card__actions {
    display: grid;
    gap: 10px;
}

.site-footer--v276 {
    margin-top: 0;
}

.site-footer--v276 .site-footer__inner--patch2 {
    padding-bottom: 74px;
}

.project-card--v272,
.project-card--v272:visited {
    color: inherit;
}

.project-card--v272:hover,
.project-card--v272:focus-within,
.project-card--v272.is-hover-ready:hover,
.project-card--v272.is-hover-ready:focus-within {
    transform: translateY(-4px);
    border-color: rgba(37, 99, 235, .36);
    box-shadow: 0 28px 72px rgba(15, 23, 42, .15);
}

.project-card--v272 .project-card__external,
.project-card--v272 .project-card__external:visited {
    color: #1d4ed8;
}

.project-card--v272 .project-card__external:hover,
.project-card--v272 .project-card__external:focus-visible {
    color: #0f172a;
}

/* VNTech homepage/admin regression fix - project proof balance */
.projects-section--v272 {
    overflow: hidden;
}

.project-grid--v272.project-grid--count-4 {
    width: min(100%, 1040px);
    margin-inline: auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.project-card--v272 {
    display: grid;
    grid-template-rows: auto 1fr;
    min-height: 100%;
}

.project-card--v272 .project-media {
    display: block;
    aspect-ratio: 16 / 8.7;
    margin: 0 0 14px;
    border-radius: 18px;
    background:
        radial-gradient(circle at 80% 18%, rgba(96, 165, 250, .24), transparent 30%),
        linear-gradient(135deg, #07111f 0%, #10213a 58%, #1d4ed8 100%);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12);
}

.project-card--v272 .project-card__body {
    display: grid;
    align-content: start;
}

.project-media--placeholder {
    position: relative;
    isolation: isolate;
}

.project-media--placeholder::before {
    content: "";
    position: absolute;
    inset: 18px;
    border: 1px solid rgba(219, 234, 254, .22);
    border-radius: 15px;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, .07) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 255, 255, .07) 1px, transparent 1px);
    background-size: 38px 38px;
    opacity: .9;
    z-index: -1;
}

.project-placeholder--proof {
    min-height: 100%;
    display: grid;
    align-content: end;
    gap: 7px;
    padding: 22px;
    color: #fff;
}

.project-placeholder--proof span,
.project-placeholder--proof small {
    width: fit-content;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 999px;
    background: rgba(255, 255, 255, .09);
    color: #bfdbfe;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    line-height: 1;
    padding: 7px 9px;
    text-transform: uppercase;
}

.project-placeholder--proof strong {
    max-width: 12ch;
    color: #fff;
    font-size: clamp(26px, 3vw, 42px);
    font-weight: 950;
    line-height: .96;
    letter-spacing: 0;
}

.project-placeholder--proof small {
    color: #dbeafe;
    opacity: .9;
}

@media (max-width: 900px) {
    .project-grid--v272.project-grid--count-4 {
        width: min(100%, 520px);
        grid-template-columns: 1fr;
    }

    .project-card--v272 .project-media {
        aspect-ratio: 16 / 9.4;
    }
}

/* VNTech final homepage + AI closure: package details and project spotlight. */
.packages-stage--v272 .level-card .level-card__details[open],
.packages-stage--v272 .level-card.has-open-details .level-card__details {
    border-radius: 18px !important;
    box-shadow: inset 0 0 0 1px rgba(37, 99, 235, .10), 0 14px 34px rgba(15, 23, 42, .05) !important;
}

.packages-stage--v272 .level-grid--v272 {
    align-items: start !important;
}

.packages-stage--v272 .level-card__details-body {
    gap: 10px !important;
    padding: 0 14px 14px !important;
}

.packages-stage--v272 .level-card__details-body > p {
    margin: 0 !important;
    padding: 10px 12px !important;
    border: 1px solid rgba(148, 163, 184, .20);
    border-radius: 13px;
    background: #f8fafc;
    font-size: 13px;
    line-height: 1.42;
}

.packages-stage--v272 .level-card .level-card__orientation {
    gap: 2px;
    padding: 9px 11px !important;
    border-radius: 13px;
}

.packages-stage--v272 .level-card .level-card__features {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px !important;
}

.packages-stage--v272 .level-card .level-card__features li {
    display: flex;
    align-items: center;
    min-height: 31px;
    padding: 7px 9px !important;
    border-radius: 999px !important;
    font-size: 12px;
    line-height: 1.2;
}

.packages-stage--v272 .level-card .level-card__terms {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px !important;
}

.packages-stage--v272 .level-card .level-card__terms div {
    min-height: 52px;
    padding: 8px 9px !important;
    border-radius: 13px !important;
    align-content: start;
}

.packages-stage--v272 .level-card .level-card__terms dt {
    font-size: 10px !important;
    letter-spacing: .06em !important;
}

.packages-stage--v272 .level-card .level-card__terms dd {
    margin-top: 2px !important;
    font-size: 12px;
    line-height: 1.25;
}

.packages-stage--v272 .level-card .level-card__disclaimer {
    margin: 0;
    padding: 9px 11px !important;
    border-radius: 13px;
    font-size: 12px;
    line-height: 1.35;
}

.project-spotlight__panel {
    grid-template-columns: minmax(280px, .88fr) minmax(0, 1.12fr);
    align-items: start;
}

.project-spotlight__media {
    grid-row: 1 / span 2;
    overflow: hidden;
    min-height: 260px;
    border: 1px solid rgba(37, 99, 235, .14);
    border-radius: 20px;
    background:
        radial-gradient(circle at 78% 8%, rgba(37, 99, 235, .16), transparent 32%),
        linear-gradient(135deg, #f8fbff 0%, #eef5ff 100%);
    box-shadow: 0 18px 46px rgba(15, 23, 42, .08);
}

.project-spotlight__image {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 260px;
    object-fit: cover;
    object-position: top center;
}

.project-spotlight__media-fallback {
    min-height: 260px;
    display: grid;
    align-content: end;
    gap: 8px;
    padding: 22px;
    color: #0f172a;
}

.project-spotlight__media-fallback span {
    width: fit-content;
    padding: 6px 9px;
    border-radius: 999px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.project-spotlight__media-fallback strong {
    max-width: 12ch;
    font-size: clamp(26px, 3vw, 40px);
    line-height: .98;
}

.project-spotlight__summary {
    display: grid;
    gap: 12px;
    min-width: 0;
}

@media (max-width: 1180px) {
    .project-spotlight__media {
        grid-row: auto;
        min-height: 220px;
    }

    .project-spotlight__image {
        min-height: 220px;
    }
}

@media (max-width: 760px) {
    .packages-stage--v272 .level-card .level-card__features,
    .packages-stage--v272 .level-card .level-card__terms {
        grid-template-columns: 1fr;
    }

    .project-spotlight__media,
    .project-spotlight__image,
    .project-spotlight__media-fallback {
        min-height: 190px;
    }
}

/* VNTech 2.7.9 - Phase 5 header and mobile menu polish */
.site-header--v279 .site-brand,
.site-header--v279 .site-brand__text,
.site-header--v279 .site-header__actions {
    min-width: 0;
}

.site-header--v279 .site-brand__logo img {
    display: block;
    width: auto;
    max-width: min(160px, 42vw);
    max-height: var(--vn-logo-h, 42px);
    object-fit: contain;
}

.mobile-drawer[aria-hidden="true"] {
    pointer-events: none;
}

.mobile-drawer__close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
}

.mobile-drawer .mobile-menu a {
    min-height: 44px;
    line-height: 1.2;
}

.mobile-drawer__contact a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    overflow-wrap: anywhere;
}

@media (max-width: 760px) {
    .site-header--v279 {
        padding: calc(6px + env(safe-area-inset-top, 0px)) max(10px, env(safe-area-inset-right, 0px)) 5px max(10px, env(safe-area-inset-left, 0px));
    }

    .site-header--v279 .site-header__inner {
        min-height: 54px;
        gap: 10px;
        padding: 5px 10px;
        border-radius: 17px;
    }

    .site-header--v279 .site-brand {
        flex: 1 1 auto;
        gap: 9px;
    }

    .site-header--v279 .site-brand__mark {
        width: 34px;
        height: 34px;
        border-radius: 10px;
    }

    .site-header--v279 .site-brand__logo img {
        max-width: min(132px, 38vw);
        max-height: 34px;
    }

    .site-header--v279 .site-brand__text strong {
        max-width: 42vw;
        overflow: hidden;
        font-size: clamp(18px, 5.2vw, 21px);
        line-height: 1.05;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .site-header--v279 .site-header__actions {
        flex: 0 0 auto;
        gap: 8px;
    }

    .site-header--v279 .menu-toggle {
        flex-basis: 44px;
        width: 44px;
        min-width: 44px;
        height: 44px;
        min-height: 44px;
    }

    .mobile-drawer {
        top: calc(8px + env(safe-area-inset-top, 0px));
        right: calc(8px + env(safe-area-inset-right, 0px));
        width: min(370px, calc(100vw - 16px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px)));
        max-height: calc(100svh - 16px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
        padding: 16px;
        border-radius: 22px;
    }

    .mobile-menu {
        gap: 6px;
        margin: 16px 0;
    }

    .mobile-drawer .mobile-menu a {
        padding: 4px 0;
    }

    .mobile-drawer .btn {
        min-height: 44px;
    }

    .mobile-drawer__contact {
        margin-top: 12px;
        padding-top: 12px;
    }

    .mobile-drawer__contact a {
        min-height: 44px;
    }
}

@supports (height: 100dvh) {
    @media (max-width: 760px) {
        .mobile-drawer {
            max-height: calc(100dvh - 16px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
        }
    }
}

@media (max-width: 360px) {
    .site-header--v279 {
        padding-right: max(8px, env(safe-area-inset-right, 0px));
        padding-left: max(8px, env(safe-area-inset-left, 0px));
    }

    .site-header--v279 .site-header__inner {
        padding-right: 9px;
        padding-left: 9px;
    }

    .site-header--v279 .site-brand__text strong {
        max-width: 39vw;
    }

    .site-header--v279 .site-brand__logo img {
        max-width: min(116px, 36vw);
    }
}

/* VNTech 2.7.11 - Phase 6A homepage visual and Projects UX closure */
:root {
    --vntech-radius-sm: 10px;
    --vntech-radius-md: 14px;
    --vntech-radius-lg: 18px;
    --vntech-radius-xl: 24px;
    --vntech-shadow-sm: 0 8px 22px rgba(15, 23, 42, .06);
    --vntech-shadow-md: 0 16px 42px rgba(15, 23, 42, .10);
    --vntech-shadow-lg: 0 26px 72px rgba(15, 23, 42, .14);
    --vntech-transition-fast: 160ms ease;
    --vntech-transition-normal: 240ms ease;
}

/* VNTech 2.8.0 - Phase 7 homepage sales and premium experience */
:root {
    --vntech-theme-page: #f5f8fc;
    --vntech-theme-soft: #eef4fb;
    --vntech-theme-strong: #071527;
    --vntech-surface: #ffffff;
    --vntech-surface-dark: #0b1728;
    --vntech-text: #0f172a;
    --vntech-text-muted: #526175;
    --vntech-text-on-dark: #edf6ff;
    --vntech-border: rgba(49, 70, 98, 0.14);
    --vntech-border-strong: rgba(37, 99, 235, 0.34);
    --vntech-blue: #2563eb;
    --vntech-blue-dark: #1643a5;
    --vntech-accent-soft: #dbeafe;
    --vntech-radius-sm: 8px;
    --vntech-radius-md: 12px;
    --vntech-radius-lg: 18px;
    --vntech-radius-xl: 28px;
    --vntech-shadow-sm: 0 8px 22px rgba(15, 23, 42, 0.08);
    --vntech-shadow-md: 0 18px 45px rgba(15, 23, 42, 0.12);
    --vntech-shadow-lg: 0 30px 80px rgba(15, 23, 42, 0.18);
    --vntech-space-section: clamp(64px, 8vw, 112px);
    --vntech-space-card: clamp(18px, 2.4vw, 30px);
    --vntech-transition-fast: 160ms ease;
    --vntech-transition-normal: 260ms ease;
    --vntech-transition-slow: 520ms ease;
}

body.vntech-theme {
    background:
        linear-gradient(180deg, #f8fbff 0%, var(--vntech-theme-page) 42%, #ffffff 100%);
    color: var(--vntech-text);
}

.anchor-alias {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    scroll-margin-top: calc(var(--vn-header-height, 76px) + 24px);
}

.section {
    scroll-margin-top: calc(var(--vn-header-height, 76px) + 24px);
}

.btn,
.project-action,
.text-link {
    transition: transform var(--vntech-transition-fast), box-shadow var(--vntech-transition-fast), border-color var(--vntech-transition-fast), background var(--vntech-transition-fast);
}

.btn:hover,
.project-action:hover {
    transform: translateY(-1px);
}

.hero--v275 {
    position: relative;
    overflow: clip;
    background:
        radial-gradient(circle at 76% 12%, rgba(37, 99, 235, 0.14), transparent 34%),
        linear-gradient(135deg, #f8fbff 0%, #eef4fb 52%, #dfeaf8 100%);
    border-bottom: 1px solid var(--vntech-border);
}

.hero--v275::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.42;
    background-image:
        linear-gradient(rgba(37, 99, 235, 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(37, 99, 235, 0.07) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent);
}

.hero__grid--v273 {
    align-items: center;
    gap: clamp(32px, 5vw, 72px);
    min-height: min(760px, calc(100svh - var(--vn-header-height, 76px)));
}

.hero__content--v273 h1 {
    max-width: 780px;
    font-size: clamp(40px, 5.2vw, 72px);
    line-height: 0.98;
    letter-spacing: 0;
}

.hero__content--v273 h1 mark {
    color: var(--vntech-blue);
    background: none;
}

.hero__text {
    max-width: 720px;
    font-size: clamp(17px, 1.55vw, 21px);
    color: var(--vntech-text-muted);
}

.hero__actions {
    align-items: center;
    gap: 12px;
}

.hero__project-link {
    min-height: 44px;
    align-items: center;
}

.hero-dashboard--phase7 {
    color: var(--vntech-text-on-dark);
}

.hero-dashboard--phase7 .hero-dashboard__shell {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(145deg, rgba(8, 20, 38, 0.98), rgba(16, 34, 60, 0.98)),
        radial-gradient(circle at 82% 10%, rgba(45, 125, 255, 0.3), transparent 34%);
    border: 1px solid rgba(148, 186, 255, 0.2);
    border-radius: var(--vntech-radius-xl);
    box-shadow: var(--vntech-shadow-lg);
}

.hero-dashboard--phase7 .hero-dashboard__table span {
    position: relative;
    background: rgba(255, 255, 255, 0.075);
    border-color: rgba(164, 194, 255, 0.2);
}

.hero-dashboard--phase7 .hero-dashboard__table span + span::before {
    content: "";
    position: absolute;
    top: -18px;
    left: 26px;
    width: 2px;
    height: 18px;
    background: linear-gradient(180deg, rgba(96, 165, 250, 0), rgba(96, 165, 250, 0.78));
}

.hero-route-lines {
    opacity: 0.85;
}

.hero-ai-card--v273 {
    border-radius: var(--vntech-radius-lg);
    box-shadow: var(--vntech-shadow-md);
}

.trust-strip--phase7 {
    margin-top: -1px;
    color: var(--vntech-text-on-dark);
    background: linear-gradient(135deg, #071527, #0d2037 62%, #0a1730);
}

.trust-strip__inner {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    padding-block: 0;
}

.trust-strip__item {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 14px;
    padding: clamp(18px, 2.3vw, 28px);
    min-height: 132px;
    background: rgba(255, 255, 255, 0.045);
}

.trust-strip__item span {
    color: #93c5fd;
    font-weight: 900;
    font-size: 13px;
}

.trust-strip__item h2 {
    margin: 0 0 6px;
    font-size: 16px;
    letter-spacing: 0;
    color: #ffffff;
}

.trust-strip__item p {
    margin: 0;
    color: rgba(237, 246, 255, 0.78);
    font-size: 14px;
    line-height: 1.5;
}

.services-section--phase7,
.projects-section--phase7,
.faq-section--phase7 {
    background: #ffffff;
}

.service-outcome-lead {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    align-items: center;
    padding: clamp(18px, 2.4vw, 28px);
    margin: 0 0 24px;
    border: 1px solid var(--vntech-border);
    border-radius: var(--vntech-radius-lg);
    background: linear-gradient(135deg, #ffffff, #eff6ff);
    box-shadow: var(--vntech-shadow-sm);
}

.service-outcome-lead p {
    max-width: 780px;
    margin: 0;
    color: var(--vntech-text-muted);
}

.system-module-grid--v272 {
    align-items: stretch;
}

.system-module--phase7 {
    border-radius: var(--vntech-radius-lg);
    background: var(--vntech-surface);
    border: 1px solid var(--vntech-border);
}

.system-module--phase7.system-module--primary {
    grid-column: span 2;
    background: linear-gradient(135deg, #0f1e33, #132d52);
    color: var(--vntech-text-on-dark);
}

.system-module--phase7.system-module--primary p,
.system-module--phase7.system-module--primary small,
.system-module--phase7.system-module--primary .module-label,
.system-module--phase7.system-module--primary .system-module__description {
    color: rgba(237, 246, 255, 0.78);
}

.packages-section--phase7 {
    background:
        linear-gradient(180deg, #f7fbff, #eef4fb);
}

.level-grid--v272 {
    align-items: start;
}

.level-card--phase7 {
    display: flex;
    flex-direction: column;
    min-height: auto;
    border-radius: var(--vntech-radius-lg);
    border: 1px solid var(--vntech-border);
    box-shadow: var(--vntech-shadow-sm);
}

.level-card--phase7.is-recommended {
    border-color: var(--vntech-border-strong);
    box-shadow: 0 24px 60px rgba(37, 99, 235, 0.18);
}

.level-card--phase7 .level-card__pricing strong {
    font-size: clamp(28px, 3.4vw, 42px);
    line-height: 1;
}

.level-card--phase7 .level-card__actions {
    margin-top: auto;
}

.level-card--phase7 .level-card__details {
    margin-top: 14px;
}

.level-card--phase7 .level-card__details-body {
    padding-top: 12px;
}

.projects-section--phase7 {
    position: relative;
    overflow: clip;
}

.projects-section--phase7::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(37, 99, 235, 0.06), transparent 24%, transparent 76%, rgba(15, 23, 42, 0.05));
}

.project-card--phase7 {
    border-radius: var(--vntech-radius-lg);
    overflow: hidden;
    background: #ffffff;
    border: 1px solid var(--vntech-border);
    box-shadow: var(--vntech-shadow-sm);
}

.project-card--phase7 .project-media {
    background: #081527;
}

.project-card--phase7 .project-card__image {
    transition: transform var(--vntech-transition-slow);
}

.project-card--phase7:hover .project-card__image,
.project-card--phase7:focus-within .project-card__image {
    transform: scale(1.025);
}

.ai-widget-section--phase7 {
    background:
        radial-gradient(circle at 16% 18%, rgba(96, 165, 250, 0.16), transparent 28%),
        linear-gradient(135deg, #081527, #0c1e35);
    color: var(--vntech-text-on-dark);
}

.ai-widget-section--phase7 .section-heading h2,
.ai-widget-section--phase7 .section-heading p,
.ai-widget-section--phase7 .eyebrow {
    color: inherit;
}

.ai-widget-section--phase7 .ai-advisor-wrap {
    border-radius: var(--vntech-radius-xl);
}

.ai-widget-section--phase7 .ai-scenario-card,
.ai-widget-section--phase7 .ai-advisor-note {
    border: 1px solid rgba(147, 197, 253, 0.22);
    background: rgba(255, 255, 255, 0.075);
    color: var(--vntech-text-on-dark);
}

.ai-widget-section--phase7 .ai-scenario-card p,
.ai-widget-section--phase7 .ai-advisor-note p,
.ai-widget-section--phase7 .ai-advisor-action p {
    color: rgba(237, 246, 255, 0.76);
}

.ai-widget-section--phase7 .ai-capability-chips span {
    background: rgba(219, 234, 254, 0.12);
    color: #dbeafe;
    border-color: rgba(147, 197, 253, 0.22);
}

.use-cases-section--phase7 {
    background: linear-gradient(180deg, #f6f9fd, #ffffff);
}

.use-case-grid--v272 {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
}

.use-case-card--phase7 {
    cursor: pointer;
    outline: none;
    border: 1px solid var(--vntech-border);
    border-radius: var(--vntech-radius-md);
    background: #ffffff;
    box-shadow: none;
}

.use-case-card--phase7.is-active,
.use-case-card--phase7:focus-visible {
    border-color: var(--vntech-border-strong);
    box-shadow: var(--vntech-shadow-md);
    transform: translateY(-2px);
}

.process-section--v272 {
    background:
        linear-gradient(135deg, #ffffff, #eef5ff);
}

.process-steps--v272 {
    position: relative;
}

.process-step--v272 {
    border-radius: var(--vntech-radius-lg);
    border: 1px solid var(--vntech-border);
    background: rgba(255, 255, 255, 0.88);
}

.faq-section--phase7 .faq-item {
    border-radius: var(--vntech-radius-md);
    border: 1px solid var(--vntech-border);
    box-shadow: none;
}

.contact-section--v272 {
    background:
        linear-gradient(135deg, #071527, #102947);
    color: var(--vntech-text-on-dark);
}

.contact-section--v272 .section-heading h2,
.contact-section--v272 .section-heading p,
.contact-section--v272 .eyebrow {
    color: inherit;
}

.contact-section--v272 .contact-conversion {
    border-radius: var(--vntech-radius-xl);
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(147, 197, 253, 0.2);
}

.contact-section--v272 .contact-helper,
.contact-section--v272 .contact-next-step,
.contact-section--v272 .contact-method-card {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(147, 197, 253, 0.22);
}

.contact-section--v272 p,
.contact-section--v272 li,
.contact-section--v272 span {
    color: rgba(237, 246, 255, 0.8);
}

.site-footer--v276 {
    background: #071527;
    color: var(--vntech-text-on-dark);
}

.site-footer--v276 .site-footer__inner {
    padding-block: 34px 22px;
}

.site-footer--v276 p,
.site-footer--v276 a,
.site-footer--v276 .site-footer__trust {
    color: rgba(237, 246, 255, 0.76);
}

.site-footer--v276 a:hover,
.site-footer--v276 a:focus-visible {
    color: #ffffff;
}

@media (max-width: 1180px) {
    .trust-strip__inner {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .system-module--phase7.system-module--primary {
        grid-column: auto;
    }

    .use-case-grid--v272 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .hero__grid--v273 {
        min-height: auto;
        padding-block: 46px 34px;
    }

    .hero__content--v273 h1 {
        font-size: clamp(34px, 10vw, 46px);
    }

    .hero__actions {
        align-items: stretch;
    }

    .hero__actions .btn,
    .hero__actions .text-link {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .trust-strip__inner,
    .use-case-grid--v272 {
        grid-template-columns: 1fr;
    }

    .trust-strip__item {
        min-height: auto;
    }

    .service-outcome-lead {
        display: grid;
    }

    .level-card--phase7 .level-card__pricing strong {
        font-size: 32px;
    }

    .contact-section--v272 .contact-conversion {
        border-radius: var(--vntech-radius-lg);
    }
}

@media (max-width: 380px) {
    .hero__content--v273 h1 {
        font-size: 32px;
    }

    .trust-strip__item,
    .service-outcome-lead,
    .level-card--phase7,
    .project-card--phase7 {
        border-radius: var(--vntech-radius-md);
    }
}

@media (prefers-reduced-motion: reduce) {
    .project-card--phase7 .project-card__image,
    .use-case-card--phase7,
    .btn,
    .project-action {
        transition: none;
        transform: none !important;
    }
}

.home .section {
    position: relative;
}

.home .system-module,
.home .level-card,
.home .ai-widget-card,
.home .ai-widget-feature,
.home .use-case-card,
.home .process-step,
.home .faq-item {
    transition: transform var(--vntech-transition-fast), border-color var(--vntech-transition-fast), box-shadow var(--vntech-transition-fast);
}

.home .system-module:hover,
.home .level-card:hover,
.home .ai-widget-feature:hover,
.home .use-case-card:hover,
.home .process-step:hover,
.home .faq-item:hover {
    transform: translateY(-2px);
    box-shadow: var(--vntech-shadow-md);
}

.projects-section--v272 {
    overflow: clip;
    background: radial-gradient(circle at 10% 0%, rgba(37, 99, 235, .07), transparent 28%), linear-gradient(180deg, #fff 0%, #f8fbff 58%, #fff 100%);
}

.project-grid--v272 {
    align-items: stretch;
    gap: clamp(16px, 2.4vw, 24px);
}

.project-grid--count-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.project-card--v6a {
    position: relative;
    display: flex;
    min-width: 0;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(37, 99, 235, .13);
    border-radius: var(--vntech-radius-xl);
    background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 251, 255, .96)), #fff;
    box-shadow: var(--vntech-shadow-sm);
    transition: transform var(--vntech-transition-normal), border-color var(--vntech-transition-normal), box-shadow var(--vntech-transition-normal);
}

.project-card--v6a:hover,
.project-card--v6a:focus-within {
    transform: translateY(-3px);
    border-color: rgba(37, 99, 235, .28);
    box-shadow: var(--vntech-shadow-lg);
}

.project-card--v6a .project-media {
    position: relative;
    aspect-ratio: 16 / 9.4;
    min-width: 0;
    overflow: hidden;
    border-radius: calc(var(--vntech-radius-xl) - 1px) calc(var(--vntech-radius-xl) - 1px) var(--vntech-radius-md) var(--vntech-radius-md);
    background: linear-gradient(135deg, #eaf2ff, #f8fbff);
}

.project-card--v6a .project-media::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 42%;
    background: linear-gradient(180deg, transparent, rgba(15, 23, 42, .10));
    pointer-events: none;
}

.project-card--v6a .project-card__image,
.project-card--v6a .project-gallery,
.project-card--v6a .project-placeholder {
    display: block;
    width: 100%;
    max-width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
    transition: transform 420ms ease;
}

.project-card--v6a:hover .project-card__image,
.project-card--v6a:focus-within .project-card__image {
    transform: scale(1.025);
}

.project-card--v6a .project-card__body {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 12px;
    padding: clamp(16px, 2vw, 22px);
}

.project-card--v6a .project-card__topline {
    display: flex;
    min-width: 0;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.project-card--v6a h3,
.project-card--v6a p,
.project-spotlight--v6a h3,
.project-spotlight--v6a p,
.project-spotlight--v6a dd,
.project-spotlight--v6a li {
    min-width: 0;
    overflow-wrap: anywhere;
}

.project-card--v6a .project-card__body > p {
    margin: 0;
    color: #526173;
    line-height: 1.58;
}

.project-card--v6a .project-card__actions {
    margin-top: auto;
}

.project-card__actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 10px;
    align-items: stretch;
    width: 100%;
    min-width: 0;
    padding-top: 14px;
}

.project-action {
    display: inline-flex;
    min-width: 0;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 14px;
    border: 1px solid rgba(37, 99, 235, .18);
    border-radius: 999px;
    font: inherit;
    font-size: 14px;
    font-weight: 950;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: transform var(--vntech-transition-fast), border-color var(--vntech-transition-fast), background var(--vntech-transition-fast), color var(--vntech-transition-fast), box-shadow var(--vntech-transition-fast);
}

.project-action span {
    min-width: 0;
}

.project-action--primary {
    background: #0f172a;
    color: #fff;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .15);
}

.project-action--secondary {
    background: #fff;
    color: #1d4ed8;
}

.project-action--contact {
    color: #0f172a;
}

.project-action:hover,
.project-action:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(37, 99, 235, .38);
    box-shadow: 0 12px 28px rgba(37, 99, 235, .13);
    text-decoration: none;
}

.project-action:focus-visible {
    outline: 3px solid rgba(37, 99, 235, .26);
    outline-offset: 3px;
}

.project-action__icon {
    flex: 0 0 auto;
    transition: transform var(--vntech-transition-fast);
}

.project-action--external:hover .project-action__icon,
.project-action--external:focus-visible .project-action__icon {
    transform: translate(2px, -2px);
}

.project-spotlight--v6a {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: visible;
    border-radius: var(--vntech-radius-xl);
}

.project-spotlight--v6a .project-spotlight__close {
    display: inline-flex;
    min-width: 44px;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    margin: 0 0 14px auto;
    padding: 10px 16px;
    float: none;
}

.project-spotlight--v6a .project-spotlight__panel {
    display: grid;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
    gap: clamp(16px, 2.5vw, 26px);
    clear: none;
}

.project-spotlight--v6a .project-spotlight__media,
.project-spotlight--v6a .project-spotlight__summary,
.project-spotlight--v6a .project-spotlight__facts,
.project-spotlight--v6a .project-spotlight__modules {
    min-width: 0;
    max-width: 100%;
}

.project-spotlight--v6a .project-spotlight__summary {
    align-self: start;
}

.project-spotlight--v6a .project-spotlight__summary > div {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.project-spotlight--v6a .project-spotlight__external {
    width: fit-content;
    max-width: 100%;
    margin-top: 4px;
}

.project-spotlight--v6a .project-spotlight__facts {
    align-self: start;
}

.project-spotlight--v6a .project-spotlight__facts div,
.project-spotlight--v6a .project-spotlight__modules ul {
    min-width: 0;
}

.scroll-top {
    min-width: 44px;
    min-height: 44px;
}

@media (max-width: 900px) {
    .project-grid--count-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .project-card__actions {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .project-grid--count-4,
    .project-grid--v272 {
        grid-template-columns: minmax(0, 1fr);
    }

    .project-card--v6a {
        border-radius: 20px;
    }

    .project-card--v6a .project-card__body {
        padding: 16px;
    }

    .project-card__actions {
        gap: 9px;
        padding-top: 12px;
    }

    .project-action {
        width: 100%;
        justify-content: center;
        white-space: normal;
    }
}

@media (max-width: 760px) {
    .project-spotlight--v6a {
        padding: 14px;
        border-radius: 20px;
    }

    .project-spotlight--v6a .project-spotlight__close {
        position: static;
        width: auto;
        margin-left: auto;
        margin-bottom: 12px;
    }

    .project-spotlight--v6a .project-spotlight__panel {
        grid-template-columns: minmax(0, 1fr);
        gap: 14px;
    }

    .project-spotlight--v6a .project-spotlight__media {
        grid-row: auto;
        min-height: 0;
        aspect-ratio: 16 / 10;
        border-radius: 16px;
    }

    .project-spotlight--v6a .project-spotlight__image {
        min-height: 0;
        height: auto;
        aspect-ratio: 16 / 10;
    }

    .project-spotlight--v6a .project-spotlight__media-fallback {
        min-height: 180px;
    }

    .project-spotlight--v6a .project-spotlight__facts {
        grid-template-columns: minmax(0, 1fr);
    }

    .project-spotlight--v6a .project-spotlight__facts div {
        padding: 11px;
        border-radius: 14px;
    }

    .project-spotlight--v6a .project-spotlight__modules li {
        max-width: 100%;
        white-space: normal;
    }

    .project-spotlight--v6a .project-spotlight__external {
        width: 100%;
    }
}

@media (max-width: 360px) {
    .project-card--v6a .project-card__body {
        padding: 14px;
    }

    .project-action {
        padding-inline: 12px;
        font-size: 13px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .home .system-module,
    .home .level-card,
    .home .ai-widget-card,
    .home .ai-widget-feature,
    .home .use-case-card,
    .home .process-step,
    .home .faq-item,
    .project-card--v6a,
    .project-card--v6a .project-card__image,
    .project-action,
    .project-action__icon,
    .project-spotlight--v272 {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }

    .home .system-module:hover,
    .home .level-card:hover,
    .home .ai-widget-feature:hover,
    .home .use-case-card:hover,
    .home .process-step:hover,
    .home .faq-item:hover,
    .project-card--v6a:hover,
    .project-card--v6a:focus-within,
    .project-card--v6a:hover .project-card__image,
    .project-card--v6a:focus-within .project-card__image,
    .project-action:hover,
    .project-action:focus-visible,
    .project-action--external:hover .project-action__icon,
    .project-action--external:focus-visible .project-action__icon {
        transform: none;
    }
}

/* VNTech 2.8.0 Phase 7 QA stabilization guard.
   Kept at the end of the file so future cache refreshes match the live critical CSS. */
.home.has-vn-animations [data-vn-animate],
.home [data-vn-animate] {
    opacity: 1 !important;
    transform: none !important;
}

.home .hero,
.home .hero-dashboard,
.home .hero-dashboard__shell,
.home .hero-dashboard__content,
.home .hero-dashboard__table,
.home .system-module,
.home .level-card,
.home .project-card,
.home .project-spotlight,
.home .ai-advisor-wrap,
.home .use-case-card,
.home .process-step,
.home .faq-item,
.home .contact-conversion,
.home .site-footer {
    min-width: 0;
    max-width: 100%;
}

.home .hero,
.home .hero-dashboard__shell,
.home .hero__container--v273,
.home .hero__grid--v273,
.home .hero-dashboard--phase7,
.home .project-card,
.home .level-card,
.home .process-step {
    overflow: hidden;
}

.home .hero::before,
.home .hero::after,
.home .hero-route-lines {
    display: none !important;
}

.home .hero-dashboard__topbar,
.home .hero-dashboard__stats,
.home .hero-dashboard__table span,
.home .process-step,
.home .project-action,
.home .btn,
.home .text-link {
    overflow-wrap: anywhere;
}

.home .hero-dashboard__topbar nav {
    flex-wrap: wrap;
}

.home .process-steps--v272 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.home .process-step--v272 {
    width: auto;
}

.home .services-section--phase7 .system-module-grid--v272 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    align-items: stretch;
}

.home .services-section--phase7 .system-module--phase7,
.home .services-section--phase7 .system-module--phase7.system-module--primary {
    grid-column: auto;
    width: auto;
    display: grid;
    grid-template-columns: minmax(0, auto) minmax(0, 1fr);
}

.home .services-section--phase7 .system-module__body,
.home .services-section--phase7 .system-module__meta,
.home .services-section--phase7 h3,
.home .services-section--phase7 p {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
}

.home .services-section--phase7 .system-module--primary h3,
.home .services-section--phase7 .system-module--primary .system-module__outcome,
.home .services-section--phase7 .system-module--primary .system-module__link {
    color: #ffffff;
}

.home .packages-section--phase7 .level-card__terms,
.home .packages-section--phase7 .level-card__terms > div,
.home .packages-section--phase7 .level-card__terms dt,
.home .packages-section--phase7 .level-card__terms dd,
.home .packages-section--phase7 .level-card__features,
.home .packages-section--phase7 .level-card__features li {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    overflow-wrap: anywhere;
}

@media (max-width: 1180px) {
    .home .process-steps--v272 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home .services-section--phase7 .system-module-grid--v272 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .home .hero-dashboard__content,
    .home .hero-dashboard__stats,
    .home .hero-dashboard__table span,
    .home .process-steps--v272 {
        grid-template-columns: minmax(0, 1fr);
    }

    .home .hero-dashboard__table span i {
        justify-self: start;
    }

    .home .services-section--phase7 .system-module-grid--v272 {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Phase 9A.1 critical contrast correction for the production AI example panel. */
.home .ai-widget-section--phase7 .ai-advisor-wrap {
    background: rgba(237, 246, 255, 0.96);
    color: #07111f;
}

.home .ai-widget-section--phase7 .section-heading h2,
.home .ai-widget-section--phase7 .section-heading p,
.home .ai-widget-section--phase7 .ai-advisor-note strong,
.home .ai-widget-section--phase7 .ai-scenario-card h3,
.home .ai-widget-section--phase7 .ai-scenario-card__answer {
    color: #07111f;
}

.home .ai-widget-section--phase7 .eyebrow,
.home .ai-widget-section--phase7 .ai-scenario-card__tag {
    color: #075985;
}

.home .ai-widget-section--phase7 .ai-advisor-note p,
.home .ai-widget-section--phase7 .ai-scenario-card__note,
.home .ai-widget-section--phase7 .ai-advisor-action p {
    color: #334155;
}

.home .ai-widget-section--phase7 .ai-scenario-card,
.home .ai-widget-section--phase7 .ai-advisor-note {
    background: rgba(255, 255, 255, 0.74);
    color: #07111f;
}

.home .ai-widget-section--phase7 .ai-capability-chips span {
    background: rgba(255, 255, 255, 0.74);
    color: #1d4ed8;
}

/* VNTech 2.8.6 browser-led optimization: current-design refinement, not a redesign. */
:root {
    --vn-accent: #1d5cff;
    --vn-accent-hover: #1749d6;
    --vn-accent-soft: #e8f1ff;
    --vn-dark: #081526;
    --vn-ink: #07111f;
    --vn-text: #172033;
    --vn-muted: #475569;
    --vn-soft: #f5f8fc;
    --vn-line: #d9e4f2;
    --vn-card: #ffffff;
    --vn-radius: 16px;
    --vn-shadow: 0 20px 54px rgba(8, 21, 38, .10);
    --vn-shadow-soft: 0 10px 28px rgba(8, 21, 38, .065);
}

html {
    scroll-padding-top: calc(var(--vn-header-height, 74px) + 18px);
}

body {
    color: var(--vn-text);
    background: #f7faff;
}

h1,
h2,
h3,
h4,
.home .btn,
.home .project-action,
.home .hero-dashboard__stats strong,
.home .hero-dashboard__table em,
.home .level-card__pricing strong {
    letter-spacing: 0;
    overflow-wrap: normal !important;
    word-break: normal;
    hyphens: none;
}

.home .btn,
.home .project-action,
.home .level-card__details summary {
    min-height: 48px;
    border-radius: 12px;
}

.home .btn:focus-visible,
.home .project-action:focus-visible,
.home .level-card__details summary:focus-visible,
.home .faq-item summary:focus-visible,
.home .site-nav a:focus-visible,
.home .mobile-menu a:focus-visible,
.home .scroll-top:focus-visible,
.home [data-vn-open-ai-widget]:focus-visible {
    outline: 3px solid rgba(29, 92, 255, .38);
    outline-offset: 3px;
}

.home .btn--primary {
    background: var(--vn-accent);
    box-shadow: 0 14px 34px rgba(29, 92, 255, .24);
}

.home .btn--primary:hover,
.home .btn--primary:focus-visible {
    background: var(--vn-accent-hover);
}

.home .btn--secondary,
.home .btn--ghost {
    border-color: #b8c9e4;
    color: #0f1b2d;
}

.home .section {
    padding: clamp(48px, 5.5vw, 78px) 0;
}

.home .section-heading {
    max-width: 760px;
}

.home .section-heading p:not(.eyebrow),
.home .project-card__body p,
.home .level-card__head p:not(.eyebrow),
.home .process-step p,
.home .faq-item div,
.home .use-case-card p {
    color: var(--vn-muted);
}

.home .eyebrow {
    color: var(--vn-accent);
}

.site-header {
    background: rgba(255, 255, 255, .94);
    border-bottom-color: rgba(203, 213, 225, .72);
}

.site-header.is-scrolled {
    box-shadow: 0 10px 30px rgba(8, 21, 38, .11);
}

.site-nav__menu a:hover,
.site-nav__menu a:focus-visible,
.site-nav__menu a.is-active {
    color: var(--vn-accent);
}

.home .hero--v25.hero--v26.hero--v27.hero--v272.hero--v273.hero--v274.hero--v275 {
    padding: clamp(40px, 5.2vw, 68px) 0 clamp(34px, 4.5vw, 58px);
    background: linear-gradient(180deg, #ffffff 0%, #edf5ff 100%);
}

.home .hero__grid--v273 {
    grid-template-columns: minmax(0, .92fr) minmax(430px, .88fr);
    gap: clamp(28px, 4.6vw, 58px);
    align-items: center;
}

.home .hero__content--v273 h1 {
    max-width: 660px;
    font-size: clamp(42px, 4.6vw, 62px);
    line-height: 1.02;
}

.home .hero__content--v273 h1 mark {
    display: block;
    margin-top: 2px;
    color: var(--vn-accent);
    background: transparent;
}

.home .hero__text {
    max-width: 650px;
    color: #334155;
    font-size: clamp(17px, 1.35vw, 20px);
    line-height: 1.58;
}

.home .hero__actions {
    align-items: center;
    gap: 12px;
    margin-top: 24px;
}

.home .hero__actions .btn {
    padding-inline: 24px;
}

.home .hero-reference-badge {
    border-color: #c7d7ef;
    background: rgba(255, 255, 255, .88);
    box-shadow: 0 10px 28px rgba(8, 21, 38, .055);
}

.home .proof-row--v273 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 28px;
}

.home .proof-row--v273 span {
    align-items: flex-start;
    min-width: 0;
    padding: 14px 12px;
    border-radius: 14px;
    border-color: #d7e2f2;
    background: rgba(255, 255, 255, .84);
}

.home .proof-row--v273 small {
    color: var(--vn-muted);
}

.home .hero-dashboard--phase7 {
    justify-self: stretch;
}

.home .hero-dashboard__shell {
    border-radius: 22px;
    background: linear-gradient(145deg, #081526 0%, #0e2038 100%);
    box-shadow: 0 28px 74px rgba(8, 21, 38, .22);
    transform: none;
}

.home .hero-dashboard__copy h2 {
    max-width: 520px;
    font-size: clamp(28px, 2.6vw, 38px);
    line-height: 1.08;
}

.home .hero-dashboard__copy p {
    color: #c5d3e7;
    font-size: 16px;
    line-height: 1.55;
}

.home .hero-dashboard__topbar nav span,
.home .hero-dashboard__table span,
.home .hero-dashboard__stats span {
    border-color: rgba(203, 213, 225, .18);
}

.home .hero-dashboard__table span {
    grid-template-columns: minmax(82px, .68fr) minmax(0, 1fr);
    gap: 8px 12px;
    overflow-wrap: normal !important;
}

.home .hero-dashboard__table span * {
    overflow-wrap: normal !important;
    word-break: normal;
    hyphens: none;
}

.home .hero-dashboard__stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.home .hero-dashboard__stats strong {
    color: #93c5fd;
    font-size: 15px;
}

.home .hero-dashboard__stats small,
.home .hero-dashboard__table small {
    color: #c5d3e7;
    font-size: 14px;
    line-height: 1.45;
}

.home .hero-dashboard__table em {
    font-size: 14px;
    line-height: 1.35;
}

.home .hero-dashboard__table i {
    grid-column: 2;
    justify-self: start;
    font-size: 12px;
    white-space: nowrap;
}

.home .hero-ai-card--v273 {
    border: 1px solid #d7e2f2;
    border-radius: 18px;
    box-shadow: 0 18px 42px rgba(8, 21, 38, .13);
}

.home .hero-service-strip--v273 {
    margin-top: 26px;
    border-color: #dbe6f4;
    border-radius: 18px;
    box-shadow: 0 16px 44px rgba(8, 21, 38, .08);
}

.home .hero-service-strip--v273 article {
    gap: 14px;
    padding: 18px;
}

.home .hero-service-strip--v273 h3 {
    font-size: 18px;
}

.home .hero-service-strip--v273 p {
    color: var(--vn-muted);
    line-height: 1.45;
}

.home .trust-strip {
    background: #071526;
}

.home .services-section--phase7 .system-module--phase7 {
    border-color: #dbe6f4;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 10px 30px rgba(8, 21, 38, .055);
}

.home .services-section--phase7 .system-module--phase7:hover,
.home .services-section--phase7 .system-module--phase7:focus-within,
.home .level-card:hover,
.home .level-card:focus-within,
.home .project-card:hover,
.home .project-card:focus-within,
.home .use-case-card:hover,
.home .use-case-card:focus-within {
    border-color: rgba(29, 92, 255, .28);
    box-shadow: 0 18px 46px rgba(8, 21, 38, .095);
    transform: translateY(-2px);
}

.home .services-section--phase7 .system-module--primary {
    background: linear-gradient(145deg, #081526 0%, #10233c 100%);
}

.home .packages-stage--v272 {
    border-color: #dbe6f4;
    border-radius: 20px;
    background: rgba(255, 255, 255, .78);
    box-shadow: 0 22px 62px rgba(8, 21, 38, .08);
}

.home .packages-section--phase7 .level-card {
    border-color: #dbe6f4;
    border-radius: 16px;
    background: #ffffff;
}

.home .packages-section--phase7 .level-card.is-recommended {
    border-color: rgba(29, 92, 255, .58);
}

.home .packages-section--phase7 .level-card__pricing {
    min-height: 128px;
    border-radius: 14px;
    background: #081526;
    color: #ffffff;
}

.home .packages-section--phase7 .level-card.is-recommended .level-card__pricing {
    background: linear-gradient(135deg, #1d5cff 0%, #173fba 100%);
}

.home .packages-section--phase7 .level-card.is-custom .level-card__pricing {
    background: #334155;
}

.home .packages-section--phase7 .level-card__pricing strong {
    color: #ffffff;
    font-size: clamp(34px, 3.2vw, 46px);
}

.home .packages-section--phase7 .level-card__pricing span {
    color: rgba(255, 255, 255, .86);
}

.home .packages-section--phase7 .level-card__support-row {
    border-color: #c9d8ee;
    background: #ffffff;
}

.home .packages-section--phase7 .level-card__details summary {
    border-color: #dbe6f4;
    background: #ffffff;
}

.home .packages-section--phase7 .level-card__details summary:hover,
.home .packages-section--phase7 .level-card__details summary:focus-visible {
    border-color: rgba(29, 92, 255, .38);
    background: #f8fbff;
}

.home .pricing-disclaimer {
    border-color: #dbe6f4;
    color: #334155;
}

.home .projects-section--phase7 {
    background: linear-gradient(180deg, #ffffff 0%, #f4f8ff 100%);
}

.home .project-card--v6a {
    border-color: #dbe6f4;
    border-radius: 16px;
    background: #ffffff;
}

.home .project-card--v6a .project-media {
    aspect-ratio: 16 / 10;
    border-bottom-color: #dbe6f4;
    background: #eef4ff;
}

.home .project-card--v6a .project-card__image {
    object-fit: cover;
    object-position: top center;
    transition: transform .26s ease;
}

.home .project-card--v6a:hover .project-card__image,
.home .project-card--v6a:focus-within .project-card__image {
    transform: scale(1.018);
}

.home .project-card__topline span {
    color: #1d4ed8;
    background: #e8f1ff;
}

.home .project-card__actions {
    align-items: stretch;
}

.home .project-action {
    transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.home .project-action--primary {
    background: #081526;
}

.home .project-action--primary:hover,
.home .project-action--primary:focus-visible {
    background: #0f2440;
}

.home .project-action--external {
    border-color: #b8c9e4;
    background: #ffffff;
    color: var(--vn-accent);
}

.home .project-action--external:hover,
.home .project-action--external:focus-visible {
    border-color: rgba(29, 92, 255, .44);
    background: #f7fbff;
}

.home .project-spotlight--v6a {
    border-color: #dbe6f4;
    border-radius: 18px;
    background: #ffffff;
}

.home .ai-widget-section--phase7 {
    background: #071526;
}

.home .ai-widget-section--phase7 .ai-advisor-wrap {
    border: 1px solid rgba(203, 213, 225, .7);
    border-radius: 20px;
    background: #edf6ff;
    box-shadow: 0 26px 70px rgba(8, 21, 38, .20);
}

.home .ai-widget-section--phase7 .ai-advisor-header {
    gap: 22px;
}

.home .ai-widget-section--phase7 .section-heading h2 {
    max-width: 680px;
    font-size: clamp(34px, 4vw, 54px);
    line-height: 1.07;
}

.home .ai-widget-section--phase7 .section-heading p {
    max-width: 720px;
    color: #334155;
}

.home .ai-widget-section--phase7 .ai-advisor-action p {
    max-width: 360px;
    color: #334155;
}

.home .ai-widget-section--phase7 .ai-advisor-note,
.home .ai-widget-section--phase7 .ai-scenario-card {
    border: 1px solid rgba(203, 213, 225, .72);
    border-radius: 16px;
    background: rgba(255, 255, 255, .86);
    box-shadow: none;
}

.home .ai-widget-section--phase7 .ai-advisor-note__label,
.home .ai-widget-section--phase7 .ai-scenario-card__tag {
    border-color: #bfdbfe;
    background: #e8fbff;
    color: #075985;
}

.home .ai-widget-section--phase7 .ai-scenario-grid {
    gap: 14px;
}

.home .ai-widget-section--phase7 .ai-scenario-card {
    padding: 18px;
}

.home .ai-widget-section--phase7 .ai-scenario-card h3 {
    font-size: clamp(19px, 1.6vw, 24px);
    line-height: 1.14;
}

.home .ai-widget-section--phase7 .ai-scenario-card__answer {
    color: #0f172a;
    font-weight: 760;
    line-height: 1.5;
}

.home .ai-widget-section--phase7 .ai-scenario-card__note {
    color: #475569;
    line-height: 1.5;
}

.home .ai-widget-section--phase7 .ai-capability-chips span {
    border: 1px solid #dbe6f4;
    border-radius: 999px;
    background: #ffffff;
    color: var(--vn-accent);
}

.home .use-cases-section,
.home .faq-section {
    background: #f5f8fc;
}

.home .use-case-card,
.home .process-step,
.home .faq-item {
    border-color: #dbe6f4;
    border-radius: 16px;
}

.home .contact-conversion {
    border-radius: 18px;
    background: linear-gradient(135deg, #071526 0%, #112846 100%);
}

.home .site-footer {
    background: #07111f;
}

@keyframes vn-hero-soft-enter {
    from {
        opacity: .01;
        transform: translateY(18px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.home.has-vn-animations [data-vn-animate],
.home [data-vn-animate] {
    opacity: 1 !important;
    transform: none !important;
}

.vn-motion-ready .home.has-vn-animations [data-vn-animate] {
    opacity: 1 !important;
    transform: translateY(14px) !important;
    transition: opacity .62s ease, transform .62s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.vn-motion-ready .home.has-vn-animations [data-vn-animate="fade-in"] {
    transform: none !important;
}

.vn-motion-ready .home.has-vn-animations [data-vn-animate].is-visible {
    opacity: 1 !important;
    transform: none !important;
}

.vn-motion-ready .home .hero__content--v273,
.vn-motion-ready .home .hero-dashboard--phase7,
.vn-motion-ready .home .hero-service-strip--v273 article {
    animation: vn-hero-soft-enter .72s ease both;
}

.vn-motion-ready .home .hero-dashboard--phase7 {
    animation-delay: .08s;
}

.vn-motion-ready .home .hero-service-strip--v273 article:nth-child(2),
.vn-motion-ready .home .system-module:nth-child(2),
.vn-motion-ready .home .level-card:nth-child(2),
.vn-motion-ready .home .project-card:nth-child(2),
.vn-motion-ready .home .ai-scenario-card:nth-child(2),
.vn-motion-ready .home .use-case-card:nth-child(2),
.vn-motion-ready .home .process-step:nth-child(2) {
    transition-delay: .05s;
    animation-delay: .05s;
}

.vn-motion-ready .home .hero-service-strip--v273 article:nth-child(3),
.vn-motion-ready .home .system-module:nth-child(3),
.vn-motion-ready .home .level-card:nth-child(3),
.vn-motion-ready .home .project-card:nth-child(3),
.vn-motion-ready .home .ai-scenario-card:nth-child(3),
.vn-motion-ready .home .use-case-card:nth-child(3),
.vn-motion-ready .home .process-step:nth-child(3) {
    transition-delay: .1s;
    animation-delay: .1s;
}

.vn-motion-ready .home .hero-service-strip--v273 article:nth-child(4),
.vn-motion-ready .home .system-module:nth-child(4),
.vn-motion-ready .home .project-card:nth-child(4),
.vn-motion-ready .home .ai-scenario-card:nth-child(4),
.vn-motion-ready .home .use-case-card:nth-child(4),
.vn-motion-ready .home .process-step:nth-child(4) {
    transition-delay: .15s;
    animation-delay: .15s;
}

@media (min-width: 900px) {
    .home .ai-widget-section--phase7 .ai-advisor-header {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
        align-items: end;
    }

    .home .ai-widget-section--phase7 .ai-scenario-grid {
        grid-template-columns: .9fr repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1180px) {
    .home .hero__grid--v273 {
        grid-template-columns: minmax(0, 1fr);
    }

    .home .hero-dashboard--phase7 {
        max-width: 760px;
    }

    .home .proof-row--v273 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    html {
        scroll-padding-top: calc(var(--vn-header-height, 68px) + 12px);
    }

    .home .section {
        padding: 42px 0;
    }

    .home .hero--v25.hero--v26.hero--v27.hero--v272.hero--v273.hero--v274.hero--v275 {
        padding-top: 24px;
        padding-bottom: 34px;
    }

    .home .hero__content--v273 h1 {
        max-width: 100%;
        font-size: clamp(34px, 10.6vw, 43px);
        line-height: 1.06;
    }

    .home .hero__text {
        font-size: 16px;
        line-height: 1.55;
    }

    .home .hero__actions {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }

    .home .hero__actions .btn {
        width: 100%;
    }

    .home .proof-row--v273 {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    .home .hero-dashboard__shell {
        border-radius: 18px;
        padding: 16px;
    }

    .home .hero-dashboard__topbar {
        gap: 12px;
    }

    .home .hero-dashboard__topbar nav {
        gap: 6px;
    }

    .home .hero-dashboard__topbar nav span {
        padding-inline: 8px;
        font-size: 12px;
    }

    .home .hero-dashboard__copy h2 {
        font-size: 27px;
    }

    .home .hero-dashboard__stats {
        grid-template-columns: minmax(0, 1fr);
    }

    .home .hero-dashboard__table span {
        grid-template-columns: minmax(0, 1fr);
    }

    .home .hero-service-strip--v273 {
        border-radius: 16px;
    }

    .home .hero-service-strip--v273 article {
        padding: 16px;
    }

    .home .packages-stage--v272 {
        border-radius: 16px;
        padding-inline: 14px;
    }

    .home .packages-section--phase7 .level-card {
        padding: 18px;
    }

    .home .packages-section--phase7 .level-card__pricing {
        min-height: 96px;
    }

    .home .packages-section--phase7 .level-card__pricing strong {
        font-size: clamp(30px, 10vw, 40px);
    }

    .home .project-card__actions {
        grid-template-columns: minmax(0, 1fr);
    }

    .home .ai-widget-section--phase7 .ai-advisor-wrap {
        border-radius: 16px;
        padding: 16px;
    }

    .home .ai-widget-section--phase7 .section-heading h2 {
        font-size: clamp(28px, 8vw, 36px);
    }

    .home .ai-widget-section--phase7 .ai-advisor-action .btn {
        width: 100%;
    }

    .home .ai-widget-section--phase7 .ai-scenario-card {
        padding: 16px;
    }

    .home .ai-widget-section--phase7 .ai-scenario-card h3 {
        font-size: 21px;
    }

    .home .ai-widget-section--phase7 .ai-scenario-card__answer {
        font-size: 15px;
        font-weight: 720;
    }

    .home .scroll-top {
        display: none;
    }

    .vntech-ai-widget[data-vntech-ai-widget] {
        right: 10px !important;
        bottom: 10px !important;
        transform: scale(.9);
        transform-origin: bottom right;
    }
}

@media (max-width: 360px) {
    .home .hero__content--v273 h1 {
        font-size: 32px;
    }

    .home .btn,
    .home .project-action {
        padding-inline: 12px;
        font-size: 14px;
    }

    .home .packages-stage--v272 {
        padding-inline: 10px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vn-motion-ready .home.has-vn-animations [data-vn-animate],
    .home.has-vn-animations [data-vn-animate],
    .home [data-vn-animate],
    .vn-motion-ready .home .hero__content--v273,
    .vn-motion-ready .home .hero-dashboard--phase7,
    .vn-motion-ready .home .hero-service-strip--v273 article {
        opacity: 1 !important;
        transform: none !important;
        animation: none !important;
        transition: none !important;
    }
}

/* VNTech 2.8.7 Phase 1 production homepage polish. */
:root {
    --vn-phase1-navy: #071120;
    --vn-phase1-navy-2: #0c1c33;
    --vn-phase1-blue: #1f66ff;
    --vn-phase1-cyan: #38bdf8;
    --vn-phase1-green: #12b981;
    --vn-phase1-ink: #08111f;
    --vn-phase1-muted: #42526a;
    --vn-phase1-border: #d8e3f2;
    --vn-radius: 8px;
}

html,
body {
    max-width: 100%;
    overflow-x: clip;
}

.home .site-header--v279 {
    background: rgba(255, 255, 255, .96);
    border-bottom: 1px solid rgba(216, 227, 242, .9);
}

.home .site-header--v279 .site-header__inner {
    min-height: 68px;
    gap: 18px;
}

.home .site-brand__logo,
.home .site-footer__logo {
    display: inline-grid;
    place-items: center;
    width: auto;
    min-width: 46px;
    height: 46px;
    padding: 5px;
    border-radius: 8px;
    background: #ffffff;
}

.home .site-brand__logo img,
.home .site-footer__logo img {
    display: block;
    width: auto;
    max-width: 142px;
    max-height: 36px;
    object-fit: contain;
}

.home .site-footer__logo {
    box-shadow: 0 10px 24px rgba(0, 0, 0, .18);
}

.home .site-brand__text strong,
.home .site-footer__brand-title {
    letter-spacing: 0;
}

.home .site-nav__menu {
    gap: clamp(12px, 1.45vw, 22px);
}

.home .site-nav__menu > li > a {
    padding: 10px 0;
    color: #1a2a40;
    font-size: 14px;
}

.home .hero--v25.hero--v26.hero--v27.hero--v272.hero--v273.hero--v274.hero--v275 {
    position: relative;
    isolation: isolate;
    color: #ffffff;
    padding: clamp(48px, 6vw, 86px) 0 clamp(32px, 4.2vw, 58px);
    background:
        linear-gradient(rgba(56, 189, 248, .075) 1px, transparent 1px),
        linear-gradient(90deg, rgba(56, 189, 248, .065) 1px, transparent 1px),
        linear-gradient(145deg, #06101f 0%, #0b1b32 54%, #102847 100%);
    background-size: 44px 44px, 44px 44px, auto;
}

.home .hero--v25.hero--v26.hero--v27.hero--v272.hero--v273.hero--v274.hero--v275::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(120deg, rgba(31, 102, 255, .22), transparent 36%),
        linear-gradient(180deg, transparent 0%, rgba(255, 255, 255, .045) 100%);
    pointer-events: none;
}

.home .hero__grid--v273 {
    grid-template-columns: minmax(0, .95fr) minmax(420px, .82fr);
}

.home .hero__content--v273 h1,
.home .hero__content--v273 h1 span {
    color: #ffffff;
}

.home .hero__content--v273 h1 {
    font-size: clamp(43px, 4.7vw, 66px);
}

.home .hero__content--v273 h1 mark {
    color: #78b7ff;
}

.home .hero__text {
    color: #d6e2f1;
}

.home .hero-reference-badge,
.home .proof-row--v273 span,
.home .hero-ai-card--v273 {
    border-radius: 8px;
    border-color: rgba(148, 189, 255, .32);
    background: rgba(255, 255, 255, .08);
    color: #ffffff;
    box-shadow: none;
}

.home .hero-reference-badge small,
.home .proof-row--v273 small,
.home .hero-ai-card--v273 p,
.home .hero-ai-card--v273 li {
    color: #d7e5f6;
}

.home .hero-dashboard__shell {
    border: 1px solid rgba(148, 189, 255, .32);
    border-radius: 10px;
    background:
        linear-gradient(rgba(56, 189, 248, .08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(56, 189, 248, .07) 1px, transparent 1px),
        linear-gradient(145deg, rgba(8, 21, 38, .98), rgba(13, 32, 57, .98));
    background-size: 34px 34px, 34px 34px, auto;
}

.home .hero-dashboard__topbar,
.home .hero-dashboard__stats span,
.home .hero-dashboard__table span {
    border-radius: 8px;
}

.home .hero-service-strip--v273 {
    border-radius: 8px;
    border-color: rgba(148, 189, 255, .28);
    background: rgba(255, 255, 255, .08);
    box-shadow: none;
}

.home .hero-service-strip--v273 article {
    border-radius: 8px;
}

.home .hero-service-strip--v273 h3 {
    color: #ffffff;
}

.home .hero-service-strip--v273 p {
    color: #d7e5f6;
}

.home .section:not(.hero):not(.ai-widget-section--phase7):not(.contact-section) {
    background: #f7faff;
}

.home .trust-strip {
    background: #071120;
}

.home .section-heading h2 {
    color: var(--vn-phase1-ink);
}

.home .section-heading p:not(.eyebrow) {
    color: var(--vn-phase1-muted);
}

.home .btn,
.home .project-action,
.home .level-card__details summary,
.home .contact-channel,
.home .faq-item,
.home .use-case-card,
.home .process-step,
.home .system-module,
.home .level-card,
.home .project-card,
.home .ai-advisor-note,
.home .ai-scenario-card {
    border-radius: 8px !important;
}

.home .services-section--phase7 .system-module--phase7,
.home .packages-section--phase7 .level-card,
.home .project-card--v6a,
.home .use-case-card,
.home .process-step,
.home .faq-item {
    border-color: var(--vn-phase1-border);
    background: #ffffff;
    box-shadow: 0 12px 30px rgba(8, 17, 31, .06);
}

.home .services-section--phase7 .system-module--primary {
    background: linear-gradient(145deg, var(--vn-phase1-navy) 0%, var(--vn-phase1-navy-2) 100%);
}

.home .packages-stage--v272 {
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 18px 44px rgba(8, 17, 31, .08);
}

.home .packages-section--phase7 .level-card__pricing {
    min-height: 104px;
    border-radius: 8px;
    background: var(--vn-phase1-navy);
}

.home .packages-section--phase7 .level-card__pricing strong {
    font-size: clamp(28px, 2.5vw, 40px);
}

.home .packages-section--phase7 .level-card__pricing span {
    font-size: 14px;
}

.home .packages-section--phase7 .level-card__support-meta:empty,
.home .packages-section--phase7 .level-card__pricing span:empty {
    display: none;
}

.home .ai-widget-section--phase7 {
    background:
        linear-gradient(rgba(56, 189, 248, .06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(56, 189, 248, .05) 1px, transparent 1px),
        linear-gradient(180deg, #071120 0%, #0c1c33 100%);
    background-size: 42px 42px, 42px 42px, auto;
}

.home .ai-widget-section--phase7 .ai-advisor-wrap {
    border-radius: 8px;
    border-color: rgba(148, 189, 255, .36);
    background: rgba(247, 250, 255, .96);
    box-shadow: 0 24px 54px rgba(2, 8, 23, .22);
}

.home .ai-widget-section--phase7 .section-heading h2 {
    font-size: clamp(28px, 3vw, 42px);
}

.home .ai-widget-section--phase7 .ai-advisor-demo {
    margin-top: 18px;
}

.home .ai-widget-section--phase7 .ai-scenario-grid {
    gap: 12px;
}

.home .ai-widget-section--phase7 .ai-scenario-card {
    padding: 16px;
}

.home .ai-widget-section--phase7 .ai-scenario-card h3 {
    font-size: clamp(18px, 1.35vw, 22px);
}

.home .projects-section--phase7 {
    padding-top: clamp(44px, 4.8vw, 68px);
}

.home .project-grid--v272 {
    gap: 14px;
}

.home .project-card--v6a .project-media {
    aspect-ratio: 16 / 9;
    border-radius: 0;
}

.home .project-card--v6a .project-card__body {
    padding: 18px;
}

.home .project-card--v6a h3 {
    font-size: clamp(20px, 1.55vw, 24px);
}

.home .use-cases-section--phase7 .use-case-card {
    cursor: pointer;
}

.home .use-case-card.is-active {
    border-color: rgba(31, 102, 255, .46);
    box-shadow: 0 18px 40px rgba(31, 102, 255, .12);
}

.home .use-case-card span,
.home .project-card__topline span,
.home .ai-scenario-card__tag,
.home .ai-advisor-note__label {
    background: #eaf3ff;
    color: #1759d6;
}

.home .process-section {
    background: #ffffff;
}

.home .process-step__number {
    color: var(--vn-phase1-blue);
}

.home .process-step h3,
.home .faq-item summary {
    color: var(--vn-phase1-ink);
}

.home .faq-section .vn-container--compact {
    max-width: 980px;
}

.home .faq-list--v272 {
    display: grid;
    gap: 10px;
}

.home .faq-item summary {
    min-height: 56px;
    padding: 16px 18px;
}

.home .contact-conversion {
    border-radius: 8px;
    background:
        linear-gradient(rgba(56, 189, 248, .06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(56, 189, 248, .05) 1px, transparent 1px),
        linear-gradient(145deg, var(--vn-phase1-navy) 0%, #102947 100%);
    background-size: 38px 38px, 38px 38px, auto;
}

.home .contact-conversion .section-heading h2,
.home .contact-conversion h3,
.home .contact-conversion strong {
    color: #ffffff;
}

.home .contact-conversion .section-heading p:not(.eyebrow),
.home .contact-conversion p,
.home .contact-conversion li {
    color: #d8e6f5;
}

.home .contact-helper,
.home .contact-next-step,
.home .contact-method-card,
.home .contact-response-card,
.home .contact-channel {
    border-radius: 8px;
    border-color: rgba(148, 189, 255, .26);
    background: rgba(255, 255, 255, .08);
}

.home .site-footer {
    background: #071120;
}

.scroll-top {
    position: fixed;
    left: max(18px, env(safe-area-inset-left));
    right: auto;
    bottom: max(18px, env(safe-area-inset-bottom));
    z-index: 70;
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    border: 1px solid rgba(148, 189, 255, .48);
    border-radius: 8px;
    background: #0b1b32;
    color: #ffffff;
    box-shadow: 0 14px 34px rgba(2, 8, 23, .24);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(8px);
    transition: opacity .18s ease, visibility .18s ease, transform .18s ease, background .18s ease;
}

.scroll-top span,
.scroll-top svg {
    display: block;
    width: 20px;
    height: 20px;
    fill: currentColor;
}

.scroll-top.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none;
}

.scroll-top:hover,
.scroll-top:focus-visible {
    background: var(--vn-phase1-blue);
}

@media (min-width: 900px) {
    .home .ai-widget-section--phase7 .ai-scenario-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .home .ai-widget-section--phase7 .ai-advisor-note {
        grid-column: 1 / -1;
    }
}

@media (max-width: 1180px) {
    .home .site-header__cta {
        display: none;
    }
}

@media (max-width: 760px) {
    .home .site-header--v279 .site-header__inner {
        min-height: 62px;
    }

    .home .site-brand__logo {
        height: 40px;
        min-width: 40px;
        padding: 4px;
    }

    .home .site-brand__logo img {
        max-width: 118px;
        max-height: 31px;
    }

    .home .hero--v25.hero--v26.hero--v27.hero--v272.hero--v273.hero--v274.hero--v275 {
        padding-top: 34px;
    }

    .home .hero__grid--v273 {
        grid-template-columns: minmax(0, 1fr);
        gap: 22px;
    }

    .home .hero__content--v273 h1 {
        font-size: clamp(34px, 10vw, 43px);
    }

    .home .hero-dashboard--phase7 {
        max-width: 100%;
    }

    .home .hero-dashboard__shell,
    .home .ai-widget-section--phase7 .ai-advisor-wrap,
    .home .packages-stage--v272,
    .home .contact-conversion {
        padding: 16px;
    }

    .home .hero-service-strip--v273 {
        grid-template-columns: minmax(0, 1fr);
    }

    .home .ai-widget-section--phase7 .ai-scenario-grid,
    .home .project-grid--v272,
    .home .use-case-grid--v272,
    .home .process-steps--v272 {
        grid-template-columns: minmax(0, 1fr);
    }

    .home .scroll-top {
        display: inline-grid;
        left: max(12px, env(safe-area-inset-left));
        bottom: max(12px, env(safe-area-inset-bottom));
        transform: translateY(6px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .scroll-top {
        transition: none;
        transform: none;
    }

    .scroll-top.is-visible {
        transform: none;
    }
}

/* VNTech 2.8.7 hero contrast hotfix from browser screenshot QA. */
.home .hero--v25.hero--v26.hero--v27.hero--v272.hero--v273.hero--v274.hero--v275 .hero__text,
.home .hero--v25.hero--v26.hero--v27.hero--v272.hero--v273.hero--v274.hero--v275 .proof-row--v273 small,
.home .hero--v25.hero--v26.hero--v27.hero--v272.hero--v273.hero--v274.hero--v275 .hero-service-strip--v273 p,
.home .hero--v25.hero--v26.hero--v27.hero--v272.hero--v273.hero--v274.hero--v275 .hero-ai-card--v273 p,
.home .hero--v25.hero--v26.hero--v27.hero--v272.hero--v273.hero--v274.hero--v275 .hero-ai-card--v273 li {
    color: #d8e6f5 !important;
}

.home .hero--v25.hero--v26.hero--v27.hero--v272.hero--v273.hero--v274.hero--v275 .proof-row--v273 strong,
.home .hero--v25.hero--v26.hero--v27.hero--v272.hero--v273.hero--v274.hero--v275 .hero-service-strip--v273 h3,
.home .hero--v25.hero--v26.hero--v27.hero--v272.hero--v273.hero--v274.hero--v275 .hero-ai-card--v273 strong {
    color: #ffffff !important;
}

.home .hero--v25.hero--v26.hero--v27.hero--v272.hero--v273.hero--v274.hero--v275 .proof-row--v273 span,
.home .hero--v25.hero--v26.hero--v27.hero--v272.hero--v273.hero--v274.hero--v275 .hero-service-strip--v273 article {
    background: rgba(255, 255, 255, .09);
}

/* VNTech 2.8.8 Phase 1.1 production interaction and CTA refinement. */
:root {
    --vn-phase11-navy: #061225;
    --vn-phase11-navy-2: #0b1e37;
    --vn-phase11-ink: #0d1728;
    --vn-phase11-blue: #2563eb;
    --vn-phase11-cyan: #38bdf8;
    --vn-phase11-green: #16a34a;
    --vn-phase11-line: rgba(38, 75, 120, .16);
    --vn-phase11-soft: #f4f8fc;
}

html {
    overflow-x: clip;
}

body.home {
    overflow-x: clip;
}

.site-brand__dark {
    display: none;
    align-items: center;
    gap: 10px;
    min-height: 42px;
}

.site-brand__dark img {
    display: block;
    width: auto;
    max-width: 156px;
    max-height: 42px;
    object-fit: contain;
}

.site-brand__dark-mark,
.site-footer__mark--dark {
    display: inline-grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border: 1px solid rgba(56, 189, 248, .48);
    border-radius: 12px;
    color: #ffffff;
    background: rgba(37, 99, 235, .32);
    font-weight: 800;
}

.site-brand__dark-text {
    color: #ffffff;
    font-size: 20px;
    font-weight: 800;
}

.home .site-header--v279 {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 90;
    background: rgba(6, 18, 37, .64);
    border-bottom: 1px solid rgba(188, 219, 255, .18);
    color: #ffffff;
    backdrop-filter: blur(16px);
    box-shadow: none;
}

.admin-bar.home .site-header--v279 {
    top: 32px;
}

.home .site-header--v279.is-scrolled {
    background: rgba(255, 255, 255, .95);
    border-bottom-color: rgba(13, 23, 40, .1);
    color: var(--vn-phase11-ink);
    box-shadow: 0 14px 34px rgba(2, 8, 23, .12);
}

.home .site-header--v279:not(.is-scrolled) .site-brand__logo,
.home .site-header--v279:not(.is-scrolled) .site-brand__mark,
.home .site-header--v279:not(.is-scrolled) .site-brand__text {
    display: none;
}

.home .site-header--v279:not(.is-scrolled) .site-brand__dark {
    display: inline-flex;
}

.home .site-header--v279:not(.is-scrolled) .site-nav__menu a,
.home .site-header--v279:not(.is-scrolled) .site-header__contact a,
.home .site-header--v279:not(.is-scrolled) .menu-toggle {
    color: #ffffff;
}

.home .site-header--v279:not(.is-scrolled) .site-nav__menu a:hover,
.home .site-header--v279:not(.is-scrolled) .site-nav__menu a:focus-visible,
.home .site-header--v279:not(.is-scrolled) .site-nav__menu a.is-active {
    color: #bfdbfe;
}

.home .site-header--v279 .site-header__inner {
    min-height: 72px;
}

.home .site-header--v279:not(.is-scrolled) .site-header__inner {
    border-color: rgba(188, 219, 255, .2);
    background: rgba(6, 18, 37, .72) !important;
    box-shadow: none;
}

.home .site-header--v279.is-scrolled .site-header__inner {
    background: rgba(255, 255, 255, .96);
}

.home .hero--v25.hero--v26.hero--v27.hero--v272.hero--v273.hero--v274.hero--v275 {
    padding-top: calc(var(--vn-header-height, 72px) + 52px);
    padding-bottom: 74px;
    background:
        linear-gradient(rgba(56, 189, 248, .08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(56, 189, 248, .06) 1px, transparent 1px),
        linear-gradient(135deg, #051226 0%, #0b1d35 52%, #10243d 100%);
    background-size: 44px 44px, 44px 44px, auto;
}

.home .hero__grid--v273 {
    align-items: center;
    gap: clamp(28px, 4vw, 58px);
}

.home .hero__content--v273 {
    max-width: 680px;
}

.home .hero__content--v273 .eyebrow {
    color: #93c5fd;
    font-size: 12px;
    letter-spacing: 0;
}

.home .hero__content--v273 h1 {
    margin-top: 12px;
    color: #ffffff;
    font-size: clamp(42px, 6vw, 78px);
    line-height: .98;
    letter-spacing: 0;
}

.home .hero__content--v273 h1 mark {
    display: block;
    color: #7dd3fc;
    background: transparent;
}

.home .hero__text {
    max-width: 620px;
    margin-top: 20px;
    font-size: clamp(17px, 1.8vw, 20px);
    line-height: 1.65;
}

.home .hero__ownership {
    display: inline-flex;
    margin: 14px 0 0;
    padding: 9px 12px;
    border: 1px solid rgba(125, 211, 252, .3);
    border-radius: 12px;
    color: #dbeafe;
    background: rgba(15, 23, 42, .34);
    font-weight: 700;
}

.home .hero__actions {
    margin-top: 26px;
}

.home .hero-system-visual {
    min-width: 0;
}

.vn-motion-ready .home .hero-dashboard--phase7,
.vn-motion-ready .home .hero-ai-card--v273 {
    opacity: 1 !important;
    transform: none !important;
}

.home .hero-system-visual__shell,
.home .hero-ai-card--v273 {
    border: 1px solid rgba(148, 189, 255, .24);
    border-radius: 20px;
    background: rgba(255, 255, 255, .1);
    box-shadow: 0 24px 70px rgba(2, 8, 23, .32);
}

.home .hero-dashboard__topbar span,
.home .hero-dashboard__stats span,
.home .hero-system-visual__frame span {
    border-radius: 12px;
}

.home .hero-system-visual__frame {
    position: relative;
}

.home .hero-system-visual__frame::before {
    content: "";
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 12px;
    width: 2px;
    background: linear-gradient(#38bdf8, #16a34a);
}

.home .hero-system-visual__frame span {
    position: relative;
    padding-left: 26px;
}

.home .trust-strip--phase7 {
    background: #ffffff;
    border-bottom: 1px solid var(--vn-phase11-line);
}

.home .trust-strip__inner {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    padding-top: 18px;
    padding-bottom: 18px;
}

.home .trust-strip__item {
    border-radius: 14px;
    background: var(--vn-phase11-soft);
}

.home .service-outcome-lead,
.home .service-support-row,
.home .fit-finder-result {
    border: 1px solid var(--vn-phase11-line);
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 16px 42px rgba(15, 23, 42, .07);
}

.home .service-support-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 14px;
    margin-top: 18px;
    padding: 18px;
}

.home .service-support-row h3,
.home .service-support-row p {
    margin: 0;
}

.home .service-support-row p {
    margin-top: 5px;
    color: #42526a;
}

.home .system-module--phase7 {
    border-radius: 14px;
}

.home .system-module--phase7.system-module--primary:not(.is-featured) {
    border-color: var(--vn-phase11-line);
    background: #ffffff;
}

.home .level-card--phase7 {
    border-radius: 18px;
}

.home .level-card__details summary {
    min-height: 48px;
}

.home .level-card__support-row span {
    line-height: 1.35;
}

.home .level-card__actions .btn {
    min-height: 46px;
}

.home .ai-widget-section--phase7 .ai-advisor-wrap {
    border-radius: 20px;
    background:
        linear-gradient(rgba(37, 99, 235, .08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(37, 99, 235, .06) 1px, transparent 1px),
        #ffffff;
    background-size: 36px 36px, 36px 36px, auto;
}

.home .ai-scenario-card--v275 {
    border-radius: 14px;
}

.home .ai-scenario-card--v275.is-active {
    border-color: rgba(37, 99, 235, .45);
    box-shadow: 0 18px 48px rgba(37, 99, 235, .16);
}

.home .project-card--phase7,
.home .project-spotlight--v6a {
    border-radius: 18px;
}

.home .project-card__actions {
    align-items: stretch;
}

.home .project-action {
    min-height: 42px;
    justify-content: center;
}

.home .fit-finder-result {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px 18px;
    align-items: center;
    margin-top: 18px;
    padding: 18px;
}

.home .fit-finder-result > span {
    grid-column: 1 / -1;
    color: var(--vn-phase11-blue);
    font-size: 12px;
    font-weight: 800;
}

.home .fit-finder-result h3,
.home .fit-finder-result p {
    margin: 0;
}

.home .fit-finder-result p {
    color: #42526a;
}

.home .fit-finder-result strong {
    justify-self: start;
    padding: 8px 10px;
    border-radius: 10px;
    color: #075985;
    background: #e0f2fe;
}

.home .fit-finder-result.is-updated {
    outline: 2px solid rgba(37, 99, 235, .28);
    outline-offset: 2px;
}

.home .use-case-card--phase7[aria-selected="true"] {
    border-color: rgba(37, 99, 235, .45);
}

.home .process-section {
    background:
        linear-gradient(rgba(56, 189, 248, .06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(56, 189, 248, .04) 1px, transparent 1px),
        var(--vn-phase11-navy);
    background-size: 42px 42px, 42px 42px, auto;
}

.home .process-section .section-heading .eyebrow {
    color: #7dd3fc;
}

.home .process-section .section-heading h2,
.home .process-step h3 {
    color: #ffffff;
}

.home .process-section .section-heading p:not(.eyebrow),
.home .process-step p {
    color: #d8e6f5;
}

.home .process-step--v272 {
    position: relative;
    border-color: rgba(148, 189, 255, .22);
    border-radius: 14px;
    background: rgba(255, 255, 255, .08);
}

.home .process-step--v272 + .process-step--v272::before {
    content: "";
    position: absolute;
    top: 32px;
    left: -26px;
    width: 26px;
    height: 1px;
    background: rgba(125, 211, 252, .4);
}

.home .process-step__number {
    color: #7dd3fc;
}

.home .faq-item summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.home .faq-item summary::after {
    content: "+";
    flex: 0 0 auto;
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    color: var(--vn-phase11-blue);
    background: #eaf3ff;
    font-weight: 800;
}

.home .faq-item[open] summary::after {
    content: "-";
}

.home .contact-method-card__actions .btn,
.home .contact-method-card__actions button {
    min-height: 46px;
}

.home .contact-helper__list li {
    border-color: rgba(148, 189, 255, .35);
    background: rgba(15, 36, 64, .72);
    color: #ffffff;
}

.home .site-footer__brand-row {
    gap: 12px;
}

.home .site-footer__logo--dark img {
    max-width: 148px;
    max-height: 46px;
    object-fit: contain;
}

@media (max-width: 900px) {
    .admin-bar.home .site-header--v279 {
        top: 46px;
    }

    .home .trust-strip__inner,
    .home .fit-finder-result {
        grid-template-columns: minmax(0, 1fr);
    }

    .home .fit-finder-result .btn {
        justify-self: stretch;
    }

    .home .process-step--v272 + .process-step--v272::before {
        display: none;
    }
}

@media (max-width: 760px) {
    .home .site-header--v279 .site-header__inner {
        min-height: 64px;
    }

    .home .site-brand__dark {
        min-height: 38px;
    }

    .home .site-brand__dark-mark {
        width: 36px;
        height: 36px;
    }

    .home .site-brand__dark-text {
        font-size: 18px;
    }

    .home .hero--v25.hero--v26.hero--v27.hero--v272.hero--v273.hero--v274.hero--v275 {
        padding-top: calc(var(--vn-header-height, 64px) + 34px);
        padding-bottom: 46px;
    }

    .home .hero__content--v273 h1 {
        font-size: clamp(36px, 11vw, 48px);
        line-height: 1.02;
    }

    .home .hero__actions {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }

    .home .hero-dashboard__copy h2 {
        max-width: 100%;
        font-size: 24px;
        line-height: 1.12;
        overflow-wrap: anywhere;
    }

    .home .service-support-row {
        grid-template-columns: minmax(0, 1fr);
    }

    .home .project-card__actions {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (prefers-reduced-motion: reduce) {
    .home .fit-finder-result {
        transition: none;
    }
}