/* Shared visual system for the cinematic Transrec site direction. */
/* TRANSREC / CREATIVE DIRECTION: field intelligence, told with editorial restraint. */
:root{color-scheme:light;--navy:#071c2a;--ink:#142d3a;--blue:#087f9f;--muted:#5a6b70;--line:#d8ddd9;--soft:#ecefe9;--white:#fbfaf6;--motion-ease:cubic-bezier(.22,.7,.22,1);background:#f5f4ef;color:var(--ink);font-family:"Segoe UI Variable","Aptos","Avenir Next",Arial,sans-serif;font-feature-settings:"kern" 1,"liga" 1}
body{background:#f5f4ef;color:#142d3a;font-family:"Segoe UI Variable","Aptos","Avenir Next",Arial,sans-serif;line-height:1.7;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:"Segoe UI Variable","Aptos Display","Avenir Next",Arial,sans-serif;font-weight:650;letter-spacing:-.045em;color:#0a2433}
h1{font-size:clamp(2.65rem,5.5vw,5.2rem);line-height:.99;letter-spacing:-.065em}
h2{font-size:clamp(2rem,3.4vw,3.35rem);line-height:1.03;letter-spacing:-.055em}
h3{letter-spacing:-.035em}
p{color:#56666a}
.wrap{width:min(1320px,calc(100% - 96px))}
.topbar{background:#061b29;color:#b8c8cd;letter-spacing:.16em;font-size:10px}
.topbar .wrap{min-height:36px}
.topbar a{color:#f2f5f3;transition:color 180ms ease}
.topbar a:hover{color:#62d1ee}
.header{background:rgba(248,248,243,.96);border-bottom:1px solid #d9dfdc;backdrop-filter:blur(12px)}
.nav{min-height:82px}
.brand img{width:76px;height:70px}
.nav nav{gap:clamp(14px,1.9vw,26px);font-size:13px;letter-spacing:.01em}
.nav nav>a,.nav-drop summary{position:relative;transition:color 180ms ease}
.nav nav>a:after,.nav-drop summary:before{content:"";position:absolute;left:0;right:100%;bottom:-7px;height:1px;background:#1598b8;transition:right 220ms ease}
.nav nav>a:hover:after,.nav nav>a[aria-current="page"]:after{right:0}
.nav-drop summary:hover:before,.nav-drop[open] summary:before{right:0}
.button{border-radius:3px;min-height:49px;padding:13px 20px;font-size:13px;letter-spacing:.01em}
.primary{background:#087e9d;color:#fff;box-shadow:0 5px 16px rgba(3,79,101,.12)}
.primary:hover{background:#06667f;transform:translateY(-1px)}
.secondary{background:transparent;border-color:#9baeb2;color:#123543}
.secondary:hover{background:#e7f1f1;border-color:#087e9d}
.nav-cta{margin-left:2px}
.hero{padding:clamp(50px,6vw,88px) 0;background:#e9ede8;position:relative;isolation:isolate;overflow:hidden}
.hero:before{content:"";position:absolute;z-index:-1;inset:0;background:radial-gradient(ellipse at 86% 15%,rgba(105,174,185,.15),transparent 42%),linear-gradient(115deg,rgba(251,250,246,.56),transparent 68%)}
.hero.dark{background:radial-gradient(ellipse at 82% 16%,#164656 0%,transparent 40%),linear-gradient(120deg,#071a27,#0b3342)}
.hero.dark:before{background:radial-gradient(ellipse at 82% 10%,rgba(69,165,183,.17),transparent 45%)}
.hero.dark .eyebrow{color:#70d2e6}
.hero.dark .lead,.hero.dark p{color:#b9cbd0}
.hero-grid{gap:clamp(38px,7vw,100px)}
.hero h1{max-width:780px;margin-bottom:25px}
.eyebrow{font-size:10px;letter-spacing:.22em;color:#087f9f;margin-bottom:17px}
.lead{font-size:clamp(16px,1.5vw,19px);line-height:1.7;color:#536a70;max-width:580px}
.hero-video{border-radius:2px;box-shadow:0 24px 60px rgba(5,30,41,.13);background:#071c2a}
.hero-video video{border-radius:2px}
.section{padding-top:clamp(60px,7vw,104px);padding-bottom:clamp(60px,7vw,104px)}
.section-head{margin-bottom:38px;align-items:end}
.section-head>div{max-width:810px}
.section-head h2{max-width:750px}
.section-head p:not(.eyebrow){font-size:15px;color:#66767a}
.trust{background:#e9ede8;border-color:#d5dcd8}
.trust .wrap{padding-top:24px;padding-bottom:24px}
.trust span{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#445c65;border-color:#cbd5d3}
.trust svg{color:#0786a4}
.product-grid{gap:14px}
.product-card{border:1px solid #dce1dc;border-radius:2px;background:#fbfaf6;box-shadow:0 6px 22px rgba(10,32,40,.035);overflow:hidden}
.product-card:hover{border-color:#a3c8cf}
.card-top{background:#eaf0ed;color:#527078;font-size:9px;letter-spacing:.16em;padding:12px 15px}
.product-picture{height:205px;background:radial-gradient(ellipse at 50% 85%,rgba(51,152,173,.13),transparent 57%),linear-gradient(145deg,#f7f8f3,#e9eeea);padding:20px}
.product-picture img{max-height:155px;max-width:82%;object-fit:contain}
.card-content{padding:23px 21px 20px}
.card-content .model{font-size:10px;letter-spacing:.18em;color:#0783a1;text-transform:uppercase;font-weight:700}
.card-content h3{font-size:19px;min-height:52px}
.card-content>p:not(.model){font-size:13px;line-height:1.55}
.card-views{border-top:1px solid #e0e4df;border-bottom:1px solid #e0e4df;color:#536b70;font-size:11px;letter-spacing:.02em}
.card-link{font-size:12px;letter-spacing:.02em;color:#087b98}
.card-pricing{border-color:#d9e1dc;color:#142d3a;padding-top:15px}
.card-pricing a{color:#087b98;font-size:11px;letter-spacing:.04em}
.card-pricing .price-amount{font-size:24px;color:#0a2838;letter-spacing:-.04em}
.card-pricing .price-amount small{font-size:9px;color:#75868a;letter-spacing:.08em;text-transform:uppercase}
.solution-grid{gap:1px;background:#d6dedb;border:1px solid #d6dedb}
.solution-card{background:#f7f7f1;border:0;border-radius:0;padding:clamp(25px,3vw,40px)}
.solution-card:hover{background:#fff}
.solution-card h3{font-size:20px}
.solution-card p{font-size:14px;line-height:1.75}
.icon-tile{background:#e3eeeb;color:#087f9f;border-radius:0;width:41px;height:41px}
.industry-card img,.editorial-image{border-radius:2px;filter:saturate(.88)}
.industry-card h3{font-size:16px;letter-spacing:-.025em}
.soft{background:#e9ede8;border-color:#d9dfda}
.feature-panel{background:#071e2c;border:1px solid #194356;border-radius:2px;box-shadow:0 30px 70px rgba(5,29,40,.12)}
.feature-panel h2,.feature-panel h3{color:#f4f4ee}
.feature-panel p{color:#b4c6cb}
.dark{background:radial-gradient(ellipse at 82% 16%,#164656 0%,transparent 40%),linear-gradient(120deg,#071a27,#0b3342);color:#f7f7f1}
.dark h1,.dark h2,.dark h3{color:#f7f7f1}
.dark .lead,.dark p{color:#b9cbd0}
.cta{background:#071c29;color:#f8f8f2;padding:clamp(60px,7vw,98px) 0;position:relative;overflow:hidden}
.cta:after{content:"";position:absolute;right:-12vw;top:-42vw;width:72vw;height:72vw;border:1px solid rgba(91,192,211,.12);border-radius:50%;box-shadow:0 0 0 60px rgba(91,192,211,.025),0 0 0 120px rgba(91,192,211,.02);pointer-events:none}
.cta h2{color:#f8f8f2;font-size:clamp(2.2rem,4.5vw,4.5rem);max-width:760px}
.cta p:not(.eyebrow){color:#afc1c7}
.cta .eyebrow{color:#70d2e6}
.cta .wrap{position:relative;z-index:1}
footer{background:#04151f;color:#b4c7cd;padding-top:52px}
.footer-grid h3{color:#f7f8f3;font-size:12px;letter-spacing:.1em;text-transform:uppercase}
.footer-grid p,.footer-grid a{color:#afc1c7}
.footer-grid a:hover{color:#69d1e9}
.copyright{border-color:#ffffff17;color:#7f9aa3}
.form-card,.use-panel,.contact-box,.zoho-form{background:#fbfaf6;border-color:#dce2dc;border-radius:2px;box-shadow:0 14px 40px rgba(9,34,45,.045)}
input,select,textarea{border-radius:2px;border-color:#cbd6d4;background:#fff;color:#173746}
input:focus,textarea:focus,select:focus{outline:2px solid #26a8c4;outline-offset:2px}
.faq details{border-color:#d5dfdc}
.faq summary{color:#0b2a39}
.faq details[open] summary>span{color:#087f9f}
.text-link{color:#087b98}
.text-link:hover{color:#055c72}
.breadcrumbs{color:#6a7e81}
.subnav{background:#f5f4ef;border-color:#d8dfdc}
.subnav>.wrap{letter-spacing:.02em}
.nav-menu{border-radius:2px;box-shadow:0 18px 48px rgba(8,35,46,.14);border-color:#dbe2de}
.nav-menu a:hover{background:#e8f0ed}
.menu-toggle{border-radius:2px;background:#e7eeeb;color:#183845}
.home-video-hero{background:#061824;line-height:1}
.home-video-hero:after{background:linear-gradient(180deg,rgba(3,21,30,.05),rgba(3,21,30,.13))}
.home-video-hero .home-hero-video{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;object-position:center;background:#061824}
.home-hero-actions{right:clamp(24px,5vw,76px);bottom:clamp(22px,3vw,48px)}
.hero-action{border-radius:2px;min-height:48px;padding:13px 18px;font-size:12px;letter-spacing:.04em}
.hero-action-secondary{background:rgba(3,24,34,.76);border-color:rgba(255,255,255,.34)}
.hero-action-primary{background:#0783a3;border-color:#4bb7cc}
.brand-intro{background:#071c29;color:#f5f5ef;position:relative;overflow:hidden;padding:clamp(60px,8vw,112px) 0 clamp(54px,7vw,90px)}
.brand-intro:before{content:"";position:absolute;width:min(65vw,900px);height:min(65vw,900px);right:-22vw;top:-42vw;border:1px solid rgba(111,194,209,.17);border-radius:50%;box-shadow:0 0 0 55px rgba(111,194,209,.035),0 0 0 110px rgba(111,194,209,.025),0 0 0 165px rgba(111,194,209,.018);pointer-events:none}
.brand-intro-grid{display:grid;grid-template-columns:minmax(145px,.45fr) minmax(0,1.55fr);gap:clamp(32px,8vw,130px);align-items:start;position:relative}
.brand-intro-index{padding-top:8px;color:#81b6c3;font-size:10px;letter-spacing:.19em;text-transform:uppercase;line-height:1.9}
.brand-intro-copy{max-width:880px}
.brand-intro-copy .eyebrow{color:#6ad0e4}
.brand-intro-copy h2{color:#f5f6f0;font-size:clamp(2.7rem,5.9vw,6rem);max-width:860px;line-height:.98;margin:0 0 26px}
.brand-intro-copy>p:not(.eyebrow){max-width:650px;color:#bdcbd0;font-size:clamp(15px,1.4vw,18px);line-height:1.75}
.brand-intro-actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:30px}
.brand-intro-actions .button.secondary{color:#f5f6f0;border-color:#708a92}
.brand-intro-actions .button.secondary:hover{color:#071c29;background:#f5f6f0}
.brand-index-rule{display:block;width:34px;height:1px;background:#4bb9d0;margin:14px 0}
@media(max-width:960px){.nav{min-height:74px}.nav nav{background:#f5f4ef;top:74px}.hero{padding:56px 0}.wrap{width:calc(100% - 64px)}}
@media(max-width:720px){.wrap{width:calc(100% - 42px)}.brand-intro{padding:54px 0 58px}.brand-intro-grid{grid-template-columns:1fr;gap:18px}.brand-intro-index{padding:0}.brand-intro-copy h2{font-size:clamp(2.5rem,10vw,4.2rem)}.brand-intro:before{width:100vw;height:100vw;right:-54vw;top:-40vw}.section{padding-top:55px;padding-bottom:55px}.trust .wrap{padding-top:22px;padding-bottom:22px}.home-hero-actions{right:12px;bottom:12px;gap:6px}.hero-action{min-height:39px;padding:10px 12px;font-size:10px}.product-grid{gap:12px}.product-picture{height:165px}.card-content{padding:17px 15px}.card-content h3{font-size:17px;min-height:48px}.solution-grid{grid-template-columns:1fr}.solution-card{padding:25px}}
@media(max-width:480px){.wrap{width:calc(100% - 32px)}.topbar{letter-spacing:.08em}.nav{min-height:68px}.brand img{width:64px;height:60px}.nav nav{top:68px}.hero{padding:37px 0}.hero h1{font-size:clamp(2.65rem,12vw,3.35rem)}.home-hero-actions{left:10px;right:10px;justify-content:flex-end;bottom:10px}.hero-action{min-height:35px;padding:8px 9px;font-size:9px}.brand-intro{padding:44px 0 48px}.brand-intro-actions{gap:12px}.trust span{font-size:10px;letter-spacing:.015em}.product-grid{grid-template-columns:1fr}.product-card{display:grid;grid-template-columns:42% 58%;grid-template-rows:auto 1fr}.product-card .card-top{grid-column:1/-1}.product-card .product-picture{height:100%;min-height:230px;grid-column:1;grid-row:2;padding:14px}.product-card .product-picture img{max-width:100%;max-height:140px}.product-card .card-content{grid-column:2;grid-row:2;padding:18px 13px}.product-card .card-content h3{min-height:0;margin-bottom:10px}.product-card .card-content>p:not(.model){min-height:0;font-size:12px}.product-card .card-views{min-height:0;padding:9px 0;font-size:10px}.product-card .card-link{font-size:11px}.cta:after{width:100vw;height:100vw;top:-20vw;right:-55vw}}
@media(prefers-reduced-motion:reduce){.home-video-hero .home-hero-video{scroll-behavior:auto}.brand-intro:before,.cta:after{box-shadow:none}}

/* Enquiry-first product callouts */
.product-pricing{background:#ffffffd9;border:1px solid #cbdfe8;border-left:3px solid var(--blue);border-radius:5px;padding:18px 22px;margin:0 0 24px;max-width:590px}
.product-pricing .price-label{display:block;font-size:10px;font-weight:700;letter-spacing:1px;color:var(--muted);line-height:1.5;margin:0 0 7px}
.product-pricing p:not(.price-label){margin:0 0 10px}
.card-pricing{border-top:1px solid var(--line);padding:17px 0 5px;margin-top:5px}
.card-pricing a{font-size:11px;letter-spacing:.04em}