:root{--navy:#06172d;--deep:#071f3d;--blue:#0b66b3;--sea:#04a3df;--red:#ee352f;--ice:#f4f9ff;--line:rgba(255,255,255,.18);--darkline:rgba(6,23,45,.12);--txt:#102033;--muted:#637083;--radius:28px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Manrope,Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;color:var(--txt);background:#fff;overflow-x:hidden}body.rtl{direction:rtl;font-family:'Noto Kufi Arabic','Noto Nastaliq Urdu',Manrope,Arial,sans-serif}.no-scroll{overflow:hidden}a{text-decoration:none;color:inherit}img{max-width:100%;display:block}.container{width:min(1180px,92vw);margin:auto}.nav{position:fixed;inset:18px 0 auto;z-index:1000;transition:.35s}.nav.scrolled{inset:8px 0 auto}.nav-inner{height:76px;width:min(1240px,94vw);margin:auto;display:flex;align-items:center;gap:24px;padding:0 18px 0 14px;border:1px solid var(--line);border-radius:999px;background:rgba(5,20,42,.58);backdrop-filter:blur(22px);box-shadow:0 20px 70px rgba(0,0,0,.24)}.brand{display:flex;align-items:center;gap:12px;min-width:310px;white-space:nowrap}.rtl .brand{flex-direction:row-reverse}.brand img{width:54px;height:54px;object-fit:contain}.brand-title{color:#fff;font-weight:900;letter-spacing:.03em;font-size:15px;line-height:1}.links{margin-inline-start:auto;display:flex;align-items:center;gap:6px}.links a{color:rgba(255,255,255,.86);font-size:13px;font-weight:800;padding:12px 13px;border-radius:999px}.links a:hover,.links a.active{background:rgba(255,255,255,.12);color:#fff}.actions{display:flex;align-items:center;gap:10px}.lang{position:relative}.lang-btn,.hamb{border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.1);color:#fff;border-radius:999px;height:44px;padding:0 14px;font-weight:900;cursor:pointer}.lang-menu{position:absolute;top:54px;right:0;width:210px;border:1px solid rgba(255,255,255,.16);background:rgba(6,23,45,.92);backdrop-filter:blur(24px);border-radius:22px;padding:8px;display:none;box-shadow:0 30px 90px rgba(0,0,0,.35)}.rtl .lang-menu{right:auto;left:0}.lang.open .lang-menu{display:block}.lang-menu button{width:100%;border:0;background:transparent;color:#fff;text-align:start;padding:13px 14px;border-radius:15px;font-weight:900;cursor:pointer}.lang-menu button:hover{background:rgba(255,255,255,.12)}.hamb{display:none;width:46px;padding:0;font-size:20px}.mobile-drawer{position:fixed;inset:0;background:rgba(3,14,29,.96);z-index:999;display:none;padding:108px 24px 30px}.mobile-drawer.open{display:block}.mobile-drawer a{display:block;color:#fff;font-size:26px;font-weight:900;padding:15px 4px;border-bottom:1px solid rgba(255,255,255,.09)}.hero{min-height:100svh;position:relative;display:grid;place-items:center;overflow:hidden;background:#06172d}.hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(4,15,34,.94),rgba(4,15,34,.56),rgba(4,15,34,.8)),url('https://images.unsplash.com/photo-1586528116311-ad8dd3c8310d?auto=format&fit=crop&w=2200&q=80');background-size:cover;background-position:center;transform:scale(1.08);animation:ken 16s ease-in-out infinite alternate}.hero:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 68% 48%,rgba(4,163,223,.26),transparent 34%),radial-gradient(circle at 12% 80%,rgba(238,53,47,.16),transparent 34%)}@keyframes ken{to{transform:scale(1.16) translateX(-1.4%)}}.hero-content{position:relative;z-index:2;width:min(1180px,92vw);padding-top:80px;color:#fff}.eyebrow{display:inline-flex;align-items:center;gap:10px;padding:10px 14px;border:1px solid rgba(255,255,255,.22);border-radius:999px;background:rgba(255,255,255,.08);backdrop-filter:blur(16px);font-size:12px;font-weight:900;letter-spacing:.13em;text-transform:uppercase}.headline{font-size:clamp(48px,8.2vw,116px);line-height:.88;letter-spacing:-.08em;margin:26px 0 22px;font-weight:950;max-width:980px}.sub{font-size:clamp(16px,2vw,22px);line-height:1.7;color:rgba(255,255,255,.78);max-width:740px}.cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;padding:16px 24px;font-weight:950;border:1px solid transparent;transition:.25s}.btn-primary{background:linear-gradient(135deg,var(--sea),var(--blue));color:#fff;box-shadow:0 16px 45px rgba(4,163,223,.32)}.btn-ghost{border-color:rgba(255,255,255,.25);color:#fff;background:rgba(255,255,255,.08)}.btn:hover{transform:translateY(-2px)}.floating-scene{position:absolute;right:6vw;bottom:8vh;width:min(440px,34vw);height:330px;z-index:1;pointer-events:none}.rtl .floating-scene{right:auto;left:6vw}.orb{position:absolute;border-radius:38px;background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(18px);box-shadow:0 30px 90px rgba(0,0,0,.22);animation:float 6s ease-in-out infinite}.orb.one{inset:30px 80px auto auto;width:240px;height:170px;background-image:linear-gradient(rgba(255,255,255,.18),rgba(255,255,255,.08)),url('https://images.unsplash.com/photo-1604719312566-8912e9228c6a?auto=format&fit=crop&w=900&q=80');background-size:cover}.orb.two{left:0;bottom:0;width:190px;height:135px;background-image:linear-gradient(rgba(255,255,255,.12),rgba(255,255,255,.06)),url('https://images.unsplash.com/photo-1542838132-92c53300491e?auto=format&fit=crop&w=900&q=80');background-size:cover;animation-delay:1s}.orb.three{right:0;bottom:45px;width:150px;height:150px;background:linear-gradient(135deg,rgba(238,53,47,.74),rgba(4,163,223,.55));animation-delay:2s}@keyframes float{50%{transform:translateY(-22px) rotate(1deg)}}section{padding:100px 0}.section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:42px}.kicker{color:var(--blue);font-weight:950;letter-spacing:.12em;text-transform:uppercase;font-size:12px}.title{font-size:clamp(34px,5vw,72px);line-height:.95;letter-spacing:-.06em;margin:12px 0;font-weight:950}.lead{color:var(--muted);line-height:1.8;font-size:17px;max-width:650px}.dark{background:linear-gradient(180deg,#06172d,#092849);color:#fff}.dark .lead{color:rgba(255,255,255,.7)}.dark .kicker{color:#5ed8ff}.category-wrap{overflow:hidden}.cat-track{display:flex;gap:22px;will-change:transform;touch-action:pan-y;cursor:grab}.cat-card{flex:0 0 430px;height:560px;border-radius:36px;overflow:hidden;position:relative;background:#123;color:#fff;box-shadow:0 35px 90px rgba(6,23,45,.18);transform:translateZ(0);transition:.35s}.cat-card:hover{transform:translateY(-12px) scale(1.015)}.cat-card img{width:100%;height:100%;object-fit:cover;filter:saturate(1.02)}.cat-card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(3,13,28,.92))}.cat-card .cap{position:absolute;z-index:2;left:28px;right:28px;bottom:28px}.rtl .cat-card .cap{text-align:right}.cat-card h3{font-size:30px;line-height:1.05;margin:0 0 10px}.cat-card p{color:rgba(255,255,255,.78);line-height:1.6;margin:0}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:-45px;position:relative;z-index:5}.stat{background:rgba(255,255,255,.86);backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,.7);border-radius:28px;padding:28px;box-shadow:0 24px 70px rgba(6,23,45,.13)}.stat strong{font-size:46px;color:var(--blue);letter-spacing:-.05em}.stat span{display:block;color:var(--muted);font-weight:900}.about-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:48px;align-items:center}.photo-stack{height:650px;border-radius:42px;overflow:hidden;position:relative;background:url('https://images.unsplash.com/photo-1553413077-190dd305871c?auto=format&fit=crop&w=1400&q=80') center/cover;box-shadow:0 35px 90px rgba(6,23,45,.18)}.photo-stack:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(6,23,45,.35))}.glass-note{position:absolute;left:28px;right:28px;bottom:28px;color:#fff;background:rgba(255,255,255,.12);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.22);border-radius:28px;padding:22px}.brand-marquee{overflow:hidden;border:1px solid var(--darkline);border-radius:34px;background:linear-gradient(180deg,#fff,#f6fbff);padding:18px}.brand-track{display:flex;gap:14px;width:max-content;animation:marquee 24s linear infinite}.brand-pill{min-width:170px;height:86px;border-radius:24px;display:grid;place-items:center;background:#fff;border:1px solid var(--darkline);font-weight:950;color:var(--deep);box-shadow:0 18px 45px rgba(6,23,45,.07)}.brand-pill[data-off="true"]{display:none}.brand-pill:hover{transform:scale(1.06)}@keyframes marquee{to{transform:translateX(-50%)}}.rtl .brand-track{animation-name:marqueeR}@keyframes marqueeR{to{transform:translateX(50%)}}.dist-map{height:560px;border-radius:42px;position:relative;overflow:hidden;background:linear-gradient(135deg,#071a35,#0f4c81);box-shadow:0 35px 90px rgba(6,23,45,.18)}.dist-map:before{content:"";position:absolute;inset:0;background:url('https://images.unsplash.com/photo-1519003722824-194d4455a60c?auto=format&fit=crop&w=1600&q=80') center/cover;opacity:.32}.route{position:absolute;inset:0}.node{position:absolute;color:#fff;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(16px);border-radius:999px;padding:13px 18px;font-weight:950}.node.n1{left:18%;top:22%}.node.n2{left:46%;top:44%}.node.n3{left:66%;top:24%}.node.n4{left:72%;top:68%}.truck{position:absolute;left:18%;top:43%;font-size:38px;animation:drive 9s ease-in-out infinite}@keyframes drive{50%{left:68%;top:54%;transform:rotate(6deg)}100%{left:18%;top:43%}}.gallery-grid{columns:3 280px;column-gap:18px}.gallery-grid img{width:100%;margin:0 0 18px;border-radius:28px;box-shadow:0 20px 60px rgba(6,23,45,.12)}.form-card{background:#fff;border:1px solid var(--darkline);border-radius:36px;padding:32px;box-shadow:0 28px 80px rgba(6,23,45,.1)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-card input,.form-card select,.form-card textarea{width:100%;border:1px solid var(--darkline);border-radius:18px;padding:15px 16px;font:inherit}.form-card textarea{min-height:120px;grid-column:1/-1}.footer{background:#041225;color:#fff;padding:46px 0 24px}.footer-top{display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid rgba(255,255,255,.12);padding-bottom:26px}.footer-brand{display:flex;align-items:center;gap:12px;white-space:nowrap}.rtl .footer-brand{flex-direction:row-reverse}.footer-brand img{width:48px}.footer-links{display:flex;gap:16px;flex-wrap:wrap;color:rgba(255,255,255,.74);font-size:13px}.copyright{display:flex;justify-content:space-between;gap:20px;padding-top:20px;color:rgba(255,255,255,.6);font-size:13px}.page-hero{min-height:62svh;display:grid;place-items:end;padding:150px 0 70px;background:linear-gradient(90deg,rgba(4,18,37,.94),rgba(4,18,37,.55)),url('https://images.unsplash.com/photo-1542838132-92c53300491e?auto=format&fit=crop&w=1800&q=80') center/cover;color:#fff}.admin-login{min-height:100svh;display:grid;place-items:center;background:#06172d}.admin-box{width:min(460px,92vw);background:#fff;border-radius:32px;padding:32px}.admin-panel{display:none}.phone-link{pointer-events:none;color:inherit}.map iframe{width:100%;border-radius:30px}.wa-disabled{display:none!important}@media(max-width:1040px){.links{display:none}.hamb{display:block}.nav-inner{height:68px}.brand{min-width:0;flex:1}.brand-title{font-size:13px;max-width:calc(100vw - 220px);overflow:hidden;text-overflow:ellipsis}.headline{font-size:clamp(43px,13vw,80px)}.floating-scene{display:none}.stats{grid-template-columns:repeat(2,1fr);margin-top:0}.about-grid{grid-template-columns:1fr}.photo-stack{height:480px}.section-head{display:block}.cat-card{flex-basis:78vw;height:480px}.brand-pill{min-width:138px;height:72px;font-size:13px}.nav{inset:10px 0 auto}.form-grid{grid-template-columns:1fr}.footer-top,.copyright{display:block}.footer-links{margin-top:18px}.hero-content{padding-top:110px}.dist-map{height:420px}}@media(max-width:560px){section{padding:70px 0}.brand img{width:44px;height:44px}.brand-title{font-size:11px;letter-spacing:.015em;max-width:42vw}.nav-inner{padding:0 10px;height:62px;gap:8px}.lang-btn{height:40px;padding:0 10px}.hamb{height:40px;width:40px}.cat-card{flex-basis:82vw;height:430px;border-radius:28px}.cat-card h3{font-size:24px}.stats{grid-template-columns:1fr}.stat strong{font-size:38px}.photo-stack{height:390px}.title{font-size:40px}.sub{font-size:15px}.cta-row .btn{width:100%}.hero{min-height:92svh}.brand-marquee{padding:12px;border-radius:26px}.brand-track{animation-duration:18s}.dist-map{height:360px}.node{font-size:11px;padding:10px 12px}.footer-brand span{font-size:12px}}

/* V9 hero floating business terms + admin controlled brand ticker */
.hero-float-tags{position:absolute;z-index:3;inset:0;pointer-events:none;width:min(1240px,94vw);margin:auto;left:0;right:0;top:0;bottom:0}.hero-tag{position:absolute;display:inline-flex;align-items:center;justify-content:center;min-width:138px;height:54px;padding:0 22px;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:linear-gradient(135deg,rgba(255,255,255,.18),rgba(255,255,255,.06));backdrop-filter:blur(18px);color:#fff;font-size:13px;font-weight:950;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 26px 80px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.18);animation:tagFloat 7s ease-in-out infinite}.tag-product{right:31%;top:28%;animation-delay:.1s}.tag-distribution{right:7%;top:42%;animation-delay:1.1s}.tag-supply{right:22%;bottom:24%;animation-delay:2.2s}.tag-brand{right:5%;bottom:13%;animation-delay:3.1s}.rtl .tag-product{right:auto;left:31%}.rtl .tag-distribution{right:auto;left:7%}.rtl .tag-supply{right:auto;left:22%}.rtl .tag-brand{right:auto;left:5%}@keyframes tagFloat{50%{transform:translateY(-16px) translateX(8px)}}.hero-brand-ticker{position:absolute;z-index:5;left:0;right:0;bottom:0;height:82px;display:flex;align-items:center;gap:18px;padding:0 max(4vw,22px);border-top:1px solid rgba(255,255,255,.16);background:linear-gradient(90deg,rgba(4,14,30,.72),rgba(7,31,61,.44));backdrop-filter:blur(22px);color:#fff;overflow:hidden}.hero-ticker-label{flex:0 0 auto;font-size:12px;font-weight:950;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.68);white-space:nowrap}.hero-ticker-viewport{position:relative;overflow:hidden;flex:1;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}.hero-brand-track{display:flex;align-items:center;gap:12px;width:max-content;animation:heroTicker 26s linear infinite}.rtl .hero-brand-track{animation-name:heroTickerR}.hero-brand-item{flex:0 0 auto;min-width:132px;height:44px;padding:0 18px;border-radius:999px;border:1px solid rgba(255,255,255,.19);background:rgba(255,255,255,.1);display:inline-flex;align-items:center;justify-content:center;font-weight:950;font-size:13px;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.15)}.hero-brand-item.logo{min-width:82px;width:82px;padding:7px;border-radius:20px;background:#fff}.hero-brand-item.logo img{max-height:30px;max-width:68px;object-fit:contain}.brand-pill.logo-pill img{max-height:42px;max-width:120px;object-fit:contain}.brand-pill.logo-pill{background:#fff}.hero-brand-ticker[hidden]{display:none!important}@keyframes heroTicker{to{transform:translateX(-50%)}}@keyframes heroTickerR{to{transform:translateX(50%)}}.admin-toolbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:24px 0}.admin-control{border:1px solid var(--darkline);border-radius:22px;padding:18px;background:#fff}.admin-brand-row{display:grid;grid-template-columns:1.2fr .8fr .7fr 1.2fr;gap:10px;align-items:center;border-top:1px solid var(--darkline);padding:12px 0}.admin-brand-row input[type=text],.admin-control select{width:100%;border:1px solid var(--darkline);border-radius:14px;padding:11px}.admin-save-note{padding:14px 18px;border-radius:18px;background:#ecf8ff;color:#0b4e83;font-weight:800}@media(max-width:1040px){.hero-float-tags{display:none}.hero-brand-ticker{height:70px;padding:0 18px;gap:12px}.hero-ticker-label{font-size:10px}.hero-brand-item{min-width:112px;height:39px;font-size:12px}.hero-brand-item.logo{width:72px;min-width:72px;height:42px}.admin-toolbar,.admin-brand-row{grid-template-columns:1fr}}@media(max-width:560px){.hero-brand-ticker{height:66px;padding:0 12px}.hero-ticker-label{display:none}.hero-ticker-viewport{mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}.hero-brand-track{gap:9px;animation-duration:18s}.hero-brand-item{min-width:104px;height:38px;font-size:11px;padding:0 13px}.hero-brand-item.logo{width:66px;min-width:66px;height:40px;border-radius:16px}.hero-brand-item.logo img{max-width:54px;max-height:26px}}

/* V10 refined hero: cleaner luxury composition */
.nav{inset:20px 0 auto}.nav-inner{width:min(1180px,92vw);height:70px;gap:18px;padding:0 16px;border-radius:26px;background:rgba(7,21,42,.72)}.brand{min-width:360px}.brand-title{font-size:14px;letter-spacing:.01em}.links{gap:2px}.links a{font-size:12.5px;padding:10px 11px}.hero{min-height:92svh;place-items:start center;padding-top:120px}.hero:before{background-image:linear-gradient(90deg,rgba(4,15,34,.93) 0%,rgba(4,15,34,.74) 42%,rgba(4,15,34,.34) 100%),url('https://images.unsplash.com/photo-1586528116311-ad8dd3c8310d?auto=format&fit=crop&w=2200&q=80');filter:saturate(.92) contrast(1.03)}.hero-content{width:min(1180px,92vw);padding-top:30px}.eyebrow{font-size:11px;padding:9px 13px;background:rgba(255,255,255,.1)}.headline{font-size:clamp(52px,6.2vw,86px);max-width:780px;line-height:.94;letter-spacing:-.065em;margin:22px 0 18px;text-shadow:0 20px 70px rgba(0,0,0,.35)}.sub{max-width:650px;font-size:clamp(16px,1.4vw,20px);line-height:1.65;color:rgba(255,255,255,.8)}.cta-row{margin-top:28px}.floating-scene{right:7vw;bottom:18vh;width:min(410px,30vw);height:315px;z-index:2}.orb{border-radius:34px;opacity:.9}.orb.one{width:230px;height:150px;right:28px;top:14px}.orb.two{width:170px;height:116px;left:20px;bottom:18px}.orb.three{width:118px;height:118px;right:0;bottom:52px;opacity:.72}.hero-float-tags{z-index:4;width:min(1180px,92vw)}.hero-tag{min-width:auto;height:44px;padding:0 18px;font-size:11px;letter-spacing:.09em;background:rgba(7,21,42,.44);box-shadow:0 18px 45px rgba(0,0,0,.22)}.tag-product{right:30%;top:24%}.tag-distribution{right:5%;top:38%}.tag-supply{right:18%;bottom:30%}.tag-brand{right:4%;bottom:21%}.hero-brand-ticker{height:58px;bottom:0;background:rgba(4,14,30,.82);border-top:1px solid rgba(255,255,255,.12)}.hero-brand-item{height:34px;min-width:118px;font-size:11px;background:rgba(255,255,255,.09)}.hero-ticker-label{font-size:10px}.stats{width:min(980px,88vw);grid-template-columns:repeat(4,1fr);margin-top:-30px}.stat{border-radius:22px;padding:22px 26px}.stat strong{font-size:38px}.stat span{font-size:13px}.rtl .floating-scene{right:auto;left:7vw}.rtl .tag-product{right:auto;left:30%}.rtl .tag-distribution{right:auto;left:5%}.rtl .tag-supply{right:auto;left:18%}.rtl .tag-brand{right:auto;left:4%}
@media(max-width:1120px){.brand{min-width:300px}.brand-title{font-size:12px}.links a{padding:9px 8px}.floating-scene{opacity:.75;width:32vw}.headline{max-width:690px}}
@media(max-width:1040px){.nav-inner{width:min(94vw,780px);border-radius:22px}.hero{min-height:92svh;padding-top:100px}.hero-content{text-align:left}.rtl .hero-content{text-align:right}.headline{font-size:clamp(42px,10vw,68px);max-width:760px}.sub{max-width:92vw}.stats{grid-template-columns:repeat(2,1fr);margin-top:24px}.floating-scene{display:none}.hero-float-tags{display:block;top:auto;bottom:92px;height:70px;pointer-events:none}.hero-tag{position:relative;inset:auto!important;margin:0 5px 8px;height:36px;padding:0 12px;font-size:10px}.hero-float-tags{display:flex;align-items:center;justify-content:center;flex-wrap:wrap}.links{display:none}.hamb{display:block}.brand{min-width:0;flex:1}.brand-title{max-width:calc(100vw - 210px);font-size:12px}}
@media(max-width:560px){.nav{inset:10px 0 auto}.nav-inner{height:62px;width:94vw;border-radius:20px}.hero{min-height:86svh;padding-top:94px}.hero-content{padding-top:16px}.headline{font-size:clamp(38px,12vw,56px);line-height:.98;letter-spacing:-.055em}.sub{font-size:14.5px;line-height:1.65}.eyebrow{font-size:9px;letter-spacing:.08em}.hero-float-tags{bottom:76px;height:58px;overflow:hidden}.hero-tag{height:31px;font-size:9px;padding:0 10px}.hero-brand-ticker{height:54px}.stats{grid-template-columns:repeat(2,1fr);gap:10px;width:92vw}.stat{padding:16px;border-radius:18px}.stat strong{font-size:30px}.stat span{font-size:11px}.brand-title{max-width:40vw;font-size:10px}.hero-brand-item{min-width:98px;height:32px;font-size:10.5px}.cta-row .btn{width:auto;min-width:155px;padding:14px 18px}.cta-row{gap:10px}}

/* === V11 senior-design cleanup: cinematic but balanced hero === */
.nav{inset:22px 0 auto!important}.nav-inner{height:72px!important;width:min(1180px,92vw)!important;border-radius:28px!important;background:rgba(6,17,34,.78)!important;box-shadow:0 22px 70px rgba(0,0,0,.28)!important}.brand{min-width:365px!important;gap:12px!important}.brand-title{font-size:14px!important;letter-spacing:.01em!important}.rtl .brand{flex-direction:row!important}.links a{font-size:12.5px!important;padding:10px 10px!important}.hero{min-height:900px!important;height:100svh!important;max-height:980px!important;place-items:center!important;padding-top:0!important}.hero:before{background-image:linear-gradient(90deg,rgba(4,12,26,.96) 0%,rgba(4,14,30,.86) 35%,rgba(4,17,36,.44) 68%,rgba(4,14,30,.72) 100%),url('https://images.unsplash.com/photo-1586528116311-ad8dd3c8310d?auto=format&fit=crop&w=2400&q=82')!important;filter:saturate(.85) contrast(1.08) brightness(.78)!important}.hero-content{padding-top:34px!important;padding-bottom:112px!important;z-index:6!important}.headline{font-size:clamp(56px,5.8vw,92px)!important;line-height:.94!important;letter-spacing:-.06em!important;max-width:760px!important;margin:22px 0 20px!important;text-shadow:0 28px 80px rgba(0,0,0,.42)!important}.sub{font-size:clamp(16px,1.35vw,19px)!important;max-width:680px!important;color:rgba(255,255,255,.82)!important}.eyebrow{font-size:11px!important;background:rgba(255,255,255,.09)!important}.floating-scene{display:none!important}.hero-float-tags{display:block!important;z-index:5!important;width:min(1180px,92vw)!important;pointer-events:none!important}.hero-tag{height:42px!important;min-width:0!important;padding:0 18px!important;border-radius:999px!important;background:rgba(7,21,42,.52)!important;border:1px solid rgba(255,255,255,.20)!important;backdrop-filter:blur(18px)!important;box-shadow:0 20px 60px rgba(0,0,0,.25)!important;font-size:10.5px!important;letter-spacing:.1em!important;animation:tagFloatClean 7.5s ease-in-out infinite!important}.tag-product{right:21%!important;top:28%!important}.tag-distribution{right:8%!important;top:42%!important}.tag-supply{right:18%!important;bottom:31%!important}.tag-brand{right:7%!important;bottom:22%!important}.rtl .tag-product{right:auto!important;left:21%!important}.rtl .tag-distribution{right:auto!important;left:8%!important}.rtl .tag-supply{right:auto!important;left:18%!important}.rtl .tag-brand{right:auto!important;left:7%!important}@keyframes tagFloatClean{50%{transform:translateY(-10px)}}.hero-brand-ticker{height:56px!important;bottom:0!important;background:rgba(3,11,24,.88)!important;border-top:1px solid rgba(255,255,255,.13)!important;box-shadow:0 -18px 50px rgba(0,0,0,.22)!important;padding-inline:max(4vw,28px)!important}.hero-ticker-label{font-size:10px!important;color:rgba(255,255,255,.70)!important;letter-spacing:.14em!important}.hero-brand-track{animation-duration:22s!important}.hero-brand-item{height:32px!important;min-width:116px!important;padding:0 16px!important;background:rgba(255,255,255,.085)!important;border-color:rgba(255,255,255,.16)!important;font-size:10.5px!important;box-shadow:none!important}.hero-brand-item.logo{height:38px!important;width:76px!important;min-width:76px!important;background:#fff!important}.stats{width:min(980px,88vw)!important;margin-top:36px!important;z-index:4!important}.stat{background:#fff!important;border-color:rgba(6,23,45,.08)!important;border-radius:24px!important;padding:24px 26px!important;box-shadow:0 22px 60px rgba(6,23,45,.10)!important}.stat strong{font-size:38px!important}.stat span{font-size:13px!important}.brand-marquee,.category-wrap{scrollbar-width:none}.cat-track{touch-action:pan-x!important;user-select:none}.cat-card{box-shadow:0 30px 80px rgba(6,23,45,.15)!important}
@media(max-width:1120px){.brand{min-width:300px!important}.brand-title{font-size:12px!important}.links a{padding:9px 8px!important}.headline{max-width:700px!important}.hero-tag{display:none!important}}
@media(max-width:1040px){.links{display:none!important}.hamb{display:block!important}.nav{inset:10px 0 auto!important}.nav-inner{width:94vw!important;height:66px!important;border-radius:22px!important}.brand{min-width:0!important;flex:1!important}.brand-title{max-width:calc(100vw - 210px)!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.hero{min-height:840px!important;height:auto!important;max-height:none!important;padding-top:92px!important;place-items:start center!important}.hero-content{padding-top:36px!important;padding-bottom:124px!important}.headline{font-size:clamp(42px,10vw,72px)!important;max-width:760px!important}.sub{max-width:92vw!important}.hero-float-tags{display:none!important}.stats{grid-template-columns:repeat(2,1fr)!important;margin-top:26px!important}.hero-brand-ticker{height:60px!important}.hero-ticker-label{display:none!important}}
@media(max-width:560px){.nav-inner{height:62px!important;border-radius:20px!important;padding:0 10px!important}.brand img{width:44px!important;height:44px!important}.brand-title{max-width:44vw!important;font-size:10px!important;letter-spacing:0!important}.lang-btn,.hamb{height:40px!important}.hero{min-height:790px!important;padding-top:82px!important}.hero-content{padding-top:26px!important;padding-bottom:112px!important}.eyebrow{font-size:9px!important;letter-spacing:.08em!important}.headline{font-size:clamp(39px,12vw,56px)!important;line-height:.98!important;letter-spacing:-.052em!important;margin:18px 0 16px!important}.sub{font-size:14.5px!important;line-height:1.65!important}.cta-row{gap:10px!important}.cta-row .btn{width:100%!important;min-width:0!important;padding:14px 18px!important}.hero-brand-ticker{height:56px!important;padding-inline:12px!important}.hero-brand-track{gap:8px!important;animation-duration:16s!important}.hero-brand-item{height:32px!important;min-width:96px!important;font-size:10px!important;padding:0 12px!important}.stats{grid-template-columns:repeat(2,1fr)!important;gap:10px!important;width:92vw!important;margin-top:20px!important}.stat{padding:16px!important;border-radius:18px!important}.stat strong{font-size:30px!important}.stat span{font-size:11px!important}.cat-track{overflow:visible!important}.cat-card{flex-basis:82vw!important;height:430px!important}}


/* === V12: glass stats integrated inside hero with animated counters === */
.hero-content{padding-bottom:210px!important}
.hero-glass-stats{position:absolute;left:50%;bottom:72px;transform:translateX(-50%);z-index:8;width:min(1080px,88vw);display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:14px;border-radius:34px;background:linear-gradient(135deg,rgba(255,255,255,.18),rgba(255,255,255,.07));border:1px solid rgba(255,255,255,.25);box-shadow:0 30px 100px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.22);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.hero-glass-stats .stat{background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.76))!important;border:1px solid rgba(255,255,255,.56)!important;border-radius:24px!important;padding:22px 24px!important;box-shadow:0 18px 55px rgba(0,0,0,.15)!important;min-height:112px;display:flex;flex-direction:column;justify-content:center;transform:translateY(14px);opacity:0;animation:statRise .85s cubic-bezier(.2,.8,.2,1) forwards}
.hero-glass-stats .stat:nth-child(2){animation-delay:.08s}.hero-glass-stats .stat:nth-child(3){animation-delay:.16s}.hero-glass-stats .stat:nth-child(4){animation-delay:.24s}
.hero-glass-stats .stat strong{font-size:clamp(34px,3.1vw,50px)!important;line-height:1;color:#0b66b3!important;letter-spacing:-.055em;font-weight:950}
.hero-glass-stats .stat span{margin-top:8px;color:#31445d!important;font-size:13px!important;font-weight:950}
@keyframes statRise{to{transform:translateY(0);opacity:1}}
.hero-brand-ticker{bottom:0!important}.stats{display:none!important}
@media(max-width:1040px){.hero-content{padding-bottom:230px!important}.hero-glass-stats{bottom:70px;width:92vw;grid-template-columns:repeat(4, minmax(122px,1fr));overflow-x:auto;gap:10px;padding:10px;scroll-snap-type:x mandatory;scrollbar-width:none}.hero-glass-stats::-webkit-scrollbar{display:none}.hero-glass-stats .stat{min-width:122px;min-height:92px;padding:16px!important;border-radius:20px!important;scroll-snap-align:center}.hero-glass-stats .stat strong{font-size:32px!important}.hero-glass-stats .stat span{font-size:11px!important}}
@media(max-width:560px){.hero{min-height:860px!important}.hero-content{padding-bottom:240px!important}.hero-glass-stats{bottom:68px;grid-template-columns:repeat(4, minmax(132px,1fr));justify-content:start}.hero-glass-stats .stat{min-width:132px}.hero-brand-ticker{height:50px!important}.hero-brand-item{height:30px!important}}


/* V13 cleanup requested by client */
.hero .eyebrow,
.hero-float-tags,
.hero-tag,
.floating-scene,
.orb{display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important;}
.hero-content{padding-top:120px!important;}
.hero-glass-stats{background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.045))!important;border:1px solid rgba(255,255,255,.28)!important;box-shadow:0 30px 100px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.24)!important;backdrop-filter:blur(28px) saturate(1.25)!important;-webkit-backdrop-filter:blur(28px) saturate(1.25)!important;}
.hero-glass-stats .stat{background:linear-gradient(145deg,rgba(255,255,255,.18),rgba(255,255,255,.055))!important;border:1px solid rgba(255,255,255,.30)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 18px 55px rgba(0,0,0,.18)!important;backdrop-filter:blur(20px) saturate(1.35)!important;-webkit-backdrop-filter:blur(20px) saturate(1.35)!important;}
.hero-glass-stats .stat strong{color:#fff!important;text-shadow:0 10px 34px rgba(4,163,223,.35)!important;}
.hero-glass-stats .stat span{color:rgba(255,255,255,.78)!important;}
@media(max-width:1040px){.hero-content{padding-top:115px!important;padding-bottom:230px!important}}
@media(max-width:560px){.hero-content{padding-top:92px!important;padding-bottom:240px!important}.hero-glass-stats{background:linear-gradient(135deg,rgba(255,255,255,.15),rgba(255,255,255,.05))!important}.hero-glass-stats .stat{background:rgba(255,255,255,.11)!important}}

/* V14: feature cards always visible on landing + mobile 2x2 grid */
.hero{
  min-height:100svh!important;
  height:100svh!important;
  max-height:none!important;
  overflow:hidden!important;
  display:grid!important;
  align-items:center!important;
}
.hero-content{
  padding-top:96px!important;
  padding-bottom:190px!important;
  transform:translateY(-8px);
}
.headline{
  font-size:clamp(48px,5.2vw,82px)!important;
  line-height:.95!important;
  max-width:760px!important;
  margin:18px 0 18px!important;
}
.sub{font-size:clamp(15px,1.2vw,18px)!important;max-width:650px!important;line-height:1.65!important}
.hero-glass-stats{
  bottom:62px!important;
  width:min(1000px,86vw)!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  overflow:visible!important;
  padding:12px!important;
  gap:12px!important;
  border-radius:30px!important;
}
.hero-glass-stats .stat{
  min-width:0!important;
  min-height:96px!important;
  padding:18px 20px!important;
  border-radius:22px!important;
}
.hero-glass-stats .stat strong{font-size:clamp(30px,2.8vw,44px)!important}
.hero-glass-stats .stat span{font-size:12px!important;margin-top:7px!important}
.hero-brand-ticker{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  bottom:0!important;
  height:48px!important;
  z-index:9!important;
}
.hero-ticker-label{display:flex!important;white-space:nowrap!important}

@media(max-height:760px) and (min-width:900px){
  .nav-inner{height:64px!important}.brand img{width:46px!important;height:46px!important}.brand-title{font-size:13px!important}.links a{font-size:11.5px!important;padding:9px 8px!important}
  .hero-content{padding-top:92px!important;padding-bottom:160px!important;transform:translateY(-4px)}
  .headline{font-size:clamp(44px,4.7vw,70px)!important;margin:12px 0!important}
  .sub{font-size:15px!important;line-height:1.55!important;max-width:600px!important}
  .cta-row .btn{padding:13px 20px!important}
  .hero-glass-stats{bottom:54px!important;width:min(920px,84vw)!important}
  .hero-glass-stats .stat{min-height:82px!important;padding:14px 18px!important}
  .hero-glass-stats .stat strong{font-size:32px!important}.hero-glass-stats .stat span{font-size:11px!important}
  .hero-brand-ticker{height:44px!important}
}

@media(max-width:1040px){
  .hero{min-height:100svh!important;height:100svh!important;padding-top:0!important;align-items:center!important;}
  .hero-content{padding-top:84px!important;padding-bottom:250px!important;transform:none!important;}
  .hero-glass-stats{
    bottom:58px!important;
    width:92vw!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
    padding:10px!important;
    gap:10px!important;
    border-radius:24px!important;
  }
  .hero-glass-stats .stat{
    min-width:0!important;
    min-height:82px!important;
    padding:14px 16px!important;
    border-radius:18px!important;
    scroll-snap-align:unset!important;
  }
  .hero-glass-stats .stat strong{font-size:30px!important;letter-spacing:-.04em!important}
  .hero-glass-stats .stat span{font-size:10.5px!important;margin-top:5px!important}
  .hero-brand-ticker{height:48px!important;bottom:0!important;padding-inline:14px!important}
  .hero-ticker-label{display:none!important}
}

@media(max-width:560px){
  .hero{min-height:100svh!important;height:100svh!important;padding-top:0!important;}
  .hero-content{padding-top:72px!important;padding-bottom:225px!important;}
  .headline{font-size:clamp(32px,10.2vw,43px)!important;line-height:1.02!important;margin:12px 0 12px!important;max-width:94vw!important;letter-spacing:-.045em!important}
  .sub{font-size:12.8px!important;line-height:1.5!important;max-width:92vw!important;display:block!important}
  .cta-row{gap:8px!important;margin-top:14px!important}.cta-row .btn{padding:12px 14px!important;font-size:12px!important;width:auto!important;flex:1!important}
  .hero-glass-stats{
    bottom:48px!important;
    width:92vw!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    padding:8px!important;
    gap:8px!important;
    border-radius:22px!important;
  }
  .hero-glass-stats .stat{
    min-width:0!important;
    min-height:70px!important;
    padding:11px 12px!important;
    border-radius:16px!important;
  }
  .hero-glass-stats .stat strong{font-size:25px!important;line-height:1!important}
  .hero-glass-stats .stat span{font-size:9.5px!important;margin-top:4px!important}
  .hero-brand-ticker{height:42px!important;bottom:0!important;padding-inline:10px!important}
  .hero-brand-track{gap:7px!important;animation-duration:15s!important}
  .hero-brand-item{height:28px!important;min-width:82px!important;font-size:9px!important;padding:0 10px!important;border-radius:999px!important}
}

@media(max-width:380px), (max-height:700px) and (max-width:560px){
  .hero-content{padding-top:70px!important;padding-bottom:202px!important;}
  .headline{font-size:clamp(28px,9.5vw,36px)!important;margin:8px 0!important}
  .sub{font-size:11.5px!important;line-height:1.42!important;max-width:90vw!important}
  .cta-row{margin-top:10px!important}.cta-row .btn{padding:10px 10px!important;font-size:11px!important}
  .hero-glass-stats{bottom:44px!important;gap:7px!important;padding:7px!important}
  .hero-glass-stats .stat{min-height:60px!important;padding:9px 10px!important;border-radius:14px!important}
  .hero-glass-stats .stat strong{font-size:22px!important}.hero-glass-stats .stat span{font-size:8.5px!important}
  .hero-brand-ticker{height:38px!important}.hero-brand-item{height:25px!important;min-width:74px!important;font-size:8px!important}
}


/* V19 final tuning: smoother ticker, larger hero text, bigger ticker labels, stats slightly higher */
.hero-brand-track{
  will-change:transform!important;
  transform:translate3d(0,0,0);
  backface-visibility:hidden!important;
  -webkit-backface-visibility:hidden!important;
  animation-timing-function:linear!important;
}
.hero-ticker-viewport{
  transform:translateZ(0);
  backface-visibility:hidden!important;
  contain:paint;
}
.hero-brand-item{
  font-size:12px!important;
  min-width:126px!important;
  height:34px!important;
  padding:0 18px!important;
  letter-spacing:.01em!important;
}
.hero-ticker-label{font-size:11px!important;letter-spacing:.15em!important}
@keyframes heroTicker{from{transform:translate3d(0,0,0)}to{transform:translate3d(-33.333333%,0,0)}}
@keyframes heroTickerR{from{transform:translate3d(0,0,0)}to{transform:translate3d(33.333333%,0,0)}}
.headline{font-size:clamp(54px,5.65vw,92px)!important;line-height:.94!important}
.sub{font-size:clamp(16.5px,1.42vw,20.5px)!important;line-height:1.68!important}
.hero-content{transform:translateY(-14px)!important}
.hero-glass-stats{bottom:78px!important}
.hero-brand-ticker{height:52px!important}
@media(max-height:760px) and (min-width:900px){
  .headline{font-size:clamp(48px,5vw,76px)!important}
  .sub{font-size:16px!important}
  .hero-content{transform:translateY(-10px)!important;padding-bottom:172px!important}
  .hero-glass-stats{bottom:66px!important}
  .hero-brand-ticker{height:48px!important}
  .hero-brand-item{font-size:11px!important;min-width:118px!important;height:32px!important}
}
@media(max-width:1040px){
  .hero-content{transform:translateY(-8px)!important;padding-bottom:265px!important}
  .headline{font-size:clamp(38px,10.8vw,58px)!important;line-height:1.01!important}
  .sub{font-size:13.6px!important;line-height:1.55!important}
  .hero-glass-stats{bottom:64px!important}
  .hero-brand-ticker{height:48px!important}
  .hero-brand-item{font-size:10.4px!important;min-width:98px!important;height:30px!important;padding:0 13px!important}
}
@media(max-width:560px){
  .hero-content{padding-top:72px!important;padding-bottom:235px!important;transform:translateY(-6px)!important}
  .headline{font-size:clamp(34px,10.8vw,46px)!important;line-height:1.0!important;margin:11px 0 11px!important}
  .sub{font-size:13.2px!important;line-height:1.52!important;max-width:93vw!important}
  .hero-glass-stats{bottom:54px!important}
  .hero-brand-ticker{height:44px!important}
  .hero-brand-track{will-change:transform!important}
  .hero-brand-item{height:29px!important;min-width:90px!important;font-size:9.6px!important;padding:0 11px!important}
}
@media(max-width:380px), (max-height:700px) and (max-width:560px){
  .hero-content{padding-top:68px!important;padding-bottom:210px!important;transform:translateY(-4px)!important}
  .headline{font-size:clamp(30px,10vw,38px)!important;line-height:1.02!important}
  .sub{font-size:12px!important;line-height:1.45!important}
  .hero-glass-stats{bottom:48px!important}
  .hero-brand-ticker{height:40px!important}
  .hero-brand-item{height:26px!important;min-width:80px!important;font-size:8.7px!important;padding:0 10px!important}
}

/* V21: premium cinematic landing upgrade */
.hero{isolation:isolate}
.hero:after{z-index:0}
.hero:before{filter:saturate(1.05) contrast(1.04)}
.hero-content{z-index:5!important}
.hero-proof-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;max-width:720px}
.hero-proof-row span{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.17);color:rgba(255,255,255,.86);font-size:12px;font-weight:900;letter-spacing:.02em;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.hero-proof-row span:before{content:"";width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,var(--sea),#fff);box-shadow:0 0 16px rgba(4,163,223,.75)}
.supply-orbit{position:absolute;right:7vw;top:21vh;width:min(420px,31vw);height:390px;z-index:3;pointer-events:none;transform-style:preserve-3d;animation:orbitScene 7s ease-in-out infinite}
.rtl .supply-orbit{right:auto;left:7vw}
@keyframes orbitScene{50%{transform:translateY(-10px)}}
.orbit-glow{position:absolute;inset:8%;border-radius:50%;background:radial-gradient(circle,rgba(4,163,223,.22),rgba(255,74,61,.10) 42%,transparent 70%);filter:blur(4px)}
.orbit-globe{position:absolute;left:50%;top:50%;width:220px;height:220px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.28),rgba(4,163,223,.32) 28%,rgba(7,31,61,.24) 66%,rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.26);box-shadow:inset 0 0 40px rgba(255,255,255,.12),0 30px 100px rgba(0,0,0,.34);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);overflow:hidden}
.orbit-globe:before,.orbit-globe:after,.orbit-globe i{content:"";position:absolute;inset:22px;border:2px solid rgba(255,255,255,.32);border-left-color:transparent;border-right-color:transparent;border-radius:50%;animation:spinLine 8s linear infinite}
.orbit-globe:after{inset:50px 20px;transform:rotate(90deg);animation-duration:12s}.orbit-globe i:nth-child(1){inset:18px 64px}.orbit-globe i:nth-child(2){inset:64px 18px;transform:rotate(90deg)}.orbit-globe i:nth-child(3){inset:4px;border-color:rgba(255,255,255,.12);animation:none}
@keyframes spinLine{to{transform:rotate(360deg)}}
.route-dot{position:absolute;width:10px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 0 7px rgba(4,163,223,.16),0 0 24px rgba(4,163,223,.95)}
.d1{left:55px;top:72px;animation:pulseDot 1.9s ease-in-out infinite}.d2{right:52px;top:110px;animation:pulseDot 1.9s ease-in-out infinite .45s}.d3{left:100px;bottom:50px;animation:pulseDot 1.9s ease-in-out infinite .9s}@keyframes pulseDot{50%{transform:scale(1.35);opacity:.7}}
.orbit-card{position:absolute;min-width:156px;padding:14px 16px;border-radius:22px;background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.055));border:1px solid rgba(255,255,255,.22);box-shadow:0 24px 70px rgba(0,0,0,.25);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);color:#fff;text-align:left}.rtl .orbit-card{text-align:right}
.orbit-card b{display:block;font-size:12px;letter-spacing:.16em}.orbit-card span{display:block;margin-top:5px;font-size:12px;color:rgba(255,255,255,.68);font-weight:800}.orbit-import{left:0;top:22px}.orbit-warehouse{right:0;top:160px}.orbit-retail{left:22px;bottom:28px}
.route-line{position:absolute;height:1px;background:linear-gradient(90deg,transparent,rgba(4,163,223,.9),transparent);transform-origin:left center;filter:drop-shadow(0 0 10px rgba(4,163,223,.8));opacity:.65}.r1{left:114px;top:105px;width:160px;transform:rotate(18deg)}.r2{left:136px;top:248px;width:160px;transform:rotate(-25deg)}
.btn{position:relative;overflow:hidden}.btn:before{content:"";position:absolute;inset:-50%;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.22),transparent 24%);opacity:0;transition:.2s}.btn:hover:before{opacity:1}
@media (max-width:1100px){.supply-orbit{opacity:.42;right:2vw;top:22vh;width:300px;height:300px}.orbit-globe{width:170px;height:170px}.orbit-card{display:none}}
@media (max-width:760px){.supply-orbit{display:none}.hero-proof-row{gap:7px;margin-top:12px}.hero-proof-row span{height:28px;padding:0 10px;font-size:9.5px}.hero-proof-row span:nth-child(3){display:none}}
@media (max-width:380px){.hero-proof-row span{font-size:8.7px;height:25px;padding:0 8px}}

/* V22 final art-directed hero: less generic, more premium FMCG composition */
.hero{
  min-height:100svh!important;
  height:100svh!important;
  max-height:none!important;
  padding-top:0!important;
  place-items:center!important;
  overflow:hidden!important;
}
.hero:before{
  background-image:
    linear-gradient(90deg,rgba(3,10,24,.96) 0%,rgba(4,14,31,.88) 38%,rgba(6,24,48,.42) 67%,rgba(3,12,25,.72) 100%),
    url('https://images.unsplash.com/photo-1586528116311-ad8dd3c8310d?auto=format&fit=crop&w=2400&q=84')!important;
  filter:saturate(.9) contrast(1.08) brightness(.74)!important;
  animation:kenV22 18s ease-in-out infinite alternate!important;
}
@keyframes kenV22{to{transform:scale(1.13) translate3d(-1%,0,0)}}
.hero-content{
  width:min(1220px,92vw)!important;
  padding-top:28px!important;
  padding-bottom:180px!important;
  transform:none!important;
  z-index:8!important;
}
.headline{
  max-width:760px!important;
  font-size:clamp(58px,6.05vw,96px)!important;
  line-height:.92!important;
  letter-spacing:-.07em!important;
  margin:18px 0 20px!important;
  text-shadow:0 26px 80px rgba(0,0,0,.48)!important;
}
.sub{
  max-width:620px!important;
  font-size:clamp(16px,1.32vw,19px)!important;
  line-height:1.62!important;
  color:rgba(255,255,255,.82)!important;
}
.cta-row{margin-top:26px!important}.btn{box-shadow:0 18px 55px rgba(0,0,0,.18)}
.hero-proof-row{margin-top:18px!important}
.hero-proof-row span{background:rgba(255,255,255,.075)!important;border-color:rgba(255,255,255,.16)!important}
/* hide previous generic globe/orbit if present */
.supply-orbit,.floating-scene,.hero-float-tags{display:none!important}
.supply-composition{
  position:absolute;
  right:6vw;
  top:17vh;
  width:min(520px,35vw);
  height:520px;
  z-index:5;
  pointer-events:none;
  transform-style:preserve-3d;
}
.rtl .supply-composition{right:auto;left:6vw}
.supply-composition:before{
  content:"";position:absolute;inset:9% 7%;border-radius:44%;
  background:radial-gradient(circle,rgba(4,163,223,.20),rgba(238,53,47,.08) 46%,transparent 72%);
  filter:blur(14px);animation:compositionPulse 5.5s ease-in-out infinite;
}
@keyframes compositionPulse{50%{transform:scale(1.08);opacity:.72}}
.supply-tile{
  position:absolute;overflow:hidden;border-radius:30px;border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.08);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  box-shadow:0 30px 90px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.16);
  animation:tileFloat 7s ease-in-out infinite;transform:translateZ(0);
}
.supply-tile:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 38%,rgba(3,12,25,.82));}
.supply-tile span{position:absolute;left:18px;bottom:17px;z-index:2;color:#fff;font-size:12px;font-weight:950;letter-spacing:.12em;text-transform:uppercase;text-shadow:0 8px 30px rgba(0,0,0,.45)}
.rtl .supply-tile span{left:auto;right:18px}
.tile-warehouse{width:275px;height:185px;right:58px;top:14px;background-image:linear-gradient(rgba(255,255,255,.06),rgba(255,255,255,.04)),url('https://images.unsplash.com/photo-1553413077-190dd305871c?auto=format&fit=crop&w=1000&q=82');background-size:cover;background-position:center;}
.tile-retail{width:260px;height:172px;left:6px;bottom:96px;background-image:linear-gradient(rgba(255,255,255,.04),rgba(255,255,255,.03)),url('https://images.unsplash.com/photo-1604719312566-8912e9228c6a?auto=format&fit=crop&w=1000&q=82');background-size:cover;background-position:center;animation-delay:.85s}
.tile-logistics{width:190px;height:190px;right:0;bottom:40px;background:linear-gradient(135deg,rgba(238,53,47,.78),rgba(4,163,223,.58));animation-delay:1.45s}
.tile-logistics:before{content:"";position:absolute;inset:18px;border-radius:22px;background:url('https://images.unsplash.com/photo-1519003722824-194d4455a60c?auto=format&fit=crop&w=800&q=78') center/cover;mix-blend-mode:screen;opacity:.32}
@keyframes tileFloat{50%{transform:translate3d(0,-14px,0) rotate(.4deg)}}
.route-chip{
  position:absolute;min-width:146px;padding:13px 16px;border-radius:20px;
  background:linear-gradient(135deg,rgba(255,255,255,.15),rgba(255,255,255,.05));
  border:1px solid rgba(255,255,255,.2);box-shadow:0 24px 70px rgba(0,0,0,.28);
  backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);color:#fff;animation:chipFloat 6.5s ease-in-out infinite;
}
.route-chip b{display:block;font-size:11px;letter-spacing:.16em}.route-chip span{display:block;margin-top:5px;font-size:11px;color:rgba(255,255,255,.72);font-weight:850}.chip-import{left:20px;top:72px}.chip-supply{right:18px;top:230px;animation-delay:.9s}.chip-retail{left:72px;bottom:16px;animation-delay:1.7s}@keyframes chipFloat{50%{transform:translateY(-11px)}}
.lux-line{position:absolute;height:1px;background:linear-gradient(90deg,transparent,rgba(4,163,223,.9),rgba(255,255,255,.45),transparent);filter:drop-shadow(0 0 12px rgba(4,163,223,.9));opacity:.68;transform-origin:left center;animation:lineFlow 2.8s linear infinite}.line-a{left:128px;top:166px;width:290px;transform:rotate(20deg)}.line-b{left:116px;top:352px;width:250px;transform:rotate(-28deg);animation-delay:.8s}@keyframes lineFlow{50%{opacity:1}100%{opacity:.58}}
/* Glass numbers: lighter, more Apple-like */
.hero-glass-stats{
  bottom:64px!important;width:min(910px,78vw)!important;gap:10px!important;padding:10px!important;
  border-radius:30px!important;background:linear-gradient(135deg,rgba(255,255,255,.13),rgba(255,255,255,.04))!important;
  border:1px solid rgba(255,255,255,.24)!important;box-shadow:0 26px 90px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.22)!important;
}
.hero-glass-stats .stat{min-height:86px!important;padding:16px 20px!important;border-radius:22px!important;background:rgba(255,255,255,.095)!important;border:1px solid rgba(255,255,255,.22)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.18)!important}
.hero-glass-stats .stat strong{font-size:clamp(30px,2.7vw,42px)!important;color:#fff!important;text-shadow:0 12px 35px rgba(4,163,223,.38)!important}
.hero-glass-stats .stat span{font-size:11.5px!important;color:rgba(255,255,255,.78)!important;margin-top:5px!important}
.hero-brand-ticker{height:50px!important;background:rgba(3,11,24,.88)!important;border-top:1px solid rgba(255,255,255,.12)!important;backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important}.hero-brand-track{animation-duration:24s!important;will-change:transform!important}.hero-brand-item{height:31px!important;min-width:112px!important;font-size:10.5px!important;background:rgba(255,255,255,.075)!important}
@media(max-width:1120px){.supply-composition{opacity:.52;right:1.5vw;width:330px;height:330px;top:21vh}.tile-warehouse{width:205px;height:135px}.tile-retail{width:190px;height:126px}.tile-logistics{width:132px;height:132px}.route-chip,.lux-line{display:none}.hero-glass-stats{width:min(920px,88vw)!important}}
@media(max-width:760px){
  .supply-composition{display:none!important}
  .hero{min-height:100svh!important;height:100svh!important;padding-top:0!important;place-items:start center!important}
  .hero-content{padding-top:112px!important;padding-bottom:218px!important;width:92vw!important}
  .headline{font-size:clamp(38px,12.4vw,56px)!important;line-height:.98!important;letter-spacing:-.055em!important;margin:14px 0 12px!important;max-width:92vw!important}
  .sub{font-size:13.1px!important;line-height:1.52!important;max-width:90vw!important;color:rgba(255,255,255,.82)!important}
  .cta-row{margin-top:14px!important;gap:8px!important}.cta-row .btn{flex:1!important;width:auto!important;min-width:0!important;padding:12px 10px!important;font-size:11px!important}
  .hero-proof-row{margin-top:10px!important;gap:6px!important}.hero-proof-row span{height:25px!important;font-size:8.7px!important;padding:0 8px!important}.hero-proof-row span:nth-child(3){display:none!important}
  .hero-glass-stats{bottom:48px!important;width:92vw!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important;padding:7px!important;overflow:visible!important;border-radius:20px!important}
  .hero-glass-stats .stat{min-width:0!important;min-height:58px!important;padding:9px 11px!important;border-radius:14px!important}
  .hero-glass-stats .stat strong{font-size:25px!important}.hero-glass-stats .stat span{font-size:8.5px!important;margin-top:3px!important}
  .hero-brand-ticker{height:42px!important;padding:0 9px!important}.hero-brand-track{gap:7px!important;animation-duration:22s!important}.hero-brand-item{height:26px!important;min-width:82px!important;font-size:8.5px!important;padding:0 9px!important}
}
@media(max-width:380px), (max-height:700px) and (max-width:760px){
  .hero-content{padding-top:94px!important;padding-bottom:198px!important}.headline{font-size:clamp(32px,11vw,42px)!important;line-height:1!important}.sub{font-size:11.6px!important;line-height:1.42!important}.hero-proof-row{display:none!important}.hero-glass-stats{bottom:42px!important}.hero-brand-ticker{height:38px!important}.hero-brand-item{height:24px!important;min-width:76px!important;font-size:7.9px!important}
}

/* V23 refinements: desktop hero breathing room, editable visual cards, richer mobile lower scene */
@media (min-width:761px){
  .hero-content{
    transform:translateY(34px)!important;
    padding-top:70px!important;
    padding-bottom:178px!important;
  }
  .headline{margin-top:28px!important;}
}
@media (min-width:1200px) and (max-height:820px){
  .hero-content{transform:translateY(28px)!important;padding-bottom:166px!important;}
  .headline{font-size:clamp(54px,5.35vw,86px)!important;margin-top:24px!important;}
}
.supply-tile,.route-chip{transition:opacity .25s ease, transform .35s ease, filter .35s ease;}
.supply-tile[hidden],.route-chip[hidden]{display:none!important;}
.admin-visual-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:14px}
.admin-visual-card{border:1px solid var(--darkline);border-radius:22px;padding:16px;background:#fff;display:grid;gap:10px}
.admin-visual-card label{font-size:13px;font-weight:900;color:var(--deep)}
.admin-visual-card input[type="text"]{width:100%;border:1px solid var(--darkline);border-radius:13px;padding:12px}
.admin-visual-card small{color:var(--muted)}
@media(max-width:760px){
  .supply-composition{
    display:block!important;
    opacity:1!important;
    left:4vw!important;
    right:auto!important;
    top:auto!important;
    bottom:188px!important;
    width:92vw!important;
    height:76px!important;
    z-index:6!important;
    transform:none!important;
  }
  .supply-composition:before,.lux-line,.route-chip{display:none!important}
  .supply-tile{
    display:block!important;
    position:absolute!important;
    top:0!important;
    bottom:auto!important;
    height:70px!important;
    border-radius:18px!important;
    animation:none!important;
    box-shadow:0 14px 44px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.18)!important;
  }
  .supply-tile span{font-size:8.4px!important;left:10px!important;right:10px!important;bottom:9px!important;letter-spacing:.10em!important}
  .tile-warehouse{left:0!important;right:auto!important;width:35%!important;}
  .tile-retail{left:32.5%!important;right:auto!important;width:35%!important;}
  .tile-logistics{left:auto!important;right:0!important;width:35%!important;}
  .hero-content{padding-bottom:310px!important;}
  .hero-glass-stats{bottom:50px!important;}
  .hero-brand-ticker{height:42px!important;}
}
@media(max-width:430px){
  .supply-composition{bottom:176px!important;height:68px!important;}
  .supply-tile{height:64px!important;border-radius:16px!important;}
  .supply-tile span{font-size:7.6px!important;bottom:8px!important}
  .hero-content{padding-bottom:288px!important;}
}
@media(max-width:380px), (max-height:700px) and (max-width:760px){
  .supply-composition{bottom:154px!important;height:58px!important;}
  .supply-tile{height:54px!important;border-radius:14px!important;}
  .supply-tile span{font-size:6.9px!important;bottom:6px!important}
  .hero-content{padding-bottom:250px!important;}
}


/* === V26 Mobile Supply Chain: image + icon vertical story for hero bottom === */
.mobile-supply-flow{display:none}
@media(max-width:760px){
  /* Replace the previous cramped mobile image strip with a cleaner supply-chain story */
  .supply-composition{display:none!important}
  .hero{min-height:1010px!important}
  .hero-content{padding-bottom:455px!important}
  .mobile-supply-flow{
    display:block;
    position:absolute;
    left:50%;
    bottom:164px;
    transform:translateX(-50%);
    z-index:7;
    width:min(390px,calc(100vw - 30px));
    padding:10px;
    border-radius:26px;
    background:
      radial-gradient(circle at 12% 8%,rgba(4,163,223,.32),transparent 26%),
      linear-gradient(145deg,rgba(255,255,255,.18),rgba(255,255,255,.055));
    border:1px solid rgba(255,255,255,.26);
    box-shadow:0 22px 85px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.24);
    backdrop-filter:blur(22px);
    -webkit-backdrop-filter:blur(22px);
    overflow:hidden;
  }
  .mobile-supply-flow:before{
    content:"";
    position:absolute;
    inset:-40% 25% auto;
    height:150%;
    width:42px;
    background:linear-gradient(180deg,transparent,rgba(4,163,223,.22),rgba(238,53,47,.18),transparent);
    filter:blur(12px);
    transform:rotate(20deg);
    animation:flowBeam 5.8s linear infinite;
    pointer-events:none;
  }
  @keyframes flowBeam{
    from{translate:-120px -30px;opacity:.35}
    50%{opacity:.85}
    to{translate:220px 80px;opacity:.35}
  }
  .mobile-flow-head{
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 0 8px;
    color:rgba(255,255,255,.72);
    font-size:9px;
    letter-spacing:.18em;
    text-transform:uppercase;
    font-weight:950;
  }
  .mobile-flow-steps{position:relative;display:grid;gap:4px}
  .mobile-flow-step{
    position:relative;
    display:grid;
    grid-template-columns:46px 1fr 38px;
    align-items:center;
    min-height:54px;
    gap:9px;
    padding:7px 9px;
    border-radius:18px;
    border:1px solid rgba(255,255,255,.19);
    background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.065));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.18);
    overflow:hidden;
  }
  .mobile-flow-step:after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(100deg,transparent 5%,rgba(255,255,255,.10),transparent 45%);
    transform:translateX(-100%);
    animation:flowShine 5.4s ease-in-out infinite;
  }
  .mobile-flow-step:nth-of-type(3):after{animation-delay:.5s}
  .mobile-flow-step:nth-of-type(5):after{animation-delay:1s}
  .mobile-flow-step:nth-of-type(7):after{animation-delay:1.5s}
  @keyframes flowShine{35%,100%{transform:translateX(120%)}}
  .flow-thumb{
    width:46px;height:40px;border-radius:14px;overflow:hidden;
    border:1px solid rgba(255,255,255,.28);
    box-shadow:0 8px 24px rgba(0,0,0,.22);
    background:rgba(255,255,255,.1);
  }
  .flow-thumb img{width:100%;height:100%;object-fit:cover}
  .flow-copy{position:relative;z-index:2;min-width:0}
  .flow-copy b{
    display:block;
    color:#fff;
    font-size:11px;
    line-height:1;
    font-weight:950;
    letter-spacing:.10em;
    text-transform:uppercase;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .flow-copy small{
    display:block;
    margin-top:4px;
    color:rgba(255,255,255,.68);
    font-size:9px;
    line-height:1;
    font-weight:850;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .flow-icon{
    position:relative;
    z-index:2;
    width:34px;height:34px;border-radius:14px;
    display:grid;place-items:center;
    background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.36),rgba(255,255,255,.10));
    border:1px solid rgba(255,255,255,.20);
    font-size:17px;
    box-shadow:0 0 26px rgba(4,163,223,.16);
  }
  .mobile-flow-arrow{
    height:10px;
    margin:-2px 0;
    display:grid;
    place-items:center;
    color:#30c5ff;
    font-size:13px;
    line-height:1;
    text-shadow:0 0 18px rgba(4,163,223,.8);
    animation:arrowPulse 1.55s ease-in-out infinite;
  }
  @keyframes arrowPulse{50%{transform:translateY(2px);opacity:.55}}
  .hero-glass-stats{bottom:48px!important}
  .hero-brand-ticker{height:42px!important}
}
@media(max-width:430px){
  .hero{min-height:970px!important}
  .hero-content{padding-bottom:430px!important}
  .mobile-supply-flow{bottom:154px;width:calc(100vw - 26px);border-radius:24px;padding:9px}
  .mobile-flow-head{font-size:8px;margin-bottom:7px}
  .mobile-flow-step{grid-template-columns:42px 1fr 34px;min-height:50px;gap:8px;padding:6px 8px;border-radius:16px}
  .flow-thumb{width:42px;height:36px;border-radius:12px}
  .flow-copy b{font-size:10px;letter-spacing:.08em}
  .flow-copy small{font-size:8px}
  .flow-icon{width:30px;height:30px;border-radius:12px;font-size:15px}
}
@media(max-width:380px), (max-height:760px) and (max-width:760px){
  .hero{min-height:930px!important}
  .hero-content{padding-bottom:400px!important}
  .mobile-supply-flow{bottom:142px;padding:8px}
  .mobile-flow-head{display:none}
  .mobile-flow-step{min-height:46px}
  .mobile-flow-arrow{height:7px;font-size:11px}
}
@media (prefers-reduced-motion: reduce){
  .mobile-supply-flow:before,.mobile-flow-step:after,.mobile-flow-arrow{animation:none!important}
}

/* === V27: mobile-first landing fit + supply-chain story + move stats to Who We Are === */
.mobile-about-stats{display:none}
@media(max-width:760px){
  .hero{
    min-height:100svh!important;
    height:100svh!important;
    overflow:hidden!important;
    display:block!important;
  }
  .hero-content{
    width:92vw!important;
    padding-top:82px!important;
    padding-bottom:0!important;
    transform:none!important;
    margin-inline:auto!important;
  }
  .headline{
    font-size:clamp(31px,10.2vw,44px)!important;
    line-height:1.01!important;
    letter-spacing:-.054em!important;
    margin:10px 0 9px!important;
    max-width:92vw!important;
  }
  .sub{
    font-size:clamp(10.3px,3vw,12.3px)!important;
    line-height:1.42!important;
    max-width:91vw!important;
    color:rgba(255,255,255,.82)!important;
  }
  .cta-row{margin-top:11px!important;gap:8px!important}
  .cta-row .btn{height:36px!important;min-height:36px!important;padding:0 10px!important;font-size:10.2px!important;flex:1!important}
  .hero-proof-row{margin-top:8px!important;gap:6px!important;max-width:92vw!important}
  .hero-proof-row span{height:22px!important;padding:0 8px!important;font-size:7.8px!important;letter-spacing:.01em!important}
  .hero-proof-row span:nth-child(3){display:none!important}
  /* Move animated stats out of hero on mobile */
  .hero>.hero-glass-stats{display:none!important}
  /* Compact premium supply chain for first-screen mobile */
  .mobile-supply-flow{
    display:block!important;
    position:absolute!important;
    left:50%!important;
    bottom:42px!important;
    transform:translateX(-50%)!important;
    z-index:7!important;
    width:calc(100vw - 24px)!important;
    max-width:410px!important;
    padding:9px!important;
    border-radius:24px!important;
    background:
      radial-gradient(circle at 12% 10%,rgba(4,163,223,.34),transparent 28%),
      radial-gradient(circle at 90% 88%,rgba(238,53,47,.18),transparent 30%),
      linear-gradient(145deg,rgba(255,255,255,.17),rgba(255,255,255,.052))!important;
    border:1px solid rgba(255,255,255,.25)!important;
    box-shadow:0 18px 70px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.25)!important;
    backdrop-filter:blur(20px)!important;
    -webkit-backdrop-filter:blur(20px)!important;
    overflow:hidden!important;
  }
  .mobile-flow-head{display:none!important}
  .mobile-flow-steps{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:7px!important;
    position:relative!important;
  }
  .mobile-flow-steps:before{
    content:"";
    position:absolute;
    left:10%;right:10%;top:34px;height:2px;
    background:linear-gradient(90deg,rgba(4,163,223,.12),rgba(4,163,223,.88),rgba(255,255,255,.55),rgba(238,53,47,.34));
    box-shadow:0 0 18px rgba(4,163,223,.55);
    border-radius:999px;
    z-index:0;
  }
  .mobile-flow-steps:after{
    content:"";
    position:absolute;
    top:30px;left:8%;
    width:10px;height:10px;border-radius:999px;
    background:#5ed8ff;
    box-shadow:0 0 0 6px rgba(4,163,223,.16),0 0 24px rgba(4,163,223,.95);
    z-index:3;
    animation:mobileRouteDot 4.8s cubic-bezier(.45,0,.2,1) infinite;
  }
  @keyframes mobileRouteDot{
    0%{left:8%;opacity:.2;transform:scale(.8)}
    10%{opacity:1;transform:scale(1)}
    32%{left:34%}
    58%{left:60%}
    86%{left:86%;opacity:1}
    100%{left:86%;opacity:.2;transform:scale(.8)}
  }
  .mobile-flow-arrow{display:none!important}
  .mobile-flow-step{
    min-height:112px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    align-items:center!important;
    gap:12px!important;
    padding:6px 5px 8px!important;
    border-radius:18px!important;
    border:1px solid rgba(255,255,255,.19)!important;
    background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.06))!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 10px 30px rgba(0,0,0,.16)!important;
    overflow:hidden!important;
    animation:flowCardFloat 4.8s ease-in-out infinite!important;
  }
  .mobile-flow-step:nth-child(3){animation-delay:.25s!important}
  .mobile-flow-step:nth-child(5){animation-delay:.5s!important}
  .mobile-flow-step:nth-child(7){animation-delay:.75s!important}
  @keyframes flowCardFloat{50%{transform:translateY(-4px)}}
  .mobile-flow-step:after{
    animation:flowShine 5.8s ease-in-out infinite!important;
  }
  .flow-thumb{
    width:100%!important;
    height:44px!important;
    border-radius:13px!important;
    border:1px solid rgba(255,255,255,.26)!important;
    overflow:hidden!important;
    background:rgba(255,255,255,.08)!important;
  }
  .flow-thumb img{width:100%!important;height:100%!important;object-fit:cover!important;filter:saturate(1.05) contrast(1.04)!important}
  .flow-icon{
    position:relative!important;
    z-index:4!important;
    width:26px!important;height:26px!important;
    margin-top:-18px!important;
    border-radius:11px!important;
    font-size:13px!important;
    display:grid!important;place-items:center!important;
    background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.45),rgba(4,163,223,.24))!important;
    border:1px solid rgba(255,255,255,.27)!important;
    box-shadow:0 0 24px rgba(4,163,223,.22)!important;
  }
  .flow-copy{position:relative!important;z-index:4!important;text-align:center!important;min-width:0!important;width:100%!important;margin-top:1px!important}
  .flow-copy b{font-size:8.3px!important;letter-spacing:.07em!important;line-height:1.06!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;color:#fff!important}
  .flow-copy small{font-size:6.7px!important;line-height:1.05!important;margin-top:3px!important;color:rgba(255,255,255,.67)!important;white-space:normal!important;overflow:hidden!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important}
  .hero-brand-ticker{height:42px!important;bottom:0!important;padding:0 8px!important;background:rgba(3,11,24,.9)!important}
  .hero-brand-track{animation-duration:22s!important;gap:7px!important}
  .hero-brand-item{height:26px!important;min-width:76px!important;font-size:8.1px!important;padding:0 9px!important}
  .hero-ticker-label{display:none!important}
  /* Who We Are receives the old animated stats on mobile */
  .mobile-about-stats{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
    margin:22px 0 4px;
    padding:10px;
    border-radius:24px;
    background:linear-gradient(135deg,rgba(255,255,255,.15),rgba(255,255,255,.055));
    border:1px solid rgba(255,255,255,.24);
    box-shadow:0 20px 70px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.2);
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
  }
  .mobile-about-stat{
    min-height:68px;
    border-radius:17px;
    padding:12px 13px;
    background:rgba(255,255,255,.095);
    border:1px solid rgba(255,255,255,.20);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.14);
  }
  .mobile-about-stat strong{display:block;color:#fff;font-size:27px;line-height:1;font-weight:950;letter-spacing:-.055em;text-shadow:0 12px 35px rgba(4,163,223,.32)}
  .mobile-about-stat span{display:block;margin-top:5px;color:rgba(255,255,255,.76);font-size:9px;font-weight:950}
  .about-grid{grid-template-columns:1fr!important}
}
@media(max-width:390px), (max-height:760px) and (max-width:760px){
  .hero-content{padding-top:72px!important}
  .headline{font-size:clamp(28px,9.4vw,37px)!important;margin:8px 0 7px!important}
  .sub{font-size:10px!important;line-height:1.34!important;max-width:91vw!important}
  .cta-row{margin-top:9px!important}.cta-row .btn{height:32px!important;min-height:32px!important;font-size:9px!important;padding:0 8px!important}
  .hero-proof-row{display:none!important}
  .mobile-supply-flow{bottom:38px!important;padding:7px!important;border-radius:20px!important}
  .mobile-flow-steps{gap:5px!important}
  .mobile-flow-step{min-height:98px!important;border-radius:15px!important;padding:5px 4px 7px!important}
  .flow-thumb{height:38px!important;border-radius:11px!important}
  .flow-icon{width:23px!important;height:23px!important;font-size:12px!important;margin-top:-16px!important}
  .flow-copy b{font-size:7.2px!important}.flow-copy small{font-size:5.9px!important}
  .hero-brand-ticker{height:38px!important}.hero-brand-item{height:24px!important;min-width:70px!important;font-size:7.4px!important}
}

/* === V28: mobile orbit supply chain instead of one-line cards === */
@media(max-width:760px){
  .hero{min-height:100svh!important;height:100svh!important;overflow:hidden!important;}
  .hero-content{padding-top:82px!important;padding-bottom:0!important;}
  .headline{font-size:clamp(31px,10.2vw,44px)!important;line-height:1.01!important;margin:10px 0 9px!important;}
  .sub{font-size:clamp(10.3px,3vw,12.3px)!important;line-height:1.42!important;}
  .mobile-supply-flow{
    display:block!important;
    position:absolute!important;
    left:50%!important;
    bottom:42px!important;
    transform:translateX(-50%)!important;
    width:min(390px,calc(100vw - 24px))!important;
    height:156px!important;
    padding:0!important;
    border-radius:30px!important;
    background:
      radial-gradient(circle at 50% 48%,rgba(4,163,223,.30),transparent 34%),
      radial-gradient(circle at 84% 82%,rgba(238,53,47,.18),transparent 28%),
      linear-gradient(145deg,rgba(255,255,255,.15),rgba(255,255,255,.045))!important;
    border:1px solid rgba(255,255,255,.25)!important;
    box-shadow:0 20px 76px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.24)!important;
    backdrop-filter:blur(22px) saturate(1.25)!important;
    -webkit-backdrop-filter:blur(22px) saturate(1.25)!important;
    overflow:hidden!important;
    z-index:7!important;
  }
  .mobile-supply-flow:before{
    content:""!important;
    position:absolute!important;
    left:50%!important;top:50%!important;
    width:172px!important;height:92px!important;
    border-radius:50%!important;
    border:1px solid rgba(94,216,255,.33)!important;
    transform:translate(-50%,-50%) rotate(-8deg)!important;
    box-shadow:0 0 24px rgba(4,163,223,.20),inset 0 0 22px rgba(4,163,223,.07)!important;
    background:transparent!important;
    filter:none!important;
    animation:orbitRing 8s ease-in-out infinite!important;
  }
  .mobile-supply-flow:after{
    content:""!important;
    position:absolute!important;
    left:50%!important;top:50%!important;
    width:46px!important;height:46px!important;
    transform:translate(-50%,-50%)!important;
    border-radius:50%!important;
    background:
      linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.04)),
      url('../images/logo.png') center/34px 34px no-repeat!important;
    border:1px solid rgba(255,255,255,.26)!important;
    box-shadow:0 0 0 8px rgba(4,163,223,.09),0 14px 40px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.28)!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
    z-index:4!important;
  }
  @keyframes orbitRing{50%{transform:translate(-50%,-50%) rotate(8deg) scale(1.03)}}
  .mobile-flow-head{display:none!important;}
  .mobile-flow-steps{
    position:absolute!important;
    inset:0!important;
    display:block!important;
    gap:0!important;
  }
  .mobile-flow-steps:before{
    content:""!important;
    position:absolute!important;
    left:50%!important;top:50%!important;
    width:8px!important;height:8px!important;
    border-radius:50%!important;
    background:#5ed8ff!important;
    box-shadow:0 0 0 6px rgba(4,163,223,.14),0 0 22px rgba(4,163,223,.9)!important;
    z-index:5!important;
    animation:routePulse 2.6s ease-in-out infinite!important;
  }
  .mobile-flow-steps:after{display:none!important;}
  @keyframes routePulse{50%{opacity:.55;transform:scale(1.25)}}
  .mobile-flow-arrow{display:none!important;}
  .mobile-flow-step{
    position:absolute!important;
    width:88px!important;
    min-height:54px!important;
    height:54px!important;
    display:grid!important;
    grid-template-columns:32px 1fr!important;
    grid-template-rows:1fr!important;
    align-items:center!important;
    gap:6px!important;
    padding:6px!important;
    border-radius:18px!important;
    background:linear-gradient(145deg,rgba(255,255,255,.19),rgba(255,255,255,.06))!important;
    border:1px solid rgba(255,255,255,.24)!important;
    box-shadow:0 10px 34px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.20)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
    overflow:hidden!important;
    animation:orbitFloat 4.8s ease-in-out infinite!important;
    z-index:6!important;
  }
  .mobile-flow-step:nth-child(1){left:50%!important;top:10px!important;transform:translateX(-50%)!important;animation-delay:0s!important;}
  .mobile-flow-step:nth-child(3){left:12px!important;top:57px!important;animation-delay:.25s!important;}
  .mobile-flow-step:nth-child(5){right:12px!important;top:57px!important;animation-delay:.5s!important;}
  .mobile-flow-step:nth-child(7){left:50%!important;bottom:10px!important;transform:translateX(-50%)!important;animation-delay:.75s!important;}
  @keyframes orbitFloat{50%{margin-top:-4px;filter:brightness(1.08)}}
  .mobile-flow-step:before{
    content:""!important;
    position:absolute!important;
    inset:auto auto -16px -10px!important;
    width:54px!important;height:54px!important;
    border-radius:50%!important;
    background:radial-gradient(circle,rgba(4,163,223,.28),transparent 68%)!important;
    pointer-events:none!important;
  }
  .mobile-flow-step:after{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    background:linear-gradient(105deg,transparent 0%,rgba(255,255,255,.14) 38%,transparent 72%)!important;
    transform:translateX(-120%)!important;
    animation:orbitShine 5.6s ease-in-out infinite!important;
  }
  .mobile-flow-step:nth-child(3):after{animation-delay:.45s!important;}
  .mobile-flow-step:nth-child(5):after{animation-delay:.9s!important;}
  .mobile-flow-step:nth-child(7):after{animation-delay:1.35s!important;}
  @keyframes orbitShine{42%,100%{transform:translateX(130%)}}
  .flow-thumb{
    position:relative!important;
    z-index:3!important;
    width:32px!important;height:32px!important;
    border-radius:12px!important;
    overflow:hidden!important;
    border:1px solid rgba(255,255,255,.26)!important;
    box-shadow:0 8px 20px rgba(0,0,0,.20)!important;
  }
  .flow-thumb img{width:100%!important;height:100%!important;object-fit:cover!important;filter:saturate(1.08) contrast(1.04)!important;}
  .flow-icon{
    position:absolute!important;
    left:23px!important;bottom:4px!important;
    z-index:4!important;
    width:18px!important;height:18px!important;
    border-radius:8px!important;
    font-size:10px!important;
    display:grid!important;place-items:center!important;
    background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.52),rgba(4,163,223,.24))!important;
    border:1px solid rgba(255,255,255,.28)!important;
    box-shadow:0 0 18px rgba(4,163,223,.24)!important;
  }
  .flow-copy{
    position:relative!important;
    z-index:4!important;
    text-align:left!important;
    min-width:0!important;
    width:auto!important;
    margin:0!important;
  }
  .rtl .flow-copy{text-align:right!important;}
  .flow-copy b{
    display:block!important;
    color:#fff!important;
    font-size:7.4px!important;
    letter-spacing:.06em!important;
    line-height:1.05!important;
    text-transform:uppercase!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  .flow-copy small{
    display:block!important;
    margin-top:3px!important;
    color:rgba(255,255,255,.66)!important;
    font-size:5.6px!important;
    line-height:1.05!important;
    white-space:normal!important;
    overflow:hidden!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
  }
  .hero-brand-ticker{height:40px!important;bottom:0!important;z-index:8!important;}
  .hero-brand-track{animation-duration:22s!important;}
}
@media(max-width:390px), (max-height:760px) and (max-width:760px){
  .hero-content{padding-top:72px!important;}
  .mobile-supply-flow{height:140px!important;bottom:38px!important;width:calc(100vw - 20px)!important;border-radius:24px!important;}
  .mobile-supply-flow:before{width:150px!important;height:76px!important;}
  .mobile-supply-flow:after{width:40px!important;height:40px!important;background-size:30px 30px!important;}
  .mobile-flow-step{width:80px!important;height:49px!important;min-height:49px!important;border-radius:15px!important;grid-template-columns:28px 1fr!important;gap:12px!important;padding:5px!important;}
  .mobile-flow-step:nth-child(1){top:8px!important;}
  .mobile-flow-step:nth-child(3){left:9px!important;top:51px!important;}
  .mobile-flow-step:nth-child(5){right:9px!important;top:51px!important;}
  .mobile-flow-step:nth-child(7){bottom:8px!important;}
  .flow-thumb{width:28px!important;height:28px!important;border-radius:10px!important;}
  .flow-icon{width:16px!important;height:16px!important;font-size:9px!important;left:20px!important;bottom:4px!important;}
  .flow-copy b{font-size:6.6px!important;letter-spacing:.04em!important;}
  .flow-copy small{font-size:5.1px!important;}
  .hero-brand-ticker{height:38px!important;}
}

/* === V29: mobile winding/snake supply path, top-to-bottom === */
@media(max-width:760px){
  .hero{min-height:100svh!important;height:100svh!important;overflow:hidden!important;}
  .hero-content{padding-top:82px!important;padding-bottom:0!important;}
  .mobile-supply-flow{
    display:block!important;position:absolute!important;left:50%!important;bottom:42px!important;transform:translateX(-50%)!important;
    width:min(392px,calc(100vw - 24px))!important;height:178px!important;padding:10px!important;border-radius:28px!important;
    background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.045))!important;
    border:1px solid rgba(255,255,255,.24)!important;box-shadow:0 22px 74px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.24)!important;
    backdrop-filter:blur(22px) saturate(1.25)!important;-webkit-backdrop-filter:blur(22px) saturate(1.25)!important;overflow:hidden!important;z-index:7!important;
  }
  .mobile-supply-flow:before{
    content:""!important;position:absolute!important;inset:9px 18px 9px 18px!important;border:0!important;border-radius:0!important;box-shadow:none!important;filter:none!important;animation:none!important;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 360 160' fill='none'%3E%3Cpath d='M72 22 C246 10 296 33 278 56 C258 82 92 50 80 82 C65 122 286 86 282 128 C279 151 170 146 112 144' stroke='rgba(94,216,255,.58)' stroke-width='2.2' stroke-linecap='round' stroke-dasharray='7 10'/%3E%3Cpath d='M72 22 C246 10 296 33 278 56 C258 82 92 50 80 82 C65 122 286 86 282 128 C279 151 170 146 112 144' stroke='rgba(255,255,255,.16)' stroke-width='7' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat!important;
    opacity:.95!important;z-index:1!important;
  }
  .mobile-supply-flow:after{
    content:""!important;position:absolute!important;left:55px!important;top:26px!important;width:9px!important;height:9px!important;border-radius:50%!important;transform:none!important;
    background:#5ed8ff!important;box-shadow:0 0 0 6px rgba(4,163,223,.12),0 0 24px rgba(4,163,223,.95)!important;
    animation:snakeDot 5.8s cubic-bezier(.45,0,.25,1) infinite!important;z-index:3!important;
  }
  @keyframes snakeDot{
    0%{left:56px;top:26px;opacity:.75}
    24%{left:282px;top:56px;opacity:1}
    50%{left:74px;top:92px;opacity:.9}
    76%{left:286px;top:130px;opacity:1}
    100%{left:108px;top:146px;opacity:.75}
  }
  .mobile-flow-head{display:none!important;}
  .mobile-flow-steps{position:absolute!important;inset:0!important;display:block!important;gap:0!important;}
  .mobile-flow-steps:before,.mobile-flow-steps:after{display:none!important;}
  .mobile-flow-arrow{display:none!important;}
  .mobile-flow-step{
    position:absolute!important;width:124px!important;height:42px!important;min-height:42px!important;display:grid!important;grid-template-columns:34px 1fr!important;align-items:center!important;gap:7px!important;padding:5px 8px!important;
    border-radius:16px!important;background:linear-gradient(145deg,rgba(255,255,255,.19),rgba(255,255,255,.065))!important;border:1px solid rgba(255,255,255,.24)!important;
    box-shadow:0 12px 34px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.22)!important;backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important;
    overflow:hidden!important;z-index:5!important;animation:snakeCardFloat 4.8s ease-in-out infinite!important;
  }
  .mobile-flow-step:nth-child(1){left:14px!important;top:14px!important;animation-delay:0s!important;}
  .mobile-flow-step:nth-child(3){right:14px!important;top:52px!important;animation-delay:.22s!important;}
  .mobile-flow-step:nth-child(5){left:14px!important;top:91px!important;animation-delay:.44s!important;}
  .mobile-flow-step:nth-child(7){right:14px!important;top:130px!important;animation-delay:.66s!important;}
  @keyframes snakeCardFloat{50%{margin-top:-3px;filter:brightness(1.08)}}
  .mobile-flow-step:before{content:""!important;position:absolute!important;inset:auto auto -18px -10px!important;width:56px!important;height:56px!important;border-radius:50%!important;background:radial-gradient(circle,rgba(4,163,223,.24),transparent 68%)!important;}
  .mobile-flow-step:after{content:""!important;position:absolute!important;inset:0!important;background:linear-gradient(105deg,transparent 0%,rgba(255,255,255,.14) 38%,transparent 72%)!important;transform:translateX(-120%)!important;animation:snakeShine 5.4s ease-in-out infinite!important;}
  .mobile-flow-step:nth-child(3):after{animation-delay:.55s!important}.mobile-flow-step:nth-child(5):after{animation-delay:1.1s!important}.mobile-flow-step:nth-child(7):after{animation-delay:1.65s!important}
  @keyframes snakeShine{44%,100%{transform:translateX(135%)}}
  .flow-thumb{position:relative!important;z-index:3!important;width:34px!important;height:31px!important;border-radius:11px!important;overflow:hidden!important;border:1px solid rgba(255,255,255,.25)!important;box-shadow:0 8px 18px rgba(0,0,0,.18)!important;}
  .flow-thumb img{width:100%!important;height:100%!important;object-fit:cover!important;filter:saturate(1.08) contrast(1.04)!important;}
  .flow-icon{position:absolute!important;left:25px!important;bottom:4px!important;z-index:4!important;width:16px!important;height:16px!important;border-radius:7px!important;font-size:9px!important;display:grid!important;place-items:center!important;background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.55),rgba(4,163,223,.24))!important;border:1px solid rgba(255,255,255,.28)!important;box-shadow:0 0 16px rgba(4,163,223,.25)!important;}
  .flow-copy{position:relative!important;z-index:4!important;text-align:left!important;min-width:0!important;margin:0!important;}
  .rtl .flow-copy{text-align:right!important;}
  .flow-copy b{display:block!important;color:#fff!important;font-size:7.5px!important;letter-spacing:.055em!important;line-height:1.05!important;text-transform:uppercase!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
  .flow-copy small{display:block!important;margin-top:2px!important;color:rgba(255,255,255,.68)!important;font-size:5.8px!important;line-height:1.05!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
  .hero-brand-ticker{height:40px!important;bottom:0!important;z-index:8!important}.hero-brand-track{animation-duration:22s!important;}
}
@media(max-width:390px), (max-height:760px) and (max-width:760px){
  .hero-content{padding-top:72px!important;}
  .mobile-supply-flow{height:166px!important;bottom:38px!important;width:calc(100vw - 20px)!important;border-radius:24px!important;}
  .mobile-flow-step{width:112px!important;height:39px!important;min-height:39px!important;grid-template-columns:30px 1fr!important;gap:6px!important;padding:5px 7px!important;border-radius:14px!important;}
  .mobile-flow-step:nth-child(1){left:10px!important;top:12px!important}.mobile-flow-step:nth-child(3){right:10px!important;top:48px!important}.mobile-flow-step:nth-child(5){left:10px!important;top:84px!important}.mobile-flow-step:nth-child(7){right:10px!important;top:120px!important}
  .flow-thumb{width:30px!important;height:28px!important;border-radius:10px!important}.flow-icon{left:22px!important;bottom:4px!important;width:15px!important;height:15px!important;font-size:8px!important}.flow-copy b{font-size:6.8px!important}.flow-copy small{font-size:5.2px!important}
  @keyframes snakeDot{0%{left:48px;top:24px}24%{left:260px;top:52px}50%{left:62px;top:88px}76%{left:265px;top:123px}100%{left:95px;top:140px}}
}

/* === V30: mobile supply chain changed to desktop-style static collage (no orbit / no snake motion) === */
@media(max-width:760px){
  .mobile-supply-flow{
    display:block!important;
    position:absolute!important;
    left:50%!important;
    bottom:42px!important;
    transform:translateX(-50%)!important;
    width:min(392px,calc(100vw - 24px))!important;
    height:150px!important;
    padding:10px!important;
    border-radius:26px!important;
    background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.045))!important;
    border:1px solid rgba(255,255,255,.24)!important;
    box-shadow:0 22px 70px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.22)!important;
    backdrop-filter:blur(22px) saturate(1.22)!important;
    -webkit-backdrop-filter:blur(22px) saturate(1.22)!important;
    overflow:hidden!important;
    z-index:7!important;
  }
  .mobile-supply-flow:before{
    content:""!important;
    position:absolute!important;
    inset:-35% -20%!important;
    background:
      radial-gradient(circle at 20% 25%, rgba(4,163,223,.20), transparent 30%),
      radial-gradient(circle at 82% 76%, rgba(255,74,61,.16), transparent 32%),
      linear-gradient(120deg,rgba(255,255,255,.045),transparent 55%)!important;
    opacity:1!important;
    animation:none!important;
    z-index:0!important;
  }
  .mobile-supply-flow:after{display:none!important;content:none!important;animation:none!important;}
  .mobile-flow-head{display:none!important;}
  .mobile-flow-steps{position:absolute!important;inset:0!important;display:block!important;}
  .mobile-flow-steps:before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:42px!important;right:42px!important;top:50%!important;height:1px!important;
    background:linear-gradient(90deg,transparent,rgba(94,216,255,.46),rgba(255,255,255,.16),transparent)!important;
    transform:translateY(-50%)!important;
    z-index:1!important;
  }
  .mobile-flow-steps:after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    top:26px!important;bottom:26px!important;left:50%!important;width:1px!important;
    background:linear-gradient(180deg,transparent,rgba(94,216,255,.38),rgba(255,255,255,.12),transparent)!important;
    transform:translateX(-50%)!important;
    z-index:1!important;
  }
  .mobile-flow-arrow{display:none!important;}
  .mobile-flow-step{
    position:absolute!important;
    width:122px!important;
    height:55px!important;
    min-height:55px!important;
    display:grid!important;
    grid-template-columns:44px 1fr!important;
    align-items:center!important;
    gap:7px!important;
    padding:6px 8px!important;
    border-radius:17px!important;
    background:linear-gradient(145deg,rgba(255,255,255,.20),rgba(255,255,255,.07))!important;
    border:1px solid rgba(255,255,255,.25)!important;
    box-shadow:0 12px 34px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.23)!important;
    backdrop-filter:blur(18px) saturate(1.18)!important;
    -webkit-backdrop-filter:blur(18px) saturate(1.18)!important;
    overflow:hidden!important;
    z-index:4!important;
    animation:none!important;
    margin:0!important;
    filter:none!important;
  }
  .mobile-flow-step:nth-child(1){left:12px!important;top:12px!important;right:auto!important;bottom:auto!important;}
  .mobile-flow-step:nth-child(3){right:12px!important;top:18px!important;left:auto!important;bottom:auto!important;}
  .mobile-flow-step:nth-child(5){left:12px!important;bottom:12px!important;right:auto!important;top:auto!important;}
  .mobile-flow-step:nth-child(7){right:12px!important;bottom:12px!important;left:auto!important;top:auto!important;}
  .mobile-flow-step:before{
    content:""!important;
    position:absolute!important;
    inset:-1px!important;
    background:linear-gradient(135deg,rgba(255,255,255,.12),transparent 38%,rgba(4,163,223,.06))!important;
    z-index:0!important;
    border-radius:inherit!important;
  }
  .mobile-flow-step:after{display:none!important;content:none!important;animation:none!important;}
  .flow-thumb{
    position:relative!important;
    z-index:2!important;
    width:44px!important;height:40px!important;
    border-radius:13px!important;
    overflow:hidden!important;
    border:1px solid rgba(255,255,255,.26)!important;
    box-shadow:0 8px 18px rgba(0,0,0,.20)!important;
  }
  .flow-thumb img{width:100%!important;height:100%!important;object-fit:cover!important;filter:saturate(1.08) contrast(1.03)!important;}
  .flow-icon{
    position:absolute!important;
    left:38px!important;bottom:7px!important;
    z-index:3!important;
    width:16px!important;height:16px!important;
    border-radius:7px!important;
    font-size:9px!important;
    display:grid!important;place-items:center!important;
    background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.58),rgba(4,163,223,.25))!important;
    border:1px solid rgba(255,255,255,.30)!important;
    box-shadow:0 0 16px rgba(4,163,223,.26)!important;
  }
  .flow-copy{position:relative!important;z-index:2!important;text-align:left!important;min-width:0!important;margin:0!important;}
  .rtl .flow-copy{text-align:right!important;}
  .flow-copy b{
    display:block!important;color:#fff!important;font-size:7.7px!important;letter-spacing:.055em!important;line-height:1.05!important;text-transform:uppercase!important;
    white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
  }
  .flow-copy small{
    display:block!important;margin-top:3px!important;color:rgba(255,255,255,.70)!important;font-size:5.9px!important;line-height:1.05!important;
    white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
  }
}
@media(max-width:390px), (max-height:760px) and (max-width:760px){
  .mobile-supply-flow{height:142px!important;bottom:38px!important;width:calc(100vw - 20px)!important;border-radius:24px!important;}
  .mobile-flow-step{width:112px!important;height:50px!important;min-height:50px!important;grid-template-columns:39px 1fr!important;gap:6px!important;padding:5px 7px!important;border-radius:15px!important;}
  .mobile-flow-step:nth-child(1){left:10px!important;top:10px!important;}
  .mobile-flow-step:nth-child(3){right:10px!important;top:15px!important;}
  .mobile-flow-step:nth-child(5){left:10px!important;bottom:10px!important;}
  .mobile-flow-step:nth-child(7){right:10px!important;bottom:10px!important;}
  .flow-thumb{width:39px!important;height:36px!important;border-radius:12px!important;}
  .flow-icon{left:33px!important;bottom:6px!important;width:15px!important;height:15px!important;font-size:8px!important;}
  .flow-copy b{font-size:6.9px!important;}
  .flow-copy small{font-size:5.2px!important;}
}


/* === V31: polished mobile supply route - premium vertical glass path === */
@media(max-width:760px){
  .mobile-supply-flow{
    display:block!important;
    position:absolute!important;
    left:50%!important;
    bottom:40px!important;
    transform:translateX(-50%)!important;
    width:min(360px,calc(100vw - 30px))!important;
    height:178px!important;
    padding:12px 12px 10px 12px!important;
    border-radius:28px!important;
    background:
      radial-gradient(circle at 18% 8%,rgba(4,163,223,.24),transparent 28%),
      radial-gradient(circle at 86% 92%,rgba(255,74,61,.18),transparent 30%),
      linear-gradient(145deg,rgba(255,255,255,.18),rgba(255,255,255,.055))!important;
    border:1px solid rgba(255,255,255,.25)!important;
    box-shadow:0 24px 70px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.22)!important;
    backdrop-filter:blur(24px) saturate(1.25)!important;
    -webkit-backdrop-filter:blur(24px) saturate(1.25)!important;
    overflow:hidden!important;
    z-index:7!important;
  }
  .mobile-supply-flow:before{
    content:""!important;
    position:absolute!important;
    left:34px!important;top:42px!important;bottom:20px!important;width:2px!important;
    border-radius:20px!important;
    background:linear-gradient(180deg,rgba(76,213,255,.15),rgba(76,213,255,.72),rgba(255,255,255,.18))!important;
    box-shadow:0 0 18px rgba(4,163,223,.35)!important;
    opacity:1!important;
    z-index:1!important;
    animation:none!important;
    inset:auto!important;
  }
  .mobile-supply-flow:after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:29px!important;top:43px!important;width:12px!important;height:12px!important;
    border-radius:50%!important;
    background:radial-gradient(circle,#fff 0 18%,#62dcff 22% 55%,rgba(98,220,255,.15) 60% 100%)!important;
    box-shadow:0 0 20px rgba(98,220,255,.75)!important;
    z-index:3!important;
    animation:supplyRoutePulse 5.8s linear infinite!important;
  }
  @keyframes supplyRoutePulse{
    0%{top:43px;opacity:.7;transform:scale(.85)}
    18%{top:70px;opacity:1;transform:scale(1)}
    42%{top:99px;opacity:.92;transform:scale(.92)}
    68%{top:128px;opacity:1;transform:scale(1)}
    100%{top:151px;opacity:.65;transform:scale(.82)}
  }
  .mobile-flow-head{
    display:flex!important;
    align-items:center!important;
    gap:7px!important;
    height:18px!important;
    margin:0 0 6px 0!important;
    color:rgba(255,255,255,.78)!important;
    font-size:8px!important;
    line-height:1!important;
    font-weight:950!important;
    letter-spacing:.16em!important;
    text-transform:uppercase!important;
    position:relative!important;
    z-index:4!important;
  }
  .mobile-flow-head:before{
    content:""!important;width:7px!important;height:7px!important;border-radius:50%!important;
    background:#48d8ff!important;box-shadow:0 0 16px rgba(72,216,255,.75)!important;
  }
  .mobile-flow-steps{
    position:relative!important;
    inset:auto!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:7px!important;
    height:auto!important;
    z-index:4!important;
  }
  .mobile-flow-steps:before,.mobile-flow-steps:after{display:none!important;content:none!important;}
  .mobile-flow-arrow{display:none!important;}
  .mobile-flow-step{
    position:relative!important;
    left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
    width:auto!important;
    height:30px!important;
    min-height:30px!important;
    margin:0 0 0 34px!important;
    display:grid!important;
    grid-template-columns:32px 1fr auto!important;
    align-items:center!important;
    gap:8px!important;
    padding:4px 9px 4px 5px!important;
    border-radius:15px!important;
    background:linear-gradient(90deg,rgba(255,255,255,.18),rgba(255,255,255,.072))!important;
    border:1px solid rgba(255,255,255,.22)!important;
    box-shadow:0 9px 22px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.20)!important;
    backdrop-filter:blur(16px) saturate(1.18)!important;
    -webkit-backdrop-filter:blur(16px) saturate(1.18)!important;
    overflow:visible!important;
    z-index:4!important;
    animation:routeStepIn .7s ease both!important;
    filter:none!important;
  }
  .mobile-flow-step:nth-child(1){animation-delay:.03s!important;transform-origin:left center!important;}
  .mobile-flow-step:nth-child(3){animation-delay:.11s!important;margin-left:48px!important;}
  .mobile-flow-step:nth-child(5){animation-delay:.19s!important;margin-left:34px!important;}
  .mobile-flow-step:nth-child(7){animation-delay:.27s!important;margin-left:48px!important;}
  @keyframes routeStepIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
  .mobile-flow-step:before{
    content:""!important;
    position:absolute!important;
    left:-25px!important;top:50%!important;width:10px!important;height:10px!important;
    transform:translateY(-50%)!important;
    border-radius:50%!important;
    background:radial-gradient(circle,#fff 0 18%,#56d9ff 24% 58%,rgba(86,217,255,.16) 63% 100%)!important;
    box-shadow:0 0 18px rgba(86,217,255,.62)!important;
    z-index:4!important;
  }
  .mobile-flow-step:after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    inset:0!important;
    border-radius:inherit!important;
    background:linear-gradient(105deg,transparent 5%,rgba(255,255,255,.10) 38%,transparent 70%)!important;
    transform:translateX(-120%)!important;
    animation:routeSoftShine 7.8s ease-in-out infinite!important;
    pointer-events:none!important;
    z-index:1!important;
  }
  .mobile-flow-step:nth-child(3):after{animation-delay:.6s!important}.mobile-flow-step:nth-child(5):after{animation-delay:1.2s!important}.mobile-flow-step:nth-child(7):after{animation-delay:1.8s!important}
  @keyframes routeSoftShine{35%,100%{transform:translateX(130%)}}
  .flow-thumb{
    position:relative!important;
    z-index:3!important;
    width:32px!important;height:24px!important;
    border-radius:10px!important;
    overflow:hidden!important;
    border:1px solid rgba(255,255,255,.28)!important;
    box-shadow:0 6px 13px rgba(0,0,0,.18)!important;
  }
  .flow-thumb img{width:100%!important;height:100%!important;object-fit:cover!important;filter:saturate(1.12) contrast(1.05)!important;}
  .flow-icon{
    position:absolute!important;
    left:27px!important;bottom:-1px!important;
    z-index:5!important;width:14px!important;height:14px!important;border-radius:7px!important;
    display:grid!important;place-items:center!important;font-size:8px!important;
    background:radial-gradient(circle at 35% 25%,#fff 0 10%,rgba(4,163,223,.46) 42%,rgba(4,163,223,.20))!important;
    border:1px solid rgba(255,255,255,.30)!important;
    box-shadow:0 0 14px rgba(4,163,223,.35)!important;
  }
  .flow-copy{position:relative!important;z-index:3!important;text-align:left!important;min-width:0!important;margin:0!important;}
  .rtl .flow-copy{text-align:right!important;}
  .flow-copy b{display:block!important;color:#fff!important;font-size:8.2px!important;letter-spacing:.07em!important;line-height:1!important;text-transform:uppercase!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
  .flow-copy small{display:block!important;margin-top:2px!important;color:rgba(255,255,255,.70)!important;font-size:5.8px!important;line-height:1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
  .mobile-flow-step .flow-copy:after{
    content:"›"!important;
    position:absolute!important;right:-4px!important;top:50%!important;transform:translateY(-50%)!important;
    color:rgba(94,216,255,.72)!important;font-size:15px!important;font-weight:900!important;
  }
  .rtl .mobile-flow-step .flow-copy:after{right:auto!important;left:-4px!important;content:"‹"!important;}
}
@media(max-width:390px), (max-height:760px) and (max-width:760px){
  .mobile-supply-flow{width:calc(100vw - 22px)!important;height:166px!important;bottom:38px!important;padding:10px 10px 8px!important;border-radius:24px!important;}
  .mobile-flow-head{height:15px!important;font-size:7px!important;margin-bottom:5px!important;}
  .mobile-flow-steps{gap:6px!important;}
  .mobile-flow-step{height:28px!important;min-height:28px!important;grid-template-columns:29px 1fr auto!important;gap:7px!important;padding:4px 8px 4px 5px!important;border-radius:13px!important;margin-left:30px!important;}
  .mobile-flow-step:nth-child(3),.mobile-flow-step:nth-child(7){margin-left:42px!important;}
  .mobile-supply-flow:before{left:29px!important;top:38px!important;bottom:16px!important;}
  .mobile-supply-flow:after{left:24px!important;animation-name:supplyRoutePulseSmall!important;}
  @keyframes supplyRoutePulseSmall{0%{top:39px;opacity:.7}18%{top:64px;opacity:1}42%{top:91px;opacity:.92}68%{top:118px;opacity:1}100%{top:142px;opacity:.65}}
  .mobile-flow-step:before{left:-22px!important;width:9px!important;height:9px!important;}
  .flow-thumb{width:29px!important;height:22px!important;border-radius:9px!important;}
  .flow-icon{left:24px!important;width:13px!important;height:13px!important;font-size:7px!important;}
  .flow-copy b{font-size:7.4px!important}.flow-copy small{font-size:5.2px!important;}
}

/* === V32: redesigned mobile bottom supply journey — premium 2x2 glass mosaic === */
@media(max-width:760px){
  .mobile-supply-flow{
    display:block!important;
    position:absolute!important;
    left:50%!important;
    bottom:39px!important;
    transform:translateX(-50%)!important;
    width:min(386px,calc(100vw - 28px))!important;
    height:150px!important;
    padding:10px!important;
    border-radius:26px!important;
    background:
      radial-gradient(circle at 12% 14%,rgba(0,174,239,.24),transparent 30%),
      radial-gradient(circle at 92% 82%,rgba(255,74,61,.16),transparent 34%),
      linear-gradient(145deg,rgba(8,18,34,.62),rgba(255,255,255,.08))!important;
    border:1px solid rgba(255,255,255,.24)!important;
    box-shadow:0 24px 72px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.24)!important;
    backdrop-filter:blur(24px) saturate(1.28)!important;
    -webkit-backdrop-filter:blur(24px) saturate(1.28)!important;
    overflow:hidden!important;
    z-index:7!important;
  }
  .mobile-supply-flow:before{
    content:""!important;
    position:absolute!important;
    inset:10px!important;
    border-radius:21px!important;
    background:
      linear-gradient(90deg,transparent 49.5%,rgba(94,216,255,.30) 50%,transparent 50.5%),
      linear-gradient(180deg,transparent 49.5%,rgba(255,255,255,.15) 50%,transparent 50.5%)!important;
    box-shadow:none!important;
    opacity:.75!important;
    z-index:1!important;
    animation:none!important;
  }
  .mobile-supply-flow:after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    width:15px!important;
    height:15px!important;
    transform:translate(-50%,-50%)!important;
    border-radius:50%!important;
    background:radial-gradient(circle,#fff 0 18%,#4fd7ff 22% 58%,rgba(79,215,255,.14) 62% 100%)!important;
    box-shadow:0 0 0 7px rgba(4,163,223,.10),0 0 24px rgba(79,215,255,.80)!important;
    z-index:5!important;
    animation:centerPulse 3.8s ease-in-out infinite!important;
  }
  @keyframes centerPulse{50%{transform:translate(-50%,-50%) scale(1.12);opacity:.82}}
  .mobile-flow-head{display:none!important;}
  .mobile-flow-steps{
    position:relative!important;
    inset:auto!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    grid-template-rows:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    height:100%!important;
    z-index:4!important;
  }
  .mobile-flow-steps:before,.mobile-flow-steps:after,.mobile-flow-arrow{display:none!important;content:none!important;}
  .mobile-flow-step{
    position:relative!important;
    left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
    width:auto!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:7px 7px!important;
    display:grid!important;
    grid-template-columns:42px minmax(0,1fr)!important;
    align-items:center!important;
    gap:7px!important;
    border-radius:18px!important;
    background:
      linear-gradient(135deg,rgba(255,255,255,.20),rgba(255,255,255,.065)),
      radial-gradient(circle at 0% 0%,rgba(94,216,255,.12),transparent 42%)!important;
    border:1px solid rgba(255,255,255,.23)!important;
    box-shadow:0 14px 34px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.22)!important;
    backdrop-filter:blur(18px) saturate(1.22)!important;
    -webkit-backdrop-filter:blur(18px) saturate(1.22)!important;
    overflow:hidden!important;
    z-index:4!important;
    animation:mosaicLift .8s cubic-bezier(.2,.8,.2,1) both!important;
    filter:none!important;
  }
  .mobile-flow-step:nth-child(1){animation-delay:.02s!important;}
  .mobile-flow-step:nth-child(3){animation-delay:.10s!important;}
  .mobile-flow-step:nth-child(5){animation-delay:.18s!important;}
  .mobile-flow-step:nth-child(7){animation-delay:.26s!important;}
  @keyframes mosaicLift{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
  .mobile-flow-step:before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    border-radius:inherit!important;
    background:linear-gradient(120deg,rgba(255,255,255,.10),transparent 42%,rgba(4,163,223,.055))!important;
    z-index:1!important;
    transform:none!important;
    box-shadow:none!important;
  }
  .mobile-flow-step:after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    inset:0!important;
    border-radius:inherit!important;
    background:linear-gradient(110deg,transparent 0%,rgba(255,255,255,.12) 42%,transparent 76%)!important;
    transform:translateX(-130%)!important;
    animation:mosaicShine 8.5s ease-in-out infinite!important;
    z-index:2!important;
    pointer-events:none!important;
  }
  .mobile-flow-step:nth-child(3):after{animation-delay:.8s!important}.mobile-flow-step:nth-child(5):after{animation-delay:1.6s!important}.mobile-flow-step:nth-child(7):after{animation-delay:2.4s!important}
  @keyframes mosaicShine{38%,100%{transform:translateX(135%)}}
  .flow-thumb{
    position:relative!important;
    z-index:3!important;
    width:42px!important;height:42px!important;
    border-radius:15px!important;
    overflow:hidden!important;
    border:1px solid rgba(255,255,255,.30)!important;
    box-shadow:0 8px 20px rgba(0,0,0,.23)!important;
  }
  .flow-thumb img{width:100%!important;height:100%!important;object-fit:cover!important;filter:saturate(1.12) contrast(1.05)!important;}
  .flow-icon{
    position:absolute!important;
    left:36px!important;bottom:7px!important;
    z-index:5!important;width:17px!important;height:17px!important;border-radius:8px!important;
    display:grid!important;place-items:center!important;font-size:9px!important;
    background:radial-gradient(circle at 35% 25%,#fff 0 10%,rgba(4,163,223,.50) 46%,rgba(4,163,223,.22))!important;
    border:1px solid rgba(255,255,255,.34)!important;
    box-shadow:0 0 16px rgba(4,163,223,.42)!important;
  }
  .flow-copy{position:relative!important;z-index:3!important;text-align:left!important;min-width:0!important;margin:0!important;}
  .rtl .flow-copy{text-align:right!important;}
  .flow-copy b{display:block!important;color:#fff!important;font-size:8.4px!important;letter-spacing:.075em!important;line-height:1.05!important;text-transform:uppercase!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
  .flow-copy small{display:block!important;margin-top:3px!important;color:rgba(255,255,255,.72)!important;font-size:5.6px!important;line-height:1.08!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
  .mobile-flow-step .flow-copy:after{display:none!important;content:none!important;}
}
@media(max-width:390px), (max-height:760px) and (max-width:760px){
  .mobile-supply-flow{height:140px!important;bottom:38px!important;width:calc(100vw - 22px)!important;padding:9px!important;border-radius:24px!important;}
  .mobile-flow-steps{gap:7px!important;}
  .mobile-flow-step{grid-template-columns:38px minmax(0,1fr)!important;gap:6px!important;padding:6px!important;border-radius:16px!important;}
  .flow-thumb{width:38px!important;height:38px!important;border-radius:13px!important;}
  .flow-icon{left:32px!important;bottom:6px!important;width:15px!important;height:15px!important;font-size:8px!important;}
  .flow-copy b{font-size:7.6px!important;letter-spacing:.055em!important;}
  .flow-copy small{font-size:5px!important;margin-top:2px!important;}
}

/* === V33: premium mobile desktop-like supply composition (not orbit, not cramped grid) === */
@media(max-width:760px){
  .mobile-supply-flow{
    display:block!important;
    position:absolute!important;
    left:50%!important;
    bottom:38px!important;
    transform:translateX(-50%)!important;
    width:min(390px,calc(100vw - 24px))!important;
    height:150px!important;
    padding:0!important;
    border-radius:28px!important;
    background:
      radial-gradient(circle at 18% 18%,rgba(4,163,223,.26),transparent 29%),
      radial-gradient(circle at 92% 78%,rgba(238,53,47,.16),transparent 34%),
      linear-gradient(135deg,rgba(9,21,39,.68),rgba(255,255,255,.075))!important;
    border:1px solid rgba(255,255,255,.25)!important;
    box-shadow:0 25px 72px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.22)!important;
    backdrop-filter:blur(24px) saturate(1.22)!important;
    -webkit-backdrop-filter:blur(24px) saturate(1.22)!important;
    overflow:hidden!important;
    z-index:8!important;
  }
  .mobile-supply-flow:before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    border-radius:inherit!important;
    background:
      linear-gradient(112deg,transparent 0%,rgba(255,255,255,.10) 44%,transparent 69%),
      radial-gradient(circle at 50% 58%,rgba(79,215,255,.12),transparent 42%)!important;
    opacity:.78!important;
    z-index:1!important;
    animation:mobilePanelSheen 8.5s ease-in-out infinite!important;
  }
  @keyframes mobilePanelSheen{0%,58%{transform:translateX(-65%)}100%{transform:translateX(70%)}}
  .mobile-supply-flow:after{
    content:""!important;
    position:absolute!important;
    left:50%!important;top:50%!important;
    width:11px!important;height:11px!important;
    transform:translate(-50%,-50%)!important;
    border-radius:50%!important;
    background:radial-gradient(circle,#fff 0 18%,#58dcff 22% 60%,rgba(88,220,255,.15) 64% 100%)!important;
    box-shadow:0 0 0 8px rgba(4,163,223,.08),0 0 24px rgba(88,220,255,.75)!important;
    z-index:5!important;
    animation:softPulseDot 3.8s ease-in-out infinite!important;
  }
  @keyframes softPulseDot{50%{opacity:.72;transform:translate(-50%,-50%) scale(1.18)}}
  .mobile-flow-head{display:none!important;}
  .mobile-flow-steps{
    position:absolute!important;
    inset:9px!important;
    display:block!important;
    height:auto!important;
    z-index:4!important;
  }
  .mobile-flow-steps:before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:78px!important;right:72px!important;top:32px!important;bottom:32px!important;
    background:
      linear-gradient(35deg,transparent 0 47%,rgba(88,220,255,.32) 48% 51%,transparent 52% 100%),
      linear-gradient(145deg,transparent 0 47%,rgba(255,255,255,.22) 48% 51%,transparent 52% 100%)!important;
    filter:drop-shadow(0 0 8px rgba(88,220,255,.30))!important;
    opacity:.85!important;
    z-index:1!important;
  }
  .mobile-flow-steps:after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:50%!important;top:50%!important;
    width:54px!important;height:54px!important;
    transform:translate(-50%,-50%)!important;
    border-radius:50%!important;
    border:1px solid rgba(88,220,255,.20)!important;
    background:radial-gradient(circle,rgba(88,220,255,.10),transparent 64%)!important;
    z-index:1!important;
  }
  .mobile-flow-arrow{display:none!important;}
  .mobile-flow-step{
    position:absolute!important;
    display:grid!important;
    grid-template-columns:44px minmax(0,1fr)!important;
    align-items:center!important;
    gap:8px!important;
    height:46px!important;
    min-height:46px!important;
    width:142px!important;
    margin:0!important;
    padding:6px 8px!important;
    border-radius:18px!important;
    background:linear-gradient(135deg,rgba(255,255,255,.20),rgba(255,255,255,.07))!important;
    border:1px solid rgba(255,255,255,.25)!important;
    box-shadow:0 14px 35px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.20)!important;
    backdrop-filter:blur(18px) saturate(1.18)!important;
    -webkit-backdrop-filter:blur(18px) saturate(1.18)!important;
    overflow:hidden!important;
    z-index:4!important;
    animation:routeCardIn .85s cubic-bezier(.2,.82,.2,1) both!important;
  }
  @keyframes routeCardIn{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
  .mobile-flow-step:before{
    content:""!important;
    position:absolute!important;inset:0!important;
    border-radius:inherit!important;
    background:linear-gradient(110deg,rgba(255,255,255,.09),transparent 42%,rgba(4,163,223,.06))!important;
    z-index:1!important;
  }
  .mobile-flow-step:after{
    content:""!important;
    position:absolute!important;inset:0!important;
    border-radius:inherit!important;
    background:linear-gradient(110deg,transparent 5%,rgba(255,255,255,.13) 42%,transparent 73%)!important;
    transform:translateX(-135%)!important;
    animation:routeCardShine 9s ease-in-out infinite!important;
    z-index:2!important;
    pointer-events:none!important;
  }
  @keyframes routeCardShine{36%,100%{transform:translateX(135%)}}
  .mobile-flow-step:nth-child(1){left:0!important;top:0!important;width:130px!important;animation-delay:.04s!important;}
  .mobile-flow-step:nth-child(3){right:0!important;top:10px!important;width:150px!important;animation-delay:.14s!important;}
  .mobile-flow-step:nth-child(5){left:20px!important;bottom:7px!important;width:156px!important;animation-delay:.24s!important;}
  .mobile-flow-step:nth-child(7){right:12px!important;bottom:0!important;width:136px!important;animation-delay:.34s!important;}
  .flow-thumb{
    position:relative!important;z-index:3!important;
    width:44px!important;height:34px!important;
    border-radius:13px!important;overflow:hidden!important;
    border:1px solid rgba(255,255,255,.34)!important;
    box-shadow:0 8px 20px rgba(0,0,0,.28)!important;
  }
  .flow-thumb img{width:100%!important;height:100%!important;object-fit:cover!important;filter:saturate(1.1) contrast(1.05)!important;}
  .flow-icon{
    position:absolute!important;left:39px!important;bottom:6px!important;
    z-index:6!important;width:16px!important;height:16px!important;border-radius:50%!important;
    display:grid!important;place-items:center!important;font-size:8px!important;
    background:radial-gradient(circle at 35% 25%,#fff 0 12%,rgba(4,163,223,.56) 46%,rgba(4,163,223,.22))!important;
    border:1px solid rgba(255,255,255,.36)!important;
    box-shadow:0 0 16px rgba(4,163,223,.50)!important;
  }
  .flow-copy{position:relative!important;z-index:3!important;text-align:left!important;min-width:0!important;}
  .rtl .flow-copy{text-align:right!important;}
  .flow-copy b{display:block!important;color:#fff!important;font-size:8.2px!important;letter-spacing:.075em!important;line-height:1!important;text-transform:uppercase!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
  .flow-copy small{display:block!important;margin-top:3px!important;color:rgba(255,255,255,.70)!important;font-size:5.5px!important;line-height:1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
  .mobile-flow-step .flow-copy:after{display:none!important;content:none!important;}
}
@media(max-width:390px), (max-height:760px) and (max-width:760px){
  .mobile-supply-flow{height:136px!important;bottom:36px!important;width:calc(100vw - 22px)!important;border-radius:24px!important;}
  .mobile-flow-steps{inset:8px!important;}
  .mobile-flow-step{height:40px!important;min-height:40px!important;grid-template-columns:37px minmax(0,1fr)!important;gap:6px!important;padding:5px 6px!important;border-radius:15px!important;}
  .mobile-flow-step:nth-child(1){width:112px!important;}
  .mobile-flow-step:nth-child(3){width:132px!important;}
  .mobile-flow-step:nth-child(5){width:136px!important;left:15px!important;bottom:5px!important;}
  .mobile-flow-step:nth-child(7){width:122px!important;right:8px!important;}
  .flow-thumb{width:37px!important;height:30px!important;border-radius:11px!important;}
  .flow-icon{left:32px!important;bottom:5px!important;width:14px!important;height:14px!important;font-size:7px!important;}
  .flow-copy b{font-size:7.2px!important;letter-spacing:.055em!important;}
  .flow-copy small{font-size:4.9px!important;margin-top:2px!important;}
  .mobile-flow-steps:before{left:62px!important;right:58px!important;top:28px!important;bottom:28px!important;}
}

/* === V34 FINAL: mobile premium desktop-inspired supply scene, balanced and readable === */
@media(max-width:760px){
  .mobile-supply-flow{
    display:block!important;
    position:absolute!important;
    left:50%!important;
    bottom:39px!important;
    transform:translateX(-50%)!important;
    width:min(374px,calc(100vw - 26px))!important;
    height:166px!important;
    padding:10px!important;
    border-radius:28px!important;
    background:
      radial-gradient(circle at 12% 18%,rgba(4,163,223,.24),transparent 32%),
      radial-gradient(circle at 92% 84%,rgba(238,53,47,.16),transparent 34%),
      linear-gradient(145deg,rgba(5,18,35,.72),rgba(255,255,255,.075))!important;
    border:1px solid rgba(255,255,255,.24)!important;
    box-shadow:0 24px 72px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.22)!important;
    backdrop-filter:blur(24px) saturate(1.22)!important;
    -webkit-backdrop-filter:blur(24px) saturate(1.22)!important;
    overflow:hidden!important;
    z-index:8!important;
  }
  .mobile-supply-flow:before{
    content:""!important;
    position:absolute!important;
    left:20px!important;right:20px!important;top:50%!important;height:64px!important;
    transform:translateY(-50%)!important;
    background:url("data:image/svg+xml,%3Csvg width='340' height='72' viewBox='0 0 340 72' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18 16 C86 16 84 56 154 56 C226 56 218 16 322 16' stroke='rgba(94,216,255,.34)' stroke-width='2.2' stroke-linecap='round'/%3E%3Cpath d='M18 16 C86 16 84 56 154 56 C226 56 218 16 322 16' stroke='rgba(255,255,255,.14)' stroke-width='7' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat!important;
    opacity:.88!important;
    z-index:1!important;
    border:0!important;border-radius:0!important;box-shadow:none!important;filter:none!important;animation:none!important;
  }
  .mobile-supply-flow:after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:50%!important;top:50%!important;
    width:10px!important;height:10px!important;
    transform:translate(-50%,-50%)!important;
    border-radius:50%!important;
    background:radial-gradient(circle,#fff 0 20%,#57dfff 24% 62%,rgba(87,223,255,.14) 66% 100%)!important;
    box-shadow:0 0 0 7px rgba(4,163,223,.08),0 0 24px rgba(87,223,255,.78)!important;
    z-index:3!important;
    animation:v34CenterPulse 4.6s ease-in-out infinite!important;
  }
  @keyframes v34CenterPulse{50%{opacity:.66;transform:translate(-50%,-50%) scale(1.18)}}
  .mobile-flow-head{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    height:16px!important;
    margin:0!important;
    color:rgba(255,255,255,.76)!important;
    font-size:8px!important;
    line-height:1!important;
    font-weight:950!important;
    letter-spacing:.18em!important;
    text-transform:uppercase!important;
    position:relative!important;
    z-index:6!important;
  }
  .mobile-flow-head:before{content:""!important;width:6px!important;height:6px!important;border-radius:50%!important;background:#57dfff!important;box-shadow:0 0 15px rgba(87,223,255,.8)!important;margin-inline-end:7px!important;}
  .mobile-flow-steps{
    position:absolute!important;
    inset:30px 10px 10px!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    grid-template-rows:1fr 1fr!important;
    gap:10px!important;
    height:auto!important;
    z-index:4!important;
  }
  .mobile-flow-steps:before,.mobile-flow-steps:after,.mobile-flow-arrow{display:none!important;content:none!important;}
  .mobile-flow-step{
    position:relative!important;
    left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
    width:auto!important;height:auto!important;min-height:0!important;margin:0!important;
    display:grid!important;
    grid-template-columns:52px minmax(0,1fr)!important;
    align-items:center!important;
    gap:8px!important;
    padding:7px 8px!important;
    border-radius:18px!important;
    background:
      linear-gradient(135deg,rgba(255,255,255,.21),rgba(255,255,255,.07)),
      radial-gradient(circle at 18% 18%,rgba(94,216,255,.10),transparent 42%)!important;
    border:1px solid rgba(255,255,255,.25)!important;
    box-shadow:0 14px 34px rgba(0,0,0,.23), inset 0 1px 0 rgba(255,255,255,.23)!important;
    backdrop-filter:blur(18px) saturate(1.18)!important;
    -webkit-backdrop-filter:blur(18px) saturate(1.18)!important;
    overflow:hidden!important;
    z-index:4!important;
    animation:v34CardIn .7s cubic-bezier(.2,.82,.2,1) both!important;
    filter:none!important;
  }
  .mobile-flow-step:nth-child(1){grid-column:1;grid-row:1;transform:translateY(-2px)!important;animation-delay:.03s!important;}
  .mobile-flow-step:nth-child(3){grid-column:2;grid-row:1;transform:translateY(6px)!important;animation-delay:.10s!important;}
  .mobile-flow-step:nth-child(5){grid-column:1;grid-row:2;transform:translateY(-6px)!important;animation-delay:.17s!important;}
  .mobile-flow-step:nth-child(7){grid-column:2;grid-row:2;transform:translateY(2px)!important;animation-delay:.24s!important;}
  @keyframes v34CardIn{from{opacity:0;filter:blur(2px);scale:.97}to{opacity:1;filter:blur(0);scale:1}}
  .mobile-flow-step:before{
    content:""!important;position:absolute!important;inset:0!important;border-radius:inherit!important;
    background:linear-gradient(115deg,rgba(255,255,255,.10),transparent 40%,rgba(4,163,223,.055))!important;
    z-index:1!important;box-shadow:none!important;transform:none!important;
  }
  .mobile-flow-step:after{
    content:""!important;display:block!important;position:absolute!important;inset:0!important;border-radius:inherit!important;
    background:linear-gradient(110deg,transparent 0%,rgba(255,255,255,.12) 42%,transparent 74%)!important;
    transform:translateX(-130%)!important;animation:v34Shine 9s ease-in-out infinite!important;z-index:2!important;pointer-events:none!important;
  }
  .mobile-flow-step:nth-child(3):after{animation-delay:.8s!important}.mobile-flow-step:nth-child(5):after{animation-delay:1.6s!important}.mobile-flow-step:nth-child(7):after{animation-delay:2.4s!important}
  @keyframes v34Shine{38%,100%{transform:translateX(135%)}}
  .flow-thumb{position:relative!important;z-index:3!important;width:52px!important;height:42px!important;border-radius:14px!important;overflow:hidden!important;border:1px solid rgba(255,255,255,.32)!important;box-shadow:0 8px 20px rgba(0,0,0,.24)!important;}
  .flow-thumb img{width:100%!important;height:100%!important;object-fit:cover!important;filter:saturate(1.12) contrast(1.04)!important;}
  .flow-icon{position:absolute!important;left:44px!important;bottom:7px!important;z-index:6!important;width:17px!important;height:17px!important;border-radius:50%!important;display:grid!important;place-items:center!important;font-size:9px!important;background:radial-gradient(circle at 35% 25%,#fff 0 12%,rgba(4,163,223,.55) 46%,rgba(4,163,223,.22))!important;border:1px solid rgba(255,255,255,.36)!important;box-shadow:0 0 16px rgba(4,163,223,.46)!important;}
  .flow-copy{position:relative!important;z-index:3!important;text-align:left!important;min-width:0!important;margin:0!important;}
  .rtl .flow-copy{text-align:right!important;}
  .flow-copy b{display:block!important;color:#fff!important;font-size:8.6px!important;letter-spacing:.07em!important;line-height:1.05!important;text-transform:uppercase!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
  .flow-copy small{display:block!important;margin-top:3px!important;color:rgba(255,255,255,.72)!important;font-size:5.7px!important;line-height:1.05!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
  .mobile-flow-step .flow-copy:after{display:none!important;content:none!important;}
}
@media(max-width:390px), (max-height:760px) and (max-width:760px){
  .mobile-supply-flow{width:calc(100vw - 22px)!important;height:150px!important;bottom:36px!important;border-radius:24px!important;}
  .mobile-flow-head{height:14px!important;font-size:7px!important;}
  .mobile-flow-steps{inset:28px 8px 9px!important;gap:8px!important;}
  .mobile-flow-step{grid-template-columns:44px minmax(0,1fr)!important;gap:6px!important;padding:6px!important;border-radius:15px!important;}
  .flow-thumb{width:44px!important;height:36px!important;border-radius:12px!important;}
  .flow-icon{left:37px!important;bottom:6px!important;width:15px!important;height:15px!important;font-size:8px!important;}
  .flow-copy b{font-size:7.7px!important;letter-spacing:.055em!important;}
  .flow-copy small{font-size:5px!important;margin-top:2px!important;}
}

/* === V35 FINAL MOBILE SUPPLY CHAIN REDESIGN ===
   Goal: replace the cramped/overlapping mobile supply-chain block with a clean,
   desktop-inspired premium visual mosaic that stays inside the first landing view. */
@media (max-width: 768px){
  .hero{
    min-height: 100svh !important;
    height: 100svh !important;
    overflow: hidden !important;
  }
  .hero-content{
    padding-top: 96px !important;
    position: relative !important;
    z-index: 8 !important;
  }
  .headline{
    font-size: clamp(39px, 10.4vw, 52px) !important;
    line-height: .88 !important;
    letter-spacing: -.055em !important;
    max-width: 96% !important;
    margin-bottom: 10px !important;
  }
  .sub{
    max-width: 95% !important;
    font-size: 10.6px !important;
    line-height: 1.45 !important;
    margin-bottom: 13px !important;
  }
  .cta-row{
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    max-width: 94% !important;
    margin-bottom: 8px !important;
  }
  .cta-row .btn{
    width: auto !important;
    min-height: 38px !important;
    height: 38px !important;
    padding: 0 9px !important;
    font-size: 9.5px !important;
    border-radius: 999px !important;
  }
  .hero-proof-row{
    max-width: 94% !important;
    gap: 6px !important;
    margin-top: 0 !important;
  }
  .hero-proof-row span{
    min-height: 22px !important;
    padding: 0 8px !important;
    font-size: 7.6px !important;
    border-radius: 999px !important;
    white-space: nowrap !important;
  }

  /* Mobile supply block: elegant glass mosaic, no orbit, no overlapping, no snake path. */
  .mobile-supply-flow{
    display: block !important;
    position: absolute !important;
    left: 14px !important;
    right: 14px !important;
    bottom: 36px !important;
    width: auto !important;
    height: 142px !important;
    padding: 9px !important;
    z-index: 9 !important;
    border-radius: 27px !important;
    overflow: hidden !important;
    background:
      radial-gradient(circle at 18% 10%, rgba(0,163,223,.26), transparent 30%),
      radial-gradient(circle at 84% 82%, rgba(255,74,61,.18), transparent 34%),
      linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,.07)) !important;
    border: 1px solid rgba(255,255,255,.30) !important;
    box-shadow: 0 24px 55px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.32) !important;
    backdrop-filter: blur(18px) saturate(138%) !important;
    -webkit-backdrop-filter: blur(18px) saturate(138%) !important;
    transform: none !important;
    animation: none !important;
  }
  .mobile-supply-flow:before{
    content:"" !important;
    position:absolute !important;
    inset: 8px !important;
    width:auto !important;
    height:auto !important;
    border-radius: 21px !important;
    background:
      linear-gradient(90deg, transparent 0 47%, rgba(255,255,255,.18) 47% 53%, transparent 53% 100%),
      linear-gradient(0deg, transparent 0 47%, rgba(255,255,255,.18) 47% 53%, transparent 53% 100%) !important;
    opacity: .55 !important;
    filter: none !important;
    animation: none !important;
    pointer-events:none !important;
  }
  .mobile-supply-flow:after{
    content:"" !important;
    position:absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: 9px !important;
    height: 9px !important;
    margin: -4.5px 0 0 -4.5px !important;
    border-radius: 999px !important;
    background: #43d7ff !important;
    box-shadow: 0 0 18px rgba(67,215,255,.95), 0 0 40px rgba(67,215,255,.45) !important;
    animation: mobileCenterPulse 2.8s ease-in-out infinite !important;
    pointer-events:none !important;
  }
  @keyframes mobileCenterPulse{50%{transform:scale(1.35);opacity:.72}}
  .mobile-flow-head,
  .mobile-flow-arrow{
    display: none !important;
  }
  .mobile-flow-steps{
    position: relative !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: 1fr 1fr !important;
    gap: 8px !important;
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    transform: none !important;
    animation: none !important;
  }
  .mobile-flow-steps:before,
  .mobile-flow-steps:after{
    display: none !important;
  }
  .mobile-flow-step{
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    border-radius: 18px !important;
    overflow: hidden !important;
    display: block !important;
    border: 1px solid rgba(255,255,255,.26) !important;
    background: rgba(255,255,255,.08) !important;
    box-shadow: 0 14px 32px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.24) !important;
    transform: none !important;
    animation: mobileMosaicIn .62s cubic-bezier(.2,.85,.25,1) both !important;
  }
  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(5),
  .mobile-flow-step:nth-child(7){
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
  }
  .mobile-flow-step:nth-child(3){animation-delay:.08s!important;}
  .mobile-flow-step:nth-child(5){animation-delay:.16s!important;}
  .mobile-flow-step:nth-child(7){animation-delay:.24s!important;}
  @keyframes mobileMosaicIn{from{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
  .mobile-flow-step:before{
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    border-radius: inherit !important;
    background: linear-gradient(180deg, rgba(4,18,37,.04), rgba(4,18,37,.68)) !important;
    z-index:1 !important;
    opacity:1 !important;
    width:auto!important;height:auto!important;
    box-shadow:none!important;
    animation:none!important;
  }
  .mobile-flow-step:after{
    content:"" !important;
    position:absolute !important;
    left: 9px !important;
    top: 9px !important;
    width: 7px !important;
    height: 7px !important;
    border-radius: 50% !important;
    background: #43d7ff !important;
    box-shadow: 0 0 14px rgba(67,215,255,.9) !important;
    z-index: 4 !important;
    animation: none !important;
  }
  .flow-thumb{
    position:absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border-radius: inherit !important;
    overflow: hidden !important;
    border: 0 !important;
    box-shadow: none !important;
    opacity: .88 !important;
    transform: none !important;
  }
  .flow-thumb img{
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    filter: saturate(1.08) contrast(1.04) brightness(.78) !important;
    transform: scale(1.04) !important;
  }
  .flow-copy{
    position:absolute !important;
    left: 10px !important;
    right: 8px !important;
    bottom: 8px !important;
    z-index: 3 !important;
    min-width: 0 !important;
  }
  .flow-copy b{
    display:block !important;
    color:#fff !important;
    font-size: 9px !important;
    line-height: 1 !important;
    font-weight: 950 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    text-shadow: 0 2px 12px rgba(0,0,0,.85) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .flow-copy small{
    display:block !important;
    margin-top: 4px !important;
    color: rgba(255,255,255,.82) !important;
    font-size: 7.3px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    letter-spacing: .01em !important;
    text-shadow: 0 2px 10px rgba(0,0,0,.8) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .flow-icon{
    position:absolute !important;
    right: 7px !important;
    top: 7px !important;
    z-index: 4 !important;
    width: 22px !important;
    height: 22px !important;
    border-radius: 999px !important;
    display:grid !important;
    place-items:center !important;
    font-size: 12px !important;
    background: rgba(4,18,37,.50) !important;
    border: 1px solid rgba(255,255,255,.25) !important;
    backdrop-filter: blur(9px) !important;
    -webkit-backdrop-filter: blur(9px) !important;
    box-shadow: 0 8px 18px rgba(0,0,0,.22) !important;
  }
  .hero-brand-ticker{
    height: 28px !important;
    min-height: 28px !important;
    bottom: 0 !important;
    z-index: 10 !important;
  }
  .hero-ticker-label{display:none!important;}
  .hero-brand-chip{
    min-width: 92px !important;
    height: 20px !important;
    font-size: 7.4px !important;
    border-radius: 999px !important;
  }
}

@media (max-width: 380px){
  .mobile-supply-flow{height:132px!important;bottom:32px!important;padding:8px!important;}
  .mobile-flow-steps{gap:6px!important;}
  .flow-copy b{font-size:8.2px!important;}
  .flow-copy small{font-size:6.8px!important;}
  .flow-icon{width:20px!important;height:20px!important;font-size:11px!important;}
  .headline{font-size:clamp(35px, 10vw, 45px)!important;}
  .sub{font-size:9.8px!important;}
}

/* === V36: premium mobile supply journey matching the desktop composition === */
@media (max-width:760px){
  .hero{
    height:auto!important;
    min-height:1320px!important;
    overflow:hidden!important;
    padding-bottom:0!important;
  }
  .hero-content{
    padding-top:86px!important;
    padding-bottom:0!important;
  }
  .hero-glass-stats{display:none!important}
  .mobile-supply-flow{
    display:block!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:40px!important;
    width:100%!important;
    height:720px!important;
    padding:0 18px!important;
    border:0!important;
    border-radius:0!important;
    background:none!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    overflow:visible!important;
    transform:none!important;
    z-index:8!important;
  }
  .mobile-supply-flow:before,
  .mobile-supply-flow:after{display:none!important}
  .mobile-flow-head{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    height:28px!important;
    margin:0 0 12px!important;
    color:rgba(255,255,255,.75)!important;
    font-size:9px!important;
    font-weight:950!important;
    letter-spacing:.18em!important;
    text-transform:uppercase!important;
  }
  .mobile-flow-steps{
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    gap:14px!important;
    width:100%!important;
    height:auto!important;
    padding:0!important;
    overflow:visible!important;
  }
  .mobile-flow-steps:before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:50%!important;
    top:26px!important;
    bottom:26px!important;
    width:2px!important;
    transform:translateX(-50%)!important;
    background:linear-gradient(180deg,#27c7ff 0%,#27c7ff 34%,#78d86b 66%,#f54d91 100%)!important;
    box-shadow:0 0 14px rgba(39,199,255,.65)!important;
    border-radius:999px!important;
    opacity:.9!important;
  }
  .mobile-flow-step{
    position:relative!important;
    display:grid!important;
    grid-template-columns:1fr 1.15fr!important;
    align-items:stretch!important;
    width:91%!important;
    height:132px!important;
    min-height:132px!important;
    padding:0!important;
    border-radius:24px!important;
    overflow:hidden!important;
    border:1px solid rgba(255,255,255,.27)!important;
    background:linear-gradient(135deg,rgba(5,18,38,.88),rgba(5,18,38,.48))!important;
    box-shadow:0 20px 52px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.18)!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
    animation:mobileJourneyIn .75s cubic-bezier(.2,.8,.2,1) both!important;
  }
  .mobile-flow-step:nth-of-type(odd){align-self:flex-start!important}
  .mobile-flow-step:nth-of-type(even){align-self:flex-end!important;grid-template-columns:1.15fr 1fr!important}
  .mobile-flow-step:nth-of-type(even) .flow-thumb{grid-column:1!important}
  .mobile-flow-step:nth-of-type(even) .flow-copy{grid-column:2!important;text-align:right!important;align-items:flex-end!important}
  .rtl .mobile-flow-step:nth-of-type(even) .flow-copy{text-align:left!important;align-items:flex-start!important}
  .mobile-flow-step:nth-of-type(2){animation-delay:.08s!important}
  .mobile-flow-step:nth-of-type(3){animation-delay:.16s!important}
  .mobile-flow-step:nth-of-type(4){animation-delay:.24s!important}
  @keyframes mobileJourneyIn{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
  .mobile-flow-step:before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:2!important;
    background:linear-gradient(90deg,rgba(4,16,34,.96) 0%,rgba(4,16,34,.76) 38%,rgba(4,16,34,.06) 72%)!important;
    pointer-events:none!important;
  }
  .mobile-flow-step:nth-of-type(even):before{
    background:linear-gradient(270deg,rgba(4,16,34,.96) 0%,rgba(4,16,34,.76) 38%,rgba(4,16,34,.06) 72%)!important;
  }
  .mobile-flow-step:after{
    content:""!important;
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    width:10px!important;
    height:10px!important;
    transform:translate(-50%,-50%)!important;
    border-radius:50%!important;
    background:#36ceff!important;
    box-shadow:0 0 0 5px rgba(54,206,255,.14),0 0 22px rgba(54,206,255,.95)!important;
    z-index:6!important;
  }
  .step-warehouse:after{background:#f5b92f!important;box-shadow:0 0 0 5px rgba(245,185,47,.14),0 0 22px rgba(245,185,47,.9)!important}
  .step-distribution:after{background:#74d26a!important;box-shadow:0 0 0 5px rgba(116,210,106,.14),0 0 22px rgba(116,210,106,.9)!important}
  .step-retail:after{background:#f05292!important;box-shadow:0 0 0 5px rgba(240,82,146,.14),0 0 22px rgba(240,82,146,.9)!important}
  .flow-thumb{
    position:relative!important;
    inset:auto!important;
    grid-column:2!important;
    grid-row:1!important;
    width:100%!important;
    height:100%!important;
    border:0!important;
    border-radius:0!important;
    opacity:1!important;
    overflow:hidden!important;
    z-index:1!important;
  }
  .flow-thumb img{width:100%!important;height:100%!important;object-fit:cover!important;filter:saturate(.92) contrast(1.04) brightness(.82)!important;transform:scale(1.03)!important}
  .flow-copy{
    position:relative!important;
    left:auto!important;right:auto!important;bottom:auto!important;
    grid-column:1!important;
    grid-row:1!important;
    z-index:4!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:flex-start!important;
    padding:22px 16px!important;
    min-width:0!important;
  }
  .flow-copy b{
    display:block!important;
    font-size:16px!important;
    line-height:1!important;
    font-weight:950!important;
    letter-spacing:.025em!important;
    color:#fff!important;
    text-shadow:0 4px 18px rgba(0,0,0,.65)!important;
    white-space:normal!important;
  }
  .flow-copy small{
    display:block!important;
    margin-top:10px!important;
    color:rgba(255,255,255,.78)!important;
    font-size:10.5px!important;
    line-height:1.45!important;
    font-weight:650!important;
    white-space:normal!important;
    overflow:visible!important;
  }
  .flow-number{
    position:absolute!important;
    z-index:5!important;
    top:13px!important;
    left:16px!important;
    color:#2ccaff!important;
    font-size:12px!important;
    font-weight:950!important;
    letter-spacing:.08em!important;
  }
  .mobile-flow-step:nth-of-type(even) .flow-number{left:auto!important;right:16px!important}
  .step-warehouse .flow-number{color:#f5b92f!important}.step-distribution .flow-number{color:#74d26a!important}.step-retail .flow-number{color:#f05292!important}
  .flow-icon{
    position:absolute!important;
    z-index:5!important;
    left:16px!important;
    top:38px!important;
    width:34px!important;
    height:34px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:50%!important;
    background:rgba(30,191,246,.14)!important;
    border:1px solid rgba(55,205,255,.28)!important;
    color:#58d7ff!important;
    font-size:17px!important;
    box-shadow:0 0 24px rgba(42,199,255,.18)!important;
  }
  .mobile-flow-step:nth-of-type(even) .flow-icon{left:auto!important;right:16px!important}
  .step-warehouse .flow-icon{color:#f5c84b!important;background:rgba(245,185,47,.12)!important;border-color:rgba(245,185,47,.3)!important}
  .step-distribution .flow-icon{color:#8adb7d!important;background:rgba(116,210,106,.12)!important;border-color:rgba(116,210,106,.3)!important}
  .step-retail .flow-icon{color:#f56ba6!important;background:rgba(240,82,146,.12)!important;border-color:rgba(240,82,146,.3)!important}
  .mobile-flow-arrow{
    display:grid!important;
    place-items:center!important;
    align-self:center!important;
    width:30px!important;
    height:22px!important;
    margin:-7px 0!important;
    border-radius:50%!important;
    color:#fff!important;
    background:rgba(5,17,34,.82)!important;
    border:1px solid rgba(255,255,255,.18)!important;
    box-shadow:0 8px 20px rgba(0,0,0,.24)!important;
    font-size:16px!important;
    line-height:1!important;
    z-index:7!important;
    animation:journeyArrow 1.8s ease-in-out infinite!important;
  }
  @keyframes journeyArrow{50%{transform:translateY(3px);opacity:.72}}
  .hero-brand-ticker{height:38px!important;bottom:0!important}
}
@media(max-width:430px){
  .hero{min-height:1290px!important}
  .mobile-supply-flow{height:690px!important;padding:0 14px!important;bottom:38px!important}
  .mobile-flow-step{height:126px!important;min-height:126px!important;width:93%!important;border-radius:22px!important}
  .flow-copy{padding:20px 13px!important}
  .flow-copy b{font-size:14px!important}
  .flow-copy small{font-size:9.4px!important;line-height:1.42!important;margin-top:8px!important}
  .flow-number{top:11px!important;left:13px!important}.mobile-flow-step:nth-of-type(even) .flow-number{right:13px!important}
  .flow-icon{left:13px!important;top:33px!important;width:30px!important;height:30px!important;font-size:15px!important}.mobile-flow-step:nth-of-type(even) .flow-icon{right:13px!important}
}
@media(max-width:380px){
  .hero{min-height:1220px!important}
  .mobile-supply-flow{height:650px!important;padding:0 11px!important}
  .mobile-flow-step{height:116px!important;min-height:116px!important}
  .flow-copy b{font-size:13px!important}.flow-copy small{font-size:8.8px!important}
}
@media (prefers-reduced-motion:reduce){.mobile-flow-step,.mobile-flow-arrow{animation:none!important}}

/* V37 — definitive mobile hero/supply-chain rebuild */
@media (max-width: 768px){
  .hero{
    display:block!important;
    min-height:0!important;
    height:auto!important;
    overflow:hidden!important;
    padding:0 0 0!important;
  }
  .hero:before{position:absolute!important;inset:0!important;background-position:58% center!important;transform:none!important;animation:none!important}
  .hero-content{
    position:relative!important;
    width:calc(100% - 28px)!important;
    margin:0 auto!important;
    padding:96px 0 26px!important;
    transform:none!important;
    min-height:0!important;
  }
  .headline{
    font-size:clamp(38px,11.5vw,52px)!important;
    line-height:.92!important;
    letter-spacing:-.055em!important;
    margin:18px 0 14px!important;
    max-width:100%!important;
  }
  .sub{font-size:12.5px!important;line-height:1.55!important;max-width:96%!important;margin:0!important}
  .cta-row{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;margin-top:20px!important}
  .btn{min-height:46px!important;padding:12px 10px!important;font-size:11px!important;white-space:nowrap!important}
  .hero-proof-row{display:flex!important;gap:7px!important;flex-wrap:wrap!important;margin-top:12px!important}
  .hero-proof-row span{font-size:8.5px!important;padding:7px 10px!important}

  .supply-composition,.hero>.hero-glass-stats{display:none!important}

  .mobile-supply-flow{
    display:block!important;
    position:relative!important;
    left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
    width:calc(100% - 28px)!important;
    margin:2px auto 18px!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    z-index:3!important;
    overflow:visible!important;
  }
  .mobile-supply-flow:before{display:none!important}
  .mobile-flow-head{
    display:flex!important;align-items:center!important;justify-content:center!important;
    margin:0 0 14px!important;color:#fff!important;
    font-size:10px!important;font-weight:900!important;letter-spacing:.16em!important;text-transform:uppercase!important;
  }
  .mobile-flow-head:before{content:"";width:6px;height:6px;border-radius:50%;background:#39d5ff;box-shadow:0 0 14px #39d5ff;margin-right:8px}
  .mobile-flow-steps{display:block!important;position:relative!important;padding:0!important}
  .mobile-flow-steps:before{
    content:""!important;display:block!important;position:absolute!important;
    left:18px!important;top:22px!important;bottom:22px!important;width:2px!important;
    background:linear-gradient(#15c8ff,#f2b632,#64d47b,#f04d9d)!important;
    box-shadow:0 0 14px rgba(21,200,255,.65)!important;border-radius:999px!important;
  }
  .mobile-flow-steps:after{display:none!important}
  .mobile-flow-step{
    position:relative!important;display:grid!important;
    grid-template-columns:52px minmax(0,1fr) 42%!important;
    align-items:center!important;gap:11px!important;
    width:100%!important;min-height:118px!important;
    margin:0 0 16px!important;padding:12px 12px 12px 14px!important;
    border-radius:24px!important;overflow:hidden!important;
    background:linear-gradient(135deg,rgba(8,27,51,.94),rgba(8,27,51,.62))!important;
    border:1px solid rgba(255,255,255,.18)!important;
    box-shadow:0 18px 48px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.12)!important;
    backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important;
    animation:none!important;transform:none!important;
  }
  .mobile-flow-step:nth-of-type(even){grid-template-columns:42% minmax(0,1fr) 52px!important;padding:12px 14px 12px 12px!important}
  .mobile-flow-step:nth-of-type(even) .flow-thumb{grid-column:1;grid-row:1}
  .mobile-flow-step:nth-of-type(even) .flow-copy{grid-column:2;grid-row:1;text-align:right}
  .mobile-flow-step:nth-of-type(even) .flow-number{grid-column:3;grid-row:1}
  .mobile-flow-step:nth-of-type(even) .flow-icon{right:auto!important;left:10px!important}
  .mobile-flow-step:after{display:none!important}
  .flow-number{position:relative!important;inset:auto!important;font-size:20px!important;font-weight:950!important;color:#28c9ff!important;align-self:start!important;padding-top:5px!important;text-align:center!important}
  .step-warehouse .flow-number{color:#ffc93c!important}.step-distribution .flow-number{color:#79df88!important}.step-retail .flow-number{color:#ff5ba8!important}
  .flow-thumb{width:100%!important;height:94px!important;border-radius:18px!important;overflow:hidden!important;border:1px solid rgba(255,255,255,.14)!important;box-shadow:0 12px 28px rgba(0,0,0,.28)!important}
  .flow-thumb img{width:100%!important;height:100%!important;object-fit:cover!important}
  .flow-copy{min-width:0!important;color:#fff!important;text-align:left!important}
  .flow-copy b{display:block!important;font-size:17px!important;line-height:1.05!important;letter-spacing:.01em!important;margin-bottom:7px!important}
  .flow-copy small{display:block!important;font-size:10px!important;line-height:1.45!important;color:rgba(255,255,255,.72)!important}
  .flow-icon{position:absolute!important;right:10px!important;top:10px!important;width:30px!important;height:30px!important;display:grid!important;place-items:center!important;border-radius:50%!important;background:rgba(4,163,223,.16)!important;border:1px solid rgba(72,211,255,.28)!important;font-size:14px!important}
  .mobile-flow-arrow{display:none!important}

  .hero-brand-ticker{
    position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;
    height:44px!important;width:100%!important;margin:0!important;
    background:rgba(3,11,24,.92)!important;border-top:1px solid rgba(255,255,255,.12)!important;
  }
  .hero-ticker-label{display:none!important}
  .hero-ticker-viewport{width:100%!important}
  .hero-brand-track{animation-duration:26s!important;gap:8px!important}
  .hero-brand-item{height:27px!important;min-width:88px!important;font-size:8.5px!important;padding:0 10px!important}
}

@media (max-width: 390px){
  .hero-content{width:calc(100% - 22px)!important;padding-top:88px!important}
  .headline{font-size:clamp(35px,11vw,44px)!important}
  .mobile-supply-flow{width:calc(100% - 22px)!important}
  .mobile-flow-step{grid-template-columns:44px minmax(0,1fr) 40%!important;min-height:108px!important;gap:8px!important;padding:10px!important;border-radius:21px!important}
  .mobile-flow-step:nth-of-type(even){grid-template-columns:40% minmax(0,1fr) 44px!important;padding:10px!important}
  .flow-thumb{height:84px!important;border-radius:15px!important}
  .flow-copy b{font-size:15px!important}.flow-copy small{font-size:9px!important}.flow-number{font-size:17px!important}
}

/* V38 — final mobile-first rescue: compact fit, no overflow, desktop-like mobile journey */
@media (max-width: 768px){
  html,body{width:100%!important;max-width:100%!important;overflow-x:hidden!important}

  .nav{inset:12px 0 auto!important}
  .nav-inner{
    width:calc(100vw - 16px)!important;
    height:56px!important;
    padding:0 10px!important;
    gap:8px!important;
    border-radius:18px!important;
  }
  .brand{
    min-width:0!important;
    flex:1 1 auto!important;
    gap:8px!important;
    overflow:hidden!important;
  }
  .brand img{width:34px!important;height:34px!important;flex:0 0 34px!important}
  .brand-title{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:8px!important;
    line-height:1.1!important;
    letter-spacing:0!important;
  }
  .actions{gap:6px!important;flex:0 0 auto!important}
  .lang-btn,.hamb{
    height:36px!important;
    min-width:36px!important;
    padding:0 10px!important;
    font-size:13px!important;
    border-radius:999px!important;
  }
  .hamb{display:grid!important;place-items:center!important;width:36px!important}
  .lang-menu{top:42px!important;width:165px!important}
  .mobile-drawer{padding:86px 18px 24px!important}
  .mobile-drawer a{font-size:22px!important;padding:12px 3px!important}

  .hero{
    display:block!important;
    min-height:100svh!important;
    height:auto!important;
    padding:0 0 0!important;
    overflow:hidden!important;
  }
  .hero:before{inset:0!important;background-position:60% center!important;transform:none!important;animation:none!important}
  .hero-content{
    width:calc(100% - 24px)!important;
    margin:0 auto!important;
    padding:86px 0 14px!important;
    min-height:0!important;
    transform:none!important;
  }
  .headline{
    max-width:100%!important;
    font-size:clamp(40px,11vw,52px)!important;
    line-height:.92!important;
    letter-spacing:-.05em!important;
    margin:12px 0 10px!important;
  }
  .sub{
    max-width:100%!important;
    font-size:11.8px!important;
    line-height:1.45!important;
    color:rgba(255,255,255,.82)!important;
  }
  .cta-row{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
    margin-top:16px!important;
  }
  .btn{
    min-width:0!important;
    min-height:42px!important;
    padding:10px 10px!important;
    font-size:10px!important;
    white-space:nowrap!important;
  }
  .hero-proof-row{gap:6px!important;margin-top:10px!important}
  .hero-proof-row span{
    height:24px!important;
    padding:0 8px!important;
    font-size:7.6px!important;
    letter-spacing:0!important;
  }

  .supply-composition,.hero>.hero-glass-stats{display:none!important}

  .mobile-supply-flow{
    display:block!important;
    position:relative!important;
    width:calc(100% - 24px)!important;
    margin:8px auto 10px!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    overflow:visible!important;
  }
  .mobile-supply-flow:before,.mobile-supply-flow:after{display:none!important;content:none!important}
  .mobile-flow-head{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    margin:0 0 10px!important;
    color:#fff!important;
    font-size:9px!important;
    font-weight:900!important;
    letter-spacing:.16em!important;
    text-transform:uppercase!important;
  }
  .mobile-flow-head:before{
    content:""!important;
    width:6px!important;height:6px!important;border-radius:50%!important;
    background:#39d5ff!important;box-shadow:0 0 14px rgba(57,213,255,.95)!important;
  }
  .mobile-flow-steps{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:10px 10px!important;
    position:relative!important;
    padding:4px 0 0!important;
    align-items:start!important;
  }
  .mobile-flow-steps:before,
  .mobile-flow-steps:after,
  .mobile-flow-arrow{display:none!important;content:none!important}

  .mobile-flow-step{
    position:relative!important;
    display:block!important;
    width:100%!important;
    min-height:90px!important;
    margin:0!important;
    padding:0!important;
    border-radius:20px!important;
    overflow:hidden!important;
    border:1px solid rgba(255,255,255,.17)!important;
    background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.04))!important;
    box-shadow:0 16px 38px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.12)!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
    animation:none!important;
    transform:none!important;
  }
  .mobile-flow-step.step-import{transform:translateY(0)!important}
  .mobile-flow-step.step-warehouse{transform:translateY(12px)!important}
  .mobile-flow-step.step-distribution{transform:translateY(-2px)!important}
  .mobile-flow-step.step-retail{transform:translateY(10px)!important}

  .flow-thumb{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    border-radius:0!important;
    border:0!important;
    box-shadow:none!important;
    overflow:hidden!important;
    z-index:1!important;
  }
  .flow-thumb:after{
    content:""!important;
    position:absolute!important;inset:0!important;
    background:linear-gradient(180deg,rgba(5,16,32,.08),rgba(5,16,32,.25) 36%,rgba(5,16,32,.84))!important;
    z-index:2!important;
  }
  .flow-thumb img{width:100%!important;height:100%!important;object-fit:cover!important;transform:scale(1.03)!important}

  .flow-copy{
    position:absolute!important;
    left:10px!important;right:10px!important;bottom:9px!important;
    z-index:4!important;
    display:block!important;
    padding:0!important;
    min-width:0!important;
    text-align:left!important;
  }
  .rtl .flow-copy{text-align:right!important}
  .flow-copy b{
    display:block!important;
    font-size:12.5px!important;
    line-height:1.05!important;
    font-weight:950!important;
    letter-spacing:.01em!important;
    color:#fff!important;
    margin:0 0 3px!important;
    text-shadow:0 5px 18px rgba(0,0,0,.55)!important;
  }
  .flow-copy small{
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
    font-size:8.2px!important;
    line-height:1.28!important;
    color:rgba(255,255,255,.8)!important;
    margin:0!important;
    text-shadow:0 3px 10px rgba(0,0,0,.45)!important;
  }
  .flow-number{
    position:absolute!important;
    left:10px!important;top:10px!important;inset:auto auto auto auto!important;
    z-index:5!important;
    width:26px!important;height:26px!important;
    display:grid!important;place-items:center!important;
    border-radius:50%!important;
    background:rgba(5,17,34,.65)!important;
    border:1px solid rgba(255,255,255,.16)!important;
    color:#39d5ff!important;
    font-size:11px!important;
    font-weight:950!important;
    letter-spacing:0!important;
  }
  .step-warehouse .flow-number{color:#ffc93c!important}
  .step-distribution .flow-number{color:#7bdd8b!important}
  .step-retail .flow-number{color:#ff69b2!important}
  .flow-icon{
    position:absolute!important;
    right:10px!important;top:10px!important;left:auto!important;
    z-index:5!important;
    width:24px!important;height:24px!important;
    display:grid!important;place-items:center!important;
    border-radius:50%!important;
    background:rgba(5,17,34,.62)!important;
    border:1px solid rgba(255,255,255,.14)!important;
    color:#fff!important;
    font-size:11px!important;
    box-shadow:none!important;
  }

  .hero-brand-ticker{
    position:relative!important;
    left:auto!important;right:auto!important;bottom:auto!important;
    width:100%!important;height:38px!important;
    margin:12px 0 0!important;
    padding:0 8px!important;
    background:rgba(3,11,24,.92)!important;
    border-top:1px solid rgba(255,255,255,.12)!important;
  }
  .hero-ticker-label{display:none!important}
  .hero-ticker-viewport{width:100%!important;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)!important}
  .hero-brand-track{gap:8px!important;animation-duration:24s!important}
  .hero-brand-item{height:24px!important;min-width:78px!important;padding:0 8px!important;font-size:7.8px!important;border-radius:999px!important}
}

@media (max-width: 430px){
  .hero-content{padding-top:84px!important}
  .headline{font-size:clamp(38px,10.7vw,48px)!important}
  .mobile-flow-step{min-height:84px!important;border-radius:18px!important}
  .flow-copy b{font-size:11.8px!important}
  .flow-copy small{font-size:7.8px!important}
}

@media (max-width: 390px){
  .nav-inner{width:calc(100vw - 12px)!important;padding:0 8px!important}
  .brand img{width:32px!important;height:32px!important;flex-basis:32px!important}
  .brand-title{font-size:7.2px!important;max-width:52vw!important}
  .lang-btn,.hamb{height:34px!important;min-width:34px!important;padding:0 8px!important;font-size:12px!important}

  .hero-content{width:calc(100% - 18px)!important;padding-top:82px!important}
  .headline{font-size:clamp(32px,10.4vw,42px)!important;line-height:.94!important}
  .sub{font-size:10.8px!important;line-height:1.42!important}
  .cta-row{gap:8px!important}
  .btn{font-size:9.2px!important;min-height:40px!important;padding:10px 8px!important}
  .hero-proof-row span{font-size:7.1px!important;padding:0 7px!important}

  .mobile-supply-flow{width:calc(100% - 18px)!important}
  .mobile-flow-steps{gap:8px!important}
  .mobile-flow-step{min-height:78px!important;border-radius:17px!important}
  .flow-copy{left:8px!important;right:8px!important;bottom:8px!important}
  .flow-copy b{font-size:10.8px!important;margin-bottom:2px!important}
  .flow-copy small{font-size:7.2px!important;line-height:1.22!important}
  .flow-number{left:8px!important;top:8px!important;width:24px!important;height:24px!important;font-size:10px!important}
  .flow-icon{right:8px!important;top:8px!important;width:22px!important;height:22px!important;font-size:10px!important}

  .hero-brand-ticker{height:36px!important;padding:0 6px!important}
  .hero-brand-item{height:22px!important;min-width:72px!important;font-size:7.2px!important;padding:0 7px!important}
}

/* V39 — polished mobile supply journey, full-width alternating cards */
@media (max-width: 768px){
  .hero{
    min-height:100svh!important;
    height:auto!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
  }
  .hero-content{
    flex:0 0 auto!important;
    padding-top:84px!important;
    padding-bottom:10px!important;
  }
  .headline{
    font-size:clamp(38px,10.8vw,50px)!important;
    line-height:.92!important;
    margin:10px 0 10px!important;
  }
  .sub{font-size:11.5px!important;line-height:1.42!important}
  .cta-row{margin-top:14px!important}
  .hero-proof-row{margin-top:8px!important}

  .mobile-supply-flow{
    flex:0 0 auto!important;
    width:calc(100% - 22px)!important;
    margin:6px auto 8px!important;
    padding:0!important;
  }
  .mobile-flow-head{
    margin:0 0 8px!important;
    font-size:8.5px!important;
    letter-spacing:.14em!important;
  }
  .mobile-flow-steps{
    display:flex!important;
    flex-direction:column!important;
    gap:8px!important;
    position:relative!important;
    padding-left:15px!important;
  }
  .rtl .mobile-flow-steps{padding-left:0!important;padding-right:15px!important}
  .mobile-flow-steps:before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:4px!important;
    top:18px!important;
    bottom:18px!important;
    width:2px!important;
    border-radius:999px!important;
    background:linear-gradient(180deg,#27cfff 0%,#f2c84b 34%,#79de88 68%,#ff6dad 100%)!important;
    box-shadow:0 0 14px rgba(39,207,255,.55)!important;
    z-index:1!important;
  }
  .rtl .mobile-flow-steps:before{left:auto!important;right:4px!important}
  .mobile-flow-steps:after{display:none!important;content:none!important}

  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even),
  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(5),
  .mobile-flow-step:nth-child(7){
    position:relative!important;
    display:grid!important;
    grid-template-columns:42% 1fr!important;
    align-items:stretch!important;
    width:100%!important;
    height:86px!important;
    min-height:86px!important;
    margin:0!important;
    padding:0!important;
    border-radius:20px!important;
    overflow:hidden!important;
    transform:none!important;
    animation:none!important;
    background:linear-gradient(135deg,rgba(8,26,48,.96),rgba(8,26,48,.72))!important;
    border:1px solid rgba(255,255,255,.18)!important;
    box-shadow:0 14px 34px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.12)!important;
    backdrop-filter:blur(16px)!important;
    -webkit-backdrop-filter:blur(16px)!important;
    z-index:2!important;
  }
  .mobile-flow-step:nth-of-type(even){grid-template-columns:1fr 42%!important}

  .mobile-flow-step:before{
    content:""!important;
    position:absolute!important;
    left:-18px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    width:10px!important;
    height:10px!important;
    border-radius:50%!important;
    background:#27cfff!important;
    box-shadow:0 0 0 4px rgba(39,207,255,.14),0 0 12px rgba(39,207,255,.8)!important;
    z-index:5!important;
  }
  .rtl .mobile-flow-step:before{left:auto!important;right:-18px!important}
  .step-warehouse:before{background:#f2c84b!important;box-shadow:0 0 0 4px rgba(242,200,75,.14),0 0 12px rgba(242,200,75,.8)!important}
  .step-distribution:before{background:#79de88!important;box-shadow:0 0 0 4px rgba(121,222,136,.14),0 0 12px rgba(121,222,136,.8)!important}
  .step-retail:before{background:#ff6dad!important;box-shadow:0 0 0 4px rgba(255,109,173,.14),0 0 12px rgba(255,109,173,.8)!important}
  .mobile-flow-step:after{display:none!important;content:none!important}

  .flow-thumb,
  .mobile-flow-step:nth-of-type(even) .flow-thumb{
    position:relative!important;
    inset:auto!important;
    grid-column:1!important;
    grid-row:1!important;
    width:100%!important;
    height:100%!important;
    border-radius:0!important;
    overflow:hidden!important;
    border:0!important;
    box-shadow:none!important;
    z-index:1!important;
  }
  .mobile-flow-step:nth-of-type(even) .flow-thumb{grid-column:2!important}
  .flow-thumb:after{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    background:linear-gradient(90deg,transparent 48%,rgba(7,23,44,.72) 100%)!important;
    z-index:2!important;
  }
  .mobile-flow-step:nth-of-type(even) .flow-thumb:after{
    background:linear-gradient(270deg,transparent 48%,rgba(7,23,44,.72) 100%)!important;
  }
  .flow-thumb img{width:100%!important;height:100%!important;object-fit:cover!important;transform:none!important;filter:saturate(.95) contrast(1.05)!important}

  .flow-copy,
  .mobile-flow-step:nth-of-type(even) .flow-copy{
    position:relative!important;
    inset:auto!important;
    grid-column:2!important;
    grid-row:1!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:flex-start!important;
    min-width:0!important;
    padding:10px 12px!important;
    text-align:left!important;
    z-index:3!important;
  }
  .mobile-flow-step:nth-of-type(even) .flow-copy{
    grid-column:1!important;
    align-items:flex-end!important;
    text-align:right!important;
  }
  .rtl .flow-copy{align-items:flex-end!important;text-align:right!important}
  .rtl .mobile-flow-step:nth-of-type(even) .flow-copy{align-items:flex-start!important;text-align:left!important}
  .flow-copy b{
    display:block!important;
    font-size:13px!important;
    line-height:1.05!important;
    margin:0 0 4px!important;
    color:#fff!important;
    white-space:nowrap!important;
  }
  .flow-copy small{
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
    font-size:8px!important;
    line-height:1.28!important;
    color:rgba(255,255,255,.72)!important;
    margin:0!important;
  }

  .flow-number,
  .mobile-flow-step:nth-of-type(even) .flow-number{
    position:absolute!important;
    left:9px!important;
    right:auto!important;
    top:8px!important;
    inset:auto!important;
    z-index:5!important;
    width:24px!important;
    height:24px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:999px!important;
    background:rgba(4,15,30,.72)!important;
    border:1px solid rgba(255,255,255,.18)!important;
    font-size:9px!important;
    color:#27cfff!important;
  }
  .mobile-flow-step:nth-of-type(even) .flow-number{left:auto!important;right:9px!important}
  .step-warehouse .flow-number{color:#f2c84b!important}
  .step-distribution .flow-number{color:#79de88!important}
  .step-retail .flow-number{color:#ff6dad!important}

  .flow-icon,
  .mobile-flow-step:nth-of-type(even) .flow-icon{
    position:absolute!important;
    left:auto!important;
    right:9px!important;
    top:8px!important;
    width:22px!important;
    height:22px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:999px!important;
    background:rgba(4,15,30,.62)!important;
    border:1px solid rgba(255,255,255,.16)!important;
    color:#fff!important;
    font-size:10px!important;
    z-index:5!important;
  }
  .mobile-flow-step:nth-of-type(even) .flow-icon{right:auto!important;left:9px!important}
  .mobile-flow-arrow{display:none!important}

  .hero-brand-ticker{margin-top:4px!important;height:36px!important}
}

@media (max-width:390px){
  .hero-content{padding-top:80px!important}
  .headline{font-size:clamp(34px,10.1vw,42px)!important}
  .sub{font-size:10.5px!important}
  .mobile-supply-flow{width:calc(100% - 18px)!important}
  .mobile-flow-steps{padding-left:13px!important;gap:7px!important}
  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even){height:78px!important;min-height:78px!important;border-radius:18px!important}
  .flow-copy,.mobile-flow-step:nth-of-type(even) .flow-copy{padding:9px 10px!important}
  .flow-copy b{font-size:11.5px!important}
  .flow-copy small{font-size:7.2px!important}
  .flow-number{width:22px!important;height:22px!important;font-size:8.5px!important}
  .flow-icon{width:20px!important;height:20px!important;font-size:9px!important}
}

/* V40 — balanced mobile first-screen composition */
@media (max-width: 768px){
  .hero{
    height:100svh!important;
    min-height:100svh!important;
    max-height:100svh!important;
    display:grid!important;
    grid-template-rows:auto minmax(0,1fr) 36px!important;
    overflow:hidden!important;
    padding:0!important;
  }
  .hero-content{
    width:calc(100% - 24px)!important;
    margin:0 auto!important;
    padding:82px 0 8px!important;
  }
  .headline{
    font-size:clamp(34px,9.8vw,48px)!important;
    line-height:.92!important;
    margin:6px 0 8px!important;
  }
  .sub{
    font-size:10.7px!important;
    line-height:1.36!important;
    max-width:100%!important;
  }
  .cta-row{margin-top:12px!important;gap:8px!important}
  .btn{min-height:38px!important;padding:9px 8px!important;font-size:9.3px!important}
  .hero-proof-row{margin-top:7px!important;gap:5px!important}
  .hero-proof-row span{height:21px!important;padding:0 7px!important;font-size:6.9px!important}

  .mobile-supply-flow{
    width:calc(100% - 24px)!important;
    margin:0 auto!important;
    min-height:0!important;
    height:auto!important;
    align-self:stretch!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    padding:2px 0 5px!important;
    overflow:hidden!important;
  }
  .mobile-flow-head{margin:0 0 5px!important;font-size:7.8px!important}
  .mobile-flow-steps{
    width:100%!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:repeat(4,minmax(0,1fr))!important;
    gap:12px!important;
    padding:0!important;
    min-height:0!important;
    height:100%!important;
  }
  .mobile-flow-steps:before,.mobile-flow-steps:after{display:none!important;content:none!important}

  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even),
  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(5),
  .mobile-flow-step:nth-child(7){
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    transform:none!important;
    display:grid!important;
    grid-template-columns:38% 1fr!important;
    border-radius:15px!important;
  }
  .mobile-flow-step:nth-of-type(even){grid-template-columns:1fr 38%!important}
  .mobile-flow-step:before,.mobile-flow-step:after{display:none!important;content:none!important}

  .flow-thumb,.mobile-flow-step:nth-of-type(even) .flow-thumb{
    height:100%!important;
    min-height:0!important;
  }
  .flow-copy,.mobile-flow-step:nth-of-type(even) .flow-copy{
    padding:7px 9px!important;
  }
  .flow-copy b{font-size:10.6px!important;margin-bottom:2px!important}
  .flow-copy small{
    font-size:6.7px!important;
    line-height:1.16!important;
    -webkit-line-clamp:2!important;
  }
  .flow-number,.mobile-flow-step:nth-of-type(even) .flow-number{
    width:19px!important;height:19px!important;
    top:5px!important;left:5px!important;right:auto!important;
    font-size:7.2px!important;
  }
  .mobile-flow-step:nth-of-type(even) .flow-number{left:auto!important;right:5px!important}
  .flow-icon,.mobile-flow-step:nth-of-type(even) .flow-icon{
    width:18px!important;height:18px!important;
    top:5px!important;right:5px!important;left:auto!important;
    font-size:8px!important;
  }
  .mobile-flow-step:nth-of-type(even) .flow-icon{right:auto!important;left:5px!important}

  .hero-brand-ticker{
    grid-row:3!important;
    position:relative!important;
    height:36px!important;
    margin:0!important;
    align-self:end!important;
  }
  .hero-brand-track{animation-duration:24s!important}
  .hero-brand-item{height:22px!important;min-width:70px!important;font-size:6.9px!important;padding:0 7px!important}
}

@media (max-width: 430px) and (min-height: 820px){
  .hero-content{padding-top:84px!important;padding-bottom:10px!important}
  .headline{font-size:clamp(38px,10.2vw,48px)!important}
  .sub{font-size:11px!important}
  .mobile-flow-steps{gap:6px!important}
  .mobile-flow-step,.mobile-flow-step:nth-of-type(even){border-radius:17px!important}
  .flow-copy b{font-size:11.5px!important}
  .flow-copy small{font-size:7.2px!important;line-height:1.2!important}
  .flow-number,.mobile-flow-step:nth-of-type(even) .flow-number{width:21px!important;height:21px!important;font-size:8px!important}
  .flow-icon,.mobile-flow-step:nth-of-type(even) .flow-icon{width:20px!important;height:20px!important;font-size:9px!important}
}

@media (max-width: 390px){
  .hero-content{width:calc(100% - 16px)!important;padding-top:76px!important}
  .headline{font-size:clamp(31px,9.6vw,40px)!important}
  .sub{font-size:9.7px!important;line-height:1.3!important}
  .btn{min-height:36px!important;font-size:8.5px!important}
  .hero-proof-row span{font-size:6.3px!important;height:20px!important}
  .mobile-supply-flow{width:calc(100% - 16px)!important}
  .mobile-flow-head{font-size:7.2px!important;margin-bottom:4px!important}
  .mobile-flow-steps{gap:4px!important}
  .mobile-flow-step,.mobile-flow-step:nth-of-type(even){border-radius:13px!important}
  .flow-copy,.mobile-flow-step:nth-of-type(even) .flow-copy{padding:5px 7px!important}
  .flow-copy b{font-size:9.6px!important}
  .flow-copy small{font-size:6.1px!important;line-height:1.12!important}
  .hero-brand-ticker{height:34px!important}
  .hero-brand-item{height:21px!important;min-width:66px!important;font-size:6.4px!important}
}

@media (max-width: 390px) and (max-height: 760px){
  .hero-content{padding-top:72px!important;padding-bottom:5px!important}
  .headline{font-size:clamp(29px,9vw,36px)!important;margin-bottom:6px!important}
  .sub{font-size:9.2px!important;line-height:1.24!important}
  .cta-row{margin-top:9px!important}
  .btn{min-height:34px!important;padding:7px 6px!important;font-size:8px!important}
  .hero-proof-row{margin-top:5px!important}
  .hero-proof-row span{height:18px!important;font-size:5.8px!important;padding:0 6px!important}
  .mobile-flow-head{margin-bottom:3px!important}
  .mobile-flow-steps{gap:3px!important}
  .flow-copy b{font-size:8.9px!important}
  .flow-copy small{font-size:5.7px!important}
  .hero-brand-ticker{height:32px!important}
  .hero-brand-item{height:20px!important;min-width:62px!important;font-size:6px!important}
}

/* V40.1 — normalize all legacy mobile card offsets and fill remaining viewport evenly */
@media (max-width:768px){
  .mobile-supply-flow{min-height:0!important;height:100%!important}
  .mobile-flow-steps{
    display:flex!important;
    flex-direction:column!important;
    justify-content:stretch!important;
    gap:12px!important;
    min-height:0!important;
    height:100%!important;
  }
  .mobile-flow-step,
  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(5),
  .mobile-flow-step:nth-child(7),
  .mobile-flow-step:nth-of-type(odd),
  .mobile-flow-step:nth-of-type(even){
    position:relative!important;
    inset:auto!important;
    left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    flex:1 1 0!important;
    margin:0!important;
    transform:none!important;
    grid-template-columns:38% minmax(0,1fr)!important;
  }
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(7){grid-template-columns:minmax(0,1fr) 38%!important}
  .mobile-flow-step:nth-child(3) .flow-thumb,
  .mobile-flow-step:nth-child(7) .flow-thumb{grid-column:2!important}
  .mobile-flow-step:nth-child(3) .flow-copy,
  .mobile-flow-step:nth-child(7) .flow-copy{grid-column:1!important;align-items:flex-end!important;text-align:right!important}
  .mobile-flow-step:nth-child(3) .flow-number,
  .mobile-flow-step:nth-child(7) .flow-number{left:auto!important;right:5px!important}
  .mobile-flow-step:nth-child(3) .flow-icon,
  .mobile-flow-step:nth-child(7) .flow-icon{right:auto!important;left:5px!important}
}

/* V41 — mobile cleanup requested: remove badges, lift cards, keep corner controls visible */
@media (max-width:768px){
  /* Remove the two proof badges and the Supply Chain badge/title on mobile */
  .hero-proof-row,
  .mobile-flow-head{
    display:none!important;
  }

  /* Give the saved space to the supply cards and pull them upward */
  .hero{
    grid-template-rows:auto minmax(0,1fr) 34px!important;
  }
  .hero-content{
    padding-top:80px!important;
    padding-bottom:4px!important;
  }
  .cta-row{
    margin-top:11px!important;
    margin-bottom:0!important;
  }
  .mobile-supply-flow{
    margin:-2px auto 0!important;
    padding:0 0 4px!important;
    height:100%!important;
    min-height:0!important;
    overflow:visible!important;
    justify-content:flex-start!important;
  }
  .mobile-flow-steps{
    height:100%!important;
    min-height:0!important;
    gap:12px!important;
    padding:0!important;
  }

  /* Equal card widths and safe internal clipping */
  .mobile-flow-step,
  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(5),
  .mobile-flow-step:nth-child(7),
  .mobile-flow-step:nth-of-type(odd),
  .mobile-flow-step:nth-of-type(even){
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    flex:1 1 0!important;
    overflow:hidden!important;
    border-radius:16px!important;
    transform:none!important;
  }

  /* Always keep step number at top-left and icon at top-right */
  .flow-number,
  .mobile-flow-step:nth-child(3) .flow-number,
  .mobile-flow-step:nth-child(7) .flow-number,
  .mobile-flow-step:nth-of-type(even) .flow-number{
    position:absolute!important;
    left:6px!important;
    right:auto!important;
    top:6px!important;
    z-index:8!important;
    width:20px!important;
    height:20px!important;
    display:grid!important;
    place-items:center!important;
    padding:0!important;
    line-height:1!important;
  }
  .flow-icon,
  .mobile-flow-step:nth-child(3) .flow-icon,
  .mobile-flow-step:nth-child(7) .flow-icon,
  .mobile-flow-step:nth-of-type(even) .flow-icon{
    position:absolute!important;
    right:6px!important;
    left:auto!important;
    top:6px!important;
    z-index:8!important;
    width:19px!important;
    height:19px!important;
    display:grid!important;
    place-items:center!important;
    padding:0!important;
    line-height:1!important;
  }

  /* Prevent copy from entering the corner indicators */
  .flow-copy,
  .mobile-flow-step:nth-child(3) .flow-copy,
  .mobile-flow-step:nth-child(7) .flow-copy,
  .mobile-flow-step:nth-of-type(even) .flow-copy{
    min-width:0!important;
    padding:7px 28px 7px 9px!important;
    overflow:hidden!important;
  }
  .mobile-flow-step:nth-child(3) .flow-copy,
  .mobile-flow-step:nth-child(7) .flow-copy{
    padding:7px 9px 7px 28px!important;
  }
  .flow-copy b,
  .flow-copy small{
    max-width:100%!important;
    overflow:hidden!important;
  }

  .hero-brand-ticker{
    height:34px!important;
  }
}

@media (max-width:430px){
  .hero-content{padding-top:78px!important;padding-bottom:3px!important}
  .headline{margin-bottom:7px!important}
  .sub{line-height:1.31!important}
  .cta-row{margin-top:9px!important}
  .mobile-supply-flow{margin-top:-4px!important}
  .mobile-flow-steps{gap:4px!important}
  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even){border-radius:15px!important}
  .flow-copy b{font-size:10.7px!important}
  .flow-copy small{font-size:6.6px!important;line-height:1.12!important}
}

@media (max-width:390px){
  .hero-content{padding-top:72px!important;padding-bottom:2px!important}
  .headline{font-size:clamp(29px,9vw,36px)!important;margin:3px 0 5px!important}
  .sub{font-size:9px!important;line-height:1.22!important}
  .cta-row{margin-top:7px!important;gap:6px!important}
  .btn{min-height:33px!important;padding:6px 5px!important;font-size:7.8px!important}
  .mobile-supply-flow{margin-top:-5px!important}
  .mobile-flow-steps{gap:3px!important}
  .flow-copy,.mobile-flow-step:nth-of-type(even) .flow-copy{padding-top:5px!important;padding-bottom:5px!important}
  .flow-copy b{font-size:9px!important}
  .flow-copy small{font-size:5.7px!important;line-height:1.08!important}
  .flow-number{width:18px!important;height:18px!important;font-size:6.8px!important}
  .flow-icon{width:17px!important;height:17px!important;font-size:7px!important}
  .hero-brand-ticker{height:32px!important}
}

/* V42 — final mobile timeline polish: compact zigzag, LED borders, equal margins, all visible */
@media (max-width:768px){
  .hero{
    min-height:100svh!important;
    height:100svh!important;
    max-height:100svh!important;
    display:grid!important;
    grid-template-rows:auto minmax(0,1fr) 34px!important;
    overflow:hidden!important;
  }
  .hero-content{
    width:calc(100% - 24px)!important;
    margin:0 auto!important;
    padding:98px 0 2px!important;
  }
  .headline{
    font-size:clamp(34px,10.2vw,46px)!important;
    line-height:.92!important;
    margin:3px 0 7px!important;
  }
  .sub{
    font-size:10.8px!important;
    line-height:1.32!important;
    max-width:100%!important;
  }
  .cta-row{
    margin-top:9px!important;
    gap:8px!important;
    grid-template-columns:1fr 1fr!important;
  }
  .btn{
    min-height:36px!important;
    padding:8px 7px!important;
    font-size:8.6px!important;
  }

  .mobile-supply-flow{
    position:relative!important;
    width:calc(100% - 28px)!important;
    height:100%!important;
    min-height:0!important;
    margin:0 auto!important;
    padding:0 0 70px 18px!important;
    overflow:hidden!important;
  }
  .mobile-flow-steps{
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    gap:12px!important;
    height:100%!important;
    min-height:0!important;
    padding:0!important;
  }
  .mobile-flow-steps:before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:4px!important;
    top:9%!important;
    bottom:9%!important;
    width:2px!important;
    border-radius:999px!important;
    background:linear-gradient(180deg,#26cfff 0 24%,#ffc52e 28% 49%,#6fe77d 54% 74%,#ff5aa5 80% 100%)!important;
    box-shadow:0 0 10px rgba(38,207,255,.85),0 0 18px rgba(255,90,165,.36)!important;
    z-index:0!important;
  }
  .mobile-flow-steps:after{display:none!important;content:none!important}

  .mobile-flow-step,
  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(5),
  .mobile-flow-step:nth-child(7),
  .mobile-flow-step:nth-of-type(odd),
  .mobile-flow-step:nth-of-type(even){
    position:relative!important;
    inset:auto!important;
    width:82%!important;
    max-width:82%!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    flex:1 1 0!important;
    margin:0!important;
    display:grid!important;
    align-items:stretch!important;
    overflow:visible!important;
    border-radius:15px!important;
    background:linear-gradient(135deg,rgba(4,18,36,.96),rgba(7,31,61,.82))!important;
    box-shadow:0 12px 28px rgba(0,0,0,.30)!important;
    transform:none!important;
  }
  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(5){
    align-self:flex-start!important;
    grid-template-columns:43% minmax(0,1fr)!important;
  }
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(7){
    align-self:flex-end!important;
    grid-template-columns:minmax(0,1fr) 43%!important;
  }

  .mobile-flow-step:nth-child(1){border:1px solid #22c9ff!important;box-shadow:0 0 0 1px rgba(34,201,255,.18),0 0 18px rgba(34,201,255,.25),0 12px 28px rgba(0,0,0,.3)!important}
  .mobile-flow-step:nth-child(3){border:1px solid #ffc12d!important;box-shadow:0 0 0 1px rgba(255,193,45,.16),0 0 18px rgba(255,193,45,.22),0 12px 28px rgba(0,0,0,.3)!important}
  .mobile-flow-step:nth-child(5){border:1px solid #70df7b!important;box-shadow:0 0 0 1px rgba(112,223,123,.16),0 0 18px rgba(112,223,123,.22),0 12px 28px rgba(0,0,0,.3)!important}
  .mobile-flow-step:nth-child(7){border:1px solid #ff5ca7!important;box-shadow:0 0 0 1px rgba(255,92,167,.16),0 0 18px rgba(255,92,167,.22),0 12px 28px rgba(0,0,0,.3)!important}

  .mobile-flow-step:before{
    content:""!important;
    position:absolute!important;
    left:-19px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    width:10px!important;
    height:10px!important;
    border-radius:50%!important;
    background:#22c9ff!important;
    box-shadow:0 0 0 4px rgba(34,201,255,.12),0 0 14px #22c9ff!important;
    z-index:6!important;
  }
  .mobile-flow-step:nth-child(3):before{background:#ffc12d!important;box-shadow:0 0 0 4px rgba(255,193,45,.12),0 0 14px #ffc12d!important}
  .mobile-flow-step:nth-child(5):before{background:#70df7b!important;box-shadow:0 0 0 4px rgba(112,223,123,.12),0 0 14px #70df7b!important}
  .mobile-flow-step:nth-child(7):before{background:#ff5ca7!important;box-shadow:0 0 0 4px rgba(255,92,167,.12),0 0 14px #ff5ca7!important}
  .mobile-flow-step:after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:-10px!important;
    top:50%!important;
    width:10px!important;
    height:1px!important;
    background:currentColor!important;
    opacity:.85!important;
    z-index:5!important;
  }

  .flow-thumb{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    border-radius:14px 0 0 14px!important;
    overflow:hidden!important;
    grid-column:1!important;
    grid-row:1!important;
  }
  .mobile-flow-step:nth-child(3) .flow-thumb,
  .mobile-flow-step:nth-child(7) .flow-thumb{
    grid-column:2!important;
    border-radius:0 14px 14px 0!important;
  }
  .flow-thumb img{width:100%!important;height:100%!important;object-fit:cover!important}

  .flow-copy,
  .mobile-flow-step:nth-child(3) .flow-copy,
  .mobile-flow-step:nth-child(7) .flow-copy,
  .mobile-flow-step:nth-of-type(even) .flow-copy{
    position:relative!important;
    inset:auto!important;
    grid-column:2!important;
    grid-row:1!important;
    min-width:0!important;
    padding:8px 22px 7px 10px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:flex-start!important;
    text-align:left!important;
    overflow:hidden!important;
  }
  .mobile-flow-step:nth-child(3) .flow-copy,
  .mobile-flow-step:nth-child(7) .flow-copy{
    grid-column:1!important;
    padding:8px 10px 7px 22px!important;
    align-items:flex-end!important;
    text-align:right!important;
  }
  .flow-copy b{
    max-width:100%!important;
    font-size:10.4px!important;
    line-height:1.05!important;
    margin:0 0 3px!important;
    white-space:normal!important;
    overflow:hidden!important;
  }
  .flow-copy small{
    max-width:100%!important;
    font-size:6.5px!important;
    line-height:1.14!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
  }

  .flow-number,
  .mobile-flow-step:nth-child(3) .flow-number,
  .mobile-flow-step:nth-child(7) .flow-number,
  .mobile-flow-step:nth-of-type(even) .flow-number{
    position:absolute!important;
    left:6px!important;
    right:auto!important;
    top:6px!important;
    width:19px!important;
    height:19px!important;
    border-radius:50%!important;
    display:grid!important;
    place-items:center!important;
    padding:0!important;
    z-index:8!important;
    font-size:7px!important;
    line-height:1!important;
    background:rgba(2,12,25,.78)!important;
    border:1px solid currentColor!important;
  }
  .mobile-flow-step:nth-child(3) .flow-number,
  .mobile-flow-step:nth-child(7) .flow-number{left:auto!important;right:6px!important}

  .flow-icon,
  .mobile-flow-step:nth-child(3) .flow-icon,
  .mobile-flow-step:nth-child(7) .flow-icon,
  .mobile-flow-step:nth-of-type(even) .flow-icon{
    position:absolute!important;
    right:6px!important;
    left:auto!important;
    top:6px!important;
    width:18px!important;
    height:18px!important;
    border-radius:50%!important;
    display:grid!important;
    place-items:center!important;
    padding:0!important;
    z-index:8!important;
    font-size:7px!important;
    line-height:1!important;
    background:rgba(2,12,25,.72)!important;
    border:1px solid rgba(255,255,255,.18)!important;
  }
  .mobile-flow-step:nth-child(3) .flow-icon,
  .mobile-flow-step:nth-child(7) .flow-icon{right:auto!important;left:6px!important}

  .hero-brand-ticker{
    position:relative!important;
    height:34px!important;
    min-height:34px!important;
    margin:0!important;
    z-index:10!important;
  }
}

@media (max-width:430px){
  .hero-content{padding-top:76px!important}
  .headline{font-size:clamp(31px,9.4vw,40px)!important}
  .sub{font-size:9.5px!important;line-height:1.27!important}
  .cta-row{margin-top:7px!important}
  .btn{min-height:34px!important;font-size:7.8px!important;padding:7px 5px!important}
  .mobile-supply-flow{width:calc(100% - 22px)!important;padding-left:16px!important}
  .mobile-flow-steps{gap:4px!important}
  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even){width:87%!important;max-width:87%!important;border-radius:14px!important}
  .flow-thumb{border-radius:13px 0 0 13px!important}
  .mobile-flow-step:nth-child(3) .flow-thumb,
  .mobile-flow-step:nth-child(7) .flow-thumb{border-radius:0 13px 13px 0!important}
  .flow-copy b{font-size:9.5px!important}
  .flow-copy small{font-size:5.9px!important;line-height:1.1!important}
  .mobile-flow-step:before{left:-17px!important;width:9px!important;height:9px!important}
  .mobile-flow-step:after{left:-8px!important;width:8px!important}
}

@media (max-width:390px){
  .hero-content{padding-top:70px!important}
  .headline{font-size:clamp(28px,8.8vw,35px)!important;margin-bottom:5px!important}
  .sub{font-size:8.7px!important;line-height:1.2!important}
  .cta-row{margin-top:6px!important;gap:6px!important}
  .btn{min-height:31px!important;font-size:7px!important;padding:6px 4px!important}
  .mobile-supply-flow{width:calc(100% - 18px)!important;padding-left:14px!important}
  .mobile-flow-steps{gap:3px!important}
  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even){width:86%!important;max-width:86%!important}
  .flow-copy,
  .mobile-flow-step:nth-child(3) .flow-copy,
  .mobile-flow-step:nth-child(7) .flow-copy{padding-top:5px!important;padding-bottom:5px!important}
  .flow-copy b{font-size:8.5px!important}
  .flow-copy small{font-size:5.3px!important;line-height:1.06!important}
  .flow-number{width:17px!important;height:17px!important;font-size:6px!important}
  .flow-icon{width:16px!important;height:16px!important;font-size:6px!important}
  .hero-brand-ticker{height:32px!important;min-height:32px!important}
}

/* V43 — mobile viewport containment fix (cards stay inside screen and above ticker) */
@media (max-width:768px){
  .hero{
    grid-template-rows:auto minmax(0,1fr) 40px!important;
  }
  .mobile-supply-flow{
    box-sizing:border-box!important;
    width:calc(100% - 32px)!important;
    padding:4px 10px 9px 20px!important;
    overflow:hidden!important;
  }
  .mobile-flow-steps{
    box-sizing:border-box!important;
    width:100%!important;
    padding-right:2px!important;
    padding-bottom:2px!important;
    gap:4px!important;
  }
  .mobile-flow-step,
  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(5),
  .mobile-flow-step:nth-child(7),
  .mobile-flow-step:nth-of-type(odd),
  .mobile-flow-step:nth-of-type(even){
    box-sizing:border-box!important;
    width:84%!important;
    max-width:84%!important;
    flex:1 1 0!important;
  }
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(7){
    margin-right:1px!important;
  }
  .hero-brand-ticker{
    height:40px!important;
    min-height:40px!important;
  }
}

@media (max-width:430px){
  .mobile-supply-flow{
    width:calc(100% - 26px)!important;
    padding-left:18px!important;
    padding-right:8px!important;
    padding-bottom:9px!important;
  }
  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even){
    width:83%!important;
    max-width:83%!important;
  }
}

@media (max-width:390px){
  .hero{grid-template-rows:auto minmax(0,1fr) 38px!important}
  .mobile-supply-flow{
    width:calc(100% - 22px)!important;
    padding-left:16px!important;
    padding-right:7px!important;
    padding-bottom:8px!important;
  }
  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even){
    width:82%!important;
    max-width:82%!important;
  }
  .hero-brand-ticker{height:38px!important;min-height:38px!important}
}

/* V44 — final mobile card alignment and footer/ticker clearance */
@media (max-width:768px){
  .hero{
    height:auto!important;
    max-height:none!important;
    min-height:100svh!important;
    display:grid!important;
    grid-template-rows:auto auto 40px!important;
    align-content:start!important;
    overflow:hidden!important;
    padding-bottom:0!important;
  }
  .hero-content{
    width:calc(100% - 28px)!important;
    margin:0 auto!important;
    padding:78px 0 8px!important;
  }
  .mobile-supply-flow{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:4px 24px 14px!important;
    overflow:visible!important;
  }
  .mobile-flow-steps{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    gap:6px!important;
    justify-content:flex-start!important;
    overflow:visible!important;
  }
  .mobile-flow-steps:before{
    left:12px!important;
    top:10%!important;
    bottom:10%!important;
  }
  .mobile-flow-step,
  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(5),
  .mobile-flow-step:nth-child(7),
  .mobile-flow-step:nth-of-type(odd),
  .mobile-flow-step:nth-of-type(even){
    width:84%!important;
    max-width:84%!important;
    min-height:82px!important;
    height:clamp(82px,11.2svh,104px)!important;
    flex:0 0 auto!important;
    align-self:center!important;
    margin:0!important;
  }
  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(5){transform:translateX(-4%)!important}
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(7){transform:translateX(4%)!important}
  .mobile-flow-step:before{left:-20px!important}
  .mobile-flow-step:after{left:-11px!important}
  .hero-brand-ticker{
    position:relative!important;
    inset:auto!important;
    grid-row:3!important;
    width:100%!important;
    height:40px!important;
    min-height:40px!important;
    margin:0!important;
    z-index:20!important;
  }
}

@media (max-width:430px){
  .hero-content{padding-top:74px!important;padding-bottom:7px!important}
  .mobile-supply-flow{padding:3px 20px 12px!important}
  .mobile-flow-steps{gap:5px!important}
  .mobile-flow-steps:before{left:10px!important}
  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even){
    width:83%!important;
    max-width:83%!important;
    min-height:78px!important;
    height:clamp(78px,10.7svh,96px)!important;
  }
  .mobile-flow-step:nth-child(1),.mobile-flow-step:nth-child(5){transform:translateX(-3.5%)!important}
  .mobile-flow-step:nth-child(3),.mobile-flow-step:nth-child(7){transform:translateX(3.5%)!important}
}

@media (max-width:390px){
  .hero{grid-template-rows:auto auto 38px!important}
  .hero-content{padding-top:68px!important;padding-bottom:6px!important}
  .mobile-supply-flow{padding:2px 18px 10px!important}
  .mobile-flow-steps{gap:4px!important}
  .mobile-flow-steps:before{left:9px!important}
  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even){
    width:82%!important;
    max-width:82%!important;
    min-height:72px!important;
    height:clamp(72px,10.2svh,88px)!important;
  }
  .hero-brand-ticker{height:38px!important;min-height:38px!important}
}

/* V45 — final mobile viewport composition: ticker stays at the exact bottom */
@media (max-width:768px){
  html,body{overflow-x:hidden!important}
  .hero{
    height:100svh!important;
    min-height:100svh!important;
    max-height:100svh!important;
    display:grid!important;
    grid-template-rows:auto minmax(0,1fr) 36px!important;
    align-content:stretch!important;
    overflow:hidden!important;
  }
  .hero-content{
    width:calc(100% - 28px)!important;
    margin:0 auto!important;
    padding:72px 0 5px!important;
    transform:none!important;
  }
  .headline{margin-bottom:4px!important}
  .sub{margin-top:0!important}
  .cta-row{margin-top:6px!important}
  .mobile-supply-flow{
    width:100%!important;
    min-width:0!important;
    height:100%!important;
    min-height:0!important;
    box-sizing:border-box!important;
    margin:0!important;
    padding:2px 21px 7px!important;
    overflow:hidden!important;
  }
  .mobile-flow-steps{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    box-sizing:border-box!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:space-evenly!important;
    gap:3px!important;
    padding:0!important;
    overflow:hidden!important;
  }
  .mobile-flow-steps:before{left:13px!important;top:7%!important;bottom:7%!important}
  .mobile-flow-step,
  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(5),
  .mobile-flow-step:nth-child(7),
  .mobile-flow-step:nth-of-type(odd),
  .mobile-flow-step:nth-of-type(even){
    width:82%!important;
    max-width:82%!important;
    min-width:0!important;
    min-height:0!important;
    height:auto!important;
    flex:1 1 0!important;
    max-height:calc((100% - 9px)/4)!important;
    align-self:center!important;
    margin:0!important;
  }
  .mobile-flow-step:nth-child(1),.mobile-flow-step:nth-child(5){transform:translateX(-3%)!important}
  .mobile-flow-step:nth-child(3),.mobile-flow-step:nth-child(7){transform:translateX(3%)!important}
  .flow-thumb,.flow-copy{min-width:0!important;min-height:0!important}
  .flow-thumb img{width:100%!important;height:100%!important;object-fit:cover!important}
  .hero-brand-ticker{
    position:relative!important;
    inset:auto!important;
    grid-row:3!important;
    width:100%!important;
    height:36px!important;
    min-height:36px!important;
    margin:0!important;
    padding:0 8px!important;
    z-index:30!important;
  }
}
@media (max-width:430px){
  .hero{grid-template-rows:auto minmax(0,1fr) 34px!important}
  .hero-content{width:calc(100% - 22px)!important;padding:66px 0 4px!important}
  .headline{font-size:clamp(27px,8.7vw,36px)!important;line-height:.91!important}
  .sub{font-size:8.5px!important;line-height:1.17!important}
  .btn{min-height:30px!important;padding:5px 4px!important;font-size:7px!important}
  .mobile-supply-flow{padding:1px 17px 5px!important}
  .mobile-flow-steps{gap:2px!important}
  .mobile-flow-steps:before{left:10px!important}
  .mobile-flow-step,.mobile-flow-step:nth-of-type(even){width:81%!important;max-width:81%!important}
  .flow-copy b{font-size:8px!important}
  .flow-copy small{font-size:5px!important;line-height:1.05!important}
  .hero-brand-ticker{height:34px!important;min-height:34px!important}
}
@media (max-width:390px){
  .hero-content{padding-top:62px!important}
  .headline{font-size:clamp(25px,8.3vw,33px)!important}
  .sub{font-size:8px!important}
  .cta-row{gap:12px!important;margin-top:5px!important}
  .mobile-supply-flow{padding-left:15px!important;padding-right:15px!important}
  .mobile-flow-step,.mobile-flow-step:nth-of-type(even){width:80%!important;max-width:80%!important}
}

/* V47 — carefully balanced mobile hero: lower heading, slimmer cards, clear gaps, full retail card */
@media (max-width:768px){
  .hero{
    height:100svh!important;
    min-height:100svh!important;
    max-height:100svh!important;
    grid-template-rows:auto minmax(0,1fr) 36px!important;
    overflow:hidden!important;
  }
  .hero-content{
    width:calc(100% - 28px)!important;
    padding:82px 0 8px!important;
  }
  .headline{
    margin-top:0!important;
    margin-bottom:6px!important;
  }
  .cta-row{margin-top:7px!important}
  .mobile-supply-flow{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    padding:4px 24px 10px!important;
    overflow:hidden!important;
  }
  .mobile-flow-steps{
    height:100%!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    gap:8px!important;
    overflow:hidden!important;
  }
  .mobile-flow-step,
  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(5),
  .mobile-flow-step:nth-child(7),
  .mobile-flow-step:nth-of-type(odd),
  .mobile-flow-step:nth-of-type(even){
    width:76%!important;
    max-width:76%!important;
    height:calc((100% - 24px)/4)!important;
    max-height:none!important;
    min-height:0!important;
    flex:0 1 auto!important;
    margin:0!important;
  }
  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(5){transform:translateX(-4%)!important}
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(7){transform:translateX(4%)!important}
  .hero-brand-ticker{
    height:36px!important;
    min-height:36px!important;
    position:relative!important;
    inset:auto!important;
    margin:0!important;
  }
}
@media (max-width:430px){
  .hero{grid-template-rows:auto minmax(0,1fr) 34px!important}
  .hero-content{
    width:calc(100% - 24px)!important;
    padding:76px 0 7px!important;
  }
  .headline{font-size:clamp(26px,8.3vw,34px)!important;line-height:.92!important}
  .sub{font-size:8.2px!important;line-height:1.18!important}
  .mobile-supply-flow{padding:3px 19px 9px!important}
  .mobile-flow-steps{gap:7px!important}
  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even){
    width:75%!important;
    max-width:75%!important;
    height:calc((100% - 21px)/4)!important;
  }
  .flow-copy b{font-size:7.5px!important}
  .flow-copy small{font-size:5px!important;line-height:1.08!important}
  .hero-brand-ticker{height:34px!important;min-height:34px!important}
}
@media (max-width:390px){
  .hero-content{padding-top:72px!important}
  .mobile-supply-flow{padding-left:17px!important;padding-right:17px!important;padding-bottom:8px!important}
  .mobile-flow-steps{gap:6px!important}
  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even){
    width:74%!important;
    max-width:74%!important;
    height:calc((100% - 18px)/4)!important;
  }
}
@media (max-width:430px) and (max-height:720px){
  .hero-content{padding-top:68px!important;padding-bottom:4px!important}
  .headline{font-size:clamp(24px,7.8vw,31px)!important}
  .sub{font-size:7.6px!important}
  .cta-row{margin-top:4px!important}
  .mobile-supply-flow{padding-top:1px!important;padding-bottom:6px!important}
  .mobile-flow-steps{gap:5px!important}
  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even){height:calc((100% - 15px)/4)!important}
}


/* FINAL MOBILE FIX */
@media (max-width:768px){
.hero-content{padding-top:96px!important}
.headline{margin-top:18px!important}
.mobile-supply-flow{width:calc(100% - 48px)!important;margin:0 auto!important;left:24px!important;right:24px!important;bottom:64px!important}
.mobile-flow-card{width:84%!important;max-width:84%!important}
.mobile-flow-card:last-child{margin-bottom:42px!important}
.hero{padding-bottom:56px!important}
}

/* V51 — verified mobile composition: centered zigzag cards, clear CTA gap, full retail card, ticker pinned to bottom */
@media (max-width: 768px) {
  .hero {
    height: 100svh !important;
    min-height: 100svh !important;
    max-height: 100svh !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) 36px !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  .hero-content {
    position: relative !important;
    z-index: 4 !important;
    width: calc(100% - 28px) !important;
    margin: 0 auto !important;
    padding: 100px 0 10px !important;
  }

  .headline {
    margin: 0 0 5px !important;
  }

  .cta-row {
    margin-top: 7px !important;
    margin-bottom: 0 !important;
  }

  .mobile-supply-flow {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 8px 26px 10px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  .mobile-flow-steps {
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    padding: 0 !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  .mobile-flow-step,
  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(5),
  .mobile-flow-step:nth-child(7),
  .mobile-flow-step:nth-of-type(odd),
  .mobile-flow-step:nth-of-type(even) {
    width: 72% !important;
    max-width: 72% !important;
    height: calc((100% - 21px) / 4) !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: 0 0 calc((100% - 21px) / 4) !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  /* Keep the existing zigzag, but center the whole composition symmetrically. */
  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(5) {
    transform: translateX(-4%) !important;
  }

  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(7) {
    transform: translateX(4%) !important;
  }

  .hero-brand-ticker {
    position: relative !important;
    inset: auto !important;
    align-self: end !important;
    width: 100% !important;
    height: 36px !important;
    min-height: 36px !important;
    margin: 0 !important;
    z-index: 6 !important;
  }
}

@media (max-width: 430px) {
  .hero {
    grid-template-rows: auto minmax(0, 1fr) 34px !important;
  }

  .hero-content {
    width: calc(100% - 24px) !important;
    padding: 96px 0 9px !important;
  }

  .mobile-supply-flow {
    padding: 8px 23px 9px !important;
  }

  .mobile-flow-steps {
    gap: 6px !important;
  }

  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even) {
    width: 71% !important;
    max-width: 71% !important;
    height: calc((100% - 18px) / 4) !important;
    flex-basis: calc((100% - 18px) / 4) !important;
  }

  .hero-brand-ticker {
    height: 34px !important;
    min-height: 34px !important;
  }
}

@media (max-width: 390px) {
  .hero-content {
    padding-top: 92px !important;
  }

  .mobile-supply-flow {
    padding-left: 21px !important;
    padding-right: 21px !important;
  }

  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even) {
    width: 70% !important;
    max-width: 70% !important;
  }
}

@media (max-width: 430px) and (max-height: 720px) {
  .hero-content {
    padding-top: 84px !important;
    padding-bottom: 7px !important;
  }

  .headline {
    font-size: clamp(24px, 7.7vw, 31px) !important;
  }

  .sub {
    font-size: 7.5px !important;
    line-height: 1.12 !important;
  }

  .cta-row {
    margin-top: 4px !important;
  }

  .mobile-supply-flow {
    padding-top: 5px !important;
    padding-bottom: 7px !important;
  }

  .mobile-flow-steps {
    gap: 5px !important;
  }

  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even) {
    height: calc((100% - 15px) / 4) !important;
    flex-basis: calc((100% - 15px) / 4) !important;
  }
}

/* Final mobile fixes */
@media (max-width:430px){
.hero{grid-template-rows:auto minmax(0,1fr) 58px!important;}
.hero-content{padding-top:104px!important;}
.mobile-supply-flow{margin-top:10px!important;padding-bottom:90px!important;}
.mobile-flow-steps{padding:0 12px 90px!important;gap:10px!important;}
.mobile-flow-step{width:84%!important;max-width:84%!important;margin:0 auto!important;}
.mobile-flow-step:nth-child(1),.mobile-flow-step:nth-child(5){margin-right:0!important;margin-left:auto!important;}
.mobile-flow-step:nth-child(3),.mobile-flow-step:nth-child(7){margin-left:0!important;margin-right:auto!important;}
.hero-brand-ticker{position:absolute!important;left:0;right:0;bottom:0!important;height:54px!important;z-index:5!important;}
}

/* === V53 LUXURY MOBILE HERO — clean, balanced, fully visible === */
@media (max-width: 768px){
  .hero{
    height:100svh!important;
    min-height:100svh!important;
    max-height:100svh!important;
    display:grid!important;
    grid-template-rows:auto minmax(0,1fr) 40px!important;
    overflow:hidden!important;
    padding:0!important;
  }

  .hero-content{
    position:relative!important;
    z-index:10!important;
    width:calc(100% - 30px)!important;
    margin:0 auto!important;
    padding:92px 0 10px!important;
  }

  .headline{
    max-width:100%!important;
    margin:0 0 8px!important;
    font-size:clamp(36px,10.7vw,50px)!important;
    line-height:.91!important;
    letter-spacing:-.055em!important;
    text-wrap:balance!important;
  }

  .sub{
    max-width:96%!important;
    margin:0!important;
    font-size:10px!important;
    line-height:1.35!important;
    color:rgba(255,255,255,.78)!important;
  }

  .cta-row{
    width:100%!important;
    max-width:100%!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:9px!important;
    margin:11px 0 0!important;
  }

  .cta-row .btn{
    width:100%!important;
    min-height:36px!important;
    height:36px!important;
    padding:0 10px!important;
    font-size:9px!important;
    border-radius:999px!important;
  }

  .hero-proof-row{display:none!important;}

  .mobile-supply-flow{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    margin:0!important;
    padding:12px 18px 10px!important;
    overflow:hidden!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    transform:none!important;
  }
  .mobile-supply-flow:before,
  .mobile-supply-flow:after,
  .mobile-flow-head,
  .mobile-flow-arrow{display:none!important;content:none!important;}

  .mobile-flow-steps{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:9px!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
  }
  .mobile-flow-steps:before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    top:5%!important;
    bottom:5%!important;
    left:50%!important;
    width:1px!important;
    transform:translateX(-50%)!important;
    background:linear-gradient(180deg,transparent,rgba(76,214,255,.48) 12%,rgba(255,205,55,.42) 39%,rgba(72,231,132,.42) 67%,rgba(255,70,159,.46) 90%,transparent)!important;
    box-shadow:0 0 12px rgba(76,214,255,.25)!important;
    border-radius:999px!important;
    z-index:0!important;
  }
  .mobile-flow-steps:after{display:none!important;content:none!important;}

  .mobile-flow-step,
  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(5),
  .mobile-flow-step:nth-child(7),
  .mobile-flow-step:nth-of-type(odd),
  .mobile-flow-step:nth-of-type(even){
    position:relative!important;
    inset:auto!important;
    width:82%!important;
    max-width:82%!important;
    height:auto!important;
    min-height:0!important;
    flex:1 1 0!important;
    margin:0!important;
    padding:0!important;
    display:grid!important;
    grid-template-columns:43% 57%!important;
    overflow:hidden!important;
    border-radius:18px!important;
    background:linear-gradient(135deg,rgba(4,24,49,.96),rgba(3,14,31,.92))!important;
    border:1px solid rgba(255,255,255,.20)!important;
    box-shadow:0 12px 32px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.12)!important;
    animation:none!important;
    transform:none!important;
    z-index:2!important;
  }

  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(5){transform:translateX(-6%)!important;}
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(7){transform:translateX(6%)!important;}

  .mobile-flow-step:before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    inset:0!important;
    border-radius:inherit!important;
    background:linear-gradient(100deg,rgba(255,255,255,.04),transparent 48%,rgba(255,255,255,.025))!important;
    pointer-events:none!important;
    z-index:3!important;
  }
  .mobile-flow-step:after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:8px!important;
    top:8px!important;
    width:6px!important;
    height:6px!important;
    border-radius:50%!important;
    background:#56dcff!important;
    box-shadow:0 0 12px currentColor!important;
    z-index:5!important;
  }
  .mobile-flow-step.step-warehouse:after{background:#ffd24a!important;}
  .mobile-flow-step.step-distribution:after{background:#55e78e!important;}
  .mobile-flow-step.step-retail:after{background:#ff4f9f!important;}

  .flow-number{
    position:absolute!important;
    left:-9px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    width:19px!important;
    height:19px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:50%!important;
    background:#06182f!important;
    border:1px solid rgba(255,255,255,.36)!important;
    color:#fff!important;
    font-size:6.5px!important;
    font-weight:950!important;
    z-index:8!important;
    box-shadow:0 0 14px rgba(62,211,255,.34)!important;
  }

  .flow-thumb{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    opacity:1!important;
    border:0!important;
    box-shadow:none!important;
  }
  .flow-thumb:after{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    background:linear-gradient(90deg,transparent 52%,rgba(3,15,32,.76) 100%)!important;
  }
  .flow-thumb img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    filter:saturate(1.02) contrast(1.05) brightness(.84)!important;
    transform:scale(1.03)!important;
  }

  .flow-copy{
    position:relative!important;
    inset:auto!important;
    min-width:0!important;
    padding:0 10px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    z-index:4!important;
  }
  .flow-copy b{
    display:block!important;
    color:#fff!important;
    font-size:8.2px!important;
    line-height:1.05!important;
    letter-spacing:.06em!important;
    font-weight:950!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .flow-copy small{
    display:block!important;
    margin-top:4px!important;
    color:rgba(255,255,255,.72)!important;
    font-size:6.3px!important;
    line-height:1.25!important;
    font-weight:700!important;
    white-space:normal!important;
    overflow:hidden!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
  }
  .flow-icon{
    position:absolute!important;
    right:7px!important;
    top:7px!important;
    width:18px!important;
    height:18px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:50%!important;
    color:#fff!important;
    background:rgba(3,17,35,.56)!important;
    border:1px solid rgba(255,255,255,.20)!important;
    box-shadow:0 5px 15px rgba(0,0,0,.24)!important;
    font-size:9px!important;
    z-index:6!important;
  }

  .hero-brand-ticker{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:40px!important;
    min-height:40px!important;
    margin:0!important;
    align-self:end!important;
    z-index:12!important;
    border-top:1px solid rgba(255,255,255,.10)!important;
    background:linear-gradient(180deg,rgba(5,18,37,.88),rgba(3,13,28,.98))!important;
    box-shadow:0 -10px 28px rgba(0,0,0,.20)!important;
  }
  .hero-ticker-label{display:none!important;}
  .hero-brand-chip{
    min-width:88px!important;
    height:22px!important;
    border-radius:999px!important;
    font-size:7px!important;
  }
}

@media (max-width:430px) and (max-height:740px){
  .hero{grid-template-rows:auto minmax(0,1fr) 36px!important;}
  .hero-content{padding-top:78px!important;padding-bottom:6px!important;}
  .headline{font-size:clamp(30px,9vw,39px)!important;margin-bottom:5px!important;}
  .sub{font-size:8.5px!important;line-height:1.2!important;}
  .cta-row{margin-top:7px!important;}
  .cta-row .btn{height:31px!important;min-height:31px!important;font-size:8px!important;}
  .mobile-supply-flow{padding:7px 16px 6px!important;}
  .mobile-flow-steps{gap:6px!important;}
  .mobile-flow-step,.mobile-flow-step:nth-of-type(even){width:80%!important;max-width:80%!important;border-radius:15px!important;}
  .flow-copy b{font-size:7.4px!important;}
  .flow-copy small{font-size:5.7px!important;margin-top:2px!important;}
  .hero-brand-ticker{height:36px!important;min-height:36px!important;}
}

/* v54 — mobile card labels + premium sequential route */
@media (max-width:768px){
  .mobile-flow-steps{
    position:relative!important;
    isolation:isolate!important;
    overflow:visible!important;
  }

  /* Continuous luxury route: Import → Warehouse → Distribution → Retail */
  .mobile-flow-steps:before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:50%!important;
    top:8%!important;
    bottom:8%!important;
    width:2px!important;
    transform:translateX(-50%)!important;
    border-radius:999px!important;
    background:linear-gradient(180deg,
      #28c7ff 0%,
      #28c7ff 24%,
      #ffd24a 35%,
      #ffd24a 48%,
      #55e78e 62%,
      #55e78e 75%,
      #ff4f9f 100%)!important;
    box-shadow:0 0 8px rgba(40,199,255,.50),0 0 16px rgba(85,231,142,.20)!important;
    opacity:.92!important;
    z-index:0!important;
  }

  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even){
    position:relative!important;
    overflow:visible!important;
    z-index:2!important;
  }

  /* Horizontal branches joining every card to the central route */
  .mobile-flow-step:after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    top:50%!important;
    height:2px!important;
    width:13%!important;
    transform:translateY(-50%)!important;
    border-radius:999px!important;
    opacity:.95!important;
    z-index:-1!important;
    animation:none!important;
  }
  .mobile-flow-step:nth-child(1):after,
  .mobile-flow-step:nth-child(5):after{
    right:-13%!important;
    left:auto!important;
    background:linear-gradient(90deg,currentColor,rgba(255,255,255,.36))!important;
  }
  .mobile-flow-step:nth-child(3):after,
  .mobile-flow-step:nth-child(7):after{
    left:-13%!important;
    right:auto!important;
    background:linear-gradient(90deg,rgba(255,255,255,.36),currentColor)!important;
  }
  .mobile-flow-step:nth-child(1){color:#28c7ff!important;}
  .mobile-flow-step:nth-child(3){color:#ffd24a!important;}
  .mobile-flow-step:nth-child(5){color:#55e78e!important;}
  .mobile-flow-step:nth-child(7){color:#ff4f9f!important;}

  /* Route nodes */
  .mobile-flow-step:before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    top:50%!important;
    width:9px!important;
    height:9px!important;
    border-radius:50%!important;
    transform:translateY(-50%)!important;
    background:currentColor!important;
    border:2px solid rgba(5,18,37,.95)!important;
    box-shadow:0 0 0 3px color-mix(in srgb,currentColor 20%,transparent),0 0 12px currentColor!important;
    z-index:8!important;
  }
  .mobile-flow-step:nth-child(1):before,
  .mobile-flow-step:nth-child(5):before{right:-14.5%!important;left:auto!important;}
  .mobile-flow-step:nth-child(3):before,
  .mobile-flow-step:nth-child(7):before{left:-14.5%!important;right:auto!important;}

  /* Keep the small corner labels clearly visible inside the cards */
  .flow-number{
    display:grid!important;
    place-items:center!important;
    position:absolute!important;
    top:6px!important;
    left:6px!important;
    right:auto!important;
    bottom:auto!important;
    width:22px!important;
    height:18px!important;
    border-radius:7px!important;
    color:#fff!important;
    background:rgba(3,16,34,.88)!important;
    border:1px solid currentColor!important;
    box-shadow:0 4px 12px rgba(0,0,0,.28),0 0 10px color-mix(in srgb,currentColor 28%,transparent)!important;
    font-size:7px!important;
    line-height:1!important;
    font-weight:950!important;
    letter-spacing:.04em!important;
    opacity:1!important;
    visibility:visible!important;
    z-index:20!important;
  }
  .flow-icon{
    display:grid!important;
    place-items:center!important;
    position:absolute!important;
    top:6px!important;
    right:6px!important;
    left:auto!important;
    bottom:auto!important;
    width:20px!important;
    height:20px!important;
    border-radius:8px!important;
    color:#fff!important;
    background:rgba(3,16,34,.90)!important;
    border:1px solid currentColor!important;
    box-shadow:0 4px 12px rgba(0,0,0,.28),0 0 10px color-mix(in srgb,currentColor 28%,transparent)!important;
    font-size:9px!important;
    opacity:1!important;
    visibility:visible!important;
    z-index:20!important;
  }

  /* Clip only the photo, never the corner badges */
  .flow-thumb{overflow:hidden!important;}
}

/* Fallback for browsers without color-mix */
@supports not (color:color-mix(in srgb,red 50%,blue)){
  @media (max-width:768px){
    .mobile-flow-step:before{box-shadow:0 0 0 3px rgba(255,255,255,.12),0 0 12px currentColor!important;}
    .flow-number,.flow-icon{box-shadow:0 4px 12px rgba(0,0,0,.28),0 0 10px rgba(40,199,255,.22)!important;}
  }
}

/* v56 — keep corner badges fully visible + complete right-side route branches */
@media (max-width:768px){
  /* Do not change card dimensions or placement. Only protect the corner UI. */
  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(even){
    overflow:visible!important;
  }

  .mobile-flow-step .flow-copy,
  .mobile-flow-step:nth-of-type(even) .flow-copy{
    padding-inline:12px 34px!important;
    overflow:visible!important;
  }

  .mobile-flow-step .flow-copy b,
  .mobile-flow-step .flow-copy small{
    position:relative!important;
    z-index:5!important;
    max-width:100%!important;
  }

  /* Put the numbered corner label completely inside the upper-right corner. */
  .mobile-flow-step .flow-number,
  .mobile-flow-step:nth-of-type(even) .flow-number{
    top:7px!important;
    right:7px!important;
    left:auto!important;
    bottom:auto!important;
    width:24px!important;
    height:19px!important;
    padding:0!important;
    overflow:visible!important;
    white-space:nowrap!important;
    text-indent:0!important;
    clip:auto!important;
    clip-path:none!important;
    transform:none!important;
    z-index:30!important;
  }

  /* Keep the decorative icon clear of the number and card edge. */
  .mobile-flow-step .flow-icon,
  .mobile-flow-step:nth-of-type(even) .flow-icon{
    top:31px!important;
    right:8px!important;
    left:auto!important;
    bottom:auto!important;
    transform:none!important;
    overflow:visible!important;
    clip:auto!important;
    clip-path:none!important;
    z-index:29!important;
  }

  /* The photo remains clipped, but badges and labels never are. */
  .mobile-flow-step .flow-thumb{overflow:hidden!important;}

  /* Add the missing coloured branches on the RIGHT of Import and Distribution. */
  .mobile-flow-step.step-import:after,
  .mobile-flow-step.step-distribution:after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    top:50%!important;
    left:auto!important;
    right:-13%!important;
    width:13%!important;
    height:2px!important;
    transform:translateY(-50%)!important;
    border-radius:999px!important;
    opacity:.98!important;
    z-index:-1!important;
  }
  .mobile-flow-step.step-import:after{
    background:linear-gradient(90deg,#28c7ff,rgba(40,199,255,.18))!important;
    box-shadow:0 0 8px rgba(40,199,255,.80)!important;
  }
  .mobile-flow-step.step-distribution:after{
    background:linear-gradient(90deg,#55e78e,rgba(85,231,142,.18))!important;
    box-shadow:0 0 8px rgba(85,231,142,.80)!important;
  }

  /* Matching right-side luminous nodes for the two missing stages. */
  .mobile-flow-step.step-import:before,
  .mobile-flow-step.step-distribution:before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    top:50%!important;
    left:auto!important;
    right:-14.5%!important;
    width:9px!important;
    height:9px!important;
    transform:translateY(-50%)!important;
    border-radius:50%!important;
    border:2px solid rgba(5,18,37,.96)!important;
    z-index:8!important;
  }
  .mobile-flow-step.step-import:before{
    background:#28c7ff!important;
    box-shadow:0 0 0 3px rgba(40,199,255,.16),0 0 12px rgba(40,199,255,.95)!important;
  }
  .mobile-flow-step.step-distribution:before{
    background:#55e78e!important;
    box-shadow:0 0 0 3px rgba(85,231,142,.16),0 0 12px rgba(85,231,142,.95)!important;
  }
}

/* v57 — final mobile corner cleanup + visible right-side connectors */
@media (max-width:768px){
  /* Keep the useful stage badge; remove only the decorative icon that overlapped it. */
  .mobile-flow-step .flow-icon,
  .mobile-flow-step:nth-of-type(even) .flow-icon{
    display:none!important;
  }

  .mobile-flow-step .flow-number,
  .mobile-flow-step:nth-of-type(even) .flow-number{
    display:grid!important;
    place-items:center!important;
    top:6px!important;
    right:6px!important;
    left:auto!important;
    bottom:auto!important;
    width:24px!important;
    height:19px!important;
    margin:0!important;
    padding:0!important;
    transform:none!important;
    overflow:hidden!important;
    white-space:nowrap!important;
    font-size:7px!important;
    line-height:19px!important;
    color:#fff!important;
    background:rgba(3,16,34,.94)!important;
    border:1px solid currentColor!important;
    border-radius:7px!important;
    z-index:40!important;
  }

  /* Reserve only the badge area; card size and card position remain unchanged. */
  .mobile-flow-step .flow-copy,
  .mobile-flow-step:nth-of-type(even) .flow-copy{
    padding-right:38px!important;
  }

  /* Import and Distribution: visible branches on the RIGHT, matching the other two stages. */
  .mobile-flow-step.step-import:after,
  .mobile-flow-step.step-distribution:after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    top:50%!important;
    left:100%!important;
    right:auto!important;
    width:16%!important;
    height:2px!important;
    transform:translateY(-50%)!important;
    border-radius:999px!important;
    opacity:1!important;
    z-index:6!important;
    pointer-events:none!important;
  }
  .mobile-flow-step.step-import:after{
    background:linear-gradient(90deg,#28c7ff 0%,#28c7ff 58%,rgba(40,199,255,.12) 100%)!important;
    box-shadow:0 0 6px rgba(40,199,255,.95),0 0 13px rgba(40,199,255,.45)!important;
  }
  .mobile-flow-step.step-distribution:after{
    background:linear-gradient(90deg,#55e78e 0%,#55e78e 58%,rgba(85,231,142,.12) 100%)!important;
    box-shadow:0 0 6px rgba(85,231,142,.95),0 0 13px rgba(85,231,142,.45)!important;
  }

  .mobile-flow-step.step-import:before,
  .mobile-flow-step.step-distribution:before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    top:50%!important;
    left:calc(116% - 5px)!important;
    right:auto!important;
    width:9px!important;
    height:9px!important;
    transform:translateY(-50%)!important;
    border-radius:50%!important;
    border:2px solid rgba(3,16,34,.96)!important;
    z-index:7!important;
    pointer-events:none!important;
  }
  .mobile-flow-step.step-import:before{
    background:#28c7ff!important;
    box-shadow:0 0 0 3px rgba(40,199,255,.16),0 0 12px rgba(40,199,255,.95)!important;
  }
  .mobile-flow-step.step-distribution:before{
    background:#55e78e!important;
    box-shadow:0 0 0 3px rgba(85,231,142,.16),0 0 12px rgba(85,231,142,.95)!important;
  }
}

/* v58 — definitive mobile connector visibility + tidy Warehouse/Retail copy */
@media (max-width:768px){
  /* Let the connector strokes extend beyond the card without being clipped. */
  .mobile-supply-flow,
  .mobile-flow-steps,
  .mobile-flow-step{
    overflow:visible!important;
  }

  /* Keep card geometry exactly as-is; only draw the two missing right branches. */
  .mobile-flow-step.step-import::after,
  .mobile-flow-step.step-distribution::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    top:50%!important;
    left:calc(100% + 1px)!important;
    right:auto!important;
    width:34px!important;
    height:2px!important;
    border-radius:999px!important;
    transform:translateY(-50%)!important;
    opacity:1!important;
    visibility:visible!important;
    z-index:60!important;
    pointer-events:none!important;
    animation:none!important;
  }
  .mobile-flow-step.step-import::after{
    background:linear-gradient(90deg,#28c7ff 0%,#28c7ff 72%,rgba(40,199,255,.18) 100%)!important;
    box-shadow:0 0 5px #28c7ff,0 0 12px rgba(40,199,255,.72)!important;
  }
  .mobile-flow-step.step-distribution::after{
    background:linear-gradient(90deg,#55e78e 0%,#55e78e 72%,rgba(85,231,142,.18) 100%)!important;
    box-shadow:0 0 5px #55e78e,0 0 12px rgba(85,231,142,.72)!important;
  }

  .mobile-flow-step.step-import::before,
  .mobile-flow-step.step-distribution::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    top:50%!important;
    left:calc(100% + 30px)!important;
    right:auto!important;
    width:9px!important;
    height:9px!important;
    border-radius:50%!important;
    transform:translateY(-50%)!important;
    border:2px solid #07162a!important;
    opacity:1!important;
    visibility:visible!important;
    z-index:61!important;
    pointer-events:none!important;
  }
  .mobile-flow-step.step-import::before{
    background:#28c7ff!important;
    box-shadow:0 0 0 3px rgba(40,199,255,.18),0 0 12px #28c7ff!important;
  }
  .mobile-flow-step.step-distribution::before{
    background:#55e78e!important;
    box-shadow:0 0 0 3px rgba(85,231,142,.18),0 0 12px #55e78e!important;
  }

  /* Warehouse and Retail: clean, readable left-side text block, no overlap. */
  .mobile-flow-step.step-warehouse .flow-copy,
  .mobile-flow-step.step-retail .flow-copy{
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:flex-start!important;
    text-align:left!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:2px 30px 2px 8px!important;
    overflow:visible!important;
  }
  .mobile-flow-step.step-warehouse .flow-copy b,
  .mobile-flow-step.step-retail .flow-copy b{
    display:block!important;
    width:100%!important;
    margin:0!important;
    font-size:8px!important;
    line-height:1.08!important;
    letter-spacing:.055em!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    text-align:left!important;
  }
  .mobile-flow-step.step-warehouse .flow-copy small,
  .mobile-flow-step.step-retail .flow-copy small{
    display:-webkit-box!important;
    width:100%!important;
    margin-top:3px!important;
    font-size:5.6px!important;
    line-height:1.16!important;
    white-space:normal!important;
    overflow:hidden!important;
    text-overflow:clip!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
    text-align:left!important;
  }

  /* Keep the stage badge visible but clear of the text. */
  .mobile-flow-step.step-warehouse .flow-number,
  .mobile-flow-step.step-retail .flow-number{
    top:6px!important;
    right:6px!important;
    left:auto!important;
    z-index:70!important;
  }
}


/* === V59: real mobile right-side connectors + final text alignment === */
@media (max-width:768px){
  .mobile-supply-flow,
  .mobile-flow-steps{overflow:visible!important;}

  .mobile-flow-step{overflow:visible!important;}
  .mobile-flow-step .flow-thumb{overflow:hidden!important;}

  /* Disable previous pseudo-element attempts on these two cards. */
  .mobile-flow-step.step-import::before,
  .mobile-flow-step.step-import::after,
  .mobile-flow-step.step-distribution::before,
  .mobile-flow-step.step-distribution::after{
    content:none!important;
    display:none!important;
  }

  /* Real connector element, identical luminous style to the existing stage lines. */
  .mobile-flow-step .stage-connector{
    display:block!important;
    position:absolute!important;
    top:50%!important;
    width:34px!important;
    height:2px!important;
    transform:translateY(-50%)!important;
    border-radius:999px!important;
    z-index:90!important;
    pointer-events:none!important;
    overflow:visible!important;
  }
  .mobile-flow-step .stage-connector::after{
    content:""!important;
    position:absolute!important;
    top:50%!important;
    right:-4px!important;
    width:9px!important;
    height:9px!important;
    transform:translateY(-50%)!important;
    border-radius:50%!important;
    border:2px solid #07162a!important;
  }
  .mobile-flow-step.step-import .stage-connector{
    left:calc(100% + 1px)!important;
    background:linear-gradient(90deg,#28c7ff 0%,#28c7ff 72%,rgba(40,199,255,.18) 100%)!important;
    box-shadow:0 0 5px #28c7ff,0 0 12px rgba(40,199,255,.72)!important;
  }
  .mobile-flow-step.step-import .stage-connector::after{
    background:#28c7ff!important;
    box-shadow:0 0 0 3px rgba(40,199,255,.18),0 0 12px #28c7ff!important;
  }
  .mobile-flow-step.step-distribution .stage-connector{
    left:calc(100% + 1px)!important;
    background:linear-gradient(90deg,#55e78e 0%,#55e78e 72%,rgba(85,231,142,.18) 100%)!important;
    box-shadow:0 0 5px #55e78e,0 0 12px rgba(85,231,142,.72)!important;
  }
  .mobile-flow-step.step-distribution .stage-connector::after{
    background:#55e78e!important;
    box-shadow:0 0 0 3px rgba(85,231,142,.18),0 0 12px #55e78e!important;
  }

  /* Keep the current card sizes/positions; only normalize copy inside Warehouse and Retail. */
  .mobile-flow-step.step-warehouse .flow-copy,
  .mobile-flow-step.step-retail .flow-copy{
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:flex-start!important;
    align-self:stretch!important;
    text-align:left!important;
    min-width:0!important;
    width:100%!important;
    margin:0!important;
    padding:2px 30px 2px 7px!important;
    overflow:hidden!important;
  }
  .mobile-flow-step.step-warehouse .flow-copy b,
  .mobile-flow-step.step-retail .flow-copy b{
    display:block!important;
    width:100%!important;
    margin:0!important;
    font-size:8px!important;
    line-height:1.08!important;
    letter-spacing:.045em!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    text-align:left!important;
  }
  .mobile-flow-step.step-warehouse .flow-copy small,
  .mobile-flow-step.step-retail .flow-copy small{
    display:-webkit-box!important;
    width:100%!important;
    margin:3px 0 0!important;
    font-size:5.5px!important;
    line-height:1.18!important;
    white-space:normal!important;
    overflow:hidden!important;
    text-overflow:clip!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
    text-align:left!important;
  }
}

/* === V60: guaranteed visible right-side branches for Import and Distribution === */
@media (max-width:768px){
  .mobile-supply-flow,
  .mobile-flow-steps,
  .mobile-flow-step{
    overflow:visible!important;
  }

  .mobile-flow-step.step-import > .stage-connector,
  .mobile-flow-step.step-distribution > .stage-connector{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    content:""!important;
    position:absolute!important;
    top:50%!important;
    left:auto!important;
    right:-19px!important;
    width:20px!important;
    height:2px!important;
    margin:0!important;
    padding:0!important;
    transform:translateY(-50%)!important;
    border:0!important;
    border-radius:999px!important;
    z-index:999!important;
    pointer-events:none!important;
    animation:none!important;
  }

  .mobile-flow-step.step-import > .stage-connector{
    background:#25c7ff!important;
    box-shadow:0 0 4px #25c7ff,0 0 10px rgba(37,199,255,.9)!important;
  }
  .mobile-flow-step.step-distribution > .stage-connector{
    background:#67e98f!important;
    box-shadow:0 0 4px #67e98f,0 0 10px rgba(103,233,143,.9)!important;
  }

  .mobile-flow-step.step-import > .stage-connector::after,
  .mobile-flow-step.step-distribution > .stage-connector::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    top:50%!important;
    right:-3px!important;
    left:auto!important;
    width:8px!important;
    height:8px!important;
    transform:translateY(-50%)!important;
    border-radius:50%!important;
    border:2px solid #07162a!important;
    opacity:1!important;
    visibility:visible!important;
    z-index:1000!important;
  }
  .mobile-flow-step.step-import > .stage-connector::after{
    background:#25c7ff!important;
    box-shadow:0 0 0 3px rgba(37,199,255,.18),0 0 11px #25c7ff!important;
  }
  .mobile-flow-step.step-distribution > .stage-connector::after{
    background:#67e98f!important;
    box-shadow:0 0 0 3px rgba(103,233,143,.18),0 0 11px #67e98f!important;
  }
}

/* === V62: final visible right-side connectors (Import + Distribution) === */
@media (max-width:768px){
  .hero,
  .hero-content,
  .mobile-supply-flow,
  .mobile-flow-steps,
  .mobile-flow-step{
    overflow:visible!important;
  }

  .mobile-flow-step.step-import,
  .mobile-flow-step.step-distribution{
    isolation:isolate!important;
  }

  .mobile-flow-step.step-import > .stage-connector,
  .mobile-flow-step.step-distribution > .stage-connector{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    position:absolute!important;
    left:100%!important;
    right:auto!important;
    top:50%!important;
    width:36px!important;
    height:3px!important;
    min-width:36px!important;
    transform:translate(0,-50%)!important;
    border-radius:999px!important;
    z-index:2147483000!important;
    pointer-events:none!important;
    overflow:visible!important;
  }

  .mobile-flow-step.step-import > .stage-connector{
    background:linear-gradient(90deg,#18bfff 0%,#39d2ff 72%,rgba(57,210,255,.35) 100%)!important;
    box-shadow:0 0 5px #20c5ff,0 0 13px rgba(32,197,255,.95)!important;
  }
  .mobile-flow-step.step-distribution > .stage-connector{
    background:linear-gradient(90deg,#4de780 0%,#79f3a4 72%,rgba(121,243,164,.35) 100%)!important;
    box-shadow:0 0 5px #55e78e,0 0 13px rgba(85,231,142,.95)!important;
  }

  .mobile-flow-step.step-import > .stage-connector::after,
  .mobile-flow-step.step-distribution > .stage-connector::after{
    content:""!important;
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    position:absolute!important;
    left:auto!important;
    right:-5px!important;
    top:50%!important;
    width:9px!important;
    height:9px!important;
    transform:translateY(-50%)!important;
    border:2px solid #07162a!important;
    border-radius:50%!important;
    z-index:2147483001!important;
  }
  .mobile-flow-step.step-import > .stage-connector::after{
    background:#28c7ff!important;
    box-shadow:0 0 0 3px rgba(40,199,255,.22),0 0 13px #28c7ff!important;
  }
  .mobile-flow-step.step-distribution > .stage-connector::after{
    background:#63ef94!important;
    box-shadow:0 0 0 3px rgba(99,239,148,.22),0 0 13px #63ef94!important;
  }
}

@media(max-width:768px){
.stage-connector.connector-right{right:-34px!important;left:auto!important;background:linear-gradient(90deg,#28c7ff,#28c7ff00)!important;}
.step-distribution .stage-connector.connector-right{background:linear-gradient(90deg,#55e78e,#55e78e00)!important;}
.stage-connector.connector-right::after{content:'';position:absolute;right:-6px;top:50%;transform:translateY(-50%);width:10px;height:10px;border-radius:50%;background:#28c7ff;box-shadow:0 0 8px #28c7ff;}
.step-distribution .stage-connector.connector-right::after{background:#55e78e;box-shadow:0 0 8px #55e78e;}
}

/* === V64: structural external connectors; independent of card overflow === */
@media (max-width:768px){
  .mobile-flow-steps{
    position:relative!important;
    overflow:visible!important;
  }
  .external-stage-connector{
    display:block!important;
    position:absolute!important;
    height:2px!important;
    min-width:16px!important;
    transform:translateY(-50%)!important;
    border-radius:999px!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:none!important;
    z-index:2147483646!important;
  }
  .external-stage-connector::after{
    content:""!important;
    position:absolute!important;
    right:-4px!important;
    top:50%!important;
    width:8px!important;
    height:8px!important;
    transform:translateY(-50%)!important;
    border-radius:50%!important;
    border:2px solid #07162a!important;
  }
  .external-import{
    background:linear-gradient(90deg,#22c5ff 0%,#22c5ff 70%,rgba(34,197,255,.18) 100%)!important;
    box-shadow:0 0 5px #22c5ff,0 0 12px rgba(34,197,255,.85)!important;
  }
  .external-import::after{
    background:#22c5ff!important;
    box-shadow:0 0 0 3px rgba(34,197,255,.18),0 0 12px #22c5ff!important;
  }
  .external-distribution{
    background:linear-gradient(90deg,#59e98a 0%,#59e98a 70%,rgba(89,233,138,.18) 100%)!important;
    box-shadow:0 0 5px #59e98a,0 0 12px rgba(89,233,138,.85)!important;
  }
  .external-distribution::after{
    background:#59e98a!important;
    box-shadow:0 0 0 3px rgba(89,233,138,.18),0 0 12px #59e98a!important;
  }
  /* Retire older in-card right connectors to avoid duplicate/hidden layers. */
  .step-import > .stage-connector,
  .step-distribution > .stage-connector{
    display:none!important;
  }
}

/* === V66: flush, equal-reach structural right connectors === */
@media (max-width:768px){
  .external-stage-connector{
    transform:translateY(-50%)!important;
    transform-origin:left center!important;
  }
  .external-stage-connector::after{
    right:-3px!important;
  }
}

/* === V68: stable Arabic/Urdu mobile flow geometry === */
@media (max-width:768px){
  /* Keep the card/timeline geometry physical and identical in RTL languages. */
  html[dir="rtl"] .mobile-supply-flow,
  html[dir="rtl"] .mobile-flow-steps,
  html[dir="rtl"] .mobile-flow-step{
    direction:ltr!important;
  }

  /* Only the copy itself follows Arabic/Urdu reading direction. */
  html[dir="rtl"] .mobile-flow-step .flow-copy{
    direction:rtl!important;
    text-align:right!important;
    unicode-bidi:plaintext!important;
  }
  html[dir="rtl"] .mobile-flow-step .flow-copy b,
  html[dir="rtl"] .mobile-flow-step .flow-copy small{
    direction:rtl!important;
    text-align:right!important;
    width:100%!important;
  }

  /* Prevent generic RTL rules from mirroring or shifting card internals. */
  html[dir="rtl"] .mobile-flow-step .flow-thumb,
  html[dir="rtl"] .mobile-flow-step .flow-number,
  html[dir="rtl"] .mobile-flow-step .flow-icon{
    direction:ltr!important;
  }

  /* External connectors always remain on the physical right side. */
  html[dir="rtl"] .external-stage-connector{
    direction:ltr!important;
    transform:translateY(-50%)!important;
    transform-origin:left center!important;
  }
  html[dir="rtl"] .external-stage-connector::after{
    left:auto!important;
    right:-3px!important;
  }
}

/* === V69: equal attached connectors + editable linked flow cards === */
@media (max-width:768px){
  .mobile-flow-steps{--mobile-connector-length:34px;}
  .external-stage-connector{width:var(--mobile-connector-length)!important;min-width:var(--mobile-connector-length)!important;max-width:var(--mobile-connector-length)!important;}
  .flow-card-linked{cursor:pointer!important;}
  .flow-card-linked:focus-visible{outline:2px solid rgba(255,255,255,.9)!important;outline-offset:3px!important;}
  .flow-card-linked::marker{display:none;}
}

.admin-flow-card{margin-top:18px;padding:20px;border:1px solid rgba(10,31,55,.14);border-radius:18px;background:#fff;box-shadow:0 12px 34px rgba(0,20,45,.06)}
.admin-flow-card-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}
.admin-flow-card-head h3{margin:0;text-transform:capitalize}
.admin-flow-grid{display:grid;grid-template-columns:minmax(220px,.7fr) minmax(0,1.8fr);gap:20px}
.admin-flow-grid label,.admin-flow-lang label{display:grid;gap:7px;margin-bottom:12px;font-weight:600}
.admin-flow-grid input[type="text"],.admin-flow-grid input[type="url"],.admin-flow-grid textarea{width:100%;padding:11px 12px;border:1px solid #cfd8e3;border-radius:10px;font:inherit;font-weight:400}
.admin-flow-languages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.admin-flow-lang{padding:14px;border-radius:14px;background:#f5f8fc;border:1px solid #e1e8f0}
.admin-flow-lang textarea{resize:vertical}
.admin-link-toggle{display:flex!important;grid-template-columns:auto 1fr!important;align-items:center;justify-content:flex-start}
@media(max-width:900px){.admin-flow-grid{grid-template-columns:1fr}.admin-flow-languages{grid-template-columns:1fr}}


/* === V70: precise connector symmetry + merged premium pages === */
@media (max-width:768px){
  .mobile-flow-steps{--mobile-connector-length:22px!important;}
  .external-stage-connector{width:22px!important;min-width:22px!important;max-width:22px!important;}
  /* Existing left branches visually span 22px from timeline node to card edge. */
  .step-warehouse::after,.step-retail::after{width:22px!important;}
}
.combined-brands-section{padding-top:92px;padding-bottom:104px}
.brand-showcase-panel{padding:34px;border:1px solid rgba(255,255,255,.12);border-radius:30px;background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.025));box-shadow:0 28px 80px rgba(0,0,0,.22)}
.brand-value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px}
.brand-value-grid article{display:grid;gap:8px;padding:22px;border-radius:20px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10)}
.brand-value-grid strong{font-size:32px;color:#fff}.brand-value-grid span{color:rgba(255,255,255,.72);line-height:1.55}
.distribution-hero{min-height:720px;background:radial-gradient(circle at 78% 45%,rgba(15,148,255,.16),transparent 32%),linear-gradient(135deg,#041126,#071a33)}
.distribution-hero-grid{display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:70px;min-height:720px;padding-top:120px;padding-bottom:70px}
.distribution-hero .headline{max-width:760px}.distribution-hero .lead{max-width:700px;color:rgba(255,255,255,.76)}
.distribution-visual{position:relative;min-height:440px;border-radius:40px;background:linear-gradient(145deg,rgba(21,164,255,.14),rgba(255,255,255,.025));border:1px solid rgba(255,255,255,.14);overflow:hidden;box-shadow:0 34px 100px rgba(0,0,0,.36)}
.distribution-visual:before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(3,14,31,.15),rgba(3,14,31,.72)),url('https://images.unsplash.com/photo-1586528116311-ad8dd3c8310d?auto=format&fit=crop&w=1400&q=82') center/cover}
.dist-orbit{position:absolute;border:1px solid rgba(46,199,255,.42);border-radius:50%;z-index:2}.orbit-one{width:300px;height:300px;right:-55px;top:-45px}.orbit-two{width:210px;height:210px;left:-35px;bottom:-60px;border-color:rgba(86,231,142,.35)}
.dist-visual-card{position:absolute;left:28px;right:28px;bottom:28px;z-index:3;display:grid;gap:8px;padding:26px;border-radius:24px;background:rgba(3,15,31,.78);border:1px solid rgba(255,255,255,.15);backdrop-filter:blur(18px)}
.dist-visual-card small{letter-spacing:.16em;color:#36c8ff}.dist-visual-card strong{font-size:27px;color:#fff}.dist-visual-card span{color:rgba(255,255,255,.68)}
.distribution-process{padding:100px 0}.dist-process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:42px}
.dist-process-grid article{position:relative;padding:30px 24px 28px;border-radius:24px;background:linear-gradient(155deg,rgba(255,255,255,.08),rgba(255,255,255,.025));border:1px solid rgba(255,255,255,.12);overflow:hidden}
.dist-process-grid article:after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,#22c5ff,#59e98a)}
.dist-process-grid span{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:rgba(34,197,255,.13);border:1px solid rgba(34,197,255,.34);color:#50d5ff;font-weight:900}.dist-process-grid h3{color:#fff;margin:22px 0 10px}.dist-process-grid p{color:rgba(255,255,255,.66);line-height:1.65}
.coverage-section{padding:105px 0}.coverage-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:center}.coverage-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}.coverage-chips span{padding:11px 16px;border-radius:999px;background:#eef7ff;border:1px solid #d6eaff;color:#09213d;font-weight:800}
.lux-coverage-map{position:relative;min-height:460px;border-radius:34px;background:radial-gradient(circle at 50% 50%,rgba(34,197,255,.16),transparent 38%),linear-gradient(145deg,#071a33,#041126);border:1px solid rgba(8,42,76,.16);box-shadow:0 30px 90px rgba(5,27,55,.18);overflow:hidden}
.lux-coverage-map:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:34px 34px}
.delivery-core,.coverage-node{position:absolute;z-index:2;border:1px solid rgba(255,255,255,.16);background:rgba(6,24,48,.9);color:#fff;box-shadow:0 12px 35px rgba(0,0,0,.28)}.delivery-core{left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:150px;height:150px;border-radius:50%;text-align:center;font-weight:900;color:#4bd6ff}.delivery-core small{color:rgba(255,255,255,.64);font-weight:600}.coverage-node{padding:10px 14px;border-radius:999px;font-size:12px}.node-dubai{right:14%;top:18%}.node-sharjah{right:9%;top:42%}.node-ajman{right:22%;bottom:15%}.node-abudhabi{left:10%;bottom:20%}
.wholesale-section{padding:110px 0}.wholesale-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:start}.wholesale-copy{position:sticky;top:130px}.wholesale-benefits{display:grid;gap:13px;margin:30px 0 0;padding:0;list-style:none}.wholesale-benefits li{position:relative;padding-left:28px;color:rgba(255,255,255,.75)}.wholesale-benefits li:before{content:"✓";position:absolute;left:0;color:#55e78e;font-weight:900}.premium-inquiry{padding:34px;border-radius:28px;background:rgba(255,255,255,.97);box-shadow:0 35px 100px rgba(0,0,0,.28)}.premium-inquiry h3{margin:0 0 22px;color:#071a33;font-size:26px}.premium-inquiry .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.premium-inquiry input,.premium-inquiry select,.premium-inquiry textarea{width:100%;padding:14px 15px;border-radius:12px;border:1px solid #d6e1ed;background:#f7faff;font:inherit}.premium-inquiry textarea{min-height:120px;resize:vertical}.premium-inquiry .form-wide{grid-column:1/-1}
@media(max-width:1040px){.distribution-hero-grid,.coverage-grid,.wholesale-grid{grid-template-columns:1fr}.distribution-visual{min-height:360px}.dist-process-grid{grid-template-columns:repeat(2,1fr)}.wholesale-copy{position:static}}
@media(max-width:640px){.brand-showcase-panel{padding:18px}.brand-value-grid{grid-template-columns:1fr}.distribution-hero-grid{padding-top:100px;gap:34px}.distribution-visual{min-height:300px;border-radius:26px}.dist-visual-card{left:16px;right:16px;bottom:16px;padding:18px}.dist-process-grid{grid-template-columns:1fr}.coverage-section,.distribution-process,.wholesale-section{padding:72px 0}.lux-coverage-map{min-height:360px}.premium-inquiry{padding:20px}.premium-inquiry .form-grid{grid-template-columns:1fr}.premium-inquiry .form-wide{grid-column:auto}}

/* === V71: exact connector symmetry and merged Contact + Wholesale === */
@media (max-width:768px){
  .mobile-flow-steps{--mobile-connector-length:24px!important;}
  .external-stage-connector{
    width:var(--mobile-connector-length)!important;
    min-width:var(--mobile-connector-length)!important;
    max-width:var(--mobile-connector-length)!important;
    height:2px!important;
    display:block!important;
  }
  /* Structural connectors now render all four sides; disable legacy side nodes/lines. */
  .mobile-flow-step.step-warehouse::before,
  .mobile-flow-step.step-retail::before{display:none!important;content:none!important;}
  .external-stage-connector[data-side="left"]::after{
    left:-3px!important;right:auto!important;
  }
  .external-stage-connector[data-side="right"]::after{
    right:-3px!important;left:auto!important;
  }
  .external-warehouse{
    background:linear-gradient(90deg,rgba(245,185,47,.18),#f5b92f 30%,#f5b92f 100%)!important;
    box-shadow:0 0 5px #f5b92f,0 0 12px rgba(245,185,47,.82)!important;
  }
  .external-warehouse::after{background:#f5b92f!important;box-shadow:0 0 0 3px rgba(245,185,47,.18),0 0 12px #f5b92f!important;}
  .external-retail{
    background:linear-gradient(90deg,rgba(240,82,146,.18),#f05292 30%,#f05292 100%)!important;
    box-shadow:0 0 5px #f05292,0 0 12px rgba(240,82,146,.82)!important;
  }
  .external-retail::after{background:#f05292!important;box-shadow:0 0 0 3px rgba(240,82,146,.18),0 0 12px #f05292!important;}
}
.contact-hero{min-height:520px;background:radial-gradient(circle at 80% 30%,rgba(34,197,255,.16),transparent 32%),linear-gradient(135deg,#041126,#071a33)}
.contact-hero .container{padding-top:150px;padding-bottom:80px}.contact-hero .lead{max-width:720px;color:rgba(255,255,255,.72)}
.contact-combined-section{padding:90px 0 110px;background:#f5f8fc}.contact-combined-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:28px;align-items:start}
.contact-info-panel,.contact-form-stack>.form-card{border-radius:28px;border:1px solid rgba(8,31,57,.10);box-shadow:0 24px 70px rgba(4,26,50,.08)}
.contact-info-panel{padding:34px;background:#07182d;color:#fff;position:sticky;top:110px}.contact-info-panel .title{color:#fff}.contact-info-panel .lead{color:rgba(255,255,255,.68)}
.contact-direct-grid{display:grid;gap:12px;margin:28px 0}.contact-direct-grid article{display:grid;gap:6px;padding:16px 18px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10)}
.contact-direct-grid span{font-size:11px;letter-spacing:.14em;color:#43cfff}.contact-direct-grid strong{font-size:16px}.contact-map{overflow:hidden;border-radius:20px}.contact-map iframe{display:block}
.contact-form-stack{display:grid;gap:24px}.contact-form-stack>.form-card{padding:32px;background:#fff}.contact-form-stack h2{margin:8px 0 18px}.premium-inquiry{scroll-margin-top:120px;background:linear-gradient(145deg,#fff,#f2f8ff)!important;border-color:rgba(34,197,255,.22)!important}
@media(max-width:900px){.contact-combined-grid{grid-template-columns:1fr}.contact-info-panel{position:relative;top:auto}.contact-hero .container{padding-top:120px}.contact-combined-section{padding:64px 0 80px}}

/* === V72: polished mobile supply-flow geometry + perfectly symmetric branches === */
@media (max-width:768px){
  .mobile-supply-flow,
  .mobile-flow-steps{
    overflow:visible!important;
  }

  .mobile-flow-steps{
    --mobile-connector-length:26px!important;
    width:100%!important;
    box-sizing:border-box!important;
    padding-left:26px!important;
    padding-right:26px!important;
    gap:7px!important;
  }

  .mobile-flow-step,
  .mobile-flow-step:nth-of-type(odd),
  .mobile-flow-step:nth-of-type(even),
  .mobile-flow-step:nth-child(1),
  .mobile-flow-step:nth-child(3),
  .mobile-flow-step:nth-child(5),
  .mobile-flow-step:nth-child(7){
    width:88%!important;
    max-width:88%!important;
    min-width:0!important;
    margin:0!important;
    transform:none!important;
  }

  .mobile-flow-step.step-import,
  .mobile-flow-step.step-distribution{
    align-self:flex-start!important;
  }
  .mobile-flow-step.step-warehouse,
  .mobile-flow-step.step-retail{
    align-self:flex-end!important;
  }

  .external-stage-connector{
    width:var(--mobile-connector-length)!important;
    min-width:var(--mobile-connector-length)!important;
    max-width:var(--mobile-connector-length)!important;
    height:2px!important;
    display:block!important;
    border-radius:999px!important;
    transform:translateY(-50%)!important;
    overflow:visible!important;
    z-index:50!important;
  }

  .external-stage-connector::after{
    width:8px!important;
    height:8px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    border:2px solid #07162a!important;
    border-radius:50%!important;
  }

  .external-stage-connector[data-side="right"]::after{
    right:-4px!important;
    left:auto!important;
  }
  .external-stage-connector[data-side="left"]::after{
    left:-4px!important;
    right:auto!important;
  }

  /* Keep internal content clear and aligned in every card. */
  .mobile-flow-step .flow-copy,
  .mobile-flow-step:nth-of-type(even) .flow-copy{
    min-width:0!important;
    overflow:hidden!important;
    padding:8px 10px!important;
  }
  .mobile-flow-step .flow-copy b,
  .mobile-flow-step .flow-copy small{
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
}


/* === V73: single-source symmetric mobile connectors (remove legacy duplicates) === */
@media (max-width:768px){
  .mobile-flow-steps{
    --mobile-connector-length:24px!important;
    overflow:visible!important;
  }

  /* The external connector is the only connector rendered for every card. */
  .mobile-flow-step > .stage-connector,
  .stage-connector.connector-right{
    display:none!important;
    content:none!important;
  }

  /* Remove old side-line pseudo elements that produced the short duplicate strokes. */
  .mobile-flow-step.step-import::before,
  .mobile-flow-step.step-warehouse::before,
  .mobile-flow-step.step-distribution::before,
  .mobile-flow-step.step-retail::before{
    display:none!important;
    content:none!important;
  }

  .external-stage-connector{
    position:absolute!important;
    display:block!important;
    width:var(--mobile-connector-length)!important;
    min-width:var(--mobile-connector-length)!important;
    max-width:var(--mobile-connector-length)!important;
    height:2px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:999px!important;
    transform:translateY(-50%)!important;
    overflow:visible!important;
    z-index:80!important;
    box-sizing:border-box!important;
  }
  .external-stage-connector::before{display:none!important;content:none!important;}
  .external-stage-connector::after{
    content:""!important;
    position:absolute!important;
    top:50%!important;
    width:8px!important;
    height:8px!important;
    margin:0!important;
    border:2px solid #07162a!important;
    border-radius:50%!important;
    transform:translateY(-50%)!important;
    box-sizing:border-box!important;
  }
  .external-stage-connector[data-side="right"]::after{right:-4px!important;left:auto!important;}
  .external-stage-connector[data-side="left"]::after{left:-4px!important;right:auto!important;}

  .external-import{background:#22c7ff!important;box-shadow:0 0 5px #22c7ff,0 0 11px rgba(34,199,255,.78)!important;}
  .external-import::after{background:#22c7ff!important;box-shadow:0 0 0 3px rgba(34,199,255,.16),0 0 11px #22c7ff!important;}
  .external-warehouse{background:#f5b92f!important;box-shadow:0 0 5px #f5b92f,0 0 11px rgba(245,185,47,.78)!important;}
  .external-warehouse::after{background:#f5b92f!important;box-shadow:0 0 0 3px rgba(245,185,47,.16),0 0 11px #f5b92f!important;}
  .external-distribution{background:#55e78e!important;box-shadow:0 0 5px #55e78e,0 0 11px rgba(85,231,142,.78)!important;}
  .external-distribution::after{background:#55e78e!important;box-shadow:0 0 0 3px rgba(85,231,142,.16),0 0 11px #55e78e!important;}
  .external-retail{background:#f05292!important;box-shadow:0 0 5px #f05292,0 0 11px rgba(240,82,146,.78)!important;}
  .external-retail::after{background:#f05292!important;box-shadow:0 0 0 3px rgba(240,82,146,.16),0 0 11px #f05292!important;}
}

/* === V74: remove the last legacy duplicate branches on Warehouse and Retail === */
@media (max-width:768px){
  /* All four branches are rendered exclusively by .external-stage-connector. */
  .mobile-flow-step.step-import::before,
  .mobile-flow-step.step-import::after,
  .mobile-flow-step.step-warehouse::before,
  .mobile-flow-step.step-warehouse::after,
  .mobile-flow-step.step-distribution::before,
  .mobile-flow-step.step-distribution::after,
  .mobile-flow-step.step-retail::before,
  .mobile-flow-step.step-retail::after{
    display:none!important;
    content:none!important;
    width:0!important;
    height:0!important;
    background:none!important;
    box-shadow:none!important;
    border:0!important;
  }
}

/* V75 — full-bleed, seamless and touch-friendly product carousel */
#products .category-wrap{
  width:100vw;
  max-width:none;
  margin-inline:calc(50% - 50vw);
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
  -ms-overflow-style:none;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-inline:contain;
  touch-action:auto;
  cursor:grab;
  direction:ltr;
}
#products .category-wrap::-webkit-scrollbar{display:none}
#products .category-wrap.is-dragging{cursor:grabbing;user-select:none}
#products .cat-track{
  display:flex;
  width:max-content;
  gap:22px;
  padding-inline:0;
  transform:none!important;
  will-change:auto;
  touch-action:auto!important;
  cursor:inherit;
}
#products .cat-card{flex-shrink:0}
#products .cat-card:first-child{margin-inline-start:0}
#products .cat-card:last-child{margin-inline-end:0}
@media(min-width:1041px){
  #products .cat-card{flex-basis:clamp(360px,27vw,520px);height:min(64vw,560px)}
}
@media(max-width:1040px){
  #products .category-wrap{scroll-snap-type:x proximity}
  #products .cat-card{scroll-snap-align:center}
}
@media(max-width:560px){
  #products .cat-track{gap:14px}
  #products .category-wrap{touch-action:auto!important}
}

/* V76 — unified full-bleed product carousel + refined brand motion */
.category-wrap{
  width:100vw!important;
  max-width:none!important;
  margin-inline:calc(50% - 50vw)!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior-x:contain!important;
  touch-action:pan-y!important;
  cursor:grab!important;
  direction:ltr!important;
  scroll-snap-type:none!important;
}
.category-wrap::-webkit-scrollbar{display:none!important}
.category-wrap.is-dragging{cursor:grabbing!important;user-select:none!important}
.cat-track{
  display:flex!important;
  width:max-content!important;
  gap:clamp(14px,1.3vw,24px)!important;
  padding-inline:0!important;
  transform:none!important;
  will-change:auto!important;
  touch-action:pan-y!important;
  cursor:inherit!important;
}
.cat-card{
  flex:0 0 clamp(360px,27vw,520px)!important;
  scroll-snap-align:none!important;
}
@media(max-width:1040px){
  .cat-card{flex-basis:min(82vw,440px)!important}
}
@media(max-width:560px){
  .cat-track{gap:14px!important}
  .cat-card{flex-basis:82vw!important}
}

/* Elegant continuous brand ribbons on home and Products & Brands pages */
.brand-marquee,
.hero-ticker-viewport{
  position:relative!important;
  overflow:hidden!important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%)!important;
  mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%)!important;
}
.brand-marquee{
  width:100vw!important;
  max-width:none!important;
  margin-inline:calc(50% - 50vw)!important;
  padding-block:18px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012))!important;
  border-block:1px solid rgba(255,255,255,.08)!important;
}
.brand-track,
.hero-brand-track{
  animation-timing-function:linear!important;
  animation-iteration-count:infinite!important;
  animation-play-state:running!important;
  will-change:transform!important;
}
.brand-track{gap:14px!important;animation-duration:30s!important}
.hero-brand-track{animation-duration:25s!important}
.brand-marquee:hover .brand-track,
.hero-ticker-viewport:hover .hero-brand-track{animation-play-state:running!important}
.brand-pill,
.hero-brand-item{
  position:relative!important;
  overflow:hidden!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
  border:1px solid rgba(255,255,255,.16)!important;
  box-shadow:0 10px 30px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.12)!important;
  transition:transform .3s ease,border-color .3s ease,background .3s ease!important;
}
.brand-pill::after,
.hero-brand-item::after{
  content:""!important;
  position:absolute!important;
  inset:-60% auto -60% -35%!important;
  width:30%!important;
  transform:skewX(-18deg)!important;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent)!important;
  animation:brandSheen 5.5s linear infinite!important;
  pointer-events:none!important;
}
.brand-pill:hover,
.hero-brand-item:hover{
  transform:translateY(-2px)!important;
  border-color:rgba(44,184,255,.42)!important;
  background:rgba(255,255,255,.11)!important;
}
@keyframes brandSheen{0%{left:-40%}45%,100%{left:130%}}
@media(max-width:560px){
  .brand-marquee{padding-block:12px!important}
  .brand-track{gap:9px!important;animation-duration:24s!important}
}
@media(prefers-reduced-motion:reduce){
  .brand-track,.hero-brand-track,.brand-pill::after,.hero-brand-item::after{animation-duration:80s!important}
}

/* V77 — immediate resume + reliable manual drag for products and brands */
.category-wrap,
.brand-marquee,
.hero-ticker-viewport{
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior-x:contain!important;
  touch-action:pan-y!important;
  cursor:grab!important;
}
.category-wrap::-webkit-scrollbar,
.brand-marquee::-webkit-scrollbar,
.hero-ticker-viewport::-webkit-scrollbar{display:none!important}
.category-wrap.is-dragging,
.brand-marquee.is-dragging,
.hero-ticker-viewport.is-dragging{cursor:grabbing!important;user-select:none!important}
.cat-track,
.brand-track,
.hero-brand-track{
  animation:none!important;
  transform:none!important;
  width:max-content!important;
  will-change:auto!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  touch-action:pan-y!important;
}
.cat-track img,
.brand-track img,
.hero-brand-track img{
  -webkit-user-drag:none!important;
  user-drag:none!important;
  pointer-events:none!important;
}
.brand-marquee:hover .brand-track,
.hero-ticker-viewport:hover .hero-brand-track{animation-play-state:running!important}

/* V78 — native mobile swipe on Home + portfolio grids on Products page */
.category-wrap:not(.portfolio-products),
.brand-marquee:not(.portfolio-brands),
.hero-ticker-viewport{
  touch-action:pan-x pan-y!important;
  overscroll-behavior-x:contain!important;
}

/* Products page: static premium portfolio, no horizontal scrolling. */
#products .portfolio-products{
  width:100%!important;
  max-width:100%!important;
  margin-inline:0!important;
  overflow:visible!important;
  cursor:default!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
}
#products .portfolio-products .cat-track{
  width:100%!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:clamp(16px,1.8vw,28px)!important;
  padding:0!important;
}
#products .portfolio-products .cat-card{
  width:100%!important;
  height:clamp(320px,36vw,520px)!important;
  min-width:0!important;
  flex:none!important;
  transform:translateY(0) scale(1)!important;
  transition:transform .45s cubic-bezier(.2,.75,.2,1),box-shadow .45s ease,filter .45s ease!important;
  animation:portfolioBreathe 7s ease-in-out infinite!important;
}
#products .portfolio-products .cat-card:nth-child(2n){animation-delay:-2.2s!important}
#products .portfolio-products .cat-card:nth-child(3n){animation-delay:-4.4s!important}
#products .portfolio-products .cat-card:hover{
  transform:translateY(-8px) scale(1.015)!important;
  box-shadow:0 28px 70px rgba(4,18,38,.2)!important;
  filter:saturate(1.06)!important;
}
@keyframes portfolioBreathe{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-4px)}
}

#brands .portfolio-brands{
  width:100%!important;
  max-width:100%!important;
  margin-inline:0!important;
  padding:0!important;
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
  cursor:default!important;
}
#brands .portfolio-brands .brand-track{
  width:100%!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:14px!important;
  padding:0!important;
}
#brands .portfolio-brands .brand-pill{
  width:100%!important;
  min-width:0!important;
  min-height:82px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  animation:brandPortfolioFloat 6.5s ease-in-out infinite!important;
}
#brands .portfolio-brands .brand-pill:nth-child(2n){animation-delay:-1.8s!important}
#brands .portfolio-brands .brand-pill:nth-child(3n){animation-delay:-3.6s!important}
@keyframes brandPortfolioFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-3px)}
}

@media(max-width:900px){
  #products .portfolio-products .cat-track{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #brands .portfolio-brands .brand-track{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:560px){
  #products .portfolio-products .cat-track{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  #products .portfolio-products .cat-card{
    height:235px!important;
    border-radius:18px!important;
  }
  #products .portfolio-products .cat-card .cap{padding:14px 12px!important}
  #products .portfolio-products .cat-card .cap h3{font-size:15px!important;line-height:1.05!important}
  #products .portfolio-products .cat-card .cap p{font-size:10px!important;line-height:1.3!important}
  #brands .portfolio-brands .brand-track{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  #brands .portfolio-brands .brand-pill{
    min-height:66px!important;
    font-size:12px!important;
    padding:10px!important;
  }
}
@media(prefers-reduced-motion:reduce){
  #products .portfolio-products .cat-card,
  #brands .portfolio-brands .brand-pill{animation:none!important}
}

/* V79 — verified home touch dragging + refined Products portfolio */
.category-wrap:not(.portfolio-products),
.brand-marquee:not(.portfolio-brands),
.hero-ticker-viewport{
  touch-action:pan-y!important;
  -webkit-overflow-scrolling:touch!important;
  user-select:none!important;
}

/* Products page: smaller desktop cards with restrained motion. */
@media(min-width:901px){
  #products .portfolio-products .cat-track{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:18px!important;
    max-width:1440px!important;
    margin-inline:auto!important;
  }
  #products .portfolio-products .cat-card{
    height:clamp(260px,26vw,390px)!important;
    animation:productSoftFloat 8s ease-in-out infinite!important;
  }
  #products .portfolio-products .cat-card:nth-child(2n){animation-delay:-2s!important}
  #products .portfolio-products .cat-card:nth-child(3n){animation-delay:-4s!important}
  #products .portfolio-products .cat-card:nth-child(4n){animation-delay:-6s!important}
}
@keyframes productSoftFloat{
  0%,100%{transform:translateY(0) scale(1)}
  50%{transform:translateY(-3px) scale(1.004)}
}

/* Product-page brands: static; only react on hover/focus. */
#brands .portfolio-brands .brand-pill{
  animation:none!important;
  transform:none!important;
  transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease,background .28s ease!important;
}
#brands .portfolio-brands .brand-pill:hover,
#brands .portfolio-brands .brand-pill:focus-within{
  transform:translateY(-4px) scale(1.025)!important;
  box-shadow:0 16px 38px rgba(0,106,180,.18)!important;
  border-color:rgba(0,154,255,.42)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(235,247,255,.96))!important;
}


/* V80 — robust interactive home carousels + editable product/brand CMS */
.category-wrap:not(.portfolio-products),
.brand-marquee:not(.portfolio-brands),
.hero-ticker-viewport{
  overflow-x:auto!important;overflow-y:hidden!important;
  touch-action:pan-y!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior-x:contain!important;
  scrollbar-width:none!important;cursor:grab!important;
}
.category-wrap:not(.portfolio-products)::-webkit-scrollbar,
.brand-marquee:not(.portfolio-brands)::-webkit-scrollbar,
.hero-ticker-viewport::-webkit-scrollbar{display:none!important}
.category-wrap.is-dragging,.brand-marquee.is-dragging,.hero-ticker-viewport.is-dragging{cursor:grabbing!important;user-select:none!important}
.product-card-link,.brand-link{display:contents;color:inherit;text-decoration:none}
/* On Home, brand children must never stretch to viewport width. */
.brand-marquee:not(.portfolio-brands) .brand-track{display:flex!important;flex-wrap:nowrap!important;width:max-content!important;min-width:max-content!important;gap:14px!important}
.brand-marquee:not(.portfolio-brands) .brand-pill{flex:0 0 auto!important;min-width:170px!important}
@media(max-width:640px){
 .brand-marquee:not(.portfolio-brands) .brand-pill{min-width:112px!important}
 .category-wrap:not(.portfolio-products),.brand-marquee:not(.portfolio-brands),.hero-ticker-viewport{touch-action:pan-y!important}
}
.admin-items-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:18px}
.admin-item-card{display:grid;gap:10px;padding:16px;border:1px solid #dce3ec;border-radius:18px;background:#fff}
.admin-item-card label,.admin-brand-rich label{display:grid;gap:5px;font-weight:700;font-size:13px}
.admin-item-card input,.admin-item-card textarea,.admin-brand-rich input{width:100%;padding:10px;border:1px solid #ccd6e2;border-radius:10px;font:inherit}
.admin-item-card textarea{min-height:72px;resize:vertical}.admin-preview img{width:100%;height:120px;object-fit:cover;border-radius:12px}
.admin-checks{display:flex;gap:14px;flex-wrap:wrap}.admin-save-item,.admin-brand-rich button{padding:10px 14px;border:0;border-radius:10px;background:#071a30;color:#fff;font-weight:800;cursor:pointer}
.admin-brand-rich{display:grid!important;grid-template-columns:1fr 1fr;gap:10px!important;align-items:end}
@media(max-width:720px){.admin-items-grid{grid-template-columns:1fr}.admin-brand-rich{grid-template-columns:1fr}}

/* === v81: reliable home marquees, premium portfolio motion, UAE coverage, gallery === */
/* The JS owns marquee movement; CSS transforms must not fight scrollLeft. */
.brand-track,
.rtl .brand-track{
  animation:none!important;
  transform:none!important;
}
.brand-marquee{
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scrollbar-width:none;
  -ms-overflow-style:none;
  cursor:grab;
  touch-action:pan-y!important;
  overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;
}
.brand-marquee::-webkit-scrollbar{display:none}
.brand-marquee.is-dragging{cursor:grabbing;user-select:none}
.brand-track{flex-wrap:nowrap!important;min-width:max-content!important;will-change:auto}
.brand-pill{flex:0 0 170px;transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}
.brand-pill:hover{transform:translateY(-5px) scale(1.025);box-shadow:0 22px 55px rgba(6,23,45,.14);border-color:rgba(4,163,223,.35)}

/* Products portfolio: clearly visible, subtle independent breathing motion. */
#products .portfolio-products .cat-card{
  animation:productFloat 6.5s ease-in-out infinite!important;
  transform-origin:center bottom;
}
#products .portfolio-products .cat-card:nth-child(2n){animation-delay:-1.7s!important}
#products .portfolio-products .cat-card:nth-child(3n){animation-delay:-3.2s!important}
#products .portfolio-products .cat-card:nth-child(4n){animation-delay:-4.6s!important}
@keyframes productFloat{
  0%,100%{transform:translateY(0) rotate(.001deg);box-shadow:0 24px 65px rgba(6,23,45,.14)}
  50%{transform:translateY(-8px) rotate(.25deg);box-shadow:0 34px 82px rgba(6,23,45,.2)}
}
#products .portfolio-products .cat-card:hover{
  animation-play-state:paused!important;
  transform:translateY(-13px) scale(1.018)!important;
}
.brand-value-count{font-variant-numeric:tabular-nums}

/* New premium distribution block. */
.home-distribution{overflow:hidden}
.distribution-heading{align-items:center}
.uae-route-card{position:relative;display:grid;grid-template-columns:minmax(280px,.72fr) minmax(520px,1.45fr);min-height:560px;border:1px solid rgba(255,255,255,.13);border-radius:44px;overflow:hidden;background:linear-gradient(135deg,rgba(9,40,73,.97),rgba(4,18,39,.96));box-shadow:0 36px 100px rgba(0,0,0,.3)}
.uae-route-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 75% 45%,rgba(4,163,223,.2),transparent 36%),linear-gradient(110deg,transparent 35%,rgba(255,255,255,.025));pointer-events:none}
.route-copy{position:relative;z-index:3;padding:58px 20px 52px 52px;align-self:center}
.route-badge{display:inline-flex;padding:9px 13px;border-radius:999px;border:1px solid rgba(94,216,255,.28);background:rgba(94,216,255,.08);color:#73dcff;font-size:11px;font-weight:950;letter-spacing:.12em}
.route-copy h3{font-size:clamp(34px,4vw,60px);line-height:.95;letter-spacing:-.055em;margin:24px 0 20px;max-width:520px}
.route-copy p{color:rgba(255,255,255,.7);line-height:1.8;max-width:470px}
.route-legend{display:flex;gap:18px;flex-wrap:wrap;margin-top:28px;color:rgba(255,255,255,.72);font-size:12px;font-weight:800}
.route-legend span{display:flex;align-items:center;gap:8px}.route-legend i{width:9px;height:9px;border-radius:50%;background:#44d6ff;box-shadow:0 0 18px #44d6ff}
.route-visual{position:relative;min-height:560px;background:linear-gradient(90deg,rgba(5,22,44,.55),rgba(5,22,44,.14)),url('https://images.unsplash.com/photo-1519003722824-194d4455a60c?auto=format&fit=crop&w=1600&q=88') center/cover}
.route-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#071b35 0,transparent 25%,rgba(4,15,31,.18));pointer-events:none}
.route-svg{position:absolute;inset:12% 4% 8%;width:92%;height:80%;z-index:2;overflow:visible}
.route-path{fill:none;stroke:#48dcff;stroke-width:5;stroke-linecap:round;stroke-dasharray:10 13;filter:drop-shadow(0 0 8px #04a3df);animation:routeFlow 8s linear infinite}
.route-path-shadow{stroke:rgba(255,255,255,.22);stroke-width:12;stroke-dasharray:none;filter:none}
@keyframes routeFlow{to{stroke-dashoffset:-230}}
.emirate{position:absolute;z-index:5;padding:9px 13px;border-radius:999px;background:rgba(4,20,42,.7);border:1px solid rgba(255,255,255,.27);backdrop-filter:blur(12px);color:#fff;font-size:11px;font-weight:900;box-shadow:0 10px 30px rgba(0,0,0,.22)}
.emirate:before{content:"";display:inline-block;width:7px;height:7px;margin-inline-end:7px;border-radius:50%;background:#59e1ff;box-shadow:0 0 12px #59e1ff}
.e-auh{left:7%;top:58%}.e-dxb{left:36%;top:34%}.e-shj{left:50%;top:23%}.e-ajm{left:61%;top:31%}.e-uaq{left:67%;top:47%}.e-rak{right:5%;top:20%}.e-fuj{right:8%;bottom:18%}
.delivery-truck{position:absolute;z-index:4;width:150px;height:92px;border-radius:20px;overflow:hidden;border:2px solid rgba(89,225,255,.8);box-shadow:0 18px 50px rgba(0,0,0,.4),0 0 28px rgba(4,163,223,.35);animation:truckRoute 12s ease-in-out infinite}
.delivery-truck img{width:100%;height:100%;object-fit:cover;filter:saturate(1.08) contrast(1.05)}
@keyframes truckRoute{0%{left:8%;top:62%;transform:translate(-10%,-50%) scale(.9)}25%{left:38%;top:43%;transform:translate(-10%,-50%) scale(1)}50%{left:61%;top:30%;transform:translate(-10%,-50%) scale(1.02)}75%{left:77%;top:49%;transform:translate(-10%,-50%) scale(.96)}100%{left:8%;top:62%;transform:translate(-10%,-50%) scale(.9)}}

/* Gallery uses a balanced editorial grid, no clipped masonry gaps. */
.home-gallery-grid{display:grid;grid-template-columns:1.15fr .85fr .85fr;grid-template-rows:260px 260px;gap:18px}
.home-gallery-grid a{position:relative;overflow:hidden;border-radius:30px;box-shadow:0 22px 65px rgba(6,23,45,.13);background:#092849}
.home-gallery-grid .gallery-feature{grid-row:1/3}
.home-gallery-grid a:last-child{grid-column:2/4}
.home-gallery-grid img{width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.2,.75,.2,1),filter .4s ease}
.home-gallery-grid a:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 48%,rgba(3,14,30,.82))}
.home-gallery-grid span{position:absolute;z-index:2;left:22px;right:22px;bottom:19px;color:#fff;font-weight:950;font-size:16px}
.home-gallery-grid a:hover img{transform:scale(1.055);filter:saturate(1.08)}

@media(max-width:900px){
 .uae-route-card{grid-template-columns:1fr;min-height:auto}.route-copy{padding:38px 28px 24px}.route-visual{min-height:500px}.home-gallery-grid{grid-template-columns:1fr 1fr;grid-template-rows:310px 210px 210px}.home-gallery-grid .gallery-feature{grid-column:1/3;grid-row:auto}.home-gallery-grid a:last-child{grid-column:1/3}
}
@media(max-width:600px){
 .route-copy h3{font-size:34px}.route-visual{min-height:430px}.emirate{font-size:9px;padding:7px 9px}.delivery-truck{width:96px;height:62px}.home-gallery-grid{grid-template-columns:1fr 1fr;grid-template-rows:240px 165px 165px;gap:10px}.home-gallery-grid a{border-radius:20px}.home-gallery-grid span{font-size:12px;left:14px;bottom:13px}.brand-pill{flex-basis:138px;min-width:138px;height:72px}
}


/* === V82: guaranteed brand motion, UAE map, complete footer === */
.brand-marquee:not(.portfolio-brands){overflow:hidden!important;touch-action:pan-y!important;cursor:grab!important}
.brand-marquee:not(.portfolio-brands).is-dragging{cursor:grabbing!important;user-select:none!important}
.brand-marquee:not(.portfolio-brands) .brand-track{display:flex!important;width:max-content!important;min-width:max-content!important;flex-wrap:nowrap!important;animation:none!important;will-change:transform!important;transform:translate3d(0,0,0)}
.hero-ticker-viewport{overflow:hidden!important;touch-action:pan-y!important;cursor:grab!important}
.hero-brand-track{display:flex!important;width:max-content!important;min-width:max-content!important;animation:none!important;will-change:transform!important}

.uae-map-card{display:grid;grid-template-columns:minmax(300px,.72fr) minmax(560px,1.35fr);overflow:hidden;border-radius:42px;border:1px solid rgba(255,255,255,.14);background:linear-gradient(135deg,#082846,#06172d);box-shadow:0 34px 100px rgba(0,0,0,.3)}
.uae-map-copy{padding:58px 48px;align-self:center}.uae-map-copy h3{font-size:clamp(34px,4vw,58px);line-height:.98;letter-spacing:-.05em;margin:22px 0 18px}.uae-map-copy p{color:rgba(255,255,255,.72);line-height:1.8}.uae-map-copy .btn{margin-top:28px}
.uae-map-visual{position:relative;min-height:570px;background:radial-gradient(circle at 55% 42%,rgba(25,150,210,.2),transparent 38%),linear-gradient(145deg,#0a3153,#06182d);overflow:hidden}
.uae-map-visual:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.026) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.026) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 82%,transparent)}
.uae-map-svg{position:absolute;inset:3% 2% 1%;width:96%;height:96%;overflow:visible}.uae-shape{fill:url(#uaeFill);stroke:rgba(107,221,255,.55);stroke-width:3;filter:drop-shadow(0 20px 30px rgba(0,0,0,.35))}.uae-coast{fill:none;stroke:rgba(255,255,255,.35);stroke-width:2}.map-route-shadow{fill:none;stroke:rgba(61,218,255,.14);stroke-width:17;stroke-linecap:round}.map-route{fill:none;stroke:#51ddff;stroke-width:5;stroke-linecap:round;stroke-dasharray:10 13;filter:drop-shadow(0 0 8px #04a3df);animation:mapDash 1.2s linear infinite}.route-runner{fill:#fff;stroke:#42dcff;stroke-width:5;filter:url(#mapGlow)}.map-nodes circle{fill:#071b33;stroke:#67e5ff;stroke-width:4;filter:url(#mapGlow)}@keyframes mapDash{to{stroke-dashoffset:-46}}
.map-label{position:absolute;z-index:4;padding:8px 11px;border-radius:999px;background:rgba(5,22,42,.88);border:1px solid rgba(103,229,255,.38);color:#fff;font-size:10px;font-weight:900;box-shadow:0 10px 28px rgba(0,0,0,.28)}.l-abu{left:10%;top:67%}.l-dubai{left:43%;top:70%}.l-sharjah{left:54%;top:31%}.l-ajman{left:62%;top:23%}.l-uaq{left:69%;top:37%}.l-rak{right:5%;top:16%}.l-fuj{right:7%;bottom:22%}
.dist-process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.dist-process-grid article{padding:28px;border:1px solid var(--darkline);border-radius:26px;background:#fff;box-shadow:0 22px 60px rgba(6,23,45,.08)}.dist-process-grid article span{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#e8f7ff;color:#087ebc;font-weight:950}.dist-process-grid h3{font-size:21px}.dist-process-grid p{color:var(--muted);line-height:1.65}.distribution-cta{margin-top:34px;padding:30px 34px;border-radius:28px;background:linear-gradient(135deg,#06172d,#0b3c66);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:22px}.distribution-cta h2{margin:0 0 7px}.distribution-cta p{margin:0;color:rgba(255,255,255,.7)}

.premium-footer{background:#041326;color:#fff;padding:72px 0 0;border-top:1px solid rgba(255,255,255,.08)}.footer-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:48px;padding-bottom:50px}.footer-grid>div:not(.footer-company){display:flex;flex-direction:column;gap:12px}.footer-grid h4{margin:0 0 8px;color:#65dfff;font-size:13px;text-transform:uppercase;letter-spacing:.12em}.footer-grid a{color:rgba(255,255,255,.72);transition:.2s}.footer-grid a:hover{color:#fff;transform:translateX(3px)}.footer-logo{display:flex;align-items:center;gap:13px;color:#fff!important;font-weight:950}.footer-logo img{width:58px;height:58px;object-fit:contain}.footer-company p{max-width:440px;color:rgba(255,255,255,.65);line-height:1.75}.footer-company>span{display:block;color:rgba(255,255,255,.55);margin-top:7px}.footer-call{display:inline-block;color:#65dfff!important;font-size:20px;font-weight:900}.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:22px 0;display:flex;justify-content:space-between;gap:20px;color:rgba(255,255,255,.5);font-size:12px}

@media(max-width:900px){.uae-map-card{grid-template-columns:1fr}.uae-map-copy{padding:38px 28px}.uae-map-visual{min-height:500px}.dist-process-grid{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1.5fr 1fr 1fr}.footer-grid>div:last-child{grid-column:2/4}}
@media(max-width:600px){.uae-map-visual{min-height:430px}.map-label{font-size:7.5px;padding:6px 7px}.uae-map-copy h3{font-size:34px}.dist-process-grid{grid-template-columns:1fr}.distribution-cta{align-items:flex-start;flex-direction:column}.footer-grid{grid-template-columns:1fr 1fr;gap:30px}.footer-company{grid-column:1/3}.footer-grid>div:last-child{grid-column:auto}.footer-bottom{flex-direction:column}.brand-marquee:not(.portfolio-brands) .brand-pill{flex-basis:138px!important;min-width:138px!important}}

/* v83: one robust autoplay/manual engine for all brand rails */
.brand-marquee,.hero-ticker-viewport{overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:none;-ms-overflow-style:none;direction:ltr;touch-action:pan-y;cursor:grab;overscroll-behavior-x:contain}
.brand-marquee::-webkit-scrollbar,.hero-ticker-viewport::-webkit-scrollbar{display:none}
.brand-track,.hero-brand-track{animation:none!important;transform:none!important;will-change:auto!important;flex-direction:row!important;width:max-content}
.brand-marquee.is-dragging,.hero-ticker-viewport.is-dragging{cursor:grabbing}

/* Premium live logistics command map */
.home-distribution{position:relative;overflow:hidden}
.home-distribution:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 76% 35%,rgba(0,187,255,.16),transparent 34%),linear-gradient(135deg,#06172d,#092c4f);pointer-events:none}
.logistics-command{position:relative;display:grid;grid-template-columns:minmax(300px,.82fr) minmax(0,1.68fr);min-height:610px;border:1px solid rgba(104,215,255,.25);border-radius:44px;overflow:hidden;background:rgba(7,31,61,.82);box-shadow:0 42px 120px rgba(0,0,0,.38)}
.logistics-copy{position:relative;z-index:5;padding:58px 50px;background:linear-gradient(145deg,rgba(8,43,77,.98),rgba(6,27,52,.94));display:flex;flex-direction:column;justify-content:center}
.logistics-copy h3{font-size:clamp(38px,4.1vw,68px);line-height:.94;letter-spacing:-.055em;margin:22px 0 24px;color:#fff}
.logistics-copy p{color:rgba(255,255,255,.72);line-height:1.85;font-size:16px}
.live-badge{display:inline-flex;align-items:center;gap:10px;width:max-content;padding:11px 15px;border-radius:999px;border:1px solid rgba(79,215,255,.38);background:rgba(4,163,223,.09);color:#71dcff;font-weight:950;font-size:11px;letter-spacing:.13em}
.live-badge:before{content:"";width:8px;height:8px;border-radius:50%;background:#52e1ff;box-shadow:0 0 0 6px rgba(82,225,255,.11),0 0 22px #52e1ff;animation:livePulse 1.8s ease-in-out infinite}
@keyframes livePulse{50%{transform:scale(.68);opacity:.58}}
.route-legend{display:grid;gap:12px;margin:22px 0 4px;color:#fff;font-weight:800;font-size:13px}.route-legend span{display:flex;align-items:center;gap:10px}.route-legend i{width:9px;height:9px;border-radius:50%;background:#4ad9ff;box-shadow:0 0 16px rgba(74,217,255,.85)}
.logistics-visual{position:relative;min-height:610px;overflow:hidden;background:linear-gradient(rgba(4,19,38,.12),rgba(4,19,38,.55)),url('https://images.unsplash.com/photo-1519003722824-194d4455a60c?auto=format&fit=crop&w=1800&q=86') center/cover}
.logistics-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,28,54,.88),transparent 20%,rgba(4,19,38,.15)),radial-gradient(circle at 60% 42%,transparent,rgba(3,17,34,.48));pointer-events:none}
.command-panel{position:absolute;inset:34px;z-index:3;border:1px solid rgba(139,228,255,.2);border-radius:32px;background:rgba(5,25,49,.3);backdrop-filter:blur(2px);overflow:hidden}
.command-panel:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(94,213,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(94,213,255,.06) 1px,transparent 1px);background-size:46px 46px}
.network-svg{position:absolute;inset:0;width:100%;height:100%;z-index:2;filter:drop-shadow(0 0 13px rgba(38,205,255,.34))}
.network-route{fill:none;stroke:#45d9ff;stroke-width:3.5;stroke-linecap:round;stroke-dasharray:12 13;animation:dashFlow 1.25s linear infinite}
.network-route.secondary{stroke:#2aa8e6;stroke-width:2.2;opacity:.62;animation-duration:1.8s}
@keyframes dashFlow{to{stroke-dashoffset:-25}}
.network-node{fill:#071b35;stroke:#59e0ff;stroke-width:3}.network-halo{fill:rgba(64,215,255,.1);stroke:rgba(89,224,255,.28);stroke-width:1;animation:nodeHalo 2.4s ease-out infinite;transform-box:fill-box;transform-origin:center}@keyframes nodeHalo{50%{transform:scale(1.8);opacity:0}}
.route-truck{filter:drop-shadow(0 0 10px #54ddff)}
.emirate-label{position:absolute;z-index:4;padding:9px 12px;border-radius:999px;background:rgba(4,21,42,.82);border:1px solid rgba(101,220,255,.33);color:#fff;font-size:11px;font-weight:900;white-space:nowrap;backdrop-filter:blur(12px)}
.emirate-label:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#56e1ff;margin-inline-end:7px;box-shadow:0 0 12px #56e1ff}
.hub-card{position:absolute;z-index:5;left:42%;top:42%;transform:translate(-50%,-50%);padding:17px 20px;border-radius:20px;background:linear-gradient(135deg,rgba(7,41,75,.96),rgba(4,21,42,.9));border:1px solid rgba(102,222,255,.5);color:#fff;box-shadow:0 20px 55px rgba(0,0,0,.34),0 0 35px rgba(45,207,255,.15)}
.hub-card b{display:block;font-size:13px}.hub-card small{display:block;color:#67dcff;margin-top:4px;font-weight:800}
.e-abu{left:8%;bottom:12%}.e-dubai{left:49%;bottom:10%}.e-sharjah{left:43%;top:27%}.e-ajman{left:57%;top:19%}.e-uaq{right:17%;top:35%}.e-rak{right:5%;top:11%}.e-fuj{right:7%;bottom:13%}
@media(max-width:900px){.logistics-command{grid-template-columns:1fr}.logistics-copy{padding:38px 26px}.logistics-visual{min-height:480px}.command-panel{inset:18px}.emirate-label{font-size:9px;padding:7px 9px}.hub-card{left:44%;top:45%;padding:12px 14px}}
@media(max-width:560px){.logistics-visual{min-height:410px}.e-rak{right:2%;top:8%}.e-uaq{right:4%;top:34%}.e-fuj{right:2%;bottom:10%}.e-ajman{left:58%;top:16%}.e-sharjah{left:36%;top:26%}.e-dubai{left:47%;bottom:8%}.e-abu{left:2%;bottom:12%}}


/* v84 premium UAE live distribution network */
.logistics-command-v2{grid-template-columns:minmax(300px,.78fr) minmax(0,1.72fr);min-height:660px;background:linear-gradient(135deg,rgba(4,24,48,.97),rgba(5,39,70,.92));border-color:rgba(84,218,255,.34);box-shadow:0 50px 140px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.05)}
.logistics-command-v2 .logistics-copy{background:linear-gradient(160deg,#072b50 0%,#061e3a 72%,#04172d 100%);border-inline-end:1px solid rgba(95,218,255,.13)}
.premium-network{position:relative;min-height:660px;isolation:isolate;background:radial-gradient(circle at 66% 28%,rgba(40,213,255,.18),transparent 28%),radial-gradient(circle at 40% 78%,rgba(0,111,255,.14),transparent 34%),linear-gradient(145deg,#071d36,#082d50)}
.premium-network:before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 20%,rgba(94,226,255,.07) 47%,transparent 66%);animation:networkSweep 6s ease-in-out infinite;pointer-events:none;z-index:2}
.network-glow{position:absolute;border-radius:50%;filter:blur(50px);opacity:.34;pointer-events:none}.glow-a{width:230px;height:230px;right:7%;top:7%;background:#2bd9ff}.glow-b{width:270px;height:270px;left:18%;bottom:3%;background:#006cff}
.network-toolbar{position:absolute;z-index:8;left:34px;right:34px;top:22px;height:44px;border:1px solid rgba(108,222,255,.2);border-radius:16px;background:rgba(4,22,43,.68);backdrop-filter:blur(16px);display:flex;align-items:center;gap:10px;padding:0 16px;color:#8deaff;letter-spacing:.12em;font-size:10px;font-weight:900}
.toolbar-pulse{width:8px;height:8px;border-radius:50%;background:#5ee8ff;box-shadow:0 0 0 0 rgba(94,232,255,.65);animation:toolbarPulse 1.8s infinite}.toolbar-bars{margin-inline-start:auto;display:flex;gap:4px;align-items:end}.toolbar-bars i{display:block;width:3px;border-radius:3px;background:#6ae8ff;animation:barWave 1.2s ease-in-out infinite}.toolbar-bars i:nth-child(1){height:8px}.toolbar-bars i:nth-child(2){height:15px;animation-delay:.18s}.toolbar-bars i:nth-child(3){height:11px;animation-delay:.36s}
.command-panel-v2{inset:78px 28px 26px;border-radius:34px;background:linear-gradient(145deg,rgba(4,25,49,.58),rgba(5,33,61,.42));border-color:rgba(105,225,255,.25);box-shadow:inset 0 0 70px rgba(18,187,255,.06),0 25px 60px rgba(0,0,0,.22)}
.command-panel-v2:before{background-size:48px 48px;opacity:.8;mask-image:linear-gradient(to bottom,black,transparent 92%)}
.network-svg-v2{position:absolute;inset:2.5% 2%;width:96%;height:93%;overflow:visible;filter:drop-shadow(0 18px 30px rgba(0,0,0,.22))}
.uae-land{filter:drop-shadow(0 0 18px rgba(45,210,255,.16))}.coast-highlight{fill:none;stroke:#82ebff;stroke-width:3;stroke-linecap:round;opacity:.8;filter:url(#softGlow)}
.map-grid path{fill:none;stroke:#55bfe5;stroke-width:1;opacity:.06}.route-set use{pointer-events:none}.network-route{stroke:#52e1ff;stroke-width:3.2;stroke-dasharray:10 12;opacity:.95;filter:url(#softGlow);animation:dashFlow 1.1s linear infinite}.network-route.route-main{stroke-width:4.2;stroke:#91efff}.vehicle{fill:#ecfbff;stroke:#5edfff;stroke-width:1;filter:url(#softGlow)}.vehicle rect{fill:#23c8ff}.vehicle circle{fill:#03162c;stroke:#79eaff;stroke-width:1}
.city-node .node-halo{fill:rgba(58,220,255,.16);stroke:#65e7ff;stroke-width:1.5;animation:nodeBreath 2.2s ease-in-out infinite}.city-node .node-core{fill:#dffcff;stroke:#23c9ff;stroke-width:3;filter:url(#softGlow)}.radar-ring{fill:none;stroke:#51ddff;opacity:.45}.radar-ring.r1{animation:radarRing 2.6s ease-out infinite}.radar-ring.r2{animation:radarRing 2.6s .9s ease-out infinite}
.hub-card-v2{left:49.5%;top:51%;display:flex;align-items:center;gap:12px;padding:12px 16px 12px 12px;border-radius:18px;background:linear-gradient(145deg,rgba(6,48,84,.96),rgba(3,22,43,.95));box-shadow:0 18px 50px rgba(0,0,0,.42),0 0 35px rgba(40,212,255,.2)}.hub-icon{display:grid;place-items:center;width:37px;height:37px;border-radius:12px;background:linear-gradient(145deg,#38ddff,#0878d3);color:#fff;font-size:11px;font-weight:1000;box-shadow:0 0 20px rgba(54,221,255,.38)}
.command-panel-v2 .emirate-label{background:rgba(3,19,38,.88);border-color:rgba(102,226,255,.38);box-shadow:0 10px 24px rgba(0,0,0,.28);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}.command-panel-v2 .emirate-label:hover{transform:translateY(-3px) scale(1.04);border-color:#76eaff;box-shadow:0 12px 30px rgba(0,0,0,.35),0 0 20px rgba(50,215,255,.18)}
.command-panel-v2 .e-abu{left:7%;top:68%}.command-panel-v2 .e-dubai{left:28%;top:78%}.command-panel-v2 .e-sharjah{left:48%;top:45%}.command-panel-v2 .e-ajman{left:60%;top:25%}.command-panel-v2 .e-uaq{right:15%;top:39%}.command-panel-v2 .e-rak{right:5%;top:9%}.command-panel-v2 .e-fuj{right:5%;bottom:9%}
.network-kpis{position:absolute;z-index:6;left:20px;right:20px;bottom:18px;display:flex;justify-content:flex-end;gap:10px;pointer-events:none}.network-kpis span{min-width:98px;padding:10px 13px;border:1px solid rgba(108,224,255,.18);border-radius:15px;background:rgba(3,20,40,.7);backdrop-filter:blur(12px);text-align:left}.network-kpis strong{display:block;color:#fff;font-size:17px;line-height:1}.network-kpis small{display:block;margin-top:5px;color:#73dcff;font-size:8px;text-transform:uppercase;letter-spacing:.1em;font-weight:900}
@keyframes networkSweep{0%,100%{transform:translateX(-35%);opacity:0}45%,55%{opacity:1}60%{transform:translateX(38%)}}
@keyframes toolbarPulse{70%{box-shadow:0 0 0 9px rgba(94,232,255,0)}}@keyframes barWave{50%{height:18px;opacity:.55}}@keyframes nodeBreath{50%{r:16;opacity:.45}}@keyframes radarRing{0%{r:14;opacity:.7}100%{r:64;opacity:0}}
@media(max-width:900px){.logistics-command-v2{grid-template-columns:1fr;min-height:auto}.premium-network{min-height:570px}.command-panel-v2{inset:70px 14px 18px}.network-toolbar{left:18px;right:18px}.network-kpis{justify-content:center}.network-kpis span{min-width:84px}.hub-card-v2{left:49%;top:50%}}
@media(max-width:600px){.premium-network{min-height:460px}.command-panel-v2{inset:60px 8px 12px;border-radius:24px}.network-toolbar{top:12px;height:38px;left:10px;right:10px}.network-svg-v2{inset:1%;width:98%;height:90%}.hub-card-v2{padding:8px 10px;gap:7px}.hub-icon{width:28px;height:28px;font-size:9px}.hub-card-v2 b{font-size:9px}.hub-card-v2 small{font-size:7px}.command-panel-v2 .emirate-label{font-size:7px;padding:5px 7px}.network-kpis{bottom:8px;gap:5px}.network-kpis span{min-width:0;flex:1;padding:7px 8px}.network-kpis strong{font-size:13px}.network-kpis small{font-size:6px}.logistics-command-v2 .logistics-copy h3{font-size:38px}}
@media(prefers-reduced-motion:reduce){.network-route,.vehicle,.radar-ring,.premium-network:before,.toolbar-pulse,.toolbar-bars i{animation:none!important}}


/* === V84: premium enterprise logistics network === */
.logistics-command-v84{grid-template-columns:minmax(320px,.76fr) minmax(0,1.74fr);min-height:680px;background:linear-gradient(135deg,#071a31,#0a3155);border-color:rgba(116,224,255,.34);box-shadow:0 50px 140px rgba(0,0,0,.48),inset 0 1px rgba(255,255,255,.05)}
.logistics-command-v84 .logistics-copy{padding:62px 52px;background:linear-gradient(145deg,rgba(8,43,77,.99),rgba(4,23,45,.97));border-right:1px solid rgba(103,221,255,.13)}
.network-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:24px 0 4px}.network-metrics>div{padding:15px 12px;border:1px solid rgba(104,222,255,.19);border-radius:18px;background:rgba(5,24,47,.55);box-shadow:inset 0 1px rgba(255,255,255,.03)}.network-metrics strong{display:block;color:#fff;font-size:25px;letter-spacing:-.04em}.network-metrics span{display:block;margin-top:4px;color:rgba(255,255,255,.54);font-size:9px;line-height:1.3;text-transform:uppercase;letter-spacing:.08em}
.logistics-visual-v84{min-height:680px;background:radial-gradient(circle at 75% 5%,rgba(75,223,255,.25),transparent 33%),linear-gradient(150deg,#0a3356,#041629)}.logistics-visual-v84:after{background:linear-gradient(90deg,rgba(4,22,42,.32),transparent 28%),radial-gradient(circle at 55% 48%,transparent 30%,rgba(2,13,27,.4))}
.map-sheen{position:absolute;inset:-25% -35%;background:linear-gradient(115deg,transparent 36%,rgba(111,232,255,.10) 48%,transparent 59%);animation:mapSheenV84 8s ease-in-out infinite;z-index:2;pointer-events:none}@keyframes mapSheenV84{0%,45%{transform:translateX(-20%)}75%,100%{transform:translateX(25%)}}
.command-panel-v84{inset:30px;border-radius:34px;background:linear-gradient(145deg,rgba(7,32,58,.56),rgba(2,16,31,.32));backdrop-filter:blur(10px);border-color:rgba(140,232,255,.25);box-shadow:inset 0 1px rgba(255,255,255,.06),0 35px 90px rgba(0,0,0,.25)}
.command-panel-v84:before{background-size:42px 42px;opacity:.9}.map-topbar{position:absolute;z-index:8;left:22px;right:22px;top:18px;display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-bottom:1px solid rgba(105,222,255,.15);color:#8beaff;font-size:10px;font-weight:900;letter-spacing:.12em}.map-topbar span{display:flex;align-items:center;gap:9px}.map-topbar i{width:7px;height:7px;border-radius:50%;background:#5ce7ff;box-shadow:0 0 0 6px rgba(92,231,255,.08),0 0 18px #5ce7ff;animation:livePulse 1.6s infinite}.map-topbar small{color:rgba(255,255,255,.46);font-size:9px}
.uae-live-map{position:absolute;inset:48px 2% 2%;width:96%;height:91%;overflow:visible;filter:drop-shadow(0 28px 35px rgba(0,0,0,.42))}.isometric-shadow path{fill:#020d1b;opacity:.76;transform:translateY(18px)}.uae-land-v84{fill:url(#landFillV84);stroke:rgba(105,225,255,.64);stroke-width:2.5}.uae-coast-v84{fill:none;stroke:url(#coastGlowV84);stroke-width:5;opacity:.72;filter:url(#glowV84)}
.route-glows-v84 use{fill:none;stroke:#1dc9ff;stroke-width:18;stroke-linecap:round;opacity:.08}.routes-v84 use{fill:none;stroke:#61e6ff;stroke-width:4;stroke-linecap:round;stroke-dasharray:10 15;animation:routeFlowV84 1.15s linear infinite;filter:url(#glowV84)}.routes-v84 use:nth-child(2){animation-duration:1.55s;opacity:.78}.routes-v84 use:nth-child(3){animation-duration:1.35s;opacity:.68}.routes-v84 use:nth-child(4){animation-duration:1.8s;opacity:.74}@keyframes routeFlowV84{to{stroke-dashoffset:-50}}
.truck-v84 rect{fill:#e9fbff;stroke:#5be5ff;stroke-width:1.4}.truck-v84 circle{fill:#03101e;stroke:#57dfff;stroke-width:1.3}.truck-v84 .headlight{fill:#bdf7ff;filter:url(#glowV84)}.truck-v84{filter:url(#glowV84)}.truck-two{opacity:.84}.truck-three{opacity:.74}
.map-node-v84 circle{fill:#071d36;stroke:#6de9ff;stroke-width:3;filter:url(#glowV84)}.map-node-v84 text{fill:#fff;font:900 13px/1 sans-serif;paint-order:stroke;stroke:#06172d;stroke-width:5px;stroke-linejoin:round}.hub-node-v84 path{fill:none;stroke:#c7f8ff;stroke-width:3}.hub-node-v84 text{font-size:11px;letter-spacing:.08em;fill:#76e8ff}.pulse-ring{fill:none!important;stroke:#57e3ff!important;animation:hubPulseV84 2.3s ease-out infinite;transform-box:fill-box;transform-origin:center}@keyframes hubPulseV84{to{transform:scale(2.4);opacity:0}}
.hub-info-card{position:absolute;z-index:8;left:49%;top:46%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:12px;padding:15px 18px;border-radius:18px;border:1px solid rgba(108,229,255,.45);background:rgba(3,19,38,.88);box-shadow:0 18px 45px rgba(0,0,0,.4),0 0 32px rgba(46,207,255,.14);backdrop-filter:blur(15px)}.hub-info-card b{display:block;color:#fff;font-size:12px}.hub-info-card small{display:block;color:#6ee7ff;margin-top:3px;font-size:9px;font-weight:900}.hub-led{width:12px;height:12px;border-radius:50%;background:#5de7ff;box-shadow:0 0 0 7px rgba(93,231,255,.09),0 0 22px #5de7ff;animation:livePulse 1.7s infinite}
.delivery-status{position:absolute;z-index:8;display:grid;grid-template-columns:auto 1fr;column-gap:8px;padding:10px 12px;border-radius:14px;border:1px solid rgba(103,225,255,.18);background:rgba(3,18,35,.72);backdrop-filter:blur(12px);box-shadow:0 15px 38px rgba(0,0,0,.28);font-size:9px}.delivery-status i{grid-row:1/3;width:7px;height:7px;margin-top:3px;border-radius:50%;background:#5ce6ff;box-shadow:0 0 12px #5ce6ff}.delivery-status span{color:#fff;font-weight:850}.delivery-status b{color:rgba(255,255,255,.44);font-size:8px;text-transform:uppercase;letter-spacing:.08em}.status-a{right:5%;top:18%}.status-b{left:5%;bottom:12%}.status-c{right:9%;bottom:10%}
.logistics-command-v84 .route-legend{margin-top:20px}
@media(max-width:1100px){.network-metrics{grid-template-columns:1fr}.network-metrics>div{display:flex;align-items:center;gap:10px;padding:10px 12px}.network-metrics strong{font-size:20px}.network-metrics span{margin:0}.logistics-command-v84 .logistics-copy{padding:44px 34px}}
@media(max-width:900px){.logistics-command-v84{grid-template-columns:1fr}.logistics-command-v84 .logistics-copy{border-right:0;border-bottom:1px solid rgba(103,221,255,.13)}.network-metrics{grid-template-columns:repeat(3,1fr)}.network-metrics>div{display:block}.logistics-visual-v84{min-height:560px}}
@media(max-width:600px){.logistics-command-v84{border-radius:28px}.logistics-command-v84 .logistics-copy{padding:34px 24px}.network-metrics{grid-template-columns:1fr 1fr 1fr;gap:7px}.network-metrics>div{padding:10px 8px;border-radius:14px}.network-metrics strong{font-size:18px}.network-metrics span{font-size:7px}.logistics-visual-v84{min-height:430px}.command-panel-v84{inset:12px}.map-topbar{left:8px;right:8px;top:8px;padding:8px;font-size:8px}.map-topbar small{display:none}.uae-live-map{inset:38px -8% 0;width:116%;height:91%}.hub-info-card{padding:9px 11px;left:50%;top:48%}.hub-info-card b{font-size:9px}.hub-info-card small{font-size:7px}.delivery-status{display:none}.map-node-v84 text{font-size:10px}.hub-node-v84 text{font-size:8px}}


/* V85 clean premium distribution redesign */
.logistics-command.logistics-clean{display:grid;grid-template-columns:minmax(310px,.72fr) minmax(0,1.65fr);min-height:620px;border:1px solid rgba(103,223,255,.22);border-radius:34px;overflow:hidden;background:#061a30;box-shadow:0 45px 120px rgba(0,0,0,.36)}
.logistics-clean .clean-copy{padding:58px 48px;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(150deg,#092f52 0%,#061b33 75%);border-inline-end:1px solid rgba(103,223,255,.12)}
.logistics-clean .clean-copy h3{font-size:clamp(38px,4.1vw,66px);line-height:.97;letter-spacing:-.045em;margin:22px 0 20px;max-width:560px}
.logistics-clean .clean-copy>p{max-width:430px;color:rgba(232,244,255,.72);font-size:16px;line-height:1.8;margin:0 0 28px}
.clean-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 0 25px}.clean-metrics>div{padding:16px 13px;border-radius:16px;border:1px solid rgba(111,225,255,.17);background:rgba(255,255,255,.035)}.clean-metrics strong{display:block;color:#fff;font-size:25px;line-height:1}.clean-metrics span{display:block;margin-top:7px;color:rgba(224,243,255,.52);font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}
.clean-legend{margin:0 0 26px!important}.clean-network-visual{position:relative;min-height:620px;overflow:hidden;background:radial-gradient(circle at 68% 30%,rgba(43,207,255,.12),transparent 35%),linear-gradient(145deg,#082a49,#041426)}
.clean-network-visual:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(101,212,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(101,212,255,.045) 1px,transparent 1px);background-size:52px 52px;mask-image:linear-gradient(to bottom,black,transparent 92%)}
.network-topline{position:absolute;z-index:3;left:28px;right:28px;top:22px;display:flex;justify-content:space-between;align-items:center;padding-bottom:15px;border-bottom:1px solid rgba(106,224,255,.13);font-size:10px;font-weight:900;letter-spacing:.11em;color:#83eaff}.network-topline span{display:flex;align-items:center;gap:8px}.network-topline i{width:7px;height:7px;border-radius:50%;background:#68e8ff;box-shadow:0 0 16px #68e8ff}.network-topline small{color:rgba(224,243,255,.38);font-size:9px}
.clean-uae-map{position:absolute;z-index:2;inset:68px 18px 78px;width:calc(100% - 36px);height:calc(100% - 146px);overflow:visible}.clean-map-shadow{fill:#020b15;opacity:.65;transform:translate(0,18px)}.clean-map-land{fill:url(#cleanLand);stroke:#47cfff;stroke-width:3;filter:drop-shadow(0 18px 28px rgba(0,0,0,.42))}.clean-route-glow use{fill:none;stroke:#30d8ff;stroke-width:18;stroke-linecap:round;opacity:.08}.clean-routes use{fill:none;stroke:#67e8ff;stroke-width:4;stroke-linecap:round;stroke-dasharray:11 14;animation:cleanRoute 1.2s linear infinite;filter:url(#cleanGlow)}.clean-routes use:nth-child(2){opacity:.72;animation-duration:1.55s}.clean-routes use:nth-child(3){opacity:.58;animation-duration:1.8s}@keyframes cleanRoute{to{stroke-dashoffset:-50}}
.route-pulse{fill:#fff;filter:drop-shadow(0 0 8px #5ee8ff) drop-shadow(0 0 18px #2ccfff)}.route-pulse-b{opacity:.84}.route-pulse-c{opacity:.7}.clean-hub .hub-ring{fill:none;stroke:#5ce8ff;stroke-width:2;opacity:.3;animation:hubCleanPulse 2.2s infinite}.clean-hub .hub-core{fill:#071d34;stroke:#69ebff;stroke-width:3}.clean-hub path{fill:none;stroke:#fff;stroke-width:2}.clean-hub text{fill:#7cecff;font-size:12px;font-weight:900;letter-spacing:.12em;text-anchor:middle}@keyframes hubCleanPulse{0%,100%{transform:scale(.82);opacity:.2}50%{transform:scale(1.16);opacity:.55}}
.clean-city circle{fill:#071c31;stroke:#64e7ff;stroke-width:3}.clean-city text{fill:#fff;font-size:14px;font-weight:850;paint-order:stroke;stroke:#041426;stroke-width:5px}.clean-status-row{position:absolute;z-index:4;left:28px;right:28px;bottom:20px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.clean-status-row>div{display:grid;grid-template-columns:auto 1fr;column-gap:9px;padding:11px 13px;border-radius:14px;border:1px solid rgba(103,225,255,.14);background:rgba(2,16,31,.72);backdrop-filter:blur(12px)}.clean-status-row i{grid-row:1/3;width:7px;height:7px;margin-top:4px;border-radius:50%;background:#62e7ff;box-shadow:0 0 12px #62e7ff}.clean-status-row span{color:#fff;font-size:10px;font-weight:850}.clean-status-row b{color:rgba(226,242,255,.44);font-size:8px;text-transform:uppercase;letter-spacing:.08em}
@media(max-width:980px){.logistics-command.logistics-clean{grid-template-columns:1fr}.logistics-clean .clean-copy{border-inline-end:0;border-bottom:1px solid rgba(103,223,255,.12);padding:42px 34px}.logistics-clean .clean-copy h3{font-size:46px}.clean-network-visual{min-height:560px}}
@media(max-width:600px){.logistics-command.logistics-clean{border-radius:26px}.logistics-clean .clean-copy{padding:31px 22px}.logistics-clean .clean-copy h3{font-size:38px}.logistics-clean .clean-copy>p{font-size:14px}.clean-metrics{gap:7px}.clean-metrics>div{padding:13px 8px}.clean-metrics strong{font-size:20px}.clean-metrics span{font-size:7px}.clean-network-visual{min-height:410px}.network-topline{left:14px;right:14px;top:13px}.network-topline small{display:none}.clean-uae-map{inset:47px -5px 60px;width:calc(100% + 10px);height:calc(100% - 107px)}.clean-city text{font-size:11px}.clean-status-row{left:12px;right:12px;bottom:11px;gap:6px}.clean-status-row>div{padding:8px}.clean-status-row span{font-size:8px}.clean-status-row b{font-size:6px}}

/* v86 premium logistics redesign */
.logistics-premium-v86{display:grid;grid-template-columns:minmax(300px,.78fr) minmax(0,1.7fr);min-height:680px;border:1px solid rgba(99,211,255,.22);border-radius:36px;overflow:hidden;background:linear-gradient(135deg,#082541 0%,#05192d 46%,#03111f 100%);box-shadow:0 30px 80px rgba(0,20,42,.35),inset 0 1px 0 rgba(255,255,255,.04)}
.premium-copy-v86{padding:54px 44px 48px;display:flex;flex-direction:column;justify-content:center;border-inline-end:1px solid rgba(99,211,255,.16);position:relative;z-index:2;background:linear-gradient(180deg,rgba(4,31,55,.96),rgba(3,23,43,.94))}
.premium-copy-v86 h3{font-size:clamp(2.55rem,4.2vw,4.8rem);line-height:.98;letter-spacing:-.045em;margin:24px 0 22px;max-width:8.5ch;color:#fff}
.premium-copy-v86>p{color:#b8c7d9;line-height:1.9;max-width:34ch;font-size:1rem}
.premium-metrics-v86{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:30px 0 24px}
.premium-metrics-v86>div{padding:18px 12px;border:1px solid rgba(99,211,255,.18);border-radius:18px;background:linear-gradient(180deg,rgba(15,57,92,.62),rgba(4,30,52,.72));box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.premium-metrics-v86 strong{display:block;font-size:1.9rem;color:#fff;line-height:1}
.premium-metrics-v86 span{display:block;margin-top:8px;color:#90a6bc;font-size:.66rem;text-transform:uppercase;letter-spacing:.08em}
.premium-points-v86{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:12px}
.premium-points-v86 li{position:relative;padding-inline-start:22px;color:#eaf7ff;font-weight:700;font-size:.9rem}
.premium-points-v86 li:before{content:"";position:absolute;inset-inline-start:0;top:.44em;width:9px;height:9px;border-radius:50%;background:#47ddff;box-shadow:0 0 15px #47ddff}
.premium-cta-v86{align-self:flex-start;min-width:235px;justify-content:center}
.premium-map-v86{position:relative;min-height:680px;overflow:hidden;background:#03111f}
.premium-map-v86>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(1.06) contrast(1.04)}
.premium-map-overlay-v86{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,17,31,.2),transparent 18%,transparent 82%,rgba(3,17,31,.14)),linear-gradient(180deg,rgba(2,13,25,.12),transparent 30%,rgba(2,13,25,.25));pointer-events:none}
.premium-status-v86{position:absolute;top:22px;left:50%;transform:translateX(-50%);width:min(86%,760px);display:grid;grid-template-columns:repeat(3,1fr);gap:1px;border:1px solid rgba(123,214,255,.22);border-radius:16px;overflow:hidden;background:rgba(3,21,39,.76);backdrop-filter:blur(14px);box-shadow:0 12px 30px rgba(0,15,31,.28)}
.premium-status-v86 span{padding:15px 18px;color:#dff7ff;font-size:.76rem;font-weight:700;display:flex;align-items:center;gap:9px;white-space:nowrap;border-inline-end:1px solid rgba(123,214,255,.12)}
.premium-status-v86 span:last-child{border-inline-end:0}.premium-status-v86 i{width:8px;height:8px;border-radius:50%;background:#58f18c;box-shadow:0 0 12px #58f18c}
.premium-route-card-v86{position:absolute;right:24px;bottom:24px;width:260px;padding:18px;border:1px solid rgba(123,214,255,.22);border-radius:18px;background:rgba(3,20,37,.8);backdrop-filter:blur(14px);box-shadow:0 18px 42px rgba(0,10,25,.35);color:#fff}
.premium-route-card-v86>strong{display:block;font-size:.72rem;letter-spacing:.1em;color:#9fc4dd;margin-bottom:12px}.premium-route-card-v86 span{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:10px 0;border-top:1px solid rgba(255,255,255,.08);font-size:.78rem}.premium-route-card-v86 small{color:#8ca4b8}.premium-route-card-v86 b{width:8px;height:8px;border-radius:50%;display:block}.blue-dot{background:#2bc7ff;box-shadow:0 0 10px #2bc7ff}.green-dot{background:#55ef80;box-shadow:0 0 10px #55ef80}.gold-dot{background:#ffd45c;box-shadow:0 0 10px #ffd45c}
.moving-light-v86{position:absolute;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 0 6px #fff,0 0 20px #23cfff,0 0 36px #23cfff;z-index:3;pointer-events:none}.light-one{offset-path:path('M 22 520 C 180 470 310 390 480 335 S 690 240 865 175');animation:routeMoveV86 8s linear infinite}.light-two{offset-path:path('M 510 355 C 500 470 450 550 370 650');animation:routeMoveV86 10s linear -3s infinite}.light-three{offset-path:path('M 520 345 C 670 390 790 470 890 580');animation:routeMoveV86 9s linear -5s infinite}.moving-light-v86:after{content:"";position:absolute;left:-20px;top:4px;width:28px;height:3px;border-radius:99px;background:linear-gradient(90deg,transparent,#4fdcff)}
@keyframes routeMoveV86{to{offset-distance:100%}}
@media (max-width:1000px){.logistics-premium-v86{grid-template-columns:1fr}.premium-copy-v86{border-inline-end:0;border-bottom:1px solid rgba(99,211,255,.16);padding:40px 30px}.premium-copy-v86 h3{max-width:11ch}.premium-map-v86{min-height:560px}}
@media (max-width:640px){.logistics-premium-v86{border-radius:24px;min-height:auto}.premium-copy-v86{padding:30px 22px}.premium-copy-v86 h3{font-size:2.35rem}.premium-metrics-v86{gap:8px}.premium-metrics-v86>div{padding:14px 8px}.premium-metrics-v86 strong{font-size:1.45rem}.premium-map-v86{min-height:440px}.premium-map-v86>img{object-position:58% center}.premium-status-v86{top:12px;width:calc(100% - 24px);grid-template-columns:1fr}.premium-status-v86 span{padding:9px 12px;font-size:.62rem;border-inline-end:0;border-bottom:1px solid rgba(123,214,255,.1)}.premium-status-v86 span:last-child{border-bottom:0}.premium-route-card-v86{right:12px;bottom:12px;width:210px;padding:13px}.premium-route-card-v86 span{font-size:.67rem}.moving-light-v86{display:none}}

/* v87 accurate UAE map and central-hub routes */
.uae-network-v87{position:relative;min-height:760px;background:linear-gradient(180deg,#061a2e,#03101d);overflow:hidden;padding:18px 18px 8px}
.network-toolbar-v87{position:relative;z-index:5;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;border:1px solid rgba(91,220,255,.18);border-radius:16px;overflow:hidden;background:rgba(4,27,48,.86);backdrop-filter:blur(14px)}
.network-toolbar-v87 span{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;align-items:center;padding:14px 16px;border-inline-end:1px solid rgba(91,220,255,.1)}.network-toolbar-v87 span:last-child{border-inline-end:0}.network-toolbar-v87 i{grid-row:1/3;width:8px;height:8px;border-radius:50%;background:#50ef8a;box-shadow:0 0 13px #50ef8a}.network-toolbar-v87 b{font-size:.72rem;color:#eaffff}.network-toolbar-v87 small{font-size:.6rem;color:#6be8ff;text-transform:uppercase;letter-spacing:.08em}
.accurate-map-stage-v87{position:relative;min-height:680px;margin-top:14px;border:1px solid rgba(80,211,255,.16);border-radius:22px;overflow:hidden;background:#061629}
.accurate-map-base-v87{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:grayscale(.35) brightness(.36) contrast(1.45) sepia(.18) hue-rotate(155deg) saturate(2.3);transform:scale(1.03)}
.map-tint-v87{position:absolute;inset:0;background:radial-gradient(circle at 53% 48%,rgba(22,161,222,.14),transparent 31%),linear-gradient(180deg,rgba(3,17,31,.08),rgba(2,14,27,.3));pointer-events:none}
.route-layer-v87{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.route-glow-v87 path{fill:none;stroke:#18c9ff;stroke-width:22;opacity:.12;stroke-linecap:round}.routes-v87 path{fill:none;stroke:#74ebff;stroke-width:5;stroke-linecap:round;stroke-dasharray:14 12;animation:dash87 1.15s linear infinite;filter:drop-shadow(0 0 8px #14cfff)}@keyframes dash87{to{stroke-dashoffset:-52}}
.truck-fleet-v87 use{filter:drop-shadow(0 0 8px rgba(79,221,255,.9))}.hub-v87 circle:first-child{fill:none;stroke:#1ed7ff;stroke-width:3;opacity:.32;animation:hubpulse87 2.2s ease-in-out infinite}.hub-v87 circle:nth-child(2){fill:#052641;stroke:#73edff;stroke-width:3}.hub-v87 path{fill:none;stroke:white;stroke-width:4;stroke-linejoin:round}.hub-v87 text{fill:#9cf3ff;font-size:18px;font-weight:900;letter-spacing:.08em;text-anchor:middle;paint-order:stroke;stroke:#03111f;stroke-width:6px}@keyframes hubpulse87{50%{r:72;opacity:.08}}
.city-v87 circle{fill:#06233c;stroke:#71eaff;stroke-width:4;filter:drop-shadow(0 0 9px #25d4ff)}.city-v87 text{fill:#fff;font-size:17px;font-weight:850;paint-order:stroke;stroke:#03111f;stroke-width:7px;stroke-linejoin:round}
.route-activity-v87{position:absolute;right:20px;bottom:20px;width:250px;padding:16px;border:1px solid rgba(86,217,255,.2);border-radius:16px;background:rgba(3,19,35,.82);backdrop-filter:blur(14px);color:white}.route-activity-v87>strong{display:block;font-size:.68rem;letter-spacing:.09em;color:#9bdfff;margin-bottom:8px}.route-activity-v87 span{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;padding:8px 0;border-top:1px solid rgba(255,255,255,.07);font-size:.72rem}.route-activity-v87 i{width:7px;height:7px;border-radius:50%;background:#3bdaff;box-shadow:0 0 9px #3bdaff}.route-activity-v87 small{color:#63e69b}.map-credit-v87{margin:5px 4px 0;color:rgba(210,234,248,.42);font-size:9px;text-align:right}
.logistics-premium-v86{grid-template-columns:minmax(330px,.75fr) minmax(760px,1.85fr);max-width:1480px;margin-inline:auto}.premium-copy-v86{padding:58px 46px}.premium-copy-v86 h3{font-size:clamp(2.8rem,3.6vw,4.7rem)}
@media(max-width:1180px){.logistics-premium-v86{grid-template-columns:1fr}.uae-network-v87{min-height:auto}.accurate-map-stage-v87{min-height:600px}.network-toolbar-v87{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:700px){.uae-network-v87{padding:10px}.network-toolbar-v87{grid-template-columns:1fr}.network-toolbar-v87 span{padding:9px 12px;border-inline-end:0;border-bottom:1px solid rgba(91,220,255,.1)}.accurate-map-stage-v87{min-height:470px}.route-layer-v87{transform:scale(1.03)}.route-activity-v87{display:none}.city-v87 text{font-size:14px}.hub-v87 text{font-size:15px}.truck-fleet-v87 use:nth-child(n+4){display:none}.map-credit-v87{text-align:center}}


/* v89 — vector-first UAE distribution network */
.uae-network-v89{position:relative;min-width:0;padding:14px;border:1px solid rgba(103,224,255,.22);border-radius:28px;background:linear-gradient(145deg,rgba(5,24,40,.96),rgba(5,17,31,.98));box-shadow:0 32px 80px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.04);overflow:hidden}
.uae-map-v89{display:block;width:100%;height:auto;aspect-ratio:1000/650;border-radius:22px;overflow:visible}
.uae-outline-v89{fill:url(#land89);stroke:#74e7ff;stroke-width:2.2;stroke-opacity:.72;filter:drop-shadow(0 12px 22px rgba(0,0,0,.42))}
.coastline-v89{fill:none;stroke:#a6f3ff;stroke-width:2;stroke-opacity:.48}
.route-glow-v89 use{fill:none;stroke:#17cfff;stroke-width:13;stroke-linecap:round;opacity:.3}
.routes-v89 use{fill:none;stroke:#75eaff;stroke-width:3.3;stroke-linecap:round;stroke-dasharray:9 8;animation:routeDash89 1.15s linear infinite}
@keyframes routeDash89{to{stroke-dashoffset:-34}}
.hub-v89 circle:first-child{fill:url(#hub89);stroke:#8bf4ff;stroke-width:2}.hub-v89 circle:nth-child(2){fill:#06172b;stroke:#79edff;stroke-width:1.5}.hub-v89 path{fill:none;stroke:#fff;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.city-v89{cursor:pointer}.city-v89 circle{fill:#071b2c;stroke:#7aedff;stroke-width:4;filter:url(#glow89);transition:.25s}.city-v89 text{fill:#f5fbff;font-size:18px;font-weight:800;paint-order:stroke;stroke:#061525;stroke-width:5px;stroke-linejoin:round}.city-v89:hover circle{r:15;fill:#0e82ff}.city-v89:hover text{fill:#79edff}
.palm-v89{fill:none;stroke:#d9b36a;stroke-width:2;opacity:.75}.palm-v89 text{fill:#d9c18f;stroke:none;font-size:13px;font-weight:700;text-anchor:middle}
.network-caption-v89{display:flex;gap:10px;position:absolute;left:28px;right:28px;bottom:27px;justify-content:center;pointer-events:none}.network-caption-v89 span{display:flex;align-items:center;gap:7px;padding:8px 13px;border:1px solid rgba(112,226,255,.2);border-radius:999px;background:rgba(3,18,31,.76);backdrop-filter:blur(12px);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#dff9ff}.network-caption-v89 i{width:7px;height:7px;border-radius:50%;background:#58f5a5;box-shadow:0 0 12px #58f5a5}
.logistics-command.logistics-premium-v86{grid-template-columns:minmax(270px,.72fr) minmax(0,1.78fr);max-width:1500px;margin-inline:auto;align-items:stretch}.logistics-copy.premium-copy-v86{padding:42px 38px}.home-distribution .container{max-width:1600px}
@media(max-width:980px){.logistics-command.logistics-premium-v86{grid-template-columns:1fr}.uae-network-v89{padding:8px;border-radius:22px}.network-caption-v89{position:static;margin-top:10px;flex-wrap:wrap}.uae-map-v89{min-height:430px}.logistics-copy.premium-copy-v86{padding:30px 24px}}
@media(max-width:640px){.uae-map-v89{width:145%;max-width:none;transform:translateX(-15%);min-height:390px}.uae-network-v89{overflow:hidden}.city-v89 text{font-size:15px}.network-caption-v89 span{font-size:9px;padding:7px 9px}.premium-metrics-v86{grid-template-columns:repeat(3,1fr)}html[dir="rtl"] .uae-map-v89{transform:translateX(15%)}}
@media(prefers-reduced-motion:reduce){.routes-v89 use{animation:none}.fleet-v89{display:none}}


/* v90 — accurate geographic UAE distribution map */
.logistics-command.logistics-premium-v86{grid-template-columns:minmax(290px,34%) minmax(0,66%);align-items:stretch;overflow:hidden}
.uae-network-real{position:relative;min-width:0;padding:14px 14px 10px;border:1px solid rgba(106,226,255,.24);border-radius:28px;background:linear-gradient(145deg,rgba(4,23,39,.98),rgba(3,15,28,.99));box-shadow:0 30px 80px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.045);overflow:hidden}
.uae-map-real{display:block;width:100%;height:auto;aspect-ratio:1000/650;border-radius:22px;overflow:visible}
.uae-land-shadow{fill:#010b13;opacity:.66}.uae-land{fill:url(#mapLand);stroke:#62dbff;stroke-width:2.1;stroke-linejoin:round;filter:drop-shadow(0 16px 18px rgba(0,0,0,.5))}
.route-glows use{fill:none;stroke:#28d9ff;stroke-width:12;stroke-linecap:round;opacity:.20}.route-lines use{fill:none;stroke:#8bedff;stroke-width:2.8;stroke-linecap:round;opacity:.88}.route-flow use{fill:none;stroke:#ecfeff;stroke-width:2.1;stroke-linecap:round;stroke-dasharray:10 14;animation:realRouteFlow 1.2s linear infinite}
@keyframes realRouteFlow{to{stroke-dashoffset:-48}}
.route-truck{filter:drop-shadow(0 0 8px rgba(66,224,255,.9))}.truck-body rect{fill:#edfaff;stroke:#3edcff;stroke-width:1.3}.truck-body path{fill:#49c9ec;stroke:#a7f4ff;stroke-width:1}.truck-body circle{fill:#04131e;stroke:#a7f4ff;stroke-width:1.2}
.hub-ring{fill:#071e32;stroke:#66e9ff;stroke-width:2.5}.hub-ring-outer{fill:none;stroke:#1b9dff;stroke-width:3;stroke-dasharray:5 7;animation:hubSpin 12s linear infinite}.hub-core{fill:url(#hubFill);stroke:#d7fbff;stroke-width:2}.hub-node path{fill:none;stroke:#fff;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
@keyframes hubSpin{to{transform:rotate(360deg)}}
.hub-caption rect,.city-label rect{fill:rgba(2,19,33,.92);stroke:rgba(105,229,255,.38);stroke-width:1.2}.hub-caption text,.city-label text{fill:#f8fdff;font-size:16px;font-weight:850;dominant-baseline:middle}.city-leader{stroke:#65dcff;stroke-width:1.2;stroke-dasharray:4 5;opacity:.6}.city-pulse{fill:none;stroke:#59e7ff;stroke-width:2;opacity:.32;animation:cityPulse 2.4s ease-out infinite}.city-dot{fill:#061b2d;stroke:#b7f8ff;stroke-width:3;filter:url(#routeGlow)}
@keyframes cityPulse{0%{r:8;opacity:.65}100%{r:20;opacity:0}}
.city-node:hover .city-label rect{fill:rgba(9,66,92,.95);stroke:#baf7ff}.city-node:hover .city-dot{fill:#1694ff}
.map-attribution{padding:8px 8px 2px;color:#7894a7;font-size:10px;text-align:right;letter-spacing:.02em}
@media(max-width:1100px){.logistics-command.logistics-premium-v86{grid-template-columns:1fr}.uae-network-real{padding:10px}.uae-map-real{min-height:520px}.logistics-copy.premium-copy-v86{padding:32px 26px}}
@media(max-width:700px){.uae-network-real{border-radius:21px;padding:6px;overflow:auto;-webkit-overflow-scrolling:touch}.uae-map-real{width:150%;max-width:none;min-height:420px;transform:translateX(-15%)}html[dir="rtl"] .uae-map-real{transform:translateX(15%)}.city-label text,.hub-caption text{font-size:14px}.map-attribution{font-size:8px;padding-inline:8px}}
@media(prefers-reduced-motion:reduce){.route-flow use,.hub-ring-outer,.city-pulse{animation:none}.route-truck{display:none}}

/* v91 — map-free premium live distribution control center */
.control-center-v91{display:grid;grid-template-columns:minmax(270px,34%) minmax(0,66%);min-height:720px;border:1px solid rgba(88,211,255,.24);border-radius:34px;overflow:hidden;background:linear-gradient(145deg,#061b2d,#041322);box-shadow:0 32px 90px rgba(0,0,0,.34)}
.cc-copy{padding:58px 46px;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(180deg,rgba(9,46,76,.96),rgba(4,23,39,.98));border-right:1px solid rgba(97,216,255,.18)}
.cc-copy h3{font-size:clamp(2.8rem,4vw,5.4rem);line-height:.93;letter-spacing:-.055em;margin:28px 0 22px;color:#fff;max-width:8ch}.cc-copy p{color:#b9cadb;line-height:1.9;max-width:34ch}.cc-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:28px 0}.cc-metrics>div{padding:20px 12px;border:1px solid rgba(86,210,255,.2);border-radius:18px;background:rgba(10,42,68,.7)}.cc-metrics strong{display:block;font-size:2rem;color:#fff}.cc-metrics span{display:block;font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;color:#8ea8bd}.cc-points{list-style:none;padding:0;margin:0 0 24px}.cc-points li{margin:10px 0;color:#e9f6ff;font-weight:700}.cc-points li:before{content:'•';color:#53e8ff;margin-right:10px;text-shadow:0 0 12px #53e8ff}.cc-cta{align-self:flex-start}
.cc-stage{position:relative;min-height:720px;overflow:hidden;background:radial-gradient(circle at 50% 45%,rgba(0,155,255,.19),transparent 25%),linear-gradient(145deg,#061b2d,#020d18)}.cc-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(78,207,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(78,207,255,.05) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,#000,transparent 95%)}.cc-glow{position:absolute;width:440px;height:440px;border-radius:50%;left:50%;top:48%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(36,193,255,.2),transparent 68%);filter:blur(8px)}.cc-routes{position:absolute;inset:0;width:100%;height:100%}.cc-route-base path{fill:none;stroke:#28c7ff;stroke-width:2.4;opacity:.78}.cc-route-flow use{fill:none;stroke:#d8fbff;stroke-width:3;stroke-dasharray:4 16;animation:ccDash 1.2s linear infinite}.cc-moving-dots circle{fill:#fff;stroke:#29d9ff;stroke-width:4;filter:drop-shadow(0 0 10px #3ae6ff)}@keyframes ccDash{to{stroke-dashoffset:-40}}
.cc-hub{position:absolute;left:50%;top:53%;transform:translate(-50%,-50%);z-index:5;width:190px;height:190px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;background:radial-gradient(circle at 45% 38%,#1d8ce0,#06375e 55%,#031827 72%);border:2px solid #6deaff;box-shadow:0 0 0 14px rgba(43,197,255,.08),0 0 0 28px rgba(43,197,255,.035),0 0 48px #119fe8}.cc-hub-ring{position:absolute;inset:-18px;border:1px dashed rgba(116,232,255,.55);border-radius:50%;animation:ccSpin 12s linear infinite}.cc-hub-icon{font-size:3.3rem;line-height:1;margin-bottom:7px}.cc-hub strong{font-size:1rem;letter-spacing:.12em}.cc-hub span{font-size:.68rem;color:#aad9ed;margin-top:5px}@keyframes ccSpin{to{transform:rotate(360deg)}}
.cc-city{position:absolute;z-index:4;min-width:140px;padding:14px 16px;border:1px solid rgba(89,220,255,.32);border-radius:15px;background:linear-gradient(145deg,rgba(7,36,58,.96),rgba(3,17,29,.92));box-shadow:0 12px 28px rgba(0,0,0,.3);transition:.3s}.cc-city:hover{transform:translateY(-5px);border-color:#62e5ff;box-shadow:0 15px 38px rgba(22,178,235,.23)}.cc-city b{display:block;color:#fff;font-size:.9rem}.cc-city span{font-size:.68rem;color:#86a9be}.c1{left:5%;top:14%}.c2{left:25%;top:7%}.c3{left:43%;top:4%}.c4{right:22%;top:7%}.c5{right:4%;top:14%}.c6{right:2%;top:61%}.c7{left:13%;bottom:15%}
.cc-workflow{position:absolute;left:4%;right:4%;bottom:3%;z-index:6;display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.cc-workflow>div{padding:13px 10px;border:1px solid rgba(102,213,255,.18);border-radius:14px;background:rgba(3,23,39,.88);backdrop-filter:blur(9px);min-width:0}.cc-workflow i{font-style:normal;color:#51e7ff;font-size:.68rem}.cc-workflow b{display:block;color:#fff;font-size:.72rem;margin:3px 0}.cc-workflow span{display:block;color:#7897aa;font-size:.58rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[dir="rtl"] .cc-copy{border-right:0;border-left:1px solid rgba(97,216,255,.18)}html[dir="rtl"] .cc-points li:before{margin-right:0;margin-left:10px}
@media(max-width:980px){.control-center-v91{grid-template-columns:1fr}.cc-copy{padding:38px 26px;border-right:0;border-bottom:1px solid rgba(97,216,255,.18)}.cc-copy h3{max-width:none;font-size:clamp(2.3rem,8vw,4rem)}.cc-stage{min-height:690px}.cc-workflow{grid-template-columns:repeat(3,1fr)}.cc-hub{width:150px;height:150px}.cc-city{min-width:112px;padding:10px 12px}.c1{left:2%;top:15%}.c2{left:30%;top:6%}.c3{left:56%;top:4%}.c4{right:3%;top:12%}.c5{right:1%;top:39%}.c6{right:2%;top:62%}.c7{left:2%;bottom:24%}}
@media(max-width:560px){.cc-copy{padding:30px 20px}.cc-metrics{gap:6px}.cc-metrics>div{padding:14px 7px}.cc-metrics strong{font-size:1.45rem}.cc-stage{min-height:650px}.cc-city{min-width:92px;padding:8px 9px}.cc-city b{font-size:.72rem}.cc-city span{display:none}.cc-hub{width:126px;height:126px}.cc-hub-icon{font-size:2.5rem}.cc-workflow{grid-template-columns:repeat(2,1fr);bottom:2%}.cc-routes{top:0;height:82%}.c1{left:1%;top:14%}.c2{left:35%;top:5%}.c3{right:2%;top:7%}.c4{right:1%;top:28%}.c5{right:1%;top:49%}.c6{right:2%;top:64%}.c7{left:1%;bottom:29%}}

/* ===== Distribution Control Center v92 ===== */
.control-center-v92{display:grid;grid-template-columns:minmax(300px,27%) minmax(0,73%);min-height:940px;border:1px solid rgba(80,205,255,.25);border-radius:32px;overflow:hidden;background:linear-gradient(145deg,#031523,#020b13);box-shadow:0 30px 90px rgba(0,0,0,.38)}
.dc-copy{position:relative;z-index:3;padding:44px 34px;display:flex;flex-direction:column;background:linear-gradient(180deg,rgba(5,26,43,.97),rgba(2,14,24,.98));border-right:1px solid rgba(86,215,255,.18)}
.dc-copy h3{margin:32px 0 22px;max-width:380px;font-size:clamp(3.2rem,4.3vw,5.9rem);line-height:.92;letter-spacing:-.055em;color:#fff}.dc-copy h3 em{font-style:normal;background:linear-gradient(90deg,#0bb9ff,#196cff);-webkit-background-clip:text;background-clip:text;color:transparent}.dc-copy p{max-width:340px;color:#aac0cf;line-height:1.9}.dc-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:32px 0}.dc-metrics>div{padding:19px 10px;border:1px solid rgba(72,204,255,.22);border-radius:17px;background:rgba(9,39,61,.55);text-align:center}.dc-metrics strong{display:block;color:#fff;font-size:2rem;line-height:1}.dc-metrics span{display:block;margin-top:9px;color:#82a4b8;font-size:.68rem;text-transform:uppercase;letter-spacing:.05em}.dc-points{list-style:none;padding:0;margin:0 0 28px;display:grid;gap:12px;color:#e8f6ff;font-weight:700}.dc-points li:before{content:'✓';display:inline-grid;place-items:center;width:22px;height:22px;margin-right:10px;border:1px solid #23caff;border-radius:50%;color:#40d9ff}.dc-cta{margin-top:auto;align-self:flex-start}
.dc-stage{position:relative;min-height:940px;overflow:hidden;background:radial-gradient(circle at 50% 44%,rgba(0,144,255,.16),transparent 31%),linear-gradient(145deg,#030f1b,#020812)}.dc-stage:before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(67,192,240,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(67,192,240,.035) 1px,transparent 1px);background-size:45px 45px;mask-image:linear-gradient(#000 0 78%,transparent 100%)}
.dc-orbit{position:absolute;left:50%;top:42%;border:1px solid rgba(41,199,255,.14);border-radius:50%;transform:translate(-50%,-50%)}.orbit-one{width:500px;height:500px}.orbit-two{width:650px;height:650px}.orbit-three{width:820px;height:820px;opacity:.55}.dc-routes{position:absolute;inset:0 0 160px;width:100%;height:calc(100% - 160px);z-index:1}.dc-route-lines path{fill:none;stroke:#19c7ff;stroke-width:2.5;opacity:.67}.dc-route-dashes use{fill:none;stroke:#e3fbff;stroke-width:2.4;stroke-dasharray:5 16;animation:dcDash 1.25s linear infinite}.dc-trucks use{filter:drop-shadow(0 0 7px #25d8ff)}@keyframes dcDash{to{stroke-dashoffset:-42}}
.dc-hub{position:absolute;z-index:5;left:50%;top:42%;width:260px;height:260px;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:50%;background:radial-gradient(circle,rgba(8,71,111,.97),rgba(2,18,31,.98) 69%);border:2px solid #36d9ff;box-shadow:0 0 0 13px rgba(25,174,255,.10),0 0 50px rgba(0,178,255,.45)}.dc-hub-photo{width:142px;height:96px;border-radius:16px;overflow:hidden;border:1px solid rgba(164,236,255,.45);box-shadow:0 15px 30px rgba(0,0,0,.42)}.dc-hub-photo img{width:100%;height:100%;object-fit:cover}.dc-hub strong{margin-top:14px;color:#39d9ff;font-size:1.08rem;letter-spacing:.08em}.dc-hub span{color:#a8c4d4;font-size:.72rem}
.dc-city{position:absolute;z-index:4;width:205px;border:1px solid rgba(100,218,255,.34);border-radius:18px;overflow:hidden;background:linear-gradient(145deg,rgba(7,34,55,.98),rgba(2,15,26,.96));box-shadow:0 18px 38px rgba(0,0,0,.38);transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease}.dc-city:hover{transform:translateY(-7px);border-color:#54ddff;box-shadow:0 22px 48px rgba(0,154,230,.23)}.dc-city-image{height:92px;background:linear-gradient(to top,rgba(1,12,21,.35),transparent),var(--city-img) center/cover}.dc-city>div:last-child{position:relative;padding:12px 14px 14px}.dc-city b{display:block;color:#fff;font-size:1rem}.dc-city span{display:inline-flex;flex-direction:column;color:#23bfff;font-weight:800;font-size:1.02rem;margin-top:9px}.dc-city small{color:#799aae;font-size:.58rem;font-weight:500;text-transform:uppercase}.dc-city em{position:absolute;right:14px;bottom:15px;color:#43efb2;font-size:.77rem;font-style:normal;font-weight:800}.city-abu{left:3%;top:31%}.city-dubai{left:20%;top:4%}.city-sharjah{left:42%;top:2%}.city-ajman{right:20%;top:4%}.city-uaq{right:2%;top:31%}.city-rak{left:7%;top:57%}.city-fuj{right:7%;top:57%}
.dc-benefits{position:absolute;left:3%;right:3%;bottom:92px;z-index:6;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:16px;border:1px solid rgba(84,209,255,.2);border-radius:20px;background:rgba(2,16,27,.88);backdrop-filter:blur(14px)}.dc-benefits>div{display:grid;grid-template-columns:42px 1fr;column-gap:10px;align-items:center;padding:7px 10px;border-right:1px solid rgba(89,201,240,.12)}.dc-benefits>div:last-child{border-right:0}.dc-benefits i{grid-row:1/3;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid rgba(56,211,255,.42);color:#39d7ff;font-style:normal;font-size:1.2rem}.dc-benefits b{color:#fff;font-size:.79rem}.dc-benefits span{color:#7898ab;font-size:.65rem}
.dc-workflow{position:absolute;left:3%;right:3%;bottom:18px;z-index:6;display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.dc-workflow>div{position:relative;padding:12px 8px 11px 34px;border:1px solid rgba(82,204,249,.18);border-radius:14px;background:rgba(3,21,35,.92)}.dc-workflow i{position:absolute;left:9px;top:11px;display:grid;place-items:center;width:19px;height:19px;border-radius:50%;background:#0a58db;color:#fff;font-size:.56rem;font-style:normal}.dc-workflow b{display:block;color:#fff;font-size:.7rem}.dc-workflow span{display:block;color:#7897aa;font-size:.56rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:1180px){.control-center-v92{grid-template-columns:1fr;min-height:auto}.dc-copy{border-right:0;border-bottom:1px solid rgba(86,215,255,.18)}.dc-copy h3{max-width:none}.dc-cta{margin-top:12px}.dc-stage{min-height:920px}}
@media(max-width:760px){.dc-copy{padding:30px 20px}.dc-copy h3{font-size:clamp(2.7rem,13vw,4.4rem);margin-top:25px}.dc-metrics{gap:6px}.dc-metrics>div{padding:15px 5px}.dc-metrics strong{font-size:1.45rem}.dc-stage{min-height:1080px}.dc-routes{display:none}.dc-orbit{display:none}.dc-hub{top:370px;width:180px;height:180px}.dc-hub-photo{width:100px;height:65px}.dc-city{width:44%;max-width:180px}.dc-city-image{height:72px}.city-abu{left:4%;top:34px}.city-dubai{right:4%;left:auto;top:34px}.city-sharjah{left:4%;top:205px}.city-ajman{right:4%;top:205px}.city-uaq{left:4%;right:auto;top:500px}.city-rak{right:4%;left:auto;top:500px}.city-fuj{left:28%;right:auto;top:668px}.dc-benefits{bottom:146px;grid-template-columns:repeat(2,1fr)}.dc-benefits>div{border-right:0}.dc-workflow{grid-template-columns:repeat(3,1fr);bottom:14px}.dc-city em{font-size:.66rem}.dc-city span{font-size:.86rem}}

/* v93 — rebuilt premium distribution control center */
.cc93-shell{display:grid;grid-template-columns:minmax(300px,26%) minmax(0,74%);max-width:1580px;min-height:820px;margin:0 auto;border:1px solid rgba(91,216,255,.24);border-radius:34px;overflow:hidden;background:linear-gradient(145deg,#06192b 0%,#020b13 100%);box-shadow:0 36px 100px rgba(0,0,0,.35)}
.cc93-copy{padding:52px 38px;display:flex;flex-direction:column;background:linear-gradient(160deg,#082947 0%,#041a30 65%,#031321 100%);border-inline-end:1px solid rgba(96,220,255,.14)}
.cc93-kicker{display:inline-flex;align-items:center;gap:9px;width:max-content;padding:9px 13px;border:1px solid rgba(56,211,255,.35);border-radius:999px;color:#55ddff;font-size:.68rem;letter-spacing:.1em}.cc93-kicker span{width:7px;height:7px;border-radius:50%;background:#43f1a4;box-shadow:0 0 14px #43f1a4}
.cc93-copy h3{margin:36px 0 0;font-size:clamp(3.2rem,4.5vw,5.7rem);line-height:.9;letter-spacing:-.055em;color:#fff}.cc93-copy h3 em{font-style:normal;color:#10aaf7}.cc93-copy>p{max-width:330px;margin:32px 0 0;color:#a9becd;line-height:1.75;font-size:.95rem}
.cc93-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:34px}.cc93-metrics>div{padding:17px 10px;border:1px solid rgba(85,214,255,.2);border-radius:16px;background:rgba(5,27,45,.68)}.cc93-metrics strong{display:block;color:#fff;font-size:1.9rem}.cc93-metrics span{display:block;margin-top:4px;color:#7c9aac;font-size:.59rem;text-transform:uppercase;letter-spacing:.06em}
.cc93-points{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:11px;color:#d5e4ed;font-size:.82rem}.cc93-points li:before{content:'✓';display:inline-grid;place-items:center;width:20px;height:20px;margin-inline-end:9px;border:1px solid #22c9ff;border-radius:50%;color:#22c9ff;font-size:.7rem}.cc93-cta{margin-top:auto;width:max-content}
.cc93-stage{position:relative;min-height:820px;overflow:hidden;background:radial-gradient(circle at 50% 42%,rgba(0,151,230,.16),transparent 30%),linear-gradient(145deg,#020c14,#02080e)}
.cc93-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(53,159,207,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(53,159,207,.07) 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(to bottom,#000 0%,#000 76%,transparent 97%)}
.cc93-routes{position:absolute;inset:0;width:100%;height:72%;z-index:1}.cc93-route-lines path{fill:none;stroke:#4bdcff;stroke-width:2;stroke-dasharray:7 9;marker-end:url(#cc93Arrow);opacity:.8;animation:cc93dash 1.6s linear infinite}.cc93-trucks g{fill:#eefaff;stroke:#2acfff;stroke-width:1.4;filter:url(#cc93Glow)}@keyframes cc93dash{to{stroke-dashoffset:-32}}
.cc93-hub{position:absolute;z-index:5;left:50%;top:42%;transform:translate(-50%,-50%);width:230px;height:230px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 38%,#0c6090 0%,#073451 42%,#031728 76%);border:2px solid #35d8ff;box-shadow:0 0 0 12px rgba(24,181,255,.08),0 0 55px rgba(0,174,255,.4)}
.cc93-hub-building{position:relative;width:112px;height:70px;border:1px solid rgba(180,240,255,.6);border-radius:12px;background:linear-gradient(145deg,#124b70,#062b46);box-shadow:inset 0 1px rgba(255,255,255,.18),0 12px 28px rgba(0,0,0,.35)}.cc93-hub-building:before{content:'';position:absolute;left:14px;right:14px;top:-19px;height:24px;clip-path:polygon(50% 0,100% 100%,0 100%);background:#27bff5}.cc93-hub-building span{position:absolute;bottom:0;width:22px;height:38px;background:#031a2d;border:1px solid #1d8fc3}.cc93-hub-building span:nth-child(1){left:13px}.cc93-hub-building span:nth-child(2){left:44px}.cc93-hub-building span:nth-child(3){right:13px}.cc93-hub strong{margin-top:17px;color:#44dcff;letter-spacing:.1em}.cc93-hub small{margin-top:5px;color:#a4c0d1;font-size:.67rem}
.cc93-city{position:absolute;z-index:4;width:205px;min-height:98px;display:grid;grid-template-columns:54px 1fr auto;gap:10px;align-items:center;padding:12px;border:1px solid rgba(86,211,255,.32);border-radius:17px;background:linear-gradient(145deg,rgba(9,37,59,.98),rgba(3,17,28,.98));box-shadow:0 15px 34px rgba(0,0,0,.35);transition:.25s ease}.cc93-city:hover{transform:translateY(-5px);border-color:#56deff;box-shadow:0 22px 42px rgba(0,141,211,.25)}
.cc93-city-icon{display:grid;place-items:center;width:54px;height:54px;border-radius:14px;background:linear-gradient(145deg,#0d4d72,#05243a);border:1px solid rgba(96,217,255,.32);color:#54dcff;font-size:.72rem;font-weight:900;letter-spacing:.04em}.cc93-city b{display:block;color:#fff;font-size:.95rem}.cc93-city small{display:block;margin-top:4px;color:#7898aa;font-size:.62rem}.cc93-city>span{color:#29c8ff;font-weight:900;font-size:.92rem;text-align:right}.cc93-city em{display:block;margin-top:4px;color:#48ecad;font-size:.63rem;font-style:normal;white-space:nowrap}
.cc93-abu{left:3%;top:47%}.cc93-dub{left:10%;top:7%}.cc93-shj{left:39%;top:4%}.cc93-ajm{right:12%;top:8%}.cc93-uaq{right:2%;top:42%}.cc93-rak{left:8%;top:66%}.cc93-fuj{right:7%;top:66%}
.cc93-benefits{position:absolute;z-index:6;left:3%;right:3%;bottom:92px;display:grid;grid-template-columns:repeat(4,1fr);gap:9px;padding:14px;border:1px solid rgba(82,204,249,.17);border-radius:18px;background:rgba(2,16,27,.9);backdrop-filter:blur(12px)}.cc93-benefits>div{display:flex;align-items:center;gap:10px;padding:8px}.cc93-benefits i{display:grid;place-items:center;min-width:40px;height:40px;border-radius:50%;border:1px solid rgba(58,212,255,.38);color:#3bd7ff;font-style:normal}.cc93-benefits b{display:block;color:#fff;font-size:.75rem}.cc93-benefits small{display:block;margin-top:3px;color:#7898aa;font-size:.6rem}
.cc93-workflow{position:absolute;z-index:6;left:3%;right:3%;bottom:16px;display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.cc93-workflow>div{position:relative;padding:12px 8px 10px 34px;border:1px solid rgba(82,204,249,.17);border-radius:13px;background:rgba(3,21,35,.94)}.cc93-workflow i{position:absolute;left:8px;top:10px;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#075adb;color:#fff;font-size:.54rem;font-style:normal}.cc93-workflow b{display:block;color:#fff;font-size:.67rem}.cc93-workflow small{display:block;margin-top:3px;color:#7898aa;font-size:.54rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:1180px){.cc93-shell{grid-template-columns:1fr}.cc93-copy{border-inline-end:0;border-bottom:1px solid rgba(96,220,255,.14)}.cc93-copy h3{max-width:700px}.cc93-cta{margin-top:28px}.cc93-stage{min-height:850px}}
@media(max-width:760px){.cc93-shell{border-radius:24px}.cc93-copy{padding:30px 20px}.cc93-copy h3{font-size:clamp(2.8rem,13vw,4.6rem)}.cc93-stage{min-height:1180px}.cc93-routes{display:none}.cc93-hub{top:390px;width:175px;height:175px}.cc93-hub-building{width:82px;height:52px}.cc93-city{width:44%;max-width:185px;min-height:88px;grid-template-columns:42px 1fr;padding:9px}.cc93-city-icon{width:42px;height:42px}.cc93-city>span{grid-column:2;text-align:left}.cc93-abu{left:4%;top:28px}.cc93-dub{right:4%;left:auto;top:28px}.cc93-shj{left:4%;top:170px}.cc93-ajm{right:4%;top:170px}.cc93-uaq{left:4%;right:auto;top:520px}.cc93-rak{right:4%;left:auto;top:520px}.cc93-fuj{left:28%;right:auto;top:665px}.cc93-benefits{bottom:160px;grid-template-columns:repeat(2,1fr)}.cc93-workflow{bottom:14px;grid-template-columns:repeat(3,1fr)}.cc93-metrics{gap:6px}.cc93-metrics strong{font-size:1.45rem}}

/* ===== v94 refined enterprise control center ===== */
.cc93-shell{grid-template-columns:minmax(340px,31%) minmax(0,69%);min-height:900px;max-width:1640px}
.cc93-copy{padding:50px 42px}
.cc93-copy h3{font-size:clamp(3rem,3.75vw,5.05rem);line-height:.94;max-width:430px;margin-top:32px}
.cc93-copy>p{font-size:.92rem;line-height:1.8;margin-top:28px;max-width:350px}
.cc93-metrics{margin-top:30px}.cc93-cta{margin-top:28px}
.cc93-stage{min-height:900px;background:radial-gradient(circle at 50% 40%,rgba(0,171,255,.19),transparent 24%),radial-gradient(circle at 50% 42%,rgba(7,63,101,.26),transparent 49%),linear-gradient(145deg,#020d17,#01070c)}
.cc93-stage:after{content:"";position:absolute;inset:7% 8% 25%;border-radius:50%;background:radial-gradient(ellipse,transparent 54%,rgba(41,203,255,.06) 55%,transparent 57%);pointer-events:none}
.cc93-grid{opacity:.78;background-size:48px 48px}
.cc93-routes{inset:0;width:100%;height:72%}.cc93-route-lines path{stroke-width:2.15;stroke-dasharray:8 12;opacity:.74}.cc93-trucks g{transform:scale(.86)}
.cc93-hub{top:39%;width:174px;height:174px;border-width:1.5px;box-shadow:0 0 0 9px rgba(24,181,255,.08),0 0 44px rgba(0,174,255,.38)}
.cc93-hub:before,.cc93-hub:after{content:"";position:absolute;border:1px solid rgba(60,213,255,.18);border-radius:50%;animation:cc93pulse 3.8s ease-out infinite}.cc93-hub:before{inset:-24px}.cc93-hub:after{inset:-48px;animation-delay:1.15s}@keyframes cc93pulse{0%{opacity:0;transform:scale(.83)}35%{opacity:.75}100%{opacity:0;transform:scale(1.08)}}
.cc93-hub-building{width:88px;height:56px}.cc93-hub-building span{width:18px;height:30px}.cc93-hub-building span:nth-child(2){left:35px}.cc93-hub strong{font-size:.86rem;margin-top:12px}.cc93-hub small{font-size:.58rem}
.cc93-city{width:192px;min-height:94px;grid-template-columns:48px 1fr auto;padding:11px;border-radius:16px;background:linear-gradient(145deg,rgba(8,36,58,.98),rgba(2,15,25,.98));box-shadow:0 16px 36px rgba(0,0,0,.4),inset 0 1px rgba(255,255,255,.04)}
.cc93-city:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(#40dcff,#0b79ff);box-shadow:0 0 14px #22caff}
.cc93-city-icon{width:48px;height:48px;border-radius:13px;background:radial-gradient(circle at 35% 25%,rgba(57,213,255,.24),transparent 42%),linear-gradient(145deg,#0c4b70,#05243a)}
.cc93-city b{font-size:.9rem}.cc93-city small{font-size:.59rem}.cc93-city>span{font-size:.86rem}.cc93-city em{font-size:.59rem}
.cc93-abu{left:3%;top:43%}.cc93-dub{left:10%;top:5%}.cc93-shj{left:40%;top:3%}.cc93-ajm{right:10%;top:6%}.cc93-uaq{right:2.5%;top:39%}.cc93-rak{left:7%;top:63%}.cc93-fuj{right:6%;top:63%}
.cc93-benefits{left:4%;right:4%;bottom:104px;padding:13px 14px;gap:5px;border-radius:17px}.cc93-benefits>div{padding:7px 8px}.cc93-benefits i{min-width:36px;height:36px}.cc93-benefits b{font-size:.7rem}.cc93-benefits small{font-size:.56rem}
.cc93-workflow{left:4%;right:4%;bottom:20px;gap:6px}.cc93-workflow>div{min-height:64px;padding:13px 7px 9px 34px}.cc93-workflow b{font-size:.64rem}.cc93-workflow small{font-size:.51rem}
@media(max-width:1280px){.cc93-shell{grid-template-columns:minmax(310px,34%) minmax(0,66%)}.cc93-city{width:176px}.cc93-copy{padding:42px 30px}.cc93-copy h3{font-size:clamp(2.9rem,4vw,4.5rem)}}
@media(max-width:1180px){.cc93-shell{grid-template-columns:1fr}.cc93-stage{min-height:920px}.cc93-copy h3{max-width:760px}.cc93-copy{padding:42px 34px}.cc93-cta{margin-top:24px}}
@media(max-width:760px){.cc93-stage{min-height:1160px}.cc93-hub{top:385px;width:158px;height:158px}.cc93-hub-building{width:74px;height:48px}.cc93-city{width:44%;max-width:180px;min-height:86px}.cc93-abu{left:4%;top:28px}.cc93-dub{right:4%;left:auto;top:28px}.cc93-shj{left:4%;top:165px}.cc93-ajm{right:4%;top:165px}.cc93-uaq{left:4%;right:auto;top:500px}.cc93-rak{right:4%;left:auto;top:500px}.cc93-fuj{left:28%;right:auto;top:645px}.cc93-benefits{bottom:164px}.cc93-workflow{bottom:15px}}


/* v95 — exact distribution reference implementation */
.home-distribution{
  background:#020812;
  padding:0;
  overflow:hidden;
}
.distribution-reference-container{
  width:min(100%,1536px);
  margin:0 auto;
  padding:0;
}
.distribution-reference-wrap{
  position:relative;
  width:100%;
  aspect-ratio:1536/960;
  overflow:hidden;
  background:#020812;
  border:0;
}
.distribution-reference-image{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center top;
  user-select:none;
  -webkit-user-drag:none;
}
.distribution-reference-cta{
  position:absolute;
  left:2%;
  bottom:8.3%;
  width:21.5%;
  height:5.4%;
  border-radius:12px;
  z-index:3;
}
.distribution-reference-cta:focus-visible{
  outline:3px solid #50d7ff;
  outline-offset:3px;
}
@media (max-width:900px){
  .home-distribution{padding:0;overflow-x:auto;overscroll-behavior-x:contain;background:#020812}
  .distribution-reference-container{width:1180px;max-width:none}
  .distribution-reference-wrap{aspect-ratio:1536/960}
}
@media (max-width:600px){
  .distribution-reference-container{width:980px}
  .home-distribution{scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .home-distribution::-webkit-scrollbar{display:none}
}


/* ===== v98 — high-quality distribution reference and corrected sizing ===== */
.home-distribution{
  width:100%;
  margin:0;
  padding:0;
  background:#020812 !important;
  overflow:hidden;
}
.distribution-reference-container{
  width:100%;
  max-width:1536px;
  margin-inline:auto;
  padding:0;
  background:#020812;
}
.distribution-reference-wrap{
  width:100%;
  aspect-ratio:1536 / 960;
  background:#020812;
  overflow:hidden;
}
.distribution-reference-image{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  object-position:center center;
  image-rendering:auto;
}
@media (min-width:1537px){
  .home-distribution{
    background:#020812 !important;
  }
}
@media (max-width:900px){
  .home-distribution{
    width:100%;
    overflow:hidden;
    touch-action:pan-y;
  }
  .distribution-reference-container{
    width:100%;
    max-width:none;
  }
  .distribution-reference-wrap{
    width:100%;
    aspect-ratio:1536 / 960;
  }
  .distribution-reference-image{
    width:100%;
    height:auto;
    min-width:0;
    object-fit:contain;
  }
}


/* ===== v99 — definitive distribution section sizing and quality fix ===== */
.home-distribution{
  position:relative !important;
  width:100vw !important;
  max-width:none !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  padding:0 !important;
  background:#020812 !important;
  overflow:hidden !important;
}
.distribution-reference-container{
  width:100% !important;
  max-width:1536px !important;
  margin:0 auto !important;
  padding:0 !important;
  background:#020812 !important;
}
.distribution-reference-wrap{
  position:relative !important;
  width:100% !important;
  height:auto !important;
  aspect-ratio:1536 / 960 !important;
  overflow:hidden !important;
  background:#020812 !important;
}
.distribution-reference-image{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  object-fit:contain !important;
  object-position:center center !important;
  image-rendering:auto !important;
}
.distribution-page .home-distribution{
  margin-top:112px !important;
}
.distribution-reference-cta{
  left:2% !important;
  bottom:6.2% !important;
  width:21.2% !important;
  height:5.8% !important;
}
@media (max-width:900px){
  .home-distribution{
    width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    scrollbar-width:none !important;
  }
  .home-distribution::-webkit-scrollbar{display:none !important}
  .distribution-reference-container{
    width:1000px !important;
    max-width:none !important;
  }
  .distribution-reference-wrap{
    width:1000px !important;
    aspect-ratio:1536 / 960 !important;
  }
  .distribution-page .home-distribution{
    margin-top:88px !important;
  }
}
@media (max-width:560px){
  .distribution-reference-container,
  .distribution-reference-wrap{
    width:900px !important;
  }
}


/* ===== v100 — polished distribution section ===== */
.home-distribution{
  width:100vw !important;
  max-width:none !important;
  margin-inline:calc(50% - 50vw) !important;
  padding:0 !important;
  background:#020812 !important;
  overflow:hidden !important;
}
.distribution-reference-container{
  width:100% !important;
  max-width:1536px !important;
  margin:0 auto !important;
  padding:0 !important;
  background:#020812 !important;
}
.distribution-reference-wrap{
  width:100% !important;
  aspect-ratio:1536 / 960 !important;
  height:auto !important;
  overflow:hidden !important;
  background:#020812 !important;
}
.distribution-reference-image{
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center !important;
  image-rendering:auto !important;
}
.distribution-page .home-distribution{margin-top:110px !important}
@media (max-width:900px){
  .home-distribution{
    width:100% !important;
    margin-inline:0 !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    scrollbar-width:none !important;
  }
  .home-distribution::-webkit-scrollbar{display:none !important}
  .distribution-reference-container,
  .distribution-reference-wrap{
    width:960px !important;
    max-width:none !important;
  }
  .distribution-page .home-distribution{margin-top:86px !important}
}

/* v101 restored distribution reference */
.home-distribution{
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  background:#020812 !important;
  overflow:hidden !important;
}
.distribution-reference-container{
  width:100% !important;
  max-width:1536px !important;
  margin:0 auto !important;
  padding:0 !important;
  background:#020812 !important;
}
.distribution-reference-wrap{
  width:100% !important;
  height:auto !important;
  aspect-ratio:1536/960 !important;
  overflow:hidden !important;
  background:#020812 !important;
}
.distribution-reference-image{
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center !important;
}
.distribution-page .home-distribution{margin-top:110px !important}
@media(max-width:900px){
  .distribution-reference-container{max-width:none !important;width:100% !important}
  .distribution-reference-wrap{width:100% !important;aspect-ratio:1536/960 !important}
  .distribution-reference-image{width:100% !important;height:auto !important}
  .distribution-page .home-distribution{margin-top:86px !important}
}


/* V102 editable distribution network */
.editable-distribution{padding:34px;background:#041226!important;border-block:18px solid #061b35;overflow:hidden}
.editable-distribution:before{display:none!important}
.distribution-shell{max-width:1500px;margin:auto;display:grid;grid-template-columns:340px 1fr;min-height:760px;border:1px solid rgba(74,174,255,.24);border-radius:30px;overflow:hidden;background:linear-gradient(135deg,#03101f,#061b35);box-shadow:0 35px 100px rgba(0,0,0,.35)}
.distribution-summary{padding:42px 32px;background:linear-gradient(180deg,#03101f,#061427);border-right:1px solid rgba(115,188,255,.18);color:#fff}
.distribution-live{display:inline-flex;align-items:center;gap:9px;border:1px solid rgba(0,195,255,.35);padding:9px 14px;border-radius:999px;color:#15c6ff;font-size:12px;letter-spacing:.05em}.distribution-live span{width:9px;height:9px;border-radius:50%;background:#18e0ae;box-shadow:0 0 15px #18e0ae}
.distribution-summary h2{font-size:52px;line-height:1.04;margin:28px 0 22px;letter-spacing:-.035em}.distribution-summary h2 em{font-style:normal;color:#168df0}.distribution-summary>p{color:rgba(255,255,255,.7);line-height:1.75}
.distribution-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:28px 0}.distribution-metrics>div{padding:18px 8px;text-align:center;border:1px solid rgba(108,190,255,.2);border-radius:16px;background:rgba(255,255,255,.025)}.distribution-metrics strong{display:block;font-size:27px}.distribution-metrics span{display:block;margin-top:6px;font-size:10px;text-transform:uppercase;color:rgba(255,255,255,.63)}
.distribution-summary ul{list-style:none;padding:0;margin:22px 0}.distribution-summary li{margin:14px 0;color:rgba(255,255,255,.8)}.distribution-summary li:before{content:'✓';display:inline-grid;place-items:center;width:20px;height:20px;margin-right:10px;border:1px solid #159cff;border-radius:50%;color:#159cff;font-size:12px}
.distribution-network{position:relative;min-height:760px;background:radial-gradient(circle at 50% 50%,rgba(0,143,255,.18),transparent 35%),linear-gradient(145deg,#03101e,#041528)}
.network-grid{position:absolute;inset:0;padding:28px;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:22px;z-index:3}.city-card{align-self:start;max-width:240px;border:1px solid rgba(111,185,255,.45);border-radius:18px;overflow:hidden;background:#07182c;color:#fff;box-shadow:0 16px 40px rgba(0,0,0,.25)}.city-card:nth-child(1){grid-column:1;grid-row:1}.city-card:nth-child(2){grid-column:2;grid-row:1;justify-self:center}.city-card:nth-child(3){grid-column:3;grid-row:1;justify-self:end}.city-card:nth-child(4){grid-column:1;grid-row:2;align-self:center}.city-card:nth-child(5){grid-column:3;grid-row:2;align-self:center;justify-self:end}.city-card:nth-child(6){grid-column:1;grid-row:3;align-self:end}.city-card:nth-child(7){grid-column:3;grid-row:3;align-self:end;justify-self:end}.city-card img{width:100%;height:84px;object-fit:cover;display:block}.city-card h3{font-size:16px;margin:10px 12px}.city-stats{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(255,255,255,.08)}.city-stats div{padding:9px 11px}.city-stats div+div{border-left:1px solid rgba(255,255,255,.08)}.city-stats small{display:block;font-size:9px;color:rgba(255,255,255,.55)}.city-stats b{font-size:15px;color:#13baff}.city-stats div+div b{color:#19e1ac}
.network-hub{position:absolute;left:50%;top:54%;transform:translate(-50%,-50%);width:310px;height:190px;z-index:4;display:grid;place-items:center}.hub-ring{position:absolute;inset:0;border:2px solid #13b8ff;border-radius:50%;box-shadow:0 0 26px #0c83e8, inset 0 0 40px rgba(0,157,255,.25)}.hub-building{position:relative;padding:32px 44px;background:linear-gradient(145deg,#0d4d8e,#08284d);border:1px solid #80cfff;border-radius:10px;font-weight:950;letter-spacing:.08em;text-align:center;box-shadow:0 22px 50px rgba(0,0,0,.5)}.hub-building small{display:block;margin-top:8px;font-weight:500;letter-spacing:0;color:rgba(255,255,255,.72)}
.route{position:absolute;left:50%;top:54%;width:190px;height:2px;transform-origin:left center;background:linear-gradient(90deg,#28c8ff,rgba(40,200,255,.15));z-index:2}.route:after{content:'';position:absolute;right:0;top:-4px;width:10px;height:10px;border-radius:50%;background:#8be6ff;box-shadow:0 0 14px #13b8ff}.route .truck{position:absolute;left:55%;top:-15px;width:31px;height:21px;border-radius:4px;background:#eaf8ff;color:#eaf8ff;box-shadow:0 0 14px #19bfff;transform:translateX(-50%)}.route .truck:before{content:'';position:absolute;right:-9px;bottom:0;border-left:10px solid #eaf8ff;border-top:10px solid transparent;width:0;height:0}.route .truck:after{content:'••';position:absolute;left:4px;bottom:-8px;color:#8edcff;letter-spacing:11px;font-size:13px}.route-1{transform:rotate(-158deg)}.route-2{transform:rotate(-112deg)}.route-3{transform:rotate(-65deg)}.route-4{transform:rotate(-18deg)}.route-5{transform:rotate(27deg)}.route-6{transform:rotate(67deg)}.route-7{transform:rotate(153deg)}.route .truck{transform:translateX(-50%) rotate(0deg)}
.admin-dist-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.admin-dist-grid label,.admin-city-card label{display:grid;gap:6px;font-weight:700}.admin-dist-grid input,.admin-dist-grid textarea,.admin-city-card input{width:100%;padding:11px;border:1px solid #d7e0ea;border-radius:10px}.admin-city-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:20px}.admin-city-card{padding:16px;border:1px solid #dce5ef;border-radius:16px;background:#f8fbff;display:grid;gap:10px}
@media(max-width:1050px){.distribution-shell{grid-template-columns:1fr}.distribution-summary{border-right:0;border-bottom:1px solid rgba(115,188,255,.18)}.distribution-network{min-height:820px}.editable-distribution{padding:18px}}
@media(max-width:720px){.editable-distribution{padding:10px;border-block-width:10px}.distribution-summary{padding:28px 20px}.distribution-summary h2{font-size:40px}.distribution-metrics{grid-template-columns:1fr 1fr 1fr}.distribution-network{min-height:auto;padding:18px}.network-grid{position:relative;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto;padding:0;gap:12px}.city-card,.city-card:nth-child(n){grid-column:auto;grid-row:auto;justify-self:stretch;align-self:stretch;max-width:none}.city-card:nth-child(7){grid-column:1/3}.network-hub{position:relative;left:auto;top:auto;transform:none;margin:28px auto 6px;width:260px;height:150px}.route{display:none}.admin-dist-grid,.admin-city-list{grid-template-columns:1fr}}


/* V103 rebuilt distribution network */
.editable-distribution{padding:46px 24px!important;background:#041225!important;border-top:16px solid #071c36!important;border-bottom:16px solid #071c36!important}
.editable-distribution .distribution-shell{width:min(1480px,100%);min-height:720px;grid-template-columns:minmax(330px,390px) minmax(0,1fr);border-radius:28px;background:#06172d;border:1px solid rgba(69,165,235,.32);box-shadow:0 28px 80px rgba(0,0,0,.28)}
.editable-distribution .distribution-summary{padding:46px 38px;border-right:1px solid rgba(93,177,239,.18);background:linear-gradient(180deg,#06172d 0%,#071d37 100%)}
.editable-distribution .distribution-summary h2{font-size:clamp(38px,3.2vw,54px);margin:26px 0 18px;max-width:330px}
.editable-distribution .distribution-summary>p{font-size:15px;max-width:315px}
.editable-distribution .distribution-metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.editable-distribution .distribution-metrics>div{min-width:0;padding:15px 6px}
.editable-distribution .distribution-metrics strong{font-size:23px}
.editable-distribution .distribution-metrics span{font-size:8px;line-height:1.35}
.editable-distribution .distribution-network{min-height:720px;isolation:isolate;background:radial-gradient(circle at 50% 50%,rgba(13,137,217,.16),transparent 34%),linear-gradient(145deg,#041326,#061a31)}
.editable-distribution .network-routes{position:absolute;inset:0;width:100%;height:100%;z-index:1;overflow:visible;pointer-events:none}
.editable-distribution .network-grid{position:absolute;inset:0;z-index:3;padding:26px;display:grid;grid-template-columns:240px 1fr 240px;grid-template-rows:190px 1fr 190px;gap:18px}
.editable-distribution .city-card{width:100%;max-width:220px;align-self:start;border-radius:16px;background:#071a31;border:1px solid rgba(79,176,241,.52);box-shadow:0 14px 34px rgba(0,0,0,.25);transition:transform .25s,border-color .25s}
.editable-distribution .city-card:hover{transform:translateY(-4px);border-color:#4fcfff}
.editable-distribution .city-card:nth-child(1){grid-column:1;grid-row:1;justify-self:start}
.editable-distribution .city-card:nth-child(2){grid-column:2;grid-row:1;justify-self:center}
.editable-distribution .city-card:nth-child(3){grid-column:3;grid-row:1;justify-self:end}
.editable-distribution .city-card:nth-child(4){grid-column:1;grid-row:2;align-self:center;justify-self:start}
.editable-distribution .city-card:nth-child(5){grid-column:3;grid-row:2;align-self:center;justify-self:end}
.editable-distribution .city-card:nth-child(6){grid-column:1;grid-row:3;align-self:end;justify-self:start}
.editable-distribution .city-card:nth-child(7){grid-column:3;grid-row:3;align-self:end;justify-self:end}
.editable-distribution .city-card img{height:82px}
.editable-distribution .city-card h3{font-size:15px;margin:10px 12px 9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.editable-distribution .city-stats small{font-size:8px}.editable-distribution .city-stats b{font-size:14px}
.editable-distribution .network-hub{left:50%;top:50%;width:300px;height:188px;z-index:4}
.editable-distribution .hub-ring{border-color:#1fc5ff;box-shadow:0 0 24px rgba(19,184,255,.7),inset 0 0 36px rgba(0,157,255,.18)}
.editable-distribution .hub-building{min-width:190px;padding:29px 34px;color:#fff;background:linear-gradient(145deg,#0b4f8c,#082b52);border-color:#66d6ff;letter-spacing:.12em}
.editable-distribution .route{display:none!important}
.editable-distribution .route-trucks use{filter:drop-shadow(0 0 5px rgba(65,202,255,.8))}
@media(max-width:1180px){.editable-distribution .distribution-shell{grid-template-columns:330px 1fr}.editable-distribution .network-grid{grid-template-columns:205px 1fr 205px}.editable-distribution .city-card{max-width:190px}.editable-distribution .network-hub{width:250px;height:160px}}
@media(max-width:900px){.editable-distribution{padding:24px 14px!important}.editable-distribution .distribution-shell{grid-template-columns:1fr}.editable-distribution .distribution-summary{border-right:0;border-bottom:1px solid rgba(93,177,239,.18)}.editable-distribution .distribution-summary h2,.editable-distribution .distribution-summary>p{max-width:none}.editable-distribution .distribution-network{min-height:auto;padding:22px}.editable-distribution .network-routes{display:none}.editable-distribution .network-grid{position:relative;inset:auto;padding:0;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto;gap:14px}.editable-distribution .city-card,.editable-distribution .city-card:nth-child(n){grid-column:auto;grid-row:auto;justify-self:stretch;align-self:stretch;max-width:none}.editable-distribution .city-card:nth-child(7){grid-column:1/-1}.editable-distribution .network-hub{position:relative;left:auto;top:auto;transform:none;margin:24px auto 4px;width:270px;height:150px;order:-1}.editable-distribution .distribution-network{display:flex;flex-direction:column}.editable-distribution .network-grid{order:2}}
@media(max-width:520px){.editable-distribution{padding:12px 8px!important;border-width:10px!important}.editable-distribution .distribution-summary{padding:30px 20px}.editable-distribution .distribution-summary h2{font-size:36px}.editable-distribution .distribution-metrics{grid-template-columns:1fr}.editable-distribution .network-grid{grid-template-columns:1fr}.editable-distribution .city-card:nth-child(7){grid-column:auto}.editable-distribution .network-hub{width:230px;height:136px}.editable-distribution .city-card img{height:120px}}

/* ============================================================
   V103 — Distribution section premium redesign
   Applies to .editable-distribution (used on Home + Distribution page)
   and .distribution-process / .distribution-cta (Distribution page)
   ============================================================ */

/* --- Section shell & ambience --- */
.editable-distribution.home-distribution{position:relative;padding:120px 0!important}
.editable-distribution.home-distribution:before{
  background:
    radial-gradient(circle at 14% 12%,rgba(34,197,255,.14),transparent 40%),
    radial-gradient(circle at 88% 82%,rgba(89,233,138,.10),transparent 38%),
    radial-gradient(circle at 76% 30%,rgba(0,187,255,.16),transparent 34%),
    linear-gradient(135deg,#050f20,#08243f)!important;
}
.editable-distribution .distribution-shell{
  border:1px solid rgba(120,200,255,.22)!important;
  border-radius:32px!important;
  box-shadow:0 40px 120px rgba(0,10,25,.45),inset 0 1px 0 rgba(255,255,255,.06)!important;
  position:relative;
}
.editable-distribution .distribution-shell:before{
  content:"";position:absolute;inset:0;border-radius:32px;padding:1px;pointer-events:none;z-index:5;
  background:linear-gradient(135deg,rgba(94,212,255,.55),rgba(94,212,255,0) 30%,rgba(94,212,255,0) 70%,rgba(89,233,138,.35));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
}

/* --- Live badge --- */
.editable-distribution .distribution-live{
  background:linear-gradient(135deg,rgba(21,198,255,.14),rgba(21,198,255,.03))!important;
  border:1px solid rgba(21,198,255,.4)!important;
  padding:10px 16px 10px 12px!important;
  box-shadow:0 8px 24px rgba(10,130,200,.18);
}
.editable-distribution .distribution-live span{
  position:relative;background:#18e0ae!important;box-shadow:0 0 14px #18e0ae!important;
}
.editable-distribution .distribution-live span:after{
  content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid #18e0ae;
  animation:distLivePing 2.1s ease-out infinite;
}
@keyframes distLivePing{0%{transform:scale(.5);opacity:.9}100%{transform:scale(2.4);opacity:0}}

/* --- Heading & copy --- */
.editable-distribution .distribution-summary h2{
  font-weight:950!important;
  letter-spacing:-.04em!important;
}
.editable-distribution .distribution-summary h2 em{
  font-style:normal!important;
  background:linear-gradient(100deg,#4fd2ff 8%,#7ce9ff 45%,#59e98a 92%);
  -webkit-background-clip:text;background-clip:text;color:transparent!important;
}
.editable-distribution .distribution-summary>p{font-size:15.5px!important;line-height:1.8!important}

/* --- Metrics --- */
.editable-distribution .distribution-metrics>div{
  position:relative;
  background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.015))!important;
  border:1px solid rgba(120,200,255,.22)!important;
  border-radius:18px!important;
  padding:17px 8px 15px!important;
  transition:.3s;
}
.editable-distribution .distribution-metrics>div:hover{
  transform:translateY(-3px);
  border-color:rgba(120,200,255,.5)!important;
  background:linear-gradient(160deg,rgba(120,200,255,.1),rgba(255,255,255,.02))!important;
}
.editable-distribution .distribution-metrics strong{
  background:linear-gradient(135deg,#fff,#bfe9ff);
  -webkit-background-clip:text;background-clip:text;color:transparent!important;
  letter-spacing:-.03em!important;
}
.editable-distribution .distribution-metrics span{letter-spacing:.06em!important;font-weight:800!important}

/* --- Bullets --- */
.editable-distribution .distribution-summary ul{margin:24px 0!important}
.editable-distribution .distribution-summary li{
  display:flex;align-items:center;gap:2px;font-size:14px!important;
}
.editable-distribution .distribution-summary li:before{
  background:linear-gradient(135deg,#16c6ff,#0b8fd9)!important;
  border:none!important;color:#fff!important;font-size:11px!important;
  box-shadow:0 6px 16px rgba(11,143,217,.4);
}

/* --- CTA button --- */
.editable-distribution .distribution-summary .btn-primary{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,#22c5ff,#0b66b3)!important;
  box-shadow:0 18px 50px rgba(10,130,200,.4)!important;
  padding:17px 26px!important;
}
.editable-distribution .distribution-summary .btn-primary:after{
  content:"→";margin-inline-start:2px;transition:transform .25s;display:inline-block;
}
.editable-distribution .distribution-summary .btn-primary:hover:after{transform:translateX(4px)}
.editable-distribution .distribution-summary .btn-primary:hover{box-shadow:0 22px 60px rgba(10,150,230,.55)!important}

/* --- Network canvas --- */
.editable-distribution .distribution-network{
  background:
    radial-gradient(circle at 50% 50%,rgba(13,137,217,.20),transparent 36%),
    linear-gradient(145deg,#03101f,#071b32)!important;
}
.editable-distribution .distribution-network:before{
  content:"";position:absolute;inset:0;z-index:0;opacity:.5;pointer-events:none;
  background-image:radial-gradient(rgba(120,200,255,.14) 1px,transparent 1px);
  background-size:26px 26px;
  -webkit-mask:radial-gradient(circle at 50% 50%,#000 10%,transparent 70%);
  mask:radial-gradient(circle at 50% 50%,#000 10%,transparent 70%);
}

/* --- City cards --- */
.editable-distribution .city-card{
  position:relative;
  border:1px solid rgba(120,200,255,.24)!important;
  border-radius:20px!important;
  background:linear-gradient(165deg,#0a1f38,#071427)!important;
  box-shadow:0 18px 44px rgba(0,10,25,.4)!important;
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s;
}
.editable-distribution .city-card:hover{
  transform:translateY(-5px);
  border-color:rgba(94,212,255,.55)!important;
  box-shadow:0 26px 60px rgba(0,10,25,.55),0 0 0 1px rgba(94,212,255,.2)!important;
  z-index:6;
}
.editable-distribution .city-card img{
  height:190px!important;
  filter:saturate(1.05) brightness(.92);
  transition:transform .5s;
}
.editable-distribution .city-card:hover img{transform:scale(1.07)}
.editable-distribution .city-card:before{
  content:"";position:absolute;left:0;right:0;top:0;height:190px;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(4,17,34,0) 45%,rgba(4,17,34,.9) 100%);
}
.editable-distribution .city-card h3{
  position:relative;z-index:2;
  font-size:15px!important;font-weight:900!important;letter-spacing:-.01em;
  display:flex;align-items:flex-start;gap:7px;
  white-space:normal!important;overflow:visible!important;text-overflow:clip!important;line-height:1.28!important;
}
.editable-distribution .city-card h3:before{
  content:"";width:6px;height:6px;border-radius:50%;margin-top:6px;
  background:#18e0ae;box-shadow:0 0 8px #18e0ae;flex:none;
}
.editable-distribution .city-stats{border-top:1px solid rgba(120,200,255,.14)!important}
.editable-distribution .city-stats div+div{border-left:1px solid rgba(120,200,255,.14)!important}
.editable-distribution .city-stats small{
  text-transform:uppercase;letter-spacing:.07em;font-weight:800!important;
  color:rgba(180,220,255,.55)!important;
}
.editable-distribution .city-stats b{font-size:16px!important;letter-spacing:-.02em}

/* --- Hub --- */
.editable-distribution .network-hub:before{
  content:"";position:absolute;inset:-34px;border-radius:50%;
  border:1px dashed rgba(94,212,255,.28);
  animation:distHubSpin 22s linear infinite;
}
.editable-distribution .network-hub:after{
  content:"";position:absolute;inset:-64px;border-radius:50%;
  border:1px dashed rgba(94,212,255,.14);
  animation:distHubSpin 34s linear infinite reverse;
}
@keyframes distHubSpin{to{transform:rotate(360deg)}}
.editable-distribution .hub-ring{
  border:2px solid #21c8ff!important;
  box-shadow:0 0 30px rgba(19,184,255,.85),0 0 70px rgba(19,184,255,.25),inset 0 0 44px rgba(0,157,255,.22)!important;
  animation:distHubPulse 3.2s ease-in-out infinite;
}
@keyframes distHubPulse{0%,100%{box-shadow:0 0 30px rgba(19,184,255,.85),0 0 70px rgba(19,184,255,.25),inset 0 0 44px rgba(0,157,255,.22)}50%{box-shadow:0 0 42px rgba(19,184,255,1),0 0 90px rgba(19,184,255,.4),inset 0 0 50px rgba(0,157,255,.3)}}
.editable-distribution .hub-building{
  background:linear-gradient(150deg,#0d5da3,#082b52)!important;
  border:1px solid rgba(150,225,255,.7)!important;
  box-shadow:0 26px 60px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.18)!important;
  font-size:15px!important;
}
.editable-distribution .hub-building small{color:rgba(210,240,255,.85)!important;font-size:11px!important}

/* --- Route lines / dots / trucks --- */
.editable-distribution .route-lines{stroke-width:2.4!important;filter:drop-shadow(0 0 6px rgba(52,201,255,.55))}
.editable-distribution .route-dots{filter:drop-shadow(0 0 10px rgba(140,234,255,.9))!important}
.editable-distribution .route-dots circle{animation:distDotPulse 2.4s ease-in-out infinite}
@keyframes distDotPulse{0%,100%{opacity:1}50%{opacity:.45}}
.editable-distribution .route-trucks use{filter:drop-shadow(0 0 6px rgba(65,202,255,.9))}

@media(prefers-reduced-motion:reduce){
  .editable-distribution .distribution-live span:after,
  .editable-distribution .network-hub:before,
  .editable-distribution .network-hub:after,
  .editable-distribution .hub-ring,
  .editable-distribution .route-dots circle{animation:none}
}

@media(max-width:900px){
  .editable-distribution.home-distribution{padding:70px 0!important}
}

/* ============================================================
   Distribution process (How we deliver) — distribution.html
   ============================================================ */
.distribution-process{position:relative}
.distribution-process .kicker{display:inline-flex;align-items:center;gap:8px}
.distribution-process .kicker:before{content:"";width:22px;height:2px;background:var(--blue);display:inline-block;border-radius:2px}
.dist-process-grid{position:relative;margin-top:48px!important}
.dist-process-grid:before{
  content:"";position:absolute;left:6%;right:6%;top:57px;height:2px;z-index:0;
  background:repeating-linear-gradient(90deg,rgba(11,102,179,.28) 0 10px,transparent 10px 22px);
}
.dist-process-grid article{
  position:relative;z-index:1;
  border:1px solid var(--darkline)!important;
  border-radius:24px!important;
  padding:30px 26px 28px!important;
  background:linear-gradient(165deg,#fff,#f7fbff)!important;
  box-shadow:0 18px 50px rgba(6,23,45,.07)!important;
  transition:transform .3s,box-shadow .3s,border-color .3s;
  overflow:hidden;
}
.dist-process-grid article:hover{
  transform:translateY(-6px);
  box-shadow:0 28px 70px rgba(6,23,45,.14)!important;
  border-color:rgba(11,102,179,.28)!important;
}
.dist-process-grid article:after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:3px;
  background:linear-gradient(90deg,#22c5ff,#59e98a);
  transform:scaleX(0);transform-origin:left;transition:transform .4s;
}
.dist-process-grid article:hover:after{transform:scaleX(1)}
.dist-process-grid .step-top{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.dist-process-grid .step-icon{
  display:grid;place-items:center;width:46px;height:46px;border-radius:14px;flex:none;
  background:linear-gradient(155deg,#e8f7ff,#d9f0ff);
  color:#0b66b3;
  box-shadow:inset 0 0 0 1px rgba(11,102,179,.16);
}
.dist-process-grid .step-icon svg{width:22px;height:22px}
.dist-process-grid .step-num{
  font-weight:950;font-size:13px;letter-spacing:.05em;color:rgba(16,32,51,.28);
}
.dist-process-grid h3{font-size:20px!important;margin:0 0 9px!important;letter-spacing:-.01em}
.dist-process-grid p{font-size:14.5px!important}

.distribution-cta{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,#050f20,#0a3560)!important;
  border:1px solid rgba(120,200,255,.22)!important;
  box-shadow:0 30px 80px rgba(0,10,25,.3)!important;
}
.distribution-cta:before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 88% 20%,rgba(34,197,255,.28),transparent 45%),radial-gradient(circle at 10% 110%,rgba(89,233,138,.16),transparent 40%);
  pointer-events:none;
}
.distribution-cta>div{position:relative;z-index:1}
.distribution-cta h2{font-size:26px!important;letter-spacing:-.02em}
.distribution-cta .btn-primary{
  position:relative;z-index:1;
  background:linear-gradient(135deg,#22c5ff,#0b66b3)!important;
  box-shadow:0 18px 50px rgba(10,130,200,.4)!important;
  white-space:nowrap;
}

@media(max-width:640px){
  .dist-process-grid:before{display:none}
  .dist-process-grid article{padding:26px 22px 24px!important}
}

/* ============================================================
   V105 — Distribution NETWORK visual: full rebuild
   Replace crossing spoke-lines diagram with a clean hub banner
   + non-overlapping responsive city grid (no more messy overlaps)
   ============================================================ */
.editable-distribution .distribution-shell{
  min-height:auto!important;
  display:flex!important;
  align-items:flex-start!important;
}
.editable-distribution .distribution-summary{
  flex:0 0 min(390px,38%)!important;
  width:auto!important;
}
.editable-distribution .distribution-network{
  flex:1 1 auto!important;
  min-width:0!important;
}
@media(max-width:900px){
  .editable-distribution .distribution-shell{flex-direction:column!important}
  .editable-distribution .distribution-summary{flex-basis:auto!important;width:100%!important}
}
.editable-distribution .distribution-network{
  min-height:auto!important;
  display:flex!important;
  flex-direction:column!important;
  gap:22px!important;
  padding:32px!important;
  isolation:auto;
  border-radius:0 30px 30px 0;
}
.editable-distribution .network-routes{display:none!important}

/* --- Hub becomes a full-width banner, always first --- */
.editable-distribution .network-hub{
  position:relative!important;left:auto!important;top:auto!important;
  transform:none!important;width:100%!important;height:auto!important;
  order:-1;
  display:flex;align-items:center;gap:18px;
  padding:22px 28px;
  border-radius:22px;
  background:linear-gradient(120deg,#0c3363,#0a2748 55%,#051425);
  border:1px solid rgba(94,212,255,.38);
  box-shadow:0 25px 70px rgba(0,10,25,.4),inset 0 1px 0 rgba(255,255,255,.06);
  overflow:hidden;
}
.editable-distribution .network-hub:before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(circle at 88% 20%,rgba(34,197,255,.30),transparent 45%),
    radial-gradient(circle at 6% 120%,rgba(89,233,138,.14),transparent 45%);
}
.editable-distribution .network-hub:after{
  content:"";position:absolute;right:-40px;top:50%;translate:0 -50%;
  width:180px;height:180px;border-radius:50%;
  border:1px dashed rgba(120,200,255,.18);pointer-events:none;
}
.editable-distribution .hub-ring{
  position:relative!important;inset:auto!important;
  width:58px;height:58px;flex:none;border-radius:16px;
  display:grid;place-items:center;
  background:linear-gradient(150deg,#f4fbff,#dff1ff);
  border:1px solid rgba(170,230,255,.7)!important;
  box-shadow:0 0 0 6px rgba(21,160,224,.12),0 14px 30px rgba(0,0,0,.4)!important;
  animation:hubIconPulse 3.2s ease-in-out infinite;
  padding:9px;
}
.editable-distribution .hub-ring img{width:100%;height:100%;object-fit:contain;position:relative;z-index:1}
@keyframes hubIconPulse{0%,100%{box-shadow:0 0 0 6px rgba(21,160,224,.12),0 14px 30px rgba(0,0,0,.4)}50%{box-shadow:0 0 0 10px rgba(21,160,224,.2),0 14px 30px rgba(0,0,0,.4)}}
.editable-distribution .hub-building{
  position:relative!important;z-index:1;
  min-width:0!important;padding:0!important;
  background:none!important;border:none!important;box-shadow:none!important;
  text-align:left!important;font-size:19px!important;letter-spacing:.06em!important;
  color:#fff!important;
}
.rtl .editable-distribution .hub-building{text-align:right!important}
.editable-distribution .hub-building small{
  margin-top:5px!important;font-size:12.5px!important;letter-spacing:.02em!important;
  color:rgba(200,232,255,.78)!important;font-weight:600;
}
.editable-distribution .network-hub .hub-live-chip{
  margin-inline-start:auto;flex:none;position:relative;z-index:1;
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 14px;border-radius:999px;
  background:rgba(24,224,174,.12);border:1px solid rgba(24,224,174,.4);
  color:#7dfad0;font-size:11px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;
  white-space:nowrap;
}
.editable-distribution .network-hub .hub-live-chip span{
  width:7px;height:7px;border-radius:50%;background:#18e0ae;box-shadow:0 0 10px #18e0ae;flex:none;
}

/* --- City grid: real, non-overlapping, responsive --- */
.editable-distribution .network-grid-wrap{
  display:grid!important;
  grid-template-columns:repeat(4,1fr)!important;
  gap:16px!important;
}
.editable-distribution .network-grid{
  display:contents!important;
}
.editable-distribution .city-card,
.editable-distribution .city-card:nth-child(n){
  grid-column:auto!important;grid-row:auto!important;
  justify-self:stretch!important;align-self:stretch!important;
  max-width:none!important;width:100%!important;
}
.editable-distribution .network-filler{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  text-align:center;padding:20px 14px;border-radius:16px;
  background:linear-gradient(155deg,rgba(34,197,255,.14),rgba(89,233,138,.06));
  border:1px dashed rgba(120,200,255,.4);
  color:#eafcff;
}
.editable-distribution .network-filler svg{width:26px;height:26px;color:#5ed8ff}
.editable-distribution .network-filler b{font-size:13px;font-weight:900;letter-spacing:.02em;line-height:1.35}

@media(max-width:1180px){
  .editable-distribution .network-grid-wrap{grid-template-columns:repeat(3,1fr)!important}
}
@media(max-width:900px){
  .editable-distribution{padding:24px 14px!important}
  .editable-distribution .distribution-network{padding:22px!important}
  .editable-distribution .network-hub{padding:20px 22px}
  .editable-distribution .network-grid-wrap{grid-template-columns:repeat(2,1fr)!important}
}
@media(max-width:520px){
  .editable-distribution .network-hub{flex-wrap:wrap;gap:12px 16px;padding:18px}
  .editable-distribution .network-hub .hub-live-chip{margin-inline-start:0}
  .editable-distribution .hub-building{font-size:17px!important}
  .editable-distribution .city-card img{height:110px!important}
  .editable-distribution .network-filler{grid-column:1/-1}
}

/* v107: remove the dark shadow band from Distribution city cards */
.editable-distribution .city-card::before{
  content:none!important;
  display:none!important;
  background:none!important;
}
.editable-distribution .city-card img{
  filter:saturate(1.05) brightness(1)!important;
}


/* V108: refined category heading, clickable gallery label and performance */
.categories-head{display:flex;flex-direction:column;align-items:flex-start;max-width:760px}.categories-head .lead{margin-top:28px;max-width:620px}
.categories-head>div{min-width:0}.categories-head .title{max-width:760px;margin-bottom:0}.categories-head .lead{justify-self:end;max-width:520px;margin:0 0 8px;font-size:16px}
.gallery-kicker-link{display:inline-flex;align-items:center;gap:8px;width:max-content;border-radius:999px;padding:7px 10px 7px 0;transition:.2s}
.gallery-kicker-link:after{content:'↗';display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--blue);color:#fff;font-size:12px;transition:.2s}
.gallery-kicker-link:hover{transform:translateY(-1px)}.gallery-kicker-link:hover:after{transform:translate(2px,-2px)}
.rtl .gallery-kicker-link{padding:7px 0 7px 10px}.rtl .gallery-kicker-link:after{content:'↖'}
.form-status{grid-column:1/-1;display:none;padding:14px 16px;border-radius:16px;font-weight:800}
.form-status.success{display:block;background:#e9fff7;color:#087759;border:1px solid #a9ead4}.form-status.error{display:block;background:#fff0f0;color:#a31e1e;border:1px solid #f0b5b5}
.admin-section{scroll-margin-top:30px}.admin-settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.admin-settings-grid label{display:grid;gap:7px;font-weight:800}.admin-settings-grid input{width:100%;padding:12px;border:1px solid #d7e0ea;border-radius:12px}.admin-settings-grid .full{grid-column:1/-1}
.submission-list{display:grid;gap:12px}.submission-card{border:1px solid #dce5ef;border-radius:18px;padding:16px;background:#f8fbff}.submission-card header{display:flex;justify-content:space-between;gap:12px;align-items:start}.submission-card dl{display:grid;grid-template-columns:140px 1fr;gap:8px 12px;margin:14px 0}.submission-card dt{font-weight:900;color:#526579}.submission-card dd{margin:0;word-break:break-word}.submission-card button{border:0;border-radius:10px;padding:9px 12px;background:#ffeaea;color:#a21b1b;font-weight:900;cursor:pointer}
@media(max-width:1040px){.categories-head{grid-template-columns:1fr;row-gap:20px}.categories-head .lead{justify-self:start;max-width:720px;margin:0}.admin-settings-grid{grid-template-columns:1fr}.admin-settings-grid .full{grid-column:auto}}
@media(max-width:768px){html{scroll-behavior:auto}.nav-inner,.lang-menu,.stat,.glass-note{backdrop-filter:none!important}.cat-track{will-change:auto}.hero:before{animation:none}.categories-head .title{font-size:clamp(38px,11vw,58px);line-height:.94}.submission-card dl{grid-template-columns:1fr}.submission-card dt{margin-top:6px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}


/* ===== v109 precision refinements ===== */
@media (min-width: 900px){
  .categories-section .categories-head{display:grid!important;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr)!important;align-items:end!important;gap:clamp(48px,7vw,110px)!important;padding-bottom:36px!important}
  .categories-section .categories-head>div{min-width:0;max-width:720px}
  .categories-section .categories-head .title{max-width:680px!important;margin:14px 0 0!important;line-height:.98!important;letter-spacing:-.055em!important;text-wrap:balance}
  .categories-section .categories-head .lead{max-width:520px!important;margin:0 0 7px!important;line-height:1.75!important;justify-self:end}
}
.gallery-kicker-link{display:inline-flex;align-items:center;gap:9px;text-decoration:none;position:relative;padding:6px 28px 6px 0;border-radius:999px;transition:opacity .2s ease,transform .2s ease}
.gallery-kicker-link::after{content:'→';position:absolute;right:7px;top:50%;transform:translateY(-52%);font-size:15px;font-weight:900;transition:transform .2s ease}
.gallery-kicker-link:hover{transform:translateX(3px);opacity:.76}
.gallery-kicker-link:hover::after{transform:translate(4px,-52%)}
[dir="rtl"] .gallery-kicker-link{padding:6px 0 6px 28px}
[dir="rtl"] .gallery-kicker-link::after{content:'←';right:auto;left:7px}
@media(max-width:700px){.gallery-kicker-link{padding-top:3px;padding-bottom:3px}.home-gallery .section-head{margin-bottom:14px!important}}
html{scroll-behavior:smooth}
body{overflow-x:clip}
img{content-visibility:auto}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@media(max-width:780px){.orb,.glow,.noise-layer{filter:none!important}.cat-card,.home-gallery-grid a,.dist-city-card{transform:translateZ(0);backface-visibility:hidden}.nav{backdrop-filter:blur(12px)!important}}
.cms-hidden{display:none!important}
.admin-tabs{display:flex;gap:8px;flex-wrap:wrap;position:sticky;top:10px;z-index:20;padding:12px;background:rgba(247,250,253,.94);backdrop-filter:blur(16px);border:1px solid #dce7f1;border-radius:18px;margin:22px 0}
.admin-tab{border:0;border-radius:11px;padding:10px 15px;background:#eaf1f7;color:#17304b;font-weight:800;cursor:pointer}.admin-tab.active{background:#006fc9;color:white}
.admin-group{display:none}.admin-group.active{display:block}
.cms-admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.cms-admin-grid .full{grid-column:1/-1}
.cms-editor-card{border:1px solid #dbe6ef;border-radius:16px;padding:16px;background:#fff}.cms-editor-card h4{margin:0 0 12px;color:#10263e}.cms-editor-card label{display:grid;gap:6px;font-weight:700;font-size:12px;color:#4d6277;margin:9px 0}.cms-editor-card input,.cms-editor-card textarea,.cms-editor-card select{width:100%;border:1px solid #cad8e4;border-radius:10px;padding:10px;font:inherit}.cms-editor-card textarea{min-height:84px;resize:vertical}.cms-image-preview{width:100%;height:120px;object-fit:cover;border-radius:11px;background:#eef3f7}.cms-savebar{display:flex;align-items:center;justify-content:space-between;gap:12px;position:sticky;bottom:12px;background:#08223d;color:white;padding:13px 16px;border-radius:15px;z-index:15;box-shadow:0 14px 40px rgba(1,16,32,.25)}
@media(max-width:760px){.cms-admin-grid{grid-template-columns:1fr}.admin-tabs{top:4px}.cms-savebar{align-items:stretch;flex-direction:column}}


/* v111: gallery kicker remains visibly clickable without an arrow icon */
.gallery-kicker-link,
.rtl .gallery-kicker-link,
[dir="rtl"] .gallery-kicker-link{
  display:inline-flex!important;
  align-items:center!important;
  width:max-content!important;
  padding:5px 0!important;
  gap:0!important;
  border-radius:0!important;
  text-decoration:none!important;
  position:relative!important;
  transition:opacity .2s ease!important;
}
.gallery-kicker-link::after,
.gallery-kicker-link:after,
.rtl .gallery-kicker-link::after,
[dir="rtl"] .gallery-kicker-link::after{
  content:none!important;
  display:none!important;
}
.gallery-kicker-link::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:1px;
  height:2px;
  border-radius:2px;
  background:currentColor;
  opacity:.22;
  transform:scaleX(.45);
  transform-origin:left center;
  transition:transform .22s ease,opacity .22s ease;
}
[dir="rtl"] .gallery-kicker-link::before{transform-origin:right center}
.gallery-kicker-link:hover{transform:none!important;opacity:.78!important}
.gallery-kicker-link:hover::before{transform:scaleX(1);opacity:.7}

/* v111: clearer nested organization inside the complete CMS */
.cms-subtabs{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 18px;padding:7px;background:#eef4fa;border:1px solid #dbe6f0;border-radius:16px;position:sticky;top:12px;z-index:8}
.cms-subtab{border:0;background:transparent;padding:10px 15px;border-radius:11px;font:800 12px/1 inherit;letter-spacing:.04em;color:#476079;cursor:pointer}
.cms-subtab.active{background:#fff;color:#0867b2;box-shadow:0 5px 18px rgba(11,45,78,.09)}
.cms-subpanel{display:none}.cms-subpanel.active{display:block}
.cms-page-group{border:1px solid #dce7f1;border-radius:18px;background:#fff;margin:13px 0;overflow:hidden}
.cms-page-group>summary{cursor:pointer;list-style:none;padding:17px 19px;font-weight:900;color:#10263e;display:flex;align-items:center;justify-content:space-between}
.cms-page-group>summary::-webkit-details-marker{display:none}
.cms-page-group>summary::after{content:"+";font-size:20px;color:#0874c9}
.cms-page-group[open]>summary::after{content:"−"}
.cms-page-group-body{padding:0 17px 17px}
.cms-editor-card .cms-upload-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end}
.cms-editor-card input[type=file]{width:100%;padding:9px;border:1px dashed #a9bfd1;border-radius:12px;background:#f7fbff}
.cms-image-meta{font-size:11px;color:#6b7e90;margin-top:7px;line-height:1.5}
@media(max-width:700px){.cms-subtabs{position:static}.cms-editor-card .cms-upload-row{grid-template-columns:1fr}}

/* ===== v112 final category header correction ===== */
.categories-section .categories-head{
  display:block!important;
  width:100%!important;
  max-width:980px!important;
  margin-bottom:42px!important;
  padding-bottom:0!important;
}
.categories-section .categories-head>div{
  width:100%!important;
  max-width:none!important;
}
.categories-section .categories-head .title{
  width:100%!important;
  max-width:940px!important;
  margin:14px 0 0!important;
  font-size:clamp(52px,5.35vw,76px)!important;
  line-height:.94!important;
  letter-spacing:-.06em!important;
  text-wrap:balance!important;
}
.categories-section .categories-head .lead{
  display:block!important;
  width:100%!important;
  max-width:650px!important;
  margin:30px 0 0!important;
  font-size:17px!important;
  line-height:1.8!important;
  justify-self:auto!important;
}
.gallery-kicker-link{
  padding:0!important;
  gap:0!important;
}
.gallery-kicker-link::after{
  content:none!important;
  display:none!important;
}
.gallery-kicker-link:hover{
  transform:none!important;
}
@media(max-width:768px){
  .categories-section .categories-head{
    max-width:100%!important;
    margin-bottom:28px!important;
  }
  .categories-section .categories-head .title{
    max-width:100%!important;
    font-size:clamp(40px,11vw,58px)!important;
    line-height:.95!important;
  }
  .categories-section .categories-head .lead{
    max-width:100%!important;
    margin-top:22px!important;
    font-size:16px!important;
  }
}

/* v113 admin direct banner uploader */
.admin-banner-upload-card{display:flex;flex-direction:column;gap:12px;min-width:0}
.admin-banner-upload-card h4{margin:0;color:#0c2039;text-transform:capitalize}
.admin-banner-preview{width:100%;aspect-ratio:16/7;border-radius:14px;background:#e9eef5 center/cover no-repeat;border:1px solid rgba(13,49,84,.13);box-shadow:inset 0 0 0 1px rgba(255,255,255,.65)}
.admin-upload-button{display:flex!important;align-items:center;justify-content:center;min-height:44px;padding:10px 14px;border-radius:12px;background:#0874c9;color:#fff!important;font-weight:800;cursor:pointer;text-align:center}
.admin-upload-button:hover{filter:brightness(.94)}
.admin-upload-button input{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
.admin-inline-status{display:inline-block;margin-inline-start:14px;font-weight:800;color:#08745b}
@media(max-width:720px){.admin-settings-grid .cms-admin-grid{grid-template-columns:1fr}.admin-inline-status{display:block;margin:10px 0 0}}

/* ===== v115 production quality, accessibility and admin organization ===== */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.skip-link{position:fixed;inset-inline-start:16px;top:12px;z-index:99999;padding:10px 16px;border-radius:10px;background:#fff;color:#071a32;font-weight:800;transform:translateY(-160%);transition:transform .2s}.skip-link:focus{transform:none}:focus-visible{outline:3px solid #13a8e2;outline-offset:3px}img{max-width:100%;height:auto}.admin-shell{max-width:1440px;padding-block:40px!important}.admin-dashboard-head{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;padding:28px;border:1px solid #dce7f2;border-radius:24px;background:#fff;box-shadow:0 16px 50px rgba(9,31,56,.08)}.admin-dashboard-head h1{margin:.15em 0;font-size:clamp(2rem,4vw,3.4rem)}.admin-logout{border:1px solid #cbd9e7;border-radius:12px;background:#fff;padding:11px 16px;font-weight:800;cursor:pointer}.admin-section-nav{position:sticky;top:10px;z-index:20;display:flex;gap:8px;overflow:auto;margin:18px 0;padding:10px;border:1px solid #dce7f2;border-radius:16px;background:rgba(255,255,255,.94);backdrop-filter:blur(14px)}.admin-section-nav a{flex:0 0 auto;padding:9px 13px;border-radius:10px;color:#17324f;font-size:.82rem;font-weight:800;text-decoration:none}.admin-section-nav a:hover{background:#eaf5fc;color:#0069b4}.admin-panel .form-card,.admin-panel .admin-section{scroll-margin-top:90px;margin-top:24px}.admin-panel label{font-weight:700}.admin-panel input,.admin-panel textarea,.admin-panel select{width:100%;border:1px solid #cbd9e7;background:#fff}.admin-login .admin-box label{display:block;margin-top:12px}.admin-login .admin-box input{width:100%;padding:15px;border-radius:15px;border:1px solid #ddd}.admin-login .admin-box button{width:100%;margin-top:14px}.admin-upload-button{display:inline-flex!important;align-items:center;justify-content:center;min-height:44px;padding:10px 14px;border-radius:12px;background:#087bc1;color:#fff;cursor:pointer}.admin-upload-button input{position:absolute;opacity:0;pointer-events:none;width:1px!important;height:1px!important}.cms-editor-card{overflow:hidden}.cms-image-preview,.admin-banner-preview{background-color:#eef5fb;background-size:cover;background-position:center}@media(max-width:760px){.admin-dashboard-head{flex-direction:column}.admin-section-nav{top:4px}.admin-panel{padding-inline:12px!important}.admin-settings-grid,.cms-admin-grid{grid-template-columns:1fr!important}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
.cms-language-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.cms-language-grid textarea{min-height:100px}@media(max-width:900px){.cms-language-grid{grid-template-columns:1fr}}

/* ===== v130 production fixes: iOS rails, mobile hero clearance, stable card labels ===== */
.hero:before{background-image:linear-gradient(90deg,rgba(4,15,34,.94),rgba(4,15,34,.56),rgba(4,15,34,.8)),var(--cms-hero-image,url('https://images.unsplash.com/photo-1586528116311-ad8dd3c8310d?auto=format&fit=crop&w=2200&q=80'))!important}
.category-wrap,.brand-marquee,.hero-ticker-viewport{overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;touch-action:pan-y pinch-zoom}
.category-wrap::-webkit-scrollbar,.brand-marquee::-webkit-scrollbar,.hero-ticker-viewport::-webkit-scrollbar{display:none}
.cat-track,.brand-track,.hero-brand-track{animation:none!important;transform:none!important;will-change:auto!important;touch-action:auto!important}
.category-wrap.is-dragging,.brand-marquee.is-dragging,.hero-ticker-viewport.is-dragging{cursor:grabbing;user-select:none}
@media(max-width:768px){
  .hero-content{padding-top:calc(112px + env(safe-area-inset-top))!important}
  .headline{margin-top:10px!important;overflow:visible!important}
  .mobile-flow-step{isolation:isolate}
  .mobile-flow-step .flow-num{position:relative!important;z-index:3!important;align-self:start!important;margin-top:2px!important;min-width:34px!important;width:34px!important;height:34px!important;font-size:11px!important}
  .mobile-flow-step .flow-copy{position:relative!important;z-index:2!important;min-width:0!important;padding-inline-end:2px!important}
  .mobile-flow-step .flow-copy b,.mobile-flow-step .flow-copy small{overflow-wrap:anywhere!important}
}
@media(max-width:390px){
  .hero-content{padding-top:calc(108px + env(safe-area-inset-top))!important}
  .headline{font-size:clamp(34px,10.8vw,44px)!important;line-height:.96!important}
  .mobile-flow-step{grid-template-columns:40px minmax(0,1fr) 38%!important;gap:8px!important;padding-inline:10px!important}
}
@media(prefers-reduced-motion:reduce){
  .category-wrap,.brand-marquee,.hero-ticker-viewport{scroll-behavior:auto!important}
}


/* ===== v140 admin design studio + responsive controls ===== */
:root{--hero-min-desktop:760px;--hero-min-mobile:720px;--hero-title-desktop:64px;--hero-title-mobile:38px;--section-title-desktop:48px;--section-title-mobile:32px;--mobile-header-offset:76px;--cms-radius:24px;--cms-section-gap:96px;--cms-bg-position:center center}
.hero{min-height:var(--hero-min-desktop)}
.hero h1,.hero-title{font-size:clamp(40px,var(--hero-title-desktop),88px)}
.section-title,h2.section-title{font-size:clamp(30px,var(--section-title-desktop),68px)}
[data-page-bg],.page-hero,.inner-hero,.hero{background-position:var(--cms-bg-position)!important}
.cms-no-motion *,.cms-no-motion *::before,.cms-no-motion *::after{animation:none!important;transition-duration:.01ms!important}
.cms-no-reveal [data-reveal],.cms-no-reveal .reveal{opacity:1!important;transform:none!important}
.admin-design-studio{overflow:visible}.design-studio-tabs{display:flex;gap:8px;flex-wrap:wrap;position:sticky;top:8px;z-index:8;padding:10px;border-radius:18px;background:rgba(7,26,50,.94);backdrop-filter:blur(14px);margin-bottom:20px}.design-studio-tabs button{border:0;border-radius:12px;padding:11px 15px;background:rgba(255,255,255,.08);color:#dce9f5;font-weight:700;cursor:pointer}.design-studio-tabs button.active{background:var(--blue,#17b8c9);color:#041523}.design-pane{display:none}.design-pane.active{display:block}.responsive-media-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.responsive-media-card{padding:18px;border:1px solid rgba(255,255,255,.12);border-radius:20px;background:rgba(255,255,255,.035)}.responsive-media-card h3{margin:0 0 14px}.media-pair{display:grid;grid-template-columns:1fr 1fr;gap:14px}.responsive-preview{height:150px;border-radius:14px;background:#0b213c center/cover no-repeat;margin:8px 0}.responsive-preview.mobile{height:190px}.responsive-media-card small{display:block;min-height:32px;margin-top:7px;color:#8fa9c0}.design-control-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.design-control-grid>label,.toggle-card{display:flex;flex-direction:column;gap:8px;padding:16px;border-radius:17px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1)}.toggle-card{flex-direction:row!important;align-items:center}.toggle-card input{width:20px;height:20px}.toggle-card span{display:flex;flex-direction:column}.toggle-card small{color:#8fa9c0}.design-control-grid input[type=range]{width:100%;accent-color:var(--blue)}.design-control-grid output{font-weight:800;color:var(--blue)}.section-order-list{display:grid;gap:9px}.section-order-list article{display:grid;grid-template-columns:1fr 150px 110px;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.09)}.section-order-list label{display:flex;align-items:center;gap:8px}.section-order-list input[type=number]{width:78px}.studio-savebar{position:sticky;bottom:10px;z-index:9;margin-top:22px;padding:13px;display:flex;align-items:center;gap:16px;border-radius:18px;background:rgba(4,18,37,.95);box-shadow:0 15px 40px rgba(0,0,0,.35);backdrop-filter:blur(16px)}.admin-section-nav{position:sticky;top:8px;z-index:20;backdrop-filter:blur(16px)}.admin-panel .form-card{border-radius:24px}.admin-panel input,.admin-panel textarea,.admin-panel select{border-radius:11px}.admin-panel h2{letter-spacing:-.02em}
@media(max-width:900px){.responsive-media-grid,.design-control-grid{grid-template-columns:1fr}.media-pair{grid-template-columns:1fr 1fr}.section-order-list article{grid-template-columns:1fr 110px}.section-order-list article>label:last-child{grid-column:1/-1}.studio-savebar{align-items:stretch;flex-direction:column}}
@media(max-width:767px){.hero{min-height:var(--hero-min-mobile);padding-top:var(--mobile-header-offset)!important}.hero h1,.hero-title{font-size:var(--hero-title-mobile)!important}.section-title,h2.section-title{font-size:var(--section-title-mobile)!important}.media-pair{grid-template-columns:1fr}.responsive-preview.desktop,.responsive-preview.mobile{height:180px}.design-studio-tabs{position:static}.studio-savebar{position:static}.admin-panel{padding-inline:10px}.admin-panel .form-card{padding:16px}}


/* ===== v141 mobile hero alignment + adaptive journey card labels ===== */
:root{--mobile-header-offset:84px;--mobile-card-number-size:24px}
@media(max-width:768px){
  /* Keep the heading close to the navigation while preserving the safe area. */
  .hero{padding-top:0!important}
  .hero-content{
    padding-top:calc(var(--mobile-header-offset) + env(safe-area-inset-top,0px))!important;
  }
  .headline{margin-top:8px!important}

  /* Both historical and current card-number classes are supported. */
  .mobile-flow-step .flow-number,
  .mobile-flow-step .flow-num{
    width:var(--mobile-card-number-size)!important;
    min-width:var(--mobile-card-number-size)!important;
    height:var(--mobile-card-number-size)!important;
    min-height:var(--mobile-card-number-size)!important;
    font-size:clamp(8px,calc(var(--mobile-card-number-size) * .42),11px)!important;
    line-height:1!important;
    padding:0!important;
    display:grid!important;
    place-items:center!important;
    flex:0 0 var(--mobile-card-number-size)!important;
  }
  .mobile-flow-step .flow-copy{
    min-width:0!important;
    overflow:hidden!important;
  }
  .mobile-flow-step .flow-copy b,
  .mobile-flow-step .flow-copy small{
    max-width:100%!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }
}
@media(max-width:390px){
  .hero-content{padding-top:calc(max(70px,var(--mobile-header-offset)) + env(safe-area-inset-top,0px))!important}
  .mobile-flow-step .flow-number,
  .mobile-flow-step .flow-num{
    --mobile-card-number-size:min(22px,var(--mobile-card-number-size));
    font-size:9px!important;
  }
  /* Reserve a clean label lane on compact Android widths. */
  .mobile-flow-step .flow-copy{padding-inline-end:4px!important}
  .mobile-flow-step:nth-of-type(even) .flow-copy{padding-inline-start:4px!important;padding-inline-end:0!important}
}
@media(max-width:360px){
  .hero-content{padding-top:calc(68px + env(safe-area-inset-top,0px))!important}
  .headline{font-size:clamp(34px,10.4vw,40px)!important;line-height:.94!important}
  .mobile-flow-step .flow-number,
  .mobile-flow-step .flow-num{width:20px!important;min-width:20px!important;height:20px!important;min-height:20px!important;font-size:8px!important}
}


/* ===== v144 Android mobile hero spacing + card labels ===== */
:root{--mobile-header-offset:84px}
@media(max-width:768px){
  /* Slightly more breathing room below the floating navigation. */
  .hero-content{
    padding-top:calc(var(--mobile-header-offset) + env(safe-area-inset-top,0px))!important;
  }
}
@media(max-width:390px){
  .hero-content{
    padding-top:calc(max(82px,var(--mobile-header-offset)) + env(safe-area-inset-top,0px))!important;
  }
}
@media(max-width:360px){
  .hero-content{
    padding-top:calc(max(80px,var(--mobile-header-offset)) + env(safe-area-inset-top,0px))!important;
  }
}
/* Numbers are intentionally removed only on Android. iOS keeps them. */
html.is-android .mobile-flow-step .flow-number,
html.is-android .mobile-flow-step .flow-num{
  display:none!important;
}
html.is-android .mobile-flow-step{
  grid-template-columns:32px minmax(0,1fr)!important;
}
html.is-android .mobile-flow-step .flow-copy{
  min-width:0!important;
  padding-inline:0!important;
}

/* ===== v144 Android hero cards: preserve image/text layout after number removal ===== */
@media (max-width:768px){
  html.is-android .mobile-flow-step,
  html.is-android .mobile-flow-step:nth-of-type(odd),
  html.is-android .mobile-flow-step:nth-of-type(even),
  html.is-android .mobile-flow-step:nth-child(1),
  html.is-android .mobile-flow-step:nth-child(3),
  html.is-android .mobile-flow-step:nth-child(5),
  html.is-android .mobile-flow-step:nth-child(7){
    display:grid!important;
    grid-template-columns:43% minmax(0,57%)!important;
    grid-template-rows:minmax(0,1fr)!important;
    align-items:stretch!important;
    padding:0!important;
    gap:0!important;
    overflow:hidden!important;
  }
  html.is-android .mobile-flow-step .flow-number,
  html.is-android .mobile-flow-step .flow-num{
    display:none!important;
  }
  html.is-android .mobile-flow-step .flow-thumb{
    grid-column:1!important;
    grid-row:1!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:0!important;
    border-radius:0!important;
    align-self:stretch!important;
  }
  html.is-android .mobile-flow-step .flow-copy,
  html.is-android .mobile-flow-step:nth-of-type(even) .flow-copy{
    grid-column:2!important;
    grid-row:1!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:0!important;
    padding:8px 24px 8px 10px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:flex-start!important;
    text-align:left!important;
    overflow:hidden!important;
  }
  html[dir="rtl"].is-android .mobile-flow-step .flow-copy{
    padding:8px 10px 8px 24px!important;
    align-items:flex-end!important;
    text-align:right!important;
  }
  html.is-android .mobile-flow-step .flow-copy b,
  html.is-android .mobile-flow-step .flow-copy small{
    width:100%!important;
    max-width:100%!important;
    margin-inline:0!important;
  }
  html.is-android .mobile-flow-step .flow-icon{
    position:absolute!important;
    right:7px!important;
    top:7px!important;
    margin:0!important;
  }
  html[dir="rtl"].is-android .mobile-flow-step .flow-icon{
    right:auto!important;
    left:7px!important;
  }
}

/* === V76: stable RTL mobile supply cards — identical geometry to English === */
@media (max-width:768px){
  /* The visual route remains physical LTR in every language. */
  html[dir="rtl"] .mobile-supply-flow,
  html[dir="rtl"] .mobile-flow-steps,
  html[dir="rtl"] .mobile-flow-step{
    direction:ltr!important;
  }

  /* Cancel older generic RTL offsets so the timeline and cards do not move. */
  html[dir="rtl"] .mobile-flow-steps{
    padding-left:15px!important;
    padding-right:0!important;
  }
  html[dir="rtl"] .mobile-flow-steps:before{
    left:4px!important;
    right:auto!important;
  }

  /* Keep all images, number badges and icons in the exact English positions. */
  html[dir="rtl"] .mobile-flow-step:nth-of-type(odd) .flow-thumb{grid-column:1!important;}
  html[dir="rtl"] .mobile-flow-step:nth-of-type(odd) .flow-copy{grid-column:2!important;}
  html[dir="rtl"] .mobile-flow-step:nth-of-type(even) .flow-thumb{grid-column:2!important;}
  html[dir="rtl"] .mobile-flow-step:nth-of-type(even) .flow-copy{grid-column:1!important;}

  html[dir="rtl"] .mobile-flow-step:nth-of-type(odd) .flow-number{
    left:9px!important;right:auto!important;
  }
  html[dir="rtl"] .mobile-flow-step:nth-of-type(odd) .flow-icon{
    right:9px!important;left:auto!important;
  }
  html[dir="rtl"] .mobile-flow-step:nth-of-type(even) .flow-number{
    right:9px!important;left:auto!important;
  }
  html[dir="rtl"] .mobile-flow-step:nth-of-type(even) .flow-icon{
    left:9px!important;right:auto!important;
  }

  /* RTL applies only to the wording, with consistent inner spacing. */
  html[dir="rtl"] .mobile-flow-step .flow-copy,
  html[dir="rtl"] .mobile-flow-step:nth-of-type(even) .flow-copy{
    direction:rtl!important;
    unicode-bidi:plaintext!important;
    justify-content:center!important;
    align-items:stretch!important;
    text-align:right!important;
    padding:10px 12px!important;
    min-width:0!important;
    overflow:hidden!important;
  }
  html[dir="rtl"] .mobile-flow-step .flow-copy b,
  html[dir="rtl"] .mobile-flow-step .flow-copy small{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    direction:rtl!important;
    text-align:right!important;
    overflow:hidden!important;
  }
  html[dir="rtl"] .mobile-flow-step .flow-copy b{
    margin:0 0 5px!important;
    font-size:12px!important;
    line-height:1.25!important;
    white-space:normal!important;
    text-overflow:clip!important;
    max-height:30px!important;
  }
  html[dir="rtl"] .mobile-flow-step .flow-copy small{
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
    font-size:8.2px!important;
    line-height:1.45!important;
    white-space:normal!important;
  }

  /* Connector geometry is independent of language direction. */
  html[dir="rtl"] .external-stage-connector{
    direction:ltr!important;
    transform:translateY(-50%)!important;
  }
  html[dir="rtl"] .external-stage-connector[data-side="right"]::after{
    right:-4px!important;left:auto!important;
  }
  html[dir="rtl"] .external-stage-connector[data-side="left"]::after{
    left:-4px!important;right:auto!important;
  }
}

@media (max-width:390px){
  html[dir="rtl"] .mobile-flow-step .flow-copy,
  html[dir="rtl"] .mobile-flow-step:nth-of-type(even) .flow-copy{
    padding:8px 10px!important;
  }
  html[dir="rtl"] .mobile-flow-step .flow-copy b{font-size:11.2px!important;}
  html[dir="rtl"] .mobile-flow-step .flow-copy small{font-size:7.7px!important;}
}

/* v147 — stable first paint on Android mobile hero cards */
@media (max-width:768px){
  .mobile-supply-flow,
  .mobile-flow-steps,
  .mobile-flow-step{
    visibility:visible;
  }
  .mobile-flow-step{
    contain:layout paint;
  }
  .mobile-flow-step .flow-thumb{
    overflow:hidden;
  }
  .mobile-flow-step .flow-thumb img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
  }
}

/* ===== v148 iOS first-paint stability + contained card badges ===== */
@media (max-width:768px){
  /* Prevent Safari font/translation reflow from moving the subtitle block. */
  html.is-ios .hero-content .sub{
    min-height:4.25em!important;
    contain:layout style!important;
    transition:none!important;
    animation:none!important;
  }

  /* iOS already has a busy hero; entrance transforms cause a visible sideways jump. */
  html.is-ios .mobile-flow-step,
  html.is-ios .mobile-flow-step:nth-child(1),
  html.is-ios .mobile-flow-step:nth-child(3),
  html.is-ios .mobile-flow-step:nth-child(5),
  html.is-ios .mobile-flow-step:nth-child(7){
    animation:none!important;
    opacity:1!important;
    transition:none!important;
  }

  /* Keep connector geometry invisible until its first final measurement. */
  html.is-ios .external-stage-connector{
    opacity:0!important;
    transition:none!important;
  }
  html.is-ios.flow-geometry-ready .external-stage-connector{
    opacity:1!important;
  }

  /* Lock every number badge inside the physical right edge of its own card. */
  html:not(.is-android) .mobile-flow-step .flow-number,
  html:not(.is-android) .mobile-flow-step:nth-of-type(odd) .flow-number,
  html:not(.is-android) .mobile-flow-step:nth-of-type(even) .flow-number,
  html[dir="rtl"]:not(.is-android) .mobile-flow-step .flow-number,
  html[dir="rtl"]:not(.is-android) .mobile-flow-step:nth-of-type(odd) .flow-number,
  html[dir="rtl"]:not(.is-android) .mobile-flow-step:nth-of-type(even) .flow-number{
    position:absolute!important;
    top:5px!important;
    right:5px!important;
    left:auto!important;
    bottom:auto!important;
    margin:0!important;
    transform:none!important;
    max-width:22px!important;
    box-sizing:border-box!important;
    z-index:95!important;
  }

  /* Reserve a clean lane so the badge never collides with translated copy. */
  html:not(.is-android) .mobile-flow-step .flow-copy,
  html:not(.is-android) .mobile-flow-step:nth-of-type(even) .flow-copy{
    padding-right:25px!important;
  }
  html[dir="rtl"]:not(.is-android) .mobile-flow-step .flow-copy,
  html[dir="rtl"]:not(.is-android) .mobile-flow-step:nth-of-type(even) .flow-copy{
    padding-right:25px!important;
    padding-left:8px!important;
  }
}
@media (max-width:390px){
  html.is-ios .hero-content .sub{min-height:4.5em!important;}
  html:not(.is-android) .mobile-flow-step .flow-number{right:4px!important;top:4px!important;max-width:20px!important;}
  html:not(.is-android) .mobile-flow-step .flow-copy,
  html[dir="rtl"]:not(.is-android) .mobile-flow-step .flow-copy{padding-right:23px!important;}
}


/* ===== v149 iOS smooth autoplay + image-contained number badges ===== */
@media (max-width:768px){
  /* Momentum scrolling and continuous JS writes compete in Safari and cause micro-shake. */
  html.is-ios .category-wrap,
  html.is-ios .brand-marquee,
  html.is-ios .hero-ticker-viewport{
    -webkit-overflow-scrolling:auto!important;
    scroll-behavior:auto!important;
    scroll-snap-type:none!important;
    overscroll-behavior-x:none!important;
  }

  /* Make the card the hard clipping boundary. */
  html.is-ios .mobile-flow-step{
    position:relative!important;
    overflow:hidden!important;
    isolation:isolate!important;
  }

  /* Badge follows the image side: cards 1/3 image left, cards 2/4 image right. */
  html.is-ios .mobile-flow-step .flow-number,
  html[dir="rtl"].is-ios .mobile-flow-step .flow-number{
    width:22px!important;
    min-width:22px!important;
    max-width:22px!important;
    height:22px!important;
    min-height:22px!important;
    top:6px!important;
    bottom:auto!important;
    margin:0!important;
    transform:none!important;
    z-index:120!important;
    box-sizing:border-box!important;
  }
  html.is-ios .mobile-flow-step:nth-of-type(odd) .flow-number,
  html[dir="rtl"].is-ios .mobile-flow-step:nth-of-type(odd) .flow-number{
    left:6px!important;
    right:auto!important;
  }
  html.is-ios .mobile-flow-step:nth-of-type(even) .flow-number,
  html[dir="rtl"].is-ios .mobile-flow-step:nth-of-type(even) .flow-number{
    right:6px!important;
    left:auto!important;
  }

  /* The old reserved text lane is no longer needed because badges live over images. */
  html.is-ios .mobile-flow-step .flow-copy,
  html[dir="rtl"].is-ios .mobile-flow-step .flow-copy,
  html.is-ios .mobile-flow-step:nth-of-type(even) .flow-copy,
  html[dir="rtl"].is-ios .mobile-flow-step:nth-of-type(even) .flow-copy{
    padding-left:10px!important;
    padding-right:10px!important;
  }
}
@media (max-width:390px){
  html.is-ios .mobile-flow-step .flow-number,
  html[dir="rtl"].is-ios .mobile-flow-step .flow-number{
    width:20px!important;min-width:20px!important;max-width:20px!important;
    height:20px!important;min-height:20px!important;top:5px!important;
  }
  html.is-ios .mobile-flow-step:nth-of-type(odd) .flow-number,
  html[dir="rtl"].is-ios .mobile-flow-step:nth-of-type(odd) .flow-number{left:5px!important;right:auto!important;}
  html.is-ios .mobile-flow-step:nth-of-type(even) .flow-number,
  html[dir="rtl"].is-ios .mobile-flow-step:nth-of-type(even) .flow-number{right:5px!important;left:auto!important;}
}


/* ===== v150 — remove mobile hero card numbers + stable iOS RTL copy alignment ===== */
@media (max-width:768px){
  .mobile-flow-step .flow-number{display:none!important;}

  html.is-ios[dir="rtl"] .mobile-flow-step .flow-copy,
  html.is-ios[dir="rtl"] .mobile-flow-step:nth-of-type(odd) .flow-copy,
  html.is-ios[dir="rtl"] .mobile-flow-step:nth-of-type(even) .flow-copy{
    direction:rtl!important;
    unicode-bidi:plaintext!important;
    text-align:right!important;
    justify-content:center!important;
    align-items:stretch!important;
    padding:9px 11px!important;
    min-width:0!important;
    overflow:hidden!important;
  }
  html.is-ios[dir="rtl"] .mobile-flow-step .flow-copy b,
  html.is-ios[dir="rtl"] .mobile-flow-step .flow-copy small{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin-inline:0!important;
    direction:rtl!important;
    text-align:right!important;
    white-space:normal!important;
    overflow:hidden!important;
  }
  html.is-ios[dir="rtl"] .mobile-flow-step .flow-copy b{
    margin:0 0 4px!important;
    line-height:1.28!important;
    max-height:2.56em!important;
  }
  html.is-ios[dir="rtl"] .mobile-flow-step .flow-copy small{
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
    line-height:1.45!important;
  }
}
@media (max-width:390px){
  html.is-ios[dir="rtl"] .mobile-flow-step .flow-copy,
  html.is-ios[dir="rtl"] .mobile-flow-step:nth-of-type(odd) .flow-copy,
  html.is-ios[dir="rtl"] .mobile-flow-step:nth-of-type(even) .flow-copy{
    padding:8px 9px!important;
  }
}

/* ===== v151 — add safe inner spacing for RTL text on cards 1 and 3 ===== */
@media (max-width:768px){
  html[dir="rtl"] .mobile-flow-step:nth-of-type(odd) .flow-copy{
    padding-right:18px!important;
    padding-left:11px!important;
  }
}
@media (max-width:390px){
  html[dir="rtl"] .mobile-flow-step:nth-of-type(odd) .flow-copy{
    padding-right:16px!important;
    padding-left:9px!important;
  }
}

/* ===== v152 — move iPhone RTL text inward on hero cards 1 and 3 ===== */
@media (max-width:768px){
  html.is-ios[dir="rtl"] .mobile-flow-step:nth-of-type(odd) .flow-copy{
    padding-right:30px!important;
    padding-left:11px!important;
  }
}
@media (max-width:390px){
  html.is-ios[dir="rtl"] .mobile-flow-step:nth-of-type(odd) .flow-copy{
    padding-right:27px!important;
    padding-left:9px!important;
  }
}

/* v157 stable admin control center */
body.admin-v157 .admin-panel{display:none}
body.admin-v157 .admin-section{display:block!important;visibility:visible!important;opacity:1!important;transform:none!important}
body.admin-v157 .admin-tabs{display:none!important}
body.admin-v157 .admin-section-nav{position:sticky;top:8px;z-index:30;display:flex;gap:8px;overflow-x:auto;padding:10px;margin:16px 0 24px;border-radius:16px;background:rgba(7,26,50,.96);backdrop-filter:blur(14px)}
body.admin-v157 .admin-section-nav a{white-space:nowrap;text-decoration:none;padding:9px 12px;border-radius:10px;background:rgba(255,255,255,.08)}
body.admin-v157 .admin-section{scroll-margin-top:92px}
body.admin-v157 [data-admin-comprehensive] [data-site-banner-card]{display:none!important}
body.admin-v157 .studio-savebar{position:sticky;bottom:10px;z-index:20;background:rgba(7,26,50,.95);padding:14px;border-radius:14px;box-shadow:0 12px 35px rgba(0,0,0,.28)}

/* ===== v158 admin sidebar, working responsive hero media and live design variables ===== */
body.admin-v157 .admin-panel{max-width:1500px!important;display:none}
body.admin-v157.admin-ready-v158 .admin-panel{grid-template-columns:270px minmax(0,1fr);column-gap:24px;align-items:start}
body.admin-v157 .admin-dashboard-head{grid-column:1/-1;margin-bottom:18px}
body.admin-v157 .admin-section-nav{grid-column:1;position:sticky!important;top:16px!important;display:flex!important;flex-direction:column!important;gap:8px!important;overflow:visible!important;margin:0!important;padding:12px!important;border:1px solid #d6e3ef!important;border-radius:18px!important;background:#071a32!important;box-shadow:0 18px 55px rgba(7,26,50,.18)}
body.admin-v157 .admin-section-nav button{display:block;width:100%;border:0;border-radius:12px;padding:13px 14px;background:transparent;color:#dbe9f5;text-align:left;font:inherit;font-size:.88rem;font-weight:800;line-height:1.35;cursor:pointer;transition:.18s}
body.admin-v157 .admin-section-nav button:hover{background:rgba(255,255,255,.1);color:#fff}
body.admin-v157 .admin-section-nav button.active{background:#fff;color:#09233f;box-shadow:0 7px 20px rgba(0,0,0,.18)}
body.admin-v157 #main-content>.admin-section{grid-column:2;margin:0!important;display:none!important;visibility:visible!important;opacity:1!important;transform:none!important;min-width:0}
body.admin-v157 #main-content>.admin-section.admin-section-active{display:block!important}
body.admin-v157 [data-cms-tab="banners"],body.admin-v157 [data-cms-panel="banners"],body.admin-v157 [data-site-banner-card]{display:none!important}
body.admin-v157 .responsive-media-card{background:#f7fbff!important;border:1px solid #d7e5f1!important;color:#102033!important}
body.admin-v157 .responsive-media-card small{color:#60758b!important}
body.admin-v157 .design-studio-tabs{position:static!important;background:#071a32!important}
body.admin-v157 .design-pane{color:#102033}
body.admin-v157 .design-control-grid>label,body.admin-v157 .toggle-card,body.admin-v157 .section-order-list article{background:#f7fbff!important;border-color:#d7e5f1!important;color:#102033!important}
body.admin-v157 .toggle-card small{color:#60758b!important}
@media(max-width:900px){body.admin-v157.admin-ready-v158 .admin-panel{display:block!important}body.admin-v157 .admin-section-nav{position:static!important;margin-bottom:16px!important}body.admin-v157 #main-content>.admin-section{width:100%}}

/* The uploaded responsive media is the actual hero image source. */
.hero:before{background-image:linear-gradient(90deg,rgba(4,15,34,.94),rgba(4,15,34,.56),rgba(4,15,34,.8)),var(--cms-hero-image,url('https://images.unsplash.com/photo-1586528116311-ad8dd3c8310d?auto=format&fit=crop&w=2200&q=80'))!important;background-position:var(--cms-bg-position,center)!important}
@media(min-width:768px){.hero{min-height:var(--hero-min-desktop,760px)!important}.hero .headline,.hero .hero-title{font-size:var(--hero-title-desktop,64px)!important}.section-head .title,.section-title,h2.section-title{font-size:var(--section-title-desktop,48px)!important}}
@media(max-width:767px){.hero{min-height:var(--hero-min-mobile,720px)!important;padding-top:var(--mobile-header-offset,84px)!important}.hero .headline,.hero .hero-title{font-size:var(--hero-title-mobile,38px)!important}.section-head .title,.section-title,h2.section-title{font-size:var(--section-title-mobile,32px)!important}}
section{padding-top:var(--cms-section-gap,96px);padding-bottom:var(--cms-section-gap,96px)}
.cat-card,.brand-marquee,.form-card,.photo-stack,.dist-map,.responsive-media-card{border-radius:var(--cms-radius,24px)!important}
body.cms-no-motion *,body.cms-no-motion *::before,body.cms-no-motion *::after{animation:none!important;transition:none!important}
body.cms-no-reveal .reveal,body.cms-no-reveal [data-reveal]{opacity:1!important;transform:none!important}

/* ===== v159 unified admin save and brand manager ===== */
.admin-global-actions{margin-inline-start:auto;display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end}.admin-global-save{position:sticky;top:12px;z-index:40;min-width:190px;box-shadow:0 12px 30px rgba(0,0,0,.18)}[data-global-admin-status]{font-weight:800;color:#0f766e;min-height:1.4em}.v159-local-save-hidden{display:none!important}.brand-channel-settings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:18px}.brand-channel-settings article{padding:18px;border:1px solid #d9e4ef;border-radius:18px;background:#f8fbff;display:grid;gap:12px}.brand-channel-settings label{display:grid;gap:7px;font-weight:700}.brand-manager-toolbar{display:flex;align-items:center;gap:14px;justify-content:space-between;margin:16px 0}.brand-manager-list{display:grid;gap:14px}.admin-brand-row.admin-brand-rich{display:grid;grid-template-columns:100px minmax(160px,1fr) minmax(180px,1fr);gap:14px;align-items:end;padding:16px;border:1px solid #d9e4ef;border-radius:18px;background:#fff}.brand-logo-preview{width:88px;height:72px;border:1px dashed #b7c8da;border-radius:14px;background:#f7fafc;display:grid;place-items:center;overflow:hidden}.brand-logo-preview img{width:100%;height:100%;object-fit:contain}.brand-logo-preview span{font-size:12px;color:#64748b}.admin-brand-row .admin-checks{grid-column:2/-1}.admin-danger-button{border:1px solid #fecaca;background:#fff1f2;color:#be123c;border-radius:10px;padding:10px 14px;font-weight:800;cursor:pointer}.responsive-preview{background-color:#e9f0f7;background-repeat:no-repeat;background-size:cover;background-position:center}.cms-subpanel[data-cms-panel="images"] .cms-page-group:empty{display:none}@media(max-width:900px){.brand-channel-settings{grid-template-columns:1fr}.admin-brand-row.admin-brand-rich{grid-template-columns:90px 1fr}.admin-brand-row.admin-brand-rich>label:nth-of-type(2){grid-column:1/-1}.admin-global-actions{width:100%;justify-content:flex-start}.admin-global-save{position:static}.brand-manager-toolbar{align-items:flex-start;flex-direction:column}}


/* ===== v160 deterministic admin UI ===== */
body.admin-v157.admin-ui-loading .admin-panel{visibility:hidden!important;opacity:0!important}
body.admin-v157.admin-ui-ready .admin-panel{visibility:visible!important;opacity:1!important;display:grid!important;grid-template-columns:270px minmax(0,1fr)!important;column-gap:24px!important;align-items:start!important}
body.admin-v157 .admin-dashboard-head{grid-column:1/-1!important;display:flex!important;align-items:flex-start!important;gap:24px!important}
body.admin-v157 .admin-head-actions{margin-inline-start:auto;display:grid;grid-template-columns:auto auto;align-items:center;gap:12px;justify-items:end}
body.admin-v157 .admin-head-actions [data-global-admin-status]{grid-column:1/-1;max-width:380px;text-align:right}
body.admin-v157 .admin-global-actions{display:none!important}
body.admin-v157 .cms-savebar,body.admin-v157 .studio-savebar,body.admin-v157 [data-cms-save],body.admin-v157 [data-save-studio],body.admin-v157 [data-psave],body.admin-v157 [data-save-dist],body.admin-v157 [data-save-site],body.admin-v157 [data-bsave]{display:none!important}
body.admin-v157 .admin-section-nav{grid-column:1!important;position:sticky!important;top:16px!important;display:flex!important;flex-direction:column!important;gap:8px!important;overflow:visible!important;background:#071a32!important;color:#fff!important}
body.admin-v157 .admin-section-nav button{display:block!important;width:100%!important;background:rgba(255,255,255,.08)!important;color:#eaf3fb!important;border:1px solid transparent!important;text-align:left!important}
body.admin-v157 .admin-section-nav button:hover{background:rgba(255,255,255,.16)!important;color:#fff!important}
body.admin-v157 .admin-section-nav button.active{background:#fff!important;color:#071a32!important;border-color:#fff!important}
body.admin-v157 #main-content>.admin-section{grid-column:2!important;display:none!important}
body.admin-v157 #main-content>.admin-section.admin-section-active{display:block!important}
body.admin-v157 .responsive-preview{display:block!important;min-height:150px!important;background-color:#e7eef5!important;background-size:cover!important;background-position:center!important;border:1px solid #cbd9e7!important}
body.admin-v157 .responsive-preview.mobile{min-height:190px!important}
@media(max-width:900px){body.admin-v157.admin-ui-ready .admin-panel{display:block!important}body.admin-v157 .admin-head-actions{width:100%;grid-template-columns:1fr 1fr;margin:0}body.admin-v157 .admin-dashboard-head{flex-wrap:wrap!important}body.admin-v157 .admin-section-nav{position:static!important;margin-bottom:18px!important}body.admin-v157 #main-content>.admin-section{width:100%!important}}

/* ===== v161 deterministic admin interaction ===== */
body.admin-v157 .admin-section-nav button{color:#fff!important;background:#1a324e!important;border:1px solid rgba(255,255,255,.08)!important;cursor:pointer!important;pointer-events:auto!important}
body.admin-v157 .admin-section-nav button:hover{background:#244565!important}
body.admin-v157 .admin-section-nav button.active{color:#071a32!important;background:#fff!important;border-color:#fff!important}
body.admin-v157 #main-content>.admin-section[hidden]{display:none!important}
body.admin-v157 #main-content>.admin-section.admin-section-active{display:block!important}
body.admin-v157 .responsive-preview{background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;overflow:hidden}
body.admin-v157 .responsive-preview.has-image{background-color:#dce8f2!important}
body.admin-v157 .admin-head-actions{display:flex!important;align-items:flex-start!important;gap:12px!important;flex-wrap:wrap!important}
body.admin-v157 [data-global-admin-status]{flex-basis:100%;text-align:right;min-height:22px;font-weight:800}
body.admin-v157 [data-global-admin-status].success{color:#087a5b!important}
body.admin-v157 [data-global-admin-status].error{color:#b42318!important}
body.admin-v157 [data-global-admin-status].saving{color:#005f8f!important}

/* ===== v162 fixed admin notifications and responsive media previews ===== */
body.admin-v157 [data-global-admin-status]{
  position:fixed!important;
  inline-size:1px!important;
  block-size:1px!important;
  overflow:hidden!important;
  clip-path:inset(50%)!important;
  white-space:nowrap!important;
  margin:0!important;
  padding:0!important;
}
.admin-toast{
  position:fixed;
  top:22px;
  right:22px;
  z-index:99999;
  max-width:min(420px,calc(100vw - 32px));
  padding:14px 18px;
  border-radius:14px;
  background:#071a32;
  color:#fff;
  font-weight:800;
  line-height:1.4;
  box-shadow:0 18px 55px rgba(4,18,37,.28);
  opacity:0;
  transform:translateY(-12px);
  pointer-events:none;
  transition:opacity .2s ease,transform .2s ease;
}
.admin-toast.show{opacity:1;transform:translateY(0)}
.admin-toast.success{background:#087f5b}
.admin-toast.error{background:#b42318}
.admin-toast.info{background:#071a32}
body.admin-v157 .responsive-preview{
  position:relative;
  background-color:#e7eef5!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  background-size:cover!important;
}
body.admin-v157 .responsive-preview:not(.has-image)::after{
  content:'No image selected';
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  color:#64748b;
  font-size:13px;
  font-weight:700;
}
body.admin-v157 .responsive-preview.has-image::after{display:none}
@media(max-width:700px){.admin-toast{top:12px;right:12px;left:12px;max-width:none}}

/* ===== v163 motion/layout reset controls ===== */
.design-pane-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:0 0 18px;padding:15px 17px;border:1px solid #cfe0ed;border-radius:16px;background:#f4f9fc;color:#071a32}
.design-pane-toolbar>div{display:grid;gap:3px}.design-pane-toolbar strong{font-size:15px}.design-pane-toolbar small{color:#53687d;font-size:12px;line-height:1.45}
.admin-reset-button{appearance:none;border:1px solid #a9bfd0;background:#fff;color:#071a32;border-radius:12px;padding:10px 15px;font-weight:800;cursor:pointer;white-space:nowrap;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.admin-reset-button:hover{transform:translateY(-1px);border-color:#17b8c9;box-shadow:0 8px 20px rgba(7,26,50,.10)}
.admin-reset-button:focus-visible{outline:3px solid rgba(23,184,201,.25);outline-offset:2px}
@media(max-width:640px){.design-pane-toolbar{align-items:flex-start;flex-direction:column}.admin-reset-button{width:100%}}

/* v164: CMS-disabled mobile hero cards and their decorative connectors */
.mobile-flow-step.is-cms-disabled,.external-stage-connector.is-cms-disabled{display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important;}


/* v168: stable hero stats — cards never replay their entrance animation. */
.hero-glass-stats .stat{opacity:1!important;transform:none!important;animation:none!important;}

/* v169 admin media controls */
.admin-remove-media{width:100%;margin-top:8px}
.dynamic-gallery-admin-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.dynamic-gallery-row .cms-image-preview{width:100%;height:160px;object-fit:cover;border-radius:14px;background:rgba(255,255,255,.04)}
.dynamic-gallery-row .admin-danger-button{width:100%;margin-top:8px}

/* v171 */
html.wholesale-entry-pending body{visibility:hidden}
body.cms-banner-explicitly-empty .hero:before{background-image:linear-gradient(90deg,rgba(4,15,34,.94),rgba(4,15,34,.56),rgba(4,15,34,.8))!important}
body.cms-banner-explicitly-empty .page-hero,body.cms-banner-explicitly-empty .inner-hero,body.cms-banner-explicitly-empty [data-page-bg]{background-image:none!important}
#wholesale{scroll-margin-top:110px}

/* v173 — deleted responsive banners keep the site's navy canvas */
body.cms-banner-explicitly-empty [data-page-bg],
body.cms-banner-explicitly-empty .page-hero,
body.cms-banner-explicitly-empty .inner-hero,
body.cms-banner-explicitly-empty .hero{
  background-color:var(--navy,#071a32)!important;
  background-image:none!important;
}
body.cms-banner-explicitly-empty [data-page-bg]::before,
body.cms-banner-explicitly-empty .page-hero::before,
body.cms-banner-explicitly-empty .inner-hero::before{
  background-image:none!important;
}
html.wholesale-entry-pending body{visibility:hidden!important}

/* v174 removed banner keeps the original navy canvas; wholesale entry is hidden until its final position is locked. */
body.cms-banner-explicitly-empty .page-hero,body.cms-banner-explicitly-empty .inner-hero,body.cms-banner-explicitly-empty [data-page-bg]{background-color:var(--navy,#071a32)!important;background-image:none!important}
html.wholesale-entry-pending body{visibility:hidden!important}


/* v175 — universal empty-banner canvas and cheaper below-the-fold rendering */
body.cms-banner-explicitly-empty .hero,
body.cms-banner-explicitly-empty .page-hero,
body.cms-banner-explicitly-empty .inner-hero,
body.cms-banner-explicitly-empty [data-page-bg]{
 background-color:var(--navy,#071a32)!important;
 background-image:none!important;
}
body.cms-banner-explicitly-empty .hero::before,
body.cms-banner-explicitly-empty .page-hero::before,
body.cms-banner-explicitly-empty .inner-hero::before,
body.cms-banner-explicitly-empty [data-page-bg]::before{background-image:none!important}
@supports(content-visibility:auto){
 main>section:not(:first-child){content-visibility:auto;contain-intrinsic-size:auto 760px}
 footer{content-visibility:auto;contain-intrinsic-size:auto 520px}
}


/* v180 — one deterministic banner renderer for desktop and mobile. */
:root{--cms-banner-color:#071a32;--cms-banner-layer:none;--cms-hero-image:none;--cms-bg-position:center center}
.page-hero,.inner-hero,[data-page-bg]{
  background-color:var(--cms-banner-color)!important;
  background-image:var(--cms-banner-layer)!important;
  background-size:cover!important;
  background-position:var(--cms-bg-position)!important;
  background-repeat:no-repeat!important;
}
.hero{background-color:var(--cms-banner-color)!important}
.hero::before{
  background-image:linear-gradient(90deg,rgba(4,15,34,.94),rgba(4,15,34,.56),rgba(4,15,34,.8)),var(--cms-hero-image)!important;
  background-size:cover!important;
  background-position:var(--cms-bg-position)!important;
  background-repeat:no-repeat!important;
}
html.bs-banner-empty .page-hero,html.bs-banner-empty .inner-hero,html.bs-banner-empty [data-page-bg]{background-image:none!important}
html.bs-banner-empty .hero::before{background-image:linear-gradient(90deg,rgba(4,15,34,.94),rgba(4,15,34,.56),rgba(4,15,34,.8))!important}


/* v181 — definitive banner rendering. Historical banner selectors cannot override this block. */
:root{
 --bs-banner-color:#071a32;
 --bs-banner-position:center center;
 --bs-page-banner-background:none;
 --bs-home-banner-background:linear-gradient(90deg,rgba(4,15,34,.96),rgba(4,15,34,.82),rgba(4,15,34,.92));
}
html body[data-cms-page] .page-hero,
html body[data-cms-page] .inner-hero,
html body[data-cms-page] [data-page-bg]{
 background-color:var(--bs-banner-color)!important;
 background-image:var(--bs-page-banner-background)!important;
 background-size:cover!important;
 background-position:var(--bs-banner-position)!important;
 background-repeat:no-repeat!important;
 transition:none!important;
}
html body[data-cms-page="index"] .hero{
 background-color:var(--bs-banner-color)!important;
 transition:none!important;
}
html body[data-cms-page="index"] .hero::before{
 background-image:var(--bs-home-banner-background)!important;
 background-size:cover!important;
 background-position:var(--bs-banner-position)!important;
 background-repeat:no-repeat!important;
 transition:none!important;
}
html.bs-no-banner body[data-cms-page] .page-hero,
html.bs-no-banner body[data-cms-page] .inner-hero,
html.bs-no-banner body[data-cms-page] [data-page-bg]{
 background-color:var(--bs-banner-color)!important;
 background-image:none!important;
}

/* v183 — final banner paint layer. This is the only visible banner layer. */
:root{
  --v183-banner-color:#071a32;
  --v183-banner-position:center center;
  --v183-page-banner:none;
  --v183-home-banner:linear-gradient(90deg,rgba(4,15,34,.96),rgba(4,15,34,.82),rgba(4,15,34,.92));
}
html body[data-cms-page] .page-hero,
html body[data-cms-page] .inner-hero,
html body[data-cms-page] [data-page-bg]{
  background-color:var(--v183-banner-color)!important;
  background-image:var(--v183-page-banner)!important;
  background-position:var(--v183-banner-position)!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  transition:none!important;
}
html body[data-cms-page="index"] .hero{
  background-color:var(--v183-banner-color)!important;
}
html body[data-cms-page="index"] .hero::before{
  background-image:var(--v183-home-banner)!important;
  background-position:var(--v183-banner-position)!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  transition:none!important;
  animation:none!important;
  transform:none!important;
}
html.v183-banner-empty body[data-cms-page] .page-hero,
html.v183-banner-empty body[data-cms-page] .inner-hero,
html.v183-banner-empty body[data-cms-page] [data-page-bg]{background-image:none!important}

/* v184 — authoritative responsive banner paint; no legacy class can suppress it. */
:root{
  --final-banner-color:#071a32;
  --final-banner-position:center center;
  --final-page-banner:none;
  --final-home-banner:linear-gradient(90deg,rgba(4,15,34,.96),rgba(4,15,34,.82),rgba(4,15,34,.92));
}
html body[data-cms-page] .page-hero,
html body[data-cms-page] .inner-hero,
html body[data-cms-page] [data-page-bg]{
  background-color:var(--final-banner-color)!important;
  background-image:var(--final-page-banner)!important;
  background-position:var(--final-banner-position)!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  transition:none!important;
}
html body[data-cms-page="index"] .hero{background-color:var(--final-banner-color)!important}
html body[data-cms-page="index"] .hero::before{
  background-image:var(--final-home-banner)!important;
  background-position:var(--final-banner-position)!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  transition:none!important;
  animation:none!important;
  transform:none!important;
}

/* v185 — the selected responsive image is always painted on the visible banner layer. */
html[data-final-banner="image"] body[data-cms-page] .page-hero,
html[data-final-banner="image"] body[data-cms-page] .inner-hero,
html[data-final-banner="image"] body[data-cms-page] [data-page-bg]{
  background-image:var(--final-page-banner)!important;
}
html[data-final-banner="image"] body[data-cms-page="index"] .hero::before{
  content:""!important;
  display:block!important;
  opacity:1!important;
  visibility:visible!important;
  background-image:var(--final-home-banner)!important;
}


/* v186: home image lives on .hero; this pseudo-element is overlay only. */
html[data-final-banner="image"] body[data-cms-page="index"] .hero::before{
  background-image:linear-gradient(90deg,rgba(4,15,34,.85),rgba(4,15,34,.45),rgba(4,15,34,.70))!important;
  background-color:transparent!important;
}


/* ===== v196 real-device banners on every page + mobile typography spacing ===== */
@media (max-width:767px){
  /* Business name in the mobile header. */
  html body .nav .brand-title{
    font-size:12.5px!important;
    line-height:1.15!important;
    letter-spacing:0!important;
  }

  /* Hero and Distribution CTA labels were too small on physical phones. */
  html body .hero .btn,
  html body .editable-distribution .btn,
  html body .distribution-cta .btn{
    font-size:14px!important;
    line-height:1.2!important;
    padding:13px 17px!important;
  }

  /* Give the hero title/subtitle/buttons more breathing room above the cards. */
  html body[data-cms-page="index"] .hero-content{
    transform:translateY(-24px)!important;
  }
  html body[data-cms-page="index"] .headline{
    margin-bottom:14px!important;
  }
  html body[data-cms-page="index"] .sub{
    margin-bottom:0!important;
  }
  html body[data-cms-page="index"] .cta-row{
    margin-top:20px!important;
  }
}

@media (max-width:420px){
  html body .nav .brand-title{font-size:11.8px!important}
  html body .hero .btn,
  html body .editable-distribution .btn,
  html body .distribution-cta .btn{font-size:13.5px!important}
  html body[data-cms-page="index"] .hero-content{transform:translateY(-20px)!important}
}

/* ===== v197 final mobile hero spacing adjustment ===== */
@media (max-width:767px){
  html body[data-cms-page="index"] .hero-content{transform:translateY(-30px)!important}
}
@media (max-width:420px){
  html body[data-cms-page="index"] .hero-content{transform:translateY(-26px)!important}
}


/* V201 — unified GPU marquee motion and stable first frame */
.category-wrap:not(.portfolio-products),
.brand-marquee:not(.portfolio-brands),
.hero-ticker-viewport{
  overflow:hidden!important;
  contain:layout paint!important;
}
.cat-track,.brand-track,.hero-brand-track{
  animation:none!important;
  transition:none!important;
  transform:translate3d(0,0,0);
  will-change:transform!important;
  backface-visibility:hidden!important;
  -webkit-backface-visibility:hidden!important;
  perspective:1000px!important;
}
.cat-track>* ,.brand-track>* ,.hero-brand-track>*{
  transform:translateZ(0);
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}
.category-wrap.is-dragging .cat-card,
.brand-marquee.is-dragging .brand-pill,
.hero-ticker-viewport.is-dragging .hero-brand-item{pointer-events:none!important}
.mobile-flow-step .flow-thumb{background:#0a2544;overflow:hidden}
.mobile-flow-step .flow-thumb img{width:100%;height:100%;object-fit:cover;opacity:1!important}


/* ===== v203 stable hero cards + smooth autoplay rails ===== */
.mobile-flow-step,.mobile-flow-step:nth-child(1),.mobile-flow-step:nth-child(3),.mobile-flow-step:nth-child(5),.mobile-flow-step:nth-child(7),
.supply-tile,.route-chip{animation:none!important;transition:none!important;opacity:1!important;visibility:visible!important;}
.mobile-flow-step .flow-thumb img{opacity:1!important;animation:none!important;transition:none!important;transform:none!important;}
.hero-brand-track,.cat-track,.brand-track{animation:none!important;transition:none!important;will-change:transform!important;backface-visibility:hidden!important;transform-style:preserve-3d!important;}
.hero-ticker-viewport,.category-wrap,.brand-marquee,.brand-showcase-marquee{overflow:hidden!important;contain:layout paint;}


/* ===== v204 verified autoplay layout ===== */
.hero-ticker-viewport,
body[data-cms-page="index"] .category-wrap,
body[data-cms-page="index"] .brand-marquee:not(.portfolio-brands),
body[data-cms-page="products"] .portfolio-products{
  overflow:hidden!important;
  touch-action:pan-y pinch-zoom!important;
}
.hero-brand-track,
body[data-cms-page="index"] .cat-track,
body[data-cms-page="index"] .brand-marquee:not(.portfolio-brands) .brand-track,
body[data-cms-page="products"] .portfolio-products .cat-track{
  display:flex!important;
  flex-wrap:nowrap!important;
  width:max-content!important;
  min-width:max-content!important;
  grid-template-columns:none!important;
  animation:none!important;
  transition:none!important;
  will-change:transform!important;
  transform:translate3d(0,0,0);
}
body[data-cms-page="products"] .portfolio-products{
  width:100%!important;
  max-width:100%!important;
  cursor:grab!important;
}
body[data-cms-page="products"] .portfolio-products .cat-card{
  flex:0 0 clamp(260px,31vw,430px)!important;
  width:clamp(260px,31vw,430px)!important;
  min-width:clamp(260px,31vw,430px)!important;
  animation:none!important;
}
@media(max-width:600px){
  body[data-cms-page="products"] .portfolio-products .cat-card{
    flex-basis:78vw!important;width:78vw!important;min-width:78vw!important;height:310px!important;
  }
}


/* ===== v206 authoritative rail interaction + immediate hero banner ===== */
body[data-cms-page="index"] .hero:before{
  background-image:var(--final-home-banner)!important;
  background-color:var(--final-banner-color,#071a32)!important;
  background-position:var(--final-banner-position,center center)!important;
}
.hero-ticker-viewport,
body[data-cms-page="index"] .category-wrap,
body[data-cms-page="products"] .portfolio-products,
body[data-cms-page="index"] .brand-marquee:not(.portfolio-brands){
  overflow:hidden!important;
  cursor:grab!important;
  touch-action:pan-y pinch-zoom!important;
  user-select:none;
}
.hero-ticker-viewport.is-dragging,
body[data-cms-page="index"] .category-wrap.is-dragging,
body[data-cms-page="products"] .portfolio-products.is-dragging,
body[data-cms-page="index"] .brand-marquee.is-dragging{cursor:grabbing!important}
.hero-brand-track,
body[data-cms-page="index"] .cat-track,
body[data-cms-page="products"] .portfolio-products .cat-track,
body[data-cms-page="index"] .brand-marquee:not(.portfolio-brands) .brand-track{
  animation:none!important;transition:none!important;display:flex!important;flex-wrap:nowrap!important;
  width:max-content!important;min-width:max-content!important;will-change:transform!important;
  backface-visibility:hidden!important;-webkit-backface-visibility:hidden!important;
}


/* ===== v207 stable connector first paint + faster hero cards ===== */
.mobile-flow-step,.mobile-flow-step:nth-child(1),.mobile-flow-step:nth-child(3),.mobile-flow-step:nth-child(5),.mobile-flow-step:nth-child(7){animation:none!important;transition:none!important;opacity:1!important;visibility:visible!important;}
.mobile-flow-step .flow-thumb img{display:block!important;opacity:1!important;animation:none!important;transition:none!important;}
@media(max-width:768px){
  html:not(.flow-geometry-ready) .external-stage-connector{opacity:0!important;visibility:hidden!important;}
  html.flow-geometry-ready .external-stage-connector{opacity:1!important;visibility:visible!important;transition:none!important;}
  .external-stage-connector,.external-stage-connector::after{animation:none!important;transition:none!important;}
}
\n\n/* ===== v208 viewport counters + restored Products grid ===== */\nbody[data-cms-page="products"] .portfolio-products{\n  overflow:visible!important;\n  cursor:default!important;\n  touch-action:auto!important;\n  user-select:auto!important;\n  contain:none!important;\n}\nbody[data-cms-page="products"] .portfolio-products .cat-track{\n  display:grid!important;\n  grid-template-columns:repeat(3,minmax(0,1fr))!important;\n  gap:18px!important;\n  width:100%!important;\n  min-width:0!important;\n  transform:none!important;\n  will-change:auto!important;\n  flex-wrap:initial!important;\n}\nbody[data-cms-page="products"] .portfolio-products .cat-card{\n  width:100%!important;\n  min-width:0!important;\n  max-width:none!important;\n  flex:none!important;\n  height:360px!important;\n}\n@media(max-width:900px){\n  body[data-cms-page="products"] .portfolio-products .cat-track{\n    grid-template-columns:repeat(2,minmax(0,1fr))!important;\n    gap:14px!important;\n  }\n}\n@media(max-width:600px){\n  body[data-cms-page="products"] .portfolio-products .cat-track{\n    grid-template-columns:repeat(2,minmax(0,1fr))!important;\n    gap:10px!important;\n  }\n  body[data-cms-page="products"] .portfolio-products .cat-card{\n    height:245px!important;\n    min-width:0!important;\n    width:100%!important;\n  }\n  body[data-cms-page="products"] .portfolio-products .cat-card .cap{padding:14px!important}\n  body[data-cms-page="products"] .portfolio-products .cat-card h3{font-size:16px!important}\n  body[data-cms-page="products"] .portfolio-products .cat-card p{font-size:11px!important}\n}\n
/* ===== v209 Products: dynamic 5-column desktop / 2-column mobile grid ===== */
body[data-cms-page="products"] .portfolio-products{
  overflow:visible!important;
  cursor:default!important;
  touch-action:auto!important;
  user-select:auto!important;
  contain:none!important;
}
body[data-cms-page="products"] .portfolio-products .cat-track{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:16px!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  transform:none!important;
  animation:none!important;
  transition:none!important;
  will-change:auto!important;
}
body[data-cms-page="products"] .portfolio-products .product-card-link{
  display:block!important;
  min-width:0!important;
}
body[data-cms-page="products"] .portfolio-products .cat-card{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  height:auto!important;
  aspect-ratio:4/5!important;
  flex:none!important;
  margin:0!important;
}
body[data-cms-page="products"] .portfolio-products .cat-card img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}
@media(max-width:900px){
  body[data-cms-page="products"] .portfolio-products .cat-track{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  body[data-cms-page="products"] .portfolio-products .cat-card{
    aspect-ratio:4/5!important;
  }
  body[data-cms-page="products"] .portfolio-products .cat-card .cap{padding:12px!important}
  body[data-cms-page="products"] .portfolio-products .cat-card h3{font-size:15px!important;line-height:1.25!important}
  body[data-cms-page="products"] .portfolio-products .cat-card p{font-size:11px!important;line-height:1.35!important}
}
.admin-products-toolbar{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.admin-product-actions{display:flex;gap:10px;flex-wrap:wrap}
.admin-danger-button{border:1px solid rgba(255,90,90,.55);background:rgba(130,20,30,.18);color:#ffd9dc;border-radius:10px;padding:10px 14px;cursor:pointer}


/* V210 — unified, responsive brand-logo rendering */
.brand-pill.logo,
.brand-pill.logo-pill,
.hero-brand-item.logo,
.hero-brand-item.logo-pill{
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  background:#fff!important;
  padding:10px 14px!important;
}
.brand-pill.logo,
.brand-pill.logo-pill{
  flex:0 0 170px!important;
  width:170px!important;
  min-width:170px!important;
  max-width:170px!important;
  height:86px!important;
  min-height:86px!important;
  max-height:86px!important;
  border-radius:24px!important;
}
.hero-brand-item.logo,
.hero-brand-item.logo-pill{
  flex:0 0 92px!important;
  width:92px!important;
  min-width:92px!important;
  max-width:92px!important;
  height:44px!important;
  min-height:44px!important;
  max-height:44px!important;
  border-radius:16px!important;
  padding:6px 10px!important;
}
.brand-pill.logo img,
.brand-pill.logo-pill img,
.hero-brand-item.logo img,
.hero-brand-item.logo-pill img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}
.brand-link{display:inline-flex!important;flex:0 0 auto!important}
.brand-link>.brand-pill{height:86px!important}
.brand-link>.hero-brand-item{height:44px!important}
@media(max-width:560px){
  .brand-pill.logo,
  .brand-pill.logo-pill{
    flex-basis:132px!important;
    width:132px!important;
    min-width:132px!important;
    max-width:132px!important;
    height:68px!important;
    min-height:68px!important;
    max-height:68px!important;
    padding:8px 10px!important;
    border-radius:19px!important;
  }
  .hero-brand-item.logo,
  .hero-brand-item.logo-pill{
    flex-basis:76px!important;
    width:76px!important;
    min-width:76px!important;
    max-width:76px!important;
    height:30px!important;
    min-height:30px!important;
    max-height:30px!important;
    padding:4px 7px!important;
    border-radius:11px!important;
  }
  .brand-link>.brand-pill{height:68px!important}
  .brand-link>.hero-brand-item{height:30px!important}
}

/* ===== V211 — equal brand-card geometry + mobile-safe logo display ===== */
.brand-pill,.hero-brand-item,.brand-link{
  box-sizing:border-box!important;
  min-width:0;
}
.brand-pill img,.hero-brand-item img{
  visibility:visible!important;
  opacity:1!important;
}
/* Products brand wall is a fixed equal grid, never content-sized. */
body[data-cms-page="products"] .portfolio-brands{
  overflow:visible!important;
}
body[data-cms-page="products"] .portfolio-brands .brand-track{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:14px!important;
  width:100%!important;
  min-width:0!important;
  transform:none!important;
  will-change:auto!important;
}
body[data-cms-page="products"] .portfolio-brands .brand-link{
  display:block!important;
  width:100%!important;
  min-width:0!important;
}
body[data-cms-page="products"] .portfolio-brands .brand-pill,
body[data-cms-page="products"] .portfolio-brands .brand-pill.logo,
body[data-cms-page="products"] .portfolio-brands .brand-pill.logo-pill{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  height:86px!important;
  min-height:86px!important;
  max-height:86px!important;
  padding:12px 16px!important;
  overflow:hidden!important;
}
body[data-cms-page="products"] .portfolio-brands .brand-pill img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:132px!important;
  max-height:56px!important;
  object-fit:contain!important;
  object-position:center!important;
}
/* Home marquee keeps equal rails whether the item is text or logo. */
body[data-cms-page="index"] .brand-marquee:not(.portfolio-brands) .brand-pill,
body[data-cms-page="index"] .brand-marquee:not(.portfolio-brands) .brand-pill.logo,
body[data-cms-page="index"] .brand-marquee:not(.portfolio-brands) .brand-pill.logo-pill{
  flex:0 0 170px!important;
  width:170px!important;
  min-width:170px!important;
  max-width:170px!important;
  height:86px!important;
}
/* Hero ticker keeps the same pill width for names and logos. */
.hero-brand-item,
.hero-brand-item.logo,
.hero-brand-item.logo-pill{
  flex:0 0 112px!important;
  width:112px!important;
  min-width:112px!important;
  max-width:112px!important;
  height:31px!important;
  min-height:31px!important;
  max-height:31px!important;
  padding:4px 10px!important;
}
.hero-brand-item img{
  width:100%!important;
  height:100%!important;
  max-width:88px!important;
  max-height:23px!important;
  object-fit:contain!important;
}
@media(max-width:760px){
  body[data-cms-page="products"] .portfolio-brands .brand-track{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
  }
  body[data-cms-page="products"] .portfolio-brands .brand-pill,
  body[data-cms-page="products"] .portfolio-brands .brand-pill.logo,
  body[data-cms-page="products"] .portfolio-brands .brand-pill.logo-pill{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:72px!important;
    min-height:72px!important;
    max-height:72px!important;
    padding:9px 12px!important;
  }
  body[data-cms-page="products"] .portfolio-brands .brand-pill img{
    max-width:118px!important;
    max-height:48px!important;
  }
  body[data-cms-page="index"] .brand-marquee:not(.portfolio-brands) .brand-pill,
  body[data-cms-page="index"] .brand-marquee:not(.portfolio-brands) .brand-pill.logo,
  body[data-cms-page="index"] .brand-marquee:not(.portfolio-brands) .brand-pill.logo-pill{
    flex-basis:132px!important;
    width:132px!important;
    min-width:132px!important;
    max-width:132px!important;
    height:68px!important;
  }
  .hero-brand-item,.hero-brand-item.logo,.hero-brand-item.logo-pill{
    flex-basis:84px!important;
    width:84px!important;
    min-width:84px!important;
    max-width:84px!important;
    height:28px!important;
    min-height:28px!important;
    max-height:28px!important;
    padding:3px 7px!important;
  }
  .hero-brand-item img{max-width:68px!important;max-height:20px!important}
}

/* ===== V213 — real-device brand logo integrity ===== */
.brand-pill.brand-logo-unavailable,
.hero-brand-item.brand-logo-unavailable{
  color:transparent!important;
}
.brand-pill.brand-logo-unavailable img,
.hero-brand-item.brand-logo-unavailable img{
  display:none!important;
}

/* V216 — real-mobile standalone logo endpoint */
.brand-pill.logo img,.brand-pill.logo-pill img,.hero-brand-item.logo img,.hero-brand-item.logo-pill img{content-visibility:visible!important;transform:translateZ(0);-webkit-transform:translateZ(0);}


/* ===== V217 — stable brand logos + one scroll owner ===== */
.brand-pill.logo img,.hero-brand-item.logo img{opacity:1!important;visibility:visible!important;background:transparent!important}
.brand-pill.brand-logo-unavailable,.hero-brand-item.brand-logo-unavailable{display:none!important}
.brand-track,.hero-brand-track{animation:none!important;transition:none!important}
.brand-marquee:not(.portfolio-brands),.hero-ticker-viewport{overflow:hidden!important}


/* ===== V218 — complete brand visibility + stable first paint ===== */
.brand-pill.brand-logo-unavailable,.hero-brand-item.brand-logo-unavailable{display:flex!important}
.brand-pill.brand-logo-fallback-name,.hero-brand-item.brand-logo-fallback-name{
  display:flex!important;align-items:center!important;justify-content:center!important;
  color:#071a32!important;background:#fff!important;font-weight:800!important;text-align:center!important;
}
.brand-track,.hero-brand-track{contain:layout paint!important}
.hero-brand-item,.hero-brand-item.logo,.hero-brand-item.logo-pill{flex-shrink:0!important}
.brand-pill,.brand-pill.logo,.brand-pill.logo-pill{flex-shrink:0!important}

/* V219 brand logo and seamless-loop stability */
.hero-brand-item,.brand-pill{box-sizing:border-box;overflow:hidden;flex-shrink:0}
.hero-brand-item.logo,.hero-brand-item.logo-pill{width:170px;min-width:170px;flex-basis:170px}
.brand-pill.logo,.brand-pill.logo-pill{width:170px;min-width:170px;flex-basis:170px}
.hero-brand-item.logo img,.brand-pill.logo img{width:100%;height:100%;max-width:138px;max-height:62px;object-fit:contain;margin:auto}
.brand-logo-pending{color:transparent!important}
.brand-track,.hero-brand-track{transform:translate3d(0,0,0);contain:layout style;}
@media(max-width:700px){
 .hero-brand-item.logo,.hero-brand-item.logo-pill{width:150px;min-width:150px;flex-basis:150px}
 .brand-pill.logo,.brand-pill.logo-pill{width:145px;min-width:145px;flex-basis:145px}
}


/* ===== V222 — brand controls, links, clean home rail, seamless first paint ===== */
body[data-cms-page="index"] .brand-marquee:not(.portfolio-brands){
  background:transparent!important;
  background-image:none!important;
  border:0!important;
  box-shadow:none!important;
  padding-inline:0!important;
  border-radius:0!important;
}
.brand-link{
  position:relative!important;
  z-index:2!important;
  pointer-events:auto!important;
  cursor:pointer!important;
  text-decoration:none!important;
}
.brand-link .brand-pill,.brand-link .hero-brand-item{pointer-events:auto!important}
.hero-brand-track,.brand-track{
  opacity:1!important;
  visibility:visible!important;
  contain:layout style!important;
  transform:translate3d(0,0,0);
}
.hero-ticker-viewport,.brand-marquee{min-height:1px}
.hero-brand-item img,.brand-pill img{-webkit-user-drag:none;user-select:none}

/* ===== V223 — restore visible hero ticker + true infinite autoplay ===== */
.hero-brand-ticker[data-brand-ticker]:not([hidden]){display:flex!important}
.hero-ticker-viewport,
body[data-cms-page="index"] .category-wrap,
body[data-cms-page="index"] .brand-marquee:not(.portfolio-brands){overflow:hidden!important}
.hero-brand-track[data-v223-owned="1"],
body[data-cms-page="index"] .cat-track[data-v223-owned="1"],
body[data-cms-page="index"] .brand-track[data-v223-owned="1"]{
  display:flex!important;flex-wrap:nowrap!important;width:max-content!important;min-width:max-content!important;
  animation:none!important;transition:none!important;will-change:transform!important;backface-visibility:hidden!important;
}
.hero-brand-track[data-v223-owned="1"]>* ,
body[data-cms-page="index"] .cat-track[data-v223-owned="1"]>* ,
body[data-cms-page="index"] .brand-track[data-v223-owned="1"]>*{flex-shrink:0!important}


/* V224 responsive visibility and immediate hero ticker paint */
[data-brand-ticker][hidden],section[hidden]:has([data-brand-wall]){display:none!important}
.hero-brand-ticker{opacity:1!important;visibility:visible!important;animation:none!important;transition:none!important}
.hero-brand-track,.brand-track{opacity:1!important;visibility:visible!important}
a.brand-link{pointer-events:auto!important;position:relative;z-index:2}

/* V226 rail interaction and hero ticker first paint */
.v226-rails .category-wrap:hover .cat-track,.v226-rails .brand-marquee:hover .brand-track,.v226-rails .hero-ticker-viewport:hover .hero-brand-track{animation-play-state:running!important}
[data-brand-ticker]{opacity:1!important;visibility:visible!important;transition:none!important}
.hero-ticker-viewport,.hero-brand-track{transition:none!important}


/* V230 performance and first-paint stability */
.category-wrap,.hero-ticker-viewport,.brand-marquee{scrollbar-width:none;-ms-overflow-style:none}
.category-wrap::-webkit-scrollbar,.hero-ticker-viewport::-webkit-scrollbar,.brand-marquee::-webkit-scrollbar{display:none}
body[data-cms-page="index"] section:not(.hero){content-visibility:auto;contain-intrinsic-size:900px}
.hero,.hero-content,.supply-composition,.hero-brand-ticker{visibility:visible!important;opacity:1!important}
.hero:before{animation:none!important;transform:none!important}
@media (prefers-reduced-motion:no-preference){.hero.hero-ready:before{animation:ken 18s ease-in-out infinite alternate!important}}

/* V231: stable first paint and one unified rail engine */
.hero-ticker-viewport,.category-wrap,.brand-marquee{overflow:hidden!important;overscroll-behavior-x:contain!important}
.hero-brand-track,.cat-track,.brand-track{transform:translate3d(0,0,0);backface-visibility:hidden;contain:layout paint style}
.hero .sub,.home-distribution [data-dist-field],.hero-ticker-viewport{transition:none!important;animation:none!important}
.hero-ticker-viewport{min-height:72px;opacity:1!important;visibility:visible!important}
@media(max-width:767px){.hero-ticker-viewport{min-height:62px}.category-wrap,.brand-marquee,.hero-ticker-viewport{touch-action:pan-y!important}}

/* V232 — hero ticker vertical alignment only */
.hero-ticker-viewport{
  min-height:0!important;
  height:100%!important;
  display:flex!important;
  align-items:center!important;
}
.hero-brand-track{
  align-items:center!important;
}
@media(max-width:767px){
  .hero-ticker-viewport{
    min-height:0!important;
    height:100%!important;
  }
}

/* V240: prevent first-visible product rail rebase without changing layout. */
body[data-cms-page="index"] .category-wrap:not([data-rail-ready="1"]){visibility:visible;}
body[data-cms-page="index"] .category-wrap[data-rail-ready="1"]{visibility:visible;}


/* ===== V241 — mobile RTL hero integrity; no overlap ===== */
@media (max-width:768px){
  html[dir="rtl"] body[data-cms-page="index"] .hero-content,
  body.rtl[data-cms-page="index"] .hero-content{padding-top:86px!important;padding-bottom:10px!important;text-align:right!important;direction:rtl!important}
  html[dir="rtl"] body[data-cms-page="index"] .headline,
  body.rtl[data-cms-page="index"] .headline{font-size:clamp(28px,8vw,38px)!important;line-height:1.24!important;letter-spacing:0!important;margin:0 0 9px!important;max-width:100%!important;overflow-wrap:anywhere!important;text-wrap:balance!important}
  html[dir="rtl"] body[data-cms-page="index"] .sub,
  body.rtl[data-cms-page="index"] .sub{font-size:11px!important;line-height:1.65!important;max-width:100%!important;margin:0!important;overflow-wrap:anywhere!important}
  html[dir="rtl"] body[data-cms-page="index"] .cta-row,
  body.rtl[data-cms-page="index"] .cta-row{margin-top:10px!important;gap:9px!important;display:grid!important;grid-template-columns:1fr 1fr!important}
  html[dir="rtl"] body[data-cms-page="index"] .btn,
  body.rtl[data-cms-page="index"] .btn{min-height:42px!important;padding:8px 10px!important;font-size:11px!important;line-height:1.35!important;white-space:normal!important;text-align:center!important}
  html[dir="rtl"] body[data-cms-page="index"] .hero-proof-row,
  body.rtl[data-cms-page="index"] .hero-proof-row{display:none!important}
  html[dir="rtl"] body[data-cms-page="index"] .mobile-supply-flow,
  body.rtl[data-cms-page="index"] .mobile-supply-flow{padding-top:8px!important;direction:rtl!important}
  html[dir="rtl"] body[data-cms-page="index"] .mobile-flow-step,
  body.rtl[data-cms-page="index"] .mobile-flow-step{transform:none!important;width:88%!important;max-width:88%!important;min-height:78px!important}
  html[dir="rtl"] body[data-cms-page="index"] .flow-copy,
  body.rtl[data-cms-page="index"] .flow-copy{text-align:right!important;direction:rtl!important;padding:7px 8px!important;overflow:hidden!important}
  html[dir="rtl"] body[data-cms-page="index"] .flow-copy b,
  body.rtl[data-cms-page="index"] .flow-copy b{font-size:11px!important;line-height:1.3!important;white-space:normal!important}
  html[dir="rtl"] body[data-cms-page="index"] .flow-copy small,
  body.rtl[data-cms-page="index"] .flow-copy small{font-size:7.5px!important;line-height:1.45!important;display:block!important;overflow:hidden!important}
}

/* V241 fast hero first paint */
body[data-cms-page="index"] .hero{background-image:var(--final-home-banner)!important;background-color:var(--final-banner-color,#071a32)!important;background-position:var(--final-banner-position,center center)!important;background-size:cover!important;background-repeat:no-repeat!important}
body[data-cms-page="index"] .hero:before{display:none!important;content:none!important}

/* V242 — current hero only: never paint a legacy fallback before live config */
body[data-cms-page="index"] .hero{background-color:#071a32!important}
html[style*="--final-home-banner"] body[data-cms-page="index"] .hero{background-image:var(--final-home-banner)!important}
.social-preview-card{margin-bottom:22px}
.social-preview-card .responsive-preview{max-width:520px;aspect-ratio:1200/630;background-size:cover;background-position:center}

/* V244 — stable hero image/overlay: prevent the post-load double-darkening. */
html body[data-cms-page="index"] section.hero{
  transition:none!important;
  animation:none!important;
}
html body[data-cms-page="index"] section.hero::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  background:var(--final-hero-overlay,linear-gradient(90deg,rgba(4,15,34,.85),rgba(4,15,34,.45),rgba(4,15,34,.70)))!important;
  opacity:1!important;
  visibility:visible!important;
  transform:none!important;
  animation:none!important;
  filter:none!important;
  pointer-events:none!important;
}


/* V245 — mobile scroll-stable hero and faster first paint. */
html body[data-cms-page="index"] section.hero{
  background-image:var(--final-home-banner)!important;
  background-position:var(--final-banner-position,center center)!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  background-attachment:scroll,scroll!important;
  animation:none!important;transition:none!important;filter:none!important;
  transform:translateZ(0)!important;backface-visibility:hidden!important;
  contain:paint!important;
}
html body[data-cms-page="index"] section.hero::before,
html body[data-cms-page="index"] section.hero::after{
  content:none!important;display:none!important;background:none!important;
  opacity:0!important;animation:none!important;transition:none!important;filter:none!important;
}
@media(max-width:767px){
  html body[data-cms-page="index"] section.hero{min-height:100svh!important;height:100svh!important;}
  html body[data-cms-page="index"] .hero-proof-row,
  html body[data-cms-page="index"] .hero-glass-stats,
  html body[data-cms-page="index"] .hero-content{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
}


/* V246 — one stable hero paint on mobile; no post-load or scroll darkening. */
html body[data-cms-page="index"] section.hero{
  background-image:var(--final-home-banner)!important;
  background-position:var(--final-banner-position,center center)!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  background-attachment:scroll!important;
  transition:none!important;animation:none!important;filter:none!important;
}
html body[data-cms-page="index"] section.hero::before,
html body[data-cms-page="index"] section.hero::after{content:none!important;display:none!important;}
@media(max-width:767px){
  html body[data-cms-page="index"] section.hero{transform:none!important;contain:layout paint!important;}
  html body[data-cms-page="index"] .mobile-flow-step .flow-thumb img{content-visibility:visible!important;}
}

/* ===== V249 — mobile hero cards: full readable copy without viewport overflow ===== */
@media (max-width:768px){
  body[data-cms-page="index"] .mobile-supply-flow{
    padding-left:10px!important;
    padding-right:10px!important;
    box-sizing:border-box!important;
  }
  body[data-cms-page="index"] .mobile-flow-steps{
    width:100%!important;
    max-width:100%!important;
    padding-left:0!important;
    padding-right:0!important;
    box-sizing:border-box!important;
    overflow:visible!important;
  }
  body[data-cms-page="index"] .mobile-flow-step,
  body[data-cms-page="index"] .mobile-flow-step:nth-child(1),
  body[data-cms-page="index"] .mobile-flow-step:nth-child(3),
  body[data-cms-page="index"] .mobile-flow-step:nth-child(5),
  body[data-cms-page="index"] .mobile-flow-step:nth-child(7),
  body[data-cms-page="index"] .mobile-flow-step:nth-of-type(odd),
  body[data-cms-page="index"] .mobile-flow-step:nth-of-type(even){
    width:min(94%,560px)!important;
    max-width:min(94%,560px)!important;
    min-width:0!important;
    grid-template-columns:minmax(112px,38%) minmax(0,62%)!important;
    box-sizing:border-box!important;
    transform:none!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  body[data-cms-page="index"] .mobile-flow-step:nth-child(1),
  body[data-cms-page="index"] .mobile-flow-step:nth-child(5){
    transform:translateX(-2%)!important;
  }
  body[data-cms-page="index"] .mobile-flow-step:nth-child(3),
  body[data-cms-page="index"] .mobile-flow-step:nth-child(7){
    transform:translateX(2%)!important;
  }
  body[data-cms-page="index"] .mobile-flow-step .flow-copy{
    min-width:0!important;
    width:100%!important;
    max-width:100%!important;
    padding:7px 30px 7px 12px!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }
  body[data-cms-page="index"] .mobile-flow-step .flow-copy b{
    width:100%!important;
    max-width:100%!important;
    font-size:clamp(8px,2.35vw,11px)!important;
    line-height:1.12!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  body[data-cms-page="index"] .mobile-flow-step .flow-copy small{
    width:100%!important;
    max-width:100%!important;
    margin-top:4px!important;
    font-size:clamp(6.2px,1.78vw,8.2px)!important;
    line-height:1.28!important;
    white-space:normal!important;
    overflow:hidden!important;
    text-overflow:clip!important;
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:3!important;
  }
}
@media (max-width:390px){
  body[data-cms-page="index"] .mobile-supply-flow{
    padding-left:7px!important;
    padding-right:7px!important;
  }
  body[data-cms-page="index"] .mobile-flow-step,
  body[data-cms-page="index"] .mobile-flow-step:nth-child(1),
  body[data-cms-page="index"] .mobile-flow-step:nth-child(3),
  body[data-cms-page="index"] .mobile-flow-step:nth-child(5),
  body[data-cms-page="index"] .mobile-flow-step:nth-child(7){
    width:96%!important;
    max-width:96%!important;
    grid-template-columns:minmax(96px,36%) minmax(0,64%)!important;
  }
  body[data-cms-page="index"] .mobile-flow-step .flow-copy{
    padding:6px 27px 6px 10px!important;
  }
}
@media (max-width:340px){
  body[data-cms-page="index"] .mobile-flow-step,
  body[data-cms-page="index"] .mobile-flow-step:nth-child(1),
  body[data-cms-page="index"] .mobile-flow-step:nth-child(3),
  body[data-cms-page="index"] .mobile-flow-step:nth-child(5),
  body[data-cms-page="index"] .mobile-flow-step:nth-child(7){
    width:98%!important;
    max-width:98%!important;
    grid-template-columns:minmax(88px,34%) minmax(0,66%)!important;
    transform:none!important;
  }
  body[data-cms-page="index"] .mobile-flow-step .flow-copy{
    padding-left:9px!important;
    padding-right:25px!important;
  }
}
\n\n/* ===== V252 — iPhone product rail fail-safe + RTL hero line spacing ===== */
body[data-cms-page="index"] .category-wrap,
body[data-cms-page="index"] .category-wrap .cat-track{
  min-height:300px;
}
html.is-ios body[data-cms-page="index"] .category-wrap,
html.is-ios body[data-cms-page="index"] .category-wrap .cat-track{
  visibility:visible!important;
  opacity:1!important;
}
@media (max-width:768px){
  body[data-cms-page="index"] .category-wrap,
  body[data-cms-page="index"] .category-wrap .cat-track{min-height:285px}
  html.is-ios[dir="rtl"] body[data-cms-page="index"] .headline,
  html.is-ios body.rtl[data-cms-page="index"] .headline{
    line-height:1.38!important;
  }
}


/* ===== V253 — iPhone home products hard fail-safe ===== */
body[data-cms-page="index"] .categories-section,
body[data-cms-page="index"] .category-wrap,
body[data-cms-page="index"] .cat-track{
  visibility:visible!important;
  opacity:1!important;
}
@media (max-width:768px){
  body[data-cms-page="index"] .category-wrap{
    display:block!important;
    min-height:285px!important;
    height:auto!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }
  body[data-cms-page="index"] .category-wrap::-webkit-scrollbar{display:none!important}
  body[data-cms-page="index"] .category-wrap .cat-track{
    display:flex!important;
    flex-wrap:nowrap!important;
    gap:14px!important;
    width:max-content!important;
    min-width:100%!important;
    min-height:285px!important;
    height:auto!important;
    transform:none!important;
    animation:none!important;
    transition:none!important;
    visibility:visible!important;
    opacity:1!important;
  }
  body[data-cms-page="index"] .category-wrap .cat-card,
  body[data-cms-page="index"] .category-wrap .product-card-link{
    display:block!important;
    flex:0 0 min(78vw,310px)!important;
    width:min(78vw,310px)!important;
    min-width:min(78vw,310px)!important;
    height:285px!important;
    visibility:visible!important;
    opacity:1!important;
  }
  html[dir="rtl"] body[data-cms-page="index"] .headline,
  body.rtl[data-cms-page="index"] .headline{
    line-height:1.42!important;
  }
}

/* V255 — keep the Home header logo visible without touching other pages/logos. */
body[data-cms-page="index"] .nav .brand > img.home-header-logo,
body[data-cms-page="index"] .nav .brand > img[data-cms-image="index-image-1"]{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  flex:0 0 auto;
}

/* ===== V256 — iPhone Home rail touch continuity only ===== */
@supports (-webkit-touch-callout:none){
  body[data-cms-page="index"] .category-wrap,
  body[data-cms-page="index"] .brand-marquee:not(.portfolio-brands){
    -webkit-user-select:none!important;
    user-select:none!important;
    -webkit-touch-callout:none!important;
    touch-action:pan-y pinch-zoom!important;
  }
  body[data-cms-page="index"] .category-wrap img,
  body[data-cms-page="index"] .brand-marquee:not(.portfolio-brands) img{
    -webkit-user-drag:none!important;
    pointer-events:none!important;
  }
}

/* ===== V258 — Mobile Arabic/Urdu header name visibility + hero title line clearance only ===== */
@media (max-width:768px){
  html[dir="rtl"] body[data-cms-page="index"] .nav .brand-title,
  html[lang="ar"] body[data-cms-page="index"] .nav .brand-title,
  html[lang="ur"] body[data-cms-page="index"] .nav .brand-title{
    line-height:1.55!important;
    padding-block:4px 5px!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }

  html[dir="rtl"] body[data-cms-page="index"] .headline,
  html[lang="ar"] body[data-cms-page="index"] .headline,
  html[lang="ur"] body[data-cms-page="index"] .headline{
    line-height:1.56!important;
  }
}

/* V261 — Hide Legal footer column only */
.footer-grid > div:nth-child(4){display:none!important;}
@media (min-width:901px){
  .footer-grid{grid-template-columns:2fr repeat(2,1fr);}
}