:root {
  --ink: #121a2d;
  --navy: #0f2c5c;
  --blue: #154d9a;
  --sun: #f8b51b;
  --copper: #d85d20;
  --teal: #147d83;
  --paper: #f6f8fb;
  --white: #ffffff;
  --muted: #5d6677;
  --line: #d8dee8;
  --focus: #52b9d0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--white);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--white); color: var(--ink); line-height: 1.55; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; }
img { display: block; max-width: 100%; }

.skip-link {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 100;
  padding: 10px 14px;
  background: var(--white);
  transform: translateY(-140%);
}
.skip-link:focus { transform: translateY(0); }

.preview-banner {
  padding: 7px 20px;
  background: var(--sun);
  color: #1e2430;
  text-align: center;
  font-size: 13px;
  font-weight: 800;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  min-height: 76px;
  display: grid;
  grid-template-columns: minmax(190px, 280px) 1fr auto;
  align-items: center;
  gap: 24px;
  padding: 12px clamp(18px, 4vw, 64px);
  background: rgba(255, 255, 255, 0.96);
  border-bottom: 1px solid var(--line);
}
.brand { display: grid; width: fit-content; text-decoration: none; line-height: 1; text-transform: uppercase; }
.brand strong { color: var(--navy); font-size: 25px; }
.brand span { margin-top: 4px; color: var(--muted); font-size: 10px; font-weight: 900; }
.primary-nav { display: flex; justify-content: center; gap: 24px; }
.primary-nav a { text-decoration: none; font-weight: 700; font-size: 15px; }
.primary-nav a:hover { color: var(--copper); }
.header-call { padding: 11px 15px; background: var(--ink); color: var(--white); text-decoration: none; font-weight: 800; }
.menu-button { display: none; border: 1px solid var(--ink); background: var(--white); padding: 9px 12px; font-weight: 800; }

.hero {
  position: relative;
  min-height: min(760px, calc(100vh - 80px));
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--ink);
}
.hero-media, .hero-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-media { object-fit: cover; object-position: center; }
.hero-shade { background: rgba(8, 18, 38, 0.66); }
.hero-content {
  position: relative;
  z-index: 2;
  width: min(760px, 88vw);
  margin-left: clamp(20px, 8vw, 140px);
  padding: 64px 0 100px;
  color: var(--white);
}
.eyebrow { margin: 0 0 12px; color: var(--copper); font-size: 13px; font-weight: 900; text-transform: uppercase; }
.hero .eyebrow { color: var(--sun); }
h1, h2, h3, p { letter-spacing: 0; }
h1 { margin: 0; max-width: 680px; font-size: 64px; line-height: 0.98; }
.hero-tagline { margin: 22px 0 10px; font-size: 32px; font-weight: 800; }
.hero-copy { max-width: 650px; margin: 0; font-size: 19px; color: #eaf0f8; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.next-section { position: absolute; z-index: 2; left: clamp(20px, 8vw, 140px); bottom: 26px; color: var(--white); font-weight: 800; }

.button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 18px; border: 2px solid transparent; border-radius: 4px; text-decoration: none; font-weight: 900; cursor: pointer; }
.button-primary { background: var(--sun); color: var(--ink); }
.button-primary:hover { background: #ffd35d; }
.button-secondary { border-color: var(--white); color: var(--white); background: transparent; }
.button-light { background: var(--white); color: var(--ink); }
.button-dark { background: var(--ink); color: var(--white); }

.section { padding: clamp(64px, 8vw, 112px) clamp(20px, 6vw, 96px); }
.section-heading { max-width: 740px; margin-bottom: 38px; }
h2 { margin: 0 0 14px; font-size: 40px; line-height: 1.04; }
h3 { margin: 0 0 12px; font-size: 24px; line-height: 1.15; }
.section-heading > p:last-child, .approach-copy > p:last-child, .commercial-copy > p { color: var(--muted); font-size: 18px; }

.service-section { background: var(--paper); }
.service-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.service-card { min-height: 310px; display: flex; flex-direction: column; padding: 26px; background: var(--white); border: 1px solid var(--line); border-top: 5px solid var(--teal); border-radius: 6px; }
.service-card.featured { border-top-color: var(--copper); }
.service-number { margin-bottom: 28px; color: var(--teal); font-weight: 900; }
.service-card p { color: var(--muted); }
.text-action { margin-top: auto; padding: 12px 0 0; border: 0; background: transparent; color: var(--blue); text-align: left; font-weight: 900; cursor: pointer; }

.approach-section { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: clamp(42px, 8vw, 120px); align-items: center; }
.process-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.process-list li { display: grid; grid-template-columns: 120px 1fr; gap: 24px; padding: 22px 0; border-bottom: 1px solid var(--line); }
.process-list strong { color: var(--copper); }
.process-list span { color: var(--muted); }

.maintenance-section { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 64px; background: var(--teal); color: var(--white); }
.maintenance-section .eyebrow { color: var(--white); }
.maintenance-copy p { max-width: 680px; }
.maintenance-facts { border-top: 1px solid rgba(255,255,255,0.45); }
.maintenance-facts p { display: grid; gap: 4px; padding: 18px 0; margin: 0; border-bottom: 1px solid rgba(255,255,255,0.45); }
.maintenance-facts span { color: var(--white); }

.commercial-section { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: clamp(40px, 8vw, 120px); align-items: stretch; }
.commercial-visual { min-height: 360px; display: flex; flex-direction: column; justify-content: flex-end; padding: 34px; background: var(--sun); border-left: 12px solid var(--copper); }
.commercial-visual span { font-weight: 900; text-transform: uppercase; }
.commercial-visual strong { max-width: 440px; margin-top: 12px; font-size: 40px; line-height: 1.05; }
.commercial-copy { align-self: center; }

.contact-section { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: clamp(40px, 7vw, 100px); background: var(--paper); }
.phone-link { display: inline-block; margin-top: 24px; color: var(--blue); font-size: 25px; font-weight: 900; }
.lead-form { display: grid; gap: 16px; padding: 28px; background: var(--white); border: 1px solid var(--line); border-radius: 6px; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
label { display: grid; gap: 7px; font-weight: 800; }
input, select, textarea { width: 100%; border: 1px solid #aab3c1; border-radius: 4px; padding: 12px; background: var(--white); color: var(--ink); }
textarea { resize: vertical; }
input:focus, select:focus, textarea:focus, button:focus-visible, a:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.form-status { min-height: 24px; margin: 0; color: var(--teal); font-weight: 800; }

.site-footer { display: grid; grid-template-columns: minmax(180px, 300px) auto auto 1fr; gap: 28px; align-items: center; padding: 34px clamp(20px, 6vw, 96px) 86px; background: var(--ink); color: var(--white); }
.footer-brand { display: grid; line-height: 1; text-transform: uppercase; }
.footer-brand strong { font-size: 25px; }
.footer-brand span { margin-top: 5px; color: var(--sun); font-size: 10px; font-weight: 900; }
.site-footer a { color: var(--sun); font-weight: 900; }
.footer-note { color: #b8c1cf; font-size: 13px; }
.mobile-actions { display: none; }

@media (max-width: 1040px) {
  html:has(.primary-nav.open) { overflow: hidden; }
  .site-header { grid-template-columns: 1fr auto auto; }
  .menu-button { display: inline-flex; }
  .primary-nav { position: absolute; top: 100%; left: 0; right: 0; display: none; flex-direction: column; justify-content: flex-start; gap: 0; max-height: calc(100vh - 100%); max-height: calc(100dvh - 100%); overflow-y: auto; overscroll-behavior-y: contain; background: var(--white); border-bottom: 1px solid var(--line); }
  .primary-nav.open { display: flex; }
  .primary-nav a { flex-shrink: 0; padding: 14px 22px; border-top: 1px solid var(--line); }
  .service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .preview-banner { font-size: 12px; }
  .site-header { min-height: 64px; padding: 9px 16px; gap: 10px; }
  .brand strong { font-size: 21px; }
  .header-call { display: none; }
  .hero { min-height: 680px; align-items: flex-end; }
  .hero-media { object-position: 48% center; }
  .hero-content { width: auto; margin: 0 20px; padding: 110px 0 100px; }
  h1 { font-size: 36px; }
  .next-section { left: 20px; }
  .service-grid { grid-template-columns: 1fr; }
  .service-card { min-height: 260px; }
  .approach-section, .maintenance-section, .commercial-section, .contact-section { grid-template-columns: 1fr; }
  .process-list li { grid-template-columns: 92px 1fr; gap: 14px; }
  .field-row { grid-template-columns: 1fr; }
  .site-footer { grid-template-columns: 1fr; gap: 10px; padding-bottom: 96px; }
  .mobile-actions { position: fixed; z-index: 60; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: 1fr 1.5fr; background: var(--white); border-top: 1px solid var(--line); }
  .mobile-actions a { min-height: 58px; display: flex; align-items: center; justify-content: center; text-decoration: none; font-weight: 900; }
  .mobile-actions a:first-child { background: var(--ink); color: var(--white); }
  .mobile-actions a:last-child { background: var(--sun); color: var(--ink); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}
/* Shared detail-page layout and fail-closed preview controls. */
.eyebrow, .process-list strong { color:#a74213; }
html { scroll-padding-top:110px; }
.visual-caption { position:absolute; right:20px; bottom:18px; z-index:3; max-width:320px; padding:8px 12px; background:#121a2de8; color:white; font-size:12px; }
.detail-hero { background:var(--navy); color:white; padding:64px clamp(20px,6vw,96px); border-bottom:6px solid var(--sun); }
.detail-hero .eyebrow { color:var(--sun); }
.detail-hero h1 { font-size:56px; max-width:950px; line-height:1.06; }
.detail-intro { font-size:20px; max-width:780px; margin-bottom:0; }
.detail-layout { display:grid; grid-template-columns:minmax(0,2fr) minmax(230px,1fr); gap:70px; padding:55px clamp(20px,6vw,96px); align-items:start; }
.detail-block { max-width:780px; padding-bottom:26px; margin-bottom:28px; border-bottom:1px solid var(--line); }
.detail-block h2 { font-size:30px; line-height:1.18; }
.detail-block p { color:var(--muted); font-size:17px; }
.review-hold { border-left:4px solid var(--copper); padding:24px; background:var(--paper); font-size:15px; }
.review-hold h2 { font-size:24px; }
.review-hold .eyebrow { color:#a74213; }
.detail-request { display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:start; background:var(--paper); padding:50px clamp(20px,6vw,96px); }
.detail-request h2 { font-size:36px; }
.detail-request>.button { justify-self:start; align-self:center; }
.related-pages { padding:45px clamp(20px,6vw,96px); }
.related-pages h2,.page-directory h2 { font-size:24px; }
.related-pages a { display:inline-block; padding:14px 20px 14px 0; color:var(--blue); font-weight:700; }
.page-directory { padding:35px clamp(20px,6vw,96px); border-top:1px solid var(--line); }
.page-directory>div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px 24px; }
.page-directory a { padding:10px 0; color:var(--blue); text-underline-offset:4px; }
.lead-form fieldset { min-width:0; margin:0; padding:0; border:0; display:grid; gap:16px; }
.lead-form legend { font-size:14px; margin-bottom:16px; color:var(--muted); font-weight:700; }
.lead-form #privacy-note { color:var(--muted); font-size:13px; margin:0; }
.form-status:focus { outline:3px solid var(--focus); outline-offset:4px; }
input:disabled,select:disabled,textarea:disabled { background:#edf0f5; }
@media(max-width:1100px) { .primary-nav { gap:15px; } .site-header { gap:15px; } }
@media(max-width:760px) {
  .detail-layout,.detail-request { grid-template-columns:minmax(0,1fr); gap:24px; }
  .detail-hero { padding-top:44px; padding-bottom:44px; }
  .detail-intro { font-size:18px; }
  .page-directory>div { grid-template-columns:minmax(0,1fr); }
  .primary-nav { max-height:calc(100dvh - 140px); overflow:auto; }
  .visual-caption { left:20px; right:auto; bottom:60px; font-size:10px; padding:5px 8px; }
  .detail-request .lead-form { padding:20px; }
  html { scroll-padding-top:85px; }
}

.detail-layout{display:block;max-width:1000px}.native-lead-wrap{min-width:0;width:100%}.lead-routing{border-top:4px solid var(--sun);padding-top:20px}.lead-routing h3{font-size:24px;margin:0 0 10px}.lead-routing-actions{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0 12px}.lead-routing-note{font-size:1rem}.native-lead-panel{margin-top:28px}.native-lead-panel[hidden]{display:none}.native-lead iframe{width:100%;min-height:850px;border:0;background:white}.native-lead p{font-size:1rem}.site-footer a:focus-visible{outline:3px solid #154d9a}
@media(max-width:760px){.mobile-actions{padding-right:88px}.native-lead iframe{min-height:950px}#proChatIframeContainer{bottom:88px!important}body.new-customer-form-open #proChatIframeContainer{display:none!important}}

.plan-table-wrap{max-width:100%;overflow-x:auto}.plan-comparison{width:100%;table-layout:fixed;border-collapse:collapse;text-align:left}.plan-comparison caption{text-align:left;margin-bottom:12px}.plan-comparison th,.plan-comparison td{padding:16px 12px;vertical-align:top;border-bottom:1px solid #d6dce2;overflow-wrap:anywhere}.plan-comparison thead{background:#edf2f5}.plan-comparison th:first-child{width:26%}@media(max-width:600px){.plan-comparison th,.plan-comparison td{padding:12px 7px;font-size:.88rem}.plan-comparison caption{font-size:1rem}}

[hidden]{display:none!important}.hero-shade{background:rgba(8,18,38,.80)}.first-party-request form{display:grid;gap:12px;max-width:680px}.first-party-request form[hidden]{display:none}.first-party-request input:not([type=checkbox]),.first-party-request select,.first-party-request textarea{width:100%;min-width:0;padding:12px;border:1px solid #768194;border-radius:4px;font:inherit;color:#151a28;background:#fff}.check-label{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap}.check-label input{width:20px;height:20px;flex:none}.intake-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.intake-status:empty{display:none}.intake-status{padding:16px;border-left:4px solid #d89700;background:#f3f5f8;color:#151a28}.intake-status:focus{outline:3px solid #154d9a}.policy-links{grid-column:1/-1}.measurement-choice{grid-column:1/-1;max-width:700px;font-size:1rem}.measurement-choice h2{font-size:1.25rem}.measurement-choice button{padding:12px;margin:0 8px 8px 0;min-height:44px;background:#fff;color:#142c53;border:1px solid #b4bfce;font:inherit;font-weight:700}.measurement-choice p{margin:8px 0}.button:disabled{opacity:.7;cursor:default}

/* Keep the compact launcher clear of quick actions. Expanded chat owns the screen. */
@media (max-width: 760px) {
  #proChatIframeContainer[data-truecraft-chat-expanded="true"] {
    bottom: 0 !important;
    max-height: 100dvh;
  }
  #proChatIframeContainer[data-truecraft-chat-fullscreen="true"] {
    height: 100vh !important;
    height: 100dvh !important;
  }
}

/* Compact service-first content revision. Existing navigation/form/chat rules preserved. */
.hero.hero-service { min-height: 0; }
.hero-service .hero-content { width: min(820px, 100%); margin: 0; padding: 46px clamp(20px, 6vw, 96px) 40px; }
.hero-service h1 { font-size: 56px; line-height: 1.04; }
.hero-service .hero-copy { margin-top: 20px; max-width: 660px; }
.hero-service .hero-actions { margin-top: 24px; }
.hero-note { margin: 16px 0 0; max-width: 580px; color: #d5deec; font-size: 14px; }
.compact-services, .compact-approach { padding-top: 48px; padding-bottom: 48px; }
.compact-services .section-heading { margin-bottom: 24px; }
.compact-services .service-card { min-height: 230px; padding: 22px; }
.compact-services h3 { font-size: 23px; }
.more-services { margin: 26px 0 0; line-height: 2; }
.more-services a { color: var(--blue); font-weight: 700; }
.compact-approach .process-list li { grid-template-columns: minmax(120px, 0.7fr) 1.3fr; gap: 20px; }
.intent-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin-top: 24px; }
.intent-actions .text-action { margin: 0; padding: 8px 0; }
.detail-hero h1 { max-width: 980px; font-size: 52px; line-height: 1.07; }
.detail-intro { max-width: 840px; }
.detail-block { max-width: 820px; }
.detail-block h2 { max-width: 800px; }
.detail-request, .contact-section { scroll-margin-top: 96px; }
.detail-hero .text-action { color: #fff; }
h2 { font-size: 36px; }
.detail-block h2 { font-size: 28px; }
.detail-request h2 { font-size: 32px; }
@media (max-width: 620px) {
 .hero-service .hero-content { padding-top: 28px; padding-bottom: 28px; }
 .hero-service .hero-copy { font-size: 17px; margin-top: 16px; }
 .hero-service .hero-actions { gap: 10px; }
 .hero-service .button { padding: 11px 14px; font-size: 16px; }
 .compact-services, .compact-approach { padding-top: 34px; padding-bottom: 34px; }
 .compact-services .service-card { min-height: 0; }
 .compact-approach .process-list li { grid-template-columns: 1fr; gap: 7px; }
 .hero-service h1, .detail-hero h1 { font-size: 34px; }
 h2, .detail-block h2 { font-size: 25px; }
 .detail-request h2 { font-size: 27px; }
 .intent-actions { gap: 10px 20px; }
}

@media (max-width:1000px) and (max-height:500px) {
 .hero-service h1, .detail-hero h1 { font-size:34px; }
 .detail-hero { padding-top:28px; padding-bottom:28px; }
 .hero-service .hero-content { padding-top:24px; padding-bottom:24px; }
 .intent-actions { margin-top:16px; }
}

/* A removed native iframe must not leave its empty fixed container intercepting
   the page. Reinsertion restores the unmodified vendor container immediately. */
#proChatIframeContainer[data-truecraft-chat-frame="false"] { display: none !important; }

/* The recorded HCP closed action strip is 110px by 72px. Its outer iframe
   otherwise inherits the browser's 150px default height plus inline descent.
   Reserve the complete compact strip, never crop or inspect cross-origin content. */
@media (max-width: 760px), (max-width: 1040px) and (max-height: 500px) {
  :root {
    --truecraft-action-height: 58px;
    --truecraft-chat-reserve: 0px;
  }
  :root[data-truecraft-compact-chat="true"] {
    --truecraft-action-height: 72px;
    --truecraft-chat-reserve: var(--truecraft-chat-width, 110px);
  }
  html { scroll-padding-bottom: calc(var(--truecraft-action-height) + env(safe-area-inset-bottom, 0px) + 16px); }
  body { padding-bottom: calc(var(--truecraft-action-height) + env(safe-area-inset-bottom, 0px)); }
  .mobile-actions {
    position: fixed; display: grid; z-index: 60;
    left: 0; right: 0; bottom: 0;
    grid-template-columns: 1fr 1.5fr;
    padding: 0 calc(var(--truecraft-chat-reserve) + env(safe-area-inset-right, 0px)) env(safe-area-inset-bottom, 0px) env(safe-area-inset-left, 0px);
    background: var(--white); border-top: 1px solid var(--line);
  }
  .mobile-actions a {
    min-height: var(--truecraft-action-height);
    display: flex; align-items: center; justify-content: center;
    text-decoration: none; font-weight: 900;
  }
  .mobile-actions a:first-child { background: var(--ink); color: var(--white); }
  .mobile-actions a:last-child { background: var(--sun); color: var(--ink); }
  :root[data-truecraft-compact-chat="true"] #proChatIframeContainer[data-truecraft-chat-expanded="false"] {
    height: 72px !important;
    bottom: env(safe-area-inset-bottom, 0px) !important;
    right: env(safe-area-inset-right, 0px) !important;
  }
  :root[data-truecraft-compact-chat="true"] #proChatIframeContainer[data-truecraft-chat-expanded="false"] > #proChatIframe {
    display: block;
  }
  body.new-customer-form-open #proChatIframeContainer { display: none !important; }
  .primary-nav {
    max-height: calc(100dvh - 100% - var(--truecraft-action-height) - env(safe-area-inset-bottom, 0px));
  }
}

/* On short landscape screens the open menu can use the CTA column while the
   complete chat strip remains beside it. Closing the menu restores both actions. */
@media (max-width: 1040px) and (max-height: 500px) {
  .site-header { z-index: 70; }
  .primary-nav {
    right: calc(var(--truecraft-chat-reserve) + env(safe-area-inset-right, 0px));
    max-height: calc(100dvh - 100% - env(safe-area-inset-bottom, 0px));
  }
}

/* N2: sourced customer testimonials and the official HCP review frame. */
.customer-testimonials { background: var(--paper); }
.testimonial-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.testimonial-card { margin: 0; padding: 24px; background: var(--white); border: 1px solid var(--line); border-radius: 8px; }
.testimonial-card blockquote { margin: 0 0 16px; color: var(--navy); font-size: clamp(1.1rem, 2vw, 1.4rem); }
.testimonial-card blockquote p { margin: 0; }
.testimonial-card figcaption { color: var(--muted); font-size: .9rem; }
.testimonial-card figcaption strong { color: var(--ink); }
.customer-testimonials > .text-action { display: inline-block; margin-top: 24px; }
.hcp-review-frame { display: block; width: 100%; height: 760px; max-width: 100%; border: 1px solid var(--line); border-radius: 8px; background: var(--white); }
.hcp-review-frame:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
@media (max-width: 620px) {
  .testimonial-grid { grid-template-columns: 1fr; gap: 16px; }
  .testimonial-card { padding: 20px; }
  .hcp-review-frame { height: 640px; }
}
