/* Al Areen public stylesheet bundle v61 — consolidated in original cascade order. */

/* ===== site.css ===== */
:root{--navy:#052d67;--deep:#021f4c;--blue:#0b55a5;--ink:#06265c;--gold:#c99743;--pale:#f5f8fc;--line:#d8e1ee;--white:#fff;--shadow:0 18px 55px #082c611c}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font:15px/1.5 Arial,Helvetica,sans-serif;background:#fff}body.modal-open{overflow:hidden}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.icon{width:22px;height:22px;display:inline-block;vertical-align:middle;flex:none}.top{height:86px;padding:10px clamp(28px,4.2vw,68px);display:flex;align-items:center;gap:30px;position:sticky;top:0;z-index:60;background:#ffffffef;border-bottom:1px solid #e6ecf3;backdrop-filter:blur(18px)}.brand{width:240px;margin-right:auto}.brand img{max-height:64px}.top nav{display:flex;align-items:center;gap:28px;font-size:13px}.top nav a{padding:9px 0}.top nav a:hover{color:#b57d23}.nav-toggle{display:none;background:none;border:0;color:var(--navy);padding:8px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:8px;padding:13px 22px;background:linear-gradient(135deg,#063574,#0b5aaa);color:#fff;font-weight:700;cursor:pointer}.btn .icon{width:17px}.btn.gold{color:#352407;background:linear-gradient(115deg,#f7e6bf,#d6a34b);border:1px solid #c89338}.btn.outline{background:#fff;color:var(--navy);border:1px solid #8aa8ce}.eyebrow{font-size:12px;font-weight:800;letter-spacing:.1em;color:var(--blue)}.section-head{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:18px}.section-head h2{font-size:26px;margin:0}.section-head>a{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700}.section-head>a .icon{width:16px}

/* Approved homepage hero */
.home-page .top{position:absolute;top:22px;left:clamp(28px,23vw,360px);right:clamp(150px,12vw,210px);height:58px;padding:8px 24px;border:1px solid #ffffffad;border-radius:12px;background:#ffffffc7;box-shadow:0 9px 28px #06295d12}.home-page .brand{position:fixed;left:4vw;top:28px;width:220px;z-index:1}.home-page .top>.gold{position:fixed;right:4vw;top:31px;background:#ffffffb5;color:#8a5a13;border:1px solid #c99a42;padding:10px 21px}.home-page .top nav{margin:auto;gap:25px}.home-page .top nav a:first-child{border-bottom:2px solid var(--blue)}.hero{min-height:630px;position:relative;display:grid;grid-template-columns:37% 63%;overflow:hidden;background:radial-gradient(circle at 17% 38%,#fff 0,#f4f7fb 48%,#eaf0f7 100%);padding:100px 0 76px}.hero:after{content:"";position:absolute;left:0;right:0;bottom:-25px;height:80px;background:#fff;border-radius:50% 50% 0 0/55% 55% 0 0;z-index:3}.blueprint{position:absolute;left:8%;top:110px;width:29%;height:430px;opacity:.07;color:#0d4b8e;background:repeating-linear-gradient(0deg,transparent 0 31px,#0b4d8d18 32px),repeating-linear-gradient(90deg,transparent 0 31px,#0b4d8d18 32px);mask-image:linear-gradient(90deg,#000,transparent)}.blueprint:before,.blueprint:after{content:"";position:absolute;border:2px solid currentColor;border-radius:48%;inset:80px 40px}.blueprint:after{inset:135px 95px;border-style:dashed}.blueprint span{position:absolute;right:28px;top:75px}.blueprint .icon{width:190px;height:290px;stroke-width:.45}.hero-copy{position:relative;z-index:5;padding:40px 20px 10px clamp(38px,4vw,72px);align-self:center}.hero h1{font-size:clamp(38px,3.5vw,58px);line-height:1.05;margin:10px 0 18px;max-width:530px;letter-spacing:-.035em;transition:.22s}.hero h1.swap{opacity:0;transform:translateY(7px)}.hero-copy>p:not(.eyebrow){max-width:390px;margin:0;font-size:16px}.actions{display:flex;gap:12px;margin-top:25px}.hero-counter{display:flex;align-items:center;gap:7px;margin-top:34px;font-size:12px;color:#637694}.hero-counter i{width:80px;height:2px;background:linear-gradient(90deg,var(--navy) 25%,#cad4e2 25%)}.hero-media{height:530px;position:relative;overflow:hidden;border-radius:50% 0 0 46%/38% 0 0 62%;box-shadow:-2px 0 0 #d1a355}.hero-media:before{content:"";position:absolute;inset:0;z-index:1;box-shadow:inset 0 0 0 1px #f2d29480;pointer-events:none}.hero-media video{width:100%;height:100%;object-fit:cover}.video-toggle{position:absolute;left:15%;bottom:93px;z-index:3;width:34px;height:34px;border:1px solid #fff7;border-radius:50%;background:#011d3dcc;color:#fff}.stock-cards{position:absolute;left:10%;bottom:26px;z-index:3;display:flex;gap:20px}.stock-cards div{min-width:195px;padding:13px 18px;border-radius:10px;text-align:center;color:#17233a;background:linear-gradient(120deg,#f7e7c5e8,#d9ad64e8);border:1px solid #c99743;backdrop-filter:blur(12px)}.stock-cards strong{display:block;font-size:22px}.stock-cards span{font-size:12px}.quick{position:relative;z-index:8;width:min(1180px,92%);margin:-35px auto 16px;display:flex;justify-content:space-around;gap:8px;padding:17px 22px;border:1px solid #d8e1ec;border-radius:22px;background:#fffffff2;box-shadow:var(--shadow)}.quick a{display:flex;align-items:center;gap:9px;padding:5px 11px;font-size:12px;font-weight:700;border-right:1px solid #d6dfeb;flex:1;justify-content:center}.quick a:last-child{border-right:0}.quick .icon{color:#154785}

/* Approved homepage content */
.home-products{padding:12px clamp(30px,4vw,64px) 20px}.product-filters{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:13px}.product-filters button{border:0;border-radius:18px;padding:8px 13px;background:transparent;color:var(--ink);font-size:11px}.product-filters button.active{background:var(--navy);color:#fff}.product-mosaic{height:280px;display:grid;grid-template-columns:1.45fr .75fr .92fr .75fr;grid-template-rows:1fr 1fr;gap:10px}.mosaic-card{position:relative;overflow:hidden;border-radius:10px;background:#061b37}.mosaic-card.hidden{display:none}.mosaic-card img{width:100%;height:100%;object-fit:cover;opacity:.88;transition:.35s}.mosaic-card:hover img{transform:scale(1.04);opacity:1}.mosaic-card:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#001735d9)}.mosaic-card span{position:absolute;left:16px;right:12px;bottom:13px;z-index:2;color:#fff;display:flex;align-items:end;justify-content:space-between;gap:10px}.mosaic-card strong{font-size:16px;line-height:1.12}.mosaic-card .icon{width:17px}.mosaic-1{grid-row:1/3}.mosaic-6{grid-column:3/5}.home-services{position:relative;padding:19px clamp(30px,4vw,64px) 25px;color:#fff;background:linear-gradient(105deg,#073b7b,#02285f)}.home-services:before{content:"";position:absolute;left:0;right:0;top:-20px;height:40px;background:#fff;border-radius:0 0 50% 50%/0 0 45% 45%}.home-services .section-head{position:relative}.service-strip{display:grid;grid-template-columns:repeat(7,1fr);gap:7px}.service-strip a{height:122px;position:relative;overflow:hidden;border:1px solid #6e91bc;border-radius:8px;background:#062755}.service-strip img{width:100%;height:100%;object-fit:cover;opacity:.78}.service-strip a:after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(transparent,#001938)}.service-strip strong{position:absolute;left:8px;right:6px;bottom:8px;z-index:2;color:#fff;font-size:12px;line-height:1.15}.operations{display:grid;grid-template-columns:1fr 1fr 1.12fr;gap:12px;padding:17px clamp(30px,4vw,64px);background:#f4f7fb}.operations>article{min-height:112px;padding:14px 18px;background:#fff;border:1px solid #e0e7f0;border-radius:10px}.operations h3{font-size:13px;margin:0 0 14px}.industry-icons{display:grid;grid-template-columns:repeat(6,1fr);gap:5px}.industry-icons span{text-align:center;font-size:9px}.industry-icons .icon{display:block;margin:auto auto 5px;width:20px}.cert-row{display:flex;align-items:center;gap:18px}.cert-row img{width:48px;height:42px;object-fit:contain}.office-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.office-row span{display:grid;grid-template-columns:18px 1fr;gap:2px;font-size:10px}.office-row .icon{width:15px;grid-row:1/3}.office-row small{grid-column:2;color:#65738a}.mobile-operations{display:none}

/* Approved global support popup */
.support-orbit{position:fixed;right:18px;top:48%;z-index:92;width:62px;height:62px;border-radius:50%;border:2px solid #e4b45d;background:radial-gradient(circle,#073c7c 0,#03295d 67%,#061b3d 100%);color:#f1c36d;box-shadow:0 0 0 4px #fff,0 0 0 6px #dda84d,0 0 18px 6px #e3b35d99;cursor:pointer}.support-orbit:before,.support-orbit:after{content:"";position:absolute;inset:-7px;border:1px solid #eccb8b;border-radius:50%;animation:orbitPulse 2s infinite}.support-orbit:after{inset:-12px;animation-delay:1s}.support-orbit .headphones .icon{position:absolute;inset:8px;width:42px;height:42px;stroke-width:1.35}.support-orbit .anchor .icon{position:absolute;left:20px;top:18px;width:20px;height:25px;stroke-width:2}.support-modal{visibility:hidden;position:fixed;inset:0;z-index:90;pointer-events:none}.support-modal.open{visibility:visible;pointer-events:auto}.modal-backdrop{position:absolute;inset:0;border:0;background:#001b3a1e;opacity:0;transition:.25s}.support-modal.open .modal-backdrop{opacity:1}.modal-card{position:absolute;right:92px;top:14%;width:min(370px,calc(100vw - 120px));max-height:76vh;overflow:auto;padding:22px;border:1px solid #d4a856;border-radius:18px;background:#fffffff2;box-shadow:0 25px 80px #001a3c40;backdrop-filter:blur(18px);transform:translateX(25px) scale(.97);opacity:0;transition:.28s}.support-modal.open .modal-card{transform:none;opacity:1}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:14px}.modal-head h2{font-size:20px;margin:0}.modal-close{border:0;background:none;padding:4px;color:var(--navy)}.modal-close .icon{width:20px}.support-contact{margin:9px 0;border:1px solid #e2e8f0;border-radius:11px;background:#fff;box-shadow:0 5px 18px #062b5c0b}.support-contact summary{list-style:none;display:flex;align-items:center;justify-content:space-between;padding:12px;cursor:pointer}.support-contact summary::-webkit-details-marker{display:none}.support-contact summary span{display:flex;flex-direction:column}.support-contact summary b{font-size:13px}.support-contact summary small{font-size:10px;font-weight:400;color:#5e6c80}.support-contact summary i{font-style:normal}.contact-actions{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #edf1f6}.contact-actions a{display:flex;align-items:center;justify-content:center;gap:5px;padding:9px 4px;font-size:10px;font-weight:700}.contact-actions .icon{width:14px}.contact-actions .contact-wa{color:#0c9145}.mobile-handle{display:none}@keyframes orbitPulse{0%,100%{opacity:.75;transform:scale(1)}50%{opacity:.2;transform:scale(1.08)}}

/* Product and service pages */
.detail-hero{height:430px;position:relative;display:flex;align-items:center;background:linear-gradient(90deg,#ffffffef 0,#ffffffd0 40%,transparent 68%),var(--hero) center/cover;overflow:hidden}.vertical-category{width:84px;align-self:stretch;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;border-right:1px solid #d7ac58}.vertical-category span{writing-mode:vertical-rl;transform:rotate(180deg);letter-spacing:.25em;font-size:13px;color:#a36d17}.vertical-category .icon{color:#a36d17}.detail-hero-copy{width:min(560px,70%);padding:32px 60px}.crumb{font-size:11px}.detail-hero h1{font-size:clamp(36px,4vw,56px);line-height:1.05;margin:12px 0 14px}.detail-hero-copy>p:last-child{max-width:420px}.detail-tabs{position:sticky;top:86px;z-index:45;display:flex;justify-content:center;gap:70px;padding:13px;background:#fffffff5;border-bottom:1px solid var(--line);backdrop-filter:blur(15px)}.detail-tabs a{padding:5px 10px;font-size:12px}.detail-tabs a.active{font-weight:700;border-bottom:2px solid var(--blue)}.overview-shell{width:min(1180px,94%);margin:25px auto;display:grid;grid-template-columns:31% 69%;grid-template-rows:310px auto;border:1px solid var(--line);border-radius:17px;overflow:hidden;background:#fff;box-shadow:var(--shadow)}.overview-copy{padding:28px}.overview-copy h2,.minor-head h2,.related-panel h2,.applications h2,.faq h2{font-size:20px;margin:0 0 12px}.rich{font-size:15px}.rich p:first-child{margin-top:0}.rich table{width:100%;border-collapse:collapse;display:block;overflow:auto}.rich th,.rich td{padding:9px;border:1px solid var(--line);font-size:12px}.rich th{background:var(--navy);color:#fff}.carousel{position:relative;overflow:hidden;background:#e8eef5}.carousel>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:.55s}.carousel>img.active{opacity:1}.carousel>.prev,.carousel>.next{position:absolute;top:45%;z-index:2;width:38px;height:38px;border:0;border-radius:50%;background:#fff;color:var(--navy);font-size:25px;box-shadow:0 5px 16px #001d4240}.carousel>.prev{left:16px}.carousel>.next{right:16px}.dots{position:absolute;left:0;right:0;bottom:9px;text-align:center}.dots button{width:7px;height:7px;padding:0;margin:3px;border:0;border-radius:50%;background:#d6dee9}.dots button.active{background:var(--blue)}.benefits{grid-column:1/3;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}.benefits span{display:flex;align-items:center;justify-content:center;gap:13px;min-height:76px;border-right:1px solid var(--line)}.benefits span:last-child{border:0}.benefits b{font-size:12px}.benefits .icon{color:var(--blue);width:30px;height:30px}.detail-grid{display:grid;grid-template-columns:62% 38%;gap:18px;width:min(1180px,94%);margin:25px auto}.spec-card,.related-panel{padding:18px;border:1px solid var(--line);border-radius:14px;background:#fff}.minor-head{display:flex;align-items:center;justify-content:space-between;gap:15px}.minor-head a{display:flex;align-items:center;gap:5px;font-size:10px}.minor-head a .icon{width:15px}.empty-data{padding:25px;background:#f5f8fc;border-radius:9px;color:#5c6d82}.related-panel{display:grid;grid-template-columns:1fr 1fr;gap:12px}.related-panel h2{font-size:15px}.related-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.related-cards a{border:1px solid var(--line);border-radius:7px;overflow:hidden;background:#fff}.related-cards img{width:100%;height:67px;object-fit:cover}.related-cards span{display:block;padding:6px;font-size:9px;line-height:1.15}.applications,.faq{width:min(1180px,94%);margin:32px auto}.app-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.app-grid article{height:145px;display:flex;align-items:end;border-radius:8px;overflow:hidden;background:linear-gradient(0deg,#022c64dd,transparent 70%),var(--app) center/cover}.app-grid span{width:100%;display:flex;align-items:center;gap:5px;padding:9px;color:#fff;font-size:11px;font-weight:700}.app-grid .icon{width:16px}.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.faq details{border:1px solid var(--line);border-radius:7px;background:#fff}.faq summary,.mobile-detail>details>summary{list-style:none;display:flex;justify-content:space-between;gap:10px;padding:10px 12px;font-size:11px;font-weight:700;cursor:pointer}.faq summary::-webkit-details-marker,.mobile-detail summary::-webkit-details-marker{display:none}.faq details p{padding:0 12px 12px;margin:0;font-size:12px}.cta{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding:24px clamp(28px,5vw,78px);background:linear-gradient(100deg,#073d7c,#022555);color:#fff}.cta-icon{width:46px;height:46px;display:grid;place-items:center;border:1px solid #d8a64e;border-radius:50%;color:#e7b75e}.cta h2{font-size:16px;margin:0}.cta p{font-size:11px;margin:3px 0}.mobile-detail{display:none}

/* Reference-accurate desktop detail composition */
@media(min-width:981px){
.detail-hero{height:315px;min-height:315px;background:linear-gradient(90deg,#fffef7 0,#ffffffed 34%,#ffffff66 55%,transparent 72%),var(--hero) center 44%/cover}
.detail-hero-copy{width:min(540px,44%);padding:25px 38px 25px 58px;background:linear-gradient(110deg,#ffffffec 0,#fffffff2 74%,transparent 75%);border-radius:0}
.detail-hero h1{max-width:520px;margin:9px 0 11px;font-size:clamp(30px,3.1vw,45px)}
.detail-hero-copy>p:last-child{font-size:14px;line-height:1.45}
.overview-shell{margin:18px auto;grid-template-columns:34% 66%;grid-template-rows:270px auto;border-radius:12px}
.overview-copy{padding:22px 24px}
.detail-grid{grid-template-columns:65% 35%;margin:18px auto}
.related-panel{gap:10px;padding:14px}
.related-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.related-cards img{height:88px}
.related-cards span{font-size:10px}
.applications,.faq{margin:24px auto}
.app-grid article{height:130px}
.faq-grid{max-height:430px;overflow:auto;padding-right:6px}
}

/* Other pages and forms */
.section{padding:65px clamp(28px,5vw,80px)}.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.content-card{padding:11px;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:0 8px 25px #052a5a0b}.content-card img{width:100%;height:210px;object-fit:cover;border-radius:9px}.content-card h3{margin:8px 0;font-size:19px}.content-card p{color:#50647c}.content-card b{display:flex;align-items:center;gap:6px;color:var(--blue)}.content-card b .icon{width:15px}.pill{display:inline-block;margin-top:10px;padding:4px 8px;border-radius:12px;background:#faefd9;color:#8d611d;font-size:10px}.inner-hero{padding:88px clamp(30px,8vw,130px);background:radial-gradient(circle at 80% 20%,#d9eaff,#f7faff 55%)}.inner-hero h1{font-size:48px;margin:10px 0}.inner-hero>p{max-width:760px}.inner-hero.compact{padding-top:55px;padding-bottom:55px}.blog-article{width:min(920px,92%);margin:60px auto}.blog-article>h1{font-size:54px;line-height:1.05}.blog-article>.lead{font-size:19px}.blog-article>img{width:100%;max-height:500px;object-fit:cover;border-radius:20px;margin:25px 0}.quote-form,.install{width:min(940px,92%);margin:45px auto;padding:30px;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}.install{max-width:620px}.quote-form label,.install label{display:block;font-weight:700;margin-bottom:15px}.quote-form input,.quote-form select,.quote-form textarea,.install input{width:100%;margin-top:5px;padding:12px;border:1px solid #b8c8db;border-radius:7px;font:inherit}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.quote-form small{display:block;font-weight:400;color:#687a90}.contact-page{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.contact-page .support-contact{padding:10px}.flash{padding:13px 5vw;background:#e6f7ed;color:#175b37}.flash.error{background:#fde8e8;color:#8b1f1f}footer{display:grid;grid-template-columns:1.2fr 1fr 1fr;align-items:center;gap:24px;padding:22px clamp(30px,4vw,64px);background:linear-gradient(100deg,#052f6a,#001d45);color:#fff}footer img{width:170px;filter:brightness(0) invert(1)}footer small{display:block;font-size:9px;margin-top:8px}footer blockquote{margin:0;font-size:13px}footer nav{grid-column:1/4;display:flex;justify-content:center;gap:30px;border-top:1px solid #ffffff1c;padding-top:12px;font-size:10px}

@media(max-width:980px){.top{height:72px;padding:8px 20px}.brand{width:185px}.desktop{display:none}.nav-toggle{display:block}.top nav{display:none;position:absolute;left:14px;right:14px;top:70px;padding:18px;flex-direction:column;background:#fff;border-radius:14px;box-shadow:var(--shadow)}.top nav.open{display:flex}.home-page .top{position:absolute;left:20px;right:20px;top:18px;height:56px;padding:7px 14px}.home-page .brand{position:static;width:170px}.home-page .top>.gold{display:none}.home-page .top nav{margin:0}.hero{grid-template-columns:38% 62%;min-height:570px;padding-top:90px}.hero-copy{padding-left:30px}.hero h1{font-size:35px}.hero-media{height:430px}.stock-cards{left:7%;gap:8px}.stock-cards div{min-width:145px;padding:9px}.stock-cards strong{font-size:17px}.quick{width:96%;padding:12px 7px}.quick a{font-size:9px;padding:4px}.product-mosaic{height:250px;grid-template-columns:1.3fr .8fr .8fr}.mosaic-6{grid-column:2/4}.mosaic-4{display:none}.service-strip{grid-template-columns:repeat(4,1fr)}.service-strip a:nth-child(n+5){display:none}.operations{grid-template-columns:1fr 1fr}.operations article:last-child{grid-column:1/3}.detail-hero{height:360px}.detail-tabs{top:72px}.detail-grid{grid-template-columns:1fr}.overview-shell{grid-template-columns:34% 66%}.related-panel{grid-template-columns:1fr 1fr}.app-grid{grid-template-columns:repeat(3,1fr)}.card-grid{grid-template-columns:repeat(2,1fr)}}

@media(max-width:600px){body{font-size:14px}.top{height:62px}.brand{width:145px}.top nav{top:61px}.home-page .top{top:8px;left:8px;right:8px;height:55px;background:transparent;border:0;box-shadow:none}.home-page .brand{width:135px}.hero{display:block;min-height:590px;padding:68px 0 22px;background:#f6f8fb}.blueprint{display:none}.hero-copy{position:absolute;left:14px;top:92px;z-index:5;width:43%;padding:0}.hero h1{font-size:25px;line-height:1.04;margin:6px 0 10px}.hero-copy>p:not(.eyebrow){font-size:10px}.hero .eyebrow{font-size:8px}.actions{gap:5px;margin-top:12px}.actions .btn{padding:8px 8px;font-size:8px}.actions .icon{width:11px}.hero-counter{margin-top:116px;font-size:9px}.hero-media{height:320px;margin-left:38%;border-radius:55% 0 0 45%/35% 0 0 65%}.stock-cards{left:-50%;right:6px;bottom:-82px;gap:6px}.stock-cards div{min-width:0;flex:1;padding:8px 4px}.stock-cards strong{font-size:13px}.stock-cards span{font-size:7px}.video-toggle{left:18%;bottom:20px;width:28px;height:28px}.hero:after{bottom:-7px;height:34px}.quick{margin:-88px auto 9px;overflow-x:auto;justify-content:flex-start;border-radius:12px;padding:8px}.quick a{min-width:64px;flex-direction:column;border:0;font-size:7px;gap:3px}.quick .icon{width:15px}.home-products{padding:10px 11px 16px}.section-head h2{font-size:15px}.section-head>a{font-size:8px}.product-filters{flex-wrap:nowrap;overflow:auto}.product-filters button{white-space:nowrap;font-size:7px;padding:6px 8px}.product-mosaic{height:250px;grid-template-columns:1.1fr 1fr 1fr;grid-template-rows:1fr 1fr}.mosaic-1{grid-column:1/2;grid-row:1/3}.mosaic-2{grid-column:2}.mosaic-3{grid-column:3}.mosaic-4{display:block;grid-column:2}.mosaic-5{grid-column:3}.mosaic-6{display:none}.mosaic-card span{left:7px;bottom:6px}.mosaic-card strong{font-size:9px}.mosaic-card .icon{display:none}.home-services{padding:14px 10px 16px}.home-services:before{top:-8px;height:17px}.service-strip{grid-template-columns:repeat(4,1fr)}.service-strip a{height:75px}.service-strip strong{font-size:7px;left:4px;bottom:4px}.operations{display:none}.mobile-operations{display:block;background:#f8fafc}.mobile-operations details{border-bottom:1px solid var(--line)}.mobile-operations summary{list-style:none;display:flex;justify-content:space-between;padding:14px 18px;font-size:11px;font-weight:700}.mobile-operations summary::-webkit-details-marker{display:none}.mobile-operations p{padding:0 18px 14px;margin:0}.support-orbit{width:51px;height:51px;right:8px;top:54%}.support-orbit .headphones .icon{inset:7px;width:34px;height:34px}.support-orbit .anchor .icon{left:17px;top:16px;width:17px;height:21px}.modal-card{left:0;right:0;top:auto;bottom:0;width:100%;max-height:74vh;border-radius:21px 21px 0 0;padding:15px 17px 24px;transform:translateY(35px)}.mobile-handle{display:block;width:40px;height:4px;margin:0 auto 12px;border-radius:4px;background:#b9c4d2}.modal-head h2{font-size:17px}.support-contact summary{padding:10px}.detail-hero{height:330px;align-items:end;background:linear-gradient(0deg,#fff 0,#ffffffd9 35%,transparent 70%),var(--hero) center/cover}.vertical-category{display:none}.detail-hero-copy{width:100%;padding:17px 18px}.detail-hero h1{font-size:26px;margin:6px 0}.detail-hero-copy p{font-size:10px}.detail-tabs{top:62px;gap:22px;justify-content:flex-start;overflow:auto;padding:9px}.detail-tabs a{font-size:9px;white-space:nowrap}.overview-shell{width:95%;margin:13px auto;display:flex;flex-direction:column;border:0;box-shadow:none}.overview-copy{padding:10px}.overview-copy h2{font-size:15px}.overview-copy .rich{font-size:11px}.carousel{height:185px;border-radius:9px;order:2}.benefits{order:3;display:grid;grid-template-columns:repeat(3,1fr)}.benefits span{min-height:62px;gap:4px;flex-direction:column;text-align:center}.benefits .icon{width:20px;height:20px}.benefits b{font-size:7px}.desktop-detail{display:none}.mobile-detail{display:block;border-top:1px solid var(--line)}.mobile-detail>details{border-bottom:1px solid var(--line)}.mobile-detail>details>summary{padding:13px 18px;font-size:10px}.mobile-detail>details>div{padding:0 15px 14px}.mobile-detail .related-cards{grid-template-columns:repeat(3,1fr)}.mobile-detail .app-grid{grid-template-columns:repeat(2,1fr)}.mobile-detail .faq-grid{grid-template-columns:1fr}.cta{grid-template-columns:auto 1fr;padding:14px}.cta-icon{width:35px;height:35px}.cta h2{font-size:11px}.cta p{font-size:8px}.cta .btn{grid-column:1/3;width:100%;font-size:10px}.section{padding:42px 16px}.card-grid{grid-template-columns:1fr}.form-grid,.contact-page{grid-template-columns:1fr}.quote-form{padding:18px}.inner-hero{padding:70px 18px 45px}.inner-hero h1{font-size:35px}.blog-article>h1{font-size:36px}footer{grid-template-columns:1fr;padding:20px}footer img{width:135px}footer blockquote{font-size:10px}footer .btn{font-size:10px}footer nav{grid-column:1;gap:10px;flex-wrap:wrap;font-size:8px}}

/* =========================
   V29 FRONTEND UX
   ========================= */
.support-orbit{touch-action:none;user-select:none;-webkit-user-select:none}.support-orbit.dragging{cursor:grabbing!important;transform:scale(1.04);box-shadow:0 0 0 5px #fff,0 0 0 8px #dda84d,0 0 28px 8px #e3b35dcc}.support-orbit.dragging:before,.support-orbit.dragging:after{animation:none!important;opacity:.25}

.detail-page .carousel{position:relative;overflow:visible!important;padding-bottom:82px;background:#edf3f9}
.detail-page .carousel>img{border-radius:12px}
.detail-page .carousel .prev,.detail-page .carousel .next{position:absolute;top:50%;transform:translateY(-50%);z-index:12;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;padding:0;border:1px solid rgba(226,178,85,.95);background:rgba(4,39,82,.92);color:#fff;box-shadow:0 8px 24px rgba(1,25,58,.28),inset 0 0 0 1px rgba(255,255,255,.15);backdrop-filter:blur(8px);font-size:32px;line-height:1;opacity:1!important;visibility:visible!important}
.detail-page .carousel .prev{left:14px}.detail-page .carousel .next{right:14px}.detail-page .carousel .prev:hover,.detail-page .carousel .next:hover{background:#0a559f;border-color:#f0c876}.detail-page .carousel .prev span,.detail-page .carousel .next span{display:block;margin-top:-3px}
.detail-page .carousel-counter{position:absolute;right:16px;bottom:57px;z-index:13;padding:6px 10px;border-radius:999px;background:rgba(4,39,82,.86);color:#fff;font-size:11px;font-weight:800;letter-spacing:.06em;backdrop-filter:blur(6px)}
.detail-page .carousel .dots{bottom:56px!important;left:16px!important;right:auto!important;transform:none!important;z-index:13}
.detail-page .carousel-thumbs{position:absolute;left:0;right:0;bottom:0;height:50px;display:flex;gap:7px;overflow-x:auto;overflow-y:hidden;padding:0 2px 4px;scrollbar-width:thin;z-index:11;background:#fff}
.detail-page .carousel-thumb{flex:0 0 72px;width:72px;height:46px;padding:2px!important;border:2px solid transparent!important;border-radius:8px!important;background:#fff!important;box-shadow:none!important;overflow:hidden}
.detail-page .carousel-thumb.active{border-color:#c99a42!important;box-shadow:0 0 0 1px #0b4f96!important}.detail-page .carousel-thumb img{width:100%;height:100%;object-fit:cover;border-radius:5px}
.detail-page .carousel.single-image{padding-bottom:0}.detail-page .carousel.single-image .carousel-thumbs,.detail-page .carousel.single-image .carousel-counter{display:none}
@media(max-width:980px){.detail-page .carousel{padding-bottom:76px}.detail-page .carousel .prev,.detail-page .carousel .next{width:44px;height:44px;font-size:29px}.detail-page .carousel .prev{left:10px}.detail-page .carousel .next{right:10px}.detail-page .carousel-thumb{flex-basis:66px;width:66px;height:44px}.detail-page .carousel-thumbs{height:48px}}
@media(max-width:600px){.detail-page .carousel{height:200px!important;padding-bottom:66px;border-radius:10px!important}.detail-page .carousel .prev,.detail-page .carousel .next{width:40px;height:40px;font-size:27px;top:43%}.detail-page .carousel .prev{left:8px}.detail-page .carousel .next{right:8px}.detail-page .carousel-counter{bottom:48px;right:8px;font-size:9px;padding:5px 8px}.detail-page .carousel .dots{bottom:49px!important;left:8px!important}.detail-page .carousel-thumbs{height:42px;gap:5px}.detail-page .carousel-thumb{flex-basis:58px;width:58px;height:38px;border-radius:7px!important}}



/* The floating support button must own pointer gestures itself. */
.support-orbit{
  touch-action:none!important;
  -webkit-user-drag:none;
  user-select:none!important;
  -webkit-user-select:none!important;
  will-change:left,top,transform;
}
.support-orbit.dragging{
  cursor:grabbing!important;
}




/* ===== experience-v2.css ===== */
@font-face{font-family:AALMDisplay;src:url('../fonts/aalm-display-regular.woff') format('woff');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:AALMDisplay;src:url('../fonts/aalm-display-semibold.woff') format('woff');font-style:normal;font-weight:600 800;font-display:swap}
@font-face{font-family:AALMSans;src:url('../fonts/aalm-sans-regular.woff') format('woff');font-style:normal;font-weight:400 600;font-display:swap}
@font-face{font-family:AALMSans;src:url('../fonts/aalm-sans-bold.woff') format('woff');font-style:normal;font-weight:700 900;font-display:swap}

:root{--font-display:AALMDisplay,"Segoe UI Variable Display","Segoe UI",sans-serif;--font-body:AALMSans,"Segoe UI Variable Text","Segoe UI",sans-serif;--accent-gold:#c89236;--accent-blue:#0866bd;--accent-marine:#06437f}
body,input,select,textarea,button{font-family:var(--font-body)}
h1,h2,h3,h4,h5,h6,.stock-cards strong,.stats b{font-family:var(--font-display);font-weight:600;letter-spacing:-.022em}
.top nav,.btn,.eyebrow,.pill,.detail-tabs,.quick,.support-contact summary b{font-family:var(--font-body);letter-spacing:.005em}
.hero-copy{isolation:isolate}
.hero h1{min-height:3.2em;display:block;position:relative;margin-bottom:14px;transform-origin:left center;will-change:transform,opacity,filter,clip-path;color:var(--deep);text-wrap:balance}
.hero h1 .message-accent{position:relative;display:inline;color:var(--message-accent,var(--accent-gold));text-shadow:0 8px 25px color-mix(in srgb,var(--message-accent) 18%,transparent)}
.hero h1 .message-accent:after{content:"";position:absolute;left:0;right:0;bottom:-.04em;height:.08em;border-radius:99px;background:linear-gradient(90deg,transparent,var(--message-accent),transparent);transform-origin:left;animation:accentDraw .42s .16s both}
.hero h1.accent-gold{--message-accent:var(--accent-gold)}
.hero h1.accent-blue{--message-accent:var(--accent-blue)}
.hero h1.accent-marine{--message-accent:var(--accent-marine)}
.hero h1.message-enter{animation-duration:.48s;animation-fill-mode:both;animation-timing-function:cubic-bezier(.2,.72,.25,1)}
.hero h1.message-leave{opacity:0!important;transform:translateY(-9px) scale(.992)!important;filter:blur(5px)!important;transition:opacity .28s,transform .28s,filter .28s}
.message-style-rise{animation-name:msgRise}
.message-style-split{animation-name:msgSplit}
.message-style-focus{animation-name:msgFocus}
.message-style-wipe{animation-name:msgWipe}
.message-style-track{animation-name:msgTrack}
.message-style-scale{animation-name:msgScale}
.message-style-slide-left{animation-name:msgSlideLeft}
.message-style-line-reveal{animation-name:msgLineReveal}
.message-style-tilt{animation-name:msgTilt}
.message-style-clip-up{animation-name:msgClipUp}
.message-style-glow{animation-name:msgGlow}
.message-style-slide-right{animation-name:msgSlideRight}
.message-style-depth{animation-name:msgDepth}
.message-style-gold-sweep{animation-name:msgGoldSweep}
.message-style-soft-focus{animation-name:msgSoftFocus}
.message-style-precision{animation-name:msgPrecision}
.message-style-wave{animation-name:msgWave}
.message-style-resolve{animation-name:msgResolve}
@keyframes msgRise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes msgSplit{from{opacity:0;clip-path:inset(48% 0 48% 0);letter-spacing:.02em}to{opacity:1;clip-path:inset(0);letter-spacing:-.035em}}
@keyframes msgFocus{from{opacity:.1;filter:blur(12px);transform:scale(1.025)}to{opacity:1;filter:none;transform:none}}
@keyframes msgWipe{from{opacity:.35;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0)}}
@keyframes msgTrack{from{opacity:0;letter-spacing:.08em}to{opacity:1;letter-spacing:-.035em}}
@keyframes msgScale{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}
@keyframes msgSlideLeft{from{opacity:0;transform:translateX(34px)}to{opacity:1;transform:none}}
@keyframes msgLineReveal{from{opacity:0;clip-path:inset(0 0 100% 0)}to{opacity:1;clip-path:inset(0)}}
@keyframes msgTilt{from{opacity:0;transform:rotateX(-14deg) translateY(12px)}to{opacity:1;transform:none}}
@keyframes msgClipUp{from{opacity:0;clip-path:inset(100% 0 0 0);transform:translateY(12px)}to{opacity:1;clip-path:inset(0);transform:none}}
@keyframes msgGlow{from{opacity:0;text-shadow:0 0 32px #0b66bd}to{opacity:1;text-shadow:none}}
@keyframes msgSlideRight{from{opacity:0;transform:translateX(-32px)}to{opacity:1;transform:none}}
@keyframes msgDepth{from{opacity:0;transform:perspective(400px) translateZ(-55px)}to{opacity:1;transform:perspective(400px) translateZ(0)}}
@keyframes msgGoldSweep{from{opacity:.1;color:#c89236;clip-path:inset(0 100% 0 0)}to{opacity:1;color:var(--deep);clip-path:inset(0)}}
@keyframes msgSoftFocus{from{opacity:0;filter:blur(7px) saturate(.4)}to{opacity:1;filter:none}}
@keyframes msgPrecision{from{opacity:0;transform:translateY(-13px);letter-spacing:.035em}to{opacity:1;transform:none;letter-spacing:-.035em}}
@keyframes msgWave{from{opacity:0;transform:translateY(10px) skewX(-3deg)}to{opacity:1;transform:none}}
@keyframes msgResolve{0%{opacity:0;filter:blur(9px);transform:translateX(-12px)}65%{opacity:1;filter:blur(0);transform:translateX(3px)}100%{transform:none}}
@keyframes accentDraw{from{transform:scaleX(0);opacity:0}to{transform:scaleX(1);opacity:.85}}

.blueprint{opacity:.18;transition:opacity .35s,transform .48s;animation-duration:1.2s;animation-fill-mode:both}
.blueprint[data-graphic="line-sweep"]{animation-name:graphicSweep}
.blueprint[data-graphic="chain-trace"]{animation-name:graphicTrace}
.blueprint[data-graphic="grid-drift"]{animation-name:graphicGrid}
.blueprint[data-graphic="arc-draw"]{animation-name:graphicArc}
.blueprint[data-graphic="technical-pulse"]{animation-name:graphicPulse}
.blueprint[data-graphic="rope-wave"]{animation-name:graphicWave}
@keyframes graphicSweep{from{opacity:.03;transform:translateX(-18px)}to{opacity:.12;transform:none}}
@keyframes graphicTrace{from{opacity:.03;filter:blur(3px)}to{opacity:.12;filter:none}}
@keyframes graphicGrid{from{background-position:0 0}to{background-position:32px 16px}}
@keyframes graphicArc{from{opacity:.02;transform:scale(.94) rotate(-1deg)}to{opacity:.12;transform:none}}
@keyframes graphicPulse{0%{opacity:.03}55%{opacity:.15}100%{opacity:.12}}
@keyframes graphicWave{from{opacity:.03;transform:translateY(9px) skewX(-2deg)}to{opacity:.12;transform:none}}

.detail-hero-copy{position:relative;isolation:isolate;overflow:hidden;border-radius:0 24px 24px 0}
.detail-hero-copy.has-technical-background:before{content:"";position:absolute;z-index:-1;inset:-16%;background:var(--technical-bg) center/contain no-repeat;opacity:.11;mix-blend-mode:multiply;filter:saturate(.75);pointer-events:none}
.detail-hero-copy.has-technical-background:after{content:"";position:absolute;z-index:-2;inset:0;background:linear-gradient(90deg,#fffef9e8,#f6f9fce5 74%,transparent)}

.support-orbit{display:grid;place-items:center;isolation:isolate}
.support-orbit .headphones,.support-orbit .anchor{position:absolute;inset:0;display:grid;place-items:center}
.support-orbit .headphones .icon{inset:auto;width:44px;height:44px}
.support-orbit .anchor .icon{position:static;width:19px;height:26px;filter:drop-shadow(0 0 5px #e2b25b)}
.whatsapp-float,.legacy-support-button{display:none!important}

@media(max-width:980px){.hero h1{min-height:3.45em}.detail-hero-copy.has-technical-background:before{inset:-7%;background-size:84% auto}}
@media(max-width:640px){.hero h1{min-height:3.7em;font-size:clamp(31px,10vw,42px)}.hero h1 .message-accent:after{height:.06em}.blueprint{opacity:.1}.detail-hero-copy.has-technical-background:before{inset:-3%;background-position:70% center;background-size:90% auto;opacity:.09}}
@media(prefers-reduced-motion:reduce){.hero h1.message-enter{animation:msgReduced .25s both!important}.hero h1.message-leave{filter:none!important;transform:none!important}.hero h1 .message-accent:after,.blueprint,.support-orbit:before,.support-orbit:after{animation:none!important}@keyframes msgReduced{from{opacity:0}to{opacity:1}}}


/* ===== reference-v5.css ===== */
/* Frozen homepage and detail-page reference alignment */

@media (min-width:981px){
  .home-page .top{
    position:absolute;top:18px;left:4%;right:4%;width:auto;height:66px;
    display:grid;grid-template-columns:220px minmax(0,1fr) 130px;align-items:center;
    gap:18px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;
  }
  .home-page .brand{position:static;width:220px;margin:0;justify-self:start}
  .home-page .top nav{
    width:max-content;min-height:48px;margin:0;justify-self:center;padding:4px 25px;
    gap:clamp(12px,1.7vw,27px);border:1px solid #ffffffb8;border-radius:11px;background:#ffffffc9;
    box-shadow:0 9px 28px #06295d12;backdrop-filter:blur(18px)
  }
  .home-page .top>.gold{position:static;margin:0;justify-self:end}

  .hero{min-height:640px;grid-template-columns:36% 64%;padding:0 0 72px}
  .hero-copy{padding:108px 24px 30px clamp(46px,4.2vw,72px);align-self:center}
  .hero h1{max-width:470px;min-height:3.12em;font-size:clamp(39px,3.55vw,57px)}
  .blueprint{left:4.2%;top:103px;width:31%;height:455px;opacity:.19!important;mask-image:linear-gradient(90deg,#000 0,#000 72%,transparent)}
  .blueprint span{right:34px;top:55px}
  .blueprint .icon{width:205px;height:325px;stroke-width:.58}
  .hero-media{
    align-self:start;height:630px;margin:0;border-radius:48% 0 0 52%/31% 0 0 69%;
    box-shadow:-2px 0 #d1a355,inset 0 0 0 1px #f2d29499
  }
  .hero-media video{object-position:center}
  .stock-cards{left:9%;bottom:40px;gap:14px}
  .stock-cards div{width:190px;min-width:190px;padding:12px 14px}
  .video-toggle{left:10%;bottom:121px}
  .quick{margin:-38px auto 16px}

  .detail-page main{overflow:hidden}
  .detail-hero{
    height:340px;min-height:340px;align-items:center;
    background:linear-gradient(90deg,#fffef8f5 0,#ffffffea 34%,#ffffff66 55%,transparent 72%),var(--hero) center 46%/cover;
    border-radius:0 0 46% 9%/0 0 15% 5%
  }
  .detail-hero:after{
    content:"";position:absolute;left:37%;right:-3%;bottom:0;height:2px;
    background:linear-gradient(90deg,#c8953a,transparent);transform:rotate(-1.4deg);transform-origin:left
  }
  .detail-hero-copy{
    width:min(540px,43%);padding:24px 38px 24px 58px;
    background:linear-gradient(110deg,#ffffffeb 0,#fffffff1 75%,transparent 76%);border-radius:0
  }
  .detail-hero h1{max-width:500px;margin:9px 0 11px;font-size:clamp(30px,3vw,44px)}
  .detail-hero-copy>p:last-child{max-width:440px;font-size:14px;line-height:1.48}
  .detail-tabs{top:86px;gap:clamp(38px,6vw,84px);padding:11px 24px}
  .detail-tabs a{position:relative;border:0!important;font-size:13px}
  .detail-tabs a:after{content:"";position:absolute;left:10px;right:10px;bottom:0;height:2px;background:var(--blue);transform:scaleX(0);transition:transform .22s}
  .detail-tabs a.active{font-weight:800}
  .detail-tabs a.active:after{transform:scaleX(1)}

  .overview-shell{
    position:relative;width:calc(100% - 64px);max-width:none;margin:18px 32px;
    grid-template-columns:52% 52%;grid-template-rows:minmax(320px,auto) auto;border-radius:14px
  }
  .overview-copy{
    position:relative;z-index:2;min-height:320px;padding:26px 12% 26px 28px;
    clip-path:polygon(0 0,100% 0,91% 100%,0 100%);background:#fff
  }
  .overview-copy .rich{max-height:none;overflow:visible}
  .carousel{
    z-index:1;min-height:320px;height:auto;margin-left:-8%;
    clip-path:polygon(9% 0,100% 0,100% 100%,0 100%)
  }
  .carousel>.prev{left:10%}
  .benefits{grid-column:1/3}
  .carousel.single-image>.prev,.carousel.single-image>.next,.carousel.single-image>.dots{display:none!important}

  .detail-grid{
    width:calc(100% - 64px);max-width:none;margin:18px 32px;grid-template-columns:minmax(0,65%) minmax(340px,35%)
  }
  .spec-card,.related-panel{padding:18px}
  .related-panel{grid-template-columns:1fr 1fr;gap:14px}
  .related-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .related-cards img{height:92px}
  .related-cards span{font-size:11px;line-height:1.25}
  .applications,.faq{width:calc(100% - 64px);max-width:none;margin:25px 32px}
  .app-grid article{height:135px}
  .faq-grid{max-height:440px;overflow:auto;padding-right:6px}
}

@keyframes graphicSweep{from{opacity:.1;transform:translateX(-14px)}to{opacity:.19;transform:none}}
@keyframes graphicTrace{from{opacity:.1;filter:blur(2px)}to{opacity:.19;filter:none}}
@keyframes graphicArc{from{opacity:.1;transform:scale(.96) rotate(-1deg)}to{opacity:.19;transform:none}}
@keyframes graphicPulse{0%{opacity:.12}55%{opacity:.22}100%{opacity:.19}}
@keyframes graphicWave{from{opacity:.1;transform:translateY(7px) skewX(-2deg)}to{opacity:.19;transform:none}}

#overview,#specifications,#applications,#faqs,.mobile-detail>details{scroll-margin-top:150px}

@media (min-width:601px) and (max-width:980px){
  .home-page .top{left:22px;right:22px;top:14px}
  .hero{min-height:600px;grid-template-columns:42% 58%;padding:88px 0 64px}
  .hero-copy{padding:30px 18px 20px 28px}
  .hero h1{min-height:3.5em;font-size:clamp(31px,4.6vw,42px)}
  .blueprint{display:block;left:2%;top:115px;width:40%;height:390px;opacity:.16!important}
  .hero-media{height:470px;border-radius:50% 0 0 48%/35% 0 0 65%}
  .stock-cards{left:6%;bottom:25px;gap:8px}
  .stock-cards div{min-width:140px;width:140px}
  .overview-shell{width:calc(100% - 36px);margin:16px 18px;grid-template-columns:50% 54%;grid-template-rows:minmax(290px,auto) auto}
  .overview-copy{z-index:2;padding:20px 10% 20px 20px;clip-path:polygon(0 0,100% 0,92% 100%,0 100%)}
  .carousel{min-height:290px;margin-left:-8%;clip-path:polygon(9% 0,100% 0,100% 100%,0 100%)}
  .detail-grid,.applications,.faq{width:calc(100% - 36px);margin-left:18px;margin-right:18px}
}

@media (max-width:600px){
  .home-page .top{position:absolute;top:8px;left:10px;right:10px;height:54px;padding:5px 8px;background:#ffffffd9;border:1px solid #ffffffad;border-radius:10px;box-shadow:0 8px 22px #06295d12}
  .home-page .brand{position:static;width:138px}
  .hero{display:flex;min-height:0;padding:75px 0 18px;flex-direction:column;background:#f5f8fc}
  .hero-copy{position:relative;left:auto;top:auto;width:auto;min-height:300px;padding:34px 20px 22px;order:1}
  .hero h1{min-height:3.5em;max-width:340px;font-size:clamp(29px,9.2vw,39px);line-height:1.03}
  .hero-copy>p:not(.eyebrow){max-width:310px;font-size:12px}
  .hero .eyebrow{font-size:9px}
  .blueprint{display:block;left:7%;top:92px;width:82%;height:275px;opacity:.13!important;mask-image:linear-gradient(90deg,#000,transparent)}
  .blueprint:before{inset:42px 35px}.blueprint:after{inset:82px 72px}
  .blueprint span{right:45px;top:18px}.blueprint .icon{width:130px;height:220px}
  .actions{margin-top:16px}.actions .btn{padding:10px 11px;font-size:10px}
  .hero-media{width:100%;height:300px;margin:0;order:2;border-radius:38% 0 0 22%/19% 0 0 16%;box-shadow:-2px 0 #d1a355}
  .stock-cards{left:14px;right:14px;bottom:12px;gap:8px}
  .stock-cards div{width:auto;min-width:0;flex:1;padding:8px 5px}
  .stock-cards strong{font-size:15px}.stock-cards span{font-size:8px}
  .video-toggle{left:18px;bottom:91px}
  .hero:after{display:none}
  .quick{margin:8px auto 10px}

  .detail-hero{height:315px;border-radius:0 0 35% 7%/0 0 9% 3%}
  .detail-hero-copy{padding:18px 18px 22px}
  .detail-hero h1{font-size:clamp(25px,7.7vw,33px);line-height:1.04}
  .detail-tabs a{position:relative;border:0!important}
  .detail-tabs a:after{content:"";position:absolute;left:8px;right:8px;bottom:0;height:2px;background:var(--blue);transform:scaleX(0)}
  .detail-tabs a.active:after{transform:scaleX(1)}
  .overview-shell{width:calc(100% - 20px);margin:12px 10px;display:flex}
  .overview-copy{order:1;min-height:0;padding:14px 13px}
  .carousel{order:2;height:205px;min-height:205px;margin:0;clip-path:polygon(0 8%,100% 0,100% 100%,0 100%);border-radius:0 0 10px 10px}
  .benefits{order:3}
  .mobile-detail .related-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mobile-detail .related-cards img{height:88px}
  #overview,#specifications,#applications,#faqs,.mobile-detail>details{scroll-margin-top:105px}
}


/* ===== hero-reference-v6.css ===== */
/* Homepage hero corrections from the approved three-screen reference. */

/* Keep the existing header design, but retain it while the page scrolls. */
.top{position:fixed;top:0;left:0;right:0;width:auto;z-index:80}
body:not(.home-page){padding-top:86px}

/* Use the approved technical anchor artwork instead of CSS-drawn placeholders. */
.home-page .blueprint{
  display:block;background:url('../media/alareen-anchor-blueprint-v6.webp') center/contain no-repeat;
  color:transparent;opacity:.12!important;filter:saturate(.55) contrast(.9);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 82%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 82%,transparent 100%);
  pointer-events:none
}
.home-page .blueprint:before,.home-page .blueprint:after,.home-page .blueprint>span{display:none!important}

/* The curve follows one continuous asymmetric ellipse, including its gold trace. */
.home-page .hero-media{
  overflow:hidden;border-radius:0!important;
  -webkit-clip-path:ellipse(112% 78% at 100% 33%);
  clip-path:ellipse(112% 78% at 100% 33%);
  box-shadow:none!important;filter:drop-shadow(-1.5px 0 0 #cf9e45)
}
.home-page .hero-media:before{box-shadow:none!important}
.home-page .hero-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center}

/* Both stock cards share the same glass, dimensions and vertical alignment. */
.home-page .stock-cards{align-items:stretch}
.home-page .stock-cards>div{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  height:66px;border-radius:9px;color:#2a251d;
  background:linear-gradient(118deg,#f8e9cbe8 0,#dfbd83e8 55%,#cfa35be8 100%);
  border:1px solid #ba8432;box-shadow:0 8px 22px #3d290f20,inset 0 1px #fff9;
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)
}
.home-page .stock-cards strong{line-height:1.05}
.home-page .stock-cards span{line-height:1.2}

@media (min-width:981px){
  .home-page .top{position:fixed;top:18px;left:4%;right:4%}
  .home-page .blueprint{left:2.8%;top:54px;width:34%;height:555px}
  .home-page .hero{min-height:640px;grid-template-columns:36% 64%;padding:0 0 72px}
  .home-page .hero-media{align-self:start;height:630px;margin:0}
  .home-page .stock-cards{left:12%;bottom:40px;gap:14px}
  .home-page .stock-cards>div{width:190px;min-width:190px;padding:10px 13px}
}

@media (min-width:601px) and (max-width:980px){
  body:not(.home-page){padding-top:72px}
  .home-page .top{position:fixed;top:14px;left:22px;right:22px}
  .home-page .blueprint{left:1%;top:78px;width:42%;height:455px;opacity:.115!important}
  .home-page .hero{min-height:600px;grid-template-columns:42% 58%;padding:88px 0 64px}
  .home-page .hero-media{
    height:470px;-webkit-clip-path:ellipse(116% 80% at 100% 35%);clip-path:ellipse(116% 80% at 100% 35%)
  }
  .home-page .stock-cards{left:8%;right:5%;bottom:25px;gap:8px}
  .home-page .stock-cards>div{width:auto;min-width:0;flex:1;height:58px;padding:7px 5px}
}

@media (max-width:600px){
  body:not(.home-page){padding-top:62px}
  .top,.home-page .top{position:fixed;top:8px;left:10px;right:10px}
  .home-page .blueprint{
    left:2%;top:68px;width:96%;height:305px;opacity:.105!important;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 18%,#000 80%,transparent);
    mask-image:linear-gradient(90deg,transparent,#000 18%,#000 80%,transparent)
  }
  .home-page .hero-media{
    width:100%;height:300px;margin:0;
    -webkit-clip-path:ellipse(122% 82% at 100% 36%);clip-path:ellipse(122% 82% at 100% 36%)
  }
  .home-page .hero-media video{object-position:58% center}
  .home-page .stock-cards{left:14px;right:14px;bottom:12px;gap:8px}
  .home-page .stock-cards>div{width:auto;min-width:0;flex:1;height:55px;padding:6px 4px}
}

@media (prefers-reduced-motion:reduce){.home-page .blueprint{animation:none!important}}


/* ===== reference-final-v8.css ===== */
/* V8 reference alignment: exact separation of technical SVG artwork, gold SVG curve and live media. */

:root{--reference-gold:#c99a42;--reference-navy:#062f69}

/* ---------------- HOME HERO ----------------
   IMPORTANT: the SVG is NOT the video. The SVG files only define the clipping shape
   and the matching gold arc. The HTML5 video remains a separate live element. */
.home-page .reference-home-hero{
  position:relative!important;isolation:isolate!important;overflow:hidden!important;
  background:linear-gradient(108deg,#fff 0%,#fbfcfe 43%,#edf3f9 100%)!important;
}
.home-page .reference-home-hero .blueprint{
  display:block!important;position:absolute!important;z-index:1!important;
  background:var(--home-blueprint) center/contain no-repeat!important;
  opacity:.12!important;filter:none!important;pointer-events:none!important;
  -webkit-mask-image:linear-gradient(90deg,#000 0,#000 77%,transparent 100%)!important;
  mask-image:linear-gradient(90deg,#000 0,#000 77%,transparent 100%)!important;
}
.home-page .reference-home-hero .blueprint:before,
.home-page .reference-home-hero .blueprint:after,
.home-page .reference-home-hero .blueprint>span{display:none!important}
.home-page .reference-home-hero .hero-copy{position:relative!important;z-index:6!important}
.home-page .reference-home-hero .hero-media{
  position:relative!important;z-index:2!important;overflow:visible!important;
  border-radius:0!important;box-shadow:none!important;filter:none!important;
  -webkit-clip-path:none!important;clip-path:none!important;background:transparent!important;
}
.home-page .reference-home-hero .hero-media:before{display:none!important}
.home-page .reference-home-hero .hero-media video{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  object-fit:cover!important;z-index:1!important;border-radius:0!important;
  -webkit-clip-path:none!important;clip-path:none!important;
  -webkit-mask-repeat:no-repeat!important;mask-repeat:no-repeat!important;
  -webkit-mask-position:0 0!important;mask-position:0 0!important;
  -webkit-mask-size:100% 100%!important;mask-size:100% 100%!important;
}
.home-page .hero-gold-arc{
  position:absolute!important;inset:0!important;z-index:3!important;width:100%!important;height:100%!important;
  display:block!important;pointer-events:none!important;background-position:0 0!important;
  background-repeat:no-repeat!important;background-size:100% 100%!important;
}
.home-page .video-toggle{z-index:7!important}
.home-page .stock-cards{z-index:8!important;align-items:stretch!important}
.home-page .stock-cards>div{
  display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
  border:1px solid #bb8530!important;border-radius:10px!important;color:#2a251d!important;
  background:linear-gradient(118deg,rgba(250,238,211,.96),rgba(223,188,129,.95) 56%,rgba(205,159,84,.95))!important;
  box-shadow:0 8px 24px rgba(72,48,13,.16),inset 0 1px rgba(255,255,255,.8)!important;
  -webkit-backdrop-filter:blur(10px)!important;backdrop-filter:blur(10px)!important;
}

@media (min-width:981px){
  .home-page .top{position:fixed!important;top:18px!important;left:3.2%!important;right:3.2%!important;z-index:80!important}
  .home-page .reference-home-hero{min-height:650px!important;display:grid!important;grid-template-columns:35% 65%!important;padding:0 0 72px!important}
  .home-page .reference-home-hero .blueprint{left:1.5%!important;top:54px!important;width:39%!important;height:575px!important;opacity:.12!important}
  .home-page .reference-home-hero .hero-copy{padding:112px 12px 30px clamp(42px,3.7vw,66px)!important;align-self:center!important}
  .home-page .reference-home-hero h1{max-width:500px!important;font-size:clamp(39px,3.35vw,55px)!important;line-height:1.055!important}
  .home-page .reference-home-hero .hero-copy>p:not(.eyebrow){max-width:395px!important;line-height:1.52!important}
  .home-page .reference-home-hero .hero-media{height:640px!important;margin-left:-11%!important;width:111%!important;align-self:start!important}
  .home-page .reference-home-hero .hero-media video{
    object-position:52% center!important;
    -webkit-mask-image:url('../media/home-mask-desktop.svg')!important;
    mask-image:url('../media/home-mask-desktop.svg')!important;
  }
  .home-page .hero-gold-arc{background-image:url('../media/home-arc-desktop.svg')!important}
  .home-page .reference-home-hero .stock-cards{left:18%!important;bottom:37px!important;gap:22px!important}
  .home-page .reference-home-hero .stock-cards>div{width:205px!important;min-width:205px!important;height:72px!important;padding:10px 14px!important}
  .home-page .reference-home-hero .stock-cards strong{font-size:23px!important;line-height:1.04!important}
  .home-page .reference-home-hero .stock-cards span{font-size:12px!important;line-height:1.15!important}
  .home-page .reference-home-hero .video-toggle{left:20%!important;bottom:121px!important}
}

@media (min-width:601px) and (max-width:980px){
  .home-page .top{position:fixed!important;top:10px!important;left:14px!important;right:14px!important;z-index:80!important}
  .home-page .reference-home-hero{min-height:555px!important;display:grid!important;grid-template-columns:36% 64%!important;padding:68px 0 68px!important}
  .home-page .reference-home-hero .blueprint{left:0!important;top:67px!important;width:45%!important;height:410px!important;opacity:.115!important}
  .home-page .reference-home-hero .hero-copy{padding:39px 8px 16px 18px!important;align-self:center!important}
  .home-page .reference-home-hero h1{font-size:clamp(27px,4.8vw,38px)!important;line-height:1.05!important;min-height:0!important}
  .home-page .reference-home-hero .hero-copy>p:not(.eyebrow){font-size:12px!important;line-height:1.42!important}
  .home-page .reference-home-hero .actions{gap:8px!important;margin-top:15px!important}
  .home-page .reference-home-hero .actions .btn{padding:9px 11px!important;font-size:10px!important}
  .home-page .reference-home-hero .hero-media{height:430px!important;margin-left:-14%!important;width:114%!important}
  .home-page .reference-home-hero .hero-media video{
    object-position:57% center!important;
    -webkit-mask-image:url('../media/home-mask-tablet.svg')!important;
    mask-image:url('../media/home-mask-tablet.svg')!important;
  }
  .home-page .hero-gold-arc{background-image:url('../media/home-arc-tablet.svg')!important}
  .home-page .reference-home-hero .stock-cards{left:14%!important;right:4%!important;bottom:16px!important;gap:8px!important}
  .home-page .reference-home-hero .stock-cards>div{min-width:0!important;flex:1!important;height:61px!important;padding:6px 4px!important}
  .home-page .reference-home-hero .stock-cards strong{font-size:18px!important}
  .home-page .reference-home-hero .stock-cards span{font-size:9px!important}
  .home-page .reference-home-hero .video-toggle{left:18%!important;bottom:84px!important}
}

@media (max-width:600px){
  .home-page .top{position:fixed!important;top:7px!important;left:8px!important;right:8px!important;z-index:80!important}
  .home-page .reference-home-hero{display:block!important;min-height:420px!important;padding:62px 0 0!important;background:linear-gradient(105deg,#fff 0,#f9fbfd 61%,#eef4fa 100%)!important}
  .home-page .reference-home-hero .blueprint{
    display:block!important;left:-3%!important;top:63px!important;width:57%!important;height:246px!important;
    opacity:.14!important;background-position:left top!important;background-size:contain!important;
    -webkit-mask-image:linear-gradient(90deg,#000 0,#000 82%,transparent 100%)!important;
    mask-image:linear-gradient(90deg,#000 0,#000 82%,transparent 100%)!important;
  }
  .home-page .reference-home-hero .hero-copy{
    position:absolute!important;left:12px!important;top:91px!important;width:34%!important;padding:5px 4px 7px 0!important;z-index:7!important;
    isolation:isolate!important;
  }
  .home-page .reference-home-hero .hero-copy:before{
    content:"";position:absolute;z-index:-1;inset:-7px -13px -9px -7px;border-radius:10px;
    background:linear-gradient(90deg,rgba(255,255,255,.70),rgba(255,255,255,.42) 70%,rgba(255,255,255,.04));
    -webkit-backdrop-filter:blur(2.5px);backdrop-filter:blur(2.5px);pointer-events:none;
  }
  .home-page .reference-home-hero .hero-copy .eyebrow{font-size:7px!important;margin:0 0 5px!important}
  .home-page .reference-home-hero h1{font-size:clamp(17px,5.2vw,23px)!important;line-height:1.03!important;min-height:0!important;margin:4px 0 7px!important}
  .home-page .reference-home-hero .hero-copy>p:not(.eyebrow){font-size:8px!important;line-height:1.32!important;margin:0!important}
  .home-page .reference-home-hero .actions{display:none!important}
  .home-page .reference-home-hero .hero-media{position:absolute!important;left:0!important;right:0!important;top:62px!important;height:300px!important;width:100%!important;margin:0!important;z-index:3!important}
  .home-page .reference-home-hero .hero-media video{
    object-position:63% center!important;
    -webkit-mask-image:url('../media/home-mask-mobile.svg')!important;
    mask-image:url('../media/home-mask-mobile.svg')!important;
  }
  .home-page .hero-gold-arc{background-image:url('../media/home-arc-mobile.svg')!important}
  .home-page .reference-home-hero .stock-cards{left:12px!important;right:12px!important;bottom:-48px!important;gap:7px!important}
  .home-page .reference-home-hero .stock-cards>div{min-width:0!important;flex:1!important;height:56px!important;padding:5px 3px!important}
  .home-page .reference-home-hero .stock-cards strong{font-size:14px!important;line-height:1.03!important}
  .home-page .reference-home-hero .stock-cards span{font-size:7px!important;line-height:1.12!important}
  .home-page .reference-home-hero .video-toggle{left:31%!important;bottom:21px!important;width:29px!important;height:29px!important}
  .home-page .quick{margin:-6px auto 9px!important}
}

/* ---------------- PRODUCT / SERVICE DETAIL HERO ----------------
   These pages use a still HERO IMAGE, never the Home video. The technical SVG/PNG
   background remains behind the left text, while the hero image is clipped by its
   own responsive SVG mask and bordered by the identical gold SVG arc. */
.detail-page .reference-detail-hero{
  position:relative!important;isolation:isolate!important;overflow:hidden!important;padding:0!important;
  display:block!important;background:linear-gradient(102deg,#fff 0,#f9fbfd 53%,#edf4fa 100%)!important;border-radius:0!important;
}
.detail-page .reference-detail-hero:after{display:none!important}
.detail-page .reference-detail-hero .detail-hero-copy{
  position:absolute!important;z-index:5!important;isolation:isolate!important;overflow:visible!important;
  border-radius:0!important;background:transparent!important;
}
.detail-page .reference-detail-hero .detail-hero-copy.has-technical-background:before{
  content:"";position:absolute;z-index:-2;pointer-events:none;
  background:var(--technical-bg) left center/contain no-repeat!important;opacity:.12!important;
  mix-blend-mode:multiply;filter:saturate(.55) contrast(.92);
}
.detail-page .reference-detail-hero .detail-hero-copy.has-technical-background:after{
  content:"";position:absolute;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,rgba(255,255,255,.90),rgba(255,255,255,.62) 72%,rgba(255,255,255,0));
}
.detail-page .detail-hero-media{
  position:absolute!important;inset:0!important;z-index:2!important;width:100%!important;height:100%!important;overflow:visible!important;background:transparent!important;
}
.detail-page .detail-hero-media img{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;
  -webkit-clip-path:none!important;clip-path:none!important;
  -webkit-mask-repeat:no-repeat!important;mask-repeat:no-repeat!important;
  -webkit-mask-position:0 0!important;mask-position:0 0!important;
  -webkit-mask-size:100% 100%!important;mask-size:100% 100%!important;
}
.detail-page .detail-gold-arc{
  position:absolute!important;inset:0!important;z-index:3!important;width:100%!important;height:100%!important;
  display:block!important;pointer-events:none!important;background-repeat:no-repeat!important;background-position:0 0!important;background-size:100% 100%!important;
}
.detail-page .vertical-category{display:none!important}

@media (min-width:981px){
  .detail-page .reference-detail-hero{height:350px!important;min-height:350px!important}
  .detail-page .reference-detail-hero .detail-hero-copy{left:0!important;top:0!important;width:42%!important;height:100%!important;padding:108px 20px 30px clamp(42px,4vw,64px)!important}
  .detail-page .reference-detail-hero .detail-hero-copy.has-technical-background:before{inset:12% -2% 2% -8%!important;background-size:92% auto!important;background-position:left center!important}
  .detail-page .reference-detail-hero .detail-hero-copy.has-technical-background:after{inset:0 -5% 0 0!important}
  .detail-page .reference-detail-hero .crumb{font-size:11px!important;margin:0 0 9px!important}
  .detail-page .reference-detail-hero h1{font-size:clamp(30px,2.6vw,43px)!important;line-height:1.06!important;max-width:520px!important;margin:7px 0 10px!important}
  .detail-page .reference-detail-hero .detail-hero-copy>p:last-child{font-size:13px!important;line-height:1.48!important;max-width:435px!important}
  .detail-page .detail-hero-media img{
    object-position:64% center!important;
    -webkit-mask-image:url('../media/detail-mask-desktop.svg')!important;
    mask-image:url('../media/detail-mask-desktop.svg')!important;
  }
  .detail-page .detail-gold-arc{background-image:url('../media/detail-arc-desktop.svg')!important}
}

@media (min-width:601px) and (max-width:980px){
  .detail-page .reference-detail-hero{height:315px!important;min-height:315px!important}
  .detail-page .reference-detail-hero .detail-hero-copy{left:0!important;top:0!important;width:45%!important;height:100%!important;padding:78px 15px 22px 22px!important}
  .detail-page .reference-detail-hero .detail-hero-copy.has-technical-background:before{inset:8% -4% 0 -8%!important;background-size:94% auto!important;background-position:left center!important;opacity:.115!important}
  .detail-page .reference-detail-hero .detail-hero-copy.has-technical-background:after{inset:0 -4% 0 0!important}
  .detail-page .reference-detail-hero .crumb{font-size:8px!important;margin:0 0 7px!important}
  .detail-page .reference-detail-hero h1{font-size:clamp(24px,4vw,32px)!important;line-height:1.05!important;margin:6px 0 8px!important}
  .detail-page .reference-detail-hero .detail-hero-copy>p:last-child{font-size:10px!important;line-height:1.42!important}
  .detail-page .detail-hero-media img{
    object-position:68% center!important;
    -webkit-mask-image:url('../media/detail-mask-tablet.svg')!important;
    mask-image:url('../media/detail-mask-tablet.svg')!important;
  }
  .detail-page .detail-gold-arc{background-image:url('../media/detail-arc-tablet.svg')!important}
  .detail-page .detail-tabs{top:72px!important}
}

@media (max-width:600px){
  .detail-page .reference-detail-hero{height:292px!important;min-height:292px!important;background:linear-gradient(106deg,#fff 0,#fafcfe 61%,#eef4fa 100%)!important}
  .detail-page .reference-detail-hero .detail-hero-copy{
    left:13px!important;top:105px!important;width:46%!important;height:auto!important;padding:7px 4px 9px 0!important;z-index:5!important;
  }
  .detail-page .reference-detail-hero .detail-hero-copy:after{
    inset:-8px -16px -10px -8px!important;border-radius:10px!important;
    background:linear-gradient(90deg,rgba(255,255,255,.76),rgba(255,255,255,.45) 72%,rgba(255,255,255,.03))!important;
    -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
  }
  .detail-page .reference-detail-hero .detail-hero-copy.has-technical-background:before{
    inset:-22px -24px -20px -10px!important;background-size:155% auto!important;background-position:left center!important;opacity:.14!important;
  }
  .detail-page .reference-detail-hero .crumb{font-size:7px!important;margin:0 0 4px!important}
  .detail-page .reference-detail-hero h1{font-size:clamp(17px,5.1vw,22px)!important;line-height:1.04!important;margin:4px 0 5px!important}
  .detail-page .reference-detail-hero .detail-hero-copy>p:last-child{font-size:8px!important;line-height:1.34!important;max-width:100%!important;margin:0!important}
  .detail-page .detail-hero-media img{
    object-position:73% center!important;
    -webkit-mask-image:url('../media/detail-mask-mobile.svg')!important;
    mask-image:url('../media/detail-mask-mobile.svg')!important;
  }
  .detail-page .detail-gold-arc{background-image:url('../media/detail-arc-mobile.svg')!important}
  .detail-page .detail-tabs{top:62px!important}
}

/* ---------------- CONTACT POPUP: CONTENT ALWAYS EXPANDED ---------------- */
.support-contact.support-contact-open{
  display:block;margin:8px 0;padding:11px 12px;border:1px solid #dfe7f0;border-radius:10px;background:#fff;box-shadow:0 5px 18px rgba(6,43,92,.06)
}
.support-contact-open .support-contact-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:8px}
.support-contact-open .support-contact-head span{display:flex;flex-direction:column}
.support-contact-open .support-contact-head b{font-size:13px;color:#092d63;line-height:1.25}
.support-contact-open .support-contact-head small{margin-top:2px;font-size:10px;font-weight:400;color:#5e6c80;line-height:1.3}
.support-contact-open .contact-actions{display:flex!important;align-items:center;gap:14px;padding:0!important;border:0!important}
.support-contact-open .contact-actions a{display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:700;color:#0a3d7b}
.support-contact-open .contact-actions .icon{width:14px;height:14px}
.support-contact-open .contact-actions .contact-wa{color:#078c4d}
.support-modal .modal-card{overscroll-behavior:contain}

@media (max-width:600px){
  .support-contact.support-contact-open{padding:9px 10px;margin:6px 0}
  .support-contact-open .support-contact-head{margin-bottom:6px}
  .support-contact-open .support-contact-head b{font-size:11px}
  .support-contact-open .support-contact-head small{font-size:8px}
  .support-contact-open .contact-actions{gap:12px;flex-wrap:wrap}
  .support-contact-open .contact-actions a{font-size:9px}
  .support-modal .modal-card{max-height:78vh!important;overflow:auto!important}
}

/* Detail-page header follows the approved reference: floating logo/nav/quote over the hero. */
@media (min-width:981px){
  body.detail-page{padding-top:0!important}
  .detail-page .top{
    position:fixed!important;top:18px!important;left:3.2%!important;right:3.2%!important;width:auto!important;height:66px!important;
    display:grid!important;grid-template-columns:220px minmax(0,1fr) 130px!important;align-items:center!important;gap:18px!important;
    padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;z-index:80!important
  }
  .detail-page .brand{position:static!important;width:220px!important;margin:0!important;justify-self:start!important}
  .detail-page .top nav{
    width:max-content!important;min-height:48px!important;margin:0!important;justify-self:center!important;padding:4px 25px!important;
    gap:clamp(12px,1.7vw,27px)!important;border:1px solid rgba(255,255,255,.72)!important;border-radius:11px!important;
    background:rgba(255,255,255,.80)!important;box-shadow:0 9px 28px rgba(6,41,93,.07)!important;backdrop-filter:blur(18px)!important
  }
  .detail-page .top>.gold{position:static!important;margin:0!important;justify-self:end!important;background:rgba(255,255,255,.78)!important;color:#8a5a13!important;border:1px solid #c99a42!important}
}
@media (min-width:601px) and (max-width:980px){
  body.detail-page{padding-top:0!important}
  .detail-page .top{position:fixed!important;top:10px!important;left:12px!important;right:12px!important;width:auto!important;height:56px!important;padding:6px 10px!important;border:1px solid rgba(255,255,255,.72)!important;border-radius:10px!important;background:rgba(255,255,255,.82)!important;box-shadow:0 8px 22px rgba(6,41,93,.07)!important;z-index:80!important}
  .detail-page .brand{width:168px!important;margin-right:auto!important}
}
@media (max-width:600px){
  body.detail-page{padding-top:0!important}
  .detail-page .top{position:fixed!important;top:7px!important;left:8px!important;right:8px!important;width:auto!important;height:54px!important;padding:5px 8px!important;border:0!important;border-radius:10px!important;background:rgba(255,255,255,.74)!important;box-shadow:0 7px 20px rgba(6,41,93,.06)!important;backdrop-filter:blur(13px)!important;z-index:80!important}
  .detail-page .brand{width:135px!important;margin-right:auto!important}
}


/* ===== reference-final-v9.css ===== */
/* V9: reference-traced hero geometry.
   SVG = only mask + gold arc. Home media remains a real HTML5 video.
   Product/service media remains a real IMG. Media framing is independent of the SVG. */

:root{--v9-gold:#d1a04a}

/* ================================================================
   HOME HERO — media wrapper and independent live video
   ================================================================ */
.home-page .reference-home-hero{
  position:relative!important;display:block!important;isolation:isolate!important;overflow:hidden!important;
  padding:0!important;background:linear-gradient(108deg,#fff 0%,#fbfcfe 46%,#edf3f9 100%)!important;
}
.home-page .reference-home-hero .hero-copy{position:absolute!important;z-index:8!important}
.home-page .reference-home-hero .hero-media{
  position:absolute!important;z-index:2!important;overflow:visible!important;margin:0!important;
  border-radius:0!important;box-shadow:none!important;filter:none!important;background:transparent!important;
}
.home-page .reference-home-hero .hero-media:before{display:none!important}
.home-page .hero-video-clip{
  position:absolute!important;inset:0!important;z-index:1!important;overflow:hidden!important;
  -webkit-mask-repeat:no-repeat!important;mask-repeat:no-repeat!important;
  -webkit-mask-position:0 0!important;mask-position:0 0!important;
  -webkit-mask-size:100% 100%!important;mask-size:100% 100%!important;
}
.home-page .hero-video-clip video,
.home-page .reference-home-hero .hero-media video{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  object-fit:cover!important;border-radius:0!important;z-index:1!important;
  -webkit-mask-image:none!important;mask-image:none!important;
  -webkit-clip-path:none!important;clip-path:none!important;
  will-change:transform!important;
}
.home-page .hero-gold-arc{
  position:absolute!important;inset:0!important;z-index:5!important;display:block!important;
  width:100%!important;height:100%!important;pointer-events:none!important;
  background-repeat:no-repeat!important;background-position:0 0!important;background-size:100% 100%!important;
}
.home-page .reference-home-hero .blueprint{z-index:1!important}
.home-page .reference-home-hero .stock-cards{z-index:9!important}
.home-page .reference-home-hero .video-toggle{z-index:10!important}

@media (min-width:981px){
  .home-page .reference-home-hero{height:clamp(570px,42vw,650px)!important;min-height:570px!important}
  .home-page .reference-home-hero .blueprint{
    left:1.4%!important;top:52px!important;width:36%!important;height:calc(100% - 70px)!important;opacity:.13!important;
    background-position:left center!important;background-size:contain!important;
  }
  .home-page .reference-home-hero .hero-copy{
    left:clamp(38px,3.4vw,62px)!important;top:clamp(120px,15vh,150px)!important;width:31.5%!important;
    padding:0!important;
  }
  .home-page .reference-home-hero h1{font-size:clamp(40px,3.45vw,56px)!important;line-height:1.045!important;max-width:510px!important}
  .home-page .reference-home-hero .hero-copy>p:not(.eyebrow){max-width:390px!important}

  /* Reference: media starts exactly at the 35% text boundary. No negative margin. */
  .home-page .reference-home-hero .hero-media{top:0!important;right:0!important;width:65%!important;height:100%!important;left:auto!important}
  .home-page .hero-video-clip{
    -webkit-mask-image:url('../media/home-v9-desktop-mask.svg')!important;
    mask-image:url('../media/home-v9-desktop-mask.svg')!important;
  }
  /* The reference video is more zoomed and its chain sits farther right than V8. */
  .home-page .hero-video-clip video{
    object-position:center 47%!important;transform:scale(1.22)!important;transform-origin:left center!important;
  }
  .home-page .hero-gold-arc{background-image:url('../media/home-v9-desktop-arc.svg')!important}
  .home-page .reference-home-hero .stock-cards{left:12%!important;right:auto!important;bottom:24px!important;gap:18px!important}
  .home-page .reference-home-hero .stock-cards>div{width:205px!important;min-width:205px!important;height:72px!important}
  .home-page .reference-home-hero .video-toggle{left:16%!important;bottom:111px!important}
}

@media (min-width:601px) and (max-width:980px){
  .home-page .reference-home-hero{height:520px!important;min-height:520px!important;padding:0!important}
  .home-page .reference-home-hero .blueprint{
    left:0!important;top:58px!important;width:36%!important;height:350px!important;opacity:.15!important;
    background-position:left top!important;background-size:contain!important;
  }
  .home-page .reference-home-hero .hero-copy{
    left:15px!important;top:96px!important;width:29%!important;padding:0!important;z-index:8!important;
  }
  .home-page .reference-home-hero h1{font-size:clamp(24px,4.4vw,34px)!important;line-height:1.035!important;min-height:0!important;margin:6px 0 9px!important}
  .home-page .reference-home-hero .hero-copy>p:not(.eyebrow){font-size:10px!important;line-height:1.38!important}
  .home-page .reference-home-hero .actions{display:none!important}

  /* Tablet reference is a full-width leaf shape behind the floating header. */
  .home-page .reference-home-hero .hero-media{top:0!important;left:0!important;right:0!important;width:100%!important;height:100%!important}
  .home-page .hero-video-clip{
    -webkit-mask-image:url('../media/home-v9-tablet-mask.svg')!important;
    mask-image:url('../media/home-v9-tablet-mask.svg')!important;
  }
  .home-page .hero-video-clip video{
    object-position:center 48%!important;transform:scale(1.30)!important;transform-origin:left center!important;
  }
  .home-page .hero-gold-arc{background-image:url('../media/home-v9-tablet-arc.svg')!important}
  .home-page .reference-home-hero .stock-cards{left:3.5%!important;right:32%!important;bottom:22px!important;gap:9px!important}
  .home-page .reference-home-hero .stock-cards>div{min-width:0!important;flex:1!important;height:61px!important;padding:6px 5px!important}
  .home-page .reference-home-hero .stock-cards strong{font-size:18px!important}
  .home-page .reference-home-hero .stock-cards span{font-size:9px!important}
  .home-page .reference-home-hero .video-toggle{left:38%!important;bottom:89px!important}
}

@media (max-width:600px){
  .home-page .reference-home-hero{height:390px!important;min-height:390px!important;padding:0!important;background:#f9fbfd!important}
  .home-page .reference-home-hero .blueprint{
    display:block!important;left:-1%!important;top:60px!important;width:39%!important;height:255px!important;opacity:.18!important;
    background-position:left top!important;background-size:contain!important;
    -webkit-mask-image:linear-gradient(90deg,#000 0,#000 84%,transparent 100%)!important;
    mask-image:linear-gradient(90deg,#000 0,#000 84%,transparent 100%)!important;
  }
  .home-page .reference-home-hero .hero-copy{
    left:12px!important;top:93px!important;width:29%!important;padding:0!important;z-index:8!important;isolation:isolate!important;
  }
  .home-page .reference-home-hero .hero-copy:before{
    content:""!important;position:absolute!important;z-index:-1!important;inset:-8px -9px -10px -7px!important;border-radius:9px!important;
    background:linear-gradient(90deg,rgba(255,255,255,.88),rgba(255,255,255,.68) 72%,rgba(255,255,255,.10))!important;
    -webkit-backdrop-filter:blur(4px)!important;backdrop-filter:blur(4px)!important;pointer-events:none!important;
  }
  .home-page .reference-home-hero .hero-copy .eyebrow{font-size:7px!important;margin:0 0 5px!important}
  .home-page .reference-home-hero h1{font-size:clamp(16px,4.8vw,21px)!important;line-height:1.025!important;min-height:0!important;margin:4px 0 7px!important}
  .home-page .reference-home-hero .hero-copy>p:not(.eyebrow){font-size:7.5px!important;line-height:1.32!important;margin:0!important}
  .home-page .reference-home-hero .actions{display:none!important}

  /* Mobile reference: video starts behind the header and forms the asymmetric leaf. */
  .home-page .reference-home-hero .hero-media{top:0!important;left:0!important;right:0!important;width:100%!important;height:100%!important}
  .home-page .hero-video-clip{
    -webkit-mask-image:url('../media/home-v9-mobile-mask.svg')!important;
    mask-image:url('../media/home-v9-mobile-mask.svg')!important;
  }
  .home-page .hero-video-clip video{
    object-position:center 47%!important;transform:scale(1.34)!important;transform-origin:left center!important;
  }
  .home-page .hero-gold-arc{background-image:url('../media/home-v9-mobile-arc.svg')!important}
  .home-page .reference-home-hero .stock-cards{left:2.8%!important;right:7.5%!important;bottom:10px!important;gap:7px!important}
  .home-page .reference-home-hero .stock-cards>div{min-width:0!important;flex:1!important;height:57px!important;padding:5px 4px!important}
  .home-page .reference-home-hero .stock-cards strong{font-size:14px!important;line-height:1.02!important}
  .home-page .reference-home-hero .stock-cards span{font-size:7px!important;line-height:1.1!important}
  .home-page .reference-home-hero .video-toggle{left:24%!important;bottom:83px!important;width:29px!important;height:29px!important}
  .home-page .quick{margin:0 auto 9px!important}
}

/* ================================================================
   PRODUCT / SERVICE DETAIL HERO — independent IMG inside SVG clip
   ================================================================ */
.detail-page .reference-detail-hero{position:relative!important;overflow:hidden!important;isolation:isolate!important;padding:0!important}
.detail-page .detail-hero-media{position:absolute!important;inset:0!important;z-index:2!important;width:100%!important;height:100%!important;overflow:visible!important}
.detail-page .detail-image-clip{
  position:absolute!important;inset:0!important;z-index:1!important;overflow:hidden!important;
  -webkit-mask-repeat:no-repeat!important;mask-repeat:no-repeat!important;
  -webkit-mask-position:0 0!important;mask-position:0 0!important;
  -webkit-mask-size:100% 100%!important;mask-size:100% 100%!important;
}
.detail-page .detail-image-clip img,
.detail-page .detail-hero-media>img{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;
  -webkit-mask-image:none!important;mask-image:none!important;-webkit-clip-path:none!important;clip-path:none!important;
}
.detail-page .detail-gold-arc{z-index:4!important;background-size:100% 100%!important}
.detail-page .reference-detail-hero .detail-hero-copy{z-index:6!important}

@media (min-width:981px){
  .detail-page .reference-detail-hero{height:360px!important;min-height:360px!important}
  .detail-page .detail-image-clip{
    -webkit-mask-image:url('../media/detail-v9-desktop-mask.svg')!important;
    mask-image:url('../media/detail-v9-desktop-mask.svg')!important;
  }
  .detail-page .detail-image-clip img{object-position:center center!important;transform:scale(1.035)!important;transform-origin:center!important}
  .detail-page .detail-gold-arc{background-image:url('../media/detail-v9-desktop-arc.svg')!important}
  .detail-page .reference-detail-hero .detail-hero-copy{width:39%!important;padding-top:112px!important}
  .detail-page .reference-detail-hero .detail-hero-copy.has-technical-background:before{opacity:.14!important;background-size:96% auto!important}
}

@media (min-width:601px) and (max-width:980px){
  .detail-page .reference-detail-hero{height:330px!important;min-height:330px!important}
  .detail-page .detail-image-clip{
    -webkit-mask-image:url('../media/detail-v9-tablet-mask.svg')!important;
    mask-image:url('../media/detail-v9-tablet-mask.svg')!important;
  }
  .detail-page .detail-image-clip img{object-position:center center!important;transform:scale(1.04)!important;transform-origin:center!important}
  .detail-page .detail-gold-arc{background-image:url('../media/detail-v9-tablet-arc.svg')!important}
  .detail-page .reference-detail-hero .detail-hero-copy{width:38%!important;padding-top:82px!important}
  .detail-page .reference-detail-hero .detail-hero-copy.has-technical-background:before{opacity:.14!important}
}

@media (max-width:600px){
  .detail-page .reference-detail-hero{height:300px!important;min-height:300px!important;background:#f9fbfd!important}
  .detail-page .detail-image-clip{
    -webkit-mask-image:url('../media/detail-v9-mobile-mask.svg')!important;
    mask-image:url('../media/detail-v9-mobile-mask.svg')!important;
  }
  .detail-page .detail-image-clip img{object-position:center center!important;transform:scale(1.04)!important;transform-origin:center!important}
  .detail-page .detail-gold-arc{background-image:url('../media/detail-v9-mobile-arc.svg')!important}
  .detail-page .reference-detail-hero .detail-hero-copy{left:12px!important;top:104px!important;width:39%!important;padding:6px 2px 8px 0!important}
  .detail-page .reference-detail-hero .detail-hero-copy:after{
    inset:-8px -12px -10px -8px!important;background:linear-gradient(90deg,rgba(255,255,255,.90),rgba(255,255,255,.68) 74%,rgba(255,255,255,.08))!important;
    -webkit-backdrop-filter:blur(4px)!important;backdrop-filter:blur(4px)!important;
  }
  .detail-page .reference-detail-hero .detail-hero-copy.has-technical-background:before{opacity:.18!important;background-size:165% auto!important}
}


/* ===== reference-final-v10.css ===== */

/* V10: use one inline SVG path for both clip and gold arc so they cannot separate */
.hero-shape-defs,.detail-shape-defs{position:absolute!important;width:0!important;height:0!important;overflow:hidden!important}
.home-page .hero-media,.detail-page .detail-hero-media{overflow:visible!important}
.home-page .hero-video-clip,.detail-page .detail-image-clip{position:absolute!important;inset:0!important;overflow:hidden!important;background:transparent!important}
.home-page .hero-video-clip video,.detail-page .detail-image-clip img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important}
.home-page .hero-gold-arc,.detail-page .detail-gold-arc{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;display:none;pointer-events:none;overflow:visible!important;background:none!important}
.home-page .hero-gold-arc path,.detail-page .detail-gold-arc path{fill:none;stroke:#d1a04a;stroke-width:1.5;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}

@media (min-width:981px){
  .home-page .hero-video-clip{-webkit-clip-path:url(#homeHeroClipDesktop)!important;clip-path:url(#homeHeroClipDesktop)!important}
  .home-page .hero-arc-desktop{display:block!important}
  .home-page .hero-arc-tablet,.home-page .hero-arc-mobile{display:none!important}
  .detail-page .detail-image-clip{-webkit-clip-path:url(#detailHeroClipDesktop)!important;clip-path:url(#detailHeroClipDesktop)!important}
  .detail-page .detail-arc-desktop{display:block!important}
  .detail-page .detail-arc-tablet,.detail-page .detail-arc-mobile{display:none!important}
}
@media (min-width:601px) and (max-width:980px){
  .home-page .hero-video-clip{-webkit-clip-path:url(#homeHeroClipTablet)!important;clip-path:url(#homeHeroClipTablet)!important}
  .home-page .hero-arc-tablet{display:block!important}
  .home-page .hero-arc-desktop,.home-page .hero-arc-mobile{display:none!important}
  .detail-page .detail-image-clip{-webkit-clip-path:url(#detailHeroClipTablet)!important;clip-path:url(#detailHeroClipTablet)!important}
  .detail-page .detail-arc-tablet{display:block!important}
  .detail-page .detail-arc-desktop,.detail-page .detail-arc-mobile{display:none!important}
}
@media (max-width:600px){
  .home-page .hero-video-clip{-webkit-clip-path:url(#homeHeroClipMobile)!important;clip-path:url(#homeHeroClipMobile)!important}
  .home-page .hero-arc-mobile{display:block!important}
  .home-page .hero-arc-desktop,.home-page .hero-arc-tablet{display:none!important}
  .detail-page .detail-image-clip{-webkit-clip-path:url(#detailHeroClipMobile)!important;clip-path:url(#detailHeroClipMobile)!important}
  .detail-page .detail-arc-mobile{display:block!important}
  .detail-page .detail-arc-desktop,.detail-page .detail-arc-tablet{display:none!important}
}


/* ===== reference-final-v11.css ===== */
/* V11 exact hero reconstruction: remove legacy masks, then use one path per breakpoint for both media edge and gold arc. */
.hero-shape-defs,.detail-shape-defs{position:absolute!important;width:0!important;height:0!important;overflow:hidden!important;pointer-events:none!important}

.home-page .reference-home-hero .hero-media,
.detail-page .reference-detail-hero .detail-hero-media{
  -webkit-clip-path:none!important;clip-path:none!important;
  -webkit-mask-image:none!important;mask-image:none!important;
  border-radius:0!important;box-shadow:none!important;filter:none!important;
  overflow:visible!important;
}
.home-page .reference-home-hero .hero-media:before,
.detail-page .reference-detail-hero .detail-hero-media:before{display:none!important}

.home-page .hero-video-clip,.detail-page .detail-image-clip{
  position:absolute!important;inset:0!important;z-index:1!important;
  -webkit-mask-image:none!important;mask-image:none!important;
  -webkit-mask:none!important;mask:none!important;
  overflow:hidden!important;background:transparent!important;
}
.home-page .hero-video-clip video,.detail-page .detail-image-clip img{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  object-fit:cover!important;-webkit-clip-path:none!important;clip-path:none!important;
  -webkit-mask-image:none!important;mask-image:none!important;
}
.home-page .hero-gold-arc,.detail-page .detail-gold-arc{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;z-index:3!important;
  display:none;pointer-events:none!important;overflow:visible!important;background:none!important;
}
.home-page .hero-gold-arc path,.detail-page .detail-gold-arc path{
  fill:none!important;stroke:#d0a04b!important;stroke-width:1.35!important;
  vector-effect:non-scaling-stroke!important;stroke-linecap:round!important;stroke-linejoin:round!important;
}

@media (min-width:981px){
  .home-page .hero-video-clip{-webkit-clip-path:url(#homeHeroClipDesktop)!important;clip-path:url(#homeHeroClipDesktop)!important}
  .home-page .hero-arc-desktop{display:block!important}
  .home-page .hero-arc-tablet,.home-page .hero-arc-mobile{display:none!important}
  .home-page .hero-video-clip video{transform:scale(1.20)!important;transform-origin:left center!important;object-position:center 47%!important}

  .detail-page .detail-image-clip{-webkit-clip-path:url(#detailHeroClipDesktop)!important;clip-path:url(#detailHeroClipDesktop)!important}
  .detail-page .detail-arc-desktop{display:block!important}
  .detail-page .detail-arc-tablet,.detail-page .detail-arc-mobile{display:none!important}
  .detail-page .detail-image-clip img{transform:scale(1.02)!important;object-position:62% center!important}
}

@media (min-width:601px) and (max-width:980px){
  .home-page .hero-video-clip{-webkit-clip-path:url(#homeHeroClipTablet)!important;clip-path:url(#homeHeroClipTablet)!important}
  .home-page .hero-arc-tablet{display:block!important}
  .home-page .hero-arc-desktop,.home-page .hero-arc-mobile{display:none!important}
  .home-page .hero-video-clip video{transform:scale(1.27)!important;transform-origin:left center!important;object-position:center 48%!important}

  .detail-page .detail-image-clip{-webkit-clip-path:url(#detailHeroClipTablet)!important;clip-path:url(#detailHeroClipTablet)!important}
  .detail-page .detail-arc-tablet{display:block!important}
  .detail-page .detail-arc-desktop,.detail-page .detail-arc-mobile{display:none!important}
  .detail-page .detail-image-clip img{transform:scale(1.02)!important;object-position:64% center!important}
}

@media (max-width:600px){
  .home-page .hero-video-clip{-webkit-clip-path:url(#homeHeroClipMobile)!important;clip-path:url(#homeHeroClipMobile)!important}
  .home-page .hero-arc-mobile{display:block!important}
  .home-page .hero-arc-desktop,.home-page .hero-arc-tablet{display:none!important}
  .home-page .hero-video-clip video{transform:scale(1.30)!important;transform-origin:left center!important;object-position:center 47%!important}

  /* Stronger white-glass copy field while keeping the technical line art visible. */
  .home-page .reference-home-hero .blueprint{opacity:.20!important;filter:saturate(.55) contrast(.92)!important}
  .home-page .reference-home-hero .hero-copy:before{
    background:linear-gradient(90deg,rgba(255,255,255,.94),rgba(255,255,255,.78) 72%,rgba(255,255,255,.08))!important;
    -webkit-backdrop-filter:blur(6px)!important;backdrop-filter:blur(6px)!important;
  }

  .detail-page .detail-image-clip{-webkit-clip-path:url(#detailHeroClipMobile)!important;clip-path:url(#detailHeroClipMobile)!important}
  .detail-page .detail-arc-mobile{display:block!important}
  .detail-page .detail-arc-desktop,.detail-page .detail-arc-tablet{display:none!important}
  .detail-page .detail-image-clip img{transform:scale(1.01)!important;object-position:66% center!important}
}


/* ===== reference-final-v12.css ===== */
/* V12 - approved-reference geometry correction.
   Critical fix: Home media geometry is full-hero width on every breakpoint.
   Gold arc = outer traced contour; video = slightly inset parallel contour,
   leaving the narrow white band visible in the supplied reference. */

/* Do not let any older mask/ellipse layer participate. */
.home-page .reference-home-hero .hero-media,
.home-page .hero-video-clip{
  -webkit-mask:none!important;mask:none!important;
  -webkit-mask-image:none!important;mask-image:none!important;
  border-radius:0!important;filter:none!important;box-shadow:none!important;
}
.home-page .reference-home-hero .hero-media{
  top:0!important;left:0!important;right:0!important;width:100%!important;height:100%!important;
  position:absolute!important;overflow:visible!important;margin:0!important;
}
.home-page .hero-video-clip{position:absolute!important;inset:0!important;overflow:hidden!important}
.home-page .hero-video-clip video{
  top:0!important;bottom:0!important;right:auto!important;height:100%!important;
  transform:none!important;transform-origin:center!important;border-radius:0!important;
  object-fit:cover!important;
}
.home-page .hero-gold-arc{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  z-index:6!important;pointer-events:none!important;background:none!important;overflow:visible!important;
}
.home-page .hero-gold-arc path{
  fill:none!important;stroke:#d1a04a!important;stroke-width:1.45!important;
  vector-effect:non-scaling-stroke!important;stroke-linecap:round!important;stroke-linejoin:round!important;
}

@media (min-width:981px){
  .home-page .hero-video-clip{-webkit-clip-path:url(#homeHeroClipDesktop)!important;clip-path:url(#homeHeroClipDesktop)!important}
  .home-page .hero-video-clip video{
    left:32%!important;width:68%!important;object-position:0% center!important;
  }
  .home-page .hero-arc-desktop{display:block!important}
  .home-page .hero-arc-tablet,.home-page .hero-arc-mobile{display:none!important}
  /* In the reference the first stock card begins at about 43% of the full hero width. */
  .home-page .reference-home-hero .stock-cards{left:43%!important;right:auto!important;bottom:24px!important;gap:18px!important}
  .home-page .reference-home-hero .video-toggle{left:45.5%!important;bottom:111px!important}
}

@media (min-width:601px) and (max-width:980px){
  .home-page .hero-video-clip{-webkit-clip-path:url(#homeHeroClipTablet)!important;clip-path:url(#homeHeroClipTablet)!important}
  .home-page .hero-video-clip video{
    left:27%!important;width:73%!important;object-position:40% center!important;
  }
  .home-page .hero-arc-tablet{display:block!important}
  .home-page .hero-arc-desktop,.home-page .hero-arc-mobile{display:none!important}
  .home-page .reference-home-hero .stock-cards{left:3.5%!important;right:32%!important;bottom:22px!important;gap:9px!important}
  .home-page .reference-home-hero .video-toggle{left:38%!important;bottom:89px!important}
}

@media (max-width:600px){
  .home-page .hero-video-clip{-webkit-clip-path:url(#homeHeroClipMobile)!important;clip-path:url(#homeHeroClipMobile)!important}
  .home-page .hero-video-clip video{
    left:10%!important;width:90%!important;object-position:30% center!important;
  }
  .home-page .hero-arc-mobile{display:block!important}
  .home-page .hero-arc-desktop,.home-page .hero-arc-tablet{display:none!important}
  .home-page .reference-home-hero .stock-cards{left:2.8%!important;right:7.5%!important;bottom:10px!important;gap:7px!important}
  .home-page .reference-home-hero .video-toggle{left:24%!important;bottom:83px!important}
  /* Preserve the stronger readable text field requested for mobile. */
  .home-page .reference-home-hero .blueprint{opacity:.20!important;filter:saturate(.55) contrast(.92)!important}
  .home-page .reference-home-hero .hero-copy:before{
    background:linear-gradient(90deg,rgba(255,255,255,.94),rgba(255,255,255,.78) 72%,rgba(255,255,255,.08))!important;
    -webkit-backdrop-filter:blur(6px)!important;backdrop-filter:blur(6px)!important;
  }
}

/* Product / Service detail hero: retain the approved geometry, but ensure no legacy ellipse/mask can override it. */
.detail-page .reference-detail-hero .detail-hero-media,
.detail-page .detail-image-clip{
  -webkit-mask:none!important;mask:none!important;-webkit-mask-image:none!important;mask-image:none!important;
  border-radius:0!important;box-shadow:none!important;filter:none!important;
}
.detail-page .detail-gold-arc{background:none!important}


/* ===== reference-final-v13.css ===== */

/* V13: mobile home text overlay + sticky detail tabs across all screens */

/* ---------- HOME: mobile/smaller screens only ---------- */
@media (max-width: 600px){
  .home-page .reference-home-hero{
    min-height: 430px !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
  .home-page .reference-home-hero .blueprint{
    display: none !important;
  }
  .home-page .reference-home-hero .hero-media{
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }
  .home-page .reference-home-hero .hero-video-clip{
    position: absolute !important;
    inset: 0 !important;
  }
  .home-page .reference-home-hero .hero-video-clip::after{
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
      linear-gradient(90deg, rgba(4,33,75,.50) 0%, rgba(4,33,75,.28) 24%, rgba(4,33,75,.08) 46%, rgba(4,33,75,0) 64%),
      linear-gradient(180deg, rgba(0,0,0,.10) 0%, rgba(0,0,0,0) 34%, rgba(0,0,0,.06) 100%) !important;
  }
  .home-page .reference-home-hero .hero-video-clip video{
    object-position: 66% center !important;
    transform: scale(1.02) !important;
    filter: brightness(.82) contrast(1.02) !important;
  }
  .home-page .reference-home-hero .hero-copy{
    position: absolute !important;
    left: 16px !important;
    top: 108px !important;
    z-index: 8 !important;
    width: min(42%, 180px) !important;
    max-width: 180px !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #fff !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.25) !important;
  }
  .home-page .reference-home-hero .hero-copy .eyebrow,
  .home-page .reference-home-hero .hero-copy p{
    color: #eef4ff !important;
  }
  .home-page .reference-home-hero .hero-copy h1{
    color: #ffffff !important;
    font-size: 14px !important;
    line-height: 1.15 !important;
    letter-spacing: -.01em !important;
    margin: 6px 0 10px !important;
    max-width: 100% !important;
  }
  .home-page .reference-home-hero .hero-copy p{
    font-size: 10px !important;
    line-height: 1.35 !important;
    margin: 0 0 8px !important;
    max-width: 95% !important;
  }
  .home-page .reference-home-hero .hero-copy .actions{
    display: none !important;
  }
  .home-page .reference-home-hero .stock-cards{
    z-index: 9 !important;
  }
}

/* ---------- PRODUCT/SERVICE DETAIL: sticky tabs until end of detail content ---------- */
.detail-content-shell{
  position: relative;
}
.detail-content-shell .detail-tabs{
  position: sticky !important;
  top: var(--detail-sticky-top, 92px) !important;
  z-index: 48 !important;
  background: rgba(255,255,255,.96) !important;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(12,58,120,.08);
  box-shadow: 0 8px 20px rgba(16,33,64,.06);
  border-radius: 14px;
  margin: 0 auto 14px !important;
  padding: 6px 8px !important;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  scrollbar-width: none;
}
.detail-content-shell .detail-tabs::-webkit-scrollbar{
  display: none;
}
.detail-content-shell .detail-tabs a{
  scroll-margin-top: var(--detail-scroll-margin, 150px);
}
.detail-content-shell #overview,
.detail-content-shell #specifications,
.detail-content-shell #applications,
.detail-content-shell #faqs,
.detail-content-shell .mobile-detail details[data-section]{
  scroll-margin-top: var(--detail-scroll-margin, 150px) !important;
}
.detail-content-shell .detail-tabs a.active{
  background: linear-gradient(180deg, #ffffff 0%, #f4f8ff 100%) !important;
  color: #0a3d86 !important;
  box-shadow: inset 0 -2px 0 #0a4ea3;
}
@media (max-width: 980px){
  .detail-content-shell .detail-tabs{
    justify-content: flex-start !important;
    gap: 6px !important;
    padding-inline: 10px !important;
  }
}
@media (max-width: 600px){
  .detail-content-shell .detail-tabs{
    top: var(--detail-sticky-top, 82px) !important;
    border-radius: 12px !important;
  }
  .detail-content-shell .detail-tabs a{
    flex: 0 0 auto !important;
    padding: 10px 14px !important;
    font-size: 12px !important;
  }

  /* keep product/service hero text in the white area */
  .detail-page .reference-detail-hero{
    position: relative !important;
    overflow: hidden !important;
  }
  .detail-page .reference-detail-hero .detail-hero-copy{
    position: absolute !important;
    left: 14px !important;
    top: 94px !important;
    width: 40% !important;
    max-width: 145px !important;
    z-index: 7 !important;
    background: transparent !important;
    padding: 0 !important;
  }
  .detail-page .reference-detail-hero .detail-hero-copy h1{
    font-size: 18px !important;
    line-height: 1.08 !important;
    margin: 6px 0 6px !important;
  }
  .detail-page .reference-detail-hero .detail-hero-copy p{
    font-size: 10px !important;
    line-height: 1.3 !important;
    max-width: 100% !important;
  }
}


/* ===== reference-final-v14.css ===== */

/* V14 corrections:
   1) mobile Home text sits on the video, not on the white clipped area
   2) desktop stock cards stay fully inside the hero/video area
   3) Product/Service tabs are restored to normal non-sticky flow
*/

/* -------- Home mobile only -------- */
@media (max-width:600px){
  .home-page .reference-home-hero{
    min-height:430px!important;
  }

  /* Do not use a separate technical/white text panel on small screens. */
  .home-page .reference-home-hero .blueprint{
    display:none!important;
  }
  .home-page .reference-home-hero .hero-copy:before{
    display:none!important;
  }

  /* Keep the video crop better framed for the small-screen curve. */
  .home-page .reference-home-hero .hero-video-clip video{
    left:7%!important;
    width:93%!important;
    object-position:61% center!important;
    transform:scale(1.03)!important;
    filter:brightness(.78) contrast(1.04)!important;
  }

  /* A darkening veil is applied only over the media; it is not a separate background panel. */
  .home-page .reference-home-hero .hero-video-clip:after{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:2!important;
    pointer-events:none!important;
    background:
      linear-gradient(90deg,
        rgba(1,22,50,0) 0%,
        rgba(1,22,50,.10) 25%,
        rgba(1,22,50,.48) 45%,
        rgba(1,22,50,.54) 67%,
        rgba(1,22,50,.18) 100%)!important;
  }

  /* Put the rotating copy over the dark part of the video. */
  .home-page .reference-home-hero .hero-copy{
    position:absolute!important;
    left:38%!important;
    top:105px!important;
    width:55%!important;
    max-width:none!important;
    padding:0!important;
    margin:0!important;
    z-index:10!important;
    color:#fff!important;
    text-align:left!important;
    text-shadow:0 2px 5px rgba(0,0,0,.55)!important;
  }
  .home-page .reference-home-hero .hero-copy .eyebrow{
    color:#f6d79b!important;
    font-size:8px!important;
    line-height:1.1!important;
    margin:0 0 6px!important;
  }
  .home-page .reference-home-hero .hero-copy h1{
    color:#fff!important;
    font-size:clamp(17px,5.1vw,21px)!important;
    line-height:1.05!important;
    letter-spacing:-.02em!important;
    margin:4px 0 8px!important;
    min-height:0!important;
    max-width:100%!important;
  }
  .home-page .reference-home-hero .hero-copy>p:not(.eyebrow){
    color:rgba(255,255,255,.94)!important;
    font-size:8.5px!important;
    line-height:1.35!important;
    max-width:94%!important;
    margin:0!important;
  }
  .home-page .reference-home-hero .actions{
    display:none!important;
  }

  /* Keep the stock cards clear of the quick-link section. */
  .home-page .reference-home-hero .stock-cards{
    left:4%!important;
    right:5%!important;
    bottom:15px!important;
    z-index:11!important;
  }
}

/* -------- Home desktop: keep both golden cards entirely inside hero -------- */
@media (min-width:981px){
  .home-page .reference-home-hero .stock-cards{
    left:43%!important;
    right:auto!important;
    bottom:64px!important;
    gap:18px!important;
    z-index:12!important;
  }
  .home-page .reference-home-hero .stock-cards>div{
    width:205px!important;
    min-width:205px!important;
    height:72px!important;
  }
  .home-page .reference-home-hero .video-toggle{
    bottom:150px!important;
  }
}

/* -------- Product / Service tabs: normal flow, NOT sticky/fixed -------- */
.detail-page .detail-tabs,
.detail-content-shell .detail-tabs{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  right:auto!important;
  z-index:20!important;
  margin:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}

/* Keep the original visual tab treatment and active underline. */
.detail-page .detail-tabs{
  display:flex!important;
  justify-content:center!important;
  gap:70px!important;
  padding:13px!important;
  background:#fffffff5!important;
  border-left:0!important;
  border-right:0!important;
  border-top:0!important;
  border-bottom:1px solid var(--line)!important;
  -webkit-backdrop-filter:blur(15px)!important;
  backdrop-filter:blur(15px)!important;
  overflow:visible!important;
  white-space:normal!important;
}
.detail-page .detail-tabs a{
  background:transparent!important;
  box-shadow:none!important;
  border-radius:0!important;
  padding:5px 10px!important;
  font-size:12px!important;
}
.detail-page .detail-tabs a.active{
  color:inherit!important;
  font-weight:700!important;
  border-bottom:2px solid var(--blue)!important;
}

@media (max-width:980px){
  .detail-page .detail-tabs{
    gap:clamp(14px,5vw,34px)!important;
    overflow-x:auto!important;
    white-space:nowrap!important;
    justify-content:flex-start!important;
    scrollbar-width:none!important;
  }
  .detail-page .detail-tabs::-webkit-scrollbar{display:none!important}
}


/* ===== reference-final-v15.css ===== */

/* V15 refinements:
   - tablet and mobile rotating text sits over the hero video
   - text styling stronger in white/gold with larger size
   - tablet/iPad and mobile stock cards repositioned to avoid overlap
   - desktop stock cards refined higher inside the hero
   - hero poster image updated from the same MP4 source
*/

/* ----- tablet + mobile: copy over the video ----- */
@media (max-width:980px){
  .home-page .reference-home-hero{
    overflow:hidden!important;
  }
  .home-page .reference-home-hero .blueprint{
    display:none!important;
  }

  /* Use a controlled dark overlay only on the media for text readability. */
  .home-page .reference-home-hero .hero-video-clip:after{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:2!important;
    pointer-events:none!important;
    background:
      linear-gradient(90deg,
        rgba(3,19,43,.08) 0%,
        rgba(3,19,43,.18) 16%,
        rgba(3,19,43,.52) 34%,
        rgba(3,19,43,.46) 50%,
        rgba(3,19,43,.12) 74%,
        rgba(3,19,43,0) 100%)!important;
  }

  .home-page .reference-home-hero .hero-copy{
    position:absolute!important;
    z-index:10!important;
    color:#fff!important;
    text-shadow:0 2px 6px rgba(0,0,0,.58)!important;
  }
  .home-page .reference-home-hero .hero-copy .eyebrow{
    color:#f7d487!important;
    letter-spacing:.03em!important;
    font-weight:700!important;
  }
  .home-page .reference-home-hero .hero-copy h1{
    color:#fff!important;
    letter-spacing:-.02em!important;
    font-weight:800!important;
    min-height:0!important;
    max-width:100%!important;
  }
  .home-page .reference-home-hero .hero-copy>p:not(.eyebrow){
    color:rgba(255,255,255,.95)!important;
    max-width:100%!important;
  }
  .home-page .reference-home-hero .actions{
    display:none!important;
  }
}

/* ----- tablet / iPad ranges ----- */
@media (min-width:601px) and (max-width:980px){
  .home-page .reference-home-hero{
    min-height:500px!important;
  }
  .home-page .reference-home-hero .hero-video-clip video{
    left:21%!important;
    width:79%!important;
    object-position:53% center!important;
    transform:scale(1.04)!important;
    filter:brightness(.86) contrast(1.03)!important;
  }
  .home-page .reference-home-hero .hero-copy{
    left:33%!important;
    top:108px!important;
    width:33%!important;
    max-width:270px!important;
  }
  .home-page .reference-home-hero .hero-copy .eyebrow{
    font-size:10px!important;
    margin:0 0 8px!important;
  }
  .home-page .reference-home-hero .hero-copy h1{
    font-size:clamp(28px,4.7vw,42px)!important;
    line-height:1.00!important;
    margin:2px 0 10px!important;
  }
  .home-page .reference-home-hero .hero-copy>p:not(.eyebrow){
    font-size:12px!important;
    line-height:1.35!important;
    margin:0!important;
  }

  /* Reposition stock cards safely above the quick links on iPad / tablet. */
  .home-page .reference-home-hero .stock-cards{
    left:4.5%!important;
    right:28%!important;
    bottom:66px!important;
    gap:10px!important;
    z-index:11!important;
  }
  .home-page .reference-home-hero .stock-cards>div{
    min-width:0!important;
    flex:1 1 0!important;
    height:64px!important;
  }
  .home-page .reference-home-hero .stock-cards strong{
    font-size:clamp(17px,2.6vw,22px)!important;
  }
  .home-page .reference-home-hero .stock-cards span{
    font-size:10px!important;
    line-height:1.15!important;
  }
  .home-page .reference-home-hero .video-toggle{
    left:37%!important;
    bottom:128px!important;
  }
}

/* ----- phones ----- */
@media (max-width:600px){
  .home-page .reference-home-hero{
    min-height:432px!important;
  }
  .home-page .reference-home-hero .hero-video-clip video{
    left:8%!important;
    width:92%!important;
    object-position:58% center!important;
    transform:scale(1.05)!important;
    filter:brightness(.74) contrast(1.06)!important;
  }
  .home-page .reference-home-hero .hero-copy{
    left:41%!important;
    top:102px!important;
    width:51%!important;
    max-width:none!important;
  }
  .home-page .reference-home-hero .hero-copy .eyebrow{
    font-size:8px!important;
    margin:0 0 6px!important;
  }
  .home-page .reference-home-hero .hero-copy h1{
    font-size:clamp(22px,6.2vw,28px)!important;
    line-height:1.0!important;
    margin:2px 0 7px!important;
  }
  .home-page .reference-home-hero .hero-copy>p:not(.eyebrow){
    font-size:9.5px!important;
    line-height:1.34!important;
    margin:0!important;
  }
  .home-page .reference-home-hero .stock-cards{
    left:4%!important;
    right:5%!important;
    bottom:18px!important;
    gap:10px!important;
    z-index:11!important;
  }
  .home-page .reference-home-hero .stock-cards>div{
    height:74px!important;
  }
  .home-page .reference-home-hero .stock-cards strong{
    font-size:22px!important;
  }
  .home-page .reference-home-hero .stock-cards span{
    font-size:9px!important;
    line-height:1.15!important;
  }
  .home-page .reference-home-hero .video-toggle{
    bottom:92px!important;
  }
}

/* ----- desktop fine tuning ----- */
@media (min-width:981px){
  .home-page .reference-home-hero .stock-cards{
    bottom:78px!important;
    left:43%!important;
    gap:18px!important;
  }
  .home-page .reference-home-hero .video-toggle{
    bottom:162px!important;
  }
}


/* ===== reference-final-v16.css ===== */

/* V16:
   Dedicated iPad portrait / medium-tablet hero tuning.
   Problem in V15: text block sits too deep inside the curved video area.
   Fix: for iPad Mini / Air / Pro portrait widths, return the rotating copy to the left white zone,
   enlarge it, and keep the video framing separate.
*/

/* iPad Mini / Air / Pro portrait-ish widths */
@media (min-width: 768px) and (max-width: 1180px){
  .home-page .reference-home-hero{
    min-height: 520px !important;
    overflow: hidden !important;
  }

  /* Keep the hero media framed for the traced curve without pushing text into it */
  .home-page .reference-home-hero .hero-video-clip video{
    left: 24% !important;
    width: 76% !important;
    object-position: 58% center !important;
    transform: scale(1.03) !important;
    filter: brightness(.93) contrast(1.02) !important;
  }

  /* Remove the heavy dark overlay used for phones so text does not get lost */
  .home-page .reference-home-hero .hero-video-clip:after{
    background:
      linear-gradient(90deg,
        rgba(3,19,43,0.00) 0%,
        rgba(3,19,43,0.04) 25%,
        rgba(3,19,43,0.08) 42%,
        rgba(3,19,43,0.06) 58%,
        rgba(3,19,43,0.00) 100%) !important;
  }

  /* Put the rotating text back into the white left area */
  .home-page .reference-home-hero .hero-copy{
    left: 5.5% !important;
    top: 116px !important;
    width: 31% !important;
    max-width: 255px !important;
    z-index: 10 !important;
    color: #123b7a !important;
    text-shadow: none !important;
  }
  .home-page .reference-home-hero .hero-copy .eyebrow{
    color: #0a4ea3 !important;
    font-size: 11px !important;
    line-height: 1.15 !important;
    margin: 0 0 10px !important;
    letter-spacing: .02em !important;
  }
  .home-page .reference-home-hero .hero-copy h1{
    color: #103b79 !important;
    font-size: clamp(34px, 4.2vw, 48px) !important;
    line-height: .98 !important;
    margin: 0 0 12px !important;
    max-width: 100% !important;
    letter-spacing: -.02em !important;
    font-weight: 800 !important;
  }
  /* If an accent span exists, keep it gold */
  .home-page .reference-home-hero .hero-copy h1 .accent,
  .home-page .reference-home-hero .hero-copy h1 .gold,
  .home-page .reference-home-hero .hero-copy .accent{
    color: #c9962f !important;
  }
  .home-page .reference-home-hero .hero-copy > p:not(.eyebrow){
    color: #183f78 !important;
    font-size: 14px !important;
    line-height: 1.42 !important;
    margin: 0 !important;
    max-width: 96% !important;
  }
  .home-page .reference-home-hero .actions{
    display: none !important;
  }

  /* Keep blueprint subtle behind the copy */
  .home-page .reference-home-hero .blueprint{
    display: block !important;
    opacity: .40 !important;
  }

  /* Keep golden cards above the quick links across iPad sizes */
  .home-page .reference-home-hero .stock-cards{
    left: 3.5% !important;
    right: 30% !important;
    bottom: 58px !important;
    gap: 10px !important;
    z-index: 11 !important;
  }
  .home-page .reference-home-hero .stock-cards > div{
    height: 66px !important;
    min-width: 0 !important;
    flex: 1 1 0 !important;
  }
  .home-page .reference-home-hero .stock-cards strong{
    font-size: clamp(18px, 2.4vw, 24px) !important;
  }
  .home-page .reference-home-hero .stock-cards span{
    font-size: 10px !important;
    line-height: 1.18 !important;
  }
  .home-page .reference-home-hero .video-toggle{
    left: 40% !important;
    bottom: 120px !important;
  }
}

/* Slightly narrower 768-860 widths need even more room for copy */
@media (min-width: 768px) and (max-width: 860px){
  .home-page .reference-home-hero .hero-copy{
    width: 33% !important;
    max-width: 235px !important;
    left: 4.5% !important;
    top: 118px !important;
  }
  .home-page .reference-home-hero .hero-copy h1{
    font-size: clamp(30px, 4.9vw, 40px) !important;
  }
  .home-page .reference-home-hero .hero-copy > p:not(.eyebrow){
    font-size: 12px !important;
  }
  .home-page .reference-home-hero .stock-cards{
    right: 27% !important;
    bottom: 62px !important;
  }
}


/* ===== reference-final-v17.css ===== */
/* V17 / V32 final responsive Product & Service detail layout.
   Loaded LAST so it replaces the accumulated legacy detail-page overrides.
   Goals:
   - >=1281px: full-width Overview left + fixed-height gallery right.
   - <=1280px: Hero -> Gallery -> tabs -> details/content.
   - Gallery never stretches to the full Overview text height.
   - No horizontal page movement from carousel thumbnails.
   - Small-screen support popup stays beside the floating button, never a bottom sheet.
*/

html,
body{max-width:100%;overflow-x:hidden}
body.detail-page main{width:100%;max-width:100%;overflow-x:clip}

body.detail-page .mobile-hero-gallery-shell{display:none}
body.detail-page .overview-shell,
body.detail-page .overview-copy,
body.detail-page .carousel{min-width:0;box-sizing:border-box}
body.detail-page .carousel-thumbs{max-width:100%;overscroll-behavior-x:contain;scroll-behavior:smooth}
body.detail-page .carousel-thumb{scroll-margin-inline:0}

/* -------- Proper desktop / laptop layout -------- */
@media (min-width:1281px){
  body.detail-page .overview-shell{
    width:min(1540px,calc(100vw - 56px))!important;
    max-width:none!important;
    margin:18px auto 24px!important;
    display:grid!important;
    grid-template-columns:minmax(390px,43%) minmax(560px,57%)!important;
    grid-template-rows:auto auto!important;
    align-items:start!important;
    gap:16px!important;
    overflow:visible!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  body.detail-page .overview-copy{
    grid-column:1!important;
    grid-row:1!important;
    align-self:start!important;
    width:100%!important;
    padding:28px 30px!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:0 10px 35px rgba(8,44,97,.07)!important;
    overflow:visible!important;
  }
  body.detail-page .overview-copy .rich{overflow-wrap:anywhere}

  body.detail-page .desktop-overview-gallery{
    display:block!important;
    grid-column:2!important;
    grid-row:1!important;
    align-self:start!important;
    width:100%!important;
    height:clamp(430px,35vw,560px)!important;
    min-height:430px!important;
    max-height:560px!important;
    margin:0!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    overflow:hidden!important;
    background:#edf3f9!important;
    box-shadow:0 10px 35px rgba(8,44,97,.07)!important;
    clip-path:none!important;
  }

  body.detail-page .benefits{
    grid-column:1 / -1!important;
    grid-row:2!important;
    margin:0!important;
    overflow:hidden!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:0 10px 30px rgba(8,44,97,.05)!important;
  }

  body.detail-page .detail-grid,
  body.detail-page .applications,
  body.detail-page .faq{
    width:min(1540px,calc(100vw - 56px))!important;
    max-width:none!important;
  }
  body.detail-page .detail-grid{grid-template-columns:minmax(0,66%) minmax(330px,34%)!important}
}

/* -------- Tablets, iPad portrait/landscape, compact laptops -------- */
@media (max-width:1280px){
  body.detail-page .mobile-hero-gallery-shell{
    display:block!important;
    width:min(1180px,calc(100vw - 32px))!important;
    margin:14px auto 0!important;
  }
  body.detail-page .mobile-hero-gallery{
    display:block!important;
    width:100%!important;
    height:clamp(300px,47vw,480px)!important;
    min-height:300px!important;
    margin:0!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    overflow:hidden!important;
    background:#edf3f9!important;
    box-shadow:0 10px 30px rgba(8,44,97,.07)!important;
    clip-path:none!important;
  }

  body.detail-page .detail-tabs{
    width:100%!important;
    margin-top:12px!important;
  }

  body.detail-page .overview-shell{
    width:min(1180px,calc(100vw - 32px))!important;
    max-width:none!important;
    margin:14px auto 20px!important;
    display:block!important;
    overflow:visible!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  body.detail-page .overview-shell > .desktop-overview-gallery{display:none!important}
  body.detail-page .overview-copy{
    width:100%!important;
    padding:24px 26px!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:0 10px 30px rgba(8,44,97,.06)!important;
  }
  body.detail-page .overview-copy .rich{overflow-wrap:anywhere}
  body.detail-page .benefits{
    width:100%!important;
    margin-top:14px!important;
    overflow:hidden!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    background:#fff!important;
  }

  body.detail-page .detail-grid,
  body.detail-page .applications,
  body.detail-page .faq{
    width:min(1180px,calc(100vw - 32px))!important;
    max-width:none!important;
  }
  body.detail-page .detail-grid{grid-template-columns:1fr!important}
  body.detail-page .related-panel{grid-template-columns:1fr 1fr!important}
  body.detail-page .app-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

/* -------- Phones / narrow devices -------- */
@media (max-width:700px){
  body.detail-page .mobile-hero-gallery-shell{
    width:calc(100vw - 20px)!important;
    margin:10px auto 0!important;
  }
  body.detail-page .mobile-hero-gallery{
    height:235px!important;
    min-height:235px!important;
    border-radius:10px!important;
  }
  body.detail-page .detail-tabs{
    margin-top:8px!important;
    padding:9px 8px!important;
    gap:18px!important;
    justify-content:flex-start!important;
    overflow-x:auto!important;
    scrollbar-width:none!important;
  }
  body.detail-page .detail-tabs::-webkit-scrollbar{display:none!important}
  body.detail-page .detail-tabs a{white-space:nowrap!important}

  body.detail-page .overview-shell{
    width:calc(100vw - 20px)!important;
    margin:10px auto 16px!important;
  }
  body.detail-page .overview-copy{
    padding:16px 14px!important;
    border-radius:10px!important;
  }
  body.detail-page .overview-copy h2{font-size:16px!important}
  body.detail-page .overview-copy .rich{font-size:12px!important;line-height:1.5!important}

  body.detail-page .benefits{border-radius:10px!important}
  body.detail-page .benefits span{min-height:62px!important;gap:5px!important;flex-direction:column!important;text-align:center!important}
  body.detail-page .benefits b{font-size:8px!important}

  body.detail-page .desktop-detail{display:none!important}
  body.detail-page .mobile-detail{display:block!important}
  body.detail-page .mobile-detail .related-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.detail-page .mobile-detail .app-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.detail-page .mobile-detail .faq-grid{grid-template-columns:1fr!important}

  /* Side popup instead of the previous bottom sheet. Inline JS positioning wins
     after open/drag, while this gives a correct initial right-middle position. */
  .support-orbit{right:9px;top:50%;bottom:auto}
  .support-modal .modal-card{
    position:absolute;
    left:auto;
    right:72px;
    top:50%;
    bottom:auto;
    width:min(320px,calc(100vw - 86px));
    max-height:70vh;
    overflow:auto;
    padding:16px 16px 18px;
    border-radius:18px;
    transform:translateY(-50%) translateX(16px) scale(.98);
  }
  .support-modal.open .modal-card{transform:none}
  .support-modal .mobile-handle{display:none}
}

/* Carousel controls remain fully visible inside the gallery on every screen. */
body.detail-page .carousel{contain:layout paint;isolation:isolate}
body.detail-page .carousel .prev,
body.detail-page .carousel .next{z-index:20!important;opacity:1!important;visibility:visible!important}
body.detail-page .carousel .carousel-counter,
body.detail-page .carousel .dots,
body.detail-page .carousel .carousel-thumbs{z-index:19!important}


/* ===== reference-final-v18.css ===== */
/* V18 / V33 definitive responsive Product & Service detail layout.
   This file is intentionally loaded last with a version query so old cached
   detail-page CSS cannot override the requested responsive behaviour. */

html,body{max-width:100%;overflow-x:hidden}
body.detail-page main{width:100%;max-width:none;overflow-x:clip}
body.detail-page .mobile-hero-gallery-shell{display:none}
body.detail-page .overview-shell,
body.detail-page .overview-copy,
body.detail-page .carousel{min-width:0;box-sizing:border-box}
body.detail-page .carousel-thumbs{max-width:100%;overscroll-behavior-x:contain;scroll-behavior:smooth}
body.detail-page .carousel-thumb{scroll-margin-inline:0}

/* Floating header becomes fully opaque white after the first scroll. */
body .top.is-scrolled{
  background:#fff!important;
  border-color:#e4eaf2!important;
  box-shadow:0 10px 34px rgba(4,35,78,.14)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
body.detail-page .top.is-scrolled nav{background:#fff!important}

/* ===== Desktop / larger screens ===== */
@media (min-width:1281px){
  body.detail-page .overview-shell{
    width:calc(100vw - 40px)!important;
    max-width:1700px!important;
    margin:16px auto 24px!important;
    display:grid!important;
    grid-template-columns:minmax(420px,42%) minmax(0,58%)!important;
    grid-template-rows:auto auto!important;
    align-items:start!important;
    gap:18px!important;
    overflow:visible!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  body.detail-page .overview-copy{
    grid-column:1!important;
    grid-row:1!important;
    width:100%!important;
    align-self:start!important;
    padding:28px 30px!important;
    overflow:visible!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:0 10px 35px rgba(8,44,97,.07)!important;
  }
  body.detail-page .overview-copy .rich{overflow-wrap:anywhere}
  body.detail-page .desktop-overview-gallery{
    display:block!important;
    grid-column:2!important;
    grid-row:1!important;
    align-self:start!important;
    width:100%!important;
    height:clamp(440px,34vw,560px)!important;
    min-height:440px!important;
    max-height:560px!important;
    margin:0!important;
    padding-bottom:72px!important;
    overflow:hidden!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    background:#edf3f9!important;
    box-shadow:0 10px 35px rgba(8,44,97,.07)!important;
    clip-path:none!important;
  }
  body.detail-page .desktop-overview-gallery>img{
    height:calc(100% - 72px)!important;
    border-radius:13px 13px 0 0!important;
  }
  body.detail-page .desktop-overview-gallery .carousel-thumbs{height:50px!important}
  body.detail-page .desktop-overview-gallery .carousel-counter{bottom:58px!important}
  body.detail-page .desktop-overview-gallery .dots{bottom:59px!important}
  body.detail-page .benefits{
    grid-column:1/-1!important;
    grid-row:2!important;
    width:100%!important;
    margin:0!important;
    overflow:hidden!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:0 10px 30px rgba(8,44,97,.05)!important;
  }
  body.detail-page .detail-grid,
  body.detail-page .applications,
  body.detail-page .faq{
    width:calc(100vw - 40px)!important;
    max-width:1700px!important;
  }
  body.detail-page .detail-grid{grid-template-columns:minmax(0,66%) minmax(340px,34%)!important}
}

/* ===== Tablet, iPad, compact laptops ===== */
@media (min-width:701px) and (max-width:1280px){
  body.detail-page .mobile-hero-gallery-shell{
    display:block!important;
    width:calc(100vw - 30px)!important;
    max-width:1180px!important;
    margin:14px auto 0!important;
  }
  body.detail-page .mobile-hero-gallery{
    display:block!important;
    width:100%!important;
    height:clamp(300px,38vw,420px)!important;
    min-height:300px!important;
    margin:0!important;
    padding-bottom:68px!important;
    overflow:hidden!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    background:#edf3f9!important;
    box-shadow:0 10px 30px rgba(8,44,97,.07)!important;
    clip-path:none!important;
  }
  body.detail-page .mobile-hero-gallery>img{
    height:calc(100% - 68px)!important;
    border-radius:13px 13px 0 0!important;
  }
  body.detail-page .detail-tabs{
    width:100%!important;
    margin-top:10px!important;
  }
  body.detail-page .overview-shell{
    width:calc(100vw - 30px)!important;
    max-width:1180px!important;
    margin:12px auto 20px!important;
    display:block!important;
    overflow:visible!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  body.detail-page .overview-shell>.desktop-overview-gallery{display:none!important}
  body.detail-page .overview-copy{
    width:100%!important;
    padding:22px 24px!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:0 10px 30px rgba(8,44,97,.06)!important;
  }
  body.detail-page .benefits{
    width:100%!important;
    margin-top:14px!important;
    overflow:hidden!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    background:#fff!important;
  }
  body.detail-page .detail-grid,
  body.detail-page .applications,
  body.detail-page .faq{
    width:calc(100vw - 30px)!important;
    max-width:1180px!important;
  }
  body.detail-page .detail-grid{grid-template-columns:1fr!important}
  body.detail-page .related-panel{grid-template-columns:1fr 1fr!important}
  body.detail-page .app-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

/* ===== Phones ===== */
@media (max-width:700px){
  body.detail-page .mobile-hero-gallery-shell{
    display:block!important;
    width:calc(100vw - 20px)!important;
    margin:10px auto 0!important;
  }
  body.detail-page .mobile-hero-gallery{
    display:block!important;
    width:100%!important;
    height:235px!important;
    min-height:235px!important;
    padding-bottom:58px!important;
    overflow:hidden!important;
    border:1px solid var(--line)!important;
    border-radius:10px!important;
    background:#edf3f9!important;
    clip-path:none!important;
  }
  body.detail-page .mobile-hero-gallery>img{height:calc(100% - 58px)!important;border-radius:9px 9px 0 0!important}
  body.detail-page .detail-tabs{
    width:100%!important;
    margin-top:8px!important;
    padding:9px 8px!important;
    gap:18px!important;
    justify-content:flex-start!important;
    overflow-x:auto!important;
    scrollbar-width:none!important;
  }
  body.detail-page .detail-tabs::-webkit-scrollbar{display:none!important}
  body.detail-page .detail-tabs a{white-space:nowrap!important}
  body.detail-page .overview-shell{
    width:calc(100vw - 20px)!important;
    margin:10px auto 16px!important;
    display:block!important;
    overflow:visible!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  body.detail-page .overview-shell>.desktop-overview-gallery{display:none!important}
  body.detail-page .overview-copy{
    width:100%!important;
    padding:16px 14px!important;
    border:1px solid var(--line)!important;
    border-radius:10px!important;
    background:#fff!important;
  }
  body.detail-page .overview-copy h2{font-size:16px!important}
  body.detail-page .overview-copy .rich{font-size:12px!important;line-height:1.5!important;overflow-wrap:anywhere}
  body.detail-page .benefits{margin-top:12px!important;border:1px solid var(--line)!important;border-radius:10px!important;overflow:hidden!important;background:#fff!important}
  body.detail-page .benefits span{min-height:62px!important;gap:5px!important;flex-direction:column!important;text-align:center!important}
  body.detail-page .benefits b{font-size:8px!important}
  body.detail-page .desktop-detail{display:none!important}
  body.detail-page .mobile-detail{display:block!important}
  body.detail-page .mobile-detail .related-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.detail-page .mobile-detail .app-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.detail-page .mobile-detail .faq-grid{grid-template-columns:1fr!important}

  /* Keep the contact popup beside/right-middle rather than as a bottom sheet. */
  .support-orbit{right:9px;top:50%;bottom:auto}
  .support-modal .modal-card{
    position:absolute!important;
    left:auto;
    right:72px;
    top:50%;
    bottom:auto!important;
    width:min(320px,calc(100vw - 86px))!important;
    max-height:70vh!important;
    overflow:auto!important;
    padding:16px 16px 18px!important;
    border-radius:18px!important;
    transform:translateY(-50%) translateX(16px) scale(.98)!important;
  }
  .support-modal.open .modal-card{transform:none!important}
  .support-modal .mobile-handle{display:none!important}
}

/* Carousel controls must stay inside the media component. */
body.detail-page .carousel{contain:layout paint;isolation:isolate}
body.detail-page .carousel .prev,
body.detail-page .carousel .next{z-index:20!important;opacity:1!important;visibility:visible!important}
body.detail-page .carousel .carousel-counter,
body.detail-page .carousel .dots,
body.detail-page .carousel .carousel-thumbs{z-index:19!important}


/* ===== reference-final-v19.css ===== */
/* V19 / V34 definitive full-image rendering rules for Product & Service pages.
   Loaded after every previous reference stylesheet. The objective is simple:
   never crop an admin-approved Product/Service image in the public gallery. */

/* Gallery image stage: preserve the complete uploaded frame on every viewport. */
body.detail-page .carousel{
  background:linear-gradient(135deg,#f7f9fc,#eef3f8)!important;
}
body.detail-page .carousel>img{
  object-fit:contain!important;
  object-position:center center!important;
  transform:none!important;
  -webkit-transform:none!important;
  box-sizing:border-box!important;
  padding:8px!important;
  background:transparent!important;
}

/* Desktop gallery keeps the existing controlled size, but the source image
   scales inside it instead of being enlarged and cut off. */
@media (min-width:1281px){
  body.detail-page .desktop-overview-gallery>img{
    width:100%!important;
    height:calc(100% - 72px)!important;
    inset:0 0 72px 0!important;
    object-fit:contain!important;
    object-position:center center!important;
    padding:10px!important;
    border-radius:13px 13px 0 0!important;
  }
}

/* Tablet / iPad / compact-laptop gallery. */
@media (min-width:701px) and (max-width:1280px){
  body.detail-page .mobile-hero-gallery>img{
    width:100%!important;
    height:calc(100% - 68px)!important;
    inset:0 0 68px 0!important;
    object-fit:contain!important;
    object-position:center center!important;
    padding:9px!important;
    border-radius:13px 13px 0 0!important;
  }
}

/* Phones. */
@media (max-width:700px){
  body.detail-page .mobile-hero-gallery>img{
    width:100%!important;
    height:calc(100% - 58px)!important;
    inset:0 0 58px 0!important;
    object-fit:contain!important;
    object-position:center center!important;
    padding:6px!important;
    border-radius:9px 9px 0 0!important;
  }
}

/* Thumbnail rail must also show the whole composition, so the visitor can
   identify exactly which image is being selected. */
body.detail-page .carousel-thumb{
  background:#f8fafc!important;
}
body.detail-page .carousel-thumb img{
  object-fit:contain!important;
  object-position:center center!important;
  background:#f8fafc!important;
}

/* Product / Service HERO uploaded image: remove legacy scale transforms and
   preserve the complete source image within the approved golden-arc stage.
   The arc/clip remains, but the photograph itself is never zoom-cropped. */
body.detail-page .detail-image-clip{
  background:linear-gradient(135deg,#f8fafc,#eef3f7)!important;
}
body.detail-page .detail-image-clip img{
  object-fit:contain!important;
  object-position:center center!important;
  transform:none!important;
  -webkit-transform:none!important;
  scale:1!important;
}

/* Never allow a gallery image to enlarge beyond its stage because of older
   responsive rules. */
body.detail-page .desktop-overview-gallery,
body.detail-page .mobile-hero-gallery{
  contain:layout paint!important;
}


/* ===== reference-final-v20.css ===== */
/* V20 / V35 product & service detail cleanup
   - dots only, no thumbnails, no counters
   - full-image rendering without crop
   - desktop keeps overview + image side-by-side
   - tablet/mobile shows image below hero, then tabs, then content */

body.detail-page .carousel{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,#f7f9fc,#eef3f8)!important;
}
body.detail-page .carousel>img{
  object-fit:contain!important;
  object-position:center center!important;
  padding:12px 14px 34px!important;
  background:transparent!important;
}
body.detail-page .carousel .prev,
body.detail-page .carousel .next{
  width:48px!important;
  height:48px!important;
  top:50%!important;
  transform:translateY(-50%);
  border:2px solid #d6a449!important;
  background:#08366f!important;
  color:#fff!important;
  box-shadow:0 10px 24px rgba(4,29,66,.18)!important;
}
body.detail-page .carousel .prev{left:16px!important}
body.detail-page .carousel .next{right:16px!important}
body.detail-page .carousel .dots{
  left:0!important;
  right:0!important;
  bottom:10px!important;
  text-align:center!important;
  z-index:12!important;
}
body.detail-page .carousel .dots button{
  width:8px!important;
  height:8px!important;
  margin:0 4px!important;
  border:0!important;
  border-radius:50%!important;
  background:#c8d5e5!important;
}
body.detail-page .carousel .dots button.active{
  background:#0a4f9e!important;
}
body.detail-page .carousel.single-image .dots,
body.detail-page .carousel.single-image .prev,
body.detail-page .carousel.single-image .next{display:none!important}

body.detail-page .detail-image-clip{
  background:linear-gradient(135deg,#f8fafc,#eef3f7)!important;
}
body.detail-page .detail-image-clip img{
  object-fit:cover!important;
  object-position:center center!important;
}

body.detail-page .mobile-hero-gallery-shell{display:none}

/* Larger desktop */
@media (min-width:1181px){
  body.detail-page .overview-shell{
    width:min(1220px,94%)!important;
    margin:20px auto 0!important;
    display:grid!important;
    grid-template-columns:minmax(360px,42%) minmax(0,58%)!important;
    grid-template-rows:auto auto!important;
    align-items:start!important;
    border:1px solid var(--line)!important;
    border-radius:18px!important;
    overflow:hidden!important;
    background:#fff!important;
    box-shadow:var(--shadow)!important;
  }
  body.detail-page .overview-copy{
    padding:28px 28px 24px!important;
  }
  body.detail-page .desktop-overview-gallery{
    display:block!important;
    min-height:500px!important;
    border-left:1px solid var(--line)!important;
  }
  body.detail-page .desktop-overview-gallery>img{
    inset:0!important;
    width:100%!important;
    height:100%!important;
  }
  body.detail-page .benefits{
    grid-column:1 / -1!important;
    border-top:1px solid var(--line)!important;
  }
}

/* Tablet and compact laptop */
@media (max-width:1180px){
  body.detail-page .mobile-hero-gallery-shell{
    display:block!important;
    width:min(1180px,94%)!important;
    margin:18px auto 0!important;
  }
  body.detail-page .mobile-hero-gallery{
    height:410px!important;
    border:1px solid var(--line)!important;
    border-radius:16px!important;
    box-shadow:var(--shadow)!important;
  }
  body.detail-page .mobile-hero-gallery>img{
    inset:0!important;
    width:100%!important;
    height:100%!important;
  }
  body.detail-page .overview-shell{
    width:min(1180px,94%)!important;
    margin:16px auto 0!important;
    display:block!important;
    border:1px solid var(--line)!important;
    border-radius:16px!important;
    overflow:hidden!important;
    background:#fff!important;
    box-shadow:var(--shadow)!important;
  }
  body.detail-page .desktop-overview-gallery{display:none!important}
  body.detail-page .overview-copy{padding:22px 22px 10px!important}
  body.detail-page .benefits{display:grid!important;grid-template-columns:repeat(3,1fr)!important;border-top:1px solid var(--line)!important}
}

@media (max-width:980px){
  body.detail-page .mobile-hero-gallery{height:340px!important}
  body.detail-page .carousel .prev,
  body.detail-page .carousel .next{width:44px!important;height:44px!important}
}

@media (max-width:600px){
  body.detail-page .mobile-hero-gallery-shell{width:95%!important;margin:14px auto 0!important}
  body.detail-page .mobile-hero-gallery{height:220px!important;border-radius:12px!important}
  body.detail-page .overview-shell{width:95%!important;margin:12px auto 0!important;border:0!important;box-shadow:none!important}
  body.detail-page .overview-copy{padding:10px 10px 4px!important}
  body.detail-page .carousel>img{padding:8px 8px 28px!important}
  body.detail-page .carousel .prev,
  body.detail-page .carousel .next{width:40px!important;height:40px!important}
  body.detail-page .carousel .prev{left:8px!important}
  body.detail-page .carousel .next{right:8px!important}
  body.detail-page .carousel .dots{bottom:8px!important}
}


/* ===== reference-final-v21.css ===== */
/* V21 / V36 tablet + mixed-aspect image correction.
   Keeps complete approved images visible while making portrait/square AI outputs
   feel intentional and large on tablet/compact-laptop screens. */

body.detail-page .carousel{
  isolation:isolate;
  background:#f5f7fa!important;
}
body.detail-page .carousel::before,
body.detail-page .carousel::after{
  display:none!important;
  content:none!important;
  background:none!important;
  filter:none!important;
  opacity:0!important;
}
body.detail-page .carousel>img{
  z-index:2!important;
  object-fit:contain!important;
  object-position:center!important;
  padding:0 0 32px!important;
  filter:none!important;
  transform:none!important;
}
body.detail-page .carousel .prev,
body.detail-page .carousel .next,
body.detail-page .carousel .dots{
  z-index:5!important;
}

/* Desktop keeps the clean fixed gallery. */
@media (min-width:1181px){
  body.detail-page .desktop-overview-gallery{
    min-height:500px!important;
    height:clamp(500px,36vw,610px)!important;
    max-height:610px!important;
  }
}

/* iPad Pro/Air/Mini + compact laptops: give mixed-orientation media enough
   vertical room so portrait and square source images do not look miniature. */
@media (min-width:981px) and (max-width:1180px){
  body.detail-page .mobile-hero-gallery{
    height:clamp(520px,60vw,620px)!important;
  }
  body.detail-page .mobile-hero-gallery>img{
    padding:12px 16px 36px!important;
  }
}
@media (min-width:701px) and (max-width:980px){
  body.detail-page .mobile-hero-gallery{
    height:clamp(500px,72vw,590px)!important;
  }
  body.detail-page .mobile-hero-gallery>img{
    padding:10px 12px 34px!important;
  }
}

/* Phones retain the approved compact flow but gain the same-image backdrop. */
@media (max-width:700px){
  body.detail-page .mobile-hero-gallery{
    height:clamp(230px,72vw,330px)!important;
  }
  body.detail-page .carousel>img{
    padding:7px 8px 28px!important;
  }
}

/* Desktop: use the space directly under the gallery instead of leaving a tall
   empty right column while the Overview continues on the left. */
@media (min-width:1181px){
  body.detail-page .overview-copy{
    grid-column:1!important;
    grid-row:1 / span 2!important;
    align-self:start!important;
  }
  body.detail-page .desktop-overview-gallery{
    grid-column:2!important;
    grid-row:1!important;
  }
  body.detail-page .desktop-spec-followup{
    grid-column:2!important;
    grid-row:2!important;
    display:block!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    border-left:1px solid var(--line)!important;
    border-top:1px solid var(--line)!important;
    background:#fff!important;
  }
  body.detail-page .desktop-spec-followup .spec-card,
  body.detail-page .desktop-spec-followup .related-panel{
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
  }
  body.detail-page .desktop-spec-followup .related-panel{
    border-top:1px solid var(--line)!important;
    grid-template-columns:1fr 1fr!important;
  }
  body.detail-page .benefits{
    grid-column:1 / -1!important;
    grid-row:3!important;
  }
}

/* Tablet: gallery is already above the tabs; specifications follow Overview
   naturally with no duplicate/blank media column. */
@media (min-width:601px) and (max-width:1180px){
  body.detail-page .desktop-spec-followup{
    display:block!important;
    margin:18px 0 0!important;
    padding:0!important;
    width:100%!important;
  }
  body.detail-page .desktop-spec-followup .spec-card,
  body.detail-page .desktop-spec-followup .related-panel{
    border-radius:12px!important;
  }
}


/* ===== reference-final-v22.css ===== */
/* V22 / V38 desktop-only Product & Service tabbed detail experience.
   Tablets and phones keep the V36 flow unchanged. */

body.detail-page .desktop-tabbed-detail{display:none}

@media (min-width:1181px){
  /* Full browser-width tab bar, four equal controls from left to right. */
  body.detail-page .detail-tabs{
    width:100vw!important;
    max-width:none!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:0!important;
    padding:0!important;
    background:#fff!important;
    border-top:1px solid var(--line)!important;
    border-bottom:1px solid var(--line)!important;
    box-shadow:0 7px 18px rgba(4,35,77,.06)!important;
    overflow:visible!important;
  }
  body.detail-page .detail-tabs a{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:54px!important;
    padding:12px 18px!important;
    border-right:1px solid #e2e9f2!important;
    border-bottom:3px solid transparent!important;
    background:#fff!important;
    color:var(--navy)!important;
    font-size:13px!important;
    font-weight:700!important;
    text-align:center!important;
  }
  body.detail-page .detail-tabs a:last-child{border-right:0!important}
  body.detail-page .detail-tabs a.active{
    color:var(--blue)!important;
    border-bottom-color:var(--blue)!important;
    background:linear-gradient(180deg,#fff,#f6faff)!important;
  }

  /* Desktop uses one Microsoft-style changing content region below the tabs. */
  body.detail-page .desktop-tabbed-detail{
    display:block!important;
    width:min(1540px,calc(100vw - 56px))!important;
    margin:20px auto 28px!important;
  }
  body.detail-page .desktop-tab-panel{
    display:block;
    min-height:160px;
    padding:0;
  }
  body.detail-page .desktop-tab-panel[hidden]{display:none!important}

  /* Hide the legacy scroll-to sections only on large screens. */
  body.detail-page > main > .overview-shell,
  body.detail-page > main > .applications.desktop-detail,
  body.detail-page > main > .faq.desktop-detail{
    display:none!important;
  }

  /* Word-style text wrapping around the right-side gallery. */
  body.detail-page .desktop-overview-flow{
    display:block!important;
    padding:28px 30px 24px!important;
    border:1px solid var(--line)!important;
    border-radius:18px 18px 0 0!important;
    background:#fff!important;
    box-shadow:var(--shadow)!important;
    overflow:auto!important; /* establishes float container without clipping */
  }
  body.detail-page .desktop-overview-flow::after{
    content:"";
    display:block;
    clear:both;
  }
  body.detail-page .desktop-overview-flow>h2{
    margin:0 0 14px!important;
    font-size:22px!important;
  }
  body.detail-page .desktop-overview-rich{
    font-size:15px!important;
    line-height:1.62!important;
  }
  body.detail-page .desktop-tab-carousel-wrap{
    float:right!important;
    width:min(58%,820px)!important;
    margin:0 0 22px 34px!important;
  }
  body.detail-page .desktop-tab-carousel{
    width:100%!important;
    height:clamp(480px,35vw,610px)!important;
    max-height:610px!important;
    min-height:480px!important;
    border:1px solid var(--line)!important;
    border-radius:16px!important;
    box-shadow:0 12px 30px rgba(4,35,77,.10)!important;
    background:#eef3f8!important;
  }
  body.detail-page .desktop-tab-carousel>img{
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center!important;
    padding:12px 14px 34px!important;
  }

  body.detail-page .desktop-tabbed-detail>.desktop-tab-panel>.benefits{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    width:100%!important;
    border:1px solid var(--line)!important;
    border-top:0!important;
    border-radius:0 0 16px 16px!important;
    overflow:hidden!important;
    background:#fff!important;
    box-shadow:var(--shadow)!important;
  }

  /* Specifications becomes an in-place tab panel, not a scroll destination. */
  body.detail-page .desktop-spec-tab-grid{
    display:grid!important;
    grid-template-columns:minmax(0,2fr) minmax(340px,1fr)!important;
    gap:18px!important;
    align-items:start!important;
  }
  body.detail-page .desktop-spec-tab-grid>.spec-card,
  body.detail-page .desktop-spec-tab-grid>.related-panel{
    min-width:0!important;
    border-radius:16px!important;
    box-shadow:var(--shadow)!important;
  }
  body.detail-page .desktop-tab-inner{
    padding:24px!important;
    border:1px solid var(--line)!important;
    border-radius:16px!important;
    background:#fff!important;
    box-shadow:var(--shadow)!important;
  }
  body.detail-page .desktop-tab-inner .app-grid{
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
  }
  body.detail-page .desktop-tab-inner.faq .faq-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media (min-width:1181px) and (max-width:1380px){
  body.detail-page .desktop-tabbed-detail{width:calc(100vw - 40px)!important}
  body.detail-page .desktop-tab-carousel-wrap{width:56%!important;margin-left:26px!important}
  body.detail-page .desktop-tab-carousel{height:500px!important;min-height:500px!important}
  body.detail-page .desktop-spec-tab-grid{grid-template-columns:minmax(0,1.65fr) minmax(320px,.9fr)!important}
}


/* ===== reference-final-v23.css ===== */
/* V23 / V39 unified Product & Service detail tabs + polished responsive gallery.
   Interaction is consistent on all screens: tabs switch content in place.
   Desktop wraps Overview copy around a right-side gallery; tablet/mobile stack gallery above tabs. */

/* One tabbed content system everywhere; old anchor/accordion sections stay hidden. */
body.detail-page .desktop-tabbed-detail{
  display:block!important;
  width:min(1540px,calc(100vw - 48px))!important;
  margin:18px auto 28px!important;
}
body.detail-page .desktop-tab-panel{display:block!important;min-width:0}
body.detail-page .desktop-tab-panel[hidden]{display:none!important}
body.detail-page > main > .overview-shell,
body.detail-page > main > .applications.desktop-detail,
body.detail-page > main > .faq.desktop-detail,
body.detail-page > main > .mobile-detail{display:none!important}

/* Tabs behave like a compact application menu: switch, don't jump. */
body.detail-page .detail-tabs{
  z-index:46!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:0!important;
  padding:0!important;
  background:#fff!important;
  border-top:1px solid var(--line)!important;
  border-bottom:1px solid var(--line)!important;
  box-shadow:0 7px 18px rgba(4,35,77,.06)!important;
  overflow:hidden!important;
}
body.detail-page .detail-tabs a{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:0!important;
  min-height:52px!important;
  margin:0!important;
  padding:11px 10px!important;
  border-right:1px solid #e2e9f2!important;
  border-bottom:3px solid transparent!important;
  background:#fff!important;
  color:var(--navy)!important;
  font-weight:750!important;
  text-align:center!important;
  white-space:nowrap!important;
}
body.detail-page .detail-tabs a:last-child{border-right:0!important}
body.detail-page .detail-tabs a.active{
  color:var(--blue)!important;
  border-bottom-color:var(--blue)!important;
  background:linear-gradient(180deg,#fff,#f4f9ff)!important;
}

/* Gallery: undo old angled/negative-margin carousel styling completely. */
body.detail-page .desktop-tab-carousel,
body.detail-page .mobile-hero-gallery{
  margin:0!important;
  clip-path:none!important;
  -webkit-clip-path:none!important;
  border:1px solid #ccd9e8!important;
  background:#edf3f8!important;
  box-shadow:0 16px 34px rgba(2,36,79,.14)!important;
  overflow:hidden!important;
}
body.detail-page .desktop-tab-carousel>img,
body.detail-page .mobile-hero-gallery>img{
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  transform:none!important;
  -webkit-transform:none!important;
  padding:10px 12px 34px!important;
}
body.detail-page .desktop-tab-carousel .prev,
body.detail-page .desktop-tab-carousel .next,
body.detail-page .mobile-hero-gallery .prev,
body.detail-page .mobile-hero-gallery .next{
  top:50%!important;
  transform:translateY(-50%)!important;
  width:52px!important;
  height:52px!important;
  border:2px solid #e0ad4f!important;
  background:rgba(4,49,103,.96)!important;
  color:#fff!important;
  opacity:1!important;
  visibility:visible!important;
  box-shadow:0 10px 26px rgba(0,28,63,.28),inset 0 0 0 1px rgba(255,255,255,.16)!important;
}
body.detail-page .desktop-tab-carousel .prev,
body.detail-page .mobile-hero-gallery .prev{left:14px!important}
body.detail-page .desktop-tab-carousel .next,
body.detail-page .mobile-hero-gallery .next{right:14px!important}
body.detail-page .desktop-tab-carousel .dots,
body.detail-page .mobile-hero-gallery .dots{
  left:0!important;
  right:0!important;
  bottom:11px!important;
  text-align:center!important;
  transform:none!important;
}

/* Readable paragraph rhythm; Word-like wrap without clipped words. */
body.detail-page .desktop-overview-rich,
body.detail-page .desktop-tab-panel .specs-rich{
  overflow-wrap:break-word!important;
  word-break:normal!important;
  hyphens:auto;
}
body.detail-page .desktop-overview-rich p,
body.detail-page .desktop-tab-panel .specs-rich p,
body.detail-page .desktop-overview-rich li,
body.detail-page .desktop-tab-panel .specs-rich li{
  line-height:1.67!important;
}

/* LARGE SCREENS: full-width menu + text wrapping around a polished right gallery. */
@media (min-width:1181px){
  body.detail-page .detail-tabs{
    width:100vw!important;
    max-width:none!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
  }
  body.detail-page .detail-tabs a{font-size:13px!important;min-height:54px!important}
  body.detail-page .mobile-hero-gallery-shell{display:none!important}

  body.detail-page .desktop-overview-flow{
    display:block!important;
    padding:28px 30px 24px!important;
    border:1px solid var(--line)!important;
    border-radius:18px!important;
    background:#fff!important;
    box-shadow:var(--shadow)!important;
    overflow:visible!important;
    flow-root:initial!important;
  }
  body.detail-page .desktop-overview-flow::after{content:"";display:block;clear:both}
  body.detail-page .desktop-overview-flow>h2{margin:0 0 14px!important;font-size:22px!important}
  body.detail-page .desktop-overview-rich{font-size:15px!important;line-height:1.67!important}
  body.detail-page .desktop-overview-rich p,
  body.detail-page .desktop-overview-rich li{text-align:justify!important;text-justify:inter-word!important}

  body.detail-page .desktop-tab-carousel-wrap{
    float:right!important;
    width:min(60%,900px)!important;
    margin:0 0 24px 38px!important;
    shape-outside:margin-box;
  }
  body.detail-page .desktop-tab-carousel{
    width:100%!important;
    height:clamp(520px,37vw,650px)!important;
    min-height:520px!important;
    max-height:650px!important;
    border-radius:18px!important;
  }

  body.detail-page .desktop-tabbed-detail>.desktop-tab-panel>.benefits{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    width:100%!important;
    margin-top:14px!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    overflow:hidden!important;
    background:#fff!important;
    box-shadow:var(--shadow)!important;
  }

  body.detail-page .desktop-spec-tab-grid{
    display:grid!important;
    grid-template-columns:minmax(0,2fr) minmax(340px,1fr)!important;
    gap:18px!important;
    align-items:start!important;
  }
  body.detail-page .desktop-spec-tab-grid>.spec-card,
  body.detail-page .desktop-spec-tab-grid>.related-panel,
  body.detail-page .desktop-tab-inner{
    min-width:0!important;
    border-radius:16px!important;
    box-shadow:var(--shadow)!important;
  }
  body.detail-page .desktop-tab-inner{padding:24px!important;border:1px solid var(--line)!important;background:#fff!important}
  body.detail-page .desktop-tab-inner .app-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important}
  body.detail-page .desktop-tab-inner.faq .faq-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* TABLETS / COMPACT LAPTOPS: gallery first, tabs, then selected content. */
@media (min-width:701px) and (max-width:1180px){
  body.detail-page .desktop-tabbed-detail{width:min(1180px,94%)!important;margin:14px auto 24px!important}
  body.detail-page .detail-tabs{width:100%!important;margin:0!important;position:sticky!important}
  body.detail-page .detail-tabs a{font-size:11px!important;min-height:48px!important;padding:9px 6px!important}
  body.detail-page .mobile-hero-gallery-shell{
    display:block!important;
    width:min(1180px,94%)!important;
    margin:18px auto 14px!important;
  }
  body.detail-page .mobile-hero-gallery{
    height:clamp(460px,62vw,600px)!important;
    border-radius:18px!important;
  }
  body.detail-page .desktop-tab-carousel-wrap{display:none!important}
  body.detail-page .desktop-overview-flow{
    padding:24px!important;
    border:1px solid var(--line)!important;
    border-radius:16px!important;
    background:#fff!important;
    box-shadow:var(--shadow)!important;
    overflow:visible!important;
  }
  body.detail-page .desktop-overview-flow>h2{font-size:20px!important;margin-top:0!important}
  body.detail-page .desktop-overview-rich p,
  body.detail-page .desktop-overview-rich li,
  body.detail-page .desktop-tab-panel .specs-rich p,
  body.detail-page .desktop-tab-panel .specs-rich li{text-align:justify!important;text-justify:inter-word!important}
  body.detail-page .desktop-spec-tab-grid{display:block!important}
  body.detail-page .desktop-spec-tab-grid>.related-panel{margin-top:16px!important}
  body.detail-page .desktop-tab-inner{padding:20px!important;border:1px solid var(--line)!important;border-radius:16px!important;background:#fff!important;box-shadow:var(--shadow)!important}
  body.detail-page .desktop-tab-inner .app-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  body.detail-page .desktop-tab-inner.faq .faq-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.detail-page .desktop-tabbed-detail>.desktop-tab-panel>.benefits{margin-top:14px!important;border:1px solid var(--line)!important;border-radius:14px!important;overflow:hidden!important;background:#fff!important}
}

/* PHONES: same tab-switching interaction, compact stacked presentation. */
@media (max-width:700px){
  body.detail-page .desktop-tabbed-detail{width:95%!important;margin:10px auto 20px!important}
  body.detail-page .detail-tabs{
    width:100%!important;
    margin:0!important;
    position:sticky!important;
    top:62px!important;
  }
  body.detail-page .detail-tabs a{font-size:9px!important;min-height:42px!important;padding:7px 3px!important}
  body.detail-page .mobile-hero-gallery-shell{display:block!important;width:95%!important;margin:12px auto 10px!important}
  body.detail-page .mobile-hero-gallery{height:clamp(245px,74vw,340px)!important;border-radius:13px!important}
  body.detail-page .desktop-tab-carousel-wrap{display:none!important}
  body.detail-page .mobile-hero-gallery .prev,
  body.detail-page .mobile-hero-gallery .next{width:42px!important;height:42px!important}
  body.detail-page .desktop-overview-flow,
  body.detail-page .desktop-tab-inner,
  body.detail-page .desktop-spec-tab-grid>.spec-card,
  body.detail-page .desktop-spec-tab-grid>.related-panel{
    padding:15px!important;
    border:1px solid var(--line)!important;
    border-radius:13px!important;
    background:#fff!important;
    box-shadow:none!important;
  }
  body.detail-page .desktop-overview-flow>h2{font-size:17px!important;margin-top:0!important}
  body.detail-page .desktop-overview-rich{font-size:12px!important;line-height:1.6!important}
  body.detail-page .desktop-overview-rich p,
  body.detail-page .desktop-overview-rich li,
  body.detail-page .desktop-tab-panel .specs-rich p,
  body.detail-page .desktop-tab-panel .specs-rich li{text-align:left!important}
  body.detail-page .desktop-spec-tab-grid{display:block!important}
  body.detail-page .desktop-spec-tab-grid>.related-panel{margin-top:12px!important}
  body.detail-page .desktop-tab-inner .app-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.detail-page .desktop-tab-inner.faq .faq-grid{grid-template-columns:1fr!important}
  body.detail-page .desktop-tabbed-detail>.desktop-tab-panel>.benefits{margin-top:10px!important;border-radius:12px!important;overflow:hidden!important}
}


/* ===== reference-final-v24.css ===== */
/* V24 / V40 — header, compact navigation and bottom related-content hub */

/* ----- Header: cleaner on scroll across all screens ----- */
body .top{
  transition:height .22s ease,background .22s ease,box-shadow .22s ease,border-color .22s ease,top .22s ease,left .22s ease,right .22s ease,border-radius .22s ease!important;
}
body .top.is-scrolled{
  position:fixed!important;
  top:0!important;
  left:0!important;
  right:0!important;
  width:100%!important;
  height:64px!important;
  padding:6px clamp(22px,3.5vw,58px)!important;
  border:0!important;
  border-bottom:1px solid #e0e7f0!important;
  border-radius:0!important;
  background:rgba(255,255,255,.98)!important;
  box-shadow:0 10px 28px rgba(3,37,81,.10)!important;
  backdrop-filter:blur(18px)!important;
  z-index:100!important;
}
body .top.is-scrolled .brand{
  position:static!important;
  width:185px!important;
  margin-right:auto!important;
}
body .top.is-scrolled .brand img{max-height:48px!important}
body .top.is-scrolled nav{background:transparent!important;box-shadow:none!important}
body .top.is-scrolled nav>a:not(.mobile-nav-quote){position:relative}
body .top.is-scrolled nav>a:not(.mobile-nav-quote)::after{
  content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;border-radius:2px;background:var(--blue);transform:scaleX(0);transition:transform .18s ease;
}
body .top.is-scrolled nav>a:not(.mobile-nav-quote):hover::after{transform:scaleX(1)}
body.home-page .top.is-scrolled>.gold{position:static!important;right:auto!important;top:auto!important;margin-left:auto!important}
body.detail-page .detail-tabs{top:var(--site-header-h,64px)!important}

/* ----- Mobile / tablet navigation drawer ----- */
.mobile-nav-head,.mobile-nav-quote,.nav-backdrop{display:none}
@media(max-width:980px){
  body.nav-open{overflow:hidden!important}
  body .top,
  body.home-page .top,
  body.detail-page .top{
    z-index:120!important;
  }
  body .top.is-scrolled{height:60px!important;padding:5px 14px!important}
  body .top.is-scrolled .brand{width:160px!important}
  body .top.is-scrolled .brand img{max-height:44px!important}
  body .nav-toggle{display:grid!important;place-items:center;width:42px;height:42px;border-radius:10px!important;background:#f5f8fc!important;border:1px solid #dbe5f0!important;z-index:132!important}
  body .top nav.site-nav{
    display:flex!important;
    position:fixed!important;
    top:12px!important;
    right:12px!important;
    left:auto!important;
    bottom:auto!important;
    width:min(420px,calc(100vw - 24px))!important;
    max-height:calc(100dvh - 24px)!important;
    padding:14px!important;
    margin:0!important;
    gap:6px!important;
    flex-direction:column!important;
    align-items:stretch!important;
    overflow:auto!important;
    border:1px solid #dbe5f0!important;
    border-radius:18px!important;
    background:#fff!important;
    box-shadow:0 24px 70px rgba(0,29,67,.26)!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateX(calc(100% + 28px)) scale(.98)!important;
    transition:transform .24s ease,opacity .2s ease,visibility .2s ease!important;
    z-index:140!important;
  }
  body .top nav.site-nav.open{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translateX(0) scale(1)!important;
  }
  body .top nav.site-nav>a:not(.mobile-nav-quote){
    display:flex!important;
    align-items:center!important;
    min-height:46px!important;
    padding:10px 13px!important;
    border:1px solid transparent!important;
    border-radius:11px!important;
    font-size:14px!important;
    font-weight:700!important;
    color:var(--navy)!important;
    background:#fff!important;
  }
  body .top nav.site-nav>a:not(.mobile-nav-quote):hover,
  body .top nav.site-nav>a:not(.mobile-nav-quote):focus{background:#f3f7fc!important;border-color:#dbe5f0!important}
  .mobile-nav-head{display:flex!important;align-items:center;justify-content:space-between;padding:4px 4px 10px 8px;border-bottom:1px solid #e4ebf3;margin-bottom:4px;font-weight:800;font-size:17px;color:var(--navy)}
  .mobile-nav-close{display:grid;place-items:center;width:40px;height:40px;border:1px solid #d8e2ee;border-radius:10px;background:#f7f9fc;color:var(--navy);cursor:pointer}
  .mobile-nav-close .icon{width:18px;height:18px}
  .mobile-nav-quote{display:flex!important;align-items:center;justify-content:center;gap:8px;min-height:48px;margin-top:7px;padding:11px 14px;border-radius:11px;background:linear-gradient(115deg,#f7e6bf,#d6a34b)!important;color:#352407!important;font-weight:800!important;border:1px solid #c89338!important}
  .mobile-nav-quote .icon{width:16px}
  .nav-backdrop{
    display:block!important;position:fixed;inset:0;border:0;padding:0;background:rgba(1,18,43,.34);backdrop-filter:blur(2px);opacity:0;visibility:hidden;pointer-events:none;transition:.2s;z-index:118;
  }
  body.nav-open .nav-backdrop{opacity:1;visibility:visible;pointer-events:auto}
  body.detail-page .detail-tabs{top:var(--site-header-h,60px)!important}
}
@media(max-width:600px){
  body .top nav.site-nav{top:10px!important;right:10px!important;width:calc(100vw - 20px)!important;max-height:calc(100dvh - 20px)!important;border-radius:16px!important}
  body .top.is-scrolled{height:58px!important;padding:4px 10px!important}
  body .top.is-scrolled .brand{width:145px!important}
  body.detail-page .detail-tabs{top:var(--site-header-h,58px)!important}
}

/* ----- Specifications are technical-only; no related cards beside them ----- */
body.detail-page .desktop-spec-tab-grid{display:block!important}
body.detail-page .desktop-spec-tab-grid>.spec-card{width:100%!important;max-width:none!important}

/* ----- Bottom related-content hub for Product, Service and Blog pages ----- */
.related-content-hub{
  margin:34px 0 0;
  padding:34px 0 38px;
  border-top:1px solid #dbe5f0;
  background:linear-gradient(180deg,#f8fbff 0,#fff 100%);
}
.related-hub-inner{width:min(1500px,94%);margin:0 auto}
.related-hub-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:20px}
.related-hub-head .eyebrow{margin:0 0 4px}
.related-hub-head h2{margin:0;font-size:clamp(24px,2.2vw,34px);color:var(--navy)}
.related-hub-groups{display:grid;gap:24px}
.related-hub-groups>section{padding:18px;border:1px solid #dbe5f0;border-radius:16px;background:#fff;box-shadow:0 12px 28px rgba(4,35,77,.07)}
.related-group-title{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:13px}
.related-group-title h3{margin:0;font-size:17px;color:var(--navy)}
.related-group-title>a{display:flex;align-items:center;gap:5px;font-size:12px;font-weight:800;color:var(--blue)}
.related-group-title>a .icon{width:14px}
.related-content-hub .related-cards{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.related-content-hub .related-cards a{border-radius:11px;box-shadow:0 8px 20px rgba(4,35,77,.05)}
.related-content-hub .related-cards img{height:145px;object-fit:cover}
.related-content-hub .related-cards span{padding:10px;font-size:12px;font-weight:700}
.contextual-link{color:var(--blue);font-weight:700;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
.contextual-link:hover{color:#a36d17}
@media(max-width:980px){
  .related-content-hub{padding:28px 0 32px}
  .related-content-hub .related-cards{grid-template-columns:repeat(3,minmax(0,1fr))}
  .related-content-hub .related-cards img{height:120px}
}
@media(max-width:600px){
  .related-content-hub{margin-top:22px;padding:24px 0 28px}
  .related-hub-inner{width:94%}
  .related-hub-groups>section{padding:12px;border-radius:13px}
  .related-group-title{align-items:flex-start}
  .related-group-title h3{font-size:15px}
  .related-group-title>a{font-size:10px}
  .related-content-hub .related-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .related-content-hub .related-cards img{height:100px}
  .related-content-hub .related-cards span{font-size:10px;padding:8px}
}


/* ===== reference-final-v25.css ===== */
/* V25 / V41 — compact responsive navigation + detail overview spacing QA fixes */

/* Desktop tabs are intentionally in normal flow (V14/V23). V24 only
   supplied sticky offsets; on large screens that moved the relative tab bar
   down without reserving space and allowed it to cover Product Overview. */
@media(min-width:1181px){
  body.detail-page .detail-tabs{
    top:auto!important;
  }
  body.detail-page .desktop-tabbed-detail{
    margin-top:22px!important;
  }
  body.detail-page .desktop-overview-flow{
    padding-top:28px!important;
  }
  body.detail-page .desktop-overview-flow>h2{
    position:relative!important;
    z-index:1!important;
    margin-top:0!important;
  }
}

/* Compact mobile/tablet navigation: anchored beside the hamburger, right aligned. */
@media(max-width:980px){
  body .top nav.site-nav{
    top:calc(var(--site-header-h,60px) + 8px)!important;
    right:12px!important;
    left:auto!important;
    width:min(310px,calc(100vw - 24px))!important;
    max-height:calc(100dvh - var(--site-header-h,60px) - 20px)!important;
    padding:9px!important;
    gap:2px!important;
    border-radius:15px!important;
    transform-origin:top right!important;
    transform:translateY(-8px) scale(.97)!important;
    box-shadow:0 20px 52px rgba(0,29,67,.24)!important;
  }
  body .top nav.site-nav.open{
    transform:translateY(0) scale(1)!important;
  }
  .mobile-nav-head{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    min-height:34px!important;
    padding:0 0 3px!important;
    margin:0 0 2px!important;
    border-bottom:0!important;
  }
  .mobile-nav-head>span{display:none!important}
  .mobile-nav-close{
    width:34px!important;
    height:34px!important;
    border-radius:9px!important;
    background:#f7f9fc!important;
  }
  .mobile-nav-close .icon{width:16px!important;height:16px!important}
  body .top nav.site-nav>a:not(.mobile-nav-quote){
    justify-content:flex-end!important;
    min-height:39px!important;
    padding:7px 10px!important;
    border-radius:9px!important;
    font-size:13px!important;
    line-height:1.2!important;
    text-align:right!important;
  }
  .mobile-nav-quote{
    justify-content:flex-end!important;
    min-height:42px!important;
    margin-top:5px!important;
    padding:9px 11px!important;
    border-radius:10px!important;
    font-size:13px!important;
    text-align:right!important;
  }
  .mobile-nav-quote .icon{width:14px!important}
}


@media(max-width:600px){
  body .top nav.site-nav{
    top:calc(var(--site-header-h,58px) + 7px)!important;
    right:10px!important;
    width:min(286px,calc(100vw - 28px))!important;
    max-height:calc(100dvh - var(--site-header-h,58px) - 18px)!important;
    padding:8px!important;
    border-radius:14px!important;
  }
  body .top nav.site-nav>a:not(.mobile-nav-quote){
    min-height:38px!important;
    padding:7px 9px!important;
    font-size:12.5px!important;
  }
  .mobile-nav-quote{
    min-height:41px!important;
    padding:8px 10px!important;
    font-size:12.5px!important;
  }
}


/* ===== reference-final-v26.css ===== */
/* V26 / V42 — full-screen small-screen navigation + listing category filters */

@media(max-width:980px){
  body.nav-open{overflow:hidden!important}
  body.nav-open .top{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;filter:none!important;transform:none!important;perspective:none!important;contain:none!important}
  body .top nav.site-nav{
    display:flex!important;
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    max-height:none!important;
    padding:clamp(92px,14vh,128px) 24px clamp(34px,7vh,58px)!important;
    margin:0!important;
    gap:clamp(13px,2.2vh,22px)!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:auto!important;
    border:0!important;
    border-radius:0!important;
    background:linear-gradient(145deg,#061b35 0%,#082b54 58%,#04162b 100%)!important;
    box-shadow:none!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateY(-10px)!important;
    transition:opacity .2s ease,transform .24s ease,visibility .2s ease!important;
    z-index:160!important;
  }
  body .top nav.site-nav.open{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translateY(0)!important;
  }
  .mobile-nav-head{
    display:flex!important;
    position:absolute!important;
    top:max(18px,env(safe-area-inset-top))!important;
    left:max(18px,env(safe-area-inset-left))!important;
    right:max(18px,env(safe-area-inset-right))!important;
    min-height:54px!important;
    padding:0!important;
    margin:0!important;
    align-items:center!important;
    justify-content:space-between!important;
    border:0!important;
  }
  .mobile-nav-brand{
    display:block!important;
    width:clamp(142px,24vw,184px)!important;
    min-height:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
  }
  .mobile-nav-brand img{
    width:100%!important;
    height:auto!important;
    filter:brightness(0) invert(1)!important;
    opacity:.98!important;
  }
  .mobile-nav-close{
    display:grid!important;
    place-items:center!important;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    padding:0!important;
    border:1px solid rgba(213,164,73,.68)!important;
    border-radius:50%!important;
    background:rgba(255,255,255,.035)!important;
    color:#fff!important;
    box-shadow:none!important;
  }
  .mobile-nav-close .icon{width:20px!important;height:20px!important}
  body .top nav.site-nav>a:not(.mobile-nav-quote):not(.mobile-nav-brand){
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:auto!important;
    min-height:auto!important;
    padding:4px 12px!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    color:#fff!important;
    font-size:clamp(18px,2.6vw,21px)!important;
    font-weight:600!important;
    line-height:1.25!important;
    text-align:center!important;
    letter-spacing:-.015em!important;
  }
  body .top nav.site-nav>a:not(.mobile-nav-quote):not(.mobile-nav-brand):hover,
  body .top nav.site-nav>a:not(.mobile-nav-quote):not(.mobile-nav-brand):focus{
    color:#e2b861!important;
    background:transparent!important;
    border-color:transparent!important;
  }
  body .top nav.site-nav>a:not(.mobile-nav-quote):not(.mobile-nav-brand)::after{display:none!important}
  .mobile-nav-quote{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    width:min(220px,72vw)!important;
    min-height:44px!important;
    margin-top:clamp(5px,1.2vh,12px)!important;
    padding:10px 18px!important;
    border:1px solid #d5a449!important;
    border-radius:999px!important;
    background:rgba(213,164,73,.08)!important;
    color:#f2cf87!important;
    font-size:14px!important;
    font-weight:800!important;
    text-align:center!important;
    box-shadow:none!important;
  }
  .mobile-nav-quote:hover,.mobile-nav-quote:focus{background:#d5a449!important;color:#071a31!important}
  .mobile-nav-quote .icon{width:15px!important}
  .nav-backdrop{display:none!important}
}

@media(max-width:600px){
  body .top nav.site-nav{
    padding:88px 18px max(28px,env(safe-area-inset-bottom))!important;
    gap:clamp(11px,2vh,18px)!important;
  }
  .mobile-nav-head{
    top:max(14px,env(safe-area-inset-top))!important;
    left:max(15px,env(safe-area-inset-left))!important;
    right:max(15px,env(safe-area-inset-right))!important;
  }
  .mobile-nav-brand{width:clamp(132px,38vw,154px)!important}
  .mobile-nav-close{width:42px!important;height:42px!important;min-width:42px!important}
  body .top nav.site-nav>a:not(.mobile-nav-quote):not(.mobile-nav-brand){font-size:18px!important;padding:3px 10px!important}
  .mobile-nav-quote{width:min(208px,74vw)!important;min-height:42px!important;font-size:13.5px!important}
}

@media(max-width:980px) and (max-height:650px){
  body .top nav.site-nav{justify-content:flex-start!important;padding-top:82px!important;gap:8px!important}
  body .top nav.site-nav>a:not(.mobile-nav-quote):not(.mobile-nav-brand){font-size:16px!important;padding:2px 10px!important}
  .mobile-nav-quote{margin-top:3px!important;min-height:38px!important;padding:8px 16px!important}
  .mobile-nav-head{min-height:46px!important}
  .mobile-nav-close{width:38px!important;height:38px!important;min-width:38px!important}
}

/* Product / Service listing category filters are driven by enabled admin categories. */
.listing-category-filters{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:9px;
  margin:0 auto 24px;
  padding:0;
}
.listing-category-filters button{
  min-height:38px;
  padding:8px 14px;
  border:1px solid #cddaea;
  border-radius:999px;
  background:#fff;
  color:var(--navy);
  font:700 12px/1.2 AALMSans,"Segoe UI",Arial,sans-serif;
  cursor:pointer;
  transition:.18s ease;
}
.listing-category-filters button:hover{border-color:#9eb7d5;background:#f5f9ff}
.listing-category-filters button.active{border-color:#0c58a7;background:#083e7e;color:#fff;box-shadow:0 7px 18px rgba(5,52,105,.12)}
.listing-page .content-card.hidden{display:none!important}
@media(max-width:600px){
  .listing-category-filters{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;margin-inline:-2px;padding:0 2px 7px;scrollbar-width:none}
  .listing-category-filters::-webkit-scrollbar{display:none}
  .listing-category-filters button{flex:0 0 auto;white-space:nowrap;font-size:11.5px;min-height:36px;padding:8px 12px}
}


/* ===== reference-final-v27.css ===== */
/* V44 — homepage trust badges + unified Products / Services solutions section */

/* Trust indicators directly below the homepage hero CTAs. */
.home-page .reference-home-hero .home-trust-badges{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:clamp(14px,1.7vw,28px);
  margin-top:22px;
  color:#07356f;
}
.home-page .reference-home-hero .home-trust-badges>span{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:108px;
}
.home-page .reference-home-hero .home-trust-badges .icon{
  flex:0 0 auto;
  width:26px;
  height:26px;
  color:#0a4d9a;
  stroke-width:1.65;
}
.home-page .reference-home-hero .home-trust-badges b{
  display:block;
  color:#07356f;
  font-size:11px;
  line-height:1.05;
  font-weight:800;
  letter-spacing:-.01em;
}
.home-page .reference-home-hero .home-trust-badges small{
  display:block;
  margin-top:3px;
  color:#294f7c;
  font-size:9px;
  line-height:1.05;
  font-weight:650;
}

/* Unified homepage Products / Services section. */
.home-solutions{
  position:relative;
  padding:clamp(34px,4vw,58px) clamp(22px,4vw,64px) clamp(42px,4.5vw,70px);
  background:
    radial-gradient(circle at 92% 5%,rgba(27,93,162,.055),transparent 29%),
    #fff;
  color:var(--ink);
}
.solutions-heading{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:24px;
  max-width:1500px;
  margin:0 auto 23px;
}
.solutions-heading .eyebrow{
  margin:0 0 7px;
  color:#b57a17;
  font-size:10px;
  font-weight:850;
  letter-spacing:.14em;
}
.solutions-heading h2{
  margin:0;
  color:#07356f;
  font-size:clamp(26px,2.45vw,40px);
  line-height:1.03;
  letter-spacing:-.035em;
}
.solutions-heading>div>p:last-child{
  max-width:790px;
  margin:10px 0 0;
  color:#4a6079;
  font-size:clamp(12px,1vw,15px);
  line-height:1.48;
}
.solutions-view-all{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 2px;
  color:#07356f;
  font-size:12px;
  font-weight:850;
  white-space:nowrap;
}
.solutions-view-all .icon{width:16px;height:16px;transition:transform .18s ease}
.solutions-view-all:hover .icon{transform:translateX(3px)}

.solution-type-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  width:min(410px,100%);
  margin:0 auto 22px;
  padding:4px;
  border:1px solid #d7e2ee;
  border-radius:999px;
  background:#f3f7fb;
  box-shadow:inset 0 1px 2px rgba(7,53,111,.04);
}
.solution-type-tabs button{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:44px;
  padding:9px 18px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:#173e70;
  font:800 13px/1 AALMSans,"Segoe UI",Arial,sans-serif;
  cursor:pointer;
  transition:background .18s ease,color .18s ease,box-shadow .18s ease;
}
.solution-type-tabs button .icon{width:17px;height:17px}
.solution-type-tabs button.active{
  background:linear-gradient(135deg,#083f7d,#052d60);
  color:#fff;
  box-shadow:0 8px 20px rgba(4,47,100,.18);
}
.solution-panel[hidden]{display:none!important}

.solution-filters{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
  max-width:1500px;
  margin:0 auto 24px;
}
.solution-filters button{
  min-height:36px;
  padding:8px 13px;
  border:1px solid #cedbea;
  border-radius:999px;
  background:#fff;
  color:#0b356a;
  font:750 11px/1.15 AALMSans,"Segoe UI",Arial,sans-serif;
  white-space:nowrap;
  cursor:pointer;
  transition:border-color .16s ease,background .16s ease,color .16s ease,box-shadow .16s ease;
}
.solution-filters button:hover{border-color:#9cb5d0;background:#f7faff}
.solution-filters button.active{
  border-color:#073d7a;
  background:#073d7a;
  color:#fff;
  box-shadow:0 6px 15px rgba(7,61,122,.12);
}

.solution-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
  max-width:1500px;
  margin:0 auto;
  align-items:start;
}
.solution-card{
  position:relative;
  min-width:0;
  overflow:hidden;
  border:1px solid #d9e4ef;
  border-radius:13px;
  background:#fff;
  color:#082f62;
  box-shadow:0 8px 28px rgba(9,53,102,.07);
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.solution-card:hover{
  transform:translateY(-3px);
  border-color:#b8cce2;
  box-shadow:0 14px 32px rgba(9,53,102,.12);
}
.solution-card.is-hidden{display:none!important}
.solution-card-media{
  position:relative;
  height:clamp(150px,13vw,220px);
  overflow:hidden;
  background:#e9eef4;
}
.solution-card-media:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,20,45,.02) 50%,rgba(0,24,56,.34) 100%);
  pointer-events:none;
}
.solution-card-media img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .35s ease;
}
.solution-card:hover .solution-card-media img{transform:scale(1.035)}
.solution-card-type{
  position:absolute;
  z-index:2;
  top:11px;
  left:11px;
  padding:5px 8px;
  border:1px solid rgba(255,255,255,.55);
  border-radius:999px;
  background:rgba(4,40,82,.78);
  color:#fff;
  backdrop-filter:blur(7px);
  font-size:8px;
  font-weight:850;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.solution-card-body{
  position:relative;
  min-height:92px;
  padding:13px 46px 15px 14px;
}
.solution-card-body small{
  display:block;
  margin-bottom:6px;
  overflow:hidden;
  color:#6b7e93;
  font-size:9px;
  font-weight:700;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.solution-card-body strong{
  display:block;
  color:#082f62;
  font-size:clamp(13px,1.05vw,16px);
  line-height:1.18;
  letter-spacing:-.015em;
}
.solution-card-arrow{
  position:absolute;
  right:13px;
  bottom:15px;
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border:1px solid #d6a548;
  border-radius:50%;
  color:#9d690d;
  transition:background .18s ease,color .18s ease,transform .18s ease;
}
.solution-card-arrow .icon{width:15px;height:15px}
.solution-card:hover .solution-card-arrow{background:#d6a548;color:#062b59;transform:translateX(2px)}

@media (max-width:1180px){
  /* The existing tablet hero intentionally hides its CTA row; keep the compact hero uncluttered. */
  .home-page .reference-home-hero .home-trust-badges{display:none!important}
  .solution-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media (max-width:820px){
  .home-solutions{padding:30px 18px 40px}
  .solutions-heading{grid-template-columns:1fr;align-items:start;gap:8px;margin-bottom:18px}
  .solutions-heading h2{font-size:clamp(24px,4.6vw,33px)}
  .solutions-heading>div>p:last-child{font-size:12px}
  .solutions-view-all{justify-self:start;padding:2px 0 7px}
  .solution-type-tabs{margin-bottom:17px}
  .solution-filters{
    justify-content:flex-start;
    flex-wrap:nowrap;
    overflow-x:auto;
    overscroll-behavior-x:contain;
    scroll-snap-type:x proximity;
    margin-inline:-2px;
    padding:0 2px 8px;
    scrollbar-width:none;
  }
  .solution-filters::-webkit-scrollbar{display:none}
  .solution-filters button{flex:0 0 auto;scroll-snap-align:start}
  .solution-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .solution-card-media{height:190px}
  .solution-card-body{min-height:88px}
}

@media (max-width:560px){
  .home-solutions{padding:25px 12px 34px}
  .solutions-heading{margin-bottom:15px}
  .solutions-heading .eyebrow{font-size:8px;margin-bottom:5px}
  .solutions-heading h2{font-size:25px;line-height:1.02}
  .solutions-heading>div>p:last-child{margin-top:8px;font-size:11px;line-height:1.4}
  .solutions-view-all{font-size:10px}
  .solution-type-tabs{width:100%;margin-bottom:15px;padding:3px}
  .solution-type-tabs button{min-height:40px;font-size:12px;padding:8px 11px}
  .solution-type-tabs button .icon{width:15px;height:15px}
  .solution-filters{gap:6px;margin-bottom:14px}
  .solution-filters button{min-height:33px;padding:7px 10px;font-size:9.5px}
  .solution-grid{grid-template-columns:1fr;gap:11px}
  .solution-card{display:grid;grid-template-columns:42% 58%;min-height:118px}
  .solution-card-media{height:100%;min-height:118px}
  .solution-card-type{top:7px;left:7px;font-size:7px;padding:4px 6px}
  .solution-card-body{display:flex;flex-direction:column;justify-content:center;min-height:118px;padding:12px 40px 12px 12px}
  .solution-card-body small{font-size:8px;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .solution-card-body strong{font-size:13px}
  .solution-card-arrow{right:9px;bottom:10px;width:27px;height:27px}
}

@media (prefers-reduced-motion:reduce){
  .solution-card,.solution-card-media img,.solution-card-arrow,.solutions-view-all .icon{transition:none!important}
}

/* Compact-screen trust strip: the hero CTA row is intentionally hidden by the existing tablet/mobile hero, so the same assurances remain visible immediately below the hero. */
.home-trust-badges.mobile-trust{display:none}
@media (max-width:1180px){
  .home-trust-badges.mobile-trust{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:0;
    width:100%;
    margin:0;
    padding:10px clamp(14px,4vw,30px);
    border-top:1px solid #e1e8f0;
    border-bottom:1px solid #e1e8f0;
    background:#fff;
    color:#07356f;
  }
  .home-trust-badges.mobile-trust>span{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-width:0;
    padding:3px 10px;
    border-right:1px solid #e5ebf2;
  }
  .home-trust-badges.mobile-trust>span:last-child{border-right:0}
  .home-trust-badges.mobile-trust .icon{
    flex:0 0 auto;
    width:24px;
    height:24px;
    color:#0a4d9a;
  }
  .home-trust-badges.mobile-trust b{
    display:block;
    color:#07356f;
    font-size:10px;
    line-height:1.05;
    font-weight:800;
  }
  .home-trust-badges.mobile-trust small{
    display:block;
    margin-top:2px;
    color:#506985;
    font-size:8.5px;
    line-height:1.05;
    font-weight:650;
  }
}
@media (max-width:520px){
  .home-trust-badges.mobile-trust{padding:9px 6px}
  .home-trust-badges.mobile-trust>span{gap:5px;padding:2px 4px}
  .home-trust-badges.mobile-trust .icon{width:19px;height:19px}
  .home-trust-badges.mobile-trust b{font-size:8.5px}
  .home-trust-badges.mobile-trust small{font-size:7px}
}


/* ===== reference-final-v28.css ===== */
/* V45 — compact home solutions intro + interactive category rail */

.home-solutions{
  padding-top:clamp(24px,2.7vw,40px);
}

/* The large eyebrow/title from V44 is intentionally replaced by one compact sentence. */
.solutions-heading{
  align-items:center;
  gap:18px;
  margin-bottom:15px;
}
.solutions-intro{
  min-width:0;
  max-width:1160px;
  margin:0;
  color:#b57a17;
  font-size:clamp(12.5px,.95vw,15px);
  font-weight:850;
  line-height:1.42;
  letter-spacing:0;
  text-transform:none;
}
.solutions-view-all{
  padding:4px 2px;
}
.solution-type-tabs{
  margin-bottom:15px;
}

/* One-line category rail on every screen. Arrows remain visible as an affordance. */
.solution-filter-shell{
  position:relative;
  width:100%;
  max-width:1500px;
  margin:0 auto;
  padding:0 44px;
}
.solution-filters{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  flex-wrap:nowrap;
  gap:8px;
  max-width:none;
  margin:0;
  padding:2px 1px 6px;
  overflow-x:auto;
  overflow-y:hidden;
  overscroll-behavior-x:contain;
  scroll-behavior:smooth;
  scroll-snap-type:x proximity;
  scrollbar-width:none;
  cursor:grab;
  -webkit-overflow-scrolling:touch;
}
.solution-filters::-webkit-scrollbar{display:none}
.solution-filters.is-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.solution-filters button{
  flex:0 0 auto;
  scroll-snap-align:start;
}
.solution-filter-nav{
  position:absolute;
  z-index:3;
  top:50%;
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  padding:0;
  border:1px solid #bed0e2;
  border-radius:50%;
  background:#fff;
  color:#07356f;
  box-shadow:0 5px 15px rgba(7,53,111,.09);
  cursor:pointer;
  transform:translateY(-55%);
  transition:background .16s ease,border-color .16s ease,color .16s ease,opacity .16s ease,box-shadow .16s ease;
}
.solution-filter-nav:hover:not(:disabled){
  border-color:#d6a548;
  background:#fffaf0;
  color:#9b650b;
  box-shadow:0 7px 18px rgba(7,53,111,.13);
}
.solution-filter-nav:disabled{
  opacity:.38;
  cursor:default;
}
.solution-filter-nav .icon{width:15px;height:15px}
.solution-filter-prev{left:2px}
.solution-filter-prev .icon{transform:rotate(180deg)}
.solution-filter-next{right:2px}

/* Soft edge cues reinforce that the rail can continue beyond the viewport. */
.solution-filter-shell:before,
.solution-filter-shell:after{
  content:"";
  position:absolute;
  z-index:2;
  top:0;
  bottom:5px;
  width:28px;
  pointer-events:none;
}
.solution-filter-shell:before{
  left:38px;
  background:linear-gradient(90deg,#fff 15%,rgba(255,255,255,0));
}
.solution-filter-shell:after{
  right:38px;
  background:linear-gradient(270deg,#fff 15%,rgba(255,255,255,0));
}
.solution-filter-shell.at-start:before{opacity:0}
.solution-filter-shell.at-end:after{opacity:0}

.solution-swipe-hint{
  position:relative;
  left:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  max-width:calc(100% - 20px);
  margin:5px 0 17px;
  padding:5px 10px;
  border:1px solid #c8e2ef;
  border-radius:999px;
  background:#f1f9fd;
  color:#1476a8;
  transform:translateX(-50%);
  font-size:10px;
  font-weight:800;
  line-height:1;
  letter-spacing:.01em;
}
.solution-swipe-mark{
  color:#0f88b5;
  font-size:13px;
  line-height:1;
}

@media (max-width:820px){
  .home-solutions{padding-top:23px}
  .solutions-heading{
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:12px;
    margin-bottom:13px;
  }
  .solutions-intro{font-size:11.5px;line-height:1.38}
  .solutions-view-all{justify-self:end;padding:2px 0;font-size:10.5px}
  .solution-type-tabs{margin-bottom:13px}
  .solution-filter-shell{padding:0 39px}
  .solution-filter-nav{width:31px;height:31px}
  .solution-filter-prev{left:1px}
  .solution-filter-next{right:1px}
  .solution-filter-shell:before{left:32px;width:22px}
  .solution-filter-shell:after{right:32px;width:22px}
  .solution-filters{gap:6px;padding-bottom:5px}
  .solution-swipe-hint{margin:4px auto 14px;font-size:9.5px;padding:5px 9px}
}

@media (max-width:560px){
  .home-solutions{padding-top:20px}
  .solutions-heading{
    grid-template-columns:1fr;
    gap:5px;
    margin-bottom:11px;
  }
  .solutions-intro{font-size:11px;line-height:1.4}
  .solutions-view-all{justify-self:start;font-size:10px;padding:0}
  .solution-type-tabs{margin-bottom:11px}
  .solution-filter-shell{padding:0 35px}
  .solution-filter-nav{width:29px;height:29px}
  .solution-filter-nav .icon{width:13px;height:13px}
  .solution-filter-shell:before{left:29px;width:18px}
  .solution-filter-shell:after{right:29px;width:18px}
  .solution-swipe-hint{margin-top:3px;margin-bottom:12px;font-size:9px}
}

@media (prefers-reduced-motion:reduce){
  .solution-filters{scroll-behavior:auto}
  .solution-filter-nav{transition:none!important}
}


/* ===== reference-final-v29.css ===== */
/* V46 — compact Products / Services control row; intro and swipe helper removed */

.home-solutions{
  padding-top:clamp(18px,2vw,30px);
}

/* Desktop/laptop: keep the toggle visually centred while the dynamic CTA sits on the same line at right. */
.solutions-controls{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:center;
  width:100%;
  gap:16px;
  margin:0 0 14px;
}
.solutions-controls .solution-type-tabs{
  grid-column:2;
  margin:0;
}
.solutions-controls .solutions-view-all{
  grid-column:3;
  justify-self:end;
  align-self:center;
  margin:0;
  padding:4px 2px;
  white-space:nowrap;
}

/* V45 intro/helper text is intentionally absent in V46. */
.solutions-heading,
.solutions-intro,
.solution-swipe-hint{
  display:none!important;
}

/* Without the helper line, keep the category rail close to the cards. */
.solution-filter-shell{
  margin-bottom:14px;
}
.solution-filters{
  padding-bottom:3px;
}

@media (max-width:820px){
  .home-solutions{padding-top:18px}
  .solutions-controls{
    grid-template-columns:1fr;
    justify-items:center;
    gap:8px;
    margin-bottom:12px;
  }
  .solutions-controls .solution-type-tabs{
    grid-column:1;
    width:min(100%,430px);
    margin:0;
  }
  .solutions-controls .solutions-view-all{
    grid-column:1;
    justify-self:center;
    font-size:10.5px;
    padding:1px 0 2px;
  }
  .solution-filter-shell{margin-bottom:12px}
}

@media (max-width:560px){
  .home-solutions{padding-top:16px}
  .solutions-controls{
    gap:7px;
    margin-bottom:10px;
  }
  .solutions-controls .solution-type-tabs{width:100%}
  .solutions-controls .solutions-view-all{font-size:10px}
  .solution-filter-shell{margin-bottom:10px}
}


/* ===== reference-final-v30.css ===== */
/* V47 — homepage Product / Service cards use a full-image overlay treatment on every screen. */

.home-solutions .solution-card{
  position:relative;
  display:block;
  min-height:0;
  overflow:hidden;
  border:1px solid #d6e1ec;
  border-radius:13px;
  background:#082f62;
  color:#fff;
  box-shadow:0 9px 28px rgba(7,47,98,.10);
  isolation:isolate;
}

.home-solutions .solution-card-media{
  position:relative;
  height:clamp(215px,18vw,292px);
  min-height:0;
  overflow:hidden;
  background:#dce5ed;
}

/* Strong lower fade keeps category/title legible over both light and dark photography. */
.home-solutions .solution-card-media:after{
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  background:linear-gradient(
    180deg,
    rgba(1,20,43,.02) 26%,
    rgba(2,26,57,.14) 48%,
    rgba(2,28,61,.72) 76%,
    rgba(2,28,61,.96) 100%
  );
  pointer-events:none;
}

.home-solutions .solution-card-media img{
  width:100%;
  height:100%;
  object-fit:cover;
}

/* The Products/Services toggle already communicates type, so remove the redundant image badge. */
.home-solutions .solution-card-type{
  display:none!important;
}

/* Existing body markup is visually moved into the image instead of occupying a white footer. */
.home-solutions .solution-card-body{
  position:absolute;
  z-index:3;
  left:0;
  right:0;
  bottom:0;
  display:block;
  min-height:0;
  padding:18px 56px 17px 17px;
  pointer-events:none;
}

.home-solutions .solution-card-body small{
  display:-webkit-box;
  max-width:100%;
  margin:0 0 6px;
  overflow:hidden;
  color:#e4b95f;
  font-size:clamp(8px,.72vw,10px);
  font-weight:800;
  line-height:1.2;
  letter-spacing:.005em;
  text-overflow:ellipsis;
  white-space:normal;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}

.home-solutions .solution-card-body strong{
  display:-webkit-box;
  max-width:100%;
  overflow:hidden;
  color:#fff;
  font-size:clamp(14px,1.12vw,18px);
  font-weight:800;
  line-height:1.16;
  letter-spacing:-.015em;
  text-shadow:0 1px 8px rgba(0,19,43,.38);
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}

.home-solutions .solution-card-arrow{
  position:absolute;
  z-index:4;
  right:15px;
  bottom:17px;
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border:1.5px solid #e1ad45;
  border-radius:50%;
  background:rgba(3,35,73,.48);
  color:#f0c15f;
  backdrop-filter:blur(4px);
  pointer-events:none;
}

.home-solutions .solution-card-arrow .icon{
  width:15px;
  height:15px;
}

.home-solutions .solution-card:hover{
  transform:translateY(-3px);
  border-color:#b5cbe0;
  box-shadow:0 15px 34px rgba(7,47,98,.15);
}
.home-solutions .solution-card:hover .solution-card-media img{
  transform:scale(1.035);
}
.home-solutions .solution-card:hover .solution-card-arrow{
  background:#d6a548;
  color:#062b59;
  transform:translateX(2px);
}

@media (max-width:1180px){
  .home-solutions .solution-card-media{
    height:clamp(205px,24vw,260px);
  }
}

@media (max-width:820px){
  .home-solutions .solution-card-media{
    height:clamp(195px,35vw,245px);
  }
  .home-solutions .solution-card-body{
    padding:16px 51px 15px 15px;
  }
  .home-solutions .solution-card-body small{
    font-size:8.5px;
    margin-bottom:5px;
  }
  .home-solutions .solution-card-body strong{
    font-size:14px;
  }
  .home-solutions .solution-card-arrow{
    right:13px;
    bottom:15px;
    width:31px;
    height:31px;
  }
}

@media (max-width:560px){
  /* V27 used a split image/text card on phones. V47 intentionally keeps one full-image card. */
  .home-solutions .solution-card{
    display:block;
    min-height:0;
  }
  .home-solutions .solution-card-media{
    height:clamp(190px,58vw,245px);
    min-height:0;
  }
  .home-solutions .solution-card-body{
    display:block;
    min-height:0;
    padding:15px 49px 14px 14px;
  }
  .home-solutions .solution-card-body small{
    font-size:8px;
    line-height:1.18;
  }
  .home-solutions .solution-card-body strong{
    font-size:13.5px;
    line-height:1.17;
  }
  .home-solutions .solution-card-arrow{
    right:12px;
    bottom:14px;
    width:29px;
    height:29px;
  }
  .home-solutions .solution-card-arrow .icon{
    width:13px;
    height:13px;
  }
}

@media (prefers-reduced-motion:reduce){
  .home-solutions .solution-card,
  .home-solutions .solution-card-media img,
  .home-solutions .solution-card-arrow{
    transition:none!important;
  }
}


/* ===== reference-final-v31.css ===== */
/* V48 — harden homepage Products / Services toggle interaction on every screen. */
.home-solutions .solutions-controls{
  position:relative;
  z-index:8;
  isolation:isolate;
}
.home-solutions .solution-type-tabs{
  position:relative;
  z-index:9;
  pointer-events:auto;
}
.home-solutions .solution-type-tabs button{
  position:relative;
  z-index:10;
  pointer-events:auto;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}
.home-solutions .solution-panel[hidden]{display:none!important}


/* V52 — Premium product/service hero. Homepage remains untouched. */
body.detail-page .carousel::before,
body.detail-page .carousel::after{display:none!important}
body.detail-page .carousel{background:#f3f6fa!important}

/* Desktop detail header becomes a premium full-width bar instead of floating over Hero. */
@media (min-width:1024px){
  body.detail-page .top{
    position:sticky!important;
    top:0!important;
    left:auto!important;
    right:auto!important;
    width:100%!important;
    height:82px!important;
    padding:8px clamp(42px,4.5vw,82px)!important;
    display:flex!important;
    align-items:center!important;
    gap:28px!important;
    border:0!important;
    border-bottom:1px solid #e8edf3!important;
    border-radius:0!important;
    background:rgba(255,255,255,.97)!important;
    box-shadow:0 9px 28px rgba(8,35,68,.055)!important;
    backdrop-filter:saturate(120%) blur(10px)!important;
    z-index:90!important;
  }
  body.detail-page .top .brand{position:static!important;width:245px!important;margin-right:auto!important}
  body.detail-page .top .brand img{max-height:62px!important}
  body.detail-page .top nav.site-nav{
    position:static!important;
    inset:auto!important;
    display:flex!important;
    width:auto!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:center!important;
    gap:clamp(18px,1.6vw,30px)!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    transform:none!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }
  body.detail-page .top nav.site-nav>a:not(.mobile-nav-quote){
    padding:12px 0!important;
    font-size:13px!important;
    color:#082950!important;
    border:0!important;
    background:transparent!important;
  }
  body.detail-page .top nav.site-nav>a[aria-current="page"]{color:#a96e13!important;font-weight:800!important;box-shadow:inset 0 -2px #c99743!important}
  body.detail-page .top>.gold{position:static!important;margin-left:16px!important;padding:12px 24px!important;border-radius:8px!important}
  body.detail-page .top .mobile-nav-head,
  body.detail-page .top .mobile-nav-quote,
  body.detail-page .nav-backdrop,
  body.detail-page .nav-toggle{display:none!important}
}

body.detail-page .reference-detail-hero.detail-hero--premium{
  position:relative!important;
  display:grid!important;
  grid-template-columns:minmax(360px,40%) minmax(0,60%)!important;
  align-items:stretch!important;
  width:100%!important;
  min-height:390px!important;
  height:auto!important;
  overflow:hidden!important;
  background:#fff!important;
  border:0!important;
  border-bottom:1px solid #e5eaf0!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium::before,
body.detail-page .reference-detail-hero.detail-hero--premium::after{display:none!important}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{
  position:relative!important;
  inset:auto!important;
  order:1!important;
  z-index:4!important;
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:flex-start!important;
  padding:34px clamp(38px,4.25vw,78px) 28px!important;
  background:linear-gradient(135deg,#fff 0%,#fbfcfe 58%,#f5f8fb 100%)!important;
  color:#071f3c!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy::after{
  content:""!important;
  position:absolute!important;
  top:0!important;
  bottom:0!important;
  right:-54px!important;
  width:56px!important;
  z-index:-1!important;
  background:#f8fafc!important;
  clip-path:polygon(0 0,100% 0,0 100%)!important;
  pointer-events:none!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .crumb{
  margin:0 0 16px!important;
  max-width:100%!important;
  font-size:11px!important;
  line-height:1.35!important;
  color:#66778c!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-eyebrow{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  margin:0 0 12px!important;
  font-size:11px!important;
  line-height:1.3!important;
  letter-spacing:.18em!important;
  font-weight:800!important;
  color:#0b315f!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-eyebrow>span{
  display:block!important;
  width:40px!important;
  height:2px!important;
  background:#c99743!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium h1{
  margin:0!important;
  max-width:680px!important;
  color:#071f3c!important;
  letter-spacing:-.035em!important;
  line-height:1.01!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium h1>span{
  display:block!important;
  font-size:clamp(35px,3.05vw,52px)!important;
  font-weight:800!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium h1>small{
  display:block!important;
  margin-top:4px!important;
  font-size:clamp(25px,2.25vw,38px)!important;
  line-height:1.08!important;
  font-weight:500!important;
  letter-spacing:-.025em!important;
  color:#566a80!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-intro{
  margin:16px 0 0!important;
  max-width:570px!important;
  font-size:15px!important;
  line-height:1.55!important;
  color:#43566d!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:0!important;
  width:min(100%,610px)!important;
  margin-top:22px!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features>div{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  min-width:0!important;
  padding:0 14px!important;
  border-right:1px solid #dbe2ea!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features>div:first-child{padding-left:0!important}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features>div:last-child{border-right:0!important;padding-right:0!important}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features .icon{
  width:34px!important;
  height:34px!important;
  padding:7px!important;
  border:1px solid #d9b66e!important;
  border-radius:50%!important;
  color:#b77c1e!important;
  background:#fff!important;
  flex:0 0 34px!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features span{display:flex!important;flex-direction:column!important;min-width:0!important}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features b{font-size:12px!important;line-height:1.25!important;color:#102f56!important;white-space:nowrap!important}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features small{font-size:10px!important;line-height:1.25!important;color:#758398!important;white-space:nowrap!important}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:12px!important;
  margin-top:22px!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn{
  min-height:48px!important;
  padding:12px 22px!important;
  border-radius:8px!important;
  font-size:13px!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn.outline{
  background:#fff!important;
  color:#07346c!important;
  border:1px solid #9eb3cc!important;
  box-shadow:none!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-signoff{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  margin:20px 0 0!important;
  font-size:9px!important;
  line-height:1.2!important;
  letter-spacing:.23em!important;
  font-weight:800!important;
  color:#6a7b90!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-signoff::before{
  content:""!important;
  width:36px!important;
  height:1px!important;
  background:#c99743!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media{
  position:relative!important;
  order:2!important;
  min-width:0!important;
  min-height:390px!important;
  overflow:hidden!important;
  background:#eef2f6!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media::before{display:none!important}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media>img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  object-fit:cover!important;
  object-position:center center!important;
  transform:none!important;
  filter:none!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance{
  position:absolute!important;
  z-index:3!important;
  top:50%!important;
  right:22px!important;
  width:205px!important;
  padding:6px 18px!important;
  transform:translateY(-50%)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:12px!important;
  background:rgba(2,20,40,.78)!important;
  box-shadow:0 18px 48px rgba(0,13,30,.23)!important;
  backdrop-filter:blur(8px)!important;
  color:#fff!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance>div{
  display:flex!important;
  align-items:center!important;
  gap:11px!important;
  padding:14px 0!important;
  border-bottom:1px solid rgba(255,255,255,.16)!important;
}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance>div:last-child{border-bottom:0!important}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance .icon{width:27px!important;height:27px!important;color:#e0ad50!important}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance span{display:flex!important;flex-direction:column!important}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance b{font-size:11px!important;line-height:1.25!important;color:#fff!important}
body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance small{font-size:9px!important;line-height:1.3!important;color:rgba(255,255,255,.73)!important}

/* Compact laptops: premium hero stays clean but drops the right overlay card. */
@media (min-width:1024px) and (max-width:1279px){
  body.detail-page .reference-detail-hero.detail-hero--premium{grid-template-columns:minmax(350px,42%) minmax(0,58%)!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{padding:30px 34px 26px!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance{display:none!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features b{font-size:11px!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features small{font-size:9px!important}
}

/* Existing approved small-screen direction: same image full-bleed with readable content overlay. */
@media (max-width:1023px){
  body.detail-page .reference-detail-hero.detail-hero--premium{
    display:block!important;
    min-height:400px!important;
    height:auto!important;
    background:#061a31!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media{
    position:absolute!important;
    inset:0!important;
    min-height:0!important;
    width:100%!important;
    height:100%!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    inset:0!important;
    z-index:2!important;
    background:linear-gradient(180deg,rgba(3,14,28,.20) 0%,rgba(3,14,28,.44) 42%,rgba(3,14,28,.82) 100%)!important;
    pointer-events:none!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media>img{
    object-position:center center!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{
    position:relative!important;
    z-index:4!important;
    width:100%!important;
    max-width:620px!important;
    min-height:400px!important;
    padding:84px 26px 26px!important;
    justify-content:flex-end!important;
    background:transparent!important;
    color:#fff!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy::after,
  body.detail-page .reference-detail-hero.detail-hero--premium .crumb,
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features,
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-signoff,
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance{display:none!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-eyebrow{margin-bottom:8px!important;color:rgba(255,255,255,.92)!important;font-size:10px!important;letter-spacing:.12em!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-eyebrow>span{background:#e0ad50!important;width:28px!important}
  body.detail-page .reference-detail-hero.detail-hero--premium h1>span{font-size:clamp(27px,5.2vw,38px)!important;color:#fff!important;line-height:1.02!important}
  body.detail-page .reference-detail-hero.detail-hero--premium h1>small{font-size:clamp(20px,4vw,29px)!important;color:rgba(255,255,255,.88)!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-intro{margin-top:10px!important;max-width:520px!important;font-size:13px!important;line-height:1.45!important;color:rgba(255,255,255,.94)!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions{margin-top:16px!important;gap:10px!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn{min-height:43px!important;padding:10px 16px!important;font-size:12px!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn.outline{background:rgba(255,255,255,.10)!important;color:#fff!important;border-color:rgba(255,255,255,.38)!important}
}
@media (max-width:600px){
  body.detail-page .reference-detail-hero.detail-hero--premium{min-height:390px!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{min-height:390px!important;padding:76px 16px 20px!important}
  body.detail-page .reference-detail-hero.detail-hero--premium h1>span{font-size:clamp(25px,7vw,32px)!important;max-width:14ch!important}
  body.detail-page .reference-detail-hero.detail-hero--premium h1>small{font-size:clamp(18px,5.5vw,24px)!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-intro{font-size:12px!important;line-height:1.4!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions{width:100%!important;flex-wrap:nowrap!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn{flex:1 1 0!important;min-width:0!important;padding:10px 8px!important;font-size:11px!important;white-space:nowrap!important}
}


/* V53 — approved premium desktop hero reference. Small-screen treatment remains unchanged. */
@media (min-width:1280px){
  body.detail-page .reference-detail-hero.detail-hero--premium{
    position:relative!important;
    display:block!important;
    width:100%!important;
    height:clamp(500px,33vw,620px)!important;
    min-height:500px!important;
    overflow:hidden!important;
    background:#0a1d32!important;
    border-bottom:1px solid #e5eaf0!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    z-index:1!important;
    overflow:hidden!important;
    background:#dfe7ef!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media>img{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    object-fit:cover!important;
    object-position:58% center!important;
    transform:none!important;
    filter:none!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{
    position:relative!important;
    inset:auto!important;
    z-index:5!important;
    width:43%!important;
    height:100%!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:flex-start!important;
    padding:clamp(44px,4vw,72px) clamp(44px,4.25vw,82px) clamp(38px,3.3vw,62px)!important;
    color:#071f3c!important;
    background:rgba(255,255,255,.975)!important;
    box-shadow:16px 0 44px rgba(11,36,65,.035)!important;
    isolation:isolate!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy::before{
    content:""!important;
    position:absolute!important;
    z-index:-1!important;
    top:0!important;
    right:-150px!important;
    width:230px!important;
    height:100%!important;
    background:linear-gradient(120deg,rgba(255,255,255,.975) 0%,rgba(255,255,255,.94) 48%,rgba(255,255,255,.40) 78%,rgba(255,255,255,0) 100%)!important;
    clip-path:polygon(0 0,100% 0,38% 100%,0 100%)!important;
    pointer-events:none!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    z-index:-2!important;
    inset:0!important;
    background:
      linear-gradient(142deg,transparent 0 72%,rgba(8,52,104,.025) 72% 100%),
      linear-gradient(25deg,rgba(8,52,104,.018) 0 35%,transparent 35% 100%)!important;
    pointer-events:none!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .crumb{display:none!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-eyebrow{
    margin:0 0 18px!important;
    gap:12px!important;
    font-size:11px!important;
    line-height:1.2!important;
    letter-spacing:.20em!important;
    color:#0a305d!important;
    white-space:nowrap!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-eyebrow>span{
    width:42px!important;
    height:2px!important;
    background:#c89535!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium h1{
    margin:0!important;
    max-width:640px!important;
    color:#071f3c!important;
    letter-spacing:-.04em!important;
    line-height:.98!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium h1>span{
    display:block!important;
    max-width:13.5ch!important;
    font-size:clamp(40px,3.1vw,58px)!important;
    font-weight:800!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium h1>small{
    display:block!important;
    margin-top:8px!important;
    font-size:clamp(27px,2.15vw,40px)!important;
    line-height:1.05!important;
    font-weight:500!important;
    letter-spacing:-.03em!important;
    color:#66788c!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-intro{
    margin:18px 0 0!important;
    max-width:555px!important;
    font-size:15px!important;
    line-height:1.58!important;
    color:#43566d!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features{
    width:min(100%,610px)!important;
    margin-top:24px!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features>div{
    gap:10px!important;
    padding:0 14px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features .icon{
    width:38px!important;
    height:38px!important;
    flex:0 0 38px!important;
    padding:8px!important;
    border:1px solid rgba(201,151,67,.52)!important;
    color:#b77b1e!important;
    box-shadow:0 6px 15px rgba(131,91,27,.07)!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features b{
    font-size:12px!important;
    color:#102f56!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features small{
    margin-top:2px!important;
    font-size:10px!important;
    color:#758398!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions{
    margin-top:25px!important;
    gap:14px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn{
    min-height:54px!important;
    padding:13px 26px!important;
    border-radius:8px!important;
    font-size:14px!important;
    font-weight:800!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn.gold{
    min-width:235px!important;
    background:linear-gradient(135deg,#c9902c,#b57612)!important;
    border-color:#b57612!important;
    box-shadow:0 10px 22px rgba(167,108,18,.16)!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn.outline{
    min-width:196px!important;
    background:rgba(255,255,255,.88)!important;
    border:1px solid #91a7c0!important;
    color:#07346c!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-signoff{
    margin:28px 0 0!important;
    font-size:9px!important;
    letter-spacing:.28em!important;
    color:#718398!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance{
    display:block!important;
    position:absolute!important;
    z-index:5!important;
    top:50%!important;
    right:28px!important;
    width:238px!important;
    padding:8px 22px!important;
    transform:translateY(-50%)!important;
    border:1px solid rgba(255,255,255,.10)!important;
    border-radius:7px!important;
    background:linear-gradient(180deg,rgba(5,24,45,.90),rgba(5,21,39,.86))!important;
    box-shadow:0 22px 55px rgba(0,10,22,.26)!important;
    backdrop-filter:blur(4px)!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance>div{
    padding:18px 0!important;
    gap:13px!important;
    border-bottom:1px solid rgba(255,255,255,.22)!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance .icon{
    width:34px!important;
    height:34px!important;
    flex:0 0 34px!important;
    color:#d5a145!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance b{
    font-size:12px!important;
    line-height:1.3!important;
    text-transform:uppercase!important;
    color:#fff!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance small{
    margin-top:3px!important;
    font-size:9px!important;
    line-height:1.35!important;
    text-transform:uppercase!important;
    color:rgba(255,255,255,.73)!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-edge-motto{
    display:block!important;
    position:absolute!important;
    z-index:5!important;
    top:30px!important;
    right:34px!important;
    margin:0!important;
    padding-bottom:13px!important;
    font-size:9px!important;
    line-height:1.45!important;
    letter-spacing:.18em!important;
    text-align:center!important;
    color:rgba(255,255,255,.90)!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-edge-motto::after{
    content:""!important;
    position:absolute!important;
    left:50%!important;
    bottom:0!important;
    width:48px!important;
    height:2px!important;
    transform:translateX(-50%)!important;
    background:#c89535!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-scroll{
    display:flex!important;
    position:absolute!important;
    z-index:5!important;
    left:62%!important;
    bottom:16px!important;
    transform:translateX(-50%)!important;
    flex-direction:column!important;
    align-items:center!important;
    gap:6px!important;
    font-size:9px!important;
    line-height:1!important;
    letter-spacing:.06em!important;
    color:rgba(255,255,255,.80)!important;
    text-decoration:none!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-scroll span{
    width:1px!important;
    height:30px!important;
    background:linear-gradient(to bottom,rgba(255,255,255,0),rgba(255,255,255,.8))!important;
  }
}

/* Hide desktop-only decorative elements on compact layouts. */
@media (max-width:1279px){
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-edge-motto,
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-scroll{display:none!important}
}

/* V54 — same approved premium reference, reduced desktop/laptop hero height only.
   Tablet/mobile rules are intentionally untouched. */
@media (min-width:1280px){
  body.detail-page .reference-detail-hero.detail-hero--premium{
    height:clamp(430px,24vw,500px)!important;
    min-height:430px!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{
    padding:clamp(28px,2.5vw,44px) clamp(42px,4vw,76px) clamp(26px,2.3vw,40px)!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-eyebrow{
    margin-bottom:12px!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium h1>span{
    font-size:clamp(38px,2.75vw,52px)!important;
    line-height:.98!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium h1>small{
    margin-top:5px!important;
    font-size:clamp(24px,1.9vw,34px)!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-intro{
    margin-top:12px!important;
    font-size:14px!important;
    line-height:1.48!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features{
    margin-top:17px!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features .icon{
    width:34px!important;
    height:34px!important;
    flex-basis:34px!important;
    padding:7px!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions{
    margin-top:18px!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn{
    min-height:48px!important;
    padding:11px 23px!important;
    font-size:13px!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-signoff{
    margin-top:18px!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance{
    width:224px!important;
    padding:5px 20px!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance>div{
    padding:13px 0!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance .icon{
    width:30px!important;
    height:30px!important;
    flex-basis:30px!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-edge-motto{
    top:18px!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-scroll{
    bottom:9px!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-scroll span{
    height:20px!important;
  }
}


/* V55 — lock the approved premium reference pattern on large screens,
   preserve the compact overlay hero on smaller screens, remove the extra
   mobile gallery block, and keep the floating support control away from hero UI. */

/* Desktop/laptop: 40% premium content panel + 60% complete 2:1 hero image. */
@media (min-width:1280px){
  body.detail-page .reference-detail-hero.detail-hero--premium{
    grid-template-columns:minmax(0,40%) minmax(0,60%)!important;
    height:clamp(420px,30vw,540px)!important;
    min-height:420px!important;
    max-height:540px!important;
    overflow:hidden!important;
    background:#fff!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{
    position:relative!important;
    z-index:6!important;
    padding:clamp(28px,2.25vw,40px) clamp(38px,3.8vw,72px) clamp(24px,2vw,36px)!important;
    justify-content:center!important;
    background:linear-gradient(135deg,#ffffff 0%,#fbfcfe 62%,#f4f7fa 100%)!important;
  }

  /* Wide translucent diagonal transition matching the approved reference. */
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    top:0!important;
    bottom:0!important;
    right:-118px!important;
    width:120px!important;
    z-index:-1!important;
    clip-path:polygon(0 0,100% 0,28% 100%,0 100%)!important;
    background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(246,249,252,.88))!important;
    pointer-events:none!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    top:0!important;
    bottom:0!important;
    right:-176px!important;
    width:88px!important;
    z-index:-2!important;
    clip-path:polygon(0 0,100% 0,38% 100%,0 100%)!important;
    background:rgba(255,255,255,.34)!important;
    pointer-events:none!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-eyebrow{
    margin-bottom:14px!important;
    font-size:11px!important;
    letter-spacing:.19em!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium h1{
    max-width:620px!important;
    line-height:.98!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium h1>span{
    max-width:12.8ch!important;
    font-size:clamp(38px,2.8vw,54px)!important;
    line-height:.98!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium h1>small{
    margin-top:6px!important;
    font-size:clamp(24px,1.85vw,34px)!important;
    line-height:1.05!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-intro{
    max-width:535px!important;
    margin-top:14px!important;
    font-size:14px!important;
    line-height:1.48!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features{
    width:min(100%,570px)!important;
    margin-top:18px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features>div{
    gap:9px!important;
    padding:0 12px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features .icon{
    width:35px!important;
    height:35px!important;
    flex-basis:35px!important;
    padding:7px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features b{
    font-size:11px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features small{
    font-size:9px!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions{
    margin-top:19px!important;
    gap:13px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn{
    min-height:48px!important;
    padding:11px 22px!important;
    font-size:13px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn.gold{
    min-width:218px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn.outline{
    min-width:182px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-signoff{
    margin-top:18px!important;
    font-size:8px!important;
    letter-spacing:.26em!important;
  }

  /* Right image is not blurred, duplicated, or stretched. 60vw : 30vw ~= 2:1,
     so normal 1920x960 hero uploads show almost completely at common desktop widths. */
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media{
    position:relative!important;
    overflow:hidden!important;
    background:#dfe8f0!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media::before,
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media::after{
    display:none!important;
    content:none!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media>img{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    object-fit:cover!important;
    object-position:center center!important;
    transform:none!important;
    filter:none!important;
  }

  /* Reference-positioned dark assurance card. */
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance{
    display:block!important;
    top:50%!important;
    right:28px!important;
    width:222px!important;
    padding:4px 19px!important;
    transform:translateY(-50%)!important;
    border-radius:8px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance>div{
    padding:13px 0!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance .icon{
    width:30px!important;
    height:30px!important;
    flex-basis:30px!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-edge-motto{
    top:18px!important;
    right:38px!important;
    font-size:8px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-scroll{
    left:60%!important;
    bottom:8px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-scroll span{
    height:18px!important;
  }

  /* Keep draggable support control away from the assurance card. */
  body.detail-page .support-orbit{
    top:auto!important;
    bottom:24px!important;
    right:18px!important;
  }
}

/* Tablet/mobile: retain the clean full-image overlay hero; do not inherit desktop diagonals/cards. */
@media (max-width:1023px){
  body.detail-page .reference-detail-hero.detail-hero--premium{
    display:block!important;
    position:relative!important;
    min-height:390px!important;
    height:auto!important;
    max-height:none!important;
    overflow:hidden!important;
    background:#0b1a2f!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media>img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center center!important;
    transform:none!important;
    filter:none!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    inset:0!important;
    background:linear-gradient(180deg,rgba(4,18,36,.22) 0%,rgba(4,18,36,.42) 38%,rgba(4,18,36,.82) 100%)!important;
    pointer-events:none!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{
    position:relative!important;
    z-index:4!important;
    min-height:390px!important;
    width:100%!important;
    max-width:none!important;
    padding:76px 16px 20px!important;
    justify-content:flex-end!important;
    background:transparent!important;
    color:#fff!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy::before,
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy::after,
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance,
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-edge-motto,
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-scroll,
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features,
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-signoff,
  body.detail-page .reference-detail-hero.detail-hero--premium .crumb{
    display:none!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-eyebrow{
    color:rgba(255,255,255,.95)!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium h1>span,
  body.detail-page .reference-detail-hero.detail-hero--premium h1>small,
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-intro{
    color:#fff!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions{
    width:100%!important;
    flex-wrap:nowrap!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn{
    flex:1 1 0!important;
    min-width:0!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn.outline{
    background:rgba(7,31,60,.28)!important;
    border-color:rgba(255,255,255,.40)!important;
    color:#fff!important;
  }

  /* Remove the extra line-art/gallery block immediately below the mobile hero. */
  body.detail-page .mobile-hero-gallery-shell{
    display:none!important;
  }

  /* Keep support control clear of hero CTA/tabs. */
  body.detail-page .support-orbit{
    top:auto!important;
    right:9px!important;
    bottom:18px!important;
  }
}

@media (max-width:600px){
  body.detail-page .reference-detail-hero.detail-hero--premium{
    min-height:390px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{
    min-height:390px!important;
    padding:74px 16px 18px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium h1>span{
    max-width:14ch!important;
    font-size:clamp(25px,7.1vw,32px)!important;
    line-height:1.02!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium h1>small{
    margin-top:2px!important;
    font-size:clamp(18px,5.4vw,24px)!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-intro{
    margin-top:8px!important;
    font-size:12px!important;
    line-height:1.4!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions{
    margin-top:15px!important;
    gap:9px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn{
    min-height:43px!important;
    padding:10px 8px!important;
    font-size:11px!important;
    white-space:nowrap!important;
  }
}


/* V56 — corrective lock for the approved premium reference.
   Fixes desktop grid placement so copy is always LEFT and media always RIGHT.
   Tablet/mobile rules from V55 remain untouched. */
@media (min-width:1280px){
  body.detail-page .reference-detail-hero.detail-hero--premium{
    display:grid!important;
    grid-template-columns:40% 60%!important;
    grid-template-rows:1fr!important;
    width:100%!important;
    height:clamp(430px,30vw,520px)!important;
    min-height:430px!important;
    max-height:520px!important;
    overflow:hidden!important;
    background:#fff!important;
    isolation:isolate!important;
  }

  /* Critical placement fix: DOM has media first, copy second. Explicit columns prevent reversal. */
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{
    grid-column:1!important;
    grid-row:1!important;
    order:1!important;
    position:relative!important;
    inset:auto!important;
    z-index:5!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-width:none!important;
    overflow:visible!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:flex-start!important;
    padding:clamp(30px,2.3vw,42px) clamp(42px,3.4vw,66px) clamp(26px,2vw,34px)!important;
    background:
      linear-gradient(142deg,rgba(8,52,104,.018) 0 27%,transparent 27% 100%),
      linear-gradient(28deg,transparent 0 72%,rgba(8,52,104,.022) 72% 100%),
      #fff!important;
    color:#071f3c!important;
    box-shadow:none!important;
  }

  /* Premium translucent diagonal transition from the reference image. */
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    top:0!important;
    bottom:0!important;
    right:-155px!important;
    width:156px!important;
    z-index:1!important;
    clip-path:polygon(0 0,100% 0,34% 100%,0 100%)!important;
    background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,250,252,.94))!important;
    pointer-events:none!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    top:0!important;
    bottom:0!important;
    right:-218px!important;
    width:94px!important;
    z-index:1!important;
    clip-path:polygon(0 0,100% 0,43% 100%,0 100%)!important;
    background:rgba(255,255,255,.36)!important;
    pointer-events:none!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy > *{
    position:relative!important;
    z-index:3!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media{
    grid-column:2!important;
    grid-row:1!important;
    order:2!important;
    position:relative!important;
    inset:auto!important;
    z-index:1!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
    background:#dfe8f1!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media::before,
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media::after{
    display:none!important;
    content:none!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media>img{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    object-fit:cover!important;
    object-position:center center!important;
    transform:none!important;
    filter:none!important;
  }

  /* Reference typography/proportions. */
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-eyebrow{
    margin:0 0 13px!important;
    gap:11px!important;
    font-size:10px!important;
    line-height:1.2!important;
    letter-spacing:.19em!important;
    color:#0a305d!important;
    white-space:nowrap!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-eyebrow>span{
    width:38px!important;
    height:2px!important;
    background:#c89535!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium h1{
    margin:0!important;
    max-width:590px!important;
    line-height:.98!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium h1>span{
    display:block!important;
    max-width:13.2ch!important;
    font-size:clamp(38px,2.6vw,50px)!important;
    line-height:.98!important;
    letter-spacing:-.025em!important;
    color:#071f3c!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium h1>small{
    display:block!important;
    margin-top:6px!important;
    font-size:clamp(24px,1.7vw,31px)!important;
    line-height:1.05!important;
    font-weight:400!important;
    color:#67798d!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-intro{
    margin:14px 0 0!important;
    max-width:510px!important;
    font-size:13px!important;
    line-height:1.48!important;
    color:#445a72!important;
  }

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features{
    display:flex!important;
    width:min(100%,545px)!important;
    margin-top:18px!important;
    gap:0!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features>div{
    flex:1 1 0!important;
    min-width:0!important;
    gap:8px!important;
    padding:0 11px!important;
    border-right:1px solid #d9e0e7!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features>div:first-child{padding-left:0!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features>div:last-child{padding-right:0!important;border-right:0!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features .icon{
    width:34px!important;height:34px!important;flex:0 0 34px!important;padding:7px!important;
    border:1px solid rgba(201,151,67,.44)!important;border-radius:50%!important;color:#c79031!important;background:#fff!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features b{font-size:11px!important;line-height:1.2!important;color:#102f56!important;white-space:nowrap!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-features small{font-size:9px!important;line-height:1.25!important;color:#758398!important;white-space:nowrap!important}

  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions{
    display:flex!important;
    flex-wrap:nowrap!important;
    gap:13px!important;
    margin-top:19px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn{
    min-height:47px!important;
    padding:11px 21px!important;
    font-size:13px!important;
    border-radius:7px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn.gold{min-width:210px!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn.outline{min-width:176px!important;background:#fff!important;color:#0b315f!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-signoff{
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    margin:17px 0 0!important;
    font-size:8px!important;
    letter-spacing:.25em!important;
    color:#59708c!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-signoff::before{
    content:""!important;width:30px!important;height:1px!important;background:#c89535!important;
  }

  /* Keep the reference assurance card inside the image, not over the content panel. */
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance{
    display:block!important;
    position:absolute!important;
    top:50%!important;
    right:24px!important;
    width:220px!important;
    transform:translateY(-50%)!important;
    z-index:4!important;
    padding:4px 18px!important;
    border-radius:7px!important;
    background:rgba(7,26,47,.90)!important;
    box-shadow:0 16px 36px rgba(0,0,0,.16)!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance>div{padding:12px 0!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-edge-motto{display:block!important;top:16px!important;right:33px!important;font-size:8px!important;z-index:4!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-scroll{display:flex!important;left:50%!important;bottom:8px!important;transform:translateX(-50%)!important;z-index:4!important}

  body.detail-page .support-orbit{right:16px!important;bottom:18px!important;top:auto!important}
}

/* 1280–1450px: retain the same pattern but slightly compact the left panel. */
@media (min-width:1280px) and (max-width:1450px){
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{
    padding-left:38px!important;padding-right:42px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium h1>span{font-size:clamp(36px,3vw,44px)!important}
  body.detail-page .reference-detail-hero.detail-hero--premium h1>small{font-size:24px!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-assurance{width:200px!important;right:18px!important}
}


/* V57 — compact phone hero: remove excess empty image area above the copy.
   Desktop/tablet premium pattern is unchanged. */
@media (max-width:600px){
  body.detail-page .reference-detail-hero.detail-hero--premium{
    min-height:340px!important;
    height:auto!important;
    max-height:none!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{
    min-height:340px!important;
    height:auto!important;
    padding:64px 15px 14px!important;
    justify-content:flex-end!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-media>img{
    object-position:58% center!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-eyebrow{
    margin-bottom:7px!important;
    font-size:9px!important;
    letter-spacing:.12em!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium h1>span{
    font-size:clamp(24px,6.8vw,30px)!important;
    line-height:1!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium h1>small{
    margin-top:1px!important;
    font-size:clamp(17px,5vw,22px)!important;
    line-height:1.02!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-intro{
    margin-top:7px!important;
    font-size:11px!important;
    line-height:1.34!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions{
    margin-top:12px!important;
    gap:8px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions .btn{
    min-height:40px!important;
    padding:8px 7px!important;
    font-size:10.5px!important;
  }
}

/* Very narrow phones: preserve breathing room without restoring the large blank top area. */
@media (max-width:380px){
  body.detail-page .reference-detail-hero.detail-hero--premium{
    min-height:350px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{
    min-height:350px!important;
    padding:62px 14px 13px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium h1>span{
    font-size:clamp(23px,7vw,28px)!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-intro{
    font-size:10.7px!important;
  }
}


/* V58 — restore Product/Service image gallery on tablet and phone.
   Keeps the compact V57 mobile hero untouched and prevents the gallery
   from appearing as an extra block on desktop/laptop layouts. */
@media (min-width:1024px){
  body.detail-page .mobile-hero-gallery-shell{
    display:none!important;
  }
}

@media (max-width:1023px){
  body.detail-page .mobile-hero-gallery-shell{
    display:block!important;
    position:relative!important;
    width:min(94%,760px)!important;
    margin:12px auto 10px!important;
    padding:0!important;
    z-index:1!important;
  }
  body.detail-page .mobile-hero-gallery{
    position:relative!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:3 / 2!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    border:1px solid #ccd9e8!important;
    border-radius:14px!important;
    background:#edf3f8!important;
    box-shadow:0 10px 24px rgba(2,36,79,.10)!important;
    overflow:hidden!important;
  }
  body.detail-page .mobile-hero-gallery>img{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    padding:9px 10px 30px!important;
    object-fit:contain!important;
    object-position:center center!important;
    transform:none!important;
    filter:none!important;
    background:#fff!important;
  }
  body.detail-page .mobile-hero-gallery .prev,
  body.detail-page .mobile-hero-gallery .next{
    top:50%!important;
    transform:translateY(-50%)!important;
    width:42px!important;
    height:42px!important;
    border:2px solid #e0ad4f!important;
    border-radius:50%!important;
    background:rgba(4,49,103,.96)!important;
    color:#fff!important;
    opacity:1!important;
    visibility:visible!important;
    z-index:4!important;
    box-shadow:0 7px 18px rgba(0,28,63,.22)!important;
  }
  body.detail-page .mobile-hero-gallery .prev{left:10px!important}
  body.detail-page .mobile-hero-gallery .next{right:10px!important}
  body.detail-page .mobile-hero-gallery .dots{
    position:absolute!important;
    left:50%!important;
    bottom:10px!important;
    transform:translateX(-50%)!important;
    z-index:5!important;
  }
  body.detail-page .detail-tabs{
    margin-top:0!important;
  }
  body.detail-page .support-orbit{
    right:10px!important;
    bottom:72px!important;
    top:auto!important;
    transform:scale(.88)!important;
    transform-origin:bottom right!important;
    z-index:80!important;
  }
}

@media (max-width:600px){
  body.detail-page .mobile-hero-gallery-shell{
    width:94%!important;
    margin:10px auto 9px!important;
  }
  body.detail-page .mobile-hero-gallery{
    border-radius:12px!important;
  }
  body.detail-page .mobile-hero-gallery .prev,
  body.detail-page .mobile-hero-gallery .next{
    width:38px!important;
    height:38px!important;
  }
  body.detail-page .mobile-hero-gallery .prev{left:8px!important}
  body.detail-page .mobile-hero-gallery .next{right:8px!important}
  body.detail-page .support-orbit{
    right:8px!important;
    bottom:68px!important;
    transform:scale(.82)!important;
  }
}


/* V59 — freeze the site header during page scroll without changing the approved mobile hero/header geometry. */
@media (min-width:1024px){
  body:not(.home-page) .top,
  body:not(.home-page) .top.is-scrolled{
    position:sticky!important;
    top:0!important;
    z-index:160!important;
  }
  body.home-page .top,
  body.home-page .top.is-scrolled{
    z-index:160!important;
  }
}


/* ===== facility-v49.css ===== */
/* V49 — Our Facility page, homepage preview and About Us > Our Facility navigation */
:root{--facility-navy:#042a58;--facility-deep:#031a35;--facility-gold:#d99a18;--facility-gold-bright:#f4b51f}

/* Desktop About Us submenu. */
.nav-about-group{position:relative;display:flex;align-items:center;height:100%}.nav-about-main{display:flex;align-items:center;color:inherit;text-decoration:none;white-space:nowrap}.nav-about-menu{position:absolute;top:calc(100% + 12px);left:50%;min-width:164px;padding:8px;transform:translate(-50%,8px);opacity:0;visibility:hidden;pointer-events:none;background:#fff;border:1px solid #dae4ef;border-radius:12px;box-shadow:0 16px 36px rgba(5,35,70,.15);transition:.18s ease;z-index:90}.nav-about-menu::before{content:"";position:absolute;left:0;right:0;top:-15px;height:18px}.nav-about-menu a{display:block;padding:10px 12px;border-radius:8px;color:#06356f;text-decoration:none;font-size:13px;font-weight:800;white-space:nowrap}.nav-about-menu a:hover,.nav-about-menu a:focus{background:#f2f6fb;color:#b87300}.nav-about-group:hover .nav-about-menu,.nav-about-group:focus-within .nav-about-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}

/* Homepage facility preview. */
.home-facility-preview{padding:clamp(36px,5vw,72px) clamp(18px,4vw,72px);background:linear-gradient(180deg,#fff 0%,#f6f9fd 100%);border-top:1px solid #e4ebf3}.home-facility-head{max-width:1540px;margin:0 auto 24px;display:flex;align-items:end;justify-content:space-between;gap:30px}.home-facility-head h2{margin:4px 0 7px;color:#06356f;font-size:clamp(28px,3vw,44px)}.home-facility-head p:not(.eyebrow){margin:0;max-width:720px;color:#47617f}.home-facility-head>a{display:inline-flex;align-items:center;gap:8px;color:#06356f;text-decoration:none;font-weight:850;white-space:nowrap}.home-facility-head>a .icon{width:18px}.home-facility-cards{max-width:1540px;margin:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.home-facility-card{position:relative;min-height:300px;overflow:hidden;border-radius:18px;background:#061e3a;box-shadow:0 12px 30px rgba(5,37,73,.12);text-decoration:none}.home-facility-card::after{content:"";position:absolute;inset:28% 0 0;background:linear-gradient(180deg,transparent,rgba(1,18,38,.92))}.home-facility-card img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;transition:transform .45s ease}.home-facility-card:hover img{transform:scale(1.035)}.home-facility-card span{position:absolute;left:22px;right:20px;bottom:20px;z-index:2;display:grid;grid-template-columns:1fr auto;align-items:end;gap:4px 12px;color:#fff}.home-facility-card small{grid-column:1/-1;color:#f0b43a;font-weight:800;font-size:10px;letter-spacing:.08em}.home-facility-card strong{font-size:clamp(18px,1.55vw,25px);line-height:1.1}.home-facility-card .icon{width:26px;height:26px;color:#f0b43a}

/* Facility page. */
.facility-page .facility-main{width:100%;overflow:hidden;background:#fff}.facility-hero{position:relative;min-height:clamp(430px,48vw,620px);display:flex;align-items:end;background-image:var(--facility-hero);background-size:cover;background-position:center 54%;isolation:isolate}.facility-hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,24,49,.96) 0%,rgba(3,34,69,.82) 37%,rgba(3,34,69,.28) 66%,rgba(3,34,69,.16) 100%);z-index:-1}.facility-hero-copy{width:min(760px,64vw);padding:clamp(42px,7vw,90px) clamp(24px,6vw,90px)}.facility-hero-copy .eyebrow,.facility-feature-copy .eyebrow,.facility-gallery-head .eyebrow,.facility-cta .eyebrow{margin:0 0 9px;color:#efaa19;font-size:12px;font-weight:900;letter-spacing:.12em}.facility-hero-copy h1{margin:0;color:#fff;font-size:clamp(46px,6vw,78px);line-height:.96;letter-spacing:-.045em}.facility-hero-copy h2{margin:14px 0 8px;color:#fff;font-size:clamp(24px,3vw,40px);line-height:1.05}.facility-hero-copy>p:not(.eyebrow){margin:0;max-width:690px;color:#dce8f5;font-size:clamp(15px,1.25vw,19px);line-height:1.55}.facility-hero-trust{display:flex;flex-wrap:wrap;gap:18px;margin-top:24px}.facility-hero-trust span{display:inline-flex;align-items:center;gap:8px;color:#fff;font-size:12px;font-weight:800}.facility-hero-trust .icon{width:21px;color:#f0aa17}

.facility-feature{background:#fff;border-top:4px solid #fff}.facility-feature-main{position:relative;min-height:clamp(520px,54vw,730px);display:flex;align-items:stretch;overflow:hidden;background:#08284d}.facility-feature-main>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}.facility-feature-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,25,50,.97) 0%,rgba(3,33,65,.90) 31%,rgba(3,33,65,.53) 48%,rgba(3,33,65,.08) 72%,rgba(3,33,65,0) 100%)}.facility-feature-copy{position:relative;z-index:2;width:min(650px,52vw);align-self:center;margin:clamp(36px,6vw,80px) clamp(24px,5vw,76px);color:#fff}.facility-feature-copy h2{margin:0 0 13px;color:#fff;font-size:clamp(32px,4.2vw,60px);line-height:1.02;letter-spacing:-.035em}.facility-feature-copy>p:not(.eyebrow){max-width:620px;margin:0 0 24px;color:#dce6f1;font-size:clamp(14px,1.2vw,18px);line-height:1.55}.facility-capabilities{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px;margin:0 0 25px}.facility-capabilities span{display:flex;align-items:center;gap:9px;min-width:0;color:#fff}.facility-capabilities .icon{width:22px;height:22px;flex:0 0 22px;color:#f3ae1c}.facility-capabilities b{font-size:12px;line-height:1.25}.facility-feature-copy .btn{display:inline-flex;align-items:center;gap:8px}.facility-feature-swaging .facility-feature-main>img{object-position:58% center}.facility-feature-testing .facility-feature-main>img{object-position:64% center}

.facility-support-grid{display:grid;gap:4px;padding:4px;background:#fff}.facility-support-grid.facility-support-2{grid-template-columns:repeat(2,minmax(0,1fr))}.facility-support-grid.facility-support-3{grid-template-columns:repeat(3,minmax(0,1fr))}.facility-image-button{position:relative;display:block;width:100%;height:clamp(220px,23vw,360px);padding:0;border:0;overflow:hidden;background:#051d38;cursor:zoom-in}.facility-image-button img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}.facility-image-button:hover img{transform:scale(1.025)}.facility-image-button span{position:absolute;right:14px;bottom:14px;padding:7px 10px;border-radius:999px;background:rgba(2,27,54,.82);color:#fff;font-size:11px;font-weight:800;backdrop-filter:blur(5px)}

.facility-gallery-section{padding:clamp(42px,6vw,78px) clamp(18px,4.5vw,72px);background:#f7f9fc}.facility-gallery-head{max-width:1540px;margin:0 auto 24px;display:flex;justify-content:space-between;align-items:end;gap:24px}.facility-gallery-head h2{margin:2px 0 5px;color:#06356f;font-size:clamp(29px,3.2vw,47px)}.facility-gallery-head p:not(.eyebrow){margin:0;color:#58718c}.facility-gallery-head>span{font-size:12px;font-weight:800;color:#657d98}.facility-gallery-rail{max-width:1540px;margin:auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.facility-gallery-item{position:relative;height:220px;padding:0;border:0;border-radius:14px;overflow:hidden;background:#0a2a4e;cursor:zoom-in;text-align:left}.facility-gallery-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}.facility-gallery-item:hover img{transform:scale(1.035)}.facility-gallery-item span{position:absolute;left:0;right:0;bottom:0;padding:28px 14px 12px;background:linear-gradient(180deg,transparent,rgba(1,20,40,.9));color:#fff;font-size:11px;font-weight:800;line-height:1.25}.facility-gallery-controls{display:none}

.facility-cta{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:clamp(34px,5vw,58px) clamp(24px,6vw,90px);background:linear-gradient(115deg,#03264d,#071a34);color:#fff}.facility-cta h2{margin:0 0 7px;font-size:clamp(27px,3vw,42px)}.facility-cta p:not(.eyebrow){margin:0;color:#cfdceb}.facility-cta>div:last-child{display:flex;gap:12px;flex-wrap:wrap}.facility-cta .btn.outline{border-color:#8ca4bd;color:#fff;background:transparent}

.facility-lightbox{position:fixed;inset:0;z-index:400;display:grid;place-items:center;padding:24px;opacity:0;visibility:hidden;pointer-events:none;transition:.18s ease}.facility-lightbox.open{opacity:1;visibility:visible;pointer-events:auto}.facility-lightbox-backdrop{position:absolute;inset:0;border:0;background:rgba(0,13,28,.88);cursor:zoom-out}.facility-lightbox figure{position:relative;z-index:2;margin:0;width:min(1160px,94vw);max-height:92vh;padding:10px;border-radius:16px;background:#fff;box-shadow:0 30px 90px rgba(0,0,0,.35)}.facility-lightbox figure>button{position:absolute;right:18px;top:18px;z-index:3;width:42px;height:42px;border:1px solid rgba(255,255,255,.45);border-radius:50%;background:rgba(2,25,50,.84);color:#fff;font-size:26px;cursor:pointer}.facility-lightbox img{display:block;width:100%;max-height:80vh;object-fit:contain;border-radius:10px;background:#061b34}.facility-lightbox figcaption{padding:10px 6px 2px;color:#173b63;font-size:13px;font-weight:700}

@media(max-width:980px){
  .nav-about-group{height:auto;display:flex!important;flex-direction:column;align-items:center;gap:4px}.nav-about-main{padding:3px 10px!important;color:#fff!important;font-size:18px!important;font-weight:600!important;text-decoration:none}.nav-about-menu{position:static;min-width:0;padding:0;background:transparent;border:0;box-shadow:none;transform:none;opacity:1;visibility:visible;pointer-events:auto}.nav-about-menu::before{display:none}.nav-about-menu a{padding:2px 10px;color:#e4b75c!important;background:transparent!important;font-size:13px!important;text-align:center;letter-spacing:.02em}
  .home-facility-preview{padding-inline:24px}.home-facility-head{align-items:flex-start}.home-facility-cards{grid-template-columns:repeat(3,minmax(240px,1fr));overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;scrollbar-width:none}.home-facility-cards::-webkit-scrollbar{display:none}.home-facility-card{scroll-snap-align:start;min-height:280px}
  .facility-hero{min-height:520px}.facility-hero-copy{width:min(680px,80vw)}.facility-feature-main{min-height:620px}.facility-feature-copy{width:min(620px,72vw)}.facility-support-grid.facility-support-3{grid-template-columns:repeat(3,minmax(0,1fr))}.facility-image-button{height:250px}.facility-gallery-rail{grid-template-columns:repeat(3,minmax(0,1fr))}.facility-gallery-item{height:200px}
}

@media(max-width:700px){
  .nav-about-main{font-size:18px!important}.nav-about-menu a{font-size:12.5px!important}
  .home-facility-preview{padding:32px 16px}.home-facility-head{display:block;margin-bottom:18px}.home-facility-head h2{font-size:30px}.home-facility-head>a{margin-top:13px;font-size:13px}.home-facility-cards{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:min(82vw,330px);gap:10px}.home-facility-card{min-height:260px;border-radius:15px}.home-facility-card span{left:17px;bottom:16px}.home-facility-card strong{font-size:19px}
  .facility-hero{min-height:520px;align-items:end;background-position:center}.facility-hero-overlay{background:linear-gradient(180deg,rgba(2,24,49,.18) 0%,rgba(2,24,49,.42) 37%,rgba(2,24,49,.96) 77%,rgba(2,24,49,.99) 100%)}.facility-hero-copy{width:100%;padding:110px 20px 32px}.facility-hero-copy h1{font-size:48px}.facility-hero-copy h2{font-size:25px}.facility-hero-copy>p:not(.eyebrow){font-size:14px}.facility-hero-trust{gap:12px}.facility-hero-trust span{font-size:10px}
  .facility-feature-main{min-height:620px;align-items:end}.facility-feature-main>img{object-position:center top}.facility-feature-shade{background:linear-gradient(180deg,rgba(1,21,42,.03) 0%,rgba(1,21,42,.24) 35%,rgba(1,21,42,.94) 69%,rgba(1,21,42,.99) 100%)}.facility-feature-copy{width:100%;align-self:end;margin:0;padding:230px 18px 24px}.facility-feature-copy h2{font-size:33px}.facility-feature-copy>p:not(.eyebrow){font-size:13.5px;margin-bottom:17px}.facility-capabilities{gap:8px 10px;margin-bottom:18px}.facility-capabilities b{font-size:10.5px}.facility-capabilities .icon{width:18px;height:18px;flex-basis:18px}.facility-feature-copy .btn{font-size:12px;padding:10px 14px}.facility-feature-swaging .facility-feature-main>img,.facility-feature-testing .facility-feature-main>img{object-position:center top}
  .facility-support-grid,.facility-support-grid.facility-support-2,.facility-support-grid.facility-support-3{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:6px;padding:6px;scrollbar-width:none}.facility-support-grid::-webkit-scrollbar{display:none}.facility-image-button{flex:0 0 84vw;height:270px;border-radius:10px;scroll-snap-align:center}.facility-image-button span{font-size:10px}
  .facility-gallery-section{padding:38px 16px}.facility-gallery-head{display:block}.facility-gallery-head>span{display:block;margin-top:8px}.facility-gallery-rail{display:flex;overflow-x:auto;gap:8px;scroll-snap-type:x mandatory;scrollbar-width:none}.facility-gallery-rail::-webkit-scrollbar{display:none}.facility-gallery-item{flex:0 0 82vw;height:250px;scroll-snap-align:center}.facility-gallery-controls{display:flex;justify-content:center;gap:10px;margin-top:14px}.facility-gallery-controls button{width:42px;height:42px;border:1px solid #cad8e8;border-radius:50%;background:#fff;color:#06356f;font-size:22px;cursor:pointer}.facility-cta{display:block;padding:34px 18px}.facility-cta>div:last-child{margin-top:19px}.facility-cta .btn{flex:1 1 150px;justify-content:center;font-size:12px}.facility-lightbox{padding:10px}.facility-lightbox figure{width:96vw;padding:6px}.facility-lightbox figure>button{right:11px;top:11px;width:38px;height:38px}.facility-lightbox figcaption{font-size:11px}
}

@media(max-width:980px) and (max-height:650px){.nav-about-group{gap:0}.nav-about-main{font-size:16px!important;padding:1px 10px!important}.nav-about-menu a{font-size:11.5px!important;padding:0 10px!important}}
@media(prefers-reduced-motion:reduce){.home-facility-card img,.facility-image-button img,.facility-gallery-item img{transition:none!important}}

/* Product / service UAE & GCC maritime coverage generated from imported coverage JSON. */
.maritime-coverage{padding:clamp(38px,5vw,68px) clamp(18px,4vw,64px);background:linear-gradient(180deg,#f7f9fc 0%,#fff 100%);border-top:1px solid #e2e9f2}.maritime-coverage-inner{width:min(1320px,100%);margin:auto}.maritime-coverage-head{display:grid;grid-template-columns:minmax(250px,.9fr) minmax(360px,1.3fr);gap:5px 42px;align-items:end}.maritime-coverage-head .eyebrow{grid-column:1/-1;margin:0;color:#b97808;font-size:11px;font-weight:900;letter-spacing:.11em}.maritime-coverage-head h2{margin:0;color:#06356f;font-size:clamp(26px,3vw,42px);line-height:1.05}.maritime-coverage-head>p:not(.eyebrow){margin:0;color:#536c88;line-height:1.55}.maritime-coverage-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}.maritime-coverage-chips span{display:inline-flex;align-items:center;min-height:36px;padding:8px 13px;border:1px solid #cbd8e8;border-radius:999px;background:#fff;color:#07366e;font-size:12px;font-weight:800;box-shadow:0 3px 10px rgba(7,45,92,.04)}.maritime-coverage-note{margin:16px 0 0;color:#728399;font-size:10px;line-height:1.45}
@media(max-width:700px){.maritime-coverage{padding:32px 16px}.maritime-coverage-head{display:block}.maritime-coverage-head h2{margin:3px 0 8px;font-size:28px}.maritime-coverage-head>p:not(.eyebrow){font-size:12px}.maritime-coverage-chips{gap:6px;margin-top:18px}.maritime-coverage-chips span{min-height:32px;padding:7px 10px;font-size:10.5px}.maritime-coverage-note{font-size:9.5px}}


/* ===== facility-v50.css ===== */
/* V50 — Facility desktop alternation + right-side support rail + standalone Our Facility nav. */

/* Our Facility is now a normal primary-navigation item. The V49 dropdown is retired. */
.nav-about-group,.nav-about-menu{all:unset}

/* Desktop feature composition: supporting images sit in a vertical rail on the right. */
@media (min-width:981px){
  .facility-feature-layout{display:block;position:relative;background:#fff}
  .facility-feature-layout.has-support{display:grid;grid-template-columns:minmax(0,1fr) clamp(300px,27vw,500px);align-items:stretch;gap:4px;background:#fff;padding:0 4px 4px 0}
  .facility-feature-layout.has-support .facility-feature-main{min-height:clamp(600px,54vw,760px)}
  .facility-feature-layout.has-support .facility-support-grid{display:grid!important;grid-template-columns:1fr!important;gap:4px;padding:0;background:#fff;min-height:100%}
  .facility-feature-layout.has-support .facility-support-grid.facility-support-2{grid-template-rows:repeat(2,minmax(0,1fr))}
  .facility-feature-layout.has-support .facility-support-grid.facility-support-3{grid-template-rows:repeat(3,minmax(0,1fr))}
  .facility-feature-layout.has-support .facility-image-button{height:auto!important;min-height:0;border-radius:0}
  .facility-feature-layout.has-support .facility-image-button img{height:100%;object-fit:cover}

  /* Alternating text placement. Swaging is right-aligned; Testing/Spooling remain left. */
  .facility-copy-right .facility-feature-copy{position:absolute;top:50%;right:clamp(28px,4.4vw,70px);left:auto;transform:translateY(-50%);margin:0;width:min(600px,48vw)}
  .facility-copy-right .facility-feature-shade{background:linear-gradient(270deg,rgba(2,25,50,.97) 0%,rgba(3,33,65,.91) 31%,rgba(3,33,65,.54) 48%,rgba(3,33,65,.08) 72%,rgba(3,33,65,0) 100%)}
  .facility-copy-right .facility-feature-main>img{object-position:42% center}
  .facility-copy-left .facility-feature-copy{position:absolute;top:50%;left:clamp(24px,5vw,76px);right:auto;transform:translateY(-50%);margin:0}
  .facility-copy-left .facility-feature-shade{background:linear-gradient(90deg,rgba(2,25,50,.97) 0%,rgba(3,33,65,.90) 31%,rgba(3,33,65,.53) 48%,rgba(3,33,65,.08) 72%,rgba(3,33,65,0) 100%)}

  /* Keep technical supporting photography readable in the right rail. */
  .facility-feature-swaging .facility-support-grid .facility-image-button:first-child img{object-position:center 40%}
  .facility-feature-swaging .facility-support-grid .facility-image-button:last-child img{object-position:center 48%}
  .facility-feature-testing .facility-support-grid .facility-image-button img{object-position:center center}
}

/* Tablet/mobile retain the V49 sequence: main banner followed by a horizontal swipe rail. */
@media (max-width:980px){
  .facility-feature-layout,.facility-feature-layout.has-support{display:block;padding:0;background:#fff}
  .facility-copy-right .facility-feature-copy,.facility-copy-left .facility-feature-copy{position:relative;top:auto;left:auto;right:auto;transform:none;margin:clamp(36px,6vw,80px) clamp(24px,5vw,76px);width:min(620px,72vw)}
  .facility-copy-right .facility-feature-shade,.facility-copy-left .facility-feature-shade{background:linear-gradient(90deg,rgba(2,25,50,.97) 0%,rgba(3,33,65,.90) 31%,rgba(3,33,65,.53) 48%,rgba(3,33,65,.08) 72%,rgba(3,33,65,0) 100%)}
}
@media (max-width:700px){
  .facility-copy-right .facility-feature-copy,.facility-copy-left .facility-feature-copy{position:relative;top:auto;left:auto;right:auto;transform:none;width:100%;align-self:end;margin:0;padding:230px 18px 24px}
  .facility-copy-right .facility-feature-shade,.facility-copy-left .facility-feature-shade{background:linear-gradient(180deg,rgba(1,21,42,.03) 0%,rgba(1,21,42,.24) 35%,rgba(1,21,42,.94) 69%,rgba(1,21,42,.99) 100%)}
  .facility-copy-right .facility-feature-main>img,.facility-copy-left .facility-feature-main>img{object-position:center top}
}

/* Exact current-page state: no submenu can remain visually open on unrelated pages. */
.site-nav>a[aria-current="page"]{color:#b97808;font-weight:850;border-bottom:2px solid #c99743}
@media(max-width:980px){.site-nav>a[aria-current="page"]{color:#e7bb68!important;border-bottom:0!important}}

/* The separate Our Facility item adds one primary link; keep 981–1180px desktop headers collision-free. */
@media(min-width:981px) and (max-width:1180px){
  .top{gap:14px;padding-left:22px;padding-right:22px}
  .top .brand{width:190px}
  .top nav.site-nav{gap:13px;font-size:11.5px}
  .top>.btn.gold.desktop{padding:10px 14px;font-size:11px}
  .home-page .top nav.site-nav{gap:11px;font-size:10.5px}
}



/* ===== V61 — authoritative unified header + detail-page header clearance ===== */
/* Non-home pages now use the same floating header geometry as Home before scroll. */
@media (min-width:1280px){
  body:not(.home-page) .top:not(.is-scrolled){
    position:absolute!important;
    top:22px!important;
    left:clamp(28px,23vw,360px)!important;
    right:clamp(150px,12vw,210px)!important;
    width:auto!important;
    height:58px!important;
    padding:8px 24px!important;
    display:flex!important;
    align-items:center!important;
    gap:30px!important;
    border:1px solid rgba(255,255,255,.68)!important;
    border-radius:12px!important;
    background:rgba(255,255,255,.78)!important;
    box-shadow:0 9px 28px rgba(6,41,93,.07)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
    z-index:160!important;
  }
  body:not(.home-page) .top:not(.is-scrolled) .brand{
    position:fixed!important;
    left:4vw!important;
    top:28px!important;
    width:220px!important;
    margin:0!important;
    z-index:161!important;
  }
  body:not(.home-page) .top:not(.is-scrolled) .brand img{
    width:100%!important;
    height:auto!important;
    max-height:64px!important;
  }
  body:not(.home-page) .top:not(.is-scrolled) nav.site-nav{
    position:static!important;
    inset:auto!important;
    display:flex!important;
    width:auto!important;
    height:auto!important;
    min-height:0!important;
    margin:auto!important;
    padding:0!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:center!important;
    gap:25px!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:none!important;
  }
  body:not(.home-page) .top:not(.is-scrolled) nav.site-nav>a:not(.mobile-nav-quote){
    display:block!important;
    min-height:0!important;
    padding:9px 0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    color:#082950!important;
    font-size:13px!important;
  }
  body:not(.home-page) .top:not(.is-scrolled) nav.site-nav>a[aria-current="page"]{
    color:#a96e13!important;
    font-weight:800!important;
    box-shadow:inset 0 -2px #c99743!important;
  }
  body:not(.home-page) .top:not(.is-scrolled)>.gold{
    position:fixed!important;
    right:4vw!important;
    top:31px!important;
    margin:0!important;
    padding:10px 21px!important;
    background:rgba(255,255,255,.82)!important;
    color:#8a5a13!important;
    border:1px solid #c99a42!important;
    z-index:161!important;
  }
  body:not(.home-page) .top:not(.is-scrolled) .mobile-nav-head,
  body:not(.home-page) .top:not(.is-scrolled) .mobile-nav-quote,
  body:not(.home-page) .nav-backdrop,
  body:not(.home-page) .top:not(.is-scrolled) .nav-toggle{display:none!important}

  /* V59 previously forced non-home headers to remain sticky. Scroll state is now
     handled exclusively by the existing .is-scrolled fixed-header logic. */
  body:not(.home-page) .top.is-scrolled{
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    z-index:160!important;
  }
}

/* 981–1279px uses the compact tablet/small-laptop navigation system so the
   eight desktop links never squeeze, wrap or collide. */
@media (min-width:981px) and (max-width:1279px){
  body:not(.home-page) .top:not(.is-scrolled){
    position:absolute!important;
    top:18px!important;
    left:20px!important;
    right:20px!important;
    width:auto!important;
    height:56px!important;
    padding:7px 14px!important;
    border:1px solid rgba(255,255,255,.68)!important;
    border-radius:12px!important;
    background:rgba(255,255,255,.78)!important;
    box-shadow:0 9px 28px rgba(6,41,93,.07)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
    z-index:160!important;
  }
  body:not(.home-page) .top:not(.is-scrolled) .brand{position:static!important;width:170px!important;margin-right:auto!important}
  body:not(.home-page) .top:not(.is-scrolled)>.gold{display:none!important}
  body:not(.home-page) .nav-toggle{display:grid!important;place-items:center;width:42px;height:42px;border-radius:10px!important;background:#f5f8fc!important;border:1px solid #dbe5f0!important;z-index:172!important}
  body:not(.home-page).nav-open{overflow:hidden!important}
  body:not(.home-page) .top nav.site-nav{
    display:flex!important;position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;max-height:none!important;
    padding:clamp(92px,14vh,128px) 24px clamp(34px,7vh,58px)!important;margin:0!important;gap:clamp(13px,2.2vh,22px)!important;
    flex-direction:column!important;align-items:center!important;justify-content:center!important;overflow:auto!important;border:0!important;border-radius:0!important;
    background:linear-gradient(145deg,#061b35 0%,#082b54 58%,#04162b 100%)!important;box-shadow:none!important;
    opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(-10px)!important;
    transition:opacity .2s ease,transform .24s ease,visibility .2s ease!important;z-index:180!important;
  }
  body:not(.home-page) .top nav.site-nav.open{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translateY(0)!important}
  body:not(.home-page) .mobile-nav-head{display:flex!important;position:absolute!important;top:max(18px,env(safe-area-inset-top))!important;left:max(18px,env(safe-area-inset-left))!important;right:max(18px,env(safe-area-inset-right))!important;min-height:54px!important;padding:0!important;margin:0!important;align-items:center!important;justify-content:space-between!important;border:0!important}
  body:not(.home-page) .mobile-nav-brand{display:block!important;width:clamp(142px,24vw,184px)!important;min-height:0!important;padding:0!important;border:0!important;background:transparent!important}
  body:not(.home-page) .mobile-nav-brand img{width:100%!important;height:auto!important;filter:brightness(0) invert(1)!important;opacity:.98!important}
  body:not(.home-page) .mobile-nav-close{display:grid!important;place-items:center!important;width:44px!important;height:44px!important;min-width:44px!important;padding:0!important;border:1px solid rgba(213,164,73,.68)!important;border-radius:50%!important;background:rgba(255,255,255,.035)!important;color:#fff!important}
  body:not(.home-page) .top nav.site-nav>a:not(.mobile-nav-quote):not(.mobile-nav-brand){display:flex!important;align-items:center!important;justify-content:center!important;width:auto!important;min-height:auto!important;padding:4px 12px!important;border:0!important;border-radius:0!important;background:transparent!important;color:#fff!important;font-size:20px!important;font-weight:600!important;line-height:1.25!important;text-align:center!important}
  body:not(.home-page) .mobile-nav-quote{display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;width:min(220px,72vw)!important;min-height:44px!important;margin-top:8px!important;padding:10px 18px!important;border:1px solid #d5a449!important;border-radius:999px!important;background:rgba(213,164,73,.08)!important;color:#f2cf87!important;font-size:14px!important;font-weight:800!important}
}

/* Home-style initial header on the existing mobile/tablet breakpoints. */
@media (max-width:980px){
  body:not(.home-page) .top:not(.is-scrolled){
    position:absolute!important;left:20px!important;right:20px!important;top:18px!important;width:auto!important;height:56px!important;padding:7px 14px!important;
    border:1px solid rgba(255,255,255,.68)!important;border-radius:12px!important;background:rgba(255,255,255,.78)!important;box-shadow:0 9px 28px rgba(6,41,93,.07)!important;z-index:160!important;
  }
  body:not(.home-page) .top:not(.is-scrolled) .brand{position:static!important;width:170px!important;margin-right:auto!important}
  body:not(.home-page) .top:not(.is-scrolled)>.gold{display:none!important}
}
@media (max-width:600px){
  body:not(.home-page) .top:not(.is-scrolled){
    top:8px!important;left:8px!important;right:8px!important;height:55px!important;padding:7px 14px!important;
    background:transparent!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  }
  body:not(.home-page) .top:not(.is-scrolled) .brand{width:135px!important}
  body:not(.home-page) .top:not(.is-scrolled) .nav-toggle{
    background:rgba(255,255,255,.90)!important;border-color:rgba(219,229,240,.88)!important;box-shadow:0 5px 14px rgba(3,35,75,.08)!important;
  }
}

/* Detail hero needs a little clearance for the floating Home-style logo on large screens. */
@media (min-width:1280px){
  body.detail-page .reference-detail-hero.detail-hero--premium{
    height:clamp(455px,30vw,530px)!important;
    min-height:455px!important;
    max-height:530px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy>*{
    transform:translateY(18px)!important;
  }
}

/* Carousel images must remain clean — no CSS-generated blur, glow or duplicate backdrop. */
body.detail-page .carousel,
body.detail-page .carousel>img,
body.detail-page .mobile-hero-gallery,
body.detail-page .mobile-hero-gallery>img{
  filter:none!important;
}
body.detail-page .carousel::before,
body.detail-page .carousel::after,
body.detail-page .mobile-hero-gallery::before,
body.detail-page .mobile-hero-gallery::after{
  content:none!important;
  display:none!important;
}

/* ===== V67 FINAL AUTHORITATIVE HEADER + DETAIL HERO =====
   One rule-set loaded after the consolidated site CSS. */
@media (min-width:1280px){
  body:not(.home-page) .top:not(.is-scrolled){
    position:absolute!important;
    top:18px!important;
    left:4%!important;
    right:4%!important;
    width:auto!important;
    height:66px!important;
    min-height:0!important;
    display:grid!important;
    grid-template-columns:220px minmax(0,1fr) 130px!important;
    align-items:center!important;
    gap:18px!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    z-index:170!important;
  }
  body:not(.home-page) .top:not(.is-scrolled) .brand{
    position:static!important;
    inset:auto!important;
    width:220px!important;
    margin:0!important;
    justify-self:start!important;
  }
  body:not(.home-page) .top:not(.is-scrolled) .brand img{width:100%!important;height:auto!important;max-height:64px!important}
  body:not(.home-page) .top:not(.is-scrolled) nav.site-nav{
    position:static!important;
    inset:auto!important;
    display:flex!important;
    width:max-content!important;
    max-width:100%!important;
    min-height:48px!important;
    margin:0!important;
    padding:4px 25px!important;
    justify-self:center!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:center!important;
    gap:clamp(12px,1.7vw,27px)!important;
    border:1px solid rgba(255,255,255,.72)!important;
    border-radius:11px!important;
    background:rgba(255,255,255,.84)!important;
    box-shadow:0 9px 28px rgba(6,41,93,.07)!important;
    -webkit-backdrop-filter:blur(18px)!important;
    backdrop-filter:blur(18px)!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:none!important;
  }
  body:not(.home-page) .top:not(.is-scrolled)>.gold{
    position:static!important;
    inset:auto!important;
    min-width:118px!important;
    min-height:44px!important;
    margin:0!important;
    padding:10px 20px!important;
    justify-self:end!important;
    background:rgba(255,255,255,.84)!important;
    color:#8a5a13!important;
    border:1px solid #c99a42!important;
    border-radius:9px!important;
    box-shadow:none!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium{
    min-height:505px!important;
    height:clamp(505px,29vw,545px)!important;
    max-height:545px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{
    justify-content:flex-start!important;
    padding-top:118px!important;
    padding-bottom:22px!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy>*{transform:none!important}
}

@media (min-width:1280px) and (max-width:1450px){
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{
    padding-top:112px!important;
    padding-bottom:18px!important;
  }
}

@media (min-width:981px) and (max-width:1279px){
  body:not(.home-page) .top:not(.is-scrolled){position:absolute!important;top:14px!important;left:22px!important;right:22px!important}
}

@media (max-width:980px){
  body:not(.home-page) .top:not(.is-scrolled){position:absolute!important}
  body.detail-page .reference-detail-hero.detail-hero--premium{
    min-height:330px!important;
    height:auto!important;
    max-height:none!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{
    min-height:330px!important;
    height:auto!important;
    padding:82px 24px 20px!important;
    justify-content:flex-start!important;
    align-items:flex-start!important;
  }
}

@media (max-width:600px){
  body.detail-page .reference-detail-hero.detail-hero--premium{
    min-height:315px!important;
    height:auto!important;
    max-height:none!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{
    min-height:315px!important;
    height:auto!important;
    padding:72px 15px 15px!important;
    justify-content:flex-start!important;
    align-items:flex-start!important;
  }
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-eyebrow{margin:0 0 6px!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-actions{margin-top:10px!important}
}

@media (max-width:380px){
  body.detail-page .reference-detail-hero.detail-hero--premium{min-height:325px!important}
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{min-height:325px!important;padding-top:70px!important}
}

/* v70: only the displayed Carousel slide can receive image interactions. */
body.detail-page .carousel>img{pointer-events:none!important;}
body.detail-page .carousel>img.active{pointer-events:auto!important;z-index:3!important;}
body.detail-page .carousel .carousel-position{position:absolute;right:12px;bottom:10px;z-index:6;padding:4px 9px;border-radius:12px;background:rgba(3,28,58,.8);color:#fff;font-size:12px;line-height:1.4;pointer-events:none;}

/* v78: consistent compact header on inner pages; Homepage/desktop unchanged. */
@media (max-width:1279px){
  body:not(.home-page) .top:not(.is-scrolled){
    background:rgba(255,255,255,.97)!important;
    border:1px solid #dbe5ef!important;
    border-radius:12px!important;
    box-shadow:0 6px 20px rgba(3,35,75,.10)!important;
  }
  body:not(.home-page) .top>.brand img{filter:none!important;opacity:1!important;}
  body:not(.home-page).nav-open .top nav.site-nav.open{
    background:linear-gradient(145deg,#061b35 0%,#082b54 58%,#04162b 100%)!important;
  }
}
@media (max-width:980px){
  body.detail-page .reference-detail-hero.detail-hero--premium .detail-hero-copy{
    padding-top:86px!important;
  }
}
/* Consistent company assurances on every public page. */
.sitewide-assurances{padding:0 clamp(16px,4vw,64px);background:#f7f9fc;border-top:1px solid #e2e9f2}
.sitewide-assurances .benefits{max-width:1320px;margin:0 auto;grid-column:auto;border-top:0}
@media(max-width:700px){.sitewide-assurances{padding:0 10px}.sitewide-assurances .benefits span{min-height:70px;padding:8px 4px;flex-direction:column;gap:4px;text-align:center}.sitewide-assurances .benefits b{font-size:10px;line-height:1.2}.sitewide-assurances .benefits .icon{width:23px;height:23px}}
