/* Kitmitto Solar – main stylesheet */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:#0A0B1E;color:#F4F1E4;font-family:"Poppins",system-ui,sans-serif;font-weight:300;-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:#F5A83B;text-decoration:none}
a:hover{color:#FFC978}
[hidden]{display:none !important}
summary::-webkit-details-marker{display:none}
summary{list-style:none;cursor:pointer}
details[open] summary span{transform:rotate(45deg)}
summary span{transition:transform .25s ease;display:inline-block}
::selection{background:#F5A83B;color:#0A0B1E}
:focus-visible{outline:2px solid #F5A83B;outline-offset:3px}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:9999px;background:#F5A83B;color:#0A0B1E;font-family:Montserrat,sans-serif;font-weight:600;cursor:pointer;text-align:center;transition:background .25s ease,transform .25s ease,box-shadow .25s ease}
.btn:hover{background:#FFBC5C;color:#0A0B1E;transform:translateY(-2px);box-shadow:0 12px 30px rgba(245,168,59,.3)}
.btn:active{background:#D98E22;transform:none}
.btn[disabled]{opacity:.7;cursor:progress;transform:none}
.btn-nav{padding:12px 22px;font-size:14px;min-height:44px;white-space:nowrap}
.btn-lg{padding:15px 30px;font-size:15px;min-height:54px}
.btn-block{width:100%}

/* Form fields */
.field{display:flex;flex-direction:column;gap:6px;font-size:13px;color:#CBCDE6}
.field input{font-family:Poppins,sans-serif;font-size:15px;color:#F4F1E4;background:#0A0B1E;border:1px solid rgba(244,241,228,.24);border-radius:6px;padding:11px 12px;min-height:44px;outline:none;width:100%;transition:border-color .2s ease}
#consult-form input:focus,#consult-form select:focus,#consult-form textarea:focus{border-color:#F5A83B !important}
#consult-form .is-invalid{border-color:#FF7A82 !important}
::placeholder{color:#6F7399}

/* Responsive header */
@media (max-width:1099px){[data-desktop-nav]{display:none !important}[data-mobile-only]{display:flex !important}}
@media (max-width:559px){[data-wa-label]{display:none}}
@media (max-width:420px){.btn-nav{padding:10px 16px;font-size:13px}header img{height:48px !important}}

/* Preloader */
#preloader{display:none}
.js #preloader{display:flex;position:fixed;inset:0;z-index:5000;align-items:center;justify-content:center;overflow:hidden}
.pl-half{position:absolute;left:0;right:0;height:50.5%;background:radial-gradient(120% 120% at 50% 100%,#1B1E52 0%,#0A0B1E 70%);transition:transform 1s cubic-bezier(.77,0,.18,1)}
.pl-top{top:0}
.pl-bottom{bottom:0;background:radial-gradient(120% 120% at 50% 0%,#1B1E52 0%,#0A0B1E 70%)}
.pl-stage{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 24px;transition:opacity .45s ease,transform .7s cubic-bezier(.77,0,.18,1)}
.pl-sun{position:relative;width:200px;height:200px;display:flex;align-items:center;justify-content:center}
.pl-rays{position:absolute;inset:-70px;border-radius:50%;background:repeating-conic-gradient(from 0deg,rgba(245,168,59,.30) 0deg 2deg,rgba(245,168,59,0) 2deg 15deg);-webkit-mask:radial-gradient(circle,transparent 42%,#000 46%,transparent 70%);mask:radial-gradient(circle,transparent 42%,#000 46%,transparent 70%);animation:km-rays 22s linear infinite;opacity:.85}
.pl-sun::before{content:"";position:absolute;inset:-40px;border-radius:50%;background:radial-gradient(circle,rgba(245,168,59,.35),rgba(245,168,59,0) 65%);animation:km-glow 3.2s ease-in-out infinite}
.pl-ring{position:absolute;inset:0;width:100%;height:100%}
#pl-arc{transition:stroke-dashoffset .35s ease-out;filter:drop-shadow(0 0 6px rgba(245,168,59,.7))}
.pl-core{position:relative;width:150px;height:150px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;padding:18px;box-shadow:0 0 0 6px rgba(245,168,59,.12),0 20px 50px rgba(0,0,0,.5);animation:pl-breathe 2.6s ease-in-out infinite}
.pl-core img{width:100%;height:100%;object-fit:contain;display:block}
.pl-meta{margin-top:34px;font-family:Montserrat,sans-serif;font-weight:700;font-size:44px;line-height:1;color:#F4F1E4;font-variant-numeric:tabular-nums;letter-spacing:-1px}
.pl-unit{font-size:20px;color:#F5A83B;margin-left:3px}
.pl-line{margin:14px 0 0;font-family:Montserrat,sans-serif;font-size:14px;font-weight:500;letter-spacing:.04em;color:#A6A9C8;opacity:0;animation:pl-in .8s ease .3s forwards}
.pl-ar{margin-top:6px;font-size:16px;color:#CBCDE6;animation-delay:.55s}
#preloader.is-done .pl-stage{opacity:0;transform:scale(.92)}
#preloader.is-done .pl-top{transform:translateY(-100%)}
#preloader.is-done .pl-bottom{transform:translateY(100%)}
#preloader.is-done{pointer-events:none}
body.is-loading{overflow:hidden}
@keyframes pl-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}
@keyframes pl-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (max-width:480px){.pl-sun{width:160px;height:160px}.pl-core{width:120px;height:120px;padding:14px}.pl-meta{font-size:36px}}

/* Motion */
@keyframes km-spin { to { transform: rotate(360deg); } }
  @keyframes km-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
  @keyframes km-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
  @keyframes km-glow { 0%,100% { opacity: .3; transform: scale(1); } 50% { opacity: .62; transform: scale(1.09); } }
  @keyframes km-ring { 0% { box-shadow: 0 0 0 0 rgba(37,211,102,.5); } 70% { box-shadow: 0 0 0 18px rgba(37,211,102,0); } 100% { box-shadow: 0 0 0 0 rgba(37,211,102,0); } }
  @keyframes km-rays { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
  @keyframes km-drift-a { 0%,100% { transform: translate3d(0,0,0) scale(1); } 50% { transform: translate3d(6vw,4vh,0) scale(1.15); } }
  @keyframes km-drift-b { 0%,100% { transform: translate3d(0,0,0) scale(1.1); } 50% { transform: translate3d(-7vw,-5vh,0) scale(1); } }
  @keyframes km-rise { from { transform: translateY(12vh); opacity: 0; } 12% { opacity: .9; } 88% { opacity: .9; } to { transform: translateY(-112vh); opacity: 0; } }
  @keyframes km-sheen { 0% { transform: translateX(-120%); } 55%,100% { transform: translateX(220%); } }
  @keyframes km-ray { 0% { transform: translateX(-40%) rotate(12deg); opacity: 0; } 25% { opacity: .55; } 100% { transform: translateX(140%) rotate(12deg); opacity: 0; } }
  @keyframes km-drift { 0% { transform: translateY(20px) scale(.6); opacity: 0; } 15% { opacity: .9; } 100% { transform: translateY(-220px) scale(1.25); opacity: 0; } }
  @keyframes km-scan { 0% { background-position: 0 0; } 100% { background-position: 0 -240px; } }
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important}}

/* Hover states */
.hv-1:hover{background:rgba(27,42,140,.08) !important;color:#D51A1A !important}
.hv-2:hover{background:rgba(27,42,140,.08) !important;color:#D51A1A !important}
.hv-3:hover{background:rgba(27,42,140,.08) !important;color:#D51A1A !important}
.hv-4:hover{background:rgba(27,42,140,.08) !important;color:#D51A1A !important}
.hv-5:hover{background:rgba(27,42,140,.08) !important;color:#D51A1A !important}
.hv-6:hover{background:rgba(27,42,140,.08) !important;color:#D51A1A !important}
.hv-7:hover{color:#D51A1A !important}
.hv-8:hover{background:rgba(37,211,102,.2) !important;border-color:#25D366 !important;transform:translateY(-3px) !important;color:#7BF0AC !important}
.hv-9:hover{transform:translateY(-8px) !important;box-shadow:0 26px 54px rgba(0,0,0,.5) !important;border-color:rgba(74,224,138,.5) !important}
.hv-10:hover{transform:translateY(-8px) !important;box-shadow:0 30px 60px rgba(245,168,59,.18) !important}
.hv-11:hover{transform:translateY(-8px) !important;box-shadow:0 26px 54px rgba(0,0,0,.5) !important;border-color:rgba(226,64,74,.5) !important}
.hv-12:hover{transform:translateY(-6px) !important;border-color:#F5A83B !important}
.hv-13:hover{transform:translateY(-6px) !important;border-color:#F5A83B !important}
.hv-14:hover{transform:translateY(-6px) !important;border-color:#F5A83B !important}
.hv-15:hover{transform:translateY(-6px) !important;border-color:#F5A83B !important}
.hv-16:hover{border-color:#F5A83B !important}
.hv-17:hover{border-color:#F5A83B !important}
.hv-18:hover{border-color:#F5A83B !important}
.hv-19:hover{border-color:#F5A83B !important}
.hv-20:hover{color:#F5A83B !important}
.hv-21:hover{color:#4AE08A !important}
.hv-22:hover{color:#F5A83B !important}
.hv-23:hover{transform:translateY(-3px) !important;color:#04310F !important}
