/* Layout: centered, form-first hero on navy, then short supporting bands. One brand look (navy and safety orange), light only by choice. */
:root{--navy:#13233F;--navy-deep:#0B1830;--navy-2:#1C3055;--navy-line:#2A3E63;--orange:#F26A1B;--orange-hover:#FF7C33;--orange-ink:#B8430F;--orange-soft:#FF8A4C;--orange-tint:#FDE7D8;--orange-tint-ink:#8A3208;--light:#F2F4F7;--border:#D9DEE6;--input:#A3AEBD;--text:#3A4658;--heading:#13233F;--muted:#5B6678;--on-navy:#C3CCDA;--on-navy-muted:#93A0B5;--error:#B42318;--display:"Barlow Semi Condensed","Barlow",system-ui,sans-serif;--body:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;color-scheme:light;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--navy-deep);scroll-behavior:smooth;scroll-padding-top:calc(88px + env(safe-area-inset-top,0px));-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:var(--text);font-family:var(--body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--navy)}
img,svg{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;padding:12px 16px;border-radius:6px;background:var(--orange);color:var(--navy);font-weight:700;text-decoration:none}
.skip:focus{left:12px}
.wrap{width:100%;max-width:1160px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
@media(min-width:768px){.wrap{padding-left:max(40px,env(safe-area-inset-left,0px));padding-right:max(40px,env(safe-area-inset-right,0px))}}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:0 20px;border:1.5px solid transparent;border-radius:6px;font-family:var(--body);font-size:17px;font-weight:700;line-height:1.2;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .15s ease,border-color .15s ease}
.btn svg{flex-shrink:0}
.btn-lg{min-height:56px;font-size:18px}
.btn-primary{background:var(--orange);color:var(--navy)}
.btn-primary:hover{background:var(--orange-hover)}
.btn-ghost{border-color:#4A5E82;background:transparent;color:#fff}
.btn-ghost:hover{border-color:#fff}
.btn-line{border-color:var(--navy);background:#fff;color:var(--navy)}
.btn-line:hover{background:var(--light)}

.site-header{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:var(--navy);border-bottom:1px solid var(--navy-line)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:66px}
.brand{display:flex;align-items:center;gap:9px;min-width:0;color:#fff;text-decoration:none}
.mark-tile{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:44px;height:44px;border-radius:9px;background:#fff}
.mark{display:block;width:76%;height:auto;margin-top:-2%;color:var(--navy)}
.brand-name{max-width:8.4em;font-family:var(--display);font-size:15px;font-weight:700;line-height:1.05;letter-spacing:.03em;text-transform:uppercase}
.header-cta{display:flex;gap:8px;flex-shrink:0}
.header-cta .btn{min-height:44px;padding:0 13px;font-size:16px}
.long{display:none}
@media(max-width:359px){.brand-name{display:none}}
@media(min-width:720px){
.site-header .wrap{min-height:74px}
.brand{gap:12px}
.brand .mark-tile{width:52px;height:52px;border-radius:10px}
.brand-name{max-width:none;font-size:22px}
.header-cta{gap:10px}
.header-cta .btn{padding:0 18px}
.long{display:inline}
.short{display:none}
}

.hero{background:var(--navy);color:#fff}
.hero-inner{display:flex;flex-direction:column;align-items:center;padding-top:18px;padding-bottom:40px;text-align:center}
@media(min-width:900px){.hero-inner{padding-top:30px;padding-bottom:48px}}
.hero h1{max-width:16em;margin:0;font-family:var(--display);font-size:clamp(32px,4.2vw,50px);font-weight:700;line-height:1.04;letter-spacing:-.01em;text-wrap:balance}
.hero-lede{max-width:34em;margin:10px 0 0;color:var(--on-navy);font-size:clamp(16px,1.5vw,19px);line-height:1.45;text-wrap:balance}

.quote-card{width:100%;max-width:760px;margin-top:16px;padding:18px 18px 18px;border-top:5px solid var(--orange);border-radius:10px;background:#fff;color:var(--text);text-align:left;box-shadow:0 24px 60px rgba(4,10,22,.45)}
@media(min-width:600px){.quote-card{margin-top:24px;padding:24px 28px 22px}}
.quote-card h2{margin:0;color:var(--heading);font-family:var(--display);font-size:26px;font-weight:700;line-height:1.1}
@media(min-width:600px){.quote-card h2{font-size:28px}}
.fields{display:grid;gap:12px;margin-top:12px}
@media(min-width:360px){.fields{grid-template-columns:repeat(2,minmax(0,1fr))}.field-full{grid-column:1/-1}}
@media(min-width:600px){.fields{gap:14px 16px;margin-top:14px}.field-full{grid-column:auto}}
.field{display:flex;flex-direction:column;gap:6px;color:var(--heading);font-size:15px;font-weight:600;line-height:1.3}
.field input{width:100%;height:50px;padding:0 14px;border:1px solid var(--input);border-radius:6px;background:#fff;color:var(--heading);font:inherit;font-size:17px;font-weight:400}
.field input:focus{border-color:var(--navy);outline:3px solid rgba(242,106,27,.45);outline-offset:0}
.was-validated .field input:invalid{border-color:var(--error);box-shadow:inset 0 0 0 1px var(--error)}
.actions{display:grid;gap:10px;margin-top:18px}
@media(min-width:800px){.actions{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}}
.actions .btn{width:100%}
.form-status{margin:12px 0 0;padding:10px 12px;border-radius:6px;background:var(--orange-tint);color:var(--orange-tint-ink);font-size:15px;font-weight:600;line-height:1.45}
.form-status:empty{display:none}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.done{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:6px 0}
.done:focus{outline:none}
.done h2{margin:0;color:var(--heading);font-family:var(--display);font-size:28px;line-height:1.1}
.done p{margin:0;font-size:17px}
.btn:disabled{opacity:.6;cursor:default}
.fine a{color:inherit}
.fine{margin:12px 0 0;color:var(--muted);font-size:14px;line-height:1.5}
.proof{display:grid;gap:10px;margin:22px 0 0;padding:0;list-style:none;text-align:left}
@media(min-width:900px){.proof{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 32px}}
.proof li{display:flex;align-items:center;gap:10px;color:#E3E8F0;font-size:16px;font-weight:600}
.proof svg{flex-shrink:0}

.section{padding:56px 0}
@media(min-width:960px){.section{padding:88px 0}}
.bg-light{background:var(--light)}
.bg-navy{background:var(--navy);color:#fff}
.h2{margin:0;color:var(--heading);font-family:var(--display);font-size:clamp(30px,3.6vw,44px);font-weight:700;line-height:1.06;letter-spacing:-.005em;text-wrap:balance}
.bg-navy .h2{color:#fff}
.lede{max-width:36em;margin:12px 0 0;font-size:clamp(16px,1.4vw,18px)}

.system{display:grid;gap:32px}
@media(min-width:960px){
.system{grid-template-columns:400px minmax(0,1fr);grid-template-areas:"fig head" "fig list";column-gap:72px;row-gap:24px;align-items:start}
.system-head{grid-area:head;align-self:end}
.diagram{grid-area:fig;align-self:center}
.system-list{grid-area:list}
}
.diagram{width:min(100%,400px);margin:0 auto}
@media(min-width:960px){.diagram{margin:0}}
.diagram-art{position:relative;aspect-ratio:1020/1515}
.diagram-art img{width:100%;height:100%}
.flow{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.marker{position:absolute;display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--orange);color:var(--navy);font-size:14px;font-weight:700;box-shadow:0 0 0 3px var(--navy);transform:translate(-50%,-50%)}
@keyframes nhcVapor{0%{transform:translateY(0);opacity:0}25%{opacity:1}100%{transform:translateY(-70px);opacity:0}}
@keyframes nhcDuct{0%{transform:translateY(0);opacity:0}10%{opacity:1}85%{opacity:1}100%{transform:translateY(-560px);opacity:0}}
@keyframes nhcPlume{0%{transform:translateY(0);opacity:0}30%{opacity:1}100%{transform:translateY(-70px);opacity:0}}
@keyframes nhcDrip{0%{transform:translateY(0);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translateY(54px);opacity:0}}
.vapor{animation:nhcVapor 3.2s ease-out infinite both}
.duct-flow{animation:nhcDuct 3s linear infinite both}
.plume{animation:nhcPlume 2.6s ease-out infinite both}
.drip{animation:nhcDrip 2.8s ease-in infinite both}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.vapor,.duct-flow,.plume,.drip{animation:none;opacity:0}}
.parts{margin:0;padding:0;list-style:none;border-top:1px solid var(--border)}
.parts li{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--border)}
.num{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--orange);color:var(--navy);font-size:16px;font-weight:700}
.parts h3{margin:0;color:var(--heading);font-family:var(--display);font-size:21px;font-weight:700;line-height:1.2}
.parts p{margin:2px 0 0;font-size:16px;line-height:1.5}
.note{margin:14px 0 0;color:var(--muted);font-size:15px}

.ticks{display:grid;margin:24px 0 0;padding:0;list-style:none;border-top:1px solid var(--border)}
@media(min-width:800px){.ticks{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px}}
.ticks li{display:flex;align-items:flex-start;gap:12px;padding:14px 0;border-bottom:1px solid var(--border);color:var(--heading);font-size:17px;line-height:1.5}
.ticks svg{flex-shrink:0;margin-top:2px}

.faqs{display:grid;gap:12px;margin-top:24px}
@media(min-width:960px){.faqs{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 24px;align-items:start}}
.faqs details{padding:0 20px;border:1px solid var(--border);border-left:4px solid var(--orange);border-radius:0 8px 8px 0;background:#fff}
.faqs summary{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;color:var(--heading);font-size:18px;font-weight:700;line-height:1.35;list-style:none;cursor:pointer}
.faqs summary::-webkit-details-marker{display:none}
.faqs summary svg{flex-shrink:0;transition:transform .2s ease}
.faqs details[open] summary svg{transform:rotate(180deg)}
.faqs p{margin:0;padding:0 0 16px}

.services{display:grid;gap:16px;margin:28px 0 0;padding:0;list-style:none}
@media(min-width:900px){.services{grid-template-columns:repeat(3,minmax(0,1fr))}}
.services li{padding:24px;border:1px solid var(--border);border-radius:12px;background:#fff}
.services h3{margin:0;color:var(--heading);font-family:var(--display);font-size:24px;font-weight:700;line-height:1.2}
.services p{margin:8px 0 0;font-size:16px;line-height:1.55}
.services-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.more{display:inline-flex;align-items:center;min-height:44px;margin-top:6px;color:var(--orange-ink);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.note a{color:var(--orange-ink);font-weight:700}
.crumbs{margin:0 0 8px;color:var(--on-navy-muted);font-size:14px}
.crumbs a{color:var(--on-navy);text-decoration:underline;text-underline-offset:3px}
.prose{max-width:44em}
.prose p{margin:14px 0 0}
.steps{display:grid;gap:0;margin:24px 0 0;padding:0;list-style:none;border-top:1px solid var(--border)}
@media(min-width:900px){.steps{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px}}
.steps li{display:flex;gap:14px;padding:16px 0;border-bottom:1px solid var(--border)}
.steps h3{margin:0;color:var(--heading);font-family:var(--display);font-size:21px;font-weight:700;line-height:1.2}
.steps p{margin:2px 0 0;font-size:16px;line-height:1.5}
.freq{width:100%;max-width:760px;margin-top:24px;border-collapse:collapse;font-size:16px}
.freq th,.freq td{padding:12px 14px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}
.freq th{color:var(--heading);font-weight:700;background:var(--light)}
.freq td:first-child{color:var(--heading);font-weight:700;white-space:nowrap}
.related{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.footer-links{display:flex;flex-wrap:wrap;gap:0 20px}
.footer-links a{display:inline-flex;align-items:center;min-height:44px;color:var(--on-navy);text-decoration:none}
.footer-links a:hover{text-decoration:underline}
.regions{display:grid;margin:24px 0 0;padding:0;list-style:none}
@media(min-width:900px){.regions{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:32px}}
.regions li{display:flex;align-items:flex-start;gap:14px;padding:16px 0;border-top:1px solid var(--navy-line)}
.state{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:46px;height:46px;border-radius:8px;background:var(--navy-2);color:var(--orange-soft);font-family:var(--display);font-size:18px;font-weight:700}
.regions h3{margin:0;color:#fff;font-family:var(--display);font-size:22px;font-weight:700;line-height:1.2}
.regions p{margin:4px 0 0;color:var(--on-navy);font-size:16px;line-height:1.5}
.cta-row{display:flex;flex-direction:column;gap:12px;margin-top:32px}
@media(min-width:600px){.cta-row{flex-direction:row}}

.footer{padding-block:32px 28px;background:var(--navy-deep);color:var(--on-navy);font-size:15px}
.footer-inner{display:flex;flex-direction:column;gap:16px}
@media(min-width:900px){.footer-inner{flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between}}
.footer-brand{display:flex;align-items:center;gap:12px}
.footer-brand .mark-tile{width:44px;height:44px}
.footer-brand strong{display:block;color:#fff;font-family:var(--display);font-size:19px;letter-spacing:.03em;line-height:1.1;text-transform:uppercase}
.footer-brand div span{display:block;margin-top:2px;font-size:14px}
.footer-contact{display:flex;flex-wrap:wrap;gap:0 24px;font-weight:600}
.footer-contact a{display:inline-flex;align-items:center;min-height:44px}
.footer-contact a{color:#fff;text-decoration:none}
.footer-contact a:hover{text-decoration:underline}
.copy{flex-basis:100%;margin:0;padding-top:14px;border-top:1px solid #22324F;color:var(--on-navy-muted);font-size:14px}

.ck{display:inline-block;flex-shrink:0;width:22px;height:22px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='%23F26A1B'/%3E%3Cpath d='M7.5 12.5l3 3 6-6.5' fill='none' stroke='%2313233F' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.ticks .ck{margin-top:2px}
.proof .ck{width:20px;height:20px}
.chev{display:inline-block;flex-shrink:0;width:18px;height:18px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%23B8430F' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .2s ease}
.faqs details[open] summary .chev{transform:rotate(180deg)}
.ph{display:inline-block;flex-shrink:0;width:18px;height:18px;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.btn-ghost .ph{background-color:#F26A1B}

/* NHCL lockup: big initials, full name underneath as real text */
.brand-name{max-width:none;font-size:0;line-height:1;letter-spacing:.14em;color:var(--orange)}
.brand-name::before{content:"NHCL";display:block;color:#fff;font-size:27px;font-weight:700;letter-spacing:.02em;line-height:1}
@media(min-width:720px){.brand-name{font-size:11px;font-weight:600}.brand-name::before{font-size:32px;margin-bottom:4px}}
.footer-brand strong{color:var(--orange);font-family:var(--body);font-size:11px;font-weight:600;letter-spacing:.14em}
.footer-brand strong::before{content:"NHCL";display:block;margin-bottom:4px;color:#fff;font-family:var(--display);font-size:28px;font-weight:700;letter-spacing:.02em;line-height:1}