/* Pixel-oriented homepage matching the supplied 1536x1024 reference. */
.ic-reference-home{margin:0;background:#fff;color:#061f49;font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;overflow-x:hidden}
.ic-reference-home *{box-sizing:border-box}
.ref-shell{width:1310px;max-width:calc(100% - 48px);margin:0 auto}
.ref-topbar{height:37px;background:linear-gradient(90deg,#0d355f,#052848);color:#fff;font-size:12px}
.ref-topbar .ref-shell{height:100%;display:grid;grid-template-columns:1fr auto 72px;align-items:center;gap:28px}
.ref-slogan{white-space:nowrap}
.ref-contact{display:flex;align-items:center;gap:29px;white-space:nowrap}
.ref-contact a,.ref-contact span{color:#fff;text-decoration:none}
.ref-lineicon{display:inline-block;margin-right:7px;color:#fff;font-size:13px}
.ref-lang{justify-self:end;white-space:nowrap}.ref-lang span{font-size:16px;margin-left:3px}
.ref-header{height:82px;background:#fff;border-bottom:1px solid #e7edf4;position:relative;z-index:20}
.ref-header-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:26px}
.ref-logo{width:285px;height:68px;display:flex;align-items:center;overflow:hidden;flex:0 0 auto}
.ref-logo img{display:block;width:285px;height:68px;object-fit:cover}
.ref-nav{display:flex;align-items:stretch;height:100%;gap:4px;margin-left:auto}
.ref-nav a{height:100%;display:flex;align-items:center;padding:0 17px;color:#001f4b!important;font-size:14px;font-weight:500;text-decoration:none;border-bottom:2px solid transparent;white-space:nowrap}
.ref-nav a:hover,.ref-nav a.active{color:#006af0!important;border-bottom-color:#006af0}
.ref-nav .ref-search{font-size:27px;font-family:Georgia,serif;padding-left:20px;padding-right:4px;border-bottom-color:transparent!important;color:#001f4b!important;transform:rotate(-18deg)}
.ref-menu-toggle{display:none;border:0;background:#f0f5fb;border-radius:6px;padding:8px 10px;color:#0b2d55;font-size:20px}
.ref-home-main{width:100%;max-width:none;margin:0;padding:0}
.ref-image-section{position:relative;width:100%;overflow:hidden;line-height:0;background:#fff}
.ref-image-section>img{width:100%;height:auto;display:block;margin:0;padding:0}
.ref-hotspot{position:absolute;display:block;z-index:4;background:transparent;text-indent:-9999px;overflow:hidden}
/* Coordinates are percentages of the corresponding reference crop. */
.ref-hero-section .hs-products{left:8.4%;top:73.4%;width:13.35%;height:13.6%}
.ref-hero-section .hs-quote{left:22.95%;top:73.4%;width:9.85%;height:13.6%}
.ref-products-section .hs-all-products{left:83.7%;top:5.2%;width:9.3%;height:9.2%}
.ref-products-section .hs-p1{left:7.5%;top:20%;width:13.2%;height:76%}
.ref-products-section .hs-p2{left:21.9%;top:20%;width:13.2%;height:76%}
.ref-products-section .hs-p3{left:36.3%;top:20%;width:13.2%;height:76%}
.ref-products-section .hs-p4{left:50.7%;top:20%;width:13.2%;height:76%}
.ref-products-section .hs-p5{left:65.0%;top:20%;width:13.2%;height:76%}
.ref-products-section .hs-p6{left:79.4%;top:20%;width:13.2%;height:76%}
.ref-lower-section .hs-about{left:8.4%;top:69%;width:11.5%;height:18%}
/* Reposition the real WhatsApp widget so it sits over the reference widget location. */
#ic-wa-wrap{right:30px!important;bottom:18px!important;z-index:999!important}
@media(max-width:1180px){
  .ref-shell{max-width:calc(100% - 30px)}
  .ref-contact{gap:15px}.ref-nav a{padding:0 10px;font-size:13px}.ref-logo{width:245px}.ref-logo img{width:245px;height:auto}
}
@media(max-width:940px){
  .ref-topbar{height:auto;min-height:39px;padding:6px 0}.ref-topbar .ref-shell{display:flex;justify-content:space-between;gap:12px}.ref-contact{display:none}
  .ref-header{height:70px}.ref-logo{height:60px;width:240px}.ref-menu-toggle{display:block}
  .ref-nav{display:none;position:absolute;left:0;right:0;top:70px;height:auto;background:#fff;box-shadow:0 8px 20px rgba(0,0,0,.1);padding:10px 16px 16px;flex-direction:column;align-items:stretch;gap:0}.ref-nav.open{display:flex}.ref-nav a{height:42px;border-bottom:1px solid #edf2f7;padding:0 10px}.ref-nav .ref-search{transform:none;font-size:20px}
}
@media(max-width:620px){
  .ref-shell{max-width:calc(100% - 20px)}.ref-slogan{font-size:11px}.ref-lang{font-size:11px}.ref-logo{width:215px}.ref-logo img{width:215px}
  #ic-wa-wrap{right:15px!important;bottom:15px!important}
}

/* 2026-09-07: desktop density tuning for 1920x1080 at browser zoom 100%.
   The supplied visual reference was 1536px wide; allowing it to stretch to the
   full 1920px viewport made the entire homepage look about one zoom step too large.
   On wide desktop displays, keep the page at ~92% of the viewport while preserving
   the original tablet/mobile behaviour. */
@media (min-width:1600px){
  .ref-topbar{height:34px;font-size:11px}
  .ref-topbar .ref-shell{gap:24px}
  .ref-contact{gap:25px}
  .ref-lineicon{font-size:12px;margin-right:6px}

  .ref-header{height:75px}
  .ref-header-inner{gap:24px}
  .ref-logo{width:262px;height:62px}
  .ref-logo img{width:262px;height:62px}
  .ref-nav{gap:3px}
  .ref-nav a{padding:0 15px;font-size:13px}
  .ref-nav .ref-search{font-size:25px;padding-left:18px}

  .ref-home-main{width:92%;max-width:1766px;margin:0 auto}
  #ic-wa-wrap{right:24px!important;bottom:16px!important;transform:scale(.94);transform-origin:right bottom}
}

@media (min-width:1900px){
  /* Keep the 1920px experience consistently compact even on slightly wider screens. */
  .ref-home-main{max-width:1766px}
}

/* 2026-09-07: two-slide homepage hero carousel. */
.ref-hero-section{aspect-ratio:1536/336;background:#0b3158}
.ref-hero-slides{position:absolute;inset:0;overflow:hidden}
.ref-hero-slide{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover;opacity:0;transition:opacity .85s ease-in-out;display:block!important;margin:0!important;padding:0!important;pointer-events:none}
.ref-hero-slide.active{opacity:1;z-index:1}
.ref-hero-section .ref-hotspot{z-index:5}
.ref-hero-dots{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);z-index:7;display:flex;gap:10px;line-height:1}
.ref-hero-dot{width:10px;height:10px;border:0;border-radius:50%;padding:0;background:rgba(255,255,255,.46);box-shadow:0 0 0 1px rgba(0,0,0,.08);cursor:pointer;transition:background .2s ease,transform .2s ease}
.ref-hero-dot:hover{background:rgba(255,255,255,.78)}
.ref-hero-dot.active{background:#fff;transform:scale(1.08)}
@media (prefers-reduced-motion:reduce){.ref-hero-slide{transition:none}}

/* Match the content-to-footer spacing used on the inner pages. */
.ref-home-main{padding-bottom:64px}
