:root {
    --navy: #0b2347;
    --navy-2: #122f5e;
    --navy-3: #07182f;
    --green: #4b9f18;
    --green-2: #6fbd2a;
    --green-soft: #eaf4df;
    --cream: #f7f5ef;
    --paper: #fff;
    --ink: #101828;
    --muted: #667085;
    --line: #e5e9ee;
    --line-dark: rgba(255,255,255,.14);
    --shadow: 0 20px 55px rgba(11,35,71,.10);
    --shadow-sm: 0 10px 30px rgba(11,35,71,.08);
    --radius: 24px;
    --radius-sm: 14px;
    --container: 1220px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--cream); font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.container { width: min(calc(100% - 40px), var(--container)); margin-inline: auto; }
.section { padding: 110px 0; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; font-size: 11px; line-height: 1; letter-spacing: .18em; font-weight: 800; color: var(--green); text-transform: uppercase; }
.eyebrow > span { width: 30px; height: 2px; border-radius: 99px; background: currentColor; }
.eyebrow.light { color: #9ce451; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { color: var(--navy); letter-spacing: -.035em; }
p { color: var(--muted); line-height: 1.75; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 52px; padding: 0 24px; border-radius: 999px; border: 1px solid transparent; font-weight: 750; letter-spacing: -.01em; transition: transform .22s ease, box-shadow .22s ease, background .22s ease, border-color .22s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { color: #fff; background: linear-gradient(135deg, var(--green), #73be2a); box-shadow: 0 14px 32px rgba(75,159,24,.24); }
.button-primary:hover { box-shadow: 0 18px 38px rgba(75,159,24,.34); }
.button-dark { color: #fff; background: var(--navy); }
.button-light { color: var(--navy); background: #fff; box-shadow: 0 12px 30px rgba(0,0,0,.12); }
.button-ghost { color: var(--navy); border-color: #cfd7e2; background: rgba(255,255,255,.55); }
.button-sm { min-height: 42px; padding: 0 18px; font-size: 13px; }
.button-full { width: 100%; }
.button-muted { background: #f2f4f7; color: var(--navy); }
.text-link { display: inline-flex; align-items: center; gap: 10px; font-weight: 750; color: var(--navy); }
.text-link span { color: var(--green); }

/* Header */
.announcement { background: var(--navy-3); color: rgba(255,255,255,.8); font-size: 12px; }
.announcement-inner { min-height: 36px; display: flex; align-items: center; justify-content: center; gap: 12px; letter-spacing: .02em; }
.announcement-inner a { color: #b7f074; font-weight: 750; margin-inline-start: 10px; }
.announcement-dot { opacity: .45; }
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(247,245,239,.92); backdrop-filter: blur(18px); border-bottom: 1px solid rgba(11,35,71,.07); }
.nav-shell { min-height: 82px; display: grid; grid-template-columns: 180px 1fr auto; align-items: center; gap: 24px; }
.brand img { width: 150px; height: 58px; object-fit: contain; object-position: left center; }
.primary-nav { display: flex; align-items: center; justify-content: center; gap: 28px; }
.primary-nav a { position: relative; font-size: 13px; font-weight: 700; color: #344054; padding: 30px 0; }
.primary-nav a::after { content: ""; position: absolute; inset-inline: 50%; bottom: 20px; height: 2px; background: var(--green); transition: inset .2s ease; }
.primary-nav a:hover::after, .primary-nav a.is-active::after { inset-inline: 0; }
.primary-nav a.is-active { color: var(--navy); }
.nav-actions { display: flex; align-items: center; gap: 12px; }
.language-switcher, .account-menu { position: relative; }
.language-button, .account-button { border: 0; background: transparent; display: flex; align-items: center; gap: 8px; color: #344054; font-weight: 700; }
.language-button { min-height: 40px; padding: 0 10px; border-radius: 10px; }
.language-button:hover { background: rgba(11,35,71,.05); }
.language-name { font-size: 12px; }
.chevron { font-size: 14px; color: #98a2b3; transform: translateY(-1px); }
.language-menu, .account-dropdown { position: absolute; top: calc(100% + 12px); inset-inline-end: 0; min-width: 205px; padding: 8px; background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); opacity: 0; visibility: hidden; transform: translateY(-8px); transition: .2s ease; }
[data-dropdown].is-open > [data-dropdown-menu] { opacity: 1; visibility: visible; transform: translateY(0); }
.language-menu a { display: grid; grid-template-columns: 30px 1fr 20px; align-items: center; gap: 8px; min-height: 42px; padding: 0 10px; border-radius: 10px; font-size: 13px; }
.language-menu a:hover, .language-menu a.is-current { background: var(--green-soft); color: var(--navy); }
.language-menu .flag { font-size: 20px; }
.language-menu .check { color: var(--green); font-weight: 900; }
.icon-action { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid #d7dde5; border-radius: 50%; background: #fff; position: relative; }
.icon-action svg { width: 19px; height: 19px; fill: none; stroke: var(--navy); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.cart-badge { position: absolute; top: -5px; inset-inline-end: -5px; min-width: 20px; height: 20px; padding: 0 5px; display: grid; place-items: center; border: 2px solid var(--cream); border-radius: 999px; background: var(--green); color: #fff; font-size: 10px; font-weight: 800; }
.login-link { font-size: 13px; font-weight: 750; color: var(--navy); }
.account-button { padding: 4px; }
.avatar { width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; background: linear-gradient(135deg, var(--navy), #24528d); color: #fff; font-weight: 800; }
.account-copy { display: flex; flex-direction: column; text-align: start; }
.account-copy strong { font-size: 12px; }
.account-copy small { font-size: 10px; color: var(--muted); }
.account-dropdown a, .account-dropdown button { width: 100%; display: block; padding: 11px 12px; border: 0; border-radius: 10px; background: none; text-align: start; color: #344054; font-size: 13px; }
.account-dropdown a:hover, .account-dropdown button:hover { background: #f2f4f7; }
.mobile-menu-button { display: none; width: 42px; height: 42px; border: 0; border-radius: 12px; background: #fff; padding: 10px; }
.mobile-menu-button span { display: block; height: 2px; margin: 5px 0; background: var(--navy); }

/* Toast */
.toast-stack { position: fixed; z-index: 100; top: 120px; inset-inline-end: 24px; width: min(390px, calc(100% - 32px)); }
.toast { display: grid; grid-template-columns: 28px 1fr 24px; align-items: center; gap: 10px; padding: 14px 16px; border-radius: 14px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }
.toast > span { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--green); font-weight: 900; }
.toast p { margin: 0; color: #344054; line-height: 1.4; font-size: 13px; }
.toast button { border: 0; background: transparent; color: #98a2b3; font-size: 20px; }
.toast-error > span { background: #d92d20; }
.toast.is-closing { opacity: 0; transform: translateY(-12px); transition: .2s ease; }

/* Hero */
.hero-section { position: relative; overflow: hidden; color: #fff; background: radial-gradient(circle at 80% 15%, rgba(96,184,37,.26), transparent 30%), radial-gradient(circle at 10% 80%, rgba(34,94,159,.34), transparent 30%), linear-gradient(135deg, #06162b 0%, #0b2347 53%, #0f2b52 100%); }
.hero-noise { position: absolute; inset: 0; opacity: .05; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E"); }
.hero-grid { position: relative; min-height: 690px; display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: 60px; padding-top: 40px; padding-bottom: 55px; }
.hero-copy { max-width: 660px; }
.hero-copy h1 { margin: 22px 0 24px; color: #fff; font-size: clamp(48px, 6vw, 82px); line-height: .98; letter-spacing: -.055em; }
.hero-copy > p { max-width: 640px; margin-bottom: 34px; color: rgba(255,255,255,.72); font-size: 18px; line-height: 1.7; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-actions .button-ghost { color: #fff; border-color: rgba(255,255,255,.25); background: rgba(255,255,255,.06); }
.hero-proof { margin-top: 42px; display: flex; align-items: center; gap: 14px; }
.proof-avatars { display: flex; }
.proof-avatars span { width: 34px; height: 34px; display: grid; place-items: center; margin-inline-start: -7px; border: 2px solid var(--navy); border-radius: 50%; background: #fff; color: var(--navy); font-size: 9px; font-weight: 900; }
.proof-avatars span:first-child { margin-inline-start: 0; background: var(--green); color: #fff; }
.hero-proof strong, .hero-proof small { display: block; }
.hero-proof strong { color: #fff; font-size: 13px; }
.hero-proof small { margin-top: 3px; color: rgba(255,255,255,.56); font-size: 11px; }
.hero-visual { position: relative; min-height: 510px; display: grid; place-items: center; }
.global-orbit { position: relative; width: min(500px, 100%); aspect-ratio: 1; display: grid; place-items: center; }
.global-orbit::before { content: ""; position: absolute; inset: 16%; border-radius: 50%; background: radial-gradient(circle at 35% 32%, rgba(255,255,255,.14), transparent 28%), linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.01)); border: 1px solid rgba(255,255,255,.12); box-shadow: inset 0 0 70px rgba(114,192,46,.08), 0 0 100px rgba(33,84,143,.25); }
.orbit-ring { position: absolute; inset: 8%; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; }
.orbit-one { transform: rotate(18deg) scaleY(.58); }
.orbit-two { transform: rotate(-38deg) scaleY(.67); border-color: rgba(122,207,59,.24); }
.globe-core { position: relative; z-index: 3; width: 210px; height: 210px; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 50%; background: rgba(255,255,255,.96); box-shadow: 0 28px 80px rgba(0,0,0,.28); }
.globe-core img { width: 155px; height: 120px; object-fit: contain; }
.globe-core span { color: var(--navy); font-size: 9px; font-weight: 900; letter-spacing: .22em; }
.orbit-node { position: absolute; z-index: 4; min-width: 78px; padding: 10px 12px; border: 1px solid rgba(255,255,255,.18); border-radius: 13px; background: rgba(7,24,47,.78); box-shadow: 0 12px 28px rgba(0,0,0,.22); backdrop-filter: blur(14px); }
.orbit-node b, .orbit-node small { display: block; }
.orbit-node b { color: #bdf081; font-size: 13px; }
.orbit-node small { color: rgba(255,255,255,.65); font-size: 9px; margin-top: 2px; }
.node-europe { top: 10%; left: 35%; }
.node-africa { bottom: 12%; left: 16%; }
.node-mena { top: 35%; right: 5%; }
.node-asia { bottom: 18%; right: 12%; }
.orbit-pulse { position: absolute; width: 9px; height: 9px; border-radius: 50%; background: #b7f074; box-shadow: 0 0 0 9px rgba(183,240,116,.10); }
.pulse-one { top: 27%; left: 13%; }
.pulse-two { bottom: 25%; right: 0; }
.floating-card { position: absolute; z-index: 5; display: flex; align-items: center; gap: 10px; padding: 12px 14px; border: 1px solid rgba(255,255,255,.16); border-radius: 14px; background: rgba(7,24,47,.82); color: #fff; box-shadow: 0 18px 45px rgba(0,0,0,.25); backdrop-filter: blur(16px); }
.floating-card small, .floating-card strong { display: block; }
.floating-card small { color: rgba(255,255,255,.55); font-size: 9px; text-transform: uppercase; letter-spacing: .1em; }
.floating-card strong { margin-top: 2px; font-size: 13px; }
.floating-card-top { top: 18%; left: -2%; }
.floating-card-bottom { bottom: 12%; right: -1%; flex-direction: column; align-items: flex-start; }
.status-dot { width: 9px; height: 9px; border-radius: 50%; background: #86d43f; box-shadow: 0 0 0 6px rgba(134,212,63,.13); }
.mini-chart { height: 30px; display: flex; align-items: end; gap: 3px; }
.mini-chart i { width: 7px; border-radius: 4px; background: var(--green-2); }
.mini-chart i:nth-child(1){height:35%}.mini-chart i:nth-child(2){height:55%}.mini-chart i:nth-child(3){height:48%}.mini-chart i:nth-child(4){height:76%}.mini-chart i:nth-child(5){height:100%}
.hero-stats { position: relative; z-index: 3; display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid rgba(255,255,255,.12); }
.hero-stats > div { display: flex; align-items: baseline; gap: 12px; padding: 24px 20px; border-inline-end: 1px solid rgba(255,255,255,.12); }
.hero-stats > div:first-child { padding-inline-start: 0; }
.hero-stats strong { color: #fff; font-size: 27px; }
.hero-stats span { color: rgba(255,255,255,.56); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.logo-strip { background: #fff; border-bottom: 1px solid var(--line); }
.logo-strip-inner { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 20px; color: #98a2b3; font-size: 10px; font-weight: 850; letter-spacing: .14em; }
.logo-strip-inner i { width: 4px; height: 4px; border-radius: 50%; background: var(--green); }

/* Headings and product cards */
.section-heading { margin-bottom: 48px; }
.section-heading h2 { margin: 14px 0 0; font-size: clamp(36px, 5vw, 58px); line-height: 1.05; }
.section-heading p { max-width: 560px; margin-bottom: 12px; }
.split-heading { display: grid; grid-template-columns: 1fr .7fr; align-items: end; gap: 40px; }
.centered { max-width: 800px; margin-inline: auto; text-align: center; }
.centered .eyebrow { justify-content: center; }
.centered p { margin: 16px auto 0; }
.product-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.product-card { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: 0 8px 26px rgba(11,35,71,.035); transition: transform .26s ease, box-shadow .26s ease; }
.product-card:hover { transform: translateY(-7px); box-shadow: var(--shadow); }
.product-visual { position: relative; min-height: 320px; display: grid; place-items: center; overflow: hidden; background: linear-gradient(145deg, #f5f7f2, #eaf0e4); }
.product-visual::after { content: ""; position: absolute; width: 210px; height: 210px; border: 1px solid rgba(11,35,71,.08); border-radius: 50%; }
.product-visual img { position: relative; z-index: 2; width: 78%; height: 260px; object-fit: contain; filter: drop-shadow(0 24px 28px rgba(11,35,71,.16)); transition: transform .3s ease; }
.product-card:hover .product-visual img { transform: scale(1.04) rotate(-1deg); }
.product-badge { position: absolute; z-index: 4; top: 16px; inset-inline-start: 16px; padding: 7px 11px; border-radius: 999px; background: var(--green); color: #fff; font-size: 9px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.product-view { position: absolute; z-index: 4; top: 16px; inset-inline-end: 16px; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.85); color: var(--navy); opacity: 0; transform: translateY(6px); transition: .25s ease; }
.product-card:hover .product-view { opacity: 1; transform: translateY(0); }
.product-card-body { padding: 22px; }
.product-meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #98a2b3; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.product-card h3 { margin: 10px 0 8px; font-size: 21px; line-height: 1.2; }
.product-card h3 a:hover { color: var(--green); }
.product-card p { min-height: 50px; margin-bottom: 18px; font-size: 13px; line-height: 1.6; }
.product-card-footer { padding-top: 16px; border-top: 1px solid var(--line); display: flex; align-items: end; justify-content: space-between; }
.product-price small, .product-price strong { display: block; }
.product-price small { color: #98a2b3; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.product-price strong { margin-top: 3px; color: var(--navy); font-size: 20px; }
.round-add { width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--navy); color: #fff; font-size: 23px; transition: .2s; }
.round-add:hover { background: var(--green); transform: rotate(90deg); }
.empty-state { grid-column: 1/-1; padding: 70px 20px; text-align: center; color: var(--muted); border: 1px dashed #cfd7e2; border-radius: 20px; background: #fff; }

/* Model section */
.model-section { position: relative; overflow: hidden; background: var(--navy); color: #fff; }
.model-section::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 10% 80%, rgba(84,169,33,.16), transparent 30%); }
.model-grid { position: relative; display: grid; grid-template-columns: .7fr 1.3fr; gap: 80px; align-items: center; }
.model-intro h2 { margin: 18px 0 20px; color: #fff; font-size: clamp(40px,5vw,60px); line-height: 1.05; }
.model-intro p { color: rgba(255,255,255,.62); }
.model-layers { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.model-card { position: relative; padding: 28px; min-height: 260px; border: 1px solid rgba(255,255,255,.13); border-radius: 22px; background: rgba(255,255,255,.055); }
.model-card.primary-model { grid-row: span 2; min-height: 540px; display: flex; flex-direction: column; justify-content: flex-end; background: linear-gradient(165deg, rgba(117,200,52,.19), rgba(255,255,255,.05)); }
.model-index { position: absolute; top: 24px; inset-inline-end: 24px; color: rgba(255,255,255,.28); font-size: 11px; letter-spacing: .15em; }
.model-icon { width: 52px; height: 52px; display: grid; place-items: center; margin-bottom: 24px; border-radius: 16px; background: #fff; color: var(--navy); font-size: 24px; }
.model-card h3 { color: #fff; font-size: 24px; }
.model-card p { color: rgba(255,255,255,.58); font-size: 13px; }
.model-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 16px; }
.model-tags span { padding: 6px 9px; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; color: rgba(255,255,255,.7); font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }

/* Services */
.services-section { background: #fff; }
.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.service-card { position: relative; min-height: 290px; padding: 28px; border: 1px solid var(--line); border-radius: 22px; background: #fff; transition: .25s ease; }
.service-card:hover { transform: translateY(-5px); border-color: rgba(75,159,24,.35); box-shadow: var(--shadow-sm); }
.service-number { position: absolute; top: 22px; inset-inline-end: 22px; color: #c7ced7; font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.service-icon { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 17px; background: var(--green-soft); color: var(--green); font-size: 22px; font-weight: 900; }
.service-card h3 { margin: 54px 0 12px; font-size: 22px; }
.service-card p { font-size: 13px; }
.service-card > a { position: absolute; bottom: 25px; inset-inline-end: 26px; color: var(--green); font-size: 20px; }

/* Regions */
.regions-section { background: var(--cream); }
.regions-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 70px; align-items: center; }
.regions-copy h2 { margin: 16px 0 20px; font-size: clamp(40px,5vw,60px); line-height: 1.05; }
.region-list { margin-top: 34px; border-top: 1px solid #d6dce3; }
.region-list a { display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 14px; padding: 15px 0; border-bottom: 1px solid #d6dce3; color: var(--navy); font-weight: 700; }
.region-list a span { color: #98a2b3; font-size: 10px; letter-spacing: .12em; }
.region-list a b { color: var(--green); transition: transform .2s; }
.region-list a:hover b { transform: translate(3px,-3px); }
.world-panel { position: relative; min-height: 590px; overflow: hidden; border-radius: 30px; background: linear-gradient(145deg, #07182f, #0f315d); box-shadow: var(--shadow); }
.world-grid-lines { position: absolute; inset: 0; opacity: .16; background-image: linear-gradient(rgba(255,255,255,.2) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.2) 1px, transparent 1px); background-size: 48px 48px; }
.world-title { position: absolute; z-index: 2; top: 34px; left: 34px; }
.world-title span, .world-title strong { display: block; }
.world-title span { color: #9edb69; font-size: 9px; font-weight: 850; letter-spacing: .2em; }
.world-title strong { margin-top: 7px; color: #fff; font-size: 23px; }
.world-map-art { position: absolute; inset: 100px 35px 90px; }
.continent { position: absolute; display: block; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.1); filter: drop-shadow(0 12px 20px rgba(0,0,0,.12)); }
.c1 { width: 27%; height: 27%; left: 2%; top: 22%; border-radius: 58% 42% 50% 50%; transform: rotate(-12deg); }
.c2 { width: 16%; height: 33%; left: 25%; top: 48%; border-radius: 44% 56% 60% 40%; transform: rotate(15deg); }
.c3 { width: 13%; height: 18%; left: 45%; top: 22%; border-radius: 50%; }
.c4 { width: 25%; height: 29%; left: 55%; top: 26%; border-radius: 60% 40% 45% 55%; transform: rotate(-6deg); }
.c5 { width: 15%; height: 26%; left: 48%; top: 48%; border-radius: 45% 55% 60% 40%; transform: rotate(9deg); }
.c6 { width: 13%; height: 14%; right: 1%; bottom: 8%; border-radius: 50%; transform: rotate(-12deg); }
.map-pin { position: absolute; z-index: 2; width: 9px; height: 9px; border-radius: 50%; background: #a9ec67; box-shadow: 0 0 0 8px rgba(169,236,103,.12); }
.p1{left:18%;top:26%}.p2{left:31%;top:59%}.p3{left:51%;top:30%}.p4{left:56%;top:49%}.p5{left:69%;top:32%}.p6{left:81%;top:36%}.p7{right:6%;bottom:12%}
.world-legend { position: absolute; bottom: 30px; left: 34px; right: 34px; display: flex; gap: 25px; color: rgba(255,255,255,.55); font-size: 10px; }
.world-legend div { display: flex; align-items: center; gap: 8px; }
.world-legend span { width: 8px; height: 8px; border-radius: 50%; background: #a9ec67; }
.world-legend div:last-child span { background: rgba(255,255,255,.38); }

.partner-cta-section { padding: 0 0 110px; }
.partner-cta { position: relative; overflow: hidden; min-height: 330px; padding: 58px 64px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 50px; border-radius: 30px; background: linear-gradient(135deg, var(--navy), #123e74); color: #fff; }
.partner-cta::after { content: ""; position: absolute; width: 420px; height: 420px; right: -150px; top: -180px; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; box-shadow: 0 0 0 70px rgba(255,255,255,.025); }
.partner-cta-mark { position: absolute; inset-inline-end: 16%; top: 50%; transform: translateY(-50%); color: rgba(255,255,255,.025); font-size: 270px; font-weight: 900; }
.partner-cta h2 { position: relative; margin: 15px 0 14px; max-width: 700px; color: #fff; font-size: clamp(40px,5vw,58px); line-height: 1.05; }
.partner-cta p { position: relative; max-width: 700px; color: rgba(255,255,255,.62); }
.partner-cta .button { position: relative; z-index: 2; }

/* Footer */
.site-footer { padding: 75px 0 22px; background: #06162b; color: #fff; }
.footer-grid { display: grid; grid-template-columns: 1.6fr .65fr .65fr 1fr; gap: 55px; padding-bottom: 55px; }
.footer-brand img { width: 175px; height: 92px; object-fit: contain; object-position: left center; filter: brightness(0) invert(1); opacity: .95; }
.footer-brand p { max-width: 390px; color: rgba(255,255,255,.55); font-size: 13px; }
.footer-regions { display: flex; flex-wrap: wrap; gap: 7px; }
.footer-regions span { padding: 6px 8px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; color: rgba(255,255,255,.5); font-size: 8px; letter-spacing: .1em; }
.footer-column h3, .footer-newsletter h3 { color: #fff; font-size: 13px; letter-spacing: .02em; }
.footer-column a { display: block; margin: 12px 0; color: rgba(255,255,255,.55); font-size: 12px; }
.footer-column a:hover { color: #b5ed79; }
.footer-newsletter p { color: rgba(255,255,255,.52); font-size: 12px; }
.newsletter-form { display: flex; padding: 5px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; background: rgba(255,255,255,.05); }
.newsletter-form input { flex: 1; min-width: 0; padding: 0 12px; border: 0; outline: 0; background: transparent; color: #fff; font-size: 12px; }
.newsletter-form button { width: 38px; height: 38px; border: 0; border-radius: 50%; background: var(--green); color: #fff; }
.footer-bottom { min-height: 54px; padding-top: 20px; display: flex; justify-content: space-between; align-items: center; border-top: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.36); font-size: 10px; }
.footer-bottom div { display: flex; gap: 20px; }

/* Inner page hero */
.page-hero, .network-hero, .about-hero, .partner-hero { color: #fff; background: radial-gradient(circle at 80% 20%, rgba(102,191,40,.22), transparent 28%), linear-gradient(135deg, #07182f, #0f315d); }
.page-hero .container { padding-top: 90px; padding-bottom: 95px; }
.page-hero h1 { max-width: 800px; margin: 18px 0 16px; color: #fff; font-size: clamp(44px,6vw,70px); line-height: 1.02; }
.page-hero p { max-width: 700px; margin: 0; color: rgba(255,255,255,.65); font-size: 17px; }
.compact-page-hero .container { padding-top: 105px; padding-bottom: 105px; }
.mini-page-hero .container { padding-top: 70px; padding-bottom: 72px; }
.mini-page-hero h1 { font-size: clamp(38px,5vw,56px); }

.catalog-toolbar { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.search-box { flex: 1; min-width: 240px; height: 52px; display: flex; align-items: center; gap: 10px; padding: 0 16px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.search-box svg { width: 18px; height: 18px; fill: none; stroke: #98a2b3; stroke-width: 1.8; }
.search-box input { width: 100%; border: 0; outline: 0; background: transparent; }
.catalog-toolbar select { height: 52px; min-width: 210px; padding: 0 40px 0 15px; border: 1px solid var(--line); border-radius: 14px; background: #fff; color: #344054; }
.clear-filter { color: #d92d20; font-size: 12px; font-weight: 700; }
.catalog-meta { margin-bottom: 22px; display: flex; justify-content: space-between; color: #98a2b3; font-size: 11px; text-transform: uppercase; letter-spacing: .09em; }
.catalog-grid { margin-top: 0; }
.pagination { margin-top: 42px; display: flex; justify-content: center; gap: 7px; }
.pagination a, .pagination span { min-width: 40px; height: 40px; padding: 0 10px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 11px; background: #fff; color: #344054; font-size: 12px; font-weight: 700; }
.pagination .is-current { border-color: var(--navy); background: var(--navy); color: #fff; }
.pagination .is-disabled { color: #c5cbd3; background: #f7f8fa; }

/* Product detail */
.product-detail-section { padding: 30px 0 100px; background: #fff; }
.breadcrumb { padding: 20px 0 34px; display: flex; align-items: center; gap: 10px; color: #98a2b3; font-size: 11px; }
.breadcrumb b { color: var(--navy); }
.product-detail-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 70px; align-items: center; }
.product-detail-visual { position: relative; min-height: 610px; display: grid; place-items: center; overflow: hidden; border-radius: 30px; background: radial-gradient(circle at 50% 45%, #fff, #edf3e9 60%); }
.product-detail-visual::before, .product-detail-visual::after { content: ""; position: absolute; border-radius: 50%; border: 1px solid rgba(11,35,71,.08); }
.product-detail-visual::before { width: 440px; height: 440px; }
.product-detail-visual::after { width: 330px; height: 330px; }
.product-detail-visual img { position: relative; z-index: 2; width: 76%; height: 460px; object-fit: contain; filter: drop-shadow(0 32px 35px rgba(11,35,71,.18)); }
.product-detail-code { position: absolute; top: 24px; left: 26px; color: #98a2b3; font-size: 10px; font-weight: 800; letter-spacing: .15em; }
.visual-certificates { position: absolute; z-index: 3; bottom: 24px; left: 24px; right: 24px; display: flex; flex-wrap: wrap; gap: 7px; }
.visual-certificates span { padding: 7px 10px; border-radius: 999px; background: rgba(255,255,255,.9); color: var(--navy); font-size: 9px; font-weight: 800; box-shadow: 0 5px 15px rgba(11,35,71,.08); }
.product-detail-meta { display: flex; gap: 12px; color: var(--green); font-size: 10px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.product-detail-meta span + span { color: #98a2b3; }
.product-detail-copy h1 { margin: 18px 0 20px; font-size: clamp(42px,5vw,66px); line-height: 1.02; }
.product-long-description { font-size: 16px; }
.detail-price-row { margin: 28px 0 24px; padding: 20px 0; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.detail-price-row small, .detail-price-row strong { display: block; }
.detail-price-row small { color: #98a2b3; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.detail-price-row strong { margin-top: 5px; color: var(--navy); font-size: 34px; }
.wholesale-note { display: flex; align-items: center; gap: 8px; color: var(--green); font-size: 12px; font-weight: 800; }
.wholesale-note span { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: var(--green-soft); }
.detail-facts { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.detail-facts div { padding: 15px; border-radius: 14px; background: #f7f8fa; }
.detail-facts small, .detail-facts strong { display: block; }
.detail-facts small { color: #98a2b3; font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.detail-facts strong { margin-top: 6px; color: var(--navy); font-size: 12px; }
.add-cart-form { margin: 24px 0; display: grid; grid-template-columns: 130px 1fr; gap: 12px; }
.add-cart-form label { color: #667085; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.add-cart-form input { width: 100%; height: 52px; margin-top: 7px; padding: 0 14px; border: 1px solid var(--line); border-radius: 13px; }
.add-cart-form .button { align-self: end; }
.trade-note { display: flex; gap: 14px; padding: 18px; border-radius: 15px; background: var(--green-soft); }
.trade-note > span { color: var(--green); font-size: 22px; }
.trade-note strong { display: block; color: var(--navy); font-size: 13px; }
.trade-note p { margin: 3px 0 0; font-size: 11px; line-height: 1.5; }
.related-section { background: var(--cream); }

/* Cart and checkout */
.cart-grid { display: grid; grid-template-columns: 1fr 360px; gap: 30px; align-items: start; }
.cart-items { display: grid; gap: 12px; }
.cart-item { position: relative; display: grid; grid-template-columns: 115px 1fr 145px 120px 24px; align-items: center; gap: 18px; padding: 16px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.cart-item-image { width: 115px; height: 105px; display: grid; place-items: center; border-radius: 14px; background: #eff4eb; }
.cart-item-image img { width: 88%; height: 88%; object-fit: contain; }
.cart-item-copy > span { color: #98a2b3; font-size: 9px; font-weight: 800; letter-spacing: .1em; }
.cart-item-copy h3 { margin: 6px 0 4px; font-size: 18px; }
.cart-item-copy small { color: var(--muted); font-size: 11px; }
.cart-quantity { display: flex; align-items: end; gap: 6px; }
.cart-quantity label { color: #98a2b3; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.cart-quantity input { width: 90px; height: 40px; display: block; margin-top: 5px; padding: 0 10px; border: 1px solid var(--line); border-radius: 10px; }
.cart-quantity button { width: 38px; height: 38px; border: 0; border-radius: 10px; background: #edf0f3; color: var(--navy); }
.cart-item-price { text-align: end; }
.cart-item-price small, .cart-item-price strong { display: block; }
.cart-item-price small { color: #98a2b3; font-size: 9px; }
.cart-item-price strong { margin-top: 5px; color: var(--navy); }
.remove-button { border: 0; background: transparent; color: #d92d20; font-size: 21px; }
.cart-bottom-actions { display: flex; align-items: center; justify-content: space-between; padding: 14px 2px; }
.cart-bottom-actions a, .cart-bottom-actions button { border: 0; background: none; color: var(--navy); font-size: 12px; font-weight: 750; }
.cart-bottom-actions button { color: #d92d20; }
.order-summary { position: sticky; top: 120px; padding: 28px; border-radius: 22px; background: var(--navy); color: #fff; box-shadow: var(--shadow); }
.order-summary h2 { margin-bottom: 24px; color: #fff; font-size: 23px; }
.summary-row { display: flex; justify-content: space-between; gap: 20px; padding: 11px 0; color: rgba(255,255,255,.62); font-size: 12px; }
.summary-row strong { color: #fff; }
.summary-total { margin: 12px 0 24px; padding: 20px 0; display: flex; justify-content: space-between; border-top: 1px solid rgba(255,255,255,.14); color: #fff; }
.summary-total strong { font-size: 24px; }
.summary-note { margin: 16px 0 0; color: rgba(255,255,255,.42); font-size: 10px; text-align: center; line-height: 1.5; }
.wholesale-banner { margin-bottom: 18px; display: flex; gap: 14px; padding: 18px; border: 1px solid #c9e4b4; border-radius: 15px; background: var(--green-soft); }
.wholesale-banner > span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: var(--green); color: #fff; }
.wholesale-banner strong { color: var(--navy); }
.wholesale-banner p { margin: 3px 0 0; font-size: 11px; }
.empty-cart { padding: 90px 20px; text-align: center; border: 1px solid var(--line); border-radius: 24px; background: #fff; }
.empty-cart-icon { width: 70px; height: 70px; display: grid; place-items: center; margin: 0 auto 18px; border-radius: 50%; background: var(--green-soft); color: var(--green); font-size: 30px; }
.empty-cart h2 { font-size: 28px; }
.checkout-grid { display: grid; grid-template-columns: 1fr 390px; gap: 32px; align-items: start; }
.card-surface { border: 1px solid var(--line); border-radius: 22px; background: #fff; box-shadow: 0 8px 30px rgba(11,35,71,.04); }
.checkout-form { padding: 34px; }
.form-section + .form-section { margin-top: 32px; padding-top: 30px; border-top: 1px solid var(--line); }
.form-section-heading { margin-bottom: 22px; display: flex; gap: 14px; }
.form-section-heading > span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; background: var(--green-soft); color: var(--green); font-size: 10px; font-weight: 900; }
.form-section-heading h2 { margin-bottom: 4px; font-size: 20px; }
.form-section-heading p { margin: 0; font-size: 11px; line-height: 1.5; }
.form-grid { display: grid; gap: 18px; }
.form-grid.two-cols { grid-template-columns: repeat(2,1fr); }
.form-grid .span-2 { grid-column: 1/-1; }
label { display: block; color: #344054; font-size: 11px; font-weight: 750; }
input, select, textarea { width: 100%; margin-top: 7px; border: 1px solid #d8dee6; border-radius: 12px; background: #fff; color: var(--ink); outline: 0; transition: border-color .2s, box-shadow .2s; }
input, select { height: 48px; padding: 0 13px; }
textarea { padding: 13px; resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--green); box-shadow: 0 0 0 4px rgba(75,159,24,.10); }
.checkout-summary { top: 115px; }
.checkout-mini-items { display: grid; gap: 13px; margin-bottom: 20px; }
.checkout-mini-items > div { display: grid; grid-template-columns: 54px 1fr auto; align-items: center; gap: 10px; }
.checkout-mini-items img { width: 54px; height: 54px; padding: 5px; object-fit: contain; border-radius: 11px; background: #fff; }
.checkout-mini-items strong, .checkout-mini-items small { display: block; }
.checkout-mini-items strong { color: #fff; font-size: 11px; }
.checkout-mini-items small { margin-top: 3px; color: rgba(255,255,255,.45); font-size: 9px; }
.checkout-mini-items b { color: #fff; font-size: 11px; }
.checkout-security { margin-top: 18px; display: flex; gap: 10px; padding: 12px; border-radius: 12px; background: rgba(255,255,255,.06); }
.checkout-security span { color: #aeea72; }
.checkout-security p { margin: 0; color: rgba(255,255,255,.5); font-size: 9px; line-height: 1.5; }
.success-section { min-height: 75vh; padding: 110px 0; display: grid; place-items: center; background: radial-gradient(circle at 50% 30%, rgba(75,159,24,.13), transparent 28%), var(--cream); }
.success-card { max-width: 820px; margin: auto; padding: 60px; text-align: center; border: 1px solid var(--line); border-radius: 30px; background: #fff; box-shadow: var(--shadow); }
.success-icon { width: 78px; height: 78px; margin: 0 auto 24px; display: grid; place-items: center; border-radius: 50%; background: var(--green); color: #fff; font-size: 32px; box-shadow: 0 0 0 12px var(--green-soft); }
.success-card .eyebrow { margin-top: 10px; }
.success-card h1 { margin: 18px 0 14px; font-size: 52px; }
.success-card > p { max-width: 600px; margin: 0 auto; }
.success-order-data { margin: 32px 0; display: grid; grid-template-columns: repeat(3,1fr); border: 1px solid var(--line); border-radius: 16px; }
.success-order-data div { padding: 18px; border-inline-end: 1px solid var(--line); }
.success-order-data div:last-child { border-inline-end: 0; }
.success-order-data small, .success-order-data strong { display: block; }
.success-order-data small { color: #98a2b3; font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.success-order-data strong { margin-top: 5px; color: var(--navy); font-size: 13px; }
.success-actions { display: flex; justify-content: center; gap: 10px; }
.public-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.data-table { width: 100%; border-collapse: collapse; }
.data-table th, .data-table td { padding: 16px; border-bottom: 1px solid var(--line); text-align: start; font-size: 12px; white-space: nowrap; }
.data-table th { color: #98a2b3; font-size: 9px; text-transform: uppercase; letter-spacing: .1em; background: #f8fafc; }

/* Network, about, partner */
.network-hero, .about-hero, .partner-hero { padding: 110px 0; }
.network-hero-grid, .about-hero-grid, .partner-hero-grid { display: grid; grid-template-columns: 1fr .8fr; align-items: center; gap: 80px; }
.network-hero h1, .about-hero h1, .partner-hero h1 { margin: 20px 0; color: #fff; font-size: clamp(48px,6vw,76px); line-height: 1; }
.network-hero p, .about-hero p, .partner-hero p { max-width: 680px; color: rgba(255,255,255,.63); font-size: 17px; }
.network-radar { position: relative; width: 430px; max-width: 100%; aspect-ratio: 1; margin: auto; display: grid; place-items: center; }
.radar-ring { position: absolute; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; }
.r1{inset:8%}.r2{inset:24%}.r3{inset:39%}
.network-radar::before, .network-radar::after { content:""; position:absolute; background:rgba(255,255,255,.1); }
.network-radar::before { width:1px; inset-block: 5%; left:50%; }
.network-radar::after { height:1px; inset-inline: 5%; top:50%; }
.network-radar strong { width: 130px; height: 130px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); color: #fff; }
.radar-dot { position:absolute; width:10px;height:10px;border-radius:50%;background:#b3ec78;box-shadow:0 0 0 8px rgba(179,236,120,.1) }.d1{top:18%;left:38%}.d2{top:43%;right:12%}.d3{bottom:16%;left:35%}.d4{top:50%;left:17%}
.hub-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.hub-card { position: relative; min-height: 330px; padding: 30px; border: 1px solid var(--line); border-radius: 22px; background: #fff; }
.hub-card:first-child { grid-column: span 2; background: var(--navy); }
.hub-card:first-child h2 { color: #fff; }
.hub-card:first-child p { color: rgba(255,255,255,.55); }
.hub-number { position: absolute; top: 24px; right: 24px; color: #c6ccd5; font-size: 10px; letter-spacing: .12em; }
.hub-symbol { width: 56px; height: 56px; display: grid; place-items: center; border-radius: 17px; background: var(--green-soft); color: var(--green); font-weight: 900; }
.hub-card h2 { margin: 42px 0 12px; font-size: 30px; }
.hub-card p { font-size: 13px; }
.hub-capabilities { position: absolute; bottom: 25px; left: 30px; right: 30px; display: flex; flex-wrap: wrap; gap: 6px; }
.hub-capabilities span { padding: 6px 9px; border-radius: 999px; background: #f2f4f7; color: #667085; font-size: 8px; text-transform: uppercase; letter-spacing: .07em; }
.hub-card:first-child .hub-capabilities span { background: rgba(255,255,255,.08); color: rgba(255,255,255,.55); }
.network-operations { background: #fff; }
.operation-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.operation-cards article { padding: 30px; border-radius: 20px; background: var(--cream); }
.operation-cards article > div { color: var(--green); font-size: 11px; font-weight: 900; letter-spacing: .13em; }
.operation-cards h3 { margin: 45px 0 12px; font-size: 23px; }
.operation-cards p { font-size: 13px; }
.about-brand-card { position: relative; overflow: hidden; min-height: 430px; padding: 30px; border: 1px solid rgba(255,255,255,.13); border-radius: 28px; background: rgba(255,255,255,.06); }
.about-brand-card img { width: 100%; height: 310px; object-fit: contain; border-radius: 18px; background: #fff; }
.about-brand-card > div { margin-top: 20px; display: flex; justify-content: space-between; align-items: center; }
.about-brand-card strong { color: #fff; font-size: 22px; }
.about-brand-card span { color: rgba(255,255,255,.45); font-size: 9px; letter-spacing: .15em; }
.mission-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.mission-card { min-height: 390px; padding: 42px; display: flex; flex-direction: column; justify-content: flex-end; border: 1px solid var(--line); border-radius: 26px; background: #fff; }
.mission-card.dark { background: var(--navy); }
.mission-card > span { margin-bottom: auto; color: var(--green); font-size: 11px; font-weight: 900; letter-spacing: .13em; }
.mission-card h2 { font-size: 40px; }
.mission-card.dark h2 { color: #fff; }
.mission-card.dark p { color: rgba(255,255,255,.58); }
.principles-section { padding-top: 0; }
.principles-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.principles-grid article { padding: 34px; border-radius: 22px; background: #fff; border: 1px solid var(--line); }
.principles-grid article > div { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; background: var(--green-soft); color: var(--green); font-size: 20px; }
.principles-grid h3 { margin: 45px 0 10px; font-size: 23px; }
.partner-scorecard { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.partner-scorecard > div { min-height: 170px; padding: 20px; display: flex; flex-direction: column; justify-content: flex-end; border: 1px solid rgba(255,255,255,.14); border-radius: 18px; background: rgba(255,255,255,.06); }
.partner-scorecard small { margin-bottom: auto; color: #aee774; font-size: 8px; letter-spacing: .12em; }
.partner-scorecard strong { color: #fff; font-size: 38px; }
.partner-scorecard span { color: rgba(255,255,255,.42); font-size: 10px; }
.partner-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 60px; align-items: start; }
.contract-panel { position: sticky; top: 120px; padding: 10px 0; }
.contract-panel h2 { margin: 16px 0; font-size: 43px; }
.contract-panel ul { list-style: none; padding: 0; margin: 28px 0 0; }
.contract-panel li { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid #d9dee5; color: #344054; font-size: 12px; }
.contract-panel li span { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 50%; background: var(--green-soft); color: var(--green); font-size: 10px; font-weight: 900; }
.partner-form { padding: 36px; }
.partner-form h2 { font-size: 30px; }
.partner-form > label { margin-top: 18px; }

/* Auth */
.auth-section { min-height: calc(100vh - 118px); padding: 55px 0; display: grid; align-items: center; background: linear-gradient(135deg, #07182f 0 44%, var(--cream) 44%); }
.auth-shell { display: grid; grid-template-columns: 1fr 520px; gap: 80px; align-items: center; }
.auth-visual { color: #fff; padding-inline-start: 20px; }
.auth-orb { width: 150px; height: 150px; margin-bottom: 35px; display: grid; place-items: center; border-radius: 50%; background: #fff; box-shadow: 0 24px 60px rgba(0,0,0,.24); }
.auth-orb img { width: 120px; }
.auth-visual h1 { max-width: 610px; margin: 18px 0; color: #fff; font-size: clamp(46px,5vw,68px); line-height: 1; }
.auth-visual p { max-width: 550px; color: rgba(255,255,255,.57); }
.auth-stats { display: flex; gap: 40px; margin-top: 30px; }
.auth-stats strong, .auth-stats span { display: block; }
.auth-stats strong { color: #fff; font-size: 30px; }
.auth-stats span { color: rgba(255,255,255,.45); font-size: 10px; text-transform: uppercase; }
.auth-feature-list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.auth-feature-list span { padding: 8px 11px; border: 1px solid rgba(255,255,255,.13); border-radius: 999px; color: rgba(255,255,255,.62); font-size: 10px; }
.auth-card { padding: 40px; border: 1px solid var(--line); border-radius: 28px; background: #fff; box-shadow: var(--shadow); }
.auth-card-header { display: flex; gap: 15px; margin-bottom: 28px; }
.auth-mark { width: 48px; height: 48px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 15px; background: var(--navy); color: #fff; font-size: 22px; font-weight: 900; }
.auth-card-header h2 { margin-bottom: 5px; font-size: 28px; }
.auth-card-header p { margin: 0; font-size: 11px; line-height: 1.5; }
.auth-card > label { margin-top: 16px; }
.password-field { position: relative; }
.password-field input { padding-inline-end: 45px; }
.password-field button { position: absolute; top: 7px; bottom: 0; inset-inline-end: 0; width: 44px; border: 0; background: transparent; color: #98a2b3; }
.checkbox-row { display: flex !important; align-items: center; gap: 9px; }
.checkbox-row input { width: 17px; height: 17px; margin: 0; }
.auth-card .checkbox-row { margin: 18px 0; }
.auth-switch { margin: 20px 0 0; text-align: center; font-size: 11px; }
.auth-switch a { color: var(--green); font-weight: 800; }
.demo-credentials { margin-top: 22px; padding: 14px; border-radius: 12px; background: #f7f8fa; }
.demo-credentials strong, .demo-credentials code { display: block; }
.demo-credentials strong { margin-bottom: 6px; color: var(--navy); font-size: 10px; }
.demo-credentials code { margin: 4px 0; color: #667085; font-size: 9px; }

/* Panel */
.panel-body { min-height: 100vh; background: #f5f7fa; }
.panel-sidebar { position: fixed; z-index: 50; top: 0; bottom: 0; inset-inline-start: 0; width: 258px; padding: 20px 15px; display: flex; flex-direction: column; background: #07182f; color: #fff; }
.panel-brand { min-height: 78px; display: flex; align-items: center; gap: 10px; padding: 0 8px 18px; border-bottom: 1px solid rgba(255,255,255,.1); }
.panel-brand img { width: 105px; height: 52px; object-fit: contain; filter: brightness(0) invert(1); }
.panel-brand span { padding-inline-start: 10px; border-inline-start: 1px solid rgba(255,255,255,.14); color: rgba(255,255,255,.5); font-size: 9px; text-transform: uppercase; letter-spacing: .12em; }
.panel-nav { margin-top: 25px; display: grid; gap: 5px; }
.panel-nav a, .panel-sidebar-footer a, .panel-sidebar-footer button { min-height: 46px; display: flex; align-items: center; gap: 13px; padding: 0 14px; border: 0; border-radius: 12px; background: transparent; color: rgba(255,255,255,.58); font-size: 12px; font-weight: 650; text-align: start; }
.panel-nav a > span, .panel-sidebar-footer span { width: 22px; color: rgba(255,255,255,.38); text-align: center; font-size: 16px; }
.panel-nav a:hover, .panel-nav a.is-active { background: rgba(255,255,255,.09); color: #fff; }
.panel-nav a.is-active > span { color: #b4ed78; }
.panel-sidebar-footer { margin-top: auto; padding-top: 15px; border-top: 1px solid rgba(255,255,255,.1); }
.panel-sidebar-footer button { width: 100%; }
.panel-main { min-height: 100vh; margin-inline-start: 258px; }
.panel-topbar { min-height: 94px; padding: 18px 32px; display: flex; align-items: center; border-bottom: 1px solid #e2e7ed; background: rgba(255,255,255,.88); backdrop-filter: blur(14px); position: sticky; top: 0; z-index: 30; }
.panel-heading { flex: 1; }
.panel-heading h1 { margin: 0 0 3px; font-size: 23px; }
.panel-heading p { margin: 0; font-size: 10px; line-height: 1.4; }
.panel-top-actions { display: flex; align-items: center; gap: 18px; }
.panel-profile { display: flex; align-items: center; gap: 10px; }
.panel-profile .avatar { width: 40px; height: 40px; }
.panel-profile strong, .panel-profile small { display: block; }
.panel-profile strong { color: var(--navy); font-size: 11px; }
.panel-profile small { margin-top: 2px; color: #98a2b3; font-size: 9px; }
.panel-language .language-button { border: 1px solid var(--line); background: #fff; }
.panel-menu-toggle { display: none; margin-inline-end: 12px; width: 40px; height: 40px; border: 0; border-radius: 10px; background: #eef1f5; color: var(--navy); }
.panel-content { padding: 28px 32px 50px; }
.panel-alert { margin: 18px 32px 0; padding: 13px 16px; display: flex; gap: 10px; border: 1px solid #cce5b7; border-radius: 12px; background: #f0f9e9; }
.panel-alert span { color: var(--green); font-weight: 900; }
.panel-alert p { margin: 0; color: #42612c; font-size: 11px; }
.panel-alert.is-error { border-color: #f3c6c3; background: #fff1f0; }
.panel-alert.is-error span, .panel-alert.is-error p { color: #b42318; }
.metric-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; }
.metric-card { min-height: 142px; padding: 20px; display: grid; grid-template-columns: 48px 1fr; align-items: start; gap: 14px; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: 0 4px 18px rgba(11,35,71,.035); position: relative; }
.metric-card.metric-primary { background: var(--navy); border-color: var(--navy); }
.metric-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; background: var(--green-soft); color: var(--green); font-size: 19px; font-weight: 900; }
.metric-primary .metric-icon { background: rgba(255,255,255,.1); color: #b5ed79; }
.metric-card span, .metric-card strong, .metric-card small { display: block; }
.metric-card span { color: #98a2b3; font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.metric-card strong { margin-top: 8px; color: var(--navy); font-size: 25px; }
.metric-card small { margin-top: 4px; color: #98a2b3; font-size: 9px; }
.metric-card > i { position: absolute; right: 16px; bottom: 16px; color: var(--green); font-style: normal; font-size: 9px; font-weight: 700; }
.metric-primary strong { color: #fff; }
.metric-primary span, .metric-primary small { color: rgba(255,255,255,.48); }
.metric-primary > i { color: #b5ed79; }
.dashboard-grid { display: grid; gap: 16px; margin-top: 16px; }
.dashboard-grid-main { grid-template-columns: 1.45fr .55fr; }
.dashboard-grid-bottom { grid-template-columns: 1.4fr .6fr; }
.panel-card { border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: 0 4px 18px rgba(11,35,71,.025); }
.panel-card-heading { min-height: 72px; padding: 18px 20px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.panel-card-heading span { color: #98a2b3; font-size: 8px; font-weight: 850; letter-spacing: .12em; }
.panel-card-heading h2 { margin: 4px 0 0; font-size: 17px; }
.panel-card-heading a { color: var(--green); font-size: 10px; font-weight: 800; }
.panel-card-heading select { width: auto; height: 36px; margin: 0; font-size: 10px; }
.revenue-chart { height: 265px; padding: 28px 22px 18px; display: flex; align-items: end; justify-content: space-around; gap: 12px; border-bottom: 1px solid var(--line); background: linear-gradient(to top, #f7f9fb 1px, transparent 1px); background-size: 100% 25%; }
.chart-column { height: 100%; flex: 1; display: flex; flex-direction: column; justify-content: end; align-items: center; gap: 9px; }
.chart-column > span { position: relative; width: min(35px,70%); border-radius: 8px 8px 3px 3px; background: linear-gradient(to top, var(--green), #86cf45); }
.chart-column > span::after { content: ""; position: absolute; inset: 18% 0 0; border-radius: inherit; background: linear-gradient(to top, rgba(255,255,255,.05), rgba(255,255,255,.35)); }
.chart-column i { position: absolute; top: -20px; left: 50%; transform: translateX(-50%); color: #98a2b3; font-style: normal; font-size: 8px; white-space: nowrap; }
.chart-column small { color: #98a2b3; font-size: 8px; }
.chart-legend { min-height: 58px; padding: 0 22px; display: flex; align-items: center; gap: 16px; color: #667085; font-size: 9px; }
.chart-legend span { display: flex; align-items: center; gap: 6px; }
.chart-legend i { width: 8px; height: 8px; border-radius: 50%; background: var(--green); }
.chart-legend span:nth-child(2) i { background: #d8dee6; }
.chart-legend strong { margin-left: auto; color: var(--navy); font-size: 16px; }
.status-card { padding-bottom: 15px; }
.status-donut { width: 155px; height: 155px; margin: 28px auto 18px; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(var(--green) 0 46%, #2f66a5 46% 76%, #dfe5ec 76% 100%); }
.status-donut::before { content:""; width: 108px; height: 108px; border-radius: 50%; background: #fff; }
.status-donut > div { position: absolute; text-align: center; }
.status-donut strong, .status-donut span { display: block; }
.status-donut strong { color: var(--navy); font-size: 27px; }
.status-donut span { color: #98a2b3; font-size: 8px; text-transform: uppercase; }
.status-legend { padding: 0 20px; }
.status-legend > div { display: grid; grid-template-columns: 10px 1fr auto; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px solid #f0f2f5; }
.legend-dot { width: 7px; height: 7px; border-radius: 50%; background: #dfe5ec; }
.legend-dot.status-pending { background: #fdb022; }.legend-dot.status-confirmed { background: #2e90fa; }.legend-dot.status-preparing { background: #9b8afb; }.legend-dot.status-shipped { background: #6172f3; }.legend-dot.status-delivered { background: var(--green); }
.status-legend b { color: #667085; font-size: 9px; font-weight: 650; }
.status-legend strong { color: var(--navy); font-size: 10px; }
.table-scroll { overflow-x: auto; }
.panel-table { width: 100%; border-collapse: collapse; }
.panel-table th, .panel-table td { padding: 13px 16px; border-bottom: 1px solid var(--line); text-align: start; white-space: nowrap; font-size: 10px; }
.panel-table th { background: #fafbfc; color: #98a2b3; font-size: 8px; text-transform: uppercase; letter-spacing: .08em; }
.panel-table td { color: #475467; }
.panel-table td strong, .panel-table td small { display: block; }
.panel-table td strong { color: var(--navy); font-size: 10px; }
.panel-table td small { margin-top: 3px; color: #98a2b3; font-size: 8px; }
.status-pill, .type-pill { display: inline-flex; align-items: center; min-height: 24px; padding: 0 8px; border-radius: 999px; background: #eef1f5; color: #667085; font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.status-active, .status-delivered, .status-approved, .status-paid { background: #eaf7df; color: #3e7f15; }
.status-pending, .status-new, .status-unpaid { background: #fff6df; color: #a15c00; }
.status-confirmed, .status-shipped, .status-reviewing { background: #e9f3ff; color: #175cd3; }
.status-preparing { background: #f3efff; color: #6941c6; }
.status-cancelled, .status-rejected, .status-suspended, .status-archived { background: #fff0ef; color: #b42318; }
.status-draft { background: #f2f4f7; color: #667085; }
.stock-list { padding: 10px 18px 18px; }
.stock-list a { display: grid; grid-template-columns: 48px 1fr auto; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.stock-list img { width: 48px; height: 48px; padding: 5px; object-fit: contain; border-radius: 10px; background: #eef3ea; }
.stock-list strong, .stock-list small { display: block; }
.stock-list strong { color: var(--navy); font-size: 9px; }
.stock-list small { margin-top: 3px; color: #98a2b3; font-size: 8px; }
.stock-level { min-width: 34px; height: 25px; display: inline-grid; place-items: center; padding: 0 8px; border-radius: 999px; background: #eef7e7; color: #3e7f15; font-size: 8px; font-weight: 850; }
.stock-level.critical { background: #fff0ef; color: #b42318; }
.button-panel { min-height: 42px; padding: 0 17px; border-radius: 11px; background: var(--navy); color: #fff; font-size: 10px; }
.low-stock-card > .button { width: calc(100% - 36px); margin: 0 18px 18px; }
.panel-toolbar { margin-bottom: 16px; display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.panel-search { min-width: 320px; height: 42px; display: flex; align-items: center; gap: 8px; padding: 0 13px; border: 1px solid var(--line); border-radius: 11px; background: #fff; }
.panel-search span { color: #98a2b3; }
.panel-search input { height: auto; margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; font-size: 10px; }
.table-product, .person-cell { display: flex; align-items: center; gap: 10px; }
.table-product img { width: 46px; height: 46px; padding: 4px; object-fit: contain; border-radius: 10px; background: #eef3ea; }
.panel-table code { color: var(--navy); font-size: 9px; }
.row-actions { display: flex; align-items: center; gap: 8px; }
.row-actions a, .row-actions button { border: 0; background: none; color: #175cd3; font-size: 9px; font-weight: 700; }
.row-actions button { color: #b42318; }
.product-form-layout { display: grid; grid-template-columns: 1fr 280px; gap: 18px; align-items: start; }
.product-form-main { display: grid; gap: 18px; }
.form-panel { padding: 22px; }
.form-panel .panel-card-heading { min-height: 0; margin: -22px -22px 22px; }
.form-panel h2 { font-size: 17px; }
.form-panel label + label { margin-top: 0; }
.form-panel .form-grid { gap: 15px; }
.sticky-form-panel { position: sticky; top: 120px; }
.sticky-form-panel > label { margin: 18px 0; }
.panel-checkbox { padding: 13px; border-radius: 10px; background: #f7f8fa; }
.product-form-preview { height: 190px; margin: 16px 0; display: grid; place-items: center; border-radius: 14px; background: #eef3ea; }
.product-form-preview img { width: 90%; height: 90%; object-fit: contain; }
.sticky-form-panel .button + .button { margin-top: 8px; }
.translation-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 18px; }
.translation-tabs button { min-height: 34px; padding: 0 10px; border: 1px solid var(--line); border-radius: 9px; background: #fff; color: #667085; font-size: 9px; font-weight: 800; }
.translation-tabs button.is-active { border-color: var(--navy); background: var(--navy); color: #fff; }
.translation-pane { display: none; }
.translation-pane.is-active { display: grid; gap: 16px; }
.inline-update { display: flex; align-items: center; gap: 5px; }
.inline-update select { width: auto; min-width: 95px; height: 32px; margin: 0; padding: 0 26px 0 8px; border-radius: 8px; font-size: 8px; }
.inline-update button { width: 31px; height: 31px; border: 0; border-radius: 8px; background: var(--navy); color: #fff; }
.filter-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.filter-chips a { min-height: 34px; padding: 0 12px; display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: #667085; font-size: 9px; font-weight: 700; }
.filter-chips a.is-active { border-color: var(--navy); background: var(--navy); color: #fff; }
.tag-list { display: flex; flex-wrap: wrap; gap: 4px; }
.tag-list span { padding: 4px 7px; border-radius: 999px; background: #f0f3f6; color: #667085; font-size: 7px; }
.application-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; }
.application-card { padding: 22px; }
.application-card-top { display: flex; justify-content: space-between; }
.application-card h2 { margin: 22px 0 10px; font-size: 22px; }
.application-card > p { min-height: 66px; font-size: 11px; line-height: 1.6; }
.application-meta { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; margin: 20px 0; padding: 16px; border-radius: 12px; background: #f7f8fa; }
.application-meta small, .application-meta strong { display: block; }
.application-meta small { color: #98a2b3; font-size: 7px; text-transform: uppercase; letter-spacing: .08em; }
.application-meta strong { margin-top: 3px; color: var(--navy); font-size: 9px; overflow: hidden; text-overflow: ellipsis; }
.application-card form { display: flex; gap: 8px; }
.application-card form select { margin: 0; height: 42px; }
.distributor-welcome { margin-bottom: 16px; padding: 24px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.distributor-welcome h2 { margin: 10px 0 4px; font-size: 25px; }
.distributor-welcome p { margin: 0; font-size: 10px; }
.distributor-profile-strip { margin-top: 16px; display: grid; grid-template-columns: repeat(4,1fr); border: 1px solid var(--line); border-radius: 17px; background: #fff; }
.distributor-profile-strip > div { padding: 18px; border-inline-end: 1px solid var(--line); }
.distributor-profile-strip > div:last-child { border-inline-end: 0; }
.distributor-profile-strip small, .distributor-profile-strip strong { display: block; }
.distributor-profile-strip small { color: #98a2b3; font-size: 8px; text-transform: uppercase; letter-spacing: .08em; }
.distributor-profile-strip strong { margin-top: 7px; color: var(--navy); font-size: 13px; }
.quick-product-list { padding: 10px 18px 18px; }
.quick-product-list > div { display: grid; grid-template-columns: 45px 1fr auto; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.quick-product-list img { width: 45px; height: 45px; padding: 4px; object-fit: contain; border-radius: 10px; background: #eef3ea; }
.quick-product-list strong, .quick-product-list small { display: block; }
.quick-product-list strong { color: var(--navy); font-size: 9px; }
.quick-product-list small { color: #98a2b3; font-size: 8px; }
.quick-product-list b { color: var(--green); font-size: 10px; }
.distributor-catalog-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.distributor-product-card { overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.distributor-product-image { position: relative; height: 220px; display: grid; place-items: center; background: #eef3ea; }
.distributor-product-image img { width: 85%; height: 85%; object-fit: contain; }
.distributor-product-image > span { position: absolute; top: 12px; right: 12px; padding: 5px 7px; border-radius: 999px; background: #fff; color: var(--green); font-size: 7px; font-weight: 800; }
.distributor-product-body { padding: 18px; }
.distributor-product-body > small { color: #98a2b3; font-size: 7px; text-transform: uppercase; letter-spacing: .08em; }
.distributor-product-body h2 { margin: 8px 0 14px; font-size: 18px; }
.distributor-prices { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 14px; }
.distributor-prices > div { padding: 10px; border-radius: 10px; background: #f7f8fa; }
.distributor-prices span, .distributor-prices strong { display: block; }
.distributor-prices span { color: #98a2b3; font-size: 7px; text-transform: uppercase; }
.distributor-prices strong { margin-top: 4px; color: var(--navy); font-size: 14px; }
.distributor-product-body form { display: grid; grid-template-columns: 90px 1fr; gap: 8px; align-items: end; }
.distributor-product-body form label { font-size: 8px; }
.distributor-product-body form input { height: 42px; }

/* Reveal */
.reveal { opacity: 0; transform: translateY(18px); transition: opacity .65s ease, transform .65s ease; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

/* RTL */
[dir="rtl"] .brand img, [dir="rtl"] .footer-brand img { object-position: right center; }
[dir="rtl"] .world-title { left: auto; right: 34px; }
[dir="rtl"] .world-legend { left: 34px; right: 34px; }
[dir="rtl"] .panel-table th, [dir="rtl"] .panel-table td, [dir="rtl"] .data-table th, [dir="rtl"] .data-table td { text-align: right; }
[dir="rtl"] .chart-legend strong { margin-left: 0; margin-right: auto; }
[dir="rtl"] .product-detail-code { left: auto; right: 26px; }
[dir="rtl"] .hub-number { right: auto; left: 24px; }

/* Responsive */
@media (max-width: 1120px) {
    .nav-shell { grid-template-columns: 150px auto 1fr; }
    .primary-nav { position: absolute; top: 100%; left: 20px; right: 20px; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 12px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: var(--shadow); }
    .primary-nav.is-open { display: flex; }
    .primary-nav a { padding: 13px; border-radius: 10px; }
    .primary-nav a::after { display: none; }
    .primary-nav a:hover, .primary-nav a.is-active { background: var(--green-soft); }
    .mobile-menu-button { display: block; order: 2; }
    .nav-actions { justify-content: flex-end; }
    .language-name, .account-copy, .login-link { display: none; }
    .register-link { display: none; }
    .hero-grid { grid-template-columns: 1fr 1fr; gap: 25px; }
    .hero-copy h1 { font-size: 60px; }
    .floating-card-top { left: 2%; }
    .floating-card-bottom { right: 2%; }
    .product-detail-grid { gap: 35px; }
    .cart-item { grid-template-columns: 95px 1fr 130px 95px 20px; gap: 10px; }
    .cart-item-image { width: 95px; height: 90px; }
    .metric-grid { grid-template-columns: repeat(2,1fr); }
    .dashboard-grid-main, .dashboard-grid-bottom { grid-template-columns: 1fr; }
    .distributor-catalog-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 900px) {
    .section { padding: 80px 0; }
    .hero-grid { grid-template-columns: 1fr; padding-top: 90px; }
    .hero-copy { text-align: center; margin: auto; }
    .hero-copy .eyebrow, .hero-actions, .hero-proof { justify-content: center; }
    .hero-visual { min-height: 450px; }
    .hero-stats { grid-template-columns: repeat(2,1fr); }
    .product-grid { grid-template-columns: repeat(2,1fr); }
    .split-heading, .model-grid, .regions-grid, .product-detail-grid, .network-hero-grid, .about-hero-grid, .partner-hero-grid, .partner-layout, .checkout-grid { grid-template-columns: 1fr; }
    .model-layers { max-width: 700px; }
    .services-grid { grid-template-columns: repeat(2,1fr); }
    .world-panel { min-height: 520px; }
    .footer-grid { grid-template-columns: 1.5fr 1fr 1fr; }
    .footer-newsletter { grid-column: 1/-1; }
    .product-detail-copy { max-width: 700px; }
    .cart-grid { grid-template-columns: 1fr; }
    .order-summary { position: static; }
    .hub-grid { grid-template-columns: repeat(2,1fr); }
    .hub-card:first-child { grid-column: auto; }
    .operation-cards, .principles-grid { grid-template-columns: 1fr; }
    .partner-scorecard { max-width: 600px; }
    .contract-panel { position: static; }
    .auth-section { background: linear-gradient(180deg, #07182f 0 44%, var(--cream) 44%); }
    .auth-shell { grid-template-columns: 1fr; gap: 45px; }
    .auth-visual { text-align: center; padding: 20px 0; }
    .auth-orb { margin-inline: auto; }
    .auth-visual p { margin-inline: auto; }
    .auth-stats, .auth-feature-list { justify-content: center; }
    .auth-card { max-width: 600px; width: 100%; margin: auto; }
    .panel-sidebar { transform: translateX(-105%); transition: transform .25s ease; box-shadow: var(--shadow); }
    [dir="rtl"] .panel-sidebar { transform: translateX(105%); }
    .panel-sidebar.is-open { transform: translateX(0); }
    .panel-main { margin-inline-start: 0; }
    .panel-menu-toggle { display: block; }
    .product-form-layout { grid-template-columns: 1fr; }
    .sticky-form-panel { position: static; }
}
@media (max-width: 650px) {
    .container { width: min(calc(100% - 24px), var(--container)); }
    .announcement-inner { min-height: 32px; font-size: 9px; }
    .announcement-inner span:nth-child(2), .announcement-inner span:nth-child(3) { display: none; }
    .nav-shell { min-height: 72px; grid-template-columns: 120px 42px 1fr; gap: 8px; }
    .brand img { width: 112px; height: 52px; }
    .nav-actions { gap: 6px; }
    .language-button { padding: 0 4px; }
    .account-button .chevron, .panel-profile > div { display: none; }
    .icon-action { width: 38px; height: 38px; }
    .hero-grid { min-height: auto; padding-top: 65px; }
    .hero-copy h1 { font-size: 46px; }
    .hero-copy > p { font-size: 15px; }
    .hero-actions { flex-direction: column; }
    .hero-actions .button { width: 100%; }
    .hero-visual { min-height: 370px; }
    .global-orbit { width: 350px; }
    .globe-core { width: 150px; height: 150px; }
    .globe-core img { width: 110px; height: 90px; }
    .orbit-node { min-width: 64px; padding: 8px; }
    .floating-card { display: none; }
    .hero-stats > div { padding: 18px 10px; display: block; }
    .hero-stats strong, .hero-stats span { display: block; }
    .hero-stats span { margin-top: 3px; font-size: 8px; }
    .logo-strip-inner { min-height: 56px; overflow: hidden; justify-content: flex-start; }
    .logo-strip-inner span:nth-of-type(n+3), .logo-strip-inner i:nth-of-type(n+3) { display: none; }
    .section-heading h2 { font-size: 38px; }
    .product-grid, .services-grid { grid-template-columns: 1fr; }
    .product-visual { min-height: 290px; }
    .model-layers { grid-template-columns: 1fr; }
    .model-card.primary-model { grid-row: auto; min-height: 330px; }
    .model-intro h2, .regions-copy h2 { font-size: 40px; }
    .world-panel { min-height: 400px; }
    .partner-cta { padding: 42px 28px; grid-template-columns: 1fr; }
    .partner-cta h2 { font-size: 39px; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
    .footer-brand, .footer-newsletter { grid-column: 1/-1; }
    .footer-bottom { display: block; padding: 20px 0; }
    .footer-bottom div { margin-top: 10px; }
    .catalog-toolbar { align-items: stretch; flex-direction: column; }
    .catalog-toolbar select, .search-box { min-width: 0; width: 100%; }
    .product-detail-visual { min-height: 400px; }
    .product-detail-visual img { height: 320px; }
    .product-detail-copy h1 { font-size: 43px; }
    .detail-facts { grid-template-columns: 1fr; }
    .add-cart-form { grid-template-columns: 1fr; }
    .cart-item { grid-template-columns: 78px 1fr auto; }
    .cart-item-image { width: 78px; height: 76px; }
    .cart-quantity { grid-column: 2; }
    .cart-item-price { grid-column: 3; grid-row: 1/3; }
    .cart-item > form:last-child { position: absolute; top: 8px; right: 8px; }
    .form-grid.two-cols { grid-template-columns: 1fr; }
    .success-card { padding: 40px 22px; }
    .success-card h1 { font-size: 38px; }
    .success-order-data { grid-template-columns: 1fr; }
    .success-order-data div { border-inline-end: 0; border-bottom: 1px solid var(--line); }
    .success-actions { flex-direction: column; }
    .network-hero, .about-hero, .partner-hero { padding: 75px 0; }
    .network-hero h1, .about-hero h1, .partner-hero h1 { font-size: 46px; }
    .hub-grid, .mission-grid { grid-template-columns: 1fr; }
    .partner-scorecard { grid-template-columns: 1fr; }
    .partner-scorecard > div { min-height: 125px; }
    .auth-card { padding: 28px 20px; }
    .panel-topbar { padding: 14px 14px; }
    .panel-heading p, .panel-language { display: none; }
    .panel-content { padding: 18px 14px 40px; }
    .panel-alert { margin: 14px 14px 0; }
    .metric-grid { grid-template-columns: 1fr; }
    .panel-toolbar { align-items: stretch; flex-direction: column; }
    .panel-search { min-width: 0; width: 100%; }
    .application-grid, .distributor-catalog-grid { grid-template-columns: 1fr; }
    .distributor-profile-strip { grid-template-columns: 1fr 1fr; }
    .distributor-profile-strip > div:nth-child(2) { border-inline-end: 0; }
    .distributor-profile-strip > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
    .distributor-welcome { align-items: flex-start; flex-direction: column; }
    .distributor-product-body form { grid-template-columns: 1fr; }
}

/* ========================================================================== 
   HS Fresh 2026 liquid experience
   ========================================================================== */
:root {
    --electric-blue: #1d75ff;
    --liquid-blue: #8bd5ff;
    --liquid-green: #8bd63f;
    --glass: rgba(255,255,255,.64);
    --glass-strong: rgba(255,255,255,.84);
    --glass-border: rgba(255,255,255,.74);
    --liquid-shadow: 0 32px 90px rgba(29,75,126,.16);
}

.site-body { overflow-x: hidden; }
.home-page { background: #f7fbff; }
.home-page main { overflow: clip; }

.scroll-progress {
    position: fixed;
    z-index: 140;
    top: 0;
    inset-inline-start: 0;
    width: 100%;
    height: 3px;
    transform: scaleX(0);
    transform-origin: left center;
    background: linear-gradient(90deg, var(--green), #8ce23f 42%, #55baf5 70%, var(--navy));
    box-shadow: 0 0 18px rgba(72,178,255,.6);
    pointer-events: none;
}
[dir="rtl"] .scroll-progress { transform-origin: right center; }

.page-transition {
    position: fixed;
    z-index: 130;
    inset: 0;
    pointer-events: none;
    visibility: hidden;
    overflow: hidden;
}
.page-transition span {
    position: absolute;
    inset-block: -15%;
    width: 50%;
    border-radius: 48% 52% 45% 55% / 62% 42% 58% 38%;
    background: linear-gradient(160deg, rgba(255,255,255,.96), rgba(196,234,255,.98) 54%, rgba(106,191,255,.95));
    transform: translateY(115%) scale(.8);
    filter: drop-shadow(0 0 45px rgba(72,158,219,.24));
}
.page-transition span:nth-child(1) { left: -10%; transition: transform .62s cubic-bezier(.76,0,.24,1); }
.page-transition span:nth-child(2) { left: 25%; transition: transform .68s .04s cubic-bezier(.76,0,.24,1); background: linear-gradient(160deg, #f8fffb, rgba(206,246,184,.98), rgba(77,159,24,.96)); }
.page-transition span:nth-child(3) { right: -10%; transition: transform .74s .08s cubic-bezier(.76,0,.24,1); }
body.is-leaving .page-transition { visibility: visible; }
body.is-leaving .page-transition span { transform: translateY(0) scale(1.25); }

.liquid-cursor {
    position: fixed;
    z-index: 200;
    top: 0;
    left: 0;
    width: 36px;
    height: 36px;
    border: 1px solid rgba(31,108,194,.35);
    border-radius: 50% 44% 55% 47%;
    background: radial-gradient(circle at 32% 28%, rgba(255,255,255,.92), rgba(87,191,255,.2) 44%, rgba(75,159,24,.13));
    box-shadow: inset 0 0 18px rgba(255,255,255,.8), 0 8px 25px rgba(20,72,128,.13);
    pointer-events: none;
    transform: translate3d(-100px,-100px,0);
    transition: width .2s ease, height .2s ease, opacity .2s ease, border-radius .35s ease;
    backdrop-filter: blur(2px);
}
.liquid-cursor span {
    position: absolute;
    width: 6px;
    height: 6px;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    background: var(--green);
    transform: translate(-50%,-50%);
}
.liquid-cursor.is-active { width: 62px; height: 62px; border-radius: 44% 56% 46% 54%; }

.home-page .site-header {
    background: rgba(248,252,255,.74);
    border-bottom-color: rgba(255,255,255,.7);
    box-shadow: 0 12px 45px rgba(31,80,130,.05);
    backdrop-filter: blur(24px) saturate(150%);
    transition: background .35s ease, box-shadow .35s ease, transform .35s ease;
}
.home-page .site-header.is-scrolled {
    background: rgba(255,255,255,.9);
    box-shadow: 0 16px 50px rgba(31,80,130,.1);
}
.home-page .announcement {
    background: linear-gradient(90deg, #07182f, #0d315d 55%, #183e67);
}

/* Hero */
.liquid-hero {
    min-height: calc(100vh - 118px);
    isolation: isolate;
    color: var(--navy);
    background: #f5faff;
}
.liquid-hero::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(90deg, rgba(247,252,255,.94) 0%, rgba(247,252,255,.78) 37%, rgba(247,252,255,.12) 72%, rgba(247,252,255,.06) 100%);
}
.liquid-hero-bg {
    position: absolute;
    z-index: -3;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transform: scale(1.04);
    animation: liquidHeroDrift 16s ease-in-out infinite alternate;
}
.liquid-veil {
    position: absolute;
    z-index: -2;
    inset: 0;
    background:
        radial-gradient(circle at 20% 20%, rgba(255,255,255,.96), transparent 36%),
        radial-gradient(circle at 86% 28%, rgba(127,211,255,.15), transparent 28%),
        linear-gradient(180deg, rgba(255,255,255,.08), rgba(247,252,255,.42));
}
.liquid-orb {
    position: absolute;
    z-index: -1;
    border: 1px solid rgba(255,255,255,.88);
    border-radius: 48% 52% 59% 41% / 42% 43% 57% 58%;
    background: radial-gradient(circle at 30% 28%, rgba(255,255,255,.92), rgba(88,184,255,.18) 44%, rgba(75,159,24,.12));
    box-shadow: inset 0 0 35px rgba(255,255,255,.7), 0 25px 80px rgba(46,130,202,.12);
    backdrop-filter: blur(4px);
    animation: blobMorph 9s ease-in-out infinite alternate;
}
.liquid-orb-one { width: 170px; height: 150px; top: 10%; left: 42%; }
.liquid-orb-two { width: 78px; height: 78px; top: 28%; right: 4%; animation-delay: -3s; }
.liquid-orb-three { width: 116px; height: 105px; bottom: 16%; left: 6%; animation-delay: -6s; }

.hero-experience-grid {
    position: relative;
    z-index: 3;
    min-height: 690px;
    padding-top: 64px;
    padding-bottom: 42px;
    display: grid;
    grid-template-columns: .83fr 1.3fr;
    align-items: center;
    gap: 34px;
}
.hero-glass {
    max-width: 620px;
    padding: 42px 42px 38px;
    border: 1px solid var(--glass-border);
    border-radius: 36px;
    background: linear-gradient(145deg, rgba(255,255,255,.88), rgba(255,255,255,.54));
    box-shadow: 0 32px 90px rgba(26,81,137,.13), inset 0 1px 0 rgba(255,255,255,.9);
    backdrop-filter: blur(28px) saturate(145%);
}
.hero-copy.hero-glass h1 {
    margin: 22px 0 22px;
    color: var(--navy);
    font-size: clamp(54px, 5.6vw, 88px);
    line-height: .92;
    letter-spacing: -.065em;
    text-wrap: balance;
}
.hero-copy.hero-glass > p {
    max-width: 585px;
    margin-bottom: 30px;
    color: #53657a;
    font-size: 17px;
    line-height: 1.7;
}
.hero-title .hero-word {
    display: inline-block;
    opacity: 0;
    transform: translateY(30px) rotateX(-25deg);
    transform-origin: center bottom;
    animation: heroWordIn .78s cubic-bezier(.16,1,.3,1) forwards;
}
.button-glass {
    color: var(--navy);
    border-color: rgba(17,70,122,.14);
    background: rgba(255,255,255,.58);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
    backdrop-filter: blur(12px);
}
.button-glass:hover { background: rgba(255,255,255,.88); }
.button-orbit {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(255,255,255,.18);
    transition: transform .3s ease;
}
.button:hover .button-orbit { transform: rotate(45deg); }
.hero-trust-row {
    margin-top: 30px;
    padding-top: 24px;
    display: flex;
    align-items: center;
    gap: 14px;
    border-top: 1px solid rgba(17,70,122,.09);
}
.hero-trust-row strong,
.hero-trust-row small { display: block; }
.hero-trust-row strong { color: var(--navy); font-size: 12px; }
.hero-trust-row small { margin-top: 4px; color: #7e8da0; font-size: 10px; }
.hero-trust-globe {
    position: relative;
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    border: 1px solid rgba(31,111,188,.16);
    border-radius: 50%;
    background: linear-gradient(145deg, #fff, #dff4ff);
    box-shadow: 0 8px 24px rgba(31,111,188,.14);
}
.hero-trust-globe::before,
.hero-trust-globe::after,
.hero-trust-globe span {
    content: "";
    position: absolute;
    border: 1px solid rgba(17,78,137,.35);
    border-radius: 50%;
}
.hero-trust-globe::before { inset: 6px 15px; }
.hero-trust-globe::after { inset: 15px 6px; }
.hero-trust-globe span { inset: 6px; }
.hero-trust-globe i { position: absolute; right: 4px; bottom: 4px; width: 12px; height: 12px; border-radius: 70% 0 70% 0; background: var(--green); transform: rotate(-35deg); }

.hero-showcase-wrap { position: relative; perspective: 1400px; }
.hero-showcase {
    position: relative;
    min-height: 570px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.84);
    border-radius: 44px;
    background: rgba(255,255,255,.5);
    box-shadow: 0 40px 110px rgba(23,87,148,.22), inset 0 1px 0 rgba(255,255,255,1);
    transform-style: preserve-3d;
    will-change: transform;
    transition: transform .22s ease-out, box-shadow .3s ease;
}
.hero-showcase::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.5);
    pointer-events: none;
}
.hero-showcase > img {
    width: 100%;
    height: 100%;
    min-height: 570px;
    object-fit: cover;
    object-position: center;
    transform: scale(1.02);
    transition: transform 1.1s cubic-bezier(.16,1,.3,1);
}
.hero-showcase:hover > img { transform: scale(1.055); }
.hero-showcase-glare,
.icon-board-shine {
    position: absolute;
    inset: -45%;
    pointer-events: none;
    background: linear-gradient(110deg, transparent 38%, rgba(255,255,255,.42) 49%, transparent 60%);
    transform: translateX(-52%) rotate(5deg);
    animation: glassSweep 6.5s ease-in-out infinite;
}
.hero-image-badge {
    position: absolute;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 13px 15px;
    border: 1px solid rgba(255,255,255,.85);
    border-radius: 18px;
    background: rgba(255,255,255,.68);
    box-shadow: 0 18px 44px rgba(23,87,148,.16);
    backdrop-filter: blur(18px) saturate(140%);
    transform: translateZ(44px);
    animation: badgeFloat 5s ease-in-out infinite;
}
.hero-image-badge small,
.hero-image-badge strong { display: block; }
.hero-image-badge small { color: #6d7f91; font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.hero-image-badge strong { margin-top: 3px; color: var(--navy); font-size: 12px; }
.hero-image-badge-top { top: 26px; right: 26px; }
.hero-image-badge-bottom { bottom: 24px; left: 24px; display: grid; grid-template-columns: auto auto; gap: 2px 10px; animation-delay: -2.5s; }
.hero-image-badge-bottom small { grid-column: 1 / -1; }
.hero-image-badge-bottom strong { font-size: 27px; }
.hero-image-badge-bottom span { align-self: end; color: var(--green); font-size: 9px; font-weight: 800; }
.pulse-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 8px rgba(75,159,24,.13); animation: pulseDot 2.2s ease-out infinite; }

.hero-feature-dock {
    position: relative;
    z-index: 6;
    margin-top: -17px;
    padding: 14px;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 10px;
    border: 1px solid rgba(255,255,255,.86);
    border-radius: 28px;
    background: rgba(255,255,255,.7);
    box-shadow: 0 28px 65px rgba(25,89,149,.12);
    backdrop-filter: blur(22px) saturate(145%);
}
.hero-feature-dock article {
    min-height: 74px;
    padding: 12px 14px;
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid rgba(17,78,137,.07);
    border-radius: 19px;
    background: linear-gradient(145deg, rgba(255,255,255,.9), rgba(240,249,255,.62));
    transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.hero-feature-dock article:hover { transform: translateY(-5px); border-color: rgba(75,159,24,.22); box-shadow: 0 18px 30px rgba(31,103,168,.1); }
.feature-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 50%;
    color: #1768ae;
    background: radial-gradient(circle at 30% 25%, #fff, #dff3ff 64%, #c6eaff);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.92), 0 8px 20px rgba(29,107,176,.16);
    font-size: 18px;
}
.hero-feature-dock strong,
.hero-feature-dock small { display: block; }
.hero-feature-dock strong { color: var(--navy); font-size: 11px; }
.hero-feature-dock small { margin-top: 3px; color: #8b99a8; font-size: 9px; }
.liquid-stats {
    position: relative;
    z-index: 5;
    margin-top: 18px;
    margin-bottom: 38px;
    border: 0;
    border-radius: 24px;
    background: rgba(255,255,255,.5);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.84);
    backdrop-filter: blur(14px);
}
.liquid-stats > div { padding: 22px 25px; border-inline-end: 1px solid rgba(15,71,126,.08); }
.liquid-stats strong { color: var(--navy); font-size: 28px; }
.liquid-stats span { color: #75869a; }

/* Marquee */
.motion-marquee {
    overflow: hidden;
    border-block: 1px solid rgba(17,78,137,.08);
    background: rgba(255,255,255,.88);
}
.motion-marquee-track {
    width: max-content;
    min-height: 68px;
    display: flex;
    align-items: center;
    gap: 28px;
    color: #567087;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .18em;
    animation: marqueeFlow 28s linear infinite;
}
.motion-marquee span { white-space: nowrap; }
.motion-marquee i { width: 7px; height: 7px; border-radius: 50%; background: linear-gradient(135deg, var(--green), #9adb5b); box-shadow: 0 0 0 7px rgba(75,159,24,.08); }
[dir="rtl"] .motion-marquee-track { animation-direction: reverse; }

/* Products */
.liquid-products {
    position: relative;
    overflow: hidden;
    background: linear-gradient(180deg, #f8fcff, #fff 58%, #f7fbff);
}
.liquid-product-blob {
    position: absolute;
    border-radius: 46% 54% 60% 40% / 48% 44% 56% 52%;
    filter: blur(1px);
    opacity: .7;
    pointer-events: none;
    animation: blobMorph 11s ease-in-out infinite alternate;
}
.liquid-product-blob-one { width: 310px; height: 270px; top: 8%; right: -130px; background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.9), rgba(103,191,255,.22), rgba(103,191,255,.02)); }
.liquid-product-blob-two { width: 250px; height: 220px; bottom: 4%; left: -100px; background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.9), rgba(117,194,55,.18), rgba(117,194,55,.02)); animation-delay: -5s; }
.cinematic-product-grid .product-card {
    height: 100%;
    border-color: rgba(19,80,136,.08);
    border-radius: 30px;
    background: rgba(255,255,255,.78);
    box-shadow: 0 24px 64px rgba(29,88,145,.08), inset 0 1px 0 rgba(255,255,255,.95);
    backdrop-filter: blur(16px);
}
.cinematic-product-grid .product-card:hover { transform: translateY(-12px) scale(1.01); box-shadow: 0 36px 80px rgba(29,88,145,.16); }
.cinematic-product-grid .product-visual { background: radial-gradient(circle at 50% 35%, #fff, #edf8ff 60%, #eaf6e7); }
.cinematic-product-grid .product-visual::after { width: 260px; height: 260px; border-color: rgba(65,156,220,.13); box-shadow: 0 0 0 30px rgba(255,255,255,.34); }

/* Ecosystem */
.ecosystem-section {
    position: relative;
    background: linear-gradient(180deg, #fff, #f4f9fd 48%, #f9fcff);
}
.ecosystem-section::before {
    content: "";
    position: absolute;
    inset: 7% 0 auto;
    height: 58%;
    background: radial-gradient(circle at 50% 40%, rgba(111,196,255,.13), transparent 55%);
    pointer-events: none;
}
.ecosystem-visual {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.96);
    border-radius: 42px;
    background: #f6fbff;
    box-shadow: 0 38px 100px rgba(26,86,143,.16), inset 0 1px 0 #fff;
    perspective: 1300px;
    transition: transform .25s ease-out;
}
.ecosystem-visual img { width: 100%; min-height: 560px; object-fit: cover; }
.ecosystem-glow {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 50% 55%, transparent 45%, rgba(0,84,157,.06));
    pointer-events: none;
}
.ecosystem-floating-cta {
    position: absolute;
    right: 28px;
    bottom: 28px;
    min-height: 58px;
    padding: 0 10px 0 22px;
    display: flex;
    align-items: center;
    gap: 18px;
    border: 1px solid rgba(255,255,255,.86);
    border-radius: 999px;
    background: rgba(255,255,255,.74);
    color: var(--navy);
    box-shadow: 0 18px 42px rgba(26,86,143,.16);
    backdrop-filter: blur(20px);
    font-size: 12px;
    font-weight: 800;
}
.ecosystem-floating-cta b { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: var(--navy); color: #fff; }
.model-pills { margin-top: 22px; display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.model-pill {
    min-height: 170px;
    padding: 26px;
    display: grid;
    grid-template-columns: 44px 1fr;
    gap: 16px;
    border: 1px solid rgba(18,82,140,.09);
    border-radius: 25px;
    background: rgba(255,255,255,.76);
    box-shadow: 0 18px 44px rgba(25,86,142,.06);
    backdrop-filter: blur(14px);
    transition: transform .28s ease, box-shadow .28s ease;
}
.model-pill:hover { transform: translateY(-7px); box-shadow: 0 28px 60px rgba(25,86,142,.12); }
.model-pill > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(145deg, #fff, #e2f5ff); color: var(--green); box-shadow: inset 0 0 0 1px rgba(30,111,183,.08); font-size: 10px; font-weight: 900; }
.model-pill h3 { margin: 3px 0 8px; font-size: 18px; }
.model-pill p { margin: 0; font-size: 11px; line-height: 1.65; }

/* Services */
.services-2026-section {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: linear-gradient(135deg, #eef8ff, #fff 42%, #f3fbef);
}
.services-ambient {
    position: absolute;
    z-index: -1;
    width: 700px;
    height: 700px;
    left: -260px;
    top: -140px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(94,184,255,.23), rgba(94,184,255,0) 65%);
}
.services-2026-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 76px; align-items: center; }
.icon-board-wrap { perspective: 1300px; }
.icon-board {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.92);
    border-radius: 38px;
    background: rgba(255,255,255,.74);
    box-shadow: 0 36px 100px rgba(28,96,156,.16), inset 0 1px 0 rgba(255,255,255,.95);
    transform-style: preserve-3d;
    transition: transform .22s ease-out;
}
.icon-board img { width: 100%; }
.service-accordion { display: grid; gap: 9px; }
.service-line {
    min-height: 68px;
    padding: 10px 14px;
    display: grid;
    grid-template-columns: 34px 46px 1fr 38px;
    align-items: center;
    gap: 12px;
    border: 1px solid rgba(19,80,136,.08);
    border-radius: 20px;
    background: rgba(255,255,255,.7);
    box-shadow: 0 12px 32px rgba(26,86,143,.045);
    backdrop-filter: blur(14px);
    transition: transform .26s ease, background .26s ease, box-shadow .26s ease;
}
.service-line:hover { transform: translateX(8px); background: #fff; box-shadow: 0 20px 40px rgba(26,86,143,.12); }
[dir="rtl"] .service-line:hover { transform: translateX(-8px); }
.service-line small { color: #8d9baa; font-size: 9px; font-weight: 850; }
.service-line-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: radial-gradient(circle at 30% 25%, #fff, #dff4ff 65%, #c8ecff); color: #1768ae; box-shadow: 0 8px 20px rgba(29,107,176,.12); }
.service-line strong { color: var(--navy); font-size: 13px; }
.service-line b { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 50%; background: var(--green-soft); color: var(--green); transition: transform .25s ease, background .25s ease, color .25s ease; }
.service-line:hover b { transform: rotate(45deg); background: var(--green); color: #fff; }

/* Regional liquid map */
.regional-liquid-section {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 850px;
    display: grid;
    align-items: center;
    background: #f6fbff;
}
.regional-liquid-bg { position: absolute; z-index: -3; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.regional-liquid-overlay { position: absolute; z-index: -2; inset: 0; background: linear-gradient(90deg, rgba(247,252,255,.91), rgba(247,252,255,.57) 42%, rgba(247,252,255,.18)); }
.regional-liquid-grid { display: grid; grid-template-columns: .78fr 1.22fr; align-items: center; gap: 58px; }
.glass-panel {
    padding: 42px;
    border: 1px solid rgba(255,255,255,.88);
    border-radius: 32px;
    background: rgba(255,255,255,.68);
    box-shadow: var(--liquid-shadow);
    backdrop-filter: blur(24px) saturate(140%);
}
.regional-copy h2 { margin: 16px 0 20px; font-size: clamp(42px, 5vw, 68px); line-height: .98; }
.regional-copy p { margin-bottom: 28px; }
.region-orbit-panel { position: relative; min-height: 620px; perspective: 1100px; }
.region-orbit-panel::before,
.region-orbit-panel::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    border: 1px solid rgba(36,118,187,.15);
    border-radius: 50%;
    transform: translate(-50%,-50%);
}
.region-orbit-panel::before { width: 470px; height: 470px; box-shadow: 0 0 0 65px rgba(255,255,255,.16); }
.region-orbit-panel::after { width: 325px; height: 325px; border-color: rgba(75,159,24,.2); }
.region-orbit-center {
    position: absolute;
    z-index: 4;
    left: 50%;
    top: 50%;
    width: 220px;
    height: 220px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255,255,255,.94);
    border-radius: 50%;
    background: radial-gradient(circle at 34% 27%, rgba(255,255,255,.98), rgba(225,247,255,.74) 58%, rgba(201,238,255,.45));
    box-shadow: 0 36px 90px rgba(26,96,155,.22), inset 0 0 45px rgba(255,255,255,.86);
    transform: translate(-50%,-50%);
    backdrop-filter: blur(18px);
}
.region-orbit-center img { width: 155px; height: 100px; object-fit: contain; }
.region-orbit-center span { color: var(--navy); font-size: 9px; font-weight: 900; letter-spacing: .18em; }
.region-node {
    position: absolute;
    z-index: 5;
    min-width: 128px;
    padding: 12px 14px;
    border: 1px solid rgba(255,255,255,.9);
    border-radius: 17px;
    background: rgba(255,255,255,.68);
    box-shadow: 0 16px 42px rgba(28,95,153,.13);
    backdrop-filter: blur(18px);
    transition: transform .25s ease, background .25s ease;
}
.region-node:hover { transform: translateY(-6px) scale(1.03)!important; background: rgba(255,255,255,.92); }
.region-node span,
.region-node strong { display: block; }
.region-node span { color: var(--green); font-size: 8px; font-weight: 900; }
.region-node strong { margin-top: 4px; color: var(--navy); font-size: 10px; }
.region-node-1 { top: 6%; left: 39%; }
.region-node-2 { top: 19%; right: 6%; }
.region-node-3 { top: 47%; right: 0; }
.region-node-4 { bottom: 11%; right: 19%; }
.region-node-5 { bottom: 7%; left: 25%; }
.region-node-6 { top: 48%; left: 0; }
.region-node-7 { top: 18%; left: 8%; }
.orbit-line { position: absolute; left: 50%; top: 50%; border: 1px dashed rgba(36,118,187,.13); border-radius: 50%; transform: translate(-50%,-50%); animation: orbitRotate 28s linear infinite; }
.orbit-line-one { width: 520px; height: 380px; }
.orbit-line-two { width: 390px; height: 560px; animation-direction: reverse; animation-duration: 34s; }
.orbit-line-three { width: 600px; height: 250px; animation-duration: 24s; }

/* CTA */
.liquid-cta-section { padding-top: 20px; background: linear-gradient(180deg, #f6fbff, #fff); }
.partner-cta.liquid-cta {
    min-height: 380px;
    overflow: hidden;
    padding: 64px 68px;
    border: 1px solid rgba(255,255,255,.3);
    border-radius: 40px;
    background:
        radial-gradient(circle at 82% 20%, rgba(116,213,255,.3), transparent 28%),
        radial-gradient(circle at 15% 88%, rgba(126,210,61,.2), transparent 30%),
        linear-gradient(135deg, #061a34, #0d3d6c 58%, #15538a);
    box-shadow: 0 42px 100px rgba(12,53,94,.26);
}
.partner-cta.liquid-cta::after { display: none; }
.cta-liquid-sphere {
    position: absolute;
    border-radius: 47% 53% 59% 41% / 40% 44% 56% 60%;
    background: radial-gradient(circle at 30% 27%, rgba(255,255,255,.76), rgba(88,190,255,.18) 48%, rgba(88,190,255,.02));
    border: 1px solid rgba(255,255,255,.25);
    box-shadow: inset 0 0 35px rgba(255,255,255,.2);
    animation: blobMorph 8s ease-in-out infinite alternate;
}
.cta-liquid-sphere-one { width: 240px; height: 210px; right: 11%; top: -80px; }
.cta-liquid-sphere-two { width: 120px; height: 110px; left: 46%; bottom: -52px; animation-delay: -4s; }

/* Motion system */
.reveal-left { transform: translateX(-34px); }
[dir="rtl"] .reveal-left { transform: translateX(34px); }
.reveal-scale { transform: translateY(24px) scale(.96); }
.reveal-card { transform: translateY(28px) scale(.985); }
.reveal.is-visible,
.reveal-left.is-visible,
.reveal-scale.is-visible,
.reveal-card.is-visible { opacity: 1; transform: translate3d(0,0,0) scale(1); }
.reveal { transition-duration: .86s; transition-timing-function: cubic-bezier(.16,1,.3,1); }
.magnetic { will-change: transform; }

@keyframes liquidHeroDrift {
    0% { transform: scale(1.04) translate3d(0,0,0); }
    100% { transform: scale(1.09) translate3d(-1.2%,.8%,0); }
}
@keyframes blobMorph {
    0% { border-radius: 48% 52% 59% 41% / 42% 43% 57% 58%; transform: rotate(0deg) translateY(0); }
    50% { border-radius: 61% 39% 45% 55% / 56% 58% 42% 44%; transform: rotate(4deg) translateY(-8px); }
    100% { border-radius: 39% 61% 52% 48% / 45% 37% 63% 55%; transform: rotate(-4deg) translateY(7px); }
}
@keyframes heroWordIn { to { opacity: 1; transform: translateY(0) rotateX(0); } }
@keyframes glassSweep { 0%,65% { transform: translateX(-56%) rotate(5deg); } 100% { transform: translateX(58%) rotate(5deg); } }
@keyframes badgeFloat { 0%,100% { translate: 0 0; } 50% { translate: 0 -8px; } }
@keyframes pulseDot { 0% { box-shadow: 0 0 0 0 rgba(75,159,24,.28); } 80%,100% { box-shadow: 0 0 0 12px rgba(75,159,24,0); } }
@keyframes marqueeFlow { to { transform: translateX(-50%); } }
@keyframes orbitRotate { to { transform: translate(-50%,-50%) rotate(360deg); } }

@media (max-width: 1180px) {
    .hero-experience-grid { grid-template-columns: .9fr 1.1fr; }
    .hero-glass { padding: 34px; }
    .hero-copy.hero-glass h1 { font-size: 60px; }
    .hero-showcase, .hero-showcase > img { min-height: 500px; }
    .services-2026-grid { gap: 42px; }
    .regional-liquid-grid { gap: 30px; }
    .region-node { min-width: 110px; }
}

@media (max-width: 900px) {
    .liquid-cursor { display: none; }
    .hero-experience-grid { grid-template-columns: 1fr; padding-top: 48px; }
    .hero-glass { max-width: 760px; margin-inline: auto; text-align: center; }
    .hero-copy.hero-glass .eyebrow,
    .hero-copy.hero-glass .hero-actions,
    .hero-trust-row { justify-content: center; }
    .hero-copy.hero-glass h1 { font-size: clamp(48px, 10vw, 72px); }
    .hero-showcase { min-height: 520px; }
    .hero-showcase > img { min-height: 520px; }
    .hero-feature-dock { grid-template-columns: repeat(2,1fr); margin-top: 18px; }
    .model-pills { grid-template-columns: 1fr; }
    .ecosystem-visual img { min-height: 430px; }
    .services-2026-grid { grid-template-columns: 1fr; }
    .icon-board-wrap { max-width: 700px; margin-inline: auto; }
    .regional-liquid-section { min-height: 1150px; }
    .regional-liquid-grid { grid-template-columns: 1fr; }
    .regional-copy { max-width: 720px; margin-inline: auto; text-align: center; }
    .regional-copy .eyebrow { justify-content: center; }
    .region-orbit-panel { min-height: 600px; }
    .partner-cta.liquid-cta { grid-template-columns: 1fr; padding: 52px 42px; }
}

@media (max-width: 650px) {
    .home-page .site-header { backdrop-filter: blur(18px); }
    .liquid-hero::before { background: linear-gradient(180deg, rgba(247,252,255,.96), rgba(247,252,255,.74)); }
    .hero-experience-grid { padding-top: 26px; gap: 22px; }
    .hero-glass { padding: 30px 22px; border-radius: 28px; }
    .hero-copy.hero-glass h1 { font-size: 46px; }
    .hero-copy.hero-glass > p { font-size: 14px; }
    .hero-copy.hero-glass .hero-actions { flex-direction: column; }
    .hero-copy.hero-glass .button { width: 100%; }
    .hero-trust-row { text-align: start; }
    .hero-showcase,
    .hero-showcase > img { min-height: 370px; border-radius: 28px; }
    .hero-showcase > img { object-position: 64% center; }
    .hero-image-badge-top { top: 14px; right: 14px; }
    .hero-image-badge-bottom { bottom: 14px; left: 14px; }
    .hero-feature-dock { grid-template-columns: 1fr; border-radius: 22px; }
    .hero-feature-dock article { min-height: 64px; }
    .liquid-stats { grid-template-columns: repeat(2,1fr); }
    .liquid-stats > div { padding: 17px 14px; }
    .motion-marquee-track { min-height: 58px; }
    .ecosystem-visual { border-radius: 25px; }
    .ecosystem-visual img { min-height: 330px; object-position: center; }
    .ecosystem-floating-cta { right: 14px; bottom: 14px; }
    .model-pill { min-height: auto; padding: 21px; }
    .icon-board { border-radius: 25px; }
    .service-line { grid-template-columns: 26px 42px 1fr 34px; padding: 8px 10px; }
    .service-line strong { font-size: 11px; }
    .regional-liquid-section { min-height: 1000px; }
    .glass-panel { padding: 30px 22px; border-radius: 27px; }
    .regional-copy h2 { font-size: 42px; }
    .region-orbit-panel { min-height: 500px; transform: scale(.82); margin-inline: -40px; }
    .region-orbit-panel::before { width: 430px; height: 430px; }
    .region-node { min-width: 100px; padding: 10px; }
    .region-node-2 { right: 3%; }
    .region-node-3 { right: -2%; }
    .region-node-6 { left: -2%; }
    .partner-cta.liquid-cta { min-height: 430px; padding: 44px 26px; border-radius: 30px; }
}

@media (hover: none), (pointer: coarse) {
    .liquid-cursor { display: none; }
    .hero-showcase,
    .icon-board,
    .ecosystem-visual { transform: none!important; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .001ms!important; animation-iteration-count: 1!important; scroll-behavior: auto!important; transition-duration: .001ms!important; }
    .reveal,
    .reveal-left,
    .reveal-scale,
    .reveal-card { opacity: 1!important; transform: none!important; }
    .liquid-cursor,
    .page-transition { display: none!important; }
}

/* Preserve the generated artwork without distortion. */
.hero-showcase { min-height: 0; aspect-ratio: 1672 / 941; }
.hero-showcase > img { min-height: 0; height: 100%; object-fit: cover; }
.ecosystem-visual { aspect-ratio: 1672 / 941; }
.ecosystem-visual img { min-height: 0; height: 100%; object-fit: cover; }
.icon-board { aspect-ratio: 1448 / 1086; }
.icon-board img { height: 100%; object-fit: cover; }

@media (max-width: 1180px) {
    .hero-showcase, .hero-showcase > img { min-height: 0; }
}
@media (max-width: 900px) {
    .hero-showcase, .hero-showcase > img { min-height: 0; }
    .ecosystem-visual img { min-height: 0; }
}
@media (max-width: 650px) {
    .hero-showcase, .hero-showcase > img { min-height: 0; border-radius: 28px; }
    .hero-showcase > img { object-position: center; }
    .ecosystem-visual img { min-height: 0; object-position: center; }
}

/* ========================================================================== 
   HS Fresh 2026 identity, premium authentication, adaptive theme and AI layer
   ========================================================================== */
:root {
    --surface: #ffffff;
    --surface-2: #f5f8fb;
    --surface-3: #edf3f8;
    --surface-glass: rgba(255,255,255,.72);
    --surface-glass-strong: rgba(255,255,255,.9);
    --text-strong: #0a1f3d;
    --text-body: #526176;
    --text-faint: #8793a4;
    --border-adaptive: rgba(15,42,76,.12);
    --shadow-adaptive: 0 28px 80px rgba(11,35,71,.13);
    --focus-ring: 0 0 0 5px rgba(75,159,24,.12);
    --ai-panel-width: 390px;
}

html[data-theme="dark"] {
    --navy: #eaf4ff;
    --navy-2: #d8eaff;
    --navy-3: #050c16;
    --green: #83d33f;
    --green-2: #a0e75f;
    --green-soft: rgba(131,211,63,.12);
    --cream: #07111f;
    --paper: #0d1929;
    --ink: #eef6ff;
    --muted: #9bacbf;
    --line: rgba(197,218,240,.13);
    --surface: #0d1929;
    --surface-2: #0a1524;
    --surface-3: #111f31;
    --surface-glass: rgba(8,19,33,.74);
    --surface-glass-strong: rgba(10,22,38,.92);
    --text-strong: #eff7ff;
    --text-body: #a8b8ca;
    --text-faint: #71849a;
    --border-adaptive: rgba(196,222,246,.14);
    --shadow-adaptive: 0 32px 90px rgba(0,0,0,.42);
    --focus-ring: 0 0 0 5px rgba(131,211,63,.13);
}

html[data-theme="dark"] body { background: var(--cream); color: var(--ink); }
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] strong { color: var(--text-strong); }
html[data-theme="dark"] p,
html[data-theme="dark"] small { color: var(--text-body); }
html[data-theme="dark"] .site-header,
html[data-theme="dark"] .home-page .site-header,
html[data-theme="dark"] .home-page .site-header.is-scrolled { background: rgba(6,15,27,.84); border-bottom-color: rgba(255,255,255,.08); box-shadow: 0 16px 55px rgba(0,0,0,.28); }
html[data-theme="dark"] .primary-nav a,
html[data-theme="dark"] .language-button,
html[data-theme="dark"] .login-link,
html[data-theme="dark"] .account-dropdown a,
html[data-theme="dark"] .account-dropdown button { color: #c7d5e5; }
html[data-theme="dark"] .primary-nav a.is-active { color: #fff; }
html[data-theme="dark"] .icon-action,
html[data-theme="dark"] .mobile-menu-button,
html[data-theme="dark"] .language-menu,
html[data-theme="dark"] .account-dropdown,
html[data-theme="dark"] .toast,
html[data-theme="dark"] .panel-card,
html[data-theme="dark"] .data-card,
html[data-theme="dark"] .product-card,
html[data-theme="dark"] .order-card,
html[data-theme="dark"] .distributor-welcome,
html[data-theme="dark"] .distributor-profile-strip,
html[data-theme="dark"] .distributor-product-card,
html[data-theme="dark"] .filter-chips a,
html[data-theme="dark"] .translation-tabs button,
html[data-theme="dark"] .panel-search { background: var(--surface); border-color: var(--line); }
html[data-theme="dark"] .icon-action svg,
html[data-theme="dark"] .mobile-menu-button span { stroke: #ddebfb; background-color: #ddebfb; }
html[data-theme="dark"] .language-menu a:hover,
html[data-theme="dark"] .language-menu a.is-current,
html[data-theme="dark"] .account-dropdown a:hover,
html[data-theme="dark"] .account-dropdown button:hover { background: rgba(131,211,63,.1); color: #fff; }
html[data-theme="dark"] .site-footer { background: #040b13; }
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea { background: #0a1727; color: #edf6ff; border-color: rgba(194,217,240,.16); }
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color: #63788f; }
html[data-theme="dark"] .panel-body { background: #07111f; }
html[data-theme="dark"] .panel-main,
html[data-theme="dark"] .panel-topbar { background: #07111f; }
html[data-theme="dark"] .panel-topbar { border-bottom-color: rgba(255,255,255,.08); }
html[data-theme="dark"] .panel-sidebar { background: #050c16; border-inline-end-color: rgba(255,255,255,.08); }
html[data-theme="dark"] .panel-nav a { color: #91a4b9; }
html[data-theme="dark"] .panel-nav a:hover,
html[data-theme="dark"] .panel-nav a.is-active { background: rgba(131,211,63,.1); color: #fff; }
html[data-theme="dark"] .panel-table th,
html[data-theme="dark"] .panel-table td,
html[data-theme="dark"] .data-table th,
html[data-theme="dark"] .data-table td { border-color: rgba(255,255,255,.08); color: #afc0d2; }
html[data-theme="dark"] .panel-table th,
html[data-theme="dark"] .data-table th { background: #0a1524; color: #7f93a9; }
html[data-theme="dark"] .application-meta,
html[data-theme="dark"] .distributor-prices > div,
html[data-theme="dark"] .panel-checkbox { background: #0a1524; }
html[data-theme="dark"] .product-form-preview,
html[data-theme="dark"] .table-product img,
html[data-theme="dark"] .quick-product-list img,
html[data-theme="dark"] .distributor-product-image { background: #0f2033; }

/* Theme switch */
.theme-toggle {
    width: 64px;
    height: 38px;
    padding: 0;
    border: 1px solid var(--border-adaptive);
    border-radius: 999px;
    background: var(--surface-glass-strong);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.65), 0 8px 24px rgba(11,35,71,.08);
    backdrop-filter: blur(14px);
    transition: border-color .25s ease, background .25s ease, box-shadow .25s ease, transform .25s ease;
}
.theme-toggle:hover { transform: translateY(-1px); box-shadow: 0 12px 30px rgba(11,35,71,.13); }
.theme-toggle-track { position: relative; width: 100%; height: 100%; display: flex; align-items: center; justify-content: space-between; padding: 0 8px; }
.theme-icon { width: 14px; height: 14px; display: grid; place-items: center; color: #f0a81d; z-index: 1; }
.theme-icon-moon { color: #8da2bd; }
.theme-icon svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.theme-toggle-thumb { position: absolute; z-index: 0; top: 4px; left: 4px; width: 28px; height: 28px; border-radius: 50%; background: linear-gradient(145deg, #fff, #eef5fb); box-shadow: 0 5px 13px rgba(15,42,76,.18), inset 0 1px 0 rgba(255,255,255,.9); transition: transform .32s cubic-bezier(.2,.8,.2,1), background .3s ease; }
html[data-theme="dark"] .theme-toggle { background: rgba(10,24,40,.86); border-color: rgba(255,255,255,.12); box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 28px rgba(0,0,0,.25); }
html[data-theme="dark"] .theme-toggle-thumb { transform: translateX(26px); background: linear-gradient(145deg, #17304f, #0b1a2d); box-shadow: 0 5px 15px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.12); }
[dir="rtl"] html[data-theme="dark"] .theme-toggle-thumb,
[dir="rtl"] .theme-toggle[data-active-theme="dark"] .theme-toggle-thumb { transform: translateX(26px); }

/* Premium authentication */
.auth-route .announcement,
.auth-route .site-footer { display: none; }
.auth-route .site-header { position: absolute; width: 100%; background: transparent; border-bottom-color: transparent; box-shadow: none; }
.auth-route .site-header .primary-nav { display: none; }
.auth-route .site-header .nav-shell { grid-template-columns: 180px 1fr auto; }
.auth-route .site-header .brand { opacity: 0; pointer-events: none; }
.auth-route .site-header .cart-action,
.auth-route .site-header .login-link,
.auth-route .site-header .register-link { display: none; }

.auth-experience {
    position: relative;
    min-height: 100vh;
    overflow: hidden;
    isolation: isolate;
    padding: 126px 0 64px;
    background: #edf5fb;
}
.auth-experience-bg { position: absolute; z-index: -4; inset: -4%; width: 108%; height: 108%; object-fit: cover; filter: saturate(.92) contrast(.98); }
.auth-experience-veil { position: absolute; z-index: -3; inset: 0; background: linear-gradient(105deg, rgba(5,20,39,.96) 0%, rgba(6,28,54,.88) 43%, rgba(234,244,252,.48) 68%, rgba(240,248,253,.7) 100%); }
.auth-register-page .auth-experience-veil { background: linear-gradient(105deg, rgba(5,20,39,.97) 0%, rgba(6,28,54,.91) 47%, rgba(233,244,251,.45) 70%, rgba(240,248,253,.73) 100%); }
.auth-experience::after { content: ""; position: absolute; z-index: -2; inset: 0; opacity: .26; background-image: linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px); background-size: 74px 74px; mask-image: linear-gradient(90deg,#000,transparent 70%); }
.auth-liquid-shape { position: absolute; z-index: -1; display: block; border: 1px solid rgba(255,255,255,.58); background: radial-gradient(circle at 28% 22%, rgba(255,255,255,.88), rgba(69,160,230,.18) 46%, rgba(75,159,24,.11)); box-shadow: inset 0 0 35px rgba(255,255,255,.52), 0 28px 80px rgba(22,83,140,.16); backdrop-filter: blur(3px); animation: authBlob 10s ease-in-out infinite alternate; }
.auth-liquid-shape-one { width: 180px; height: 156px; top: 18%; left: 46%; border-radius: 44% 56% 61% 39% / 50% 42% 58% 50%; }
.auth-liquid-shape-two { width: 94px; height: 88px; right: 4%; top: 27%; border-radius: 61% 39% 49% 51% / 41% 56% 44% 59%; animation-delay: -3s; }
.auth-liquid-shape-three { width: 130px; height: 116px; left: 6%; bottom: 7%; border-radius: 53% 47% 40% 60% / 58% 44% 56% 42%; animation-delay: -6s; }
.auth-experience-shell { position: relative; }
.auth-back-link { position: absolute; top: -56px; left: 0; display: inline-flex; align-items: center; gap: 11px; color: rgba(255,255,255,.72); font-size: 12px; font-weight: 800; letter-spacing: .03em; transition: color .2s ease, transform .2s ease; }
.auth-back-link span { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; background: rgba(255,255,255,.06); backdrop-filter: blur(10px); }
.auth-back-link:hover { color: #fff; transform: translateX(-4px); }
.auth-layout { min-height: calc(100vh - 190px); display: grid; grid-template-columns: minmax(0,1fr) minmax(450px,560px); gap: clamp(46px,7vw,110px); align-items: center; }
.auth-layout-register { grid-template-columns: minmax(0,.9fr) minmax(560px,680px); gap: clamp(40px,5vw,80px); }
.auth-story { max-width: 650px; color: #fff; }
.auth-story-topline { margin-bottom: 32px; display: flex; align-items: center; justify-content: space-between; color: rgba(255,255,255,.4); font-size: 9px; font-weight: 900; letter-spacing: .16em; }
.auth-secure-pill { display: inline-flex; align-items: center; gap: 8px; min-height: 30px; padding: 0 12px; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; background: rgba(255,255,255,.06); color: rgba(255,255,255,.68); letter-spacing: .08em; backdrop-filter: blur(12px); }
.auth-secure-pill i,
.secure-inline i { width: 7px; height: 7px; border-radius: 50%; background: #82d844; box-shadow: 0 0 0 6px rgba(130,216,68,.1); animation: pulseDot 2s infinite; }
.auth-story-logo { width: 132px; min-height: 70px; margin-bottom: 36px; padding: 8px 12px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.15); border-radius: 19px; background: rgba(255,255,255,.92); box-shadow: 0 16px 48px rgba(0,0,0,.2); }
.auth-story-logo img { width: 118px; }
.auth-story h1 { max-width: 620px; margin: 19px 0 22px; color: #fff; font-size: clamp(49px,5.2vw,76px); line-height: .98; letter-spacing: -.058em; }
.auth-layout-register .auth-story h1 { font-size: clamp(44px,4.4vw,67px); }
.auth-story > p { max-width: 590px; margin-bottom: 32px; color: rgba(224,237,249,.66); font-size: 15px; line-height: 1.8; }
.auth-story-benefits { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.auth-story-benefits > div { min-height: 58px; padding: 12px 14px; display: flex; align-items: center; gap: 12px; border: 1px solid rgba(255,255,255,.1); border-radius: 16px; background: linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.025)); backdrop-filter: blur(12px); }
.auth-story-benefits span { width: 28px; height: 28px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 9px; background: rgba(130,216,68,.12); color: #9aeb5e; font-size: 9px; font-weight: 900; }
.auth-story-benefits strong { color: rgba(255,255,255,.86); font-size: 10px; letter-spacing: .02em; }
.auth-story-footer { margin-top: 28px; display: flex; align-items: center; gap: 14px; }
.auth-avatar-stack { display: flex; align-items: center; }
.auth-avatar-stack span,
.auth-avatar-stack b { width: 31px; height: 31px; margin-inline-start: -7px; display: grid; place-items: center; border: 2px solid #0b2347; border-radius: 50%; background: #fff; color: #0b2347; font-size: 8px; font-weight: 900; }
.auth-avatar-stack span:first-child { margin-inline-start: 0; background: #78c93a; color: #fff; }
.auth-avatar-stack b { background: #183b66; color: #fff; }
.auth-story-footer p { margin: 0; color: rgba(255,255,255,.52); font-size: 10px; }
.auth-progress-map { position: relative; max-width: 470px; height: 80px; margin: 12px 0 28px; display: grid; grid-template-columns: auto 1fr auto 1fr auto; align-items: center; }
.map-node { display: grid; justify-items: center; gap: 8px; color: rgba(255,255,255,.55); font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.map-node i { width: 20px; height: 20px; border: 4px solid rgba(255,255,255,.16); border-radius: 50%; background: #85d54a; box-shadow: 0 0 0 7px rgba(133,213,74,.08), 0 0 22px rgba(133,213,74,.34); }
.map-line { height: 1px; background: linear-gradient(90deg,rgba(130,216,68,.7),rgba(108,185,245,.55)); box-shadow: 0 0 12px rgba(102,188,244,.35); }

.auth-form-wrap { position: relative; transform-style: preserve-3d; transition: transform .25s ease; }
.auth-form-wrap::before { content: ""; position: absolute; inset: 24px -20px -24px 20px; z-index: -1; border-radius: 38px; background: rgba(35,105,161,.14); filter: blur(26px); }
.auth-form-card { position: relative; overflow: hidden; padding: 42px; border: 1px solid rgba(255,255,255,.72); border-radius: 34px; background: rgba(255,255,255,.83); box-shadow: 0 34px 100px rgba(7,29,54,.24), inset 0 1px 0 rgba(255,255,255,.88); backdrop-filter: blur(30px) saturate(145%); }
.auth-register-card { padding: 34px 36px 30px; }
.auth-card-glow { position: absolute; inset: -55% 30% auto -40%; height: 360px; border-radius: 50%; background: radial-gradient(circle,rgba(101,194,255,.22),transparent 66%); pointer-events: none; }
.auth-form-card::after { content: ""; position: absolute; top: -30%; left: -32%; width: 42%; height: 160%; transform: rotate(12deg); background: linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent); animation: authGlassSweep 8s ease-in-out infinite; pointer-events: none; }
.auth-form-header { position: relative; margin-bottom: 28px; }
.auth-form-kicker { display: inline-flex; align-items: center; min-height: 25px; padding: 0 10px; border: 1px solid rgba(75,159,24,.16); border-radius: 999px; background: rgba(75,159,24,.08); color: #438c17; font-size: 8px; font-weight: 900; letter-spacing: .14em; }
.auth-form-header h2 { margin: 13px 0 6px; color: #0a2444; font-size: 34px; }
.auth-form-header p { margin: 0; color: #718096; font-size: 11px; line-height: 1.55; }
.auth-fields-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.premium-field-wide { grid-column: 1/-1; }
.premium-field { position: relative; margin-top: 17px; }
.auth-fields-grid .premium-field { margin-top: 0; }
.premium-field > label { display: block; margin: 0 0 8px 2px; color: #30445d; font-size: 9px; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.premium-input-shell { position: relative; min-height: 58px; display: flex; align-items: center; border: 1px solid rgba(22,55,91,.13); border-radius: 16px; background: rgba(248,251,254,.88); box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 7px 18px rgba(12,45,78,.04); transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease, background .2s ease; }
.premium-input-shell:hover { border-color: rgba(75,159,24,.26); }
.premium-input-shell.is-focused,
.premium-input-shell:focus-within { border-color: rgba(75,159,24,.72); background: #fff; box-shadow: var(--focus-ring), 0 14px 30px rgba(11,35,71,.08); transform: translateY(-1px); }
.premium-input-shell input,
.premium-input-shell select { height: 56px; margin: 0; padding: 0 45px 0 49px; border: 0; border-radius: inherit; background: transparent; box-shadow: none; color: #102842; font-size: 12px; }
.premium-input-shell input:focus,
.premium-input-shell select:focus { border: 0; box-shadow: none; }
.premium-input-shell input::placeholder { color: #9aa8b8; }
.field-icon { position: absolute; inset-inline-start: 17px; width: 19px; height: 19px; color: #6d8299; pointer-events: none; }
.field-icon svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.premium-input-shell:focus-within .field-icon { color: #4b9f18; }
.field-status { position: absolute; inset-inline-end: 17px; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; background: rgba(75,159,24,.1); color: #4b9f18; font-size: 9px; font-weight: 900; opacity: 0; transform: scale(.65); transition: .2s ease; }
.premium-input-shell.is-valid:not(.password-field) .field-status { opacity: 1; transform: scale(1); }
.premium-field.has-error .premium-input-shell { border-color: #e14e47; box-shadow: 0 0 0 4px rgba(225,78,71,.08); }
.field-error { display: block; margin: 6px 0 0 3px; color: #c93a33; font-size: 9px; font-weight: 700; }
.standalone-error { margin-bottom: 10px; }
.password-visibility { position: absolute; inset-inline-end: 12px; width: 36px; height: 36px; display: grid; place-items: center; border: 0; border-radius: 11px; background: transparent; color: #74869a; }
.password-visibility:hover { background: rgba(15,50,85,.06); color: #335d88; }
.password-visibility svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.password-visibility .eye-closed { display: none; }
.password-visibility.is-visible .eye-open { display: none; }
.password-visibility.is-visible .eye-closed { display: block; }
.select-shell select { appearance: none; padding-inline-end: 48px; }
.select-chevron { position: absolute; inset-inline-end: 18px; color: #7d8fa3; pointer-events: none; }
.auth-form-options { margin: 18px 0; display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.premium-check { display: flex; align-items: flex-start; gap: 10px; color: #53657a; font-size: 10px; line-height: 1.55; cursor: pointer; }
.premium-check input { position: absolute; opacity: 0; pointer-events: none; }
.premium-check-box { width: 19px; height: 19px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid rgba(30,62,96,.22); border-radius: 6px; background: rgba(255,255,255,.7); transition: .2s ease; }
.premium-check-box svg { width: 13px; height: 13px; fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; opacity: 0; transform: scale(.6); transition: .2s ease; }
.premium-check input:checked + .premium-check-box { border-color: #4b9f18; background: #4b9f18; box-shadow: 0 5px 13px rgba(75,159,24,.22); }
.premium-check input:checked + .premium-check-box svg { opacity: 1; transform: scale(1); }
.terms-check { margin: 17px 0; }
.secure-inline { display: inline-flex; align-items: center; gap: 7px; color: #78899c; font-size: 9px; font-weight: 700; }
.secure-inline i { width: 6px; height: 6px; box-shadow: none; }
.auth-submit { position: relative; width: 100%; min-height: 59px; padding: 0 9px 0 22px; display: flex; align-items: center; justify-content: space-between; overflow: hidden; border: 0; border-radius: 18px; background: linear-gradient(125deg,#0b2347,#173f70 54%,#4b9f18 150%); color: #fff; box-shadow: 0 17px 38px rgba(11,35,71,.24); font-size: 11px; font-weight: 850; letter-spacing: .03em; transition: transform .22s ease, box-shadow .22s ease, filter .22s ease; }
.auth-submit::before { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg,transparent 20%,rgba(255,255,255,.17),transparent 70%); transform: translateX(-100%); transition: transform .6s ease; }
.auth-submit:hover { transform: translateY(-2px); box-shadow: 0 22px 46px rgba(11,35,71,.31); filter: saturate(1.12); }
.auth-submit:hover::before { transform: translateX(100%); }
.auth-submit i { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; background: rgba(255,255,255,.13); }
.auth-submit svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.auth-divider { margin: 22px 0 14px; display: flex; align-items: center; gap: 12px; color: #8c9aac; font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.auth-divider::before,
.auth-divider::after { content: ""; flex: 1; height: 1px; background: rgba(20,50,82,.09); }
.demo-access-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.demo-access-grid button { min-height: 55px; padding: 9px; display: grid; grid-template-columns: 32px 1fr; gap: 9px; align-items: center; border: 1px solid rgba(20,50,82,.1); border-radius: 14px; background: rgba(248,251,254,.72); text-align: start; transition: .2s ease; }
.demo-access-grid button:hover,
.demo-access-grid button.is-filled { border-color: rgba(75,159,24,.36); background: rgba(75,159,24,.06); transform: translateY(-1px); }
.demo-role-icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; background: #0b2347; color: #fff; font-size: 9px; font-weight: 900; }
.demo-access-grid button:nth-child(2) .demo-role-icon { background: #4b9f18; }
.demo-access-grid strong,
.demo-access-grid small { display: block; }
.demo-access-grid strong { color: #294159; font-size: 8px; }
.demo-access-grid small { margin-top: 3px; color: #8b99a9; font-size: 7px; }
.auth-switch-premium { margin: 19px 0 0; text-align: center; color: #7b8b9e; font-size: 10px; }
.auth-switch-premium a { color: #478f1a; font-weight: 850; }
.auth-security-line { margin-top: 16px; padding-top: 14px; display: flex; align-items: center; justify-content: center; gap: 7px; border-top: 1px solid rgba(20,50,82,.08); color: #95a1af; font-size: 7px; text-align: center; }
.auth-security-line svg { width: 14px; height: 14px; fill: none; stroke: #6e8e55; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.password-strength { margin-top: 7px; }
.password-strength > div { display: grid; grid-template-columns: repeat(4,1fr); gap: 4px; }
.password-strength > div span { height: 3px; border-radius: 999px; background: #dce4ec; transition: background .2s ease, transform .2s ease; }
.password-strength > div span.is-active { background: #e5a52c; transform: scaleY(1.3); }
.password-strength[data-score="4"] > div span.is-active { background: #4b9f18; }
.password-strength small { display: block; margin-top: 5px; color: #93a1b1; font-size: 7px; }
.password-strength small b { color: #536b84; }

html[data-theme="dark"] .auth-experience-veil { background: linear-gradient(105deg,rgba(2,9,17,.98) 0%,rgba(4,19,34,.95) 46%,rgba(6,18,31,.8) 76%,rgba(5,13,23,.9)); }
html[data-theme="dark"] .auth-experience-bg { filter: brightness(.42) saturate(.86) hue-rotate(2deg); }
html[data-theme="dark"] .auth-form-card { border-color: rgba(255,255,255,.12); background: rgba(7,18,31,.82); box-shadow: 0 34px 100px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.07); }
html[data-theme="dark"] .auth-form-card::after { background: linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent); }
html[data-theme="dark"] .auth-form-header h2 { color: #f3f8ff; }
html[data-theme="dark"] .auth-form-header p,
html[data-theme="dark"] .premium-field > label { color: #9db0c5; }
html[data-theme="dark"] .premium-input-shell { border-color: rgba(189,216,242,.13); background: rgba(5,15,27,.72); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
html[data-theme="dark"] .premium-input-shell.is-focused,
html[data-theme="dark"] .premium-input-shell:focus-within { border-color: rgba(131,211,63,.64); background: #081729; box-shadow: var(--focus-ring), 0 15px 34px rgba(0,0,0,.3); }
html[data-theme="dark"] .premium-input-shell input,
html[data-theme="dark"] .premium-input-shell select { color: #edf6ff; }
html[data-theme="dark"] .premium-input-shell input::placeholder { color: #60758c; }
html[data-theme="dark"] .field-icon,
html[data-theme="dark"] .password-visibility { color: #6f849a; }
html[data-theme="dark"] .premium-check { color: #9bacc0; }
html[data-theme="dark"] .premium-check-box { border-color: rgba(255,255,255,.16); background: rgba(255,255,255,.04); }
html[data-theme="dark"] .demo-access-grid button { border-color: rgba(255,255,255,.09); background: rgba(255,255,255,.035); }
html[data-theme="dark"] .demo-access-grid strong { color: #c7d6e6; }
html[data-theme="dark"] .auth-divider::before,
html[data-theme="dark"] .auth-divider::after,
html[data-theme="dark"] .auth-security-line { border-color: rgba(255,255,255,.08); background-color: transparent; }
html[data-theme="dark"] .password-strength > div span { background: #1a2b3f; }

/* AI assistant */
.ai-assistant { position: fixed; z-index: 160; inset-inline-end: 24px; bottom: 22px; }
.ai-launcher { position: relative; min-width: 160px; height: 58px; padding: 0 16px 0 9px; display: flex; align-items: center; gap: 10px; border: 1px solid rgba(255,255,255,.66); border-radius: 999px; background: linear-gradient(135deg,rgba(255,255,255,.94),rgba(235,246,253,.88)); color: #0b2748; box-shadow: 0 18px 48px rgba(9,43,77,.2), inset 0 1px 0 rgba(255,255,255,.94); backdrop-filter: blur(20px); transition: transform .25s ease, box-shadow .25s ease, opacity .25s ease; }
.ai-launcher:hover { transform: translateY(-3px); box-shadow: 0 24px 58px rgba(9,43,77,.26); }
.ai-launcher-halo { position: absolute; inset: -7px; border: 1px solid rgba(75,159,24,.18); border-radius: inherit; opacity: .7; animation: aiHalo 2.6s ease-out infinite; }
.ai-launcher-core { width: 42px; height: 42px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50% 45% 54% 46%; background: linear-gradient(145deg,#0f3763,#1c69a1 62%,#5aaa20); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 8px 20px rgba(16,74,121,.26); }
.ai-launcher-core svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.ai-launcher-label { font-size: 11px; font-weight: 850; letter-spacing: -.01em; }
.ai-online-dot { width: 8px; height: 8px; margin-inline-start: auto; border-radius: 50%; background: #69bd2d; box-shadow: 0 0 0 5px rgba(105,189,45,.12); }
.ai-panel { position: absolute; inset-inline-end: 0; bottom: 72px; width: min(var(--ai-panel-width), calc(100vw - 28px)); height: min(620px, calc(100vh - 110px)); display: grid; grid-template-rows: auto 1fr auto auto; overflow: hidden; border: 1px solid rgba(255,255,255,.74); border-radius: 30px; background: rgba(252,254,255,.9); box-shadow: 0 35px 110px rgba(7,35,66,.28), inset 0 1px 0 rgba(255,255,255,.9); backdrop-filter: blur(30px) saturate(145%); opacity: 0; visibility: hidden; transform: translateY(20px) scale(.95); transform-origin: bottom right; transition: opacity .28s ease, visibility .28s ease, transform .38s cubic-bezier(.2,.8,.2,1); }
.ai-assistant.is-open .ai-panel { opacity: 1; visibility: visible; transform: translateY(0) scale(1); }
.ai-assistant.is-open .ai-launcher { opacity: .4; transform: scale(.92); }
.ai-panel-glow { position: absolute; inset: -100px -80px auto auto; width: 260px; height: 260px; border-radius: 50%; background: radial-gradient(circle,rgba(84,181,246,.25),transparent 68%); pointer-events: none; }
.ai-header { position: relative; min-height: 80px; padding: 15px 16px; display: grid; grid-template-columns: 48px 1fr 34px; gap: 11px; align-items: center; border-bottom: 1px solid rgba(15,48,82,.08); }
.ai-avatar { width: 48px; height: 48px; padding: 7px; display: grid; place-items: center; border-radius: 15px; background: #fff; box-shadow: 0 8px 22px rgba(9,42,74,.12); }
.ai-avatar img { width: 100%; }
.ai-title-row { display: flex; align-items: center; gap: 7px; }
.ai-title-row strong { color: #0c294a; font-size: 13px; }
.ai-title-row span { padding: 3px 6px; border-radius: 999px; background: rgba(75,159,24,.1); color: #4b9f18; font-size: 6px; font-weight: 900; letter-spacing: .08em; }
.ai-header p { margin: 4px 0 0; display: flex; align-items: center; gap: 6px; color: #7d8da0; font-size: 8px; line-height: 1.2; }
.ai-header p i { width: 6px; height: 6px; border-radius: 50%; background: #65b92a; }
.ai-close { width: 33px; height: 33px; border: 0; border-radius: 11px; background: rgba(14,47,81,.05); color: #72859a; font-size: 20px; }
.ai-close:hover { background: rgba(14,47,81,.1); color: #1d3e61; }
.ai-conversation { overflow-y: auto; padding: 18px 15px 8px; scroll-behavior: smooth; scrollbar-width: thin; scrollbar-color: rgba(48,90,132,.18) transparent; }
.ai-message { margin-bottom: 13px; display: flex; align-items: flex-end; gap: 8px; }
.ai-message.is-user { flex-direction: row-reverse; }
.ai-message-avatar { width: 27px; height: 27px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 9px; background: linear-gradient(145deg,#153c67,#4b9f18); color: #fff; font-size: 8px; font-weight: 900; }
.ai-message.is-user .ai-message-avatar { background: #dce9f4; color: #1b466f; }
.ai-bubble { max-width: 82%; padding: 11px 12px; border: 1px solid rgba(17,55,92,.08); border-radius: 7px 17px 17px 17px; background: #fff; box-shadow: 0 8px 22px rgba(10,42,73,.06); }
.ai-message.is-user .ai-bubble { border-radius: 17px 7px 17px 17px; background: linear-gradient(135deg,#0c2d53,#174b7c); }
.ai-bubble p { margin: 0; color: #43576d; font-size: 10px; line-height: 1.65; white-space: pre-wrap; }
.ai-message.is-user .ai-bubble p { color: rgba(255,255,255,.92); }
.ai-bubble small { display: block; margin-top: 6px; color: #a1adba; font-size: 7px; }
.ai-suggestions { margin: 8px 0 14px 35px; display: flex; flex-wrap: wrap; gap: 6px; }
.ai-suggestions button { min-height: 32px; padding: 0 10px; border: 1px solid rgba(75,159,24,.18); border-radius: 999px; background: rgba(75,159,24,.06); color: #467d24; font-size: 8px; font-weight: 750; }
.ai-suggestions button:hover { border-color: rgba(75,159,24,.4); background: rgba(75,159,24,.11); }
.ai-typing-dots { display: inline-flex; gap: 3px; margin-top: 7px; }
.ai-typing-dots i { width: 4px; height: 4px; border-radius: 50%; background: #7890a8; animation: aiTyping 1.2s infinite; }
.ai-typing-dots i:nth-child(2) { animation-delay: .15s; }
.ai-typing-dots i:nth-child(3) { animation-delay: .3s; }
.ai-product-rail { margin: 0 0 15px 35px; display: grid; gap: 7px; }
.ai-product-card { padding: 7px; display: grid; grid-template-columns: 46px 1fr; gap: 9px; align-items: center; border: 1px solid rgba(16,52,87,.08); border-radius: 14px; background: rgba(255,255,255,.82); box-shadow: 0 7px 20px rgba(9,39,70,.05); transition: .2s ease; }
.ai-product-card:hover { transform: translateY(-1px); border-color: rgba(75,159,24,.25); }
.ai-product-card img { width: 46px; height: 42px; padding: 4px; object-fit: contain; border-radius: 10px; background: #edf5e8; }
.ai-product-card strong,
.ai-product-card small { display: block; }
.ai-product-card strong { color: #1c3958; font-size: 9px; }
.ai-product-card small { margin-top: 3px; color: #4b9f18; font-size: 8px; font-weight: 800; }
.ai-composer { margin: 0 12px 10px; min-height: 54px; padding: 7px 7px 7px 13px; display: grid; grid-template-columns: 1fr 40px; align-items: end; gap: 7px; border: 1px solid rgba(16,51,86,.12); border-radius: 18px; background: rgba(255,255,255,.88); box-shadow: 0 8px 25px rgba(10,42,73,.07); }
.ai-composer:focus-within { border-color: rgba(75,159,24,.45); box-shadow: var(--focus-ring); }
.ai-composer textarea { min-height: 38px; max-height: 120px; margin: 0; padding: 10px 0 7px; border: 0; background: transparent; box-shadow: none; color: #243e5b; font-size: 10px; line-height: 1.5; resize: none; }
.ai-composer textarea:focus { box-shadow: none; }
.ai-composer button { width: 40px; height: 40px; display: grid; place-items: center; border: 0; border-radius: 13px; background: linear-gradient(135deg,#0b2b50,#1b5c91 65%,#4b9f18); color: #fff; box-shadow: 0 8px 18px rgba(13,64,106,.24); }
.ai-composer button:disabled { opacity: .55; cursor: wait; }
.ai-composer button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ai-footer { min-height: 26px; padding: 0 15px 10px; display: flex; align-items: center; justify-content: center; gap: 5px; color: #a0acb9; font-size: 6.5px; text-align: center; }
.ai-footer span { color: #4b9f18; }

html[data-theme="dark"] .ai-launcher { border-color: rgba(255,255,255,.12); background: linear-gradient(135deg,rgba(8,22,38,.94),rgba(12,31,50,.9)); color: #e6f1fb; box-shadow: 0 18px 50px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.08); }
html[data-theme="dark"] .ai-panel { border-color: rgba(255,255,255,.12); background: rgba(6,17,30,.92); box-shadow: 0 35px 110px rgba(0,0,0,.56), inset 0 1px 0 rgba(255,255,255,.06); }
html[data-theme="dark"] .ai-header { border-bottom-color: rgba(255,255,255,.08); }
html[data-theme="dark"] .ai-avatar { background: #f4f8fb; }
html[data-theme="dark"] .ai-title-row strong { color: #eff7ff; }
html[data-theme="dark"] .ai-close { background: rgba(255,255,255,.05); color: #8fa2b7; }
html[data-theme="dark"] .ai-bubble { border-color: rgba(255,255,255,.08); background: #0e1d2f; box-shadow: 0 8px 22px rgba(0,0,0,.18); }
html[data-theme="dark"] .ai-bubble p { color: #afc0d2; }
html[data-theme="dark"] .ai-message.is-user .ai-bubble { background: linear-gradient(135deg,#12385e,#1a5687); }
html[data-theme="dark"] .ai-message.is-user .ai-bubble p { color: #fff; }
html[data-theme="dark"] .ai-message.is-user .ai-message-avatar { background: #18314d; color: #cbe1f4; }
html[data-theme="dark"] .ai-suggestions button { border-color: rgba(131,211,63,.2); background: rgba(131,211,63,.07); color: #a9df79; }
html[data-theme="dark"] .ai-product-card { border-color: rgba(255,255,255,.08); background: rgba(255,255,255,.035); }
html[data-theme="dark"] .ai-product-card strong { color: #dceafb; }
html[data-theme="dark"] .ai-product-card img { background: #102438; }
html[data-theme="dark"] .ai-composer { border-color: rgba(255,255,255,.1); background: rgba(255,255,255,.045); box-shadow: 0 8px 25px rgba(0,0,0,.2); }
html[data-theme="dark"] .ai-composer textarea { color: #e6f0fa; }

@keyframes authBlob { 0% { transform: translate3d(0,0,0) rotate(-4deg); border-radius: 44% 56% 61% 39% / 50% 42% 58% 50%; } 50% { transform: translate3d(0,-12px,0) rotate(3deg); border-radius: 58% 42% 46% 54% / 40% 57% 43% 60%; } 100% { transform: translate3d(9px,8px,0) rotate(-2deg); border-radius: 39% 61% 54% 46% / 58% 38% 62% 42%; } }
@keyframes authGlassSweep { 0%,70% { transform: translateX(-30%) rotate(12deg); } 100% { transform: translateX(340%) rotate(12deg); } }
@keyframes aiHalo { 0% { opacity: .55; transform: scale(.9); } 85%,100% { opacity: 0; transform: scale(1.18); } }
@keyframes aiTyping { 0%,80%,100% { transform: translateY(0); opacity: .4; } 40% { transform: translateY(-3px); opacity: 1; } }

[dir="rtl"] .auth-back-link { left: auto; right: 0; }
[dir="rtl"] .auth-back-link:hover { transform: translateX(4px); }
[dir="rtl"] .premium-input-shell input,
[dir="rtl"] .premium-input-shell select { padding: 0 49px 0 45px; }
[dir="rtl"] .ai-panel { transform-origin: bottom left; }
[dir="rtl"] .ai-suggestions,
[dir="rtl"] .ai-product-rail { margin-left: 0; margin-right: 35px; }

@media (max-width: 1120px) {
    .auth-layout,
    .auth-layout-register { grid-template-columns: minmax(0,.86fr) minmax(440px,1.14fr); gap: 42px; }
    .auth-story h1 { font-size: 52px; }
    .auth-layout-register .auth-story h1 { font-size: 47px; }
    .auth-form-card { padding: 34px; }
}

@media (max-width: 900px) {
    .auth-route .site-header .nav-shell { grid-template-columns: 1fr auto; }
    .auth-route .site-header .mobile-menu-button { display: none; }
    .auth-experience { padding-top: 118px; }
    .auth-experience-veil,
    .auth-register-page .auth-experience-veil { background: linear-gradient(180deg,rgba(4,18,34,.95) 0%,rgba(7,29,52,.89) 45%,rgba(232,243,250,.78) 78%,rgba(238,247,252,.92)); }
    .auth-layout,
    .auth-layout-register { grid-template-columns: 1fr; gap: 36px; }
    .auth-story { max-width: 720px; margin-inline: auto; text-align: center; }
    .auth-story-topline { justify-content: center; gap: 18px; }
    .auth-story-logo { margin-inline: auto; }
    .auth-story .eyebrow { justify-content: center; }
    .auth-story h1,
    .auth-story > p { margin-inline: auto; }
    .auth-story-benefits { max-width: 620px; margin-inline: auto; }
    .auth-story-footer { justify-content: center; }
    .auth-progress-map { margin-inline: auto; }
    .auth-form-wrap { width: min(680px,100%); margin-inline: auto; }
    html[data-theme="dark"] .auth-experience-veil { background: linear-gradient(180deg,rgba(2,9,17,.98),rgba(4,19,34,.96) 50%,rgba(5,15,27,.92)); }
}

@media (max-width: 650px) {
    :root { --ai-panel-width: 100%; }
    .theme-toggle { width: 56px; }
    html[data-theme="dark"] .theme-toggle-thumb { transform: translateX(18px); }
    .auth-route .site-header .brand { display: none; }
    .auth-route .site-header .nav-shell { grid-template-columns: 1fr; }
    .auth-route .site-header .nav-actions { width: 100%; justify-content: flex-end; }
    .auth-route .site-header .language-name { display: none; }
    .auth-experience { padding: 112px 0 34px; }
    .auth-experience-shell { width: min(calc(100% - 24px),var(--container)); }
    .auth-back-link { top: -46px; }
    .auth-story-topline > span:last-child { display: none; }
    .auth-story-logo { width: 112px; min-height: 60px; margin-bottom: 28px; }
    .auth-story h1,
    .auth-layout-register .auth-story h1 { font-size: 41px; }
    .auth-story > p { font-size: 13px; }
    .auth-story-benefits { grid-template-columns: 1fr; }
    .auth-story-benefits > div { min-height: 52px; }
    .auth-progress-map { max-width: 340px; }
    .auth-form-card,
    .auth-register-card { padding: 28px 18px 22px; border-radius: 27px; }
    .auth-form-header h2 { font-size: 28px; }
    .auth-fields-grid { grid-template-columns: 1fr; }
    .premium-field-wide { grid-column: auto; }
    .demo-access-grid { grid-template-columns: 1fr; }
    .auth-form-options { align-items: flex-start; }
    .secure-inline { display: none; }
    .ai-assistant { inset-inline: 12px; bottom: 12px; }
    .ai-launcher { min-width: 58px; width: 58px; padding: 0 8px; }
    .ai-launcher-label,
    .ai-online-dot { display: none; }
    .ai-panel { position: fixed; inset-inline: 10px; bottom: 80px; width: auto; height: min(610px,calc(100vh - 100px)); border-radius: 26px; }
}

@media (prefers-reduced-motion: reduce) {
    .auth-liquid-shape,
    .auth-form-card::after,
    .ai-launcher-halo,
    .ai-typing-dots i { animation: none!important; }
}

/* Adaptive treatment for every operational form, because forms need not look like tax software. */
.form-section,
.form-panel,
.checkout-panel,
.partner-form,
.panel-card {
    border-color: var(--border-adaptive);
    background: var(--surface-glass-strong);
    box-shadow: 0 20px 56px rgba(11,35,71,.07);
    backdrop-filter: blur(18px);
}
label { color: var(--text-strong); }
input,
select,
textarea {
    border-color: var(--border-adaptive);
    background: var(--surface);
    color: var(--text-strong);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.55);
    transition: border-color .22s ease, box-shadow .22s ease, background .22s ease, transform .22s ease;
}
input:hover,
select:hover,
textarea:hover { border-color: rgba(75,159,24,.28); }
input:focus,
select:focus,
textarea:focus {
    border-color: rgba(75,159,24,.72);
    box-shadow: var(--focus-ring), 0 10px 25px rgba(11,35,71,.06);
    transform: translateY(-1px);
}
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
html[data-theme="dark"] .form-section,
html[data-theme="dark"] .form-panel,
html[data-theme="dark"] .checkout-panel,
html[data-theme="dark"] .partner-form,
html[data-theme="dark"] .panel-card {
    background: rgba(11,25,42,.86);
    box-shadow: 0 24px 64px rgba(0,0,0,.24);
}

/* Full dark visual language for the 2026 liquid homepage. */
html[data-theme="dark"] .liquid-hero { background: #06101d; }
html[data-theme="dark"] .liquid-hero-bg { filter: brightness(.4) saturate(.8) hue-rotate(4deg); }
html[data-theme="dark"] .liquid-hero::before { background: linear-gradient(90deg,rgba(5,15,27,.97),rgba(5,17,31,.82) 46%,rgba(5,17,31,.2) 82%); }
html[data-theme="dark"] .liquid-veil { background: radial-gradient(circle at 20% 20%,rgba(10,28,47,.72),transparent 38%), radial-gradient(circle at 86% 28%,rgba(73,158,216,.13),transparent 28%), linear-gradient(180deg,rgba(3,10,19,.15),rgba(4,15,27,.64)); }
html[data-theme="dark"] .hero-glass,
html[data-theme="dark"] .hero-feature-dock,
html[data-theme="dark"] .liquid-stats,
html[data-theme="dark"] .hero-image-badge,
html[data-theme="dark"] .model-pill,
html[data-theme="dark"] .service-line,
html[data-theme="dark"] .glass-panel,
html[data-theme="dark"] .region-node,
html[data-theme="dark"] .ecosystem-floating-cta {
    border-color: rgba(255,255,255,.1);
    background: rgba(8,22,38,.72);
    box-shadow: 0 28px 75px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.05);
}
html[data-theme="dark"] .hero-copy.hero-glass h1,
html[data-theme="dark"] .hero-trust-row strong,
html[data-theme="dark"] .hero-feature-dock strong,
html[data-theme="dark"] .liquid-stats strong,
html[data-theme="dark"] .model-pill h3,
html[data-theme="dark"] .service-line strong,
html[data-theme="dark"] .region-node strong,
html[data-theme="dark"] .regional-copy h2 { color: #eef7ff; }
html[data-theme="dark"] .hero-copy.hero-glass > p,
html[data-theme="dark"] .hero-trust-row small,
html[data-theme="dark"] .hero-feature-dock small,
html[data-theme="dark"] .liquid-stats span,
html[data-theme="dark"] .model-pill p,
html[data-theme="dark"] .regional-copy p { color: #9fb1c4; }
html[data-theme="dark"] .hero-feature-dock article { border-color: rgba(255,255,255,.07); background: linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018)); }
html[data-theme="dark"] .button-glass { color: #edf7ff; border-color: rgba(255,255,255,.13); background: rgba(255,255,255,.055); box-shadow: inset 0 1px 0 rgba(255,255,255,.07); }
html[data-theme="dark"] .button-glass:hover { background: rgba(255,255,255,.1); }
html[data-theme="dark"] .motion-marquee { border-color: rgba(255,255,255,.08); background: #081421; }
html[data-theme="dark"] .motion-marquee-track { color: #91a6ba; }
html[data-theme="dark"] .liquid-products,
html[data-theme="dark"] .ecosystem-section,
html[data-theme="dark"] .services-2026-section,
html[data-theme="dark"] .liquid-cta-section { background: linear-gradient(180deg,#07111f,#0a1625 58%,#07111f); }
html[data-theme="dark"] .cinematic-product-grid .product-card { border-color: rgba(255,255,255,.08); background: rgba(12,27,45,.78); box-shadow: 0 24px 64px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.04); }
html[data-theme="dark"] .cinematic-product-grid .product-visual { background: radial-gradient(circle at 50% 35%,#172b40,#0d1d30 65%,#0b1a2b); }
html[data-theme="dark"] .ecosystem-visual,
html[data-theme="dark"] .icon-board { border-color: rgba(255,255,255,.1); background: #0a1727; box-shadow: 0 38px 100px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.05); }
html[data-theme="dark"] .ecosystem-visual img,
html[data-theme="dark"] .icon-board img { filter: brightness(.66) saturate(.85); }
html[data-theme="dark"] .regional-liquid-section { background: #07111f; }
html[data-theme="dark"] .regional-liquid-bg { filter: brightness(.38) saturate(.82); }
html[data-theme="dark"] .regional-liquid-overlay { background: linear-gradient(90deg,rgba(5,15,27,.95),rgba(6,18,31,.74) 45%,rgba(5,15,27,.3)); }
html[data-theme="dark"] .region-orbit-center { border-color: rgba(255,255,255,.12); background: radial-gradient(circle at 34% 27%,rgba(28,56,82,.95),rgba(10,28,47,.88) 58%,rgba(8,21,36,.85)); box-shadow: 0 36px 90px rgba(0,0,0,.36), inset 0 0 45px rgba(255,255,255,.045); }
html[data-theme="dark"] .region-orbit-center img { padding: 6px; border-radius: 13px; background: rgba(255,255,255,.9); }
html[data-theme="dark"] .region-orbit-center span { color: #dcecff; }
html[data-theme="dark"] .feature-icon,
html[data-theme="dark"] .service-line-icon,
html[data-theme="dark"] .hero-trust-globe,
html[data-theme="dark"] .model-pill > span { background: radial-gradient(circle at 30% 25%,#1b354f,#102439 68%,#0d1d30); box-shadow: inset 0 0 0 1px rgba(255,255,255,.06), 0 8px 20px rgba(0,0,0,.25); }

/* ========================================================================== 
   HS Fresh Design Stabilization 2026.1
   Semantic surfaces, complete dark mode, RTL-safe storefront, panels and forms
   ========================================================================== */
:root {
    --page-bg: #f4f8fb;
    --page-bg-alt: #eef4f7;
    --page-deep: #07111f;
    --surface-elevated: #ffffff;
    --surface-soft: #f5f8fb;
    --surface-muted: #edf3f7;
    --surface-overlay: rgba(255,255,255,.84);
    --heading-color: #0a1f3d;
    --body-color: #526176;
    --subtle-color: #8492a5;
    --adaptive-line: rgba(15,42,76,.11);
    --adaptive-line-strong: rgba(15,42,76,.18);
    --brand-green: #69bf2d;
    --brand-green-bright: #82dd3e;
    --brand-blue: #1b65a4;
    --brand-navy: #0b2347;
    --elevation-1: 0 14px 40px rgba(11,35,71,.07);
    --elevation-2: 0 24px 70px rgba(11,35,71,.12);
    --elevation-3: 0 38px 110px rgba(8,28,54,.18);
}

html[data-theme="dark"] {
    /* Keep brand colors as brand colors. Turning --navy white caused white buttons,
       invisible add icons and several other small acts of CSS sabotage. */
    --navy: #0b2347;
    --navy-2: #12315c;
    --navy-3: #040b13;
    --green: #83d33f;
    --green-2: #a2eb61;
    --green-soft: rgba(131,211,63,.12);
    --cream: #07111f;
    --paper: #0d1929;
    --ink: #edf6ff;
    --muted: #9bacbf;
    --line: rgba(198,219,240,.12);
    --surface: #0c1929;
    --surface-2: #091523;
    --surface-3: #102033;
    --surface-glass: rgba(8,19,33,.76);
    --surface-glass-strong: rgba(10,22,38,.92);
    --text-strong: #eff7ff;
    --text-body: #a8b8ca;
    --text-faint: #71849a;
    --border-adaptive: rgba(196,222,246,.14);
    --shadow-adaptive: 0 32px 90px rgba(0,0,0,.42);
    --focus-ring: 0 0 0 5px rgba(131,211,63,.13);
    --page-bg: #07111f;
    --page-bg-alt: #091625;
    --page-deep: #030912;
    --surface-elevated: #0c1929;
    --surface-soft: #0a1727;
    --surface-muted: #102033;
    --surface-overlay: rgba(8,19,33,.86);
    --heading-color: #eff7ff;
    --body-color: #a8b8ca;
    --subtle-color: #74879d;
    --adaptive-line: rgba(198,219,240,.12);
    --adaptive-line-strong: rgba(198,219,240,.2);
    --elevation-1: 0 16px 44px rgba(0,0,0,.22);
    --elevation-2: 0 28px 76px rgba(0,0,0,.3);
    --elevation-3: 0 42px 120px rgba(0,0,0,.46);
}

body.site-body {
    min-height: 100vh;
    background:
        radial-gradient(circle at 8% 14%, rgba(87,169,226,.07), transparent 24rem),
        radial-gradient(circle at 92% 24%, rgba(105,191,45,.06), transparent 22rem),
        var(--page-bg);
    color: var(--heading-color);
}
html[data-theme="dark"] body.site-body {
    background:
        radial-gradient(circle at 8% 10%, rgba(65,139,198,.10), transparent 28rem),
        radial-gradient(circle at 92% 18%, rgba(131,211,63,.06), transparent 24rem),
        linear-gradient(180deg, #06101c 0%, #081421 52%, #06101c 100%);
}
.site-main { min-height: 42vh; }
.section { padding-block: clamp(72px, 8vw, 104px); }

/* Header and navigation */
.site-header {
    border-bottom-color: var(--adaptive-line);
    background: color-mix(in srgb, var(--page-bg) 88%, transparent);
    box-shadow: 0 8px 28px rgba(10,31,57,.035);
}
.site-header.is-scrolled {
    background: color-mix(in srgb, var(--surface-elevated) 88%, transparent);
    box-shadow: 0 18px 48px rgba(8,28,54,.1);
}
.nav-shell {
    min-height: 80px;
    grid-template-columns: 166px minmax(420px,1fr) auto;
    gap: clamp(16px, 2vw, 30px);
}
.brand {
    width: 156px;
    min-height: 56px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    border-radius: 16px;
}
.brand img {
    width: 148px;
    height: 54px;
    object-fit: contain;
    object-position: center;
}
.primary-nav { gap: clamp(18px, 2vw, 30px); }
.primary-nav a {
    color: color-mix(in srgb, var(--heading-color) 76%, var(--body-color));
    white-space: nowrap;
}
.nav-actions { min-width: max-content; gap: 10px; }
.login-link { color: var(--heading-color); }
.register-link {
    color: #fff;
    border: 1px solid rgba(255,255,255,.1);
    background: linear-gradient(135deg, #123765, #0b2347 58%, #327c25 145%);
    box-shadow: 0 12px 28px rgba(7,30,58,.2);
}
.register-link:hover { box-shadow: 0 16px 38px rgba(7,30,58,.28); }
.icon-action,
.language-button,
.mobile-menu-button {
    border-color: var(--adaptive-line);
    background: var(--surface-overlay);
    color: var(--heading-color);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.45);
}
.language-button:hover { background: var(--surface-soft); }
.language-menu,
.account-dropdown {
    border-color: var(--adaptive-line);
    background: var(--surface-elevated);
    box-shadow: var(--elevation-2);
}
.cart-badge { border-color: var(--surface-elevated); }

html[data-theme="dark"] .site-header,
html[data-theme="dark"] .home-page .site-header,
html[data-theme="dark"] .home-page .site-header.is-scrolled {
    background: rgba(5,14,25,.88);
    border-bottom-color: rgba(255,255,255,.08);
    box-shadow: 0 18px 55px rgba(0,0,0,.28);
}
html[data-theme="dark"] .brand {
    padding: 5px 9px;
    border: 1px solid rgba(255,255,255,.1);
    background: rgba(255,255,255,.94);
    box-shadow: 0 10px 30px rgba(0,0,0,.18);
}
html[data-theme="dark"] .brand img { width: 138px; height: 46px; }
html[data-theme="dark"] .primary-nav a,
html[data-theme="dark"] .language-button,
html[data-theme="dark"] .login-link { color: #c4d3e3; }
html[data-theme="dark"] .primary-nav a:hover,
html[data-theme="dark"] .primary-nav a.is-active,
html[data-theme="dark"] .login-link:hover { color: #fff; }
html[data-theme="dark"] .icon-action,
html[data-theme="dark"] .language-button,
html[data-theme="dark"] .mobile-menu-button {
    border-color: rgba(255,255,255,.11);
    background: rgba(255,255,255,.045);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
html[data-theme="dark"] .icon-action:hover,
html[data-theme="dark"] .language-button:hover { background: rgba(255,255,255,.08); }
html[data-theme="dark"] .icon-action svg { stroke: #dbe9f7; }
html[data-theme="dark"] .language-menu,
html[data-theme="dark"] .account-dropdown {
    border-color: rgba(255,255,255,.1);
    background: rgba(8,20,35,.98);
}
html[data-theme="dark"] .register-link {
    color: #06101b;
    background: linear-gradient(135deg, #9aee62, #72cb34);
    border-color: rgba(160,235,97,.35);
    box-shadow: 0 14px 32px rgba(99,190,42,.2);
}

/* Theme control. RTL selector from the previous layer was invalid. */
html[dir="rtl"][data-theme="dark"] .theme-toggle-thumb { transform: translateX(26px); }
html[dir="rtl"][data-theme="dark"] .theme-toggle[data-active-theme="dark"] .theme-toggle-thumb { transform: translateX(26px); }
html[data-theme="dark"] .theme-icon-sun { opacity: .55; }
html[data-theme="dark"] .theme-icon-moon { color: #b8d8ff; }

/* Store page heroes */
.page-hero,
.network-hero,
.about-hero,
.partner-hero {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 82% 12%, rgba(126,218,69,.2), transparent 28%),
        radial-gradient(circle at 12% 88%, rgba(73,158,222,.24), transparent 34%),
        linear-gradient(135deg, #06152a, #0c2e55 55%, #103b68);
}
.page-hero::after,
.network-hero::after,
.about-hero::after,
.partner-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .16;
    background-image:
        linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px);
    background-size: 64px 64px;
    mask-image: linear-gradient(90deg, #000, transparent 82%);
}
.page-hero .container,
.network-hero .container,
.about-hero .container,
.partner-hero .container { position: relative; z-index: 1; }
.compact-page-hero .container { padding-top: clamp(70px, 7vw, 98px); padding-bottom: clamp(70px, 7vw, 96px); }
.mini-page-hero .container { padding-top: 58px; padding-bottom: 62px; }

/* Catalog: centered tracks remove the empty RTL column shown in the screenshot. */
.shop-section {
    position: relative;
    padding-block: clamp(48px, 6vw, 76px) clamp(72px, 7vw, 96px);
    background: transparent;
}
.catalog-toolbar {
    margin-bottom: 18px;
    padding: 12px;
    border: 1px solid var(--adaptive-line);
    border-radius: 20px;
    background: var(--surface-overlay);
    box-shadow: var(--elevation-1);
    backdrop-filter: blur(18px);
}
.search-box {
    min-width: 240px;
    border-color: var(--adaptive-line);
    background: var(--surface-soft);
}
.search-box input { color: var(--heading-color); }
.catalog-toolbar select {
    border-color: var(--adaptive-line);
    background: var(--surface-soft);
    color: var(--heading-color);
}
.catalog-toolbar .button-dark {
    color: #fff;
    background: linear-gradient(135deg, #123765, #0b2347);
}
.catalog-meta {
    margin: 0 4px 22px;
    color: var(--subtle-color);
}
.catalog-grid {
    width: 100%;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 310px), 390px));
    justify-content: center;
    align-items: stretch;
    gap: clamp(20px, 2.2vw, 28px);
}
.catalog-grid .product-card {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    border-color: var(--adaptive-line);
    background: var(--surface-elevated);
    box-shadow: var(--elevation-1);
}
.catalog-grid .product-card:hover {
    transform: translateY(-8px);
    border-color: rgba(105,191,45,.32);
    box-shadow: var(--elevation-2);
}
.catalog-grid .product-visual {
    height: clamp(250px, 24vw, 310px);
    background:
        radial-gradient(circle at 50% 38%, rgba(255,255,255,.98), rgba(238,246,237,.96) 60%, rgba(225,235,229,.95));
}
.catalog-grid .product-card-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 24px;
}
.catalog-grid .product-card p { min-height: 0; }
.catalog-grid .product-card-footer { margin-top: auto; border-color: var(--adaptive-line); }
.catalog-grid .round-add {
    color: #fff;
    background: linear-gradient(145deg, #133a68, #0b2347);
    box-shadow: 0 10px 24px rgba(7,29,55,.2);
}
.catalog-grid .round-add:hover {
    color: #06101b;
    background: linear-gradient(145deg, #9be961, #73c936);
}
html[data-theme="dark"] .shop-section {
    background:
        radial-gradient(circle at 12% 22%, rgba(66,142,204,.08), transparent 24rem),
        radial-gradient(circle at 88% 78%, rgba(131,211,63,.045), transparent 24rem);
}
html[data-theme="dark"] .catalog-toolbar {
    border-color: rgba(255,255,255,.1);
    background: rgba(9,22,38,.8);
    box-shadow: 0 24px 64px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.04);
}
html[data-theme="dark"] .search-box,
html[data-theme="dark"] .catalog-toolbar select {
    border-color: rgba(255,255,255,.09);
    background: rgba(255,255,255,.035);
    color: #eaf3fd;
}
html[data-theme="dark"] .catalog-grid .product-card {
    border-color: rgba(255,255,255,.1);
    background: linear-gradient(180deg, rgba(13,29,47,.96), rgba(8,20,35,.98));
    box-shadow: 0 20px 58px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.035);
}
html[data-theme="dark"] .catalog-grid .product-card:hover {
    border-color: rgba(131,211,63,.3);
    box-shadow: 0 32px 82px rgba(0,0,0,.36), 0 0 0 1px rgba(131,211,63,.05);
}
html[data-theme="dark"] .catalog-grid .product-visual {
    background:
        radial-gradient(circle at 50% 36%, #f7faf5, #e7eee6 62%, #d8e0db);
}
html[data-theme="dark"] .catalog-grid .product-meta,
html[data-theme="dark"] .catalog-grid .product-price small { color: #8296aa; }
html[data-theme="dark"] .catalog-grid .product-card h3,
html[data-theme="dark"] .catalog-grid .product-price strong { color: #eff7ff; }
html[data-theme="dark"] .catalog-grid .product-card p { color: #9eb0c3; }
html[data-theme="dark"] .catalog-grid .product-card-footer { border-color: rgba(255,255,255,.08); }

/* Product detail, cart, checkout, orders and partner surfaces */
.card-surface,
.cart-item,
.product-detail-visual,
.product-detail-copy,
.success-card,
.public-table-wrap,
.contract-panel,
.partner-form,
.order-card,
.empty-cart {
    border-color: var(--adaptive-line);
    background: var(--surface-elevated);
    box-shadow: var(--elevation-1);
}
.product-detail-visual,
.cart-item-image,
.checkout-mini-items img {
    background: linear-gradient(145deg, #f8fbf6, #e8f0e7);
}
.order-summary {
    background:
        radial-gradient(circle at 82% 8%, rgba(131,211,63,.13), transparent 28%),
        linear-gradient(145deg, #07182f, #0d315a);
}
html[data-theme="dark"] .card-surface,
html[data-theme="dark"] .cart-item,
html[data-theme="dark"] .product-detail-visual,
html[data-theme="dark"] .product-detail-copy,
html[data-theme="dark"] .success-card,
html[data-theme="dark"] .public-table-wrap,
html[data-theme="dark"] .contract-panel,
html[data-theme="dark"] .partner-form,
html[data-theme="dark"] .empty-cart {
    border-color: rgba(255,255,255,.1);
    background: rgba(10,24,41,.9);
    box-shadow: 0 24px 68px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.035);
}
html[data-theme="dark"] .product-detail-visual,
html[data-theme="dark"] .cart-item-image,
html[data-theme="dark"] .checkout-mini-items img {
    background: linear-gradient(145deg, #f7faf5, #dde7de);
}
html[data-theme="dark"] .breadcrumb,
html[data-theme="dark"] .detail-facts,
html[data-theme="dark"] .cart-item-copy p,
html[data-theme="dark"] .summary-note { color: #8fa3b8; }
html[data-theme="dark"] .product-detail-copy h1,
html[data-theme="dark"] .cart-item-copy h2,
html[data-theme="dark"] .cart-item-price,
html[data-theme="dark"] .data-table td strong { color: #edf6ff; }

/* Complete adaptive forms */
.form-section,
.form-panel,
.checkout-panel,
.partner-form,
.panel-card {
    border: 1px solid var(--adaptive-line);
    border-radius: 22px;
    background: var(--surface-overlay);
    box-shadow: var(--elevation-1);
    backdrop-filter: blur(18px);
}
label {
    color: var(--heading-color);
    font-weight: 700;
}
input,
select,
textarea {
    border: 1px solid var(--adaptive-line);
    border-radius: 14px;
    background: var(--surface-elevated);
    color: var(--heading-color);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.48);
}
input::placeholder,
textarea::placeholder { color: var(--subtle-color); }
select option { background: var(--surface-elevated); color: var(--heading-color); }
input:hover,
select:hover,
textarea:hover { border-color: rgba(105,191,45,.35); }
input:focus,
select:focus,
textarea:focus {
    border-color: rgba(105,191,45,.72);
    background: var(--surface-elevated);
    box-shadow: 0 0 0 4px rgba(105,191,45,.12), 0 12px 28px rgba(8,29,55,.08);
    transform: translateY(-1px);
}
input[type="checkbox"],
input[type="radio"] {
    accent-color: var(--brand-green);
    box-shadow: none;
}
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
    border-color: rgba(198,219,240,.14);
    background: #091726;
    color: #edf6ff;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
    color-scheme: dark;
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color: #63788f; }
html[data-theme="dark"] select option { background: #091726; color: #edf6ff; }
html[data-theme="dark"] input:focus,
html[data-theme="dark"] select:focus,
html[data-theme="dark"] textarea:focus {
    border-color: rgba(131,211,63,.62);
    background: #0b1b2d;
    box-shadow: 0 0 0 4px rgba(131,211,63,.12), 0 16px 34px rgba(0,0,0,.28);
}
html[data-theme="dark"] .form-section,
html[data-theme="dark"] .form-panel,
html[data-theme="dark"] .checkout-panel,
html[data-theme="dark"] .partner-form,
html[data-theme="dark"] .panel-card {
    border-color: rgba(255,255,255,.09);
    background: rgba(10,24,41,.88);
    box-shadow: 0 24px 68px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.035);
}
html[data-theme="dark"] .form-section + .form-section { border-top-color: rgba(255,255,255,.08); }

/* Footer: compact, balanced and readable in both directions */
.site-footer {
    position: relative;
    margin-top: 0;
    padding: 58px 0 26px;
    overflow: hidden;
    background:
        radial-gradient(circle at 84% -20%, rgba(80,170,230,.11), transparent 30%),
        radial-gradient(circle at 8% 10%, rgba(119,205,58,.08), transparent 28%),
        linear-gradient(180deg, #061321, #030a12);
}
.site-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .11;
    background-image:
        linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
    background-size: 72px 72px;
    mask-image: linear-gradient(180deg,#000,transparent 76%);
}
.footer-grid,
.footer-bottom { position: relative; z-index: 1; }
.footer-grid {
    grid-template-columns: minmax(250px,1.35fr) minmax(130px,.55fr) minmax(130px,.55fr) minmax(260px,1fr);
    gap: clamp(28px,4vw,58px);
    padding-bottom: 38px;
    align-items: start;
}
.footer-brand img {
    width: 154px;
    height: 76px;
    margin-bottom: 8px;
    object-position: left center;
}
[dir="rtl"] .footer-brand img { object-position: right center; }
.footer-brand p { margin-bottom: 18px; }
.footer-column h3,
.footer-newsletter h3 { margin-bottom: 16px; }
.footer-column a { margin: 10px 0; }
.newsletter-form {
    min-height: 58px;
    padding: 6px;
    border-color: rgba(255,255,255,.13);
    background: rgba(255,255,255,.04);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.newsletter-form input {
    border: 0!important;
    background: transparent!important;
    box-shadow: none!important;
    transform: none!important;
}
.newsletter-form button {
    width: 46px;
    height: 46px;
    flex: 0 0 auto;
    border: 0;
    border-radius: 50%;
    background: linear-gradient(145deg,#9ae95e,#71c833);
    color: #06101b;
    box-shadow: 0 10px 24px rgba(104,194,47,.22);
}
.footer-bottom {
    min-height: 48px;
    padding-top: 18px;
    padding-inline-end: 176px;
}
html[dir="rtl"] .footer-bottom { padding-inline-end: 176px; }

/* AI assistant: compact launcher, stronger contrast, no footer collision */
.ai-assistant { inset-inline-end: 22px; bottom: 20px; }
.ai-launcher {
    min-height: 56px;
    border-color: rgba(12,48,82,.12);
    background: rgba(255,255,255,.9);
    box-shadow: 0 18px 52px rgba(8,36,66,.2), inset 0 1px 0 rgba(255,255,255,.9);
}
.ai-launcher:hover { transform: translateY(-3px); }
.ai-panel {
    border-color: var(--adaptive-line);
    background: rgba(252,254,255,.96);
    box-shadow: var(--elevation-3), inset 0 1px 0 rgba(255,255,255,.9);
}
html[data-theme="dark"] .ai-launcher {
    border-color: rgba(131,211,63,.16);
    background: linear-gradient(135deg,rgba(8,22,38,.96),rgba(12,31,50,.94));
    color: #e6f1fb;
    box-shadow: 0 18px 54px rgba(0,0,0,.42), 0 0 0 1px rgba(131,211,63,.035), inset 0 1px 0 rgba(255,255,255,.07);
}
html[data-theme="dark"] .ai-panel {
    border-color: rgba(255,255,255,.11);
    background: rgba(5,16,29,.97);
    box-shadow: 0 38px 115px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.055);
}
html[data-theme="dark"] .ai-conversation { background: linear-gradient(180deg,rgba(255,255,255,.015),transparent); }
html[data-theme="dark"] .ai-composer textarea { background: transparent; }

/* Admin and distributor workspace */
.panel-body {
    background:
        radial-gradient(circle at 92% 4%, rgba(80,168,226,.08), transparent 26rem),
        #f4f7fa;
}
.panel-sidebar {
    width: 268px;
    padding: 20px 16px;
    background:
        radial-gradient(circle at 20% 0%, rgba(91,177,229,.13), transparent 18rem),
        radial-gradient(circle at 100% 100%, rgba(118,204,57,.08), transparent 18rem),
        linear-gradient(180deg,#06172d,#04101f);
}
.panel-brand { min-height: 82px; }
.panel-brand img {
    width: 118px;
    height: 52px;
    padding: 5px 7px;
    border-radius: 12px;
    background: rgba(255,255,255,.94);
    filter: none;
}
.panel-main { margin-inline-start: 268px; }
.panel-topbar {
    min-height: 96px;
    border-bottom-color: var(--adaptive-line);
    background: rgba(255,255,255,.86);
    box-shadow: 0 10px 30px rgba(9,32,58,.04);
}
.panel-content { padding: 30px 34px 56px; }
.panel-card { border-radius: 22px; overflow: hidden; }
.panel-card-heading { border-color: var(--adaptive-line); }
.panel-table th,
.panel-table td,
.data-table th,
.data-table td { border-color: var(--adaptive-line); }
.panel-table th,
.data-table th { background: var(--surface-soft); color: var(--subtle-color); }
.panel-table td,
.data-table td { color: var(--body-color); }
.panel-search,
.filter-chips a,
.translation-tabs button {
    border-color: var(--adaptive-line);
    background: var(--surface-elevated);
}
.metric-card,
.distributor-welcome,
.distributor-profile-strip,
.distributor-product-card,
.application-card {
    border-color: var(--adaptive-line);
    background: var(--surface-elevated);
    box-shadow: var(--elevation-1);
}
.distributor-catalog-grid {
    grid-template-columns: repeat(auto-fit,minmax(280px,1fr));
    gap: 20px;
}
html[data-theme="dark"] .panel-body {
    background:
        radial-gradient(circle at 92% 4%, rgba(65,139,198,.08), transparent 26rem),
        #06101c;
}
html[data-theme="dark"] .panel-main,
html[data-theme="dark"] .panel-content { background: transparent; }
html[data-theme="dark"] .panel-topbar {
    border-bottom-color: rgba(255,255,255,.08);
    background: rgba(6,16,28,.88);
    box-shadow: 0 14px 40px rgba(0,0,0,.22);
}
html[data-theme="dark"] .panel-sidebar {
    border-inline-end: 1px solid rgba(255,255,255,.07);
    background:
        radial-gradient(circle at 20% 0%, rgba(72,153,211,.1), transparent 18rem),
        linear-gradient(180deg,#040d19,#020811);
}
html[data-theme="dark"] .panel-language .language-button,
html[data-theme="dark"] .panel-search,
html[data-theme="dark"] .filter-chips a,
html[data-theme="dark"] .translation-tabs button {
    border-color: rgba(255,255,255,.1);
    background: rgba(255,255,255,.04);
    color: #bdcede;
}
html[data-theme="dark"] .panel-card,
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .distributor-welcome,
html[data-theme="dark"] .distributor-profile-strip,
html[data-theme="dark"] .distributor-product-card,
html[data-theme="dark"] .application-card {
    border-color: rgba(255,255,255,.09);
    background: rgba(10,24,41,.9);
    box-shadow: 0 24px 68px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.035);
}
html[data-theme="dark"] .panel-card-heading,
html[data-theme="dark"] .distributor-profile-strip > div { border-color: rgba(255,255,255,.08); }
html[data-theme="dark"] .panel-table th,
html[data-theme="dark"] .data-table th { background: #091523; color: #7f93a9; }
html[data-theme="dark"] .panel-table td,
html[data-theme="dark"] .data-table td { color: #afc0d2; border-color: rgba(255,255,255,.075); }
html[data-theme="dark"] .panel-table td strong,
html[data-theme="dark"] .panel-profile strong,
html[data-theme="dark"] .distributor-profile-strip strong,
html[data-theme="dark"] .distributor-product-body h2,
html[data-theme="dark"] .distributor-prices strong { color: #edf6ff; }
html[data-theme="dark"] .application-meta,
html[data-theme="dark"] .distributor-prices > div,
html[data-theme="dark"] .panel-checkbox { background: rgba(255,255,255,.035); }

/* Auth surface consistency after the brand-token correction */
html[data-theme="dark"] .auth-form-kicker { color: #a4e876; }
html[data-theme="dark"] .auth-submit {
    background: linear-gradient(125deg,#102d50,#174773 58%,#4b9f18 150%);
}
html[data-theme="dark"] .auth-switch-premium a { color: #9ddd6c; }

/* Responsive corrections */
@media (max-width: 1180px) {
    .nav-shell { grid-template-columns: 150px auto 1fr; }
    .brand { width: 144px; }
    .brand img { width: 138px; }
    .primary-nav { justify-content: flex-start; gap: 18px; }
    .primary-nav a { font-size: 12px; }
    .language-name { display: none; }
    .footer-grid { grid-template-columns: 1.35fr .65fr .65fr 1fr; gap: 32px; }
}

@media (max-width: 900px) {
    .nav-shell { grid-template-columns: 140px 44px 1fr; }
    .primary-nav {
        top: calc(100% + 10px);
        border: 1px solid var(--adaptive-line);
        background: var(--surface-elevated);
        box-shadow: var(--elevation-2);
    }
    html[data-theme="dark"] .primary-nav {
        border-color: rgba(255,255,255,.1);
        background: rgba(7,18,31,.98);
    }
    .catalog-toolbar { flex-wrap: wrap; }
    .search-box { flex: 1 1 100%; }
    .catalog-toolbar select { flex: 1 1 220px; }
    .footer-grid { grid-template-columns: 1.2fr 1fr 1fr; }
    .footer-newsletter { grid-column: 1/-1; max-width: 620px; }
    .footer-bottom { padding-inline-end: 0; }
    .panel-sidebar { width: 268px; }
    .panel-main { margin-inline-start: 0; }
}

@media (max-width: 650px) {
    .container { width: min(calc(100% - 24px),var(--container)); }
    .section { padding-block: 64px; }
    .nav-shell { grid-template-columns: 108px 42px 1fr; min-height: 72px; }
    .brand { width: 104px; min-height: 46px; }
    .brand img { width: 100px; height: 38px; }
    html[data-theme="dark"] .brand { padding: 3px 5px; }
    html[data-theme="dark"] .brand img { width: 96px; height: 36px; }
    .nav-actions { gap: 6px; }
    .nav-actions .login-link,
    .nav-actions .register-link { display: none; }
    .catalog-toolbar { padding: 10px; }
    .catalog-toolbar select,
    .catalog-toolbar .button { width: 100%; }
    .catalog-meta { align-items: flex-start; gap: 8px; flex-direction: column; }
    .catalog-grid { grid-template-columns: 1fr; }
    .catalog-grid .product-visual { height: 260px; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 28px; }
    .footer-brand,
    .footer-newsletter { grid-column: 1/-1; }
    .footer-bottom { align-items: flex-start; flex-direction: column; gap: 12px; }
    .ai-assistant { inset-inline: 12px; bottom: 12px; }
    .panel-content { padding: 22px 14px 42px; }
    .panel-topbar { padding-inline: 14px; }
}

@media (max-width: 430px) {
    .footer-grid { grid-template-columns: 1fr; }
    .footer-column,
    .footer-brand,
    .footer-newsletter { grid-column: 1; }
    .theme-toggle { width: 54px; }
    html[data-theme="dark"] .theme-toggle-thumb { transform: translateX(16px); }
    html[dir="rtl"][data-theme="dark"] .theme-toggle-thumb { transform: translateX(16px); }
}

@media (prefers-reduced-motion: reduce) {
    .site-header,
    .product-card,
    .button,
    .ai-launcher,
    input,
    select,
    textarea { transition-duration: .01ms!important; }
}

/* Remaining storefront surfaces and controls */
html[data-theme="dark"] .button-dark,
html[data-theme="dark"] .button-panel {
    color: #fff;
    border-color: rgba(93,171,229,.2);
    background: linear-gradient(135deg,#123b67,#0a2749);
    box-shadow: 0 12px 30px rgba(0,0,0,.22);
}
html[data-theme="dark"] .button-ghost {
    color: #eaf4ff;
    border-color: rgba(255,255,255,.14);
    background: rgba(255,255,255,.045);
}
html[data-theme="dark"] .button-muted {
    color: #d8e7f6;
    border-color: rgba(255,255,255,.09);
    background: rgba(255,255,255,.055);
}
html[data-theme="dark"] .text-link { color: #e8f3ff; }
html[data-theme="dark"] .clear-filter { color: #9fdf70; }

html[data-theme="dark"] .product-detail-section,
html[data-theme="dark"] .related-section,
html[data-theme="dark"] .services-section,
html[data-theme="dark"] .regions-section,
html[data-theme="dark"] .principles-section,
html[data-theme="dark"] .network-operations,
html[data-theme="dark"] .cart-section,
html[data-theme="dark"] .checkout-section,
html[data-theme="dark"] .partner-form-section {
    background:
        radial-gradient(circle at 8% 20%, rgba(65,139,198,.06), transparent 24rem),
        linear-gradient(180deg,#07111f,#091625);
}
html[data-theme="dark"] .service-card,
html[data-theme="dark"] .hub-card:not(:first-child),
html[data-theme="dark"] .operation-cards article,
html[data-theme="dark"] .mission-card:not(.dark),
html[data-theme="dark"] .principles-grid article {
    border-color: rgba(255,255,255,.09);
    background: rgba(10,24,41,.88);
    box-shadow: 0 20px 58px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.03);
}
html[data-theme="dark"] .hub-card:first-child,
html[data-theme="dark"] .mission-card.dark {
    border-color: rgba(255,255,255,.1);
    background: linear-gradient(145deg,#0a294c,#06182f);
}
html[data-theme="dark"] .service-card h3,
html[data-theme="dark"] .hub-card h2,
html[data-theme="dark"] .operation-cards h3,
html[data-theme="dark"] .mission-card h2,
html[data-theme="dark"] .principles-grid h3 { color: #eff7ff; }
html[data-theme="dark"] .service-card p,
html[data-theme="dark"] .hub-card p,
html[data-theme="dark"] .operation-cards p,
html[data-theme="dark"] .mission-card p,
html[data-theme="dark"] .principles-grid p { color: #9fb1c4; }
html[data-theme="dark"] .region-list { border-color: rgba(255,255,255,.1); }
html[data-theme="dark"] .region-list a {
    border-color: rgba(255,255,255,.1);
    color: #dceafb;
}
html[data-theme="dark"] .contract-panel li { border-color: rgba(255,255,255,.09); color: #aebfd1; }
html[data-theme="dark"] .public-table-wrap { overflow: auto; }
html[data-theme="dark"] .data-table th { background: #091523; }
html[data-theme="dark"] .data-table td { color: #afc0d2; }
html[data-theme="dark"] .empty-state {
    color: #8fa3b8;
    border-color: rgba(255,255,255,.14);
    background: rgba(255,255,255,.025);
}
html[data-theme="dark"] .pagination a,
html[data-theme="dark"] .pagination span {
    border-color: rgba(255,255,255,.1);
    background: rgba(255,255,255,.04);
    color: #b8c9da;
}
html[data-theme="dark"] .pagination .is-active { color: #06101b; background: #83d33f; }

/* Preserve light media wells while surrounding cards follow the theme. */
html[data-theme="dark"] .table-product img,
html[data-theme="dark"] .quick-product-list img,
html[data-theme="dark"] .distributor-product-image,
html[data-theme="dark"] .product-form-preview {
    background: linear-gradient(145deg,#f5f9f3,#dfe9e0);
}
html[data-theme="dark"] .distributor-product-image > span {
    background: rgba(255,255,255,.92);
    color: #3e8d1b;
}

/* Toasts and alerts */
html[data-theme="dark"] .toast {
    border-color: rgba(255,255,255,.1);
    background: rgba(8,21,36,.96);
    box-shadow: 0 20px 60px rgba(0,0,0,.4);
}
html[data-theme="dark"] .toast p { color: #c2d1e0; }
html[data-theme="dark"] .panel-alert {
    border-color: rgba(131,211,63,.2);
    background: rgba(131,211,63,.08);
}
html[data-theme="dark"] .panel-alert p { color: #b8dda0; }
html[data-theme="dark"] .panel-alert.is-error {
    border-color: rgba(239,112,105,.22);
    background: rgba(216,60,50,.09);
}
html[data-theme="dark"] .panel-alert.is-error p { color: #f3aaa5; }

.ai-assistant.is-near-footer .ai-launcher {
    min-width: 58px;
    width: 58px;
    padding-inline: 8px;
}
.ai-assistant.is-near-footer .ai-launcher-label,
.ai-assistant.is-near-footer .ai-online-dot { display: none; }
.ai-assistant.is-near-footer .ai-launcher-orb { margin-inline: auto; }
.ai-assistant.is-near-footer .ai-launcher-core { margin-inline: auto; }

/* ========================================================================== 
   HS Fresh Atmosphere 2026.2
   Theme-aware liquid background, richer light/dark surfaces and soft motion
   ========================================================================== */
:root {
    --ui-bg: #f6fbff;
    --ui-bg-deep: #eaf3f9;
    --ui-surface: rgba(255,255,255,.72);
    --ui-surface-strong: rgba(255,255,255,.92);
    --ui-surface-solid: #ffffff;
    --ui-surface-soft: #eef5f9;
    --ui-text: #0a1e39;
    --ui-text-body: #52657a;
    --ui-text-muted: #7f91a5;
    --ui-border: rgba(13,55,94,.11);
    --ui-border-strong: rgba(13,55,94,.18);
    --ui-glow-blue: rgba(57,154,231,.20);
    --ui-glow-green: rgba(112,202,52,.18);
    --ui-glow-cyan: rgba(93,218,232,.14);
    --ui-shadow-sm: 0 14px 38px rgba(12,52,88,.08);
    --ui-shadow-md: 0 26px 72px rgba(12,52,88,.12);
    --ui-shadow-lg: 0 44px 120px rgba(8,35,67,.18);
    --ui-grid: rgba(35,96,145,.055);
    --ui-card-highlight: rgba(255,255,255,.92);
    --ambient-shift-x: 0px;
    --ambient-shift-y: 0px;
    --ambient-pointer-x: 50vw;
    --ambient-pointer-y: 30vh;

    --page-bg: var(--ui-bg);
    --page-bg-alt: var(--ui-bg-deep);
    --surface-elevated: var(--ui-surface-solid);
    --surface-soft: var(--ui-surface-soft);
    --surface-muted: #e6eff5;
    --surface-overlay: var(--ui-surface-strong);
    --heading-color: var(--ui-text);
    --body-color: var(--ui-text-body);
    --subtle-color: var(--ui-text-muted);
    --adaptive-line: var(--ui-border);
    --adaptive-line-strong: var(--ui-border-strong);
    --elevation-1: var(--ui-shadow-sm);
    --elevation-2: var(--ui-shadow-md);
    --elevation-3: var(--ui-shadow-lg);
}

html[data-theme="dark"] {
    --ui-bg: #040b13;
    --ui-bg-deep: #07111d;
    --ui-surface: rgba(9,22,38,.70);
    --ui-surface-strong: rgba(10,24,41,.91);
    --ui-surface-solid: #0a1727;
    --ui-surface-soft: #0d1d30;
    --ui-text: #eef7ff;
    --ui-text-body: #a8b9ca;
    --ui-text-muted: #74889d;
    --ui-border: rgba(190,218,243,.12);
    --ui-border-strong: rgba(190,218,243,.20);
    --ui-glow-blue: rgba(64,157,230,.16);
    --ui-glow-green: rgba(130,216,68,.11);
    --ui-glow-cyan: rgba(74,204,219,.10);
    --ui-shadow-sm: 0 16px 42px rgba(0,0,0,.25);
    --ui-shadow-md: 0 30px 82px rgba(0,0,0,.36);
    --ui-shadow-lg: 0 48px 132px rgba(0,0,0,.54);
    --ui-grid: rgba(166,205,236,.035);
    --ui-card-highlight: rgba(255,255,255,.055);

    --page-bg: var(--ui-bg);
    --page-bg-alt: var(--ui-bg-deep);
    --surface-elevated: var(--ui-surface-solid);
    --surface-soft: var(--ui-surface-soft);
    --surface-muted: #102236;
    --surface-overlay: var(--ui-surface-strong);
    --heading-color: var(--ui-text);
    --body-color: var(--ui-text-body);
    --subtle-color: var(--ui-text-muted);
    --adaptive-line: var(--ui-border);
    --adaptive-line-strong: var(--ui-border-strong);
    --elevation-1: var(--ui-shadow-sm);
    --elevation-2: var(--ui-shadow-md);
    --elevation-3: var(--ui-shadow-lg);
}

html {
    background: var(--ui-bg);
    transition: background-color .55s cubic-bezier(.2,.8,.2,1), color .45s ease;
}
body.site-body,
body.panel-body {
    position: relative;
    isolation: isolate;
    min-height: 100vh;
    background: transparent;
    color: var(--ui-text);
    transition: color .45s ease, background-color .55s ease;
}
body.site-body::before,
body.panel-body::before {
    content: "";
    position: fixed;
    z-index: -3;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 12% 9%, var(--ui-glow-blue), transparent 31rem),
        radial-gradient(circle at 88% 18%, var(--ui-glow-green), transparent 28rem),
        radial-gradient(circle at 52% 88%, var(--ui-glow-cyan), transparent 34rem),
        linear-gradient(145deg, var(--ui-bg), var(--ui-bg-deep));
    transition: background .7s cubic-bezier(.2,.8,.2,1);
}

/* The global atmosphere lives above the body wash and below every usable control. */
.ambient-stage {
    position: fixed;
    z-index: -2;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    contain: strict;
    opacity: 1;
    transition: opacity .55s ease, filter .7s ease;
}
.ambient-aurora {
    position: absolute;
    border-radius: 42% 58% 63% 37% / 44% 38% 62% 56%;
    filter: blur(18px);
    opacity: .74;
    will-change: transform, border-radius;
    transform: translate3d(var(--ambient-shift-x),var(--ambient-shift-y),0);
    animation: ambientMorph 18s ease-in-out infinite alternate;
}
.ambient-aurora-a {
    width: min(52vw,820px);
    height: min(48vw,720px);
    top: -24%;
    inset-inline-start: -14%;
    background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.94), rgba(83,174,237,.23) 42%, rgba(83,174,237,0) 72%);
}
.ambient-aurora-b {
    width: min(46vw,720px);
    height: min(42vw,650px);
    top: 14%;
    inset-inline-end: -18%;
    opacity: .62;
    background: radial-gradient(circle at 38% 32%, rgba(255,255,255,.76), rgba(119,205,58,.22) 40%, rgba(119,205,58,0) 72%);
    animation-delay: -7s;
}
.ambient-aurora-c {
    width: min(58vw,900px);
    height: min(32vw,500px);
    bottom: -22%;
    left: 26%;
    opacity: .42;
    background: radial-gradient(circle at 48% 48%, rgba(117,215,239,.24), rgba(64,140,218,.12) 45%, transparent 74%);
    animation-delay: -12s;
}
html[data-theme="dark"] .ambient-aurora { filter: blur(28px) saturate(115%); opacity: .55; }
html[data-theme="dark"] .ambient-aurora-a { background: radial-gradient(circle at 35% 28%, rgba(67,151,218,.22), rgba(29,94,155,.12) 44%, transparent 72%); }
html[data-theme="dark"] .ambient-aurora-b { background: radial-gradient(circle at 38% 32%, rgba(131,211,63,.14), rgba(61,126,35,.075) 43%, transparent 74%); }
html[data-theme="dark"] .ambient-aurora-c { background: radial-gradient(circle at 48% 48%, rgba(67,191,210,.12), rgba(36,100,161,.08) 44%, transparent 74%); }

.ambient-mesh {
    position: absolute;
    inset: -8%;
    opacity: .58;
    background-image:
        linear-gradient(var(--ui-grid) 1px, transparent 1px),
        linear-gradient(90deg, var(--ui-grid) 1px, transparent 1px);
    background-size: 72px 72px;
    mask-image: radial-gradient(circle at 50% 35%, #000 5%, transparent 72%);
    transform: perspective(900px) rotateX(63deg) translateY(20%);
    transform-origin: center bottom;
    animation: ambientGrid 24s linear infinite;
}
.ambient-orbit {
    position: absolute;
    border: 1px solid var(--ui-border);
    border-radius: 50%;
    opacity: .62;
    animation: ambientOrbit 24s linear infinite;
}
.ambient-orbit::before,
.ambient-orbit::after {
    content: "";
    position: absolute;
    inset: 17%;
    border: 1px dashed var(--ui-border);
    border-radius: inherit;
}
.ambient-orbit::after { inset: 34%; border-style: solid; opacity: .65; }
.ambient-orbit span {
    position: absolute;
    top: 5%;
    left: 50%;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: linear-gradient(145deg,#a5ef70,#63b82d);
    box-shadow: 0 0 0 8px rgba(117,200,56,.09), 0 0 28px rgba(117,200,56,.28);
}
.ambient-orbit-a { width: 410px; height: 410px; top: 11%; right: -210px; }
.ambient-orbit-b { width: 260px; height: 260px; bottom: 10%; left: -150px; animation-direction: reverse; animation-duration: 30s; }
html[data-theme="dark"] .ambient-orbit { opacity: .42; }

.ambient-bubble {
    position: absolute;
    display: block;
    border: 1px solid rgba(255,255,255,.62);
    border-radius: 48% 52% 55% 45% / 44% 46% 54% 56%;
    background: radial-gradient(circle at 30% 24%, rgba(255,255,255,.92), rgba(93,183,238,.13) 43%, rgba(105,191,45,.08));
    box-shadow: inset 0 0 24px rgba(255,255,255,.62), 0 18px 48px rgba(27,95,148,.10);
    backdrop-filter: blur(3px);
    animation: ambientBubble 12s ease-in-out infinite alternate;
}
.bubble-a { width: 76px; height: 70px; top: 18%; left: 4%; }
.bubble-b { width: 34px; height: 34px; top: 42%; right: 13%; animation-delay: -2s; }
.bubble-c { width: 104px; height: 94px; bottom: 15%; right: 4%; animation-delay: -5s; }
.bubble-d { width: 48px; height: 45px; bottom: 26%; left: 21%; animation-delay: -8s; }
.bubble-e { width: 22px; height: 22px; top: 26%; left: 54%; animation-delay: -10s; }
html[data-theme="dark"] .ambient-bubble {
    border-color: rgba(178,215,243,.14);
    background: radial-gradient(circle at 30% 24%, rgba(106,179,230,.14), rgba(31,91,144,.07) 46%, rgba(130,216,68,.045));
    box-shadow: inset 0 0 22px rgba(255,255,255,.035), 0 18px 52px rgba(0,0,0,.28);
}
.ambient-pointer-glow {
    position: absolute;
    width: 430px;
    height: 430px;
    left: var(--ambient-pointer-x);
    top: var(--ambient-pointer-y);
    border-radius: 50%;
    transform: translate(-50%,-50%);
    background: radial-gradient(circle, rgba(88,177,237,.11), rgba(111,201,53,.045) 42%, transparent 70%);
    filter: blur(5px);
    opacity: .9;
    transition: opacity .3s ease;
}
html[data-theme="dark"] .ambient-pointer-glow { opacity: .65; background: radial-gradient(circle, rgba(70,164,230,.095), rgba(130,216,68,.03) 42%, transparent 70%); }
.ambient-grain {
    position: absolute;
    inset: 0;
    opacity: .025;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.86' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E");
}
html[data-theme="dark"] .ambient-grain { opacity: .038; }

/* Prevent plain opaque bands from chopping the atmosphere into unrelated rectangles. */
.site-main,
.site-footer,
.panel-main { position: relative; z-index: 1; }
.announcement,
.site-header { z-index: 60; }
.shop-section,
.cart-section,
.checkout-section,
.partner-form-section,
.product-detail-section,
.related-section,
.services-section,
.regions-section,
.principles-section,
.network-operations,
.success-section,
.panel-content {
    background-color: transparent;
}
.shop-section,
.cart-section,
.checkout-section,
.partner-form-section,
.product-detail-section,
.related-section,
.services-section,
.regions-section,
.principles-section,
.network-operations,
.success-section {
    background-image: linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,.08));
}
html[data-theme="dark"] .shop-section,
html[data-theme="dark"] .cart-section,
html[data-theme="dark"] .checkout-section,
html[data-theme="dark"] .partner-form-section,
html[data-theme="dark"] .product-detail-section,
html[data-theme="dark"] .related-section,
html[data-theme="dark"] .services-section,
html[data-theme="dark"] .regions-section,
html[data-theme="dark"] .principles-section,
html[data-theme="dark"] .network-operations,
html[data-theme="dark"] .success-section {
    background-image: linear-gradient(180deg, rgba(6,16,28,.20), rgba(6,16,28,.46));
}

/* Smooth theme change. View Transitions handle modern browsers, this handles everybody else. */
html.theme-changing *,
html.theme-changing *::before,
html.theme-changing *::after {
    transition-duration: .45s!important;
    transition-property: color, background-color, background, border-color, box-shadow, fill, stroke, filter!important;
}
::view-transition-old(root),
::view-transition-new(root) { animation-duration: .55s; animation-timing-function: cubic-bezier(.2,.8,.2,1); }
::view-transition-old(root) { animation-name: themeFadeOut; }
::view-transition-new(root) { animation-name: themeFadeIn; }

/* Premium theme switch with clearer state and better contrast. */
.theme-toggle {
    width: 70px;
    height: 42px;
    border: 1px solid var(--ui-border-strong);
    background: linear-gradient(145deg, rgba(255,255,255,.88), rgba(235,245,251,.72));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 12px 32px rgba(15,60,98,.11);
}
.theme-toggle::after {
    content: "";
    position: absolute;
    inset: 2px;
    border-radius: inherit;
    pointer-events: none;
    background: linear-gradient(110deg, transparent 28%, rgba(255,255,255,.5) 48%, transparent 68%);
    transform: translateX(-120%);
    transition: transform .6s ease;
}
.theme-toggle:hover::after { transform: translateX(120%); }
.theme-toggle-track { padding-inline: 9px; }
.theme-toggle-thumb {
    top: 4px;
    left: 4px;
    width: 32px;
    height: 32px;
    background: linear-gradient(145deg,#fff,#edf5fb);
    box-shadow: 0 7px 18px rgba(20,67,105,.2), inset 0 1px 0 #fff;
}
.theme-icon { width: 16px; height: 16px; }
.theme-icon svg { width: 16px; height: 16px; }
html[data-theme="dark"] .theme-toggle {
    border-color: rgba(180,213,240,.15);
    background: linear-gradient(145deg,rgba(12,31,50,.95),rgba(5,15,27,.94));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 14px 36px rgba(0,0,0,.34), 0 0 28px rgba(72,158,216,.05);
}
html[data-theme="dark"] .theme-toggle-thumb {
    transform: translateX(28px);
    background: radial-gradient(circle at 35% 28%,#244a70,#10243a 68%);
    box-shadow: 0 8px 22px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.14), 0 0 18px rgba(85,164,224,.12);
}
html[dir="rtl"][data-theme="dark"] .theme-toggle-thumb,
html[dir="rtl"][data-theme="dark"] .theme-toggle[data-active-theme="dark"] .theme-toggle-thumb { transform: translateX(28px); }
.theme-toggle:focus-visible { outline: 0; box-shadow: 0 0 0 4px rgba(105,191,45,.15), var(--ui-shadow-sm); }

/* Navigation feels like one piece instead of controls borrowed from several templates. */
.site-header,
.home-page .site-header,
.home-page .site-header.is-scrolled {
    background: rgba(248,252,255,.76);
    border-bottom: 1px solid rgba(255,255,255,.62);
    box-shadow: 0 14px 46px rgba(18,69,108,.07);
    backdrop-filter: blur(26px) saturate(155%);
}
html[data-theme="dark"] .site-header,
html[data-theme="dark"] .home-page .site-header,
html[data-theme="dark"] .home-page .site-header.is-scrolled {
    background: rgba(4,12,22,.78);
    border-bottom-color: rgba(180,213,240,.09);
    box-shadow: 0 18px 58px rgba(0,0,0,.28), inset 0 -1px 0 rgba(255,255,255,.025);
}
.icon-action,
.language-button,
.mobile-menu-button {
    border: 1px solid var(--ui-border);
    background: var(--ui-surface);
    box-shadow: inset 0 1px 0 var(--ui-card-highlight), 0 9px 22px rgba(17,60,96,.06);
    backdrop-filter: blur(18px);
}
.icon-action:hover,
.language-button:hover,
.mobile-menu-button:hover { border-color: rgba(105,191,45,.32); transform: translateY(-1px); }
html[data-theme="dark"] .brand {
    padding: 4px 8px;
    border-color: rgba(255,255,255,.1);
    background: rgba(255,255,255,.94);
    box-shadow: 0 12px 34px rgba(0,0,0,.22);
}
.language-menu,
.account-dropdown,
.primary-nav.is-open {
    background: var(--ui-surface-strong);
    border-color: var(--ui-border);
    box-shadow: var(--ui-shadow-md);
    backdrop-filter: blur(26px) saturate(150%);
}
html[data-theme="dark"] .language-menu,
html[data-theme="dark"] .account-dropdown,
html[data-theme="dark"] .primary-nav.is-open { background: rgba(5,16,29,.96); }

/* Cards, forms and product wells share a coherent material system. */
.product-card,
.card-surface,
.order-summary,
.cart-items,
.form-section,
.form-panel,
.checkout-panel,
.partner-form,
.public-table-wrap,
.success-card,
.service-card,
.operation-cards article,
.principles-grid article,
.mission-card:not(.dark),
.panel-card,
.metric-card,
.application-card,
.distributor-welcome,
.distributor-profile-strip,
.distributor-product-card {
    border: 1px solid var(--ui-border);
    background: linear-gradient(145deg,var(--ui-surface-strong),var(--ui-surface));
    box-shadow: var(--ui-shadow-sm), inset 0 1px 0 var(--ui-card-highlight);
    backdrop-filter: blur(22px) saturate(140%);
}
.product-card,
.panel-card,
.metric-card,
.application-card,
.distributor-product-card { transition: transform .34s cubic-bezier(.2,.8,.2,1), box-shadow .34s ease, border-color .34s ease, background .45s ease; }
.product-card:hover,
.metric-card:hover,
.application-card:hover,
.distributor-product-card:hover {
    transform: translateY(-8px);
    border-color: rgba(105,191,45,.30);
    box-shadow: var(--ui-shadow-md), inset 0 1px 0 var(--ui-card-highlight);
}
html[data-theme="dark"] .product-card,
html[data-theme="dark"] .card-surface,
html[data-theme="dark"] .order-summary,
html[data-theme="dark"] .cart-items,
html[data-theme="dark"] .form-section,
html[data-theme="dark"] .form-panel,
html[data-theme="dark"] .checkout-panel,
html[data-theme="dark"] .partner-form,
html[data-theme="dark"] .public-table-wrap,
html[data-theme="dark"] .success-card,
html[data-theme="dark"] .service-card,
html[data-theme="dark"] .operation-cards article,
html[data-theme="dark"] .principles-grid article,
html[data-theme="dark"] .mission-card:not(.dark),
html[data-theme="dark"] .panel-card,
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .application-card,
html[data-theme="dark"] .distributor-welcome,
html[data-theme="dark"] .distributor-profile-strip,
html[data-theme="dark"] .distributor-product-card {
    border-color: rgba(190,218,243,.10);
    background: linear-gradient(145deg,rgba(12,28,47,.92),rgba(7,19,33,.82));
    box-shadow: 0 26px 76px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.045);
}

.catalog-grid .product-card { border-radius: 28px; overflow: hidden; }
.catalog-grid .product-visual,
.product-detail-visual,
.cart-item-image,
.distributor-product-image,
.product-form-preview {
    background:
        radial-gradient(circle at 50% 28%, rgba(255,255,255,.98), rgba(238,247,240,.94) 58%, rgba(216,231,220,.96));
}
html[data-theme="dark"] .catalog-grid .product-visual,
html[data-theme="dark"] .product-detail-visual,
html[data-theme="dark"] .cart-item-image,
html[data-theme="dark"] .distributor-product-image,
html[data-theme="dark"] .product-form-preview {
    background:
        radial-gradient(circle at 50% 26%, #f9fcf7, #e8f0e7 58%, #d6e2d8);
}
.product-card-body h3,
.product-detail-copy h1,
.order-summary h2,
.form-section-heading h2,
.panel-card h2,
.metric-card strong { color: var(--ui-text); }
.product-card p,
.product-meta,
.catalog-meta,
.summary-note,
.panel-card p { color: var(--ui-text-body); }
.product-card-footer,
.summary-row,
.panel-card-heading { border-color: var(--ui-border); }
.round-add {
    color: #07131f;
    background: linear-gradient(145deg,#a3ed6f,#72c936);
    box-shadow: 0 12px 28px rgba(103,191,47,.23), inset 0 1px 0 rgba(255,255,255,.6);
}
.round-add:hover { transform: translateY(-2px) rotate(6deg) scale(1.04); box-shadow: 0 16px 36px rgba(103,191,47,.32); }

/* Forms. Clear field boundaries in both themes without becoming bureaucratic. */
input,
select,
textarea,
.panel-search,
.catalog-toolbar select,
.search-box {
    border-color: var(--ui-border);
    background: var(--ui-surface-strong);
    color: var(--ui-text);
    box-shadow: inset 0 1px 0 var(--ui-card-highlight), 0 8px 22px rgba(14,54,88,.045);
    transition: border-color .24s ease, box-shadow .24s ease, background .45s ease, transform .24s ease;
}
input:hover,
select:hover,
textarea:hover,
.panel-search:hover,
.search-box:hover { border-color: rgba(105,191,45,.34); }
input:focus,
select:focus,
textarea:focus,
.panel-search:focus-within,
.search-box:focus-within {
    border-color: rgba(105,191,45,.68);
    box-shadow: 0 0 0 4px rgba(105,191,45,.12), 0 16px 36px rgba(10,47,82,.10);
    transform: translateY(-1px);
}
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .panel-search,
html[data-theme="dark"] .catalog-toolbar select,
html[data-theme="dark"] .search-box {
    border-color: rgba(190,218,243,.13);
    background: rgba(5,17,30,.76);
    color: #eef7ff;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 10px 26px rgba(0,0,0,.12);
}
html[data-theme="dark"] input:focus,
html[data-theme="dark"] select:focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] .panel-search:focus-within,
html[data-theme="dark"] .search-box:focus-within {
    border-color: rgba(131,211,63,.60);
    background: rgba(8,24,41,.94);
    box-shadow: 0 0 0 4px rgba(131,211,63,.11), 0 18px 42px rgba(0,0,0,.28);
}

/* Authentication gets a theme-specific cinematic grade instead of one universal dark wash. */
.auth-experience {
    background: transparent;
}
.auth-experience-bg {
    transform: scale(1.035);
    animation: authBackgroundDrift 22s ease-in-out infinite alternate;
    transition: filter .7s ease, opacity .7s ease;
}
.auth-experience-veil {
    background:
        radial-gradient(circle at 14% 20%, rgba(6,34,65,.92), transparent 37%),
        linear-gradient(104deg, rgba(3,17,34,.95) 0%, rgba(7,36,67,.82) 44%, rgba(239,248,253,.40) 68%, rgba(246,251,254,.78) 100%);
    transition: background .7s ease;
}
.auth-form-card {
    border-color: rgba(255,255,255,.72);
    background: linear-gradient(145deg,rgba(255,255,255,.90),rgba(245,251,255,.70));
    box-shadow: 0 40px 120px rgba(8,34,64,.25), inset 0 1px 0 rgba(255,255,255,.98);
}
.auth-form-card .premium-input-shell {
    border-color: var(--ui-border);
    background: rgba(255,255,255,.76);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 8px 22px rgba(11,48,82,.05);
}
html[data-theme="dark"] .auth-experience-bg { filter: brightness(.34) saturate(.78) hue-rotate(4deg); }
html[data-theme="dark"] .auth-experience-veil {
    background:
        radial-gradient(circle at 14% 20%, rgba(21,67,104,.20), transparent 38%),
        radial-gradient(circle at 88% 18%, rgba(131,211,63,.065), transparent 30%),
        linear-gradient(104deg, rgba(2,8,15,.985) 0%, rgba(4,17,30,.965) 48%, rgba(5,15,27,.91) 78%, rgba(3,10,18,.96) 100%);
}
html[data-theme="dark"] .auth-form-card {
    border-color: rgba(185,218,243,.13);
    background: linear-gradient(145deg,rgba(10,27,46,.91),rgba(5,16,29,.84));
    box-shadow: 0 42px 125px rgba(0,0,0,.54), inset 0 1px 0 rgba(255,255,255,.055);
}
html[data-theme="dark"] .auth-form-card .premium-input-shell {
    border-color: rgba(190,218,243,.12);
    background: rgba(4,16,28,.69);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 9px 26px rgba(0,0,0,.12);
}
html[data-theme="dark"] .auth-liquid-shape {
    border-color: rgba(182,216,241,.13);
    background: radial-gradient(circle at 28% 22%,rgba(94,169,222,.14),rgba(28,90,143,.07) 46%,rgba(131,211,63,.04));
    box-shadow: inset 0 0 34px rgba(255,255,255,.035),0 30px 90px rgba(0,0,0,.28);
}

/* Footer keeps the atmosphere moving but remains readable. */
.site-footer {
    border-top: 1px solid rgba(177,210,237,.08);
    background:
        radial-gradient(circle at 84% -10%, rgba(66,159,223,.12), transparent 34%),
        radial-gradient(circle at 8% 12%, rgba(126,211,65,.08), transparent 29%),
        linear-gradient(180deg,rgba(5,18,31,.96),rgba(2,8,14,.99));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}
.site-footer::after {
    content: "";
    position: absolute;
    width: 520px;
    height: 210px;
    inset-inline-end: -160px;
    bottom: -130px;
    border-radius: 50%;
    background: radial-gradient(circle,rgba(76,167,226,.10),transparent 68%);
    animation: footerGlow 10s ease-in-out infinite alternate;
    pointer-events: none;
}

/* The operational workspace receives a restrained animated atmosphere. */
.panel-sidebar { z-index: 30; }
.panel-main { z-index: 1; }
.panel-topbar {
    background: rgba(250,253,255,.76);
    border-bottom-color: var(--ui-border);
    box-shadow: 0 14px 42px rgba(11,48,82,.055);
    backdrop-filter: blur(26px) saturate(150%);
}
.panel-content { background: transparent; }
html[data-theme="dark"] .panel-topbar {
    background: rgba(4,14,25,.78);
    border-bottom-color: rgba(190,218,243,.085);
    box-shadow: 0 18px 50px rgba(0,0,0,.22);
}
.panel-sidebar {
    background:
        radial-gradient(circle at 20% 0%,rgba(83,177,231,.14),transparent 18rem),
        radial-gradient(circle at 100% 100%,rgba(120,205,58,.09),transparent 18rem),
        linear-gradient(180deg,#071a31,#04101f);
}
html[data-theme="dark"] .panel-sidebar {
    background:
        radial-gradient(circle at 20% 0%,rgba(72,153,211,.11),transparent 18rem),
        radial-gradient(circle at 100% 100%,rgba(131,211,63,.055),transparent 18rem),
        linear-gradient(180deg,#030c17,#02070d);
}
.panel-nav a { transition: background .25s ease, color .25s ease, transform .25s ease, box-shadow .25s ease; }
.panel-nav a:hover { transform: translateX(3px); }
[dir="rtl"] .panel-nav a:hover { transform: translateX(-3px); }
.panel-nav a.is-active { box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 12px 30px rgba(0,0,0,.13); }

/* AI belongs to the same visual system, rather than floating in from another product. */
.ai-launcher,
.ai-panel {
    backdrop-filter: blur(26px) saturate(150%);
}
.ai-launcher {
    border-color: var(--ui-border);
    background: var(--ui-surface-strong);
    box-shadow: var(--ui-shadow-md), inset 0 1px 0 var(--ui-card-highlight);
}
.ai-panel {
    border-color: var(--ui-border);
    background: rgba(250,253,255,.96);
    box-shadow: var(--ui-shadow-lg), inset 0 1px 0 rgba(255,255,255,.92);
}
html[data-theme="dark"] .ai-launcher {
    border-color: rgba(131,211,63,.14);
    background: linear-gradient(145deg,rgba(9,26,44,.95),rgba(4,15,27,.94));
    box-shadow: 0 24px 72px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.055);
}
html[data-theme="dark"] .ai-panel {
    border-color: rgba(190,218,243,.11);
    background: rgba(4,15,27,.965);
    box-shadow: 0 45px 130px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.05);
}

@keyframes ambientMorph {
    0% { transform: translate3d(calc(var(--ambient-shift-x) - 2%),calc(var(--ambient-shift-y) - 2%),0) rotate(-4deg) scale(.96); border-radius: 42% 58% 63% 37% / 44% 38% 62% 56%; }
    50% { transform: translate3d(calc(var(--ambient-shift-x) + 3%),calc(var(--ambient-shift-y) + 1%),0) rotate(3deg) scale(1.04); border-radius: 58% 42% 40% 60% / 61% 46% 54% 39%; }
    100% { transform: translate3d(calc(var(--ambient-shift-x) - 1%),calc(var(--ambient-shift-y) + 4%),0) rotate(-1deg) scale(1); border-radius: 48% 52% 58% 42% / 38% 61% 39% 62%; }
}
@keyframes ambientGrid { to { background-position: 72px 72px,72px 72px; } }
@keyframes ambientOrbit { to { transform: rotate(360deg); } }
@keyframes ambientBubble {
    0% { transform: translate3d(0,-8px,0) rotate(-5deg) scale(.96); border-radius: 48% 52% 55% 45% / 44% 46% 54% 56%; }
    100% { transform: translate3d(16px,18px,0) rotate(8deg) scale(1.06); border-radius: 57% 43% 42% 58% / 61% 39% 61% 39%; }
}
@keyframes authBackgroundDrift { from { transform: scale(1.035) translate3d(-.6%,0,0); } to { transform: scale(1.075) translate3d(.7%,-.5%,0); } }
@keyframes footerGlow { from { transform: translate3d(-2%,0,0) scale(.94); opacity: .65; } to { transform: translate3d(3%,-4%,0) scale(1.08); opacity: 1; } }
@keyframes themeFadeOut { to { opacity: 0; filter: blur(4px); } }
@keyframes themeFadeIn { from { opacity: 0; filter: blur(4px); } }

@media (max-width: 900px) {
    .ambient-orbit-a { right: -300px; }
    .ambient-orbit-b { left: -210px; }
    .ambient-aurora { opacity: .55; }
    .theme-toggle { width: 62px; height: 40px; }
    .theme-toggle-thumb { width: 30px; height: 30px; }
    html[data-theme="dark"] .theme-toggle-thumb,
    html[dir="rtl"][data-theme="dark"] .theme-toggle-thumb,
    html[dir="rtl"][data-theme="dark"] .theme-toggle[data-active-theme="dark"] .theme-toggle-thumb { transform: translateX(22px); }
}
@media (max-width: 650px) {
    .ambient-mesh { background-size: 54px 54px; }
    .ambient-bubble.bubble-a,
    .ambient-bubble.bubble-c { transform: scale(.72); opacity: .55; }
    .ambient-pointer-glow { display: none; }
    .theme-toggle { width: 58px; height: 38px; }
    .theme-toggle-thumb { width: 28px; height: 28px; }
    html[data-theme="dark"] .theme-toggle-thumb,
    html[dir="rtl"][data-theme="dark"] .theme-toggle-thumb,
    html[dir="rtl"][data-theme="dark"] .theme-toggle[data-active-theme="dark"] .theme-toggle-thumb { transform: translateX(20px); }
}
@media (prefers-reduced-motion: reduce) {
    .ambient-aurora,
    .ambient-mesh,
    .ambient-orbit,
    .ambient-bubble,
    .auth-experience-bg,
    .site-footer::after { animation: none!important; }
    .ambient-pointer-glow { display: none; }
    ::view-transition-old(root),
    ::view-transition-new(root) { animation-duration: .01ms!important; }
}

/* Small structural guarantees for the upgraded switch and atmosphere. */
.theme-toggle { position: relative; overflow: hidden; flex: 0 0 auto; }
.ambient-stage + .scroll-progress { z-index: 140; }

/* Auth navigation intentionally remains visually weightless over the cinematic scene. */
.auth-route .site-header,
html[data-theme="dark"] .auth-route .site-header {
    background: transparent;
    border-bottom-color: transparent;
    box-shadow: none;
    backdrop-filter: none;
}

/* ========================================================================== 
   HS Fresh Theme Reconciliation 2026.3
   One semantic palette for every storefront, authentication and panel surface.
   This final cascade intentionally overrides legacy hard-coded theme colours.
   ========================================================================== */
:root {
    color-scheme: light;
    --theme-bg: #f4f9fd;
    --theme-bg-alt: #eaf3f9;
    --theme-bg-soft: #f8fbfe;
    --theme-surface: #ffffff;
    --theme-surface-2: #f1f6fa;
    --theme-surface-3: #e6eff6;
    --theme-surface-glass: rgba(255,255,255,.82);
    --theme-surface-glass-strong: rgba(255,255,255,.94);
    --theme-text: #0b203b;
    --theme-text-2: #50657b;
    --theme-text-3: #788ba0;
    --theme-border: rgba(16,54,88,.12);
    --theme-border-strong: rgba(16,54,88,.20);
    --theme-input: #fbfdff;
    --theme-media: #edf4f8;
    --theme-hover: rgba(21,94,153,.055);
    --theme-selected: rgba(105,191,45,.12);
    --theme-overlay: rgba(244,249,253,.78);
    --theme-shadow-1: 0 12px 34px rgba(13,48,82,.075);
    --theme-shadow-2: 0 24px 68px rgba(13,48,82,.12);
    --theme-shadow-3: 0 40px 110px rgba(8,34,65,.18);
    --theme-focus: 0 0 0 4px rgba(105,191,45,.14);
    --theme-success-bg: #edf9e8;
    --theme-success-border: rgba(75,159,24,.27);
    --theme-success-text: #365f20;
    --theme-danger-bg: #fff1f1;
    --theme-danger-border: rgba(217,45,32,.24);
    --theme-danger-text: #a82419;
    --theme-warning-bg: #fff8e8;
    --theme-warning-border: rgba(225,157,25,.28);
    --theme-warning-text: #84590c;
    --theme-inverse-bg: #061321;
    --theme-inverse-bg-2: #0a2543;
    --theme-inverse-text: #f4f9ff;
    --theme-inverse-text-2: #b6c6d6;
    --theme-brand-navy: #0b2347;
    --theme-brand-blue: #1d68a8;
    --theme-brand-green: #65b92d;
    --theme-brand-green-bright: #86df43;

    /* Legacy token bridge. */
    --navy: var(--theme-brand-navy);
    --navy-2: #123560;
    --navy-3: var(--theme-inverse-bg);
    --green: var(--theme-brand-green);
    --green-2: var(--theme-brand-green-bright);
    --green-soft: var(--theme-selected);
    --cream: var(--theme-bg);
    --paper: var(--theme-surface);
    --ink: var(--theme-text);
    --muted: var(--theme-text-2);
    --line: var(--theme-border);
    --surface: var(--theme-surface);
    --surface-2: var(--theme-surface-2);
    --surface-3: var(--theme-surface-3);
    --surface-glass: var(--theme-surface-glass);
    --surface-glass-strong: var(--theme-surface-glass-strong);
    --text-strong: var(--theme-text);
    --text-body: var(--theme-text-2);
    --text-faint: var(--theme-text-3);
    --border-adaptive: var(--theme-border);
    --shadow-adaptive: var(--theme-shadow-2);
    --focus-ring: var(--theme-focus);
    --page-bg: var(--theme-bg);
    --page-bg-alt: var(--theme-bg-alt);
    --surface-elevated: var(--theme-surface);
    --surface-soft: var(--theme-surface-2);
    --surface-muted: var(--theme-surface-3);
    --surface-overlay: var(--theme-surface-glass-strong);
    --heading-color: var(--theme-text);
    --body-color: var(--theme-text-2);
    --subtle-color: var(--theme-text-3);
    --adaptive-line: var(--theme-border);
    --adaptive-line-strong: var(--theme-border-strong);
    --elevation-1: var(--theme-shadow-1);
    --elevation-2: var(--theme-shadow-2);
    --elevation-3: var(--theme-shadow-3);
    --ui-bg: var(--theme-bg);
    --ui-bg-deep: var(--theme-bg-alt);
    --ui-surface: var(--theme-surface-glass);
    --ui-surface-strong: var(--theme-surface-glass-strong);
    --ui-surface-solid: var(--theme-surface);
    --ui-surface-soft: var(--theme-surface-2);
    --ui-text: var(--theme-text);
    --ui-text-body: var(--theme-text-2);
    --ui-text-muted: var(--theme-text-3);
    --ui-border: var(--theme-border);
    --ui-border-strong: var(--theme-border-strong);
    --ui-shadow-sm: var(--theme-shadow-1);
    --ui-shadow-md: var(--theme-shadow-2);
    --ui-shadow-lg: var(--theme-shadow-3);
    --ui-card-highlight: rgba(255,255,255,.95);
}

html[data-theme="dark"] {
    color-scheme: dark;
    --theme-bg: #050c15;
    --theme-bg-alt: #081421;
    --theme-bg-soft: #07111d;
    --theme-surface: #0b1929;
    --theme-surface-2: #0e2033;
    --theme-surface-3: #13283d;
    --theme-surface-glass: rgba(8,21,36,.76);
    --theme-surface-glass-strong: rgba(9,23,39,.93);
    --theme-text: #eef7ff;
    --theme-text-2: #aec0d2;
    --theme-text-3: #7f94aa;
    --theme-border: rgba(190,218,243,.13);
    --theme-border-strong: rgba(190,218,243,.22);
    --theme-input: #071522;
    --theme-media: #102438;
    --theme-hover: rgba(166,205,236,.075);
    --theme-selected: rgba(131,211,63,.12);
    --theme-overlay: rgba(5,14,25,.82);
    --theme-shadow-1: 0 14px 38px rgba(0,0,0,.24);
    --theme-shadow-2: 0 28px 78px rgba(0,0,0,.36);
    --theme-shadow-3: 0 46px 128px rgba(0,0,0,.56);
    --theme-focus: 0 0 0 4px rgba(131,211,63,.14);
    --theme-success-bg: rgba(91,183,42,.12);
    --theme-success-border: rgba(131,211,63,.27);
    --theme-success-text: #b7eb8e;
    --theme-danger-bg: rgba(217,45,32,.12);
    --theme-danger-border: rgba(255,119,107,.24);
    --theme-danger-text: #ffaaa2;
    --theme-warning-bg: rgba(225,157,25,.12);
    --theme-warning-border: rgba(244,190,73,.25);
    --theme-warning-text: #f4c873;
    --theme-inverse-bg: #020810;
    --theme-inverse-bg-2: #071a2d;
    --theme-inverse-text: #f4f9ff;
    --theme-inverse-text-2: #a9bbcd;
    --theme-brand-green: #83d33f;
    --theme-brand-green-bright: #a2eb61;

    --navy: var(--theme-brand-navy);
    --navy-2: #123560;
    --navy-3: var(--theme-inverse-bg);
    --green: var(--theme-brand-green);
    --green-2: var(--theme-brand-green-bright);
    --green-soft: var(--theme-selected);
    --cream: var(--theme-bg);
    --paper: var(--theme-surface);
    --ink: var(--theme-text);
    --muted: var(--theme-text-2);
    --line: var(--theme-border);
    --surface: var(--theme-surface);
    --surface-2: var(--theme-surface-2);
    --surface-3: var(--theme-surface-3);
    --surface-glass: var(--theme-surface-glass);
    --surface-glass-strong: var(--theme-surface-glass-strong);
    --text-strong: var(--theme-text);
    --text-body: var(--theme-text-2);
    --text-faint: var(--theme-text-3);
    --border-adaptive: var(--theme-border);
    --shadow-adaptive: var(--theme-shadow-2);
    --focus-ring: var(--theme-focus);
    --page-bg: var(--theme-bg);
    --page-bg-alt: var(--theme-bg-alt);
    --surface-elevated: var(--theme-surface);
    --surface-soft: var(--theme-surface-2);
    --surface-muted: var(--theme-surface-3);
    --surface-overlay: var(--theme-surface-glass-strong);
    --heading-color: var(--theme-text);
    --body-color: var(--theme-text-2);
    --subtle-color: var(--theme-text-3);
    --adaptive-line: var(--theme-border);
    --adaptive-line-strong: var(--theme-border-strong);
    --elevation-1: var(--theme-shadow-1);
    --elevation-2: var(--theme-shadow-2);
    --elevation-3: var(--theme-shadow-3);
    --ui-bg: var(--theme-bg);
    --ui-bg-deep: var(--theme-bg-alt);
    --ui-surface: var(--theme-surface-glass);
    --ui-surface-strong: var(--theme-surface-glass-strong);
    --ui-surface-solid: var(--theme-surface);
    --ui-surface-soft: var(--theme-surface-2);
    --ui-text: var(--theme-text);
    --ui-text-body: var(--theme-text-2);
    --ui-text-muted: var(--theme-text-3);
    --ui-border: var(--theme-border);
    --ui-border-strong: var(--theme-border-strong);
    --ui-shadow-sm: var(--theme-shadow-1);
    --ui-shadow-md: var(--theme-shadow-2);
    --ui-shadow-lg: var(--theme-shadow-3);
    --ui-card-highlight: rgba(255,255,255,.055);
}

html,
body.site-body,
body.panel-body {
    background-color: var(--theme-bg);
    color: var(--theme-text);
}
body.site-body,
body.panel-body {
    background-image:
        radial-gradient(circle at 10% 8%, color-mix(in srgb, var(--theme-brand-blue) 9%, transparent), transparent 27rem),
        radial-gradient(circle at 92% 18%, color-mix(in srgb, var(--theme-brand-green) 7%, transparent), transparent 25rem),
        linear-gradient(145deg, var(--theme-bg), var(--theme-bg-alt));
    background-attachment: fixed;
}
html[data-theme="dark"] body.site-body,
html[data-theme="dark"] body.panel-body {
    background-image:
        radial-gradient(circle at 10% 8%, rgba(48,126,191,.12), transparent 30rem),
        radial-gradient(circle at 92% 18%, rgba(131,211,63,.06), transparent 27rem),
        linear-gradient(145deg, var(--theme-bg), var(--theme-bg-alt));
}
.site-main,
.panel-main,
.panel-content { color: var(--theme-text); }

/* Text hierarchy. Inverse sections are explicitly restored below. */
.site-body :where(h1,h2,h3,h4,h5,h6,strong,b),
.panel-body :where(h1,h2,h3,h4,h5,h6,strong,b) { color: var(--theme-text); }
.site-body :where(p,small),
.panel-body :where(p,small) { color: var(--theme-text-2); }
.site-body :where(.catalog-meta,.product-meta,.product-detail-meta,.breadcrumb,.subtle,.muted),
.panel-body :where(.panel-card-heading span,.panel-profile small,.metric-card span,.metric-card small) { color: var(--theme-text-3); }

/* Shared adaptive surfaces. */
.site-body :where(
    .product-card,.service-card,.hub-card,.mission-card,.principles-grid article,
    .form-panel,.form-section,.partner-form,.contract-panel,.cart-items,.cart-item,
    .order-summary,.success-card,.public-table-wrap,.application-card,.empty-state,
    .about-brand-card,.product-detail-copy,.product-long-description,.card-surface,
    .glass-panel,.model-pill,.service-line,.region-node,.ecosystem-floating-cta,
    .catalog-toolbar,.search-box,.pagination a,.pagination span,.toast,
    .language-menu,.account-dropdown,.auth-card,.auth-form-card,.ai-panel,.ai-launcher
),
.panel-body :where(
    .panel-card,.metric-card,.table-card,.application-card,.distributor-welcome,
    .distributor-profile-strip,.distributor-product-card,.status-card,.sales-card,
    .low-stock-card,.panel-search,.filter-chips a,.translation-tabs button,
    .product-form-preview,.panel-checkbox,.language-menu,.account-dropdown,
    .ai-panel,.ai-launcher
) {
    border-color: var(--theme-border);
    background-color: var(--theme-surface);
    color: var(--theme-text);
    box-shadow: var(--theme-shadow-1);
}
.site-body :where(.glass-panel,.model-pill,.service-line,.region-node,.ecosystem-floating-cta,.ai-launcher),
.panel-body :where(.ai-launcher) {
    background-color: var(--theme-surface-glass-strong);
    backdrop-filter: blur(22px) saturate(145%);
}

/* Header, menus and controls. */
.site-header,
.panel-topbar {
    border-color: var(--theme-border);
    background: var(--theme-overlay);
    color: var(--theme-text);
    box-shadow: 0 12px 38px rgba(11,47,81,.07);
    backdrop-filter: blur(24px) saturate(145%);
}
html[data-theme="dark"] .site-header,
html[data-theme="dark"] .home-page .site-header,
html[data-theme="dark"] .home-page .site-header.is-scrolled,
html[data-theme="dark"] .panel-topbar {
    border-color: var(--theme-border);
    background: rgba(4,14,25,.88);
    color: var(--theme-text);
    box-shadow: 0 18px 55px rgba(0,0,0,.30);
}
.primary-nav a,
.language-button,
.account-button,
.login-link,
.account-dropdown a,
.account-dropdown button,
.panel-language .language-button { color: var(--theme-text-2); }
.primary-nav a:hover,
.primary-nav a.is-active,
.language-button:hover,
.account-button:hover,
.login-link:hover,
.account-dropdown a:hover,
.account-dropdown button:hover { color: var(--theme-text); }
.language-menu,
.account-dropdown {
    border: 1px solid var(--theme-border);
    background: var(--theme-surface);
    box-shadow: var(--theme-shadow-2);
}
.language-menu a:hover,
.language-menu a.is-current,
.account-dropdown a:hover,
.account-dropdown button:hover { background: var(--theme-selected); }
.icon-action,
.mobile-menu-button,
.panel-menu-toggle,
.panel-language .language-button {
    border: 1px solid var(--theme-border);
    background: var(--theme-surface-glass-strong);
    color: var(--theme-text);
    box-shadow: inset 0 1px 0 var(--ui-card-highlight);
}
.icon-action svg { stroke: var(--theme-text); }
.mobile-menu-button span { background: var(--theme-text); }
.chevron { color: var(--theme-text-3); }
.cart-badge { border-color: var(--theme-surface); }
.register-link,
.button-dark {
    color: #fff;
    background: linear-gradient(135deg,#123b69,#0b2347 62%,#2f7925 145%);
    box-shadow: 0 14px 34px rgba(6,29,56,.23);
}
html[data-theme="dark"] .brand {
    padding: 5px 9px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.94);
    box-shadow: 0 10px 30px rgba(0,0,0,.20);
}
html[data-theme="dark"] .auth-route .brand { background: rgba(255,255,255,.94); }

/* Buttons and links. */
.button-primary,
.newsletter-form button,
.round-add,
.ai-composer button {
    color: #07111f;
    background: linear-gradient(135deg,var(--theme-brand-green-bright),var(--theme-brand-green));
    box-shadow: 0 14px 34px rgba(101,185,45,.24);
}
.button-light {
    color: var(--theme-brand-navy);
    border-color: rgba(11,35,71,.08);
    background: #fff;
}
.button-ghost,
.button-muted,
.button-panel,
.filter-chips a,
.translation-tabs button,
.pagination a,
.pagination span {
    border-color: var(--theme-border);
    background: var(--theme-surface-2);
    color: var(--theme-text);
}
.button-ghost:hover,
.button-muted:hover,
.button-panel:hover,
.filter-chips a:hover,
.filter-chips a.is-active,
.translation-tabs button:hover,
.translation-tabs button.is-active,
.pagination a:hover { border-color: rgba(105,191,45,.42); background: var(--theme-selected); }
.text-link,
.breadcrumb b { color: var(--theme-text); }
.clear-filter,
.remove-button { color: #df5348; }

/* Forms, native controls and autofill. */
label,
.premium-field > label { color: var(--theme-text-2); }
input,
select,
textarea,
.panel-search,
.search-box,
.catalog-toolbar select,
.premium-input-shell,
.ai-composer {
    border-color: var(--theme-border);
    background-color: var(--theme-input);
    color: var(--theme-text);
    box-shadow: inset 0 1px 0 var(--ui-card-highlight), 0 8px 22px rgba(12,49,82,.04);
}
input::placeholder,
textarea::placeholder { color: var(--theme-text-3); opacity: 1; }
select,
select option { color: var(--theme-text); background: var(--theme-surface); }
input:hover,
select:hover,
textarea:hover,
.panel-search:hover,
.search-box:hover,
.premium-input-shell:hover { border-color: rgba(105,191,45,.40); }
input:focus,
select:focus,
textarea:focus,
.panel-search:focus-within,
.search-box:focus-within,
.premium-input-shell:focus-within,
.premium-input-shell.is-focused {
    border-color: rgba(105,191,45,.72);
    background-color: var(--theme-input);
    box-shadow: var(--theme-focus), 0 16px 38px rgba(9,39,70,.09);
}
input:disabled,
select:disabled,
textarea:disabled,
button:disabled,
.is-disabled {
    opacity: .58;
    cursor: not-allowed;
}
input[type="checkbox"],
input[type="radio"] { accent-color: var(--theme-brand-green); }
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--theme-text);
    -webkit-box-shadow: 0 0 0 1000px var(--theme-input) inset;
    caret-color: var(--theme-text);
    transition: background-color 9999s ease-out 0s;
}
.field-icon,
.password-visibility,
.select-chevron { color: var(--theme-text-3); }
.premium-check { color: var(--theme-text-2); }
.premium-check-box,
.panel-checkbox { border-color: var(--theme-border); background: var(--theme-input); }
.demo-credentials,
.application-meta,
.distributor-prices > div,
.summary-note,
.wholesale-note,
.trade-note { border-color: var(--theme-border); background: var(--theme-surface-2); color: var(--theme-text-2); }
.demo-credentials strong { color: var(--theme-text); }
.demo-credentials code { color: var(--theme-text-2); }
.field-error,
.standalone-error { color: var(--theme-danger-text); }
.has-error .premium-input-shell { border-color: var(--theme-danger-border); box-shadow: 0 0 0 4px color-mix(in srgb, var(--theme-danger-text) 12%, transparent); }

/* Product catalogue and detail. */
.shop-section,
.section-products,
.product-detail-section,
.related-section,
.cart-section,
.checkout-section,
.partner-form-section,
.network-operations,
.principles-section,
.success-section { background: transparent; }
.product-grid,
.catalog-grid,
.cinematic-product-grid {
    width: 100%;
    margin-inline: auto;
    justify-content: center;
}
.product-card {
    overflow: hidden;
    border: 1px solid var(--theme-border);
    background: var(--theme-surface);
    box-shadow: var(--theme-shadow-1);
}
.product-card:hover { border-color: rgba(105,191,45,.34); box-shadow: var(--theme-shadow-2); }
.product-card-body,
.product-card-footer { background: transparent; }
.product-card-body h3,
.product-card-body p,
.product-price strong { color: var(--theme-text); }
.product-card-body p,
.product-meta,
.product-card-footer small { color: var(--theme-text-2); }
.product-visual,
.product-detail-visual,
.cart-item-image,
.product-form-preview,
.table-product img,
.quick-product-list img,
.distributor-product-image,
.ai-product-card img {
    background: radial-gradient(circle at 50% 35%, var(--theme-surface), var(--theme-media) 68%);
}
html[data-theme="dark"] .product-visual,
html[data-theme="dark"] .product-detail-visual,
html[data-theme="dark"] .cart-item-image,
html[data-theme="dark"] .product-form-preview,
html[data-theme="dark"] .table-product img,
html[data-theme="dark"] .quick-product-list img,
html[data-theme="dark"] .distributor-product-image,
html[data-theme="dark"] .ai-product-card img {
    background: radial-gradient(circle at 50% 35%, #173149, var(--theme-media) 68%);
}
.product-badge,
.type-pill,
.status-pill { border-color: var(--theme-border); background: var(--theme-surface-2); color: var(--theme-text-2); }
.round-add {
    border-color: transparent;
    color: #07111f;
}
.product-card-footer,
.detail-price-row,
.summary-row,
.summary-total,
.cart-bottom-actions { border-color: var(--theme-border); }
.product-detail-copy h1,
.product-detail-copy h2,
.product-long-description h2 { color: var(--theme-text); }
.detail-facts > div,
.visual-certificates span { border-color: var(--theme-border); background: var(--theme-surface-2); color: var(--theme-text-2); }

/* Cart, checkout, orders and tables. */
.cart-item,
.checkout-form,
.order-summary,
.checkout-summary,
.success-card,
.public-table-wrap,
.table-card { border-color: var(--theme-border); }
.cart-item-copy h3,
.cart-item-price,
.summary-row strong,
.summary-total strong,
.success-order-data strong { color: var(--theme-text); }
.cart-item-copy p,
.summary-row span,
.summary-note,
.success-order-data small { color: var(--theme-text-2); }
.cart-quantity,
.inline-update { border-color: var(--theme-border); background: var(--theme-surface-2); color: var(--theme-text); }
.public-table-wrap,
.table-scroll { background: var(--theme-surface); }
.data-table th,
.panel-table th {
    border-color: var(--theme-border);
    background: var(--theme-surface-2);
    color: var(--theme-text-3);
}
.data-table td,
.panel-table td {
    border-color: var(--theme-border);
    background: transparent;
    color: var(--theme-text-2);
}
.data-table tbody tr:hover td,
.panel-table tbody tr:hover td { background: var(--theme-hover); }
.checkout-summary {
    color: var(--theme-inverse-text);
    background: linear-gradient(145deg,var(--theme-inverse-bg-2),var(--theme-inverse-bg));
}
.checkout-summary :where(h2,h3,strong,b),
.checkout-mini-items strong,
.checkout-mini-items b { color: var(--theme-inverse-text); }
.checkout-summary :where(p,small,span),
.checkout-mini-items small,
.checkout-security p { color: var(--theme-inverse-text-2); }
.checkout-mini-items img { background: #fff; }
.checkout-security { border-color: rgba(255,255,255,.10); background: rgba(255,255,255,.055); }

/* Informational pages. */
.hub-card,
.mission-card,
.principles-grid article,
.operation-cards article,
.contract-panel li { border-color: var(--theme-border); }
.hub-card,
.mission-card,
.principles-grid article { background: var(--theme-surface); }
.operation-cards article,
.hub-capabilities span { background: var(--theme-surface-2); color: var(--theme-text-2); }
.contract-panel li { color: var(--theme-text-2); }
.hub-card:first-child,
.mission-card.dark,
.world-panel,
.partner-cta {
    color: var(--theme-inverse-text);
    background: linear-gradient(145deg,var(--theme-inverse-bg-2),var(--theme-inverse-bg));
}
.hub-card:first-child :where(h2,h3,strong),
.mission-card.dark :where(h2,h3,strong),
.partner-cta :where(h2,h3,strong) { color: var(--theme-inverse-text); }
.hub-card:first-child :where(p,small),
.mission-card.dark :where(p,small),
.partner-cta :where(p,small) { color: var(--theme-inverse-text-2); }
.about-brand-card img,
.region-orbit-center img { background: #fff; }

/* Premium generated imagery should remain legible in both themes. */
.ecosystem-visual,
.icon-board,
.hero-showcase {
    border-color: var(--theme-border);
    background: var(--theme-surface);
    box-shadow: var(--theme-shadow-3);
}
html[data-theme="dark"] .ecosystem-visual,
html[data-theme="dark"] .icon-board,
html[data-theme="dark"] .hero-showcase {
    border-color: var(--theme-border);
    background: #071522;
}
html[data-theme="dark"] .ecosystem-visual img,
html[data-theme="dark"] .icon-board img,
html[data-theme="dark"] .hero-showcase img {
    filter: none;
    opacity: .96;
}

/* Authentication: one surface language, no white/dark islands. */
.auth-experience { background: var(--theme-bg); }
.auth-experience-veil {
    background:
        radial-gradient(circle at 13% 18%, rgba(6,36,68,.94), transparent 38%),
        linear-gradient(105deg,rgba(3,17,34,.96) 0%,rgba(7,36,67,.84) 46%,rgba(244,249,253,.46) 70%,rgba(244,249,253,.84) 100%);
}
.auth-form-card {
    border: 1px solid var(--theme-border);
    background: var(--theme-surface-glass-strong);
    color: var(--theme-text);
    box-shadow: var(--theme-shadow-3), inset 0 1px 0 var(--ui-card-highlight);
}
.auth-form-header h2,
.auth-switch-premium strong { color: var(--theme-text); }
.auth-form-header p,
.auth-switch-premium,
.auth-security-line { color: var(--theme-text-2); }
.demo-access-grid button { border-color: var(--theme-border); background: var(--theme-surface-2); color: var(--theme-text); }
.demo-access-grid button:hover { border-color: rgba(105,191,45,.38); background: var(--theme-selected); }
html[data-theme="dark"] .auth-experience-veil {
    background:
        radial-gradient(circle at 13% 18%, rgba(37,101,154,.18), transparent 38%),
        radial-gradient(circle at 88% 18%, rgba(131,211,63,.055), transparent 30%),
        linear-gradient(105deg,rgba(2,8,15,.985),rgba(4,17,30,.97) 52%,rgba(5,15,27,.94) 80%,rgba(3,10,18,.97));
}
html[data-theme="dark"] .auth-form-card {
    border-color: var(--theme-border);
    background: rgba(8,21,36,.92);
    color: var(--theme-text);
}
.auth-story :where(h1,h2,h3,strong),
.auth-story-topline,
.auth-secure-pill { color: #fff; }
.auth-story :where(p,small),
.auth-story-footer { color: rgba(232,243,253,.74); }
.auth-story-benefits span { border-color: rgba(255,255,255,.14); background: rgba(255,255,255,.055); color: rgba(239,248,255,.78); }

/* Admin and distributor workspace. */
.panel-body { background: var(--theme-bg); }
.panel-main,
.panel-content { background: transparent; }
.panel-sidebar {
    color: #fff;
    border-inline-end: 1px solid rgba(255,255,255,.07);
    background:
        radial-gradient(circle at 15% 0%,rgba(75,161,220,.14),transparent 17rem),
        radial-gradient(circle at 100% 100%,rgba(119,205,58,.09),transparent 18rem),
        linear-gradient(180deg,#071a31,#04101f);
}
.panel-sidebar :where(a,button,span,small,strong) { color: inherit; }
.panel-brand img { filter: brightness(0) invert(1); }
.panel-nav a,
.panel-sidebar-footer a,
.panel-sidebar-footer button { color: rgba(232,242,252,.66); }
.panel-nav a:hover,
.panel-nav a.is-active,
.panel-sidebar-footer a:hover,
.panel-sidebar-footer button:hover { background: rgba(255,255,255,.09); color: #fff; }
.panel-topbar { background: var(--theme-overlay); }
.panel-heading h1,
.panel-profile strong { color: var(--theme-text); }
.panel-heading p,
.panel-profile small { color: var(--theme-text-2); }
.panel-card,
.metric-card,
.table-card,
.distributor-welcome,
.distributor-profile-strip,
.distributor-product-card,
.application-card {
    border-color: var(--theme-border);
    background: var(--theme-surface);
    color: var(--theme-text);
}
.metric-card strong,
.panel-card-heading h2,
.distributor-product-body h3,
.application-card h3 { color: var(--theme-text); }
.metric-card span,
.metric-card small,
.panel-card-heading span,
.distributor-product-body p,
.application-card p { color: var(--theme-text-2); }
.metric-primary {
    border-color: rgba(255,255,255,.08);
    background: linear-gradient(145deg,#0c2b4d,#071827);
}
.metric-primary :where(strong,h2,h3) { color: #fff; }
.metric-primary :where(span,small,p) { color: rgba(235,246,255,.64); }
.panel-card-heading { border-color: var(--theme-border); }
.revenue-chart {
    border-color: var(--theme-border);
    background-color: transparent;
    background-image: linear-gradient(to top,var(--theme-border) 1px,transparent 1px);
}
.panel-alert {
    border-color: var(--theme-success-border);
    background: var(--theme-success-bg);
}
.panel-alert span,
.panel-alert p { color: var(--theme-success-text); }
.panel-alert.is-error {
    border-color: var(--theme-danger-border);
    background: var(--theme-danger-bg);
}
.panel-alert.is-error span,
.panel-alert.is-error p { color: var(--theme-danger-text); }
.status-pill.is-success { background: var(--theme-success-bg); color: var(--theme-success-text); }
.status-pill.is-error,
.status-pill.is-danger { background: var(--theme-danger-bg); color: var(--theme-danger-text); }
.status-pill.is-warning { background: var(--theme-warning-bg); color: var(--theme-warning-text); }

/* AI assistant. */
.ai-launcher,
.ai-panel {
    border-color: var(--theme-border);
    background: var(--theme-surface-glass-strong);
    color: var(--theme-text);
    box-shadow: var(--theme-shadow-2), inset 0 1px 0 var(--ui-card-highlight);
}
.ai-header,
.ai-footer { border-color: var(--theme-border); }
.ai-title-row strong,
.ai-bubble strong,
.ai-product-card strong { color: var(--theme-text); }
.ai-title-row span,
.ai-bubble p,
.ai-product-card small,
.ai-footer { color: var(--theme-text-2); }
.ai-close,
.ai-message-avatar { background: var(--theme-surface-2); color: var(--theme-text-2); }
.ai-bubble,
.ai-product-card { border-color: var(--theme-border); background: var(--theme-surface-2); }
.ai-message.is-user .ai-bubble { background: linear-gradient(135deg,#164672,#1d659b); }
.ai-message.is-user .ai-bubble p { color: #fff; }
.ai-suggestions button { border-color: rgba(105,191,45,.25); background: var(--theme-selected); color: var(--theme-brand-green); }

/* Footer and inverse page heroes always stay intentionally dark. */
.site-footer,
.page-hero,
.network-hero,
.about-hero,
.partner-hero,
.liquid-hero,
.regional-liquid-section,
.liquid-cta,
.partner-cta-section .partner-cta {
    color: var(--theme-inverse-text);
}
.site-footer {
    border-top-color: rgba(186,214,239,.09);
    background:
        radial-gradient(circle at 84% -10%,rgba(66,159,223,.12),transparent 34%),
        radial-gradient(circle at 8% 12%,rgba(126,211,65,.08),transparent 29%),
        linear-gradient(180deg,#05121f,#02080e);
}
.site-footer :where(h1,h2,h3,h4,strong,b),
.page-hero :where(h1,h2,h3,h4,strong,b),
.network-hero :where(h1,h2,h3,h4,strong,b),
.about-hero :where(h1,h2,h3,h4,strong,b),
.partner-hero :where(h1,h2,h3,h4,strong,b),
.liquid-hero :where(h1,h2,h3,h4,strong,b),
.regional-liquid-section :where(h1,h2,h3,h4,strong,b),
.liquid-cta :where(h1,h2,h3,h4,strong,b),
.partner-cta :where(h1,h2,h3,h4,strong,b) { color: var(--theme-inverse-text); }
.site-footer :where(p,small,a,span),
.page-hero :where(p,small,a,span),
.network-hero :where(p,small,a,span),
.about-hero :where(p,small,a,span),
.partner-hero :where(p,small,a,span),
.liquid-hero :where(p,small,a,span),
.regional-liquid-section :where(p,small,a,span),
.liquid-cta :where(p,small,a,span),
.partner-cta :where(p,small,a,span) { color: var(--theme-inverse-text-2); }
.site-footer .footer-column a:hover,
.site-footer .footer-bottom a:hover { color: #b6ef82; }
.newsletter-form {
    border-color: rgba(255,255,255,.16);
    background: rgba(255,255,255,.055);
}
.newsletter-form input,
.newsletter-form input:focus,
.newsletter-form input:hover {
    color: #fff;
    border: 0;
    background: transparent;
    box-shadow: none;
    transform: none;
}
.newsletter-form input::placeholder { color: rgba(255,255,255,.45); }

/* Theme switch: forced LTR so Arabic does not reverse the hardware. */
.theme-toggle,
.theme-toggle-track { direction: ltr; }
.theme-toggle {
    width: 64px;
    height: 38px;
    border-color: var(--theme-border);
    background: var(--theme-surface-glass-strong);
    box-shadow: inset 0 1px 0 var(--ui-card-highlight), var(--theme-shadow-1);
}
.theme-toggle-thumb {
    left: 4px;
    right: auto;
    background: linear-gradient(145deg,#fff,#eaf2f8);
}
html[data-theme="dark"] .theme-toggle {
    border-color: var(--theme-border);
    background: #081827;
}
html[data-theme="dark"] .theme-toggle-thumb,
html[dir="rtl"][data-theme="dark"] .theme-toggle-thumb,
html[dir="rtl"][data-theme="dark"] .theme-toggle[data-active-theme="dark"] .theme-toggle-thumb {
    transform: translateX(26px);
    background: linear-gradient(145deg,#1c3856,#0b1b2d);
}
.theme-icon-sun { color: #e3a31c; }
.theme-icon-moon { color: #7890aa; }
html[data-theme="dark"] .theme-icon-sun { color: #8b7754; }
html[data-theme="dark"] .theme-icon-moon { color: #9ec6f2; }

/* Smooth switching without permanently overwriting component transitions. */
html.theme-changing,
html.theme-changing body,
html.theme-changing body::before,
html.theme-changing :where(
    .site-header,.panel-topbar,.site-main,.panel-main,.panel-content,
    .product-card,.service-card,.hub-card,.mission-card,.principles-grid article,
    .form-panel,.form-section,.partner-form,.cart-item,.order-summary,.success-card,
    .public-table-wrap,.application-card,.metric-card,.panel-card,.table-card,
    .distributor-welcome,.distributor-profile-strip,.distributor-product-card,
    .language-menu,.account-dropdown,.icon-action,.mobile-menu-button,.panel-menu-toggle,
    .theme-toggle,.theme-toggle-thumb,.ai-launcher,.ai-panel,.ai-bubble,.ai-product-card,
    input,select,textarea,.premium-input-shell,.panel-search,.search-box
) {
    transition-property: background-color,border-color,color,box-shadow,fill,stroke,opacity,filter !important;
    transition-duration: .34s !important;
    transition-timing-function: ease !important;
}
::selection { background: color-mix(in srgb,var(--theme-brand-green) 35%,transparent); color: var(--theme-text); }
:focus-visible { outline: 3px solid color-mix(in srgb,var(--theme-brand-green) 64%,transparent); outline-offset: 3px; }

@media (max-width: 900px) {
    .site-header .primary-nav {
        border-color: var(--theme-border);
        background: var(--theme-surface-glass-strong);
        box-shadow: var(--theme-shadow-2);
    }
    .site-header .primary-nav a { color: var(--theme-text-2); }
    .site-header .primary-nav a:hover,
    .site-header .primary-nav a.is-active { color: var(--theme-text); background: var(--theme-selected); }
    html[data-theme="dark"] .site-header .primary-nav { background: rgba(6,18,31,.97); }
    .panel-main { background: transparent; }
    html[data-theme="dark"] .theme-toggle-thumb,
    html[dir="rtl"][data-theme="dark"] .theme-toggle-thumb,
    html[dir="rtl"][data-theme="dark"] .theme-toggle[data-active-theme="dark"] .theme-toggle-thumb { transform: translateX(22px); }
}
@media (max-width: 650px) {
    html[data-theme="dark"] .theme-toggle-thumb,
    html[dir="rtl"][data-theme="dark"] .theme-toggle-thumb,
    html[dir="rtl"][data-theme="dark"] .theme-toggle[data-active-theme="dark"] .theme-toggle-thumb { transform: translateX(20px); }
    .site-footer { padding-top: 48px; }
}
@media (prefers-reduced-motion: reduce) {
    html.theme-changing,
    html.theme-changing *,
    html.theme-changing *::before,
    html.theme-changing *::after { transition-duration: .01ms !important; }
}

/* Final component-gap fixes found during desktop, mobile and RTL visual audits. */
.logo-strip,
.services-section,
.regions-section,
.business-model-section,
.network-operations,
.shop-section,
.section-products,
.product-detail-section,
.related-section,
.cart-section,
.checkout-section,
.partner-form-section,
.principles-section,
.success-section { background-color: transparent; }

.empty-cart,
.empty-state {
    border-color: var(--theme-border);
    background: var(--theme-surface);
    color: var(--theme-text-2);
    box-shadow: var(--theme-shadow-1);
}
.service-line:hover {
    border-color: rgba(105,191,45,.38);
    background: var(--theme-surface);
    box-shadow: var(--theme-shadow-1);
}
.status-donut::before { background: var(--theme-surface); }
.status-donut strong,
.status-legend strong,
.chart-legend strong,
.panel-table td strong,
.stock-list strong,
.quick-product-list strong,
.distributor-profile-strip strong,
.distributor-prices strong,
.application-meta strong,
.panel-table code { color: var(--theme-text); }
.status-donut span,
.status-legend b,
.chart-legend,
.stock-list small,
.quick-product-list small,
.distributor-profile-strip small,
.distributor-prices span,
.application-meta small { color: var(--theme-text-2); }
.status-legend > div,
.stock-list a,
.quick-product-list > div { border-color: var(--theme-border); }
.stock-list img,
.quick-product-list img,
.distributor-product-image,
.table-product img { background: var(--theme-media); }
.distributor-product-image > span,
.tag-list span {
    border: 1px solid var(--theme-border);
    background: var(--theme-surface-2);
    color: var(--theme-text-2);
}
.status-pill,
.type-pill,
.status-draft {
    border: 1px solid var(--theme-border);
    background: var(--theme-surface-2);
    color: var(--theme-text-2);
}
.status-active,
.status-delivered,
.status-approved,
.status-paid,
.stock-level:not(.critical) {
    border-color: var(--theme-success-border);
    background: var(--theme-success-bg);
    color: var(--theme-success-text);
}
.status-pending,
.status-new,
.status-unpaid {
    border-color: var(--theme-warning-border);
    background: var(--theme-warning-bg);
    color: var(--theme-warning-text);
}
.status-cancelled,
.status-rejected,
.status-suspended,
.status-archived,
.stock-level.critical {
    border-color: var(--theme-danger-border);
    background: var(--theme-danger-bg);
    color: var(--theme-danger-text);
}
.status-confirmed,
.status-shipped,
.status-reviewing {
    border-color: color-mix(in srgb,var(--theme-brand-blue) 30%,transparent);
    background: color-mix(in srgb,var(--theme-brand-blue) 12%,transparent);
    color: color-mix(in srgb,var(--theme-brand-blue) 78%,var(--theme-text));
}
html[data-theme="dark"] .status-confirmed,
html[data-theme="dark"] .status-shipped,
html[data-theme="dark"] .status-reviewing { color: #8fc9ff; }
.status-preparing {
    border-color: rgba(155,138,251,.28);
    background: rgba(155,138,251,.12);
    color: #7d63d8;
}
html[data-theme="dark"] .status-preparing { color: #b9a8ff; }
.button-panel,
.inline-update button {
    color: #fff;
    background: linear-gradient(135deg,#123b69,#0b2347);
}

@media (max-width: 900px) {
    .catalog-toolbar select {
        flex: 0 0 auto;
        width: auto;
        min-width: min(220px,100%);
        height: 52px;
        margin: 0;
    }
}
@media (max-width: 650px) {
    .catalog-toolbar {
        display: grid;
        grid-template-columns: minmax(0,1fr);
        align-items: stretch;
        gap: 10px;
    }
    .catalog-toolbar > *,
    .catalog-toolbar .search-box,
    .catalog-toolbar select,
    .catalog-toolbar .button {
        width: 100%;
        min-width: 0;
        max-width: none;
        margin: 0;
        flex: none;
    }
    .catalog-toolbar .search-box,
    .catalog-toolbar select,
    .catalog-toolbar .button { height: 50px; }
    .catalog-toolbar .clear-filter {
        min-height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 1px solid var(--theme-danger-border);
        border-radius: 12px;
        background: var(--theme-danger-bg);
        color: var(--theme-danger-text);
    }
}


/* ========================================================================== 
   HS Fresh Product 2026 visual system
   Support · Supply · Satisfaction
   ========================================================================== */
:root {
    --theme-brand-navy: #08346b;
    --theme-brand-blue: #1769aa;
    --theme-brand-green: #4fa51f;
    --theme-brand-green-bright: #82d63a;
    --hsf-navy: #08346b;
    --hsf-deep: #041a37;
    --hsf-green: #4fa51f;
    --hsf-lime: #8cdb43;
    --hsf-sky: #62b7e7;
    --hsf-pearl: #f6fafc;
}
html[data-theme="dark"] {
    --theme-brand-navy: #7fb6f3;
    --theme-brand-blue: #5aabeb;
    --theme-brand-green: #82d63a;
    --theme-brand-green-bright: #a5ee63;
}

.brand img { width: 184px; height: 60px; object-fit: contain; }
.panel-logo img { width: 170px; height: 58px; object-fit: contain; }
.footer-brand img { width: 215px; height: 108px; object-fit: contain; object-position: left center; filter: none; }
html[dir="rtl"] .footer-brand img { object-position: right center; }
.site-header { border-top: 3px solid transparent; border-image: linear-gradient(90deg,var(--hsf-green),var(--hsf-sky),var(--hsf-green)) 1; }
.announcement { background: linear-gradient(90deg,#04172f,#082e5e 48%,#0d4d43); }
.button-primary { background: linear-gradient(135deg,#3f931a,#73c936); box-shadow: 0 16px 38px rgba(79,165,31,.28); }
.button-dark { background: linear-gradient(135deg,#0b3f7f,#062c5c); }
.eyebrow { color: var(--hsf-green); }

/* Hero */
.hsf-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 830px;
    padding: 82px 0 42px;
    background: linear-gradient(135deg,#f8fbfd 0%,#eef6fa 48%,#edf7ed 100%);
}
.hsf-hero-backdrop { position: absolute; inset: 0; z-index: -5; }
.hsf-hero-backdrop img { width: 100%; height: 100%; object-fit: cover; opacity: .58; }
.hsf-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -4;
    background: linear-gradient(90deg,rgba(247,251,253,.95) 0%,rgba(247,251,253,.78) 43%,rgba(247,251,253,.16) 72%,rgba(247,251,253,.48) 100%);
}
.hsf-hero-gridlines {
    position: absolute;
    inset: 0;
    z-index: -3;
    opacity: .36;
    background-image: linear-gradient(rgba(8,52,107,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(8,52,107,.045) 1px,transparent 1px);
    background-size: 76px 76px;
    mask-image: linear-gradient(90deg,black,transparent 84%);
}
.hsf-glow { position: absolute; z-index: -2; border-radius: 50%; filter: blur(16px); pointer-events: none; }
.hsf-glow-a { width: 410px; height: 410px; top: 100px; right: -150px; background: rgba(46,126,211,.16); animation: hsfFloat 8s ease-in-out infinite; }
.hsf-glow-b { width: 360px; height: 360px; bottom: -130px; left: 12%; background: rgba(94,184,38,.12); animation: hsfFloat 11s ease-in-out infinite reverse; }
.hsf-hero-layout { display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: 70px; min-height: 610px; }
.hsf-hero-copy { max-width: 670px; }
.hsf-hero-copy h1 { margin: 22px 0 25px; max-width: 760px; color: #062b59; font-family: "Times New Roman",Noto Serif,serif; font-size: clamp(55px,6.4vw,92px); font-weight: 700; line-height: .95; letter-spacing: -.055em; }
.hsf-hero-copy > p { max-width: 640px; margin-bottom: 34px; color: #52687c; font-size: 18px; line-height: 1.75; }
.hsf-button-outline { color: #08346b; border-color: rgba(8,52,107,.22); background: rgba(255,255,255,.58); backdrop-filter: blur(12px); }
.hsf-button-outline:hover { border-color: rgba(79,165,31,.45); background: rgba(255,255,255,.9); }
.hsf-promise-row { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 42px; }
.hsf-promise-row span { display: inline-flex; align-items: center; gap: 8px; color: #233f5c; font-size: 11px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.hsf-promise-row i { width: 7px; height: 7px; border-radius: 50%; background: var(--hsf-green); box-shadow: 0 0 0 5px rgba(79,165,31,.1); }
.hsf-hero-visual { min-width: 0; }
.hsf-orbit-stage { position: relative; width: min(590px,100%); aspect-ratio: 1; margin-inline: auto; perspective: 900px; }
.hsf-orbit-stage::before { content: ""; position: absolute; inset: 17%; border-radius: 50%; background: radial-gradient(circle at 34% 28%,#fff 0 12%,rgba(255,255,255,.82) 34%,rgba(221,239,247,.62) 70%,rgba(180,222,235,.25)); border: 1px solid rgba(255,255,255,.9); box-shadow: inset -30px -35px 70px rgba(8,52,107,.08),0 35px 90px rgba(8,52,107,.16); }
.hsf-orbit-ring { position: absolute; inset: 6%; border: 1px solid rgba(8,52,107,.15); border-radius: 50%; }
.hsf-ring-one { transform: rotate(19deg) scaleY(.55); animation: hsfOrbitA 18s linear infinite; }
.hsf-ring-two { inset: 11%; border-color: rgba(79,165,31,.25); transform: rotate(-31deg) scaleY(.68); animation: hsfOrbitB 22s linear infinite; }
.hsf-ring-three { inset: 2%; border-style: dashed; opacity: .58; animation: hsfSpin 36s linear infinite; }
.hsf-brand-sphere { position: absolute; z-index: 5; inset: 25%; display: grid; place-items: center; overflow: hidden; border: 1px solid rgba(255,255,255,.96); border-radius: 50%; background: rgba(255,255,255,.86); box-shadow: inset 0 0 60px rgba(41,108,175,.08),0 28px 70px rgba(5,41,84,.18); backdrop-filter: blur(20px); }
.hsf-brand-sphere img { width: 78%; max-height: 78%; object-fit: contain; filter: drop-shadow(0 12px 20px rgba(6,44,91,.14)); }
.hsf-brand-sphere-shine { position: absolute; width: 70%; height: 24%; top: 8%; left: 14%; border-radius: 50%; background: rgba(255,255,255,.7); filter: blur(10px); transform: rotate(-9deg); }
.hsf-float-card { position: absolute; z-index: 7; min-width: 150px; padding: 15px 17px; border: 1px solid rgba(255,255,255,.76); border-radius: 20px; background: rgba(255,255,255,.7); box-shadow: 0 18px 48px rgba(8,52,107,.14); backdrop-filter: blur(18px); animation: hsfFloat 6s ease-in-out infinite; }
.hsf-float-card small,.hsf-float-card span { display: block; color: #6e8294; font-size: 9px; text-transform: uppercase; letter-spacing: .1em; }
.hsf-float-card strong { display: block; margin: 5px 0 3px; color: #08346b; font-size: 25px; }
.hsf-float-card-a { top: 7%; left: 1%; }
.hsf-float-card-b { right: 0; top: 38%; animation-delay: -2s; }
.hsf-float-card-c { left: 7%; bottom: 5%; animation-delay: -4s; }
.hsf-orbit-dot { position: absolute; z-index: 6; width: 14px; height: 14px; border: 3px solid #fff; border-radius: 50%; background: var(--hsf-green); box-shadow: 0 0 0 8px rgba(79,165,31,.12),0 6px 14px rgba(5,37,75,.18); }
.hsf-dot-a { top: 11%; right: 25%; }
.hsf-dot-b { top: 67%; right: 9%; background: #2c86c8; }
.hsf-dot-c { bottom: 14%; left: 30%; }
.hsf-stat-dock { position: relative; z-index: 4; display: grid; grid-template-columns: repeat(4,1fr); margin-top: 24px; overflow: hidden; border: 1px solid rgba(8,52,107,.1); border-radius: 26px; background: rgba(255,255,255,.72); box-shadow: 0 22px 60px rgba(8,52,107,.1); backdrop-filter: blur(18px); }
.hsf-stat-dock article { position: relative; padding: 22px 28px; border-inline-end: 1px solid rgba(8,52,107,.08); }
.hsf-stat-dock article:last-child { border-inline-end: 0; }
.hsf-stat-dock article > span { position: absolute; top: 13px; inset-inline-end: 16px; color: rgba(8,52,107,.3); font-size: 9px; font-weight: 850; letter-spacing: .12em; }
.hsf-stat-dock strong { display: block; color: #08346b; font-family: Georgia,serif; font-size: 35px; line-height: 1; }
.hsf-stat-dock small { display: block; margin-top: 8px; color: #667b8f; font-size: 10px; font-weight: 750; text-transform: uppercase; letter-spacing: .08em; }
.hsf-marquee { overflow: hidden; border-block: 1px solid rgba(8,52,107,.08); background: #fff; }
.hsf-marquee-track { width: max-content; min-height: 50px; display: flex; align-items: center; gap: 25px; animation: hsfMarquee 32s linear infinite; }
.hsf-marquee span { color: #24435f; font-size: 10px; font-weight: 900; letter-spacing: .15em; }
.hsf-marquee i { width: 7px; height: 7px; border-radius: 50%; background: var(--hsf-green); }

/* Product and content sections */
.hsf-products-section { background: linear-gradient(180deg,var(--theme-bg) 0%,var(--theme-bg-soft) 100%); }
.hsf-products-section::before { content: ""; position: absolute; pointer-events: none; }
.product-card { border-color: var(--theme-border); background: var(--theme-surface); box-shadow: var(--theme-shadow-1); }
.product-card:hover { border-color: rgba(79,165,31,.34); box-shadow: var(--theme-shadow-2); }
.product-visual { background: linear-gradient(145deg,var(--theme-media),color-mix(in srgb,var(--theme-media) 82%,#dcefd6)); }
.round-add { background: linear-gradient(135deg,#0c4b90,#062c5c); }
.round-add:hover { background: linear-gradient(135deg,#4a9e1d,#79c83b); }

/* Network */
.hsf-network-section { overflow: hidden; background: linear-gradient(135deg,#04172f 0%,#07356e 58%,#0d4b45 100%); }
.hsf-network-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: 80px; align-items: center; }
.hsf-network-copy .eyebrow { color: #a5e968; }
.hsf-network-copy h2 { margin: 18px 0 20px; color: #fff; font-size: clamp(42px,5vw,67px); line-height: 1.02; }
.hsf-network-copy > p { color: rgba(255,255,255,.66); }
.hsf-network-copy .hsf-button-outline { margin-top: 25px; color: #fff; border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.06); }
.hsf-model-list { margin-top: 32px; }
.hsf-model-list article { display: grid; grid-template-columns: 46px 1fr; gap: 18px; padding: 20px 0; border-top: 1px solid rgba(255,255,255,.12); }
.hsf-model-list article:last-child { border-bottom: 1px solid rgba(255,255,255,.12); }
.hsf-model-list article > span { color: #91d84c; font-size: 10px; font-weight: 850; letter-spacing: .12em; }
.hsf-model-list h3 { margin-bottom: 5px; color: #fff; font-size: 19px; }
.hsf-model-list p { margin: 0; color: rgba(255,255,255,.55); font-size: 12px; }
.hsf-network-visual { position: relative; min-height: 620px; overflow: hidden; border: 1px solid rgba(255,255,255,.14); border-radius: 40px; background: radial-gradient(circle at 52% 45%,rgba(96,179,50,.18),transparent 32%),radial-gradient(circle at 50% 50%,rgba(30,116,199,.24),transparent 62%),rgba(255,255,255,.035); box-shadow: 0 50px 120px rgba(0,0,0,.28); }
.hsf-map-grid { position: absolute; inset: 0; opacity: .24; background-image: linear-gradient(rgba(255,255,255,.15) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.15) 1px,transparent 1px); background-size: 54px 54px; mask-image: radial-gradient(circle,black 25%,transparent 78%); }
.hsf-network-center { position: absolute; z-index: 5; left: 50%; top: 50%; width: 190px; height: 190px; display: flex; flex-direction: column; align-items: center; justify-content: center; transform: translate(-50%,-50%); border: 1px solid rgba(255,255,255,.55); border-radius: 50%; background: rgba(255,255,255,.9); box-shadow: 0 0 0 18px rgba(255,255,255,.045),0 28px 70px rgba(0,0,0,.28); }
.hsf-network-center img { width: 96px; height: 78px; object-fit: contain; }
.hsf-network-center strong { color: #08346b; font-size: 15px; letter-spacing: .08em; }
.hsf-network-center small { margin-top: 4px; color: #5d748a; font-size: 8px; letter-spacing: .16em; }
.hsf-network-node { position: absolute; z-index: 6; min-width: 126px; padding: 12px 15px; border: 1px solid rgba(255,255,255,.18); border-radius: 16px; background: rgba(4,24,50,.72); box-shadow: 0 14px 34px rgba(0,0,0,.22); backdrop-filter: blur(14px); transition: .25s ease; }
.hsf-network-node:hover { transform: translateY(-4px); border-color: rgba(155,228,92,.48); background: rgba(8,53,107,.9); }
.hsf-network-node span,.hsf-network-node strong { display: block; }
.hsf-network-node span { color: #9bdc58; font-size: 8px; letter-spacing: .12em; }
.hsf-network-node strong { margin-top: 4px; color: #fff; font-size: 11px; }
.hsf-network-node-1 { left: 7%; top: 18%; }
.hsf-network-node-2 { right: 7%; top: 13%; }
.hsf-network-node-3 { right: 3%; top: 44%; }
.hsf-network-node-4 { right: 12%; bottom: 10%; }
.hsf-network-node-5 { left: 10%; bottom: 8%; }
.hsf-network-node-6 { left: 2%; top: 49%; }
.hsf-network-node-7 { left: 42%; top: 4%; }
.hsf-network-line { position: absolute; left: 50%; top: 50%; width: 70%; height: 70%; border: 1px solid rgba(145,216,76,.18); border-radius: 50%; transform: translate(-50%,-50%); }
.hsf-network-line-b { width: 88%; height: 44%; transform: translate(-50%,-50%) rotate(23deg); border-color: rgba(89,172,230,.18); }
.hsf-network-line-c { width: 82%; height: 51%; transform: translate(-50%,-50%) rotate(-31deg); border-color: rgba(255,255,255,.13); }

/* Services */
.hsf-services-section { background: var(--theme-bg-soft); }
.hsf-service-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; margin-top: 46px; }
.hsf-service-card { position: relative; min-height: 285px; padding: 30px; overflow: hidden; border: 1px solid var(--theme-border); border-radius: 28px; background: var(--theme-surface); box-shadow: var(--theme-shadow-1); transition: transform .28s ease,border-color .28s ease,box-shadow .28s ease; }
.hsf-service-card::before { content: ""; position: absolute; width: 180px; height: 180px; top: -105px; right: -75px; border-radius: 50%; background: radial-gradient(circle,rgba(79,165,31,.14),transparent 68%); transition: .3s ease; }
.hsf-service-card:hover { transform: translateY(-8px); border-color: rgba(79,165,31,.34); box-shadow: var(--theme-shadow-2); }
.hsf-service-card:hover::before { transform: scale(1.25); }
.hsf-service-index { position: absolute; top: 24px; inset-inline-end: 26px; color: var(--theme-text-3); font-size: 9px; letter-spacing: .14em; }
.hsf-service-card > i { width: 58px; height: 58px; display: grid; place-items: center; border: 1px solid rgba(79,165,31,.18); border-radius: 19px; background: rgba(79,165,31,.09); color: var(--hsf-green); font-style: normal; font-size: 24px; }
.hsf-service-card h3 { margin: 48px 0 12px; font-size: 22px; }
.hsf-service-card p { margin: 0; font-size: 13px; }
.hsf-service-card > b { position: absolute; inset-inline-end: 28px; bottom: 25px; color: var(--hsf-green); font-size: 20px; }

/* Regional route board */
.hsf-regions-section { overflow: hidden; background: linear-gradient(180deg,var(--theme-bg) 0%,var(--theme-bg-alt) 100%); }
.hsf-regions-layout { display: grid; grid-template-columns: .88fr 1.12fr; gap: 24px; align-items: stretch; }
.hsf-regions-card { padding: 58px; border-radius: 36px; background: linear-gradient(145deg,#062e61,#0a4a8f 58%,#207f55); box-shadow: 0 35px 90px rgba(5,38,80,.24); }
.hsf-regions-card h2 { margin: 18px 0 20px; color: #fff; font-size: clamp(42px,5vw,62px); line-height: 1.02; }
.hsf-regions-card p { color: rgba(255,255,255,.64); }
.hsf-regions-card .button { margin-top: 18px; }
.hsf-route-board { position: relative; min-height: 500px; overflow: hidden; border: 1px solid var(--theme-border); border-radius: 36px; background: radial-gradient(circle at 60% 44%,rgba(82,168,35,.16),transparent 30%),linear-gradient(145deg,var(--theme-surface),var(--theme-surface-2)); box-shadow: var(--theme-shadow-2); }
.hsf-route-board::before { content: ""; position: absolute; inset: 0; opacity: .22; background-image: linear-gradient(var(--theme-border) 1px,transparent 1px),linear-gradient(90deg,var(--theme-border) 1px,transparent 1px); background-size: 50px 50px; }
.hsf-route-globe { position: absolute; z-index: 3; left: 50%; top: 46%; width: 220px; height: 220px; transform: translate(-50%,-50%); border: 1px solid rgba(29,105,168,.22); border-radius: 50%; background: radial-gradient(circle at 35% 28%,rgba(255,255,255,.9),rgba(101,183,224,.22) 60%,rgba(14,73,134,.16)); box-shadow: inset -24px -26px 50px rgba(8,52,107,.12),0 28px 70px rgba(8,52,107,.16); }
.hsf-route-globe::before,.hsf-route-globe::after { content: ""; position: absolute; inset: 13%; border: 1px solid rgba(8,52,107,.21); border-radius: 50%; }
.hsf-route-globe::before { transform: scaleX(.42); }
.hsf-route-globe::after { transform: scaleY(.42); }
.hsf-route-globe span,.hsf-route-globe i,.hsf-route-globe b { position: absolute; border-radius: 50%; background: rgba(79,165,31,.72); }
.hsf-route-globe span { width: 43px; height: 25px; left: 23%; top: 30%; transform: rotate(-15deg); }
.hsf-route-globe i { width: 32px; height: 48px; right: 25%; top: 28%; transform: rotate(21deg); }
.hsf-route-globe b { width: 48px; height: 24px; left: 40%; bottom: 25%; transform: rotate(8deg); }
.hsf-route-copy { position: absolute; left: 36px; top: 34px; }
.hsf-route-copy small,.hsf-route-copy strong { display: block; }
.hsf-route-copy small { color: var(--hsf-green); font-size: 9px; font-weight: 850; letter-spacing: .16em; }
.hsf-route-copy strong { margin-top: 7px; color: var(--theme-text); font-size: 21px; }
.hsf-route-tags { position: absolute; left: 34px; right: 34px; bottom: 30px; display: flex; flex-wrap: wrap; gap: 8px; }
.hsf-route-tags span { padding: 8px 11px; border: 1px solid var(--theme-border); border-radius: 999px; background: var(--theme-surface-glass); color: var(--theme-text-2); font-size: 8px; font-weight: 800; letter-spacing: .12em; }
.hsf-route-line { position: absolute; left: 50%; top: 46%; width: 78%; height: 48%; border: 1px solid rgba(29,105,168,.15); border-radius: 50%; transform: translate(-50%,-50%) rotate(17deg); }
.hsf-route-line-two { width: 82%; height: 35%; transform: translate(-50%,-50%) rotate(-24deg); border-color: rgba(79,165,31,.2); }
.hsf-route-line-three { width: 60%; height: 70%; transform: translate(-50%,-50%) rotate(4deg); border-style: dashed; }

/* CTA */
.hsf-cta-section { background: var(--theme-bg); }
.hsf-cta { position: relative; overflow: hidden; min-height: 340px; padding: 62px 68px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 50px; border-radius: 38px; background: linear-gradient(120deg,#04172f,#083c78 56%,#1b754b); box-shadow: 0 35px 95px rgba(4,29,61,.28); }
.hsf-cta::before { content: ""; position: absolute; width: 520px; height: 520px; top: -300px; right: -110px; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; box-shadow: 0 0 0 70px rgba(255,255,255,.03),0 0 0 140px rgba(255,255,255,.02); }
.hsf-cta h2 { position: relative; z-index: 2; max-width: 760px; margin: 15px 0; color: #fff; font-size: clamp(42px,5vw,62px); line-height: 1.03; }
.hsf-cta p { position: relative; z-index: 2; max-width: 740px; color: rgba(255,255,255,.62); }
.hsf-cta .button { position: relative; z-index: 2; }
.hsf-cta-mark { position: absolute; right: 16%; top: 50%; transform: translateY(-50%); color: rgba(255,255,255,.035); font-family: Georgia,serif; font-size: 260px; font-weight: 900; }

/* Authentication, assistant and dashboards */
.auth-experience-bg { content: url('/assets/showcase/hsfresh-fluid-background.png'); }
html[data-theme="dark"] .auth-experience-bg { content: url('/assets/showcase/hsfresh-fluid-background-dark.png'); opacity: .58; }
.auth-story-logo img { width: 180px; max-height: 120px; object-fit: contain; }
.auth-submit { background: linear-gradient(135deg,#0a4a8f,#4d9f20); }
.ai-avatar img { width: 100%; height: 100%; object-fit: contain; }
.ai-launcher-core,.ai-composer button { background: linear-gradient(135deg,#0e5ca8,#4d9f20); }
.panel-sidebar { background: linear-gradient(180deg,#04172f,#062f61 64%,#0c5949); }
.panel-nav a.is-active,.panel-nav a:hover { background: rgba(141,219,67,.12); color: #fff; }
.panel-nav a.is-active::before { background: var(--hsf-lime); }

/* Dark theme refinements */
html[data-theme="dark"] .hsf-hero { background: linear-gradient(135deg,#04101f,#061b34 50%,#09291f); }
html[data-theme="dark"] .hsf-hero-backdrop img { content: url('/assets/showcase/hsfresh-fluid-background-dark.png'); opacity: .76; }
html[data-theme="dark"] .hsf-hero::after { background: linear-gradient(90deg,rgba(4,16,31,.93) 0%,rgba(4,16,31,.75) 44%,rgba(4,16,31,.12) 74%,rgba(4,16,31,.48)); }
html[data-theme="dark"] .hsf-hero-gridlines { background-image: linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px); }
html[data-theme="dark"] .hsf-hero-copy h1 { color: #f0f7ff; }
html[data-theme="dark"] .hsf-hero-copy > p { color: #aebfd1; }
html[data-theme="dark"] .hsf-button-outline { color: #eef7ff; border-color: rgba(208,230,247,.18); background: rgba(255,255,255,.045); }
html[data-theme="dark"] .hsf-promise-row span { color: #c0cfdd; }
html[data-theme="dark"] .hsf-orbit-stage::before { background: radial-gradient(circle at 34% 28%,rgba(255,255,255,.16),transparent 20%),linear-gradient(145deg,rgba(27,66,100,.72),rgba(6,26,48,.78)); border-color: rgba(209,232,247,.14); box-shadow: inset -30px -35px 70px rgba(0,0,0,.2),0 35px 90px rgba(0,0,0,.38); }
html[data-theme="dark"] .hsf-brand-sphere { background: rgba(9,29,52,.87); border-color: rgba(207,230,247,.16); }
html[data-theme="dark"] .hsf-brand-sphere img { filter: drop-shadow(0 12px 20px rgba(0,0,0,.34)) brightness(1.12); }
html[data-theme="dark"] .hsf-float-card { border-color: rgba(211,232,246,.14); background: rgba(8,27,49,.74); box-shadow: 0 18px 48px rgba(0,0,0,.32); }
html[data-theme="dark"] .hsf-float-card strong { color: #f2f8ff; }
html[data-theme="dark"] .hsf-float-card small,html[data-theme="dark"] .hsf-float-card span { color: #98adc1; }
html[data-theme="dark"] .hsf-stat-dock { border-color: rgba(209,230,244,.12); background: rgba(8,27,48,.72); box-shadow: 0 22px 60px rgba(0,0,0,.32); }
html[data-theme="dark"] .hsf-stat-dock article { border-color: rgba(209,230,244,.1); }
html[data-theme="dark"] .hsf-stat-dock strong { color: #eef7ff; }
html[data-theme="dark"] .hsf-stat-dock small { color: #9cafc2; }
html[data-theme="dark"] .hsf-marquee { border-color: rgba(209,230,244,.1); background: #061321; }
html[data-theme="dark"] .hsf-marquee span { color: #afc2d3; }
html[data-theme="dark"] .hsf-network-center { background: rgba(238,247,252,.94); }
html[data-theme="dark"] .hsf-route-globe { background: radial-gradient(circle at 35% 28%,rgba(255,255,255,.16),rgba(51,127,184,.2) 60%,rgba(6,29,53,.5)); }
html[data-theme="dark"] .footer-brand img { filter: brightness(1.18); }

@keyframes hsfFloat { 0%,100% { transform: translate3d(0,0,0); } 50% { transform: translate3d(0,-12px,0); } }
@keyframes hsfSpin { to { transform: rotate(360deg); } }
@keyframes hsfOrbitA { to { transform: rotate(379deg) scaleY(.55); } }
@keyframes hsfOrbitB { to { transform: rotate(-391deg) scaleY(.68); } }
@keyframes hsfMarquee { to { transform: translateX(-50%); } }

@media (max-width: 1100px) {
    .hsf-hero-layout,.hsf-network-layout { grid-template-columns: 1fr; }
    .hsf-hero-copy { max-width: 760px; }
    .hsf-hero-visual { max-width: 650px; width: 100%; margin-inline: auto; }
    .hsf-network-visual { min-height: 590px; }
    .hsf-service-grid { grid-template-columns: repeat(2,1fr); }
    .hsf-regions-layout { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .hsf-hero { min-height: auto; padding-top: 55px; }
    .hsf-hero-layout { gap: 35px; min-height: 0; }
    .hsf-hero-copy h1 { font-size: clamp(47px,13vw,68px); }
    .hsf-hero-copy > p { font-size: 15px; }
    .hsf-orbit-stage { max-width: 510px; }
    .hsf-float-card { min-width: 116px; padding: 11px 12px; border-radius: 14px; }
    .hsf-float-card strong { font-size: 20px; }
    .hsf-stat-dock { grid-template-columns: repeat(2,1fr); }
    .hsf-stat-dock article:nth-child(2) { border-inline-end: 0; }
    .hsf-stat-dock article:nth-child(-n+2) { border-bottom: 1px solid var(--theme-border); }
    .hsf-network-visual { min-height: 500px; }
    .hsf-network-center { width: 145px; height: 145px; }
    .hsf-network-center img { width: 76px; height: 60px; }
    .hsf-network-node { min-width: 98px; padding: 9px 10px; }
    .hsf-network-node strong { font-size: 9px; }
    .hsf-service-grid { grid-template-columns: 1fr; }
    .hsf-regions-card { padding: 38px 30px; }
    .hsf-route-board { min-height: 430px; }
    .hsf-cta { grid-template-columns: 1fr; padding: 45px 30px; }
    .hsf-cta-mark { right: -20px; font-size: 190px; }
}
@media (max-width: 520px) {
    .brand img { width: 150px; }
    .hsf-hero-visual { margin-top: 5px; }
    .hsf-float-card-a { left: -4%; }
    .hsf-float-card-b { right: -3%; }
    .hsf-float-card-c { left: 1%; }
    .hsf-promise-row { gap: 12px; }
    .hsf-promise-row span { font-size: 9px; }
    .hsf-network-node-7 { left: 35%; }
    .hsf-route-copy { left: 24px; top: 24px; }
    .hsf-route-tags { left: 22px; right: 22px; bottom: 22px; }
}
@media (prefers-reduced-motion: reduce) {
    .hsf-glow,.hsf-float-card,.hsf-ring-one,.hsf-ring-two,.hsf-ring-three,.hsf-marquee-track { animation: none !important; }
}
.panel-brand img { padding: 7px 9px; border-radius: 14px; background: rgba(255,255,255,.94); }
html[data-theme="dark"] .brand img { padding: 4px 7px; border-radius: 12px; background: rgba(255,255,255,.92); box-shadow: 0 8px 24px rgba(0,0,0,.18); }
html[data-theme="dark"] .footer-brand img { padding: 7px; border-radius: 18px; background: rgba(255,255,255,.92); }

/* ========================================================================== 
   HS Fresh Product · Global Fresh Commerce 2026
   Bento commerce homepage, futuristic supply visuals and theme-safe motion.
   ========================================================================== */

:root {
    --container: 1380px;
    --hsx-blue: #073a78;
    --hsx-blue-2: #0d5cab;
    --hsx-green: #58aa2b;
    --hsx-green-2: #80cf42;
    --hsx-ice: #eef7ff;
    --hsx-radius-xl: 34px;
    --hsx-radius-lg: 26px;
    --hsx-radius-md: 18px;
    --hsx-shadow: 0 26px 80px rgba(11, 48, 84, .12);
    --hsx-shadow-soft: 0 14px 38px rgba(11, 48, 84, .09);
}

/* Header refinement matching the product-commerce visual direction. */
.site-header .nav-shell {
    grid-template-columns: 178px minmax(410px, 1fr) minmax(190px, 280px) auto;
    min-height: 84px;
    gap: 20px;
}
.site-header .brand {
    display: inline-flex;
    align-items: center;
    min-width: 0;
}
.site-header .brand img {
    width: 166px;
    height: 62px;
    object-fit: contain;
    object-position: center;
}
.site-header .primary-nav {
    justify-content: flex-start;
    gap: clamp(16px, 1.8vw, 27px);
}
.site-header .primary-nav a {
    font-size: 12px;
    white-space: nowrap;
}
.nav-search {
    display: flex;
    align-items: center;
    min-width: 0;
    height: 44px;
    padding-inline: 15px 8px;
    border: 1px solid var(--theme-border);
    border-radius: 999px;
    background: var(--theme-surface-glass-strong);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.38), 0 8px 24px rgba(9,45,82,.05);
    transition: border-color .22s ease, box-shadow .22s ease, background .22s ease;
}
.nav-search:focus-within {
    border-color: color-mix(in srgb, var(--theme-brand-green) 52%, var(--theme-border));
    box-shadow: var(--theme-focus), 0 10px 28px rgba(9,45,82,.08);
}
.nav-search input {
    min-width: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    color: var(--theme-text);
    font-size: 12px;
    outline: 0;
}
.nav-search button {
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--theme-text-2);
}
.nav-search button:hover { background: var(--theme-selected); color: var(--theme-text); }
.nav-search svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.site-header .nav-actions { gap: 9px; }
.site-header .register-link { min-width: max-content; }

/* Hero */
.hsx-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 650px;
    display: grid;
    align-items: center;
    border-bottom: 1px solid var(--theme-border);
    background:
        radial-gradient(circle at 74% 22%, rgba(67, 157, 224, .16), transparent 28rem),
        radial-gradient(circle at 12% 82%, rgba(98, 184, 48, .11), transparent 24rem),
        linear-gradient(135deg, color-mix(in srgb, var(--theme-bg) 96%, #fff), var(--theme-bg-alt));
}
.hsx-hero::before {
    content: "";
    position: absolute;
    z-index: -2;
    inset: 0;
    background: linear-gradient(90deg, var(--theme-bg) 0%, color-mix(in srgb, var(--theme-bg) 88%, transparent) 42%, transparent 74%);
    pointer-events: none;
}
.hsx-hero-grid {
    position: absolute;
    z-index: -3;
    inset: 0;
    opacity: .45;
    background-image:
        linear-gradient(color-mix(in srgb, var(--theme-border) 50%, transparent) 1px, transparent 1px),
        linear-gradient(90deg, color-mix(in srgb, var(--theme-border) 50%, transparent) 1px, transparent 1px);
    background-size: 68px 68px;
    mask-image: linear-gradient(90deg, #000, transparent 78%);
}
.hsx-hero-orb {
    position: absolute;
    z-index: -2;
    border-radius: 50%;
    filter: blur(1px);
    pointer-events: none;
    animation: hsxFloat 9s ease-in-out infinite;
}
.hsx-orb-a {
    width: 360px;
    height: 360px;
    top: -130px;
    inset-inline-end: 10%;
    border: 1px solid rgba(72,157,220,.18);
    box-shadow: inset 0 0 95px rgba(75,164,225,.11), 0 0 0 60px rgba(75,164,225,.025);
}
.hsx-orb-b {
    width: 210px;
    height: 210px;
    bottom: -95px;
    inset-inline-start: 37%;
    background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.8), rgba(92,180,50,.07) 60%, transparent);
    animation-delay: -4s;
}
.hsx-leaf {
    position: absolute;
    z-index: 4;
    width: 32px;
    height: 18px;
    border-radius: 100% 0 100% 0;
    background: linear-gradient(145deg, var(--hsx-green-2), #2a7e2d);
    box-shadow: 0 10px 24px rgba(48,125,38,.17);
    pointer-events: none;
    animation: hsxLeaf 8s ease-in-out infinite;
}
.hsx-leaf::after {
    content: "";
    position: absolute;
    left: 4px;
    right: 4px;
    top: 50%;
    height: 1px;
    background: rgba(255,255,255,.55);
    transform: rotate(-24deg);
    transform-origin: center;
}
.hsx-leaf-a { top: 15%; inset-inline-end: 7%; transform: rotate(28deg); }
.hsx-leaf-b { top: 28%; inset-inline-end: 49%; width: 22px; height: 13px; animation-delay: -2s; }
.hsx-leaf-c { bottom: 12%; inset-inline-end: 19%; width: 26px; height: 15px; animation-delay: -5s; }
.hsx-hero-layout {
    min-height: 650px;
    display: grid;
    grid-template-columns: minmax(410px, .78fr) minmax(560px, 1.22fr);
    align-items: center;
    gap: 36px;
    padding-top: 46px;
    padding-bottom: 54px;
}
.hsx-hero-copy { position: relative; z-index: 5; max-width: 630px; }
.hsx-badge {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 13px;
    border: 1px solid rgba(31,112,191,.26);
    border-radius: 999px;
    background: rgba(239,248,255,.74);
    color: var(--hsx-blue-2);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .08em;
}
.hsx-hero-copy h1 {
    margin: 16px 0 18px;
    color: var(--theme-text);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(50px, 5.25vw, 78px);
    line-height: .96;
    letter-spacing: -.052em;
}
.hsx-hero-copy h1 span { display: block; }
.hsx-hero-copy h1 .hsx-accent {
    color: var(--hsx-green);
    text-shadow: 0 8px 28px rgba(84,170,44,.12);
}
.hsx-hero-copy > p {
    max-width: 570px;
    margin-bottom: 25px;
    color: var(--theme-text-2);
    font-size: 15px;
    line-height: 1.72;
}
.hsx-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hsx-button-primary {
    color: #fff;
    background: linear-gradient(135deg, #073c7a, #0b5aa5);
    box-shadow: 0 16px 34px rgba(7,61,122,.23);
}
.hsx-button-primary:hover { box-shadow: 0 21px 45px rgba(7,61,122,.31); }
.hsx-button-secondary {
    border-color: rgba(80,164,42,.48);
    background: color-mix(in srgb, var(--theme-surface) 80%, transparent);
    color: color-mix(in srgb, var(--theme-brand-green) 68%, var(--theme-text));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.5);
}
.hsx-button-secondary:hover { background: var(--theme-selected); border-color: var(--theme-brand-green); }
.hsx-user-plus {
    width: 23px;
    height: 23px;
    display: grid;
    place-items: center;
    border: 1px solid currentColor;
    border-radius: 50%;
    font-size: 14px;
}
.hsx-trust-row {
    margin-top: 28px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 12px;
}
.hsx-trust-row article {
    display: grid;
    grid-template-columns: 32px 1fr;
    align-items: center;
    gap: 8px;
    min-width: 0;
}
.hsx-mini-icon {
    width: 31px;
    height: 31px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--theme-selected);
    color: var(--theme-brand-green);
    font-style: normal;
    font-weight: 900;
}
.hsx-trust-row strong,
.hsx-trust-row small { display: block; }
.hsx-trust-row strong {
    overflow: hidden;
    color: var(--theme-text);
    font-size: 9px;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.hsx-trust-row small { margin-top: 3px; color: var(--theme-text-3); font-size: 8px; line-height: 1.2; }
.hsx-hero-visual {
    position: relative;
    z-index: 2;
    width: calc(100% + 80px);
    margin-inline-start: -48px;
    perspective: 1200px;
}
.hsx-hero-picture {
    position: relative;
    overflow: hidden;
    min-height: 440px;
    border: 1px solid rgba(109,154,192,.15);
    border-radius: 38px;
    background: #f4f9fd;
    box-shadow: 0 34px 90px rgba(18,67,106,.13), inset 0 1px 0 rgba(255,255,255,.9);
    transform-style: preserve-3d;
}
.hsx-hero-picture::before {
    content: "";
    position: absolute;
    z-index: 3;
    inset: 0 auto 0 0;
    width: 15%;
    background: linear-gradient(90deg, color-mix(in srgb, var(--theme-bg) 82%, #fff), transparent);
    pointer-events: none;
}
html[dir="rtl"] .hsx-hero-picture::before { inset: 0 0 0 auto; transform: scaleX(-1); }
.hsx-hero-picture img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: opacity .45s ease, transform .8s cubic-bezier(.2,.75,.25,1);
}
.hsx-hero-picture:hover img { transform: scale(1.025); }
.hsx-hero-image-dark { opacity: 0; }
html[data-theme="dark"] .hsx-hero-image-light { opacity: 0; }
html[data-theme="dark"] .hsx-hero-image-dark { opacity: 1; }
.hsx-quote-rail {
    position: absolute;
    z-index: 10;
    top: 50%;
    inset-inline-end: 0;
    min-height: 158px;
    width: 46px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 11px;
    transform: translateY(-50%);
    border-radius: 18px 0 0 18px;
    background: linear-gradient(180deg, var(--hsx-green), var(--hsx-blue));
    color: #fff;
    box-shadow: 0 18px 45px rgba(7,54,104,.24);
}
html[dir="rtl"] .hsx-quote-rail { border-radius: 0 18px 18px 0; }
.hsx-quote-rail b {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    font-size: 10px;
    letter-spacing: .06em;
    white-space: nowrap;
}

/* Bento marketplace */
.hsx-bento-section { position: relative; padding: 34px 0 42px; background: transparent; }
.hsx-bento {
    display: grid;
    grid-template-columns: repeat(12, minmax(0,1fr));
    gap: 18px;
}
.hsx-panel {
    position: relative;
    overflow: hidden;
    min-width: 0;
    padding: 24px;
    border: 1px solid var(--theme-border);
    border-radius: var(--hsx-radius-lg);
    background: linear-gradient(145deg, color-mix(in srgb, var(--theme-surface) 96%, #fff), var(--theme-surface-2));
    box-shadow: var(--theme-shadow-1), inset 0 1px 0 rgba(255,255,255,.42);
}
.hsx-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(circle at 100% 0, rgba(77,169,224,.08), transparent 34%);
}
.hsx-category-panel { grid-column: span 4; }
.hsx-products-panel { grid-column: span 5; }
.hsx-network-panel { grid-column: span 3; display: flex; flex-direction: column; }
.hsx-panel-heading {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 18px;
    margin-bottom: 18px;
}
.hsx-panel-heading.compact { align-items: flex-start; }
.hsx-kicker {
    display: inline-flex;
    margin-bottom: 7px;
    color: var(--theme-brand-green);
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .16em;
}
.hsx-panel-heading h2,
.hsx-proof h2 { margin: 0 0 6px; color: var(--theme-text); font-size: 19px; letter-spacing: -.03em; }
.hsx-panel-heading p { max-width: 360px; margin: 0; color: var(--theme-text-2); font-size: 10px; line-height: 1.5; }
.hsx-panel-heading > a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    flex: 0 0 auto;
    color: var(--theme-brand-green);
    font-size: 9px;
    font-weight: 850;
}
.hsx-category-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 9px;
}
.hsx-category-card {
    position: relative;
    min-height: 118px;
    padding: 9px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    overflow: hidden;
    border: 1px solid var(--theme-border);
    border-radius: 15px;
    background: var(--theme-surface);
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.hsx-category-card:hover {
    transform: translateY(-4px);
    border-color: color-mix(in srgb, var(--theme-brand-green) 42%, var(--theme-border));
    box-shadow: var(--hsx-shadow-soft);
}
.hsx-category-card img {
    position: absolute;
    width: 92%;
    height: 84px;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    object-fit: contain;
    transition: transform .3s ease;
}
.hsx-category-card:hover img { transform: translateX(-50%) scale(1.06) rotate(-2deg); }
.hsx-category-card span {
    position: relative;
    z-index: 2;
    padding-inline-end: 18px;
    color: var(--theme-text);
    font-size: 9px;
    font-weight: 800;
    line-height: 1.2;
}
.hsx-category-card i {
    position: absolute;
    z-index: 2;
    inset-inline-end: 8px;
    bottom: 8px;
    width: 18px;
    height: 18px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--theme-selected);
    color: var(--theme-brand-green);
    font-size: 9px;
    font-style: normal;
}
.hsx-mini-products {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 9px;
}
.hsx-mini-product {
    min-width: 0;
    padding: 9px;
    border: 1px solid var(--theme-border);
    border-radius: 16px;
    background: var(--theme-surface);
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.hsx-mini-product:hover {
    transform: translateY(-4px);
    border-color: color-mix(in srgb, var(--theme-brand-blue) 38%, var(--theme-border));
    box-shadow: var(--hsx-shadow-soft);
}
.hsx-mini-product-image {
    position: relative;
    display: grid;
    place-items: center;
    overflow: hidden;
    aspect-ratio: 1.12;
    margin-bottom: 9px;
    border-radius: 12px;
    background: linear-gradient(145deg, var(--theme-media), var(--theme-surface-2));
}
.hsx-mini-product-image img { width: 90%; height: 90%; object-fit: contain; transition: transform .28s ease; }
.hsx-mini-product:hover .hsx-mini-product-image img { transform: scale(1.07) rotate(-2deg); }
.hsx-mini-product-image span {
    position: absolute;
    top: 7px;
    inset-inline-end: 7px;
    width: 23px;
    height: 23px;
    display: grid;
    place-items: center;
    border: 1px solid var(--theme-border);
    border-radius: 50%;
    background: var(--theme-surface-glass-strong);
    color: var(--theme-text-2);
    font-size: 11px;
}
.hsx-mini-product h3 { margin: 0 0 4px; font-size: 10px; line-height: 1.25; }
.hsx-mini-product h3 a { color: var(--theme-text); }
.hsx-mini-product small { display: block; overflow: hidden; color: var(--theme-text-3); font-size: 7.5px; white-space: nowrap; text-overflow: ellipsis; }
.hsx-mini-product footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 7px;
    margin-top: 10px;
}
.hsx-mini-product footer strong { color: var(--theme-text); font-size: 11px; }
.hsx-mini-product footer button {
    width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: var(--theme-selected);
    color: var(--theme-brand-green);
    font-weight: 900;
}
.hsx-map-card {
    position: relative;
    flex: 1;
    min-height: 255px;
    display: block;
    overflow: hidden;
    border-radius: 19px;
    background:
        radial-gradient(circle at 72% 24%, rgba(106,203,62,.18), transparent 24%),
        linear-gradient(145deg, #eef7ff, #dceaf6);
    box-shadow: inset 0 0 0 1px rgba(19,83,139,.08);
}
.hsx-map-card::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: .45;
    background-image: linear-gradient(rgba(20,81,134,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(20,81,134,.07) 1px,transparent 1px);
    background-size: 27px 27px;
}
.hsx-map-card svg { position: absolute; inset: 12% 7% 20%; width: 86%; height: 68%; }
.hsx-map-card path { fill: #94b2cc; opacity: .78; }
.hsx-map-dot {
    position: absolute;
    z-index: 3;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--hsx-green-2);
    box-shadow: 0 0 0 7px rgba(103,190,54,.14), 0 0 20px rgba(103,190,54,.45);
    animation: hsxPulse 2.8s ease-in-out infinite;
}
.hsx-map-dot-1 { left: 23%; top: 40%; }
.hsx-map-dot-2 { left: 48%; top: 37%; animation-delay: -.8s; }
.hsx-map-dot-3 { left: 68%; top: 43%; animation-delay: -1.5s; }
.hsx-map-dot-4 { left: 76%; top: 68%; animation-delay: -2.1s; }
.hsx-map-route {
    position: absolute;
    z-index: 2;
    border-top: 1px dashed rgba(71,159,40,.65);
    border-radius: 50%;
    transform-origin: left center;
}
.hsx-map-route-1 { width: 31%; left: 24%; top: 38%; transform: rotate(2deg); }
.hsx-map-route-2 { width: 26%; left: 48%; top: 39%; transform: rotate(9deg); }
.hsx-map-route-3 { width: 25%; left: 65%; top: 49%; transform: rotate(39deg); }
.hsx-map-legend {
    position: absolute;
    z-index: 4;
    left: 16px;
    right: 16px;
    bottom: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #174d7d;
    font-size: 9px;
    font-weight: 850;
}
.hsx-map-legend span { width: 20px; height: 2px; border-radius: 9px; background: var(--hsx-green); }

/* Performance and services */
.hsx-performance { padding: 22px 0 42px; }
.hsx-performance-grid {
    display: grid;
    grid-template-columns: 1.7fr repeat(3, .82fr) 1.22fr;
    gap: 14px;
    align-items: stretch;
}
.hsx-stat-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    overflow: hidden;
    min-height: 175px;
    border-radius: 24px;
    background:
        radial-gradient(circle at 20% 0, rgba(86,171,229,.22), transparent 40%),
        linear-gradient(135deg, #063a79, #052d5e 60%, #061f43);
    box-shadow: 0 24px 65px rgba(5,45,93,.24);
}
.hsx-stat-strip article {
    position: relative;
    min-width: 0;
    padding: 23px 14px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    border-inline-end: 1px solid rgba(255,255,255,.12);
}
.hsx-stat-strip article:last-child { border-inline-end: 0; }
.hsx-stat-strip i { color: #a8eb75; font-size: 19px; font-style: normal; }
.hsx-stat-strip strong { margin: 10px 0 5px; color: #fff; font-size: 27px; }
.hsx-stat-strip span { color: rgba(255,255,255,.66); font-size: 8px; line-height: 1.35; }
.hsx-feature-card {
    min-height: 175px;
    padding: 22px 18px;
    border: 1px solid var(--theme-border);
    border-radius: 22px;
    background: var(--theme-surface);
    box-shadow: var(--theme-shadow-1), inset 0 1px 0 rgba(255,255,255,.4);
    transition: transform .25s ease, border-color .25s ease;
}
.hsx-feature-card:hover { transform: translateY(-5px); border-color: color-mix(in srgb, var(--theme-brand-green) 36%, var(--theme-border)); }
.hsx-feature-icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: var(--theme-selected);
    color: var(--theme-brand-green);
    font-size: 18px;
    font-weight: 900;
}
.hsx-feature-card h3 { margin: 18px 0 8px; color: var(--theme-text); font-size: 13px; }
.hsx-feature-card p { margin: 0; color: var(--theme-text-2); font-size: 9px; line-height: 1.55; }
.hsx-distributor-card {
    position: relative;
    overflow: hidden;
    min-height: 175px;
    padding: 24px;
    display: flex;
    align-items: center;
    border-radius: 23px;
    background:
        radial-gradient(circle at 100% 0, rgba(126,215,62,.26), transparent 45%),
        linear-gradient(135deg, #062f65, #031a3a);
    box-shadow: 0 24px 60px rgba(5,41,84,.24);
}
.hsx-distributor-card::before {
    content: "";
    position: absolute;
    width: 210px;
    height: 210px;
    right: -90px;
    bottom: -105px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 50%;
    box-shadow: 0 0 0 42px rgba(255,255,255,.025);
}
.hsx-distributor-card > div { position: relative; z-index: 2; max-width: 82%; }
.hsx-distributor-card span { color: #9ce66c; font-size: 7px; font-weight: 850; letter-spacing: .12em; }
.hsx-distributor-card h3 { margin: 7px 0 5px; color: #fff; font-size: 15px; }
.hsx-distributor-card p { margin-bottom: 12px; color: rgba(255,255,255,.62); font-size: 8.5px; line-height: 1.45; }
.hsx-distributor-card .button { min-height: 34px; padding: 0 14px; font-size: 9px; }
.hsx-handshake { position: absolute; z-index: 1; right: 7px; bottom: 0; font-size: 58px; opacity: .22; transform: rotate(-8deg); }
html[dir="rtl"] .hsx-handshake { right: auto; left: 7px; transform: rotate(8deg); }

/* Social proof and language capability */
.hsx-proof { padding: 30px 0 78px; }
.hsx-proof-grid {
    display: grid;
    grid-template-columns: 1.25fr 1.35fr 1fr;
    gap: 18px;
    align-items: stretch;
}
.hsx-partners,
.hsx-testimonial,
.hsx-languages {
    min-width: 0;
    padding: 25px;
    border: 1px solid var(--theme-border);
    border-radius: 24px;
    background: var(--theme-surface);
    box-shadow: var(--theme-shadow-1), inset 0 1px 0 rgba(255,255,255,.42);
}
.hsx-partner-logos {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}
.hsx-partner-logos span {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    padding: 0 14px;
    border: 1px solid var(--theme-border);
    border-radius: 10px;
    background: var(--theme-surface-2);
    color: var(--theme-text-2);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: -.02em;
}
.hsx-testimonial { position: relative; }
.hsx-quote-mark { position: absolute; top: 8px; inset-inline-start: 20px; color: var(--theme-brand-green); font-family: Georgia,serif; font-size: 58px; opacity: .55; }
.hsx-testimonial blockquote { position: relative; margin: 28px 0 25px; color: var(--theme-text-2); font-size: 12px; line-height: 1.7; }
.hsx-testimonial footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.hsx-testimonial footer strong,
.hsx-testimonial footer small { display: block; }
.hsx-testimonial footer strong { color: var(--theme-text); font-size: 10px; }
.hsx-testimonial footer small { margin-top: 3px; color: var(--theme-text-3); font-size: 8px; }
.hsx-testimonial footer > span { color: #76bf3c; font-size: 12px; letter-spacing: .1em; }
.hsx-languages > div {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    margin-top: 20px;
}
.hsx-languages a {
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid var(--theme-border);
    border-radius: 12px;
    background: var(--theme-surface-2);
    color: var(--theme-text-2);
    transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.hsx-languages a:hover,
.hsx-languages a.is-active { transform: translateY(-2px); border-color: rgba(91,174,47,.45); background: var(--theme-selected); color: var(--theme-text); }
.hsx-languages a span { font-size: 16px; }
.hsx-languages a b { font-size: 8px; }
.hsx-final-cta { padding: 0 0 86px; }
.hsx-final-cta-inner {
    position: relative;
    overflow: hidden;
    min-height: 230px;
    padding: 44px 52px;
    display: grid;
    grid-template-columns: 110px 1fr auto;
    align-items: center;
    gap: 32px;
    border-radius: 32px;
    background:
        radial-gradient(circle at 95% 15%, rgba(128,210,69,.28), transparent 32%),
        linear-gradient(120deg, #04285a, #073d7d 56%, #1f733e);
    box-shadow: 0 32px 85px rgba(5,42,88,.28);
}
.hsx-final-cta-inner::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: .12;
    background-image: linear-gradient(rgba(255,255,255,.23) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.23) 1px,transparent 1px);
    background-size: 45px 45px;
}
.hsx-final-logo,
.hsx-final-cta-inner > div,
.hsx-final-cta-inner > a { position: relative; z-index: 2; }
.hsx-final-logo {
    width: 100px;
    height: 100px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 28px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 18px 50px rgba(0,0,0,.18);
}
.hsx-final-logo img { width: 86%; height: 86%; object-fit: contain; }
.hsx-final-cta-inner span { color: #a9ed75; font-size: 9px; font-weight: 850; letter-spacing: .14em; }
.hsx-final-cta-inner h2 { margin: 8px 0 8px; color: #fff; font-size: clamp(29px,3vw,43px); }
.hsx-final-cta-inner p { max-width: 760px; margin: 0; color: rgba(255,255,255,.66); font-size: 12px; }

/* Dark-mode treatment built from the same semantic system, not random navy paint. */
html[data-theme="dark"] .hsx-hero {
    background:
        radial-gradient(circle at 76% 18%, rgba(61,146,211,.16), transparent 29rem),
        radial-gradient(circle at 13% 78%, rgba(93,185,47,.09), transparent 23rem),
        linear-gradient(135deg, #06111d, #081827 55%, #061622);
}
html[data-theme="dark"] .hsx-hero::before {
    background: linear-gradient(90deg, #06111d 0%, rgba(6,17,29,.9) 42%, transparent 78%);
}
html[data-theme="dark"] .hsx-badge {
    border-color: rgba(108,180,231,.24);
    background: rgba(18,49,75,.62);
    color: #93d0ff;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.07);
}
html[data-theme="dark"] .hsx-hero-copy h1 { color: #f1f7fd; }
html[data-theme="dark"] .hsx-hero-copy h1 .hsx-accent { color: #8ad94d; }
html[data-theme="dark"] .hsx-button-secondary { background: rgba(255,255,255,.035); color: #b7e994; border-color: rgba(143,216,89,.27); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
html[data-theme="dark"] .hsx-hero-picture {
    border-color: rgba(180,215,239,.13);
    background: #071625;
    box-shadow: 0 34px 95px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.06);
}
html[data-theme="dark"] .hsx-hero-picture::before { background: linear-gradient(90deg, rgba(6,17,29,.82), transparent); }
html[data-theme="dark"] .hsx-panel,
html[data-theme="dark"] .hsx-category-card,
html[data-theme="dark"] .hsx-mini-product,
html[data-theme="dark"] .hsx-feature-card,
html[data-theme="dark"] .hsx-partners,
html[data-theme="dark"] .hsx-testimonial,
html[data-theme="dark"] .hsx-languages {
    box-shadow: 0 18px 55px rgba(0,0,0,.23), inset 0 1px 0 rgba(255,255,255,.035);
}
html[data-theme="dark"] .hsx-map-card {
    background:
        radial-gradient(circle at 75% 18%, rgba(119,211,64,.1), transparent 30%),
        linear-gradient(145deg, #0a2034, #071522);
    box-shadow: inset 0 0 0 1px rgba(177,214,239,.08);
}
html[data-theme="dark"] .hsx-map-card path { fill: #294c69; }
html[data-theme="dark"] .hsx-map-legend { color: #b6d1e5; }
html[data-theme="dark"] .hsx-final-logo { background: rgba(255,255,255,.94); }

/* Motion */
@keyframes hsxFloat {
    0%,100% { transform: translate3d(0,0,0); }
    50% { transform: translate3d(0,-13px,0); }
}
@keyframes hsxLeaf {
    0%,100% { translate: 0 0; rotate: 0deg; }
    35% { translate: -10px 12px; rotate: 14deg; }
    70% { translate: 8px 22px; rotate: -9deg; }
}
@keyframes hsxPulse {
    0%,100% { transform: scale(.92); opacity: .78; }
    50% { transform: scale(1.18); opacity: 1; }
}

/* Responsive design */
@media (max-width: 1320px) {
    .site-header .nav-shell { grid-template-columns: 165px 1fr 210px auto; }
    .site-header .primary-nav { gap: 16px; }
    .site-header .primary-nav a { font-size: 11px; }
    .site-header .language-name { display: none; }
    .hsx-hero-layout { grid-template-columns: minmax(390px,.84fr) minmax(500px,1.16fr); }
    .hsx-performance-grid { grid-template-columns: 1.55fr repeat(3,.8fr) 1.15fr; }
}
@media (max-width: 1180px) {
    .site-header .nav-shell { grid-template-columns: 160px 1fr auto; }
    .site-header .nav-search { display: none; }
    .hsx-hero-layout { grid-template-columns: 1fr 1.08fr; }
    .hsx-hero-visual { width: calc(100% + 25px); margin-inline-start: -20px; }
    .hsx-trust-row { grid-template-columns: repeat(2,1fr); }
    .hsx-category-panel { grid-column: span 5; }
    .hsx-products-panel { grid-column: span 7; }
    .hsx-network-panel { grid-column: 1 / -1; min-height: 320px; }
    .hsx-map-card { min-height: 270px; }
    .hsx-performance-grid { grid-template-columns: repeat(6,1fr); }
    .hsx-stat-strip { grid-column: 1 / -1; }
    .hsx-feature-card { grid-column: span 2; }
    .hsx-distributor-card { grid-column: 1 / -1; }
}
@media (max-width: 930px) {
    .hsx-hero { min-height: auto; }
    .hsx-hero-layout { min-height: 0; grid-template-columns: 1fr; gap: 34px; padding-top: 58px; padding-bottom: 58px; }
    .hsx-hero-copy { max-width: 760px; }
    .hsx-hero-copy h1 { max-width: 720px; }
    .hsx-hero-visual { width: 100%; margin: 0; }
    .hsx-hero-picture { min-height: 430px; }
    .hsx-quote-rail { display: none; }
    .hsx-category-panel,
    .hsx-products-panel,
    .hsx-network-panel { grid-column: 1 / -1; }
    .hsx-category-grid { grid-template-columns: repeat(6,1fr); }
    .hsx-category-card { min-height: 132px; }
    .hsx-proof-grid { grid-template-columns: 1fr 1fr; }
    .hsx-languages { grid-column: 1 / -1; }
    .hsx-languages > div { grid-template-columns: repeat(7,1fr); }
    .hsx-final-cta-inner { grid-template-columns: 90px 1fr; }
    .hsx-final-cta-inner > a { grid-column: 2; justify-self: start; }
}
@media (max-width: 720px) {
    .hsx-hero-layout { padding-top: 42px; }
    .hsx-hero-copy h1 { font-size: clamp(48px,13vw,66px); }
    .hsx-hero-copy > p { font-size: 14px; }
    .hsx-trust-row { grid-template-columns: 1fr 1fr; }
    .hsx-hero-picture { min-height: 350px; border-radius: 26px; }
    .hsx-bento { gap: 12px; }
    .hsx-panel { padding: 18px; border-radius: 22px; }
    .hsx-panel-heading { align-items: flex-start; }
    .hsx-category-grid { grid-template-columns: repeat(3,1fr); }
    .hsx-mini-products { grid-template-columns: repeat(2,1fr); }
    .hsx-performance-grid { gap: 11px; }
    .hsx-stat-strip { grid-template-columns: repeat(2,1fr); }
    .hsx-stat-strip article:nth-child(2) { border-inline-end: 0; }
    .hsx-stat-strip article:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.12); }
    .hsx-feature-card { grid-column: span 3; }
    .hsx-distributor-card { min-height: 210px; }
    .hsx-proof-grid { grid-template-columns: 1fr; }
    .hsx-languages { grid-column: auto; }
    .hsx-languages > div { grid-template-columns: repeat(4,1fr); }
    .hsx-final-cta-inner { grid-template-columns: 1fr; padding: 38px 28px; }
    .hsx-final-cta-inner > a { grid-column: auto; }
    .hsx-final-logo { width: 84px; height: 84px; }
}
@media (max-width: 520px) {
    .hsx-badge { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .hsx-hero-copy h1 { font-size: 46px; }
    .hsx-hero-actions { flex-direction: column; align-items: stretch; }
    .hsx-hero-actions .button { width: 100%; }
    .hsx-trust-row { gap: 14px 8px; }
    .hsx-trust-row article { grid-template-columns: 28px 1fr; }
    .hsx-mini-icon { width: 28px; height: 28px; }
    .hsx-hero-picture { min-height: 285px; }
    .hsx-category-grid { grid-template-columns: repeat(2,1fr); }
    .hsx-category-card { min-height: 120px; }
    .hsx-panel-heading { display: block; }
    .hsx-panel-heading > a { margin-top: 10px; }
    .hsx-feature-card { grid-column: 1 / -1; }
    .hsx-languages > div { grid-template-columns: repeat(3,1fr); }
}
@media (prefers-reduced-motion: reduce) {
    .hsx-hero-orb,
    .hsx-leaf,
    .hsx-map-dot { animation: none !important; }
    .hsx-hero-picture img,
    .hsx-category-card img { transition: none !important; }
}