/* Contact Us and Request a Security Assessment load this stylesheet. A navy
   info panel sits beside a white form card. */
/* Hero: the world map background, about a quarter taller than other compact banners. */
.page-banner.cu-banner { background-image: url("../images/bg-map.jpg"); background-position: center; }
.cu-banner .page-banner-inner { min-height: 14.75rem; }
@media (min-width: 48rem) { .page-banner.cu-banner .page-banner-inner { min-height: calc(11.5rem + 13.5vw); } }
@media (min-width: 75rem) { .page-banner.cu-banner .page-banner-inner { min-height: calc(22.5rem + 4.5vw); } }
.cu-page { --cu-panel: #f3f5f9; --cu-line: #767f96; --cu-error: rgb(180, 22, 50); color: var(--ink); background: linear-gradient(180deg, #fff 0%, var(--cu-panel) 100%); }
.cu-wrap { width: 100%; max-width: 76rem; margin-inline: auto; padding-left: max(1.25rem, env(safe-area-inset-left, 0px)); padding-right: max(1.25rem, env(safe-area-inset-right, 0px)); }
.cu-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; padding-block: clamp(2rem, 4.5vw, 3.5rem) clamp(3.5rem, 7vw, 6rem); }

/* Contact methods: white text and red icon tiles on the navy panel. */
.cu-info { position: relative; isolation: isolate; overflow: hidden; min-width: 0; padding: clamp(2rem, 4vw, 3.25rem); border-bottom: 4px solid var(--accent); background: repeating-linear-gradient(115deg, rgb(255 255 255 / .035) 0 2px, transparent 2px 14px), linear-gradient(160deg, #34466b 0%, #1f2747 55%, #121631 100%); color: #fff; }
.cu-eyebrow { display: flex; align-items: center; gap: .875rem; margin: 0 0 .875rem; font-size: .9375rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.cu-eyebrow::before { content: ""; flex: 0 0 auto; width: 2.5rem; height: 3px; background: var(--accent); }
.cu-page h2 { margin: 0 0 .875rem; font-size: clamp(1.875rem, 3.4vw, 2.625rem); line-height: 1.12; letter-spacing: -.03em; }
.cu-lead { max-width: 40ch; margin: 0 0 clamp(2rem, 3.5vw, 2.75rem); color: rgb(255 255 255 / .85); font-size: clamp(1.0625rem, 1.3vw, 1.1875rem); line-height: 1.6; }
.cu-methods { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.cu-method { display: flex; gap: 1.125rem; min-width: 0; padding-block: 1.5rem; border-top: 1px solid rgb(255 255 255 / .16); }
.cu-method:last-child { padding-bottom: 0; }
.cu-method > div { min-width: 0; }
.cu-method svg { flex: 0 0 auto; width: 3.25rem; height: 3.25rem; padding: .75rem; background: var(--accent); fill: none; stroke: #fff; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.cu-method h3 { margin: 0 0 .25rem; font-size: 1.25rem; line-height: 1.3; }
.cu-method p { margin: 0 0 .5rem; color: rgb(255 255 255 / .78); font-size: 1rem; line-height: 1.55; }
.cu-method address { font-style: normal; }
.cu-link { color: #fff; font-family: var(--font-accent); font-size: clamp(1.0625rem, 1.4vw, 1.25rem); font-weight: 700; line-height: 1.4; text-decoration: none; overflow-wrap: anywhere; }
.cu-link:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }

/* Form card: underlined fields matching the quote form. */
.cu-form-panel { min-width: 0; padding: clamp(2rem, 4vw, 3.25rem); border-top: 4px solid var(--accent); background: #fff; box-shadow: 0 18px 44px rgb(18 22 42 / .1); }
.cu-form-intro { margin: 0 0 1.5rem; color: var(--muted); font-size: clamp(1.0625rem, 1.2vw, 1.125rem); line-height: 1.6; }
.cu-note { margin: 0 0 1.25rem; color: var(--muted); font-size: .875rem; }
.cu-note span, .cu-required { margin-left: .125rem; color: var(--accent); }
.cu-note span { margin: 0 .25rem 0 0; }
.cu-optional { color: var(--muted); font-weight: 400; }
.cu-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem 1.75rem; }
.cu-field { display: flex; flex-direction: column; min-width: 0; margin: 0; }
.cu-field label { font-size: .9375rem; font-weight: 700; line-height: 1.4; }
.cu-field input, .cu-field textarea { width: 100%; min-height: 48px; margin-top: .25rem; padding: .625rem 0; border: 0; border-bottom: 1px solid var(--cu-line); border-radius: 0; background: transparent; color: var(--ink); font: inherit; font-size: 1rem; transition: border-color .2s ease, box-shadow .2s ease; }
.cu-field textarea { min-height: 8.5rem; margin-top: .75rem; padding: .75rem; border: 1px solid var(--cu-line); resize: vertical; }
.cu-field input:focus, .cu-field textarea:focus { outline: 2px solid transparent; border-color: var(--accent); box-shadow: 0 1px 0 var(--accent); }
.cu-field textarea:focus { box-shadow: inset 0 0 0 1px var(--accent); }
.cu-field [aria-invalid="true"] { border-color: var(--cu-error); }
/* Error messages come from the shared form script, which names them .quote-error. */
.cu-form .quote-error { display: block; margin-top: .5rem; color: var(--cu-error); font-size: .875rem; font-weight: 700; line-height: 1.4; }
.cu-submit { width: 100%; margin-top: 2rem; cursor: pointer; }
.cu-status { margin: 1.25rem 0 0; color: var(--cu-error); font-weight: 700; }
.cu-status:empty { margin: 0; }


@media (prefers-reduced-motion: reduce) {
  .cu-field input, .cu-field textarea { transition: none; }
}
@media (min-width: 40rem) {
  .cu-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cu-field-full { grid-column: 1 / -1; }
  .cu-submit { width: auto; }
}
@media (min-width: 64rem) {
  .cu-layout { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 0; align-items: stretch; }
  .cu-info { border-bottom: 0; border-left: 4px solid var(--accent); }
  .cu-form-panel { border-top: 0; }
}