:root{
  --bg:#ffffff;
  --panel:#F4F9FF;
  --yellow:#287FD1;
  --text:#12304B;
  --muted:#5C7287;
  --line:#D7E7F5;
  --sky:#77C8F2;
  --ice:#EAF6FD;
}

body,button,input,select,textarea{font-family:"Manrope",Arial,sans-serif}
body{background:#fff;color:#17324D;font-weight:600}
h1,h2,h3,h4,.site-header nav,.btn{font-family:"Manrope",Arial,sans-serif}
h1,h2{letter-spacing:-.035em}
h1{font-size:clamp(2.8rem,4.6vw,4.8rem)}
h2{font-size:clamp(2.1rem,3.7vw,3.7rem)}
h3{font-size:1.15rem}
.site-header nav{letter-spacing:.055em;font-weight:800}
h1,h2,h3,h4,strong{color:#17324D;font-weight:800}
p{color:#61758A;font-weight:600}
.btn,.eyebrow,.ticker,.trust,.service-top>span,.show-grid article>span,label,.contact-lines{font-weight:800}
.services-menu summary,.services-dropdown a,footer a,footer span{font-weight:700}
input,select,textarea{font-weight:600}
.eyebrow,h1 em,h2 em,.service-top>span,.show-grid article>span{color:#287FD1}
.eyebrow i{background:linear-gradient(90deg,#287FD1,#77C8F2);width:38px}

body{background:linear-gradient(180deg,#fff 0%,#F8FCFF 48%,#fff 100%)}
.section{position:relative}
.section-head h2{max-width:780px}
.section-head>p{font-size:1rem;line-height:1.85}
h1 em,h2 em{background:linear-gradient(90deg,#287FD1,#65BEEA);-webkit-background-clip:text;background-clip:text;color:transparent}

.site-header{background:#ffffffed;border-bottom-color:#D9E8F7;box-shadow:0 10px 35px #3877a50b;backdrop-filter:blur(18px)}
.site-header .header-top{background:linear-gradient(90deg,#E8F5FE,#F7FBFF);border-bottom-color:#D9E8F7;color:#405D78}
.header-top svg,.site-header nav>a:hover,.services-menu summary:hover{color:#4A90E2}
.site-header nav>a,.services-menu summary{color:#17324D;position:relative}
.site-header nav>a:not(.quote-link)::after,.services-menu summary::after{content:"";position:absolute;left:0;right:100%;bottom:-9px;height:2px;background:linear-gradient(90deg,#287FD1,#77C8F2);transition:.25s}
.site-header nav>a:hover::after,.services-menu summary:hover::after{right:0}
.services-dropdown{border-color:#D9E8F7;border-top-color:#4A90E2;box-shadow:0 18px 45px #4A78A81c}
.services-dropdown a{color:#405D78}
.services-dropdown a:hover{background:#EAF4FF;color:#4A90E2}
.quote-link{color:#fff!important;background:linear-gradient(135deg,#287FD1,#5CB9E8);padding:11px 18px;border-radius:999px;box-shadow:0 9px 22px #287FD12b}

.btn{background:linear-gradient(135deg,#287FD1,#55B5E6);border-color:#287FD1;color:#fff;box-shadow:0 12px 28px #287FD129;border-radius:999px;padding:15px 24px}
.btn:hover{background:#3478C5;border-color:#3478C5;box-shadow:0 14px 32px #4A90E233}
.btn-ghost{background:#fff;color:#4A90E2;border-color:#B7D5F2}
.btn-ghost:hover{border-color:#4A90E2;background:#EFF7FF}

.hero{background:linear-gradient(135deg,#F8FCFF,#E8F5FD);isolation:isolate}
.hero::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;right:-130px;top:90px;background:#77C8F22b;filter:blur(4px);z-index:1}
.hero::after{content:"";position:absolute;width:240px;height:240px;border-radius:50%;left:42%;bottom:-100px;background:#287FD112;z-index:1}
.hero>img{opacity:.82;filter:saturate(.78) brightness(1.08);width:52%;height:72%;position:absolute;right:3%;top:17%;border-radius:32px 0 0 32px;box-shadow:0 35px 80px #245e8730;z-index:2}
.hero-shade{background:linear-gradient(90deg,#F9FCFF 0%,#F9FCFFf8 46%,#EAF5FC70 67%,transparent 100%);z-index:3}
.hero-inner{z-index:4}
.hero-copy{max-width:650px}
.hero h1{font-size:clamp(2.9rem,4.7vw,4.9rem);line-height:1}
.hero .lead{font-size:1.03rem}
.hero h1,.hero .lead{color:#17324D}
.trust{background:#ffffffed;border:1px solid #D6E7F7;box-shadow:0 20px 50px #4278aa14;padding:14px 20px;border-radius:16px;backdrop-filter:blur(10px)}
.trust span{color:#405D78}
.trust svg{color:#4A90E2}

.ticker{background:linear-gradient(90deg,#1D6BB5,#287FD1,#55B5E6);color:#fff;border:0}
.service,.compare article,.option-grid article,form{background:#ffffff;border-color:#D9E8F7;box-shadow:0 18px 50px #346e9c0e}
.service{border-radius:24px;overflow:hidden;position:relative}
.service h3{font-size:1.25rem}
.service::before{content:"";position:absolute;inset:0 auto auto 0;width:100%;height:4px;background:linear-gradient(90deg,#287FD1,#77C8F2);transform:scaleX(0);transform-origin:left;transition:.3s}
.service:hover::before{transform:scaleX(1)}
.service:hover,.compare article:hover,.option-grid article:hover{border-color:#9CC8F2;box-shadow:0 20px 44px #4A78A817}
.service.featured{background:linear-gradient(145deg,#E4F3FD,#fff 72%)}
.service-top svg{background:#EAF6FD;padding:10px;width:52px;height:52px;border-radius:15px}
.service-top svg,.why-grid svg,.compare svg,.mini-grid svg,.application-tags svg,.benefit-grid svg{color:#4A90E2}

.visual-split,.applications,.projector,.split,.sizes,.faq,.service-benefits{background:linear-gradient(135deg,#F2F9FE,#F9FCFF)}
.image-panel{background:#EAF4FF;border-radius:30px;box-shadow:22px 22px 0 #D9EEFA}
.image-panel img{opacity:.9;filter:saturate(.76) brightness(1.08);border:1px solid #D9E8F7;border-radius:30px}
.image-panel span{background:#ffffffed;border-color:#D9E8F7;color:#17324D;box-shadow:0 10px 30px #4278aa18}
.split-copy li{color:#405D78}
.why-grid,.size-row,.application-tags span,.benefit-grid article{border-color:#D9E8F7}
.why-grid{border-radius:28px;box-shadow:0 24px 65px #376f990e;background:#fff}
.why-grid article{transition:.25s}
.why-grid h3{font-size:.98rem}
.why-grid article:hover{transform:translateY(-3px);background:linear-gradient(135deg,#F7FCFF,#EAF6FD)}
.why-grid article:hover,.size-row div:hover{background:#EAF4FF}
.pill{background:#DFEEFF;color:#3478C5}

.showcase{background:linear-gradient(145deg,#E8F5FD,#F8FCFF)}
.show-grid article{border-color:#D1E5F8}
.show-grid article{background-image:linear-gradient(180deg,#287FD10d 0%,#245F91e8 100%),url(../media/hero-professional-blue.webp)!important;box-shadow:0 18px 42px #2a679627;border-radius:22px}
.show-grid article::after{background:linear-gradient(0deg,#3F78B3c9,transparent)}
.show-grid h3{color:#fff}
.show-grid h3{font-size:1rem}
.show-grid article:last-child{grid-column:2/span 2}
.projector-card{background:#E0EEFC;border-radius:30px;box-shadow:0 30px 70px #377aa51a}
.projector-copy h2{font-size:clamp(2rem,3.4vw,3.45rem)}
.projector-card>img{opacity:.64;filter:saturate(.6) brightness(1.1)}
.projector-card:after{background:linear-gradient(90deg,#EAF4FFf2 4%,#EAF4FFa8 48%,transparent)}
.projector-copy h2,.projector-copy p,.projector-copy span{color:#17324D}

.size-row div{background:#fff;border-radius:18px;box-shadow:0 12px 35px #3978a50c}
.size-row strong{color:#4A90E2}
.cta{background:radial-gradient(circle at 12% 20%,#ffffff45 0 2px,transparent 3px),linear-gradient(125deg,#DCEFFD,#F9FCFF 55%,#E2F4FD);background-size:32px 32px,auto;border-color:#CEE5F5}
.cta h2,.cta p{color:#17324D}
.cta .btn-ghost{background:#fff;color:#287FD1;border-color:#A9D5F0;box-shadow:0 10px 24px #287FD117}
.cta .btn-ghost svg{color:#287FD1}
.cta .btn-ghost:hover{background:#EAF6FD;color:#1D6BB5;border-color:#287FD1}
.contact{background:#fff}
input,select,textarea{background:#F8FBFF;border-color:#D7E7F7;color:#17324D}
input:focus,select:focus,textarea:focus{border-color:#4A90E2;box-shadow:0 0 0 3px #4A90E217}

footer{background:linear-gradient(135deg,#E7F4FC,#F8FCFF);border-top-color:#D7E7F7}
footer h4,footer a,footer span{color:#405D78}
footer a{position:relative;z-index:2;pointer-events:auto;transition:color .2s,transform .2s}
footer a:hover{color:#287FD1;transform:translateX(3px)}
.whatsapp{background:#4A90E2;color:#fff;box-shadow:0 12px 28px #4A90E240}
.subhero{background:#EAF4FF;overflow:hidden}
.subhero>img{opacity:.46;filter:saturate(.82) brightness(1.08);width:100%;left:0;right:0;border-radius:0;object-position:center}
.subhero>div:nth-child(2){background:linear-gradient(90deg,#F8FCFF 0%,#F8FCFFf5 43%,#EAF6FDad 68%,#EAF6FD38 100%)}
.subhero h1,.subhero-copy>p{color:#17324D}
.contact-page-hero{background:linear-gradient(135deg,#E3F1FF,#fff);border-bottom-color:#D9E8F7}
.contact-page-hero h1{color:#17324D}
.gallery-grid figure{background:#EAF4FF;border:1px solid #D9E8F7;border-radius:24px}
.gallery-grid img,.service-gallery img{filter:saturate(.78) brightness(1.05);border:1px solid #D9E8F7}
.gallery-grid figcaption{background:#ffffffed;color:#17324D;border:1px solid #D9E8F7;box-shadow:0 8px 24px #4278aa1a}
.service-gallery{background:#fff}
.service-gallery img{box-shadow:0 18px 45px #4278aa18;border-radius:22px}
.option-grid article,.benefit-grid article{border-radius:20px;transition:.25s}
.option-grid article:hover,.benefit-grid article:hover{transform:translateY(-4px);box-shadow:0 18px 42px #3478a718}
.application-tags span{background:#fff;box-shadow:0 8px 22px #3478a70a}
.service-intro{display:grid;grid-template-columns:.85fr 1.15fr;gap:80px;align-items:start}
.service-intro-lead{font-size:1.08rem;line-height:1.9;margin-bottom:34px}
.service-stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.service-stat-row span{background:#F4F9FF;border:1px solid #D7E7F5;border-radius:16px;padding:20px;color:#5C7287;font-size:.78rem}
.service-stat-row strong{display:block;color:#287FD1;font-size:1.55rem;margin-bottom:3px}
.service-options-wrap{background:linear-gradient(135deg,#F2F9FE,#fff)}
.service-options-wrap .service-overview{padding-top:0;padding-bottom:0}
.option-grid article{position:relative}
.option-grid article>span{position:absolute;right:20px;top:18px;color:#8CB7D7;font-size:.72rem;font-weight:800}
.benefit-grid article p{font-size:.86rem;margin:9px 0 0}
.package-section{display:grid;grid-template-columns:.9fr 1.1fr;gap:90px;align-items:center}
.package-copy>p:not(.eyebrow){max-width:500px;margin-top:26px}
.package-list{border-top:1px solid #D7E7F5}
.package-list>div{display:grid;grid-template-columns:42px 28px 1fr;align-items:center;padding:18px 8px;border-bottom:1px solid #D7E7F5}
.package-list strong{font-size:.72rem;color:#87A8C1}
.package-list svg{width:18px;color:#287FD1}
.package-list span{color:#405D78;font-weight:700}
.service-process{background:#fff}
.service-footer{display:grid;grid-template-columns:1.4fr .7fr 1fr;gap:70px}
.service-footer>div{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.service-footer img{width:220px;margin-bottom:12px}
.service-footer p{max-width:340px}
.service-footer h4{margin:0 0 10px;color:#287FD1;text-transform:uppercase;letter-spacing:.12em;font-size:.75rem}
.faq details{border-color:#D9E8F7}
.faq summary{color:#17324D}
.size-row div:hover{background:#4A90E2;color:#fff}
.size-row div:hover strong,.size-row div:hover sup{color:#fff}
.menu{color:#4A90E2}

@media(max-width:1050px){
 .site-header nav{background:#fff;border-color:#D9E8F7}
 .services-dropdown{border-left-color:#4A90E2}
 .services .service:last-child{grid-column:1/-1;width:calc(50% - 8px);justify-self:center}
}
@media(max-width:720px){
 .services .service:last-child{width:100%}
 .show-grid article:last-child{grid-column:span 2}
 .service-intro,.package-section{grid-template-columns:1fr;gap:36px}
 .service-stat-row{grid-template-columns:1fr}
 .service-footer{grid-template-columns:1fr;gap:30px}
 .hero>img{width:100%;height:46%;right:0;top:54%;border-radius:32px 32px 0 0;opacity:.4}
 .hero-shade{background:linear-gradient(180deg,#F9FCFF 0%,#F9FCFFfa 62%,#E8F4FCb5 100%)}
 .hero h1{font-size:2.55rem}
 h2{font-size:2.15rem}
 h3{font-size:1.05rem}
 .hero .lead{font-size:.96rem}
 .site-header nav{font-size:.82rem}
 .trust{padding:12px;border-radius:14px}
 .image-panel{box-shadow:10px 10px 0 #D9EEFA}
 .quote-link{border-radius:10px}
 .subhero>img{width:100%;opacity:.28;border-radius:0}
 .subhero>div:nth-child(2){background:linear-gradient(180deg,#F8FCFFf8,#EEF7FDdb)}
 .projector-card:after{background:linear-gradient(0deg,#EAF4FFf7 34%,transparent 80%)}
}
