:root{--brand-accent:#b2d700}
body .header,body .footer,body .contact-banner{--lime:#d4fb03;--green:#86fb03;--ink:#1c272d;--ease:cubic-bezier(.16,1,.3,1);font-family:Outfit,Anuphan,sans-serif;font-size:16px;font-weight:400;line-height:normal;letter-spacing:normal;font-synthesis:none;text-transform:none}
body :is(.header,.footer,.contact-banner) *,body :is(.header,.footer,.contact-banner) *::before,body :is(.header,.footer,.contact-banner) *::after{box-sizing:border-box}
body :is(.header,.footer,.contact-banner) :is(h2,p){margin:0;font-weight:400}
body :where(.header,.footer,.contact-banner) a{color:inherit;text-decoration:none;letter-spacing:inherit}
body :where(.header,.footer,.contact-banner) button{border:0;background:none;color:inherit;cursor:pointer;font:inherit;padding:0}
body :is(.header,.footer,.contact-banner) :is(a,button):focus-visible{outline:2px solid var(--brand-accent);outline-offset:5px}
body .header{color:#1c272d}
body .header [hidden]{display:none!important}
body .button{display:inline-flex;align-items:center;justify-content:center;gap:13px;min-height:52px;padding:0 30px;border-radius:40px;background:var(--lime);color:#121919;font-size:16px;white-space:nowrap;transition:background .25s,transform .25s}
body .button:hover{background:#b8ef00;transform:translateY(-2px)}
body .button.small{min-height:39px;padding:0 24px;font-size:14px}
body .button.outline{background:transparent;border:2px solid white;color:white;min-width:209px}
body .button.outline:hover{background:#ffffff18}
body .button.dark{background:var(--ink);color:#fff}
body .button.dark:hover{background:#354249}
body .header{position:fixed;top:18px;left:24px;right:24px;min-height:49px;z-index:60;display:flex;align-items:center;gap:30px;padding:5px 6px 5px 20px;border-radius:40px;background:#ffffffcf;backdrop-filter:blur(18px);transition:box-shadow .3s,background .3s}
body .header.scrolled{background:#ffffffec;box-shadow:0 5px 26px #1c272d0d}
body .brand{width:148px;flex-shrink:0}
body .desktop-nav{display:flex;gap:25px;align-items:center;font-size:14px;color:#14191d}
body .desktop-nav a{position:relative;padding:7px 0}
body .desktop-nav a:after{content:'';position:absolute;bottom:2px;height:2px;background:var(--ink);left:0;right:0;transform:scaleX(0);transform-origin:left;transition:transform .25s}
body .desktop-nav a:hover:after{transform:scaleX(1)}
body .header-cta{margin-left:auto}
body .menu-toggle{display:none;width:38px;height:38px;align-items:center;justify-content:center;flex-direction:column;gap:5px}
body .menu-toggle span{width:20px;height:1.5px;background:var(--ink)}
body .mobile-nav{position:absolute;top:60px;left:0;right:0;background:#fffffff7;border-radius:22px;padding:22px;box-shadow:0 12px 30px #0001}
body .mobile-nav a{display:block;padding:12px;border-bottom:1px solid #ddd}
body .contact-banner{padding:55px 4%;background:linear-gradient(130deg,var(--lime),var(--green));display:flex;justify-content:space-between;align-items:center;gap:30px}
body .contact-banner>p{font-size:clamp(35px,4vw,62px);letter-spacing:-.03em;line-height:1.06;font-weight:300}
body .contact-banner>div{display:flex;flex-direction:column;align-items:flex-end;gap:20px}
body .contact-banner>div>span{font-family:Anuphan,sans-serif;font-size:15px}
body .contact-banner:has(> .consultation-banner-copy) {
  min-height: calc(110px + max(52px, clamp(35px, 4vw, 62px) * 1.06));
  padding-block: 24px;
  color: var(--ink);
}
body .contact-banner > .consultation-banner-copy {
  display: block;
  min-width: 0;
}
body .contact-banner .consultation-banner-copy .quiet-label {
  margin: 0 0 6px;
  font: 400 11px/1.6 Outfit, Anuphan, sans-serif;
  letter-spacing: .12em;
  color: #6b767b;
}
body .contact-banner .consultation-banner-copy h2 {
  font: 400 clamp(24px, 3.15vw, 43px)/1.3 Anuphan, sans-serif;
  letter-spacing: -.025em;
}
body .contact-banner .consultation-banner-copy > p:last-child {
  margin-top: 4px;
  font: 400 15px/1.65 Anuphan, sans-serif;
}
body .footer{background:var(--ink);color:#f2f5f3;padding:70px 4% 24px}
body .footer-grid{display:grid;grid-template-columns:1.5fr .8fr .8fr 1.15fr;gap:55px;padding-bottom:70px}
body .footer-brand img{width:180px;margin-bottom:26px}
body .footer-brand p{font-family:Anuphan,sans-serif;font-size:14px;line-height:1.8;color:inherit;margin-bottom:22px}
body .footer-consult{display:inline-flex!important;gap:40px;color:var(--lime)}
body .footer-grid h2{font-size:14px;margin-bottom:25px;color:var(--lime)}
body .footer-grid>div>a{display:block;font-size:14px;margin-bottom:14px}
body .footer-grid>div>a:hover{color:var(--lime)}
body .footer-contact p,body .footer-contact address{font-family:Anuphan,sans-serif;font-size:13px;line-height:1.8;font-style:normal;margin-bottom:13px;color:inherit}
body .footer-bottom{border-top:1px solid #ffffff26;padding-top:25px;display:flex;gap:30px;align-items:center;font-size:12px;color:#bac4c3}
body .footer-bottom span{margin-right:auto}
@media(min-width:1650px){body .header{max-width:1600px;margin:auto}
}
@media(max-width:1100px){body .header{gap:20px;left:16px;right:16px}
body .brand{width:135px}
body .desktop-nav{gap:16px;font-size:12px}
body .button.small{padding:0 17px}
body .footer-grid{gap:28px;grid-template-columns:1.25fr .7fr .7fr 1.2fr}
body .contact-banner>div>span{max-width:270px;text-align:right}
}
@media(max-width:800px){body .desktop-nav{display:none}
body .header{top:14px;min-height:50px}
body .menu-toggle{display:flex}
body .header-cta{font-size:12px!important}
body .footer-grid{grid-template-columns:1.2fr 1fr;gap:40px}
body .contact-banner{flex-direction:column;align-items:flex-start;padding:45px 6%}
body .contact-banner:has(> .consultation-banner-copy){min-height:0;gap:16px}
body .contact-banner>div{align-items:flex-start}
body .contact-banner>div>span{max-width:none;text-align:left}
body .footer{padding:55px 6% 25px}
body .footer-bottom{flex-wrap:wrap;gap:18px}
body .footer-bottom span{width:100%}
}
@media(max-width:480px){body .header{left:12px;right:12px;padding-left:14px;gap:6px}
body .brand{width:112px}
body .header-cta{min-height:35px!important;padding:0 12px!important;font-size:11px!important}
body .menu-toggle{width:32px}
body .contact-banner>p{font-size:45px}
body .footer-grid{gap:35px 18px;grid-template-columns:1fr 1fr}
body .footer-brand,body .footer-contact{grid-column:1/-1}
body .footer-grid>div>a{font-size:13px}
body .footer-brand img{width:150px}
body .footer-grid{padding-bottom:35px}
body .contact-banner>div>span{font-size:14px}
}
body .footer-grid>div{min-width:0}
body .header,body .header.scrolled{background:rgb(255 255 255 / 80%)}
body .brand-logo{display:block;width:100%;height:auto;overflow:visible}
body .brand-logo .brand-mark{transform-box:fill-box;transform-origin:center;transition:transform .6s var(--ease)}
body .brand:is(:hover,:focus-visible) .brand-mark{transform:rotate(90deg) scale(1.05)}
body .button.calculator-button.orbit-button{--disc:57px;min-height:var(--disc)}
body .footer-grid{grid-template-columns:1.6fr .8fr .8fr 1.2fr .65fr;gap:clamp(20px,3vw,48px)}
body .footer-brand p{max-width:330px}
@media(max-width:1000px) and (min-width:801px){body .footer-grid{grid-template-columns:1.4fr .8fr .8fr;gap:36px 28px}
body .footer-brand{grid-row:span 2}
}
@media(max-width:800px){body .footer-grid{grid-template-columns:1.2fr 1fr;gap:36px 28px}
body .footer-brand{grid-column:1 / -1}
body .footer-brand p{max-width:530px}
}
@media(max-width:480px){body .footer-grid{gap:30px 22px}
}
body .icon-sprite{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
body .icon{display:block;width:24px;height:24px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
body .icon-left{transform:rotate(180deg)}
body .icon-diagonal{transform:rotate(-45deg)}
body .icon-up{transform:rotate(-90deg)}
body .icon-down{transform:rotate(90deg)}
body [data-icon],body .footer-consult>span{display:inline-flex;align-items:center;justify-content:center;line-height:1}
body .footer-consult .icon,body .back-to-top .icon{width:18px;height:18px}
body .back-to-top{display:inline-flex;align-items:center;gap:7px}
body .button{transition:transform .6s var(--ease),background-color .65s var(--ease),box-shadow .65s var(--ease),color .65s var(--ease),border-color .65s var(--ease)}
body .button:hover{transform:translateY(-1px);box-shadow:0 10px 30px #a2c50020}
body .button:active{transform:translateY(0) scale(.975);transition-duration:.2s}
body .button.outline:hover{border-color:#fff9;background:#ffffff15;box-shadow:0 8px 25px #041b3820}
body .button.orbit-button{--disc:52px;--orbit-fill:var(--lime);--orbit-connector:#d4fb0355;position:relative;display:inline-flex;align-items:center;gap:0;padding:0 var(--disc) 0 0;overflow:hidden;border:0;border-radius:100px;background:var(--orbit-connector);isolation:isolate}
body .orbit-button .orbit-label{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;min-height:var(--disc);flex:1;padding:0 27px;background:var(--orbit-fill);border-radius:100px;transform:translateX(0);transition:transform .8s var(--ease)}
body .orbit-button .orbit-circle{position:absolute;top:0;z-index:2;display:grid;place-items:center;width:var(--disc);height:var(--disc);border-radius:50%;background:var(--orbit-fill);font-size:25px;line-height:1;transition:transform .8s var(--ease)}
body .orbit-button .circle-out{right:0;transform:translateX(0)}
body .orbit-button .circle-in{left:0;transform:translateX(-115%)}
body .orbit-button:hover,body .orbit-button:focus-visible{background:var(--orbit-connector);transform:translateY(-1px)}
body .orbit-button:is(:hover,:focus-visible) .orbit-label{transform:translateX(var(--disc))}
body .orbit-button:is(:hover,:focus-visible) .circle-out{transform:translateX(115%)}
body .orbit-button:is(:hover,:focus-visible) .circle-in{transform:translateX(0)}
body .button.small.orbit-button{--disc:39px;padding:0 var(--disc) 0 0}
body .button.small.orbit-button .orbit-label{padding:0 23px;font-size:14px}
body .button.small.orbit-button .orbit-circle{font-size:22px}
body .button.dark.orbit-button{--orbit-fill:var(--ink);--orbit-connector:#1c272d66;color:#fff}
body .orbit-circle>.icon{width:24px;height:24px;margin:0}
body .button.small .orbit-circle>.icon{width:21px;height:21px}
body .footer-consult span{transition:transform .7s var(--ease)}
body .footer-consult:hover span{transform:translateX(5px)}
body .footer a{transition:color .55s var(--ease),opacity .55s var(--ease)}
body .header{transition:box-shadow .65s var(--ease),background-color .65s var(--ease)}
body .desktop-nav a:after{transition:transform .65s var(--ease)}
body .mobile-nav{animation:popup-soft-in .55s var(--ease);transition:opacity .3s var(--ease),transform .4s var(--ease)}
body .mobile-nav.closing{opacity:0;transform:translateY(-8px);pointer-events:none}
body .menu-toggle span{transition:transform .65s var(--ease)}
body .menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(3.25px) rotate(45deg)}
body .menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-3.25px) rotate(-45deg)}
@keyframes popup-soft-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(max-width:480px){body .header-cta.orbit-button{--disc:35px;padding:0 var(--disc) 0 0!important}
body .header-cta.orbit-button .orbit-label{font-size:11px!important;padding:0 10px!important}
body .header-cta.orbit-button .orbit-circle{font-size:19px}
}
@media(max-width:480px){body .button.small.header-cta.orbit-button{--disc:35px}
body .button.small.header-cta.orbit-button .orbit-circle{font-size:19px}
}

body .desktop-nav a[aria-current=page]:after{transform:scaleX(1)}

/* One FAQ-style plus and rotation for both specification and question controls. */
body .hb-details summary>span,#series.product-series .product-spec-indicator{position:relative;display:inline-block;flex:0 0 20px;width:20px;height:20px;align-self:center;color:var(--brand-accent);font-size:0;transform:rotate(0);transition:transform .5s var(--ease)}
body .hb-details summary>span::before,body .hb-details summary>span::after,#series.product-series .product-spec-indicator::before,#series.product-series .product-spec-indicator::after{content:"";position:absolute;left:4px;right:4px;top:9px;height:1.5px;background:currentColor}
body .hb-details summary>span::after,#series.product-series .product-spec-indicator::after{transform:rotate(90deg)}
body .hb-details details[open] summary>span,#series.product-series .product-spec-trigger[aria-expanded=true] .product-spec-indicator{transform:rotate(45deg)}
@media(prefers-reduced-motion:reduce){body .hb-details summary>span,#series.product-series .product-spec-indicator{transition:none}}

/* Shared text CTA template, based on the product catalogue link. */
body a.inline-motion-link.text-action {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  width: fit-content;
  max-width: 100%;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid #cdd6cf;
  font: 400 14px/1.5 Outfit, Anuphan, sans-serif;
  text-decoration: none;
}
body a.inline-motion-link.text-action .icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}
body a.inline-motion-link.text-action > span[aria-hidden] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  line-height: 1;
  transition: transform .7s var(--ease);
}
body a.inline-motion-link.text-action:is(:hover, :focus-visible) {
  border-bottom-color: currentColor;
}
body a.inline-motion-link.text-action:is(:hover, :focus-visible) > span[aria-hidden] {
  transform: translateX(5px);
}
body a.back-to-top.inline-motion-link.text-action:is(:hover, :focus-visible) > span[aria-hidden] {
  transform: translateY(-5px);
}
body a.article-back.inline-motion-link.text-action:is(:hover, :focus-visible) > span[aria-hidden] {
  transform: translateX(-5px);
}
@media (prefers-reduced-motion: reduce) {
  body a.inline-motion-link.text-action > span[aria-hidden] { transition: none; }
}

/* Hero jump links and footer actions use the borderless variant. */
body a.inline-motion-link.text-action:is(.all-services, .footer-consult, .back-to-top) {
  border-bottom: 0;
}