/* Official DOOJA navigation for the technical guides.
   Scoped to the shared header/footer so article and calculator styles stay intact. */
.detail-header,.detail-footer{font-family:'Noto Sans KR',sans-serif;line-height:1.85;letter-spacing:-.02em;overflow-wrap:normal}
.detail-header *,.detail-header *::before,.detail-header *::after,.detail-footer *{box-sizing:border-box}
.detail-header{display:block;position:relative;z-index:120;width:100%;margin:0;padding:24px 0;background:#111f2d;color:#e9eceb;text-align:left;border:0}
.detail-header .container,.detail-footer .container{width:100%;max-width:1240px;margin:0 auto;padding:0 36px}
.detail-header .container{display:flex;align-items:center;justify-content:space-between;gap:20px}
.detail-header a,.detail-footer a{color:inherit;text-decoration:none}
.detail-header .nav-logo{display:block;flex-shrink:0;line-height:0}
.detail-header .nav-logo img{display:block;height:36px;width:auto;max-width:170px;object-fit:contain;border:0;margin:0}
.detail-header .site-nav{display:flex;align-items:center;flex-wrap:nowrap;gap:26px;margin:0;padding:0;font-size:14px;color:#e9eceb}
.detail-header .site-nav>a{white-space:nowrap;font-weight:500}
.detail-header .site-nav>a[aria-current]{color:#e0bd80;text-decoration:underline;text-underline-offset:6px}
.detail-header .contact-link{border:1px solid #697782;padding:7px 15px}
.detail-header .nav-group{position:relative;display:block;width:auto;margin:0;padding:0;border:0;border-radius:0;background:transparent;font-size:14px;font-weight:500;color:#e9eceb;white-space:nowrap}
.detail-header .nav-group>summary{display:flex;align-items:center;gap:9px;list-style:none;cursor:pointer;padding:10px 0;font:inherit;line-height:1.85}
.detail-header .nav-group>summary::-webkit-details-marker{display:none}
.detail-header .nav-group>summary::after{content:'';width:6px;height:6px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);margin-top:-4px;transition:transform .15s}
.detail-header .nav-group[open]>summary::after{transform:rotate(225deg);margin-top:3px}
.detail-header .nav-group[open]>summary,.detail-header .nav-group>summary:hover{color:#e0bd80}
.detail-header .nav-dropdown{position:absolute;z-index:130;top:calc(100% + 9px);left:-22px;min-width:220px;background:#172c3c;border:1px solid #425463;box-shadow:0 12px 28px #07121f26;padding:10px}
.detail-header .nav-dropdown a{display:block;padding:12px 14px;font-size:14px;font-weight:400;line-height:1.6;color:#edf2f3;border:0}
.detail-header .nav-dropdown a:hover,.detail-header .nav-dropdown a:focus-visible{background:#263f4f;color:#f0d4a5}
.detail-header .detail-nav-toggle{display:none}
.detail-header .nav-group>summary:focus-visible,.detail-header a:focus-visible,.detail-header .detail-nav-toggle:focus-visible{outline:2px solid #e0bd80;outline-offset:5px}
.detail-footer{display:block;margin:0;padding:40px 0 22px;background:#111f2d;color:#b9c5cd;font-size:14px;text-align:left}
.detail-footer .container{display:flex;justify-content:space-between;gap:24px}
.detail-footer strong{font-weight:500;color:#fff;font-size:16px}
.detail-footer a{display:block;text-align:right}
.detail-footer p{margin:10px 0 0;line-height:1.85}
.detail-footer .brand-aliases{color:#d5b989}
.detail-footer .business-details{font-size:13px;color:#aabac5;word-break:keep-all}
.detail-footer .solar-footer-wrap{display:block}
.detail-footer .solar-footer-nav{display:flex;justify-content:flex-start;flex-wrap:wrap;gap:12px 25px;width:100%;padding:24px 0 5px;border-top:1px solid #405462;margin:30px 0 0}
.detail-footer .solar-footer-nav a{display:inline-block;text-align:left;color:#cfdae0;font-size:13px;line-height:1.8}
.detail-footer a:hover,.detail-footer a:focus-visible{color:#e0bd80;text-decoration:underline;text-underline-offset:4px}
.detail-footer .guide-disclaimer{display:block;margin-top:24px;font-size:13px;color:#aabac5}
.detail-footer .copyright{text-align:center;font-family:Inter,sans-serif;font-size:12px;color:#8294a1;padding:20px 22px 0}
.skip-link{z-index:150}
@media(min-width:901px) and (max-width:1100px){
 .detail-header .site-nav{gap:19px;font-size:13px}
 .detail-header .nav-group{font-size:13px}
 .detail-header .container{gap:18px}
 .detail-header .nav-logo img{max-width:132px}
}
@media(max-width:900px){
 .detail-header{padding:18px 0}
 .detail-header .container{flex-wrap:wrap;gap:16px}
 .detail-header .site-nav{width:100%;align-items:stretch;gap:12px;flex-wrap:wrap}
 .detail-header.navigation-ready .container{flex-wrap:nowrap}
 .detail-header.navigation-ready .site-nav{display:none;position:absolute;top:100%;left:0;padding:18px 24px 26px;background:#111f2d;box-shadow:0 18px 24px #07121f26;flex-direction:column;max-height:calc(100dvh - 80px);overflow-y:auto;border-top:1px solid #435463}
 .detail-header.navigation-ready.menu-open .site-nav{display:flex}
 .detail-header .contact-link{display:block;text-align:center}
 .detail-header .site-nav>a{padding:12px 0;font-size:15px}
 .detail-header .detail-nav-toggle:not([hidden]){display:flex;align-items:center;gap:17px;min-height:44px;padding:9px 12px;color:#fff;background:transparent;border:1px solid #697782;border-radius:0;font:500 14px 'Noto Sans KR',sans-serif;cursor:pointer}
 .detail-header .detail-nav-toggle span{font-size:18px}
 .detail-header.menu-open .detail-nav-toggle span{transform:rotate(45deg)}
 .detail-header .nav-group{font-size:16px;width:100%}
 .detail-header .nav-group>summary{min-height:44px;justify-content:space-between;padding:10px 0}
 .detail-header .nav-group .nav-dropdown{position:static;box-shadow:none;border:0;border-left:1px solid #61727d;min-width:0;margin:3px 0 8px;padding:3px 7px;background:#172c3c}
}
@media(max-width:640px){
 .detail-header .container,.detail-footer .container{padding-left:22px;padding-right:22px}
 .detail-header .nav-logo img{height:32px}
 .detail-footer .container{display:block}
 .detail-footer a{text-align:left}
 .detail-footer .container>div:last-child{margin-top:22px}
 .detail-footer .solar-footer-nav{gap:12px 22px}
 .detail-footer .solar-footer-nav a{flex:0 1 calc(50% - 11px);word-break:keep-all}
}
@media print{.detail-header,.detail-footer{display:none!important}}
@media(prefers-reduced-motion:reduce){.detail-header *{transition:none}}
