/* Service requests and a more visible emergency contact. */
.topbar { background: #102e38; border-bottom: 1px solid #e9bd7d66; }
.topbar .container { min-height: 62px; height: auto; padding-block: 8px; gap: 20px; }
.emergency-banner-label { display: flex; flex-direction: column; gap: 1px; }
.emergency-banner-label strong { color: #fff; font-size: 13px; font-weight: 650; line-height: 1.4; }
.emergency-banner-label small { color: #c9dbdc; font-size: 10px; line-height: 1.4; }
.topbar .emergency-banner-call {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 10px 15px;
  background: #f1c98e;
  color: #102e38;
  border: 1px solid #ffe2b5;
  border-radius: 7px;
  box-shadow: 0 4px 15px #0002;
  white-space: nowrap;
  line-height: 1.25;
}
.emergency-banner-call svg { width: 19px; height: 19px; stroke-width: 1.8; flex-shrink: 0; }
.emergency-banner-number { font-size: 17px; font-weight: 750; letter-spacing: .01em; }
.emergency-banner-action { font-size: 11px; font-weight: 650; padding-left: 12px; border-left: 1px solid #17394340; }
.topbar .emergency-banner-call:hover { background: #ffdda9; }
.topbar .emergency-banner-call:focus-visible { outline-color: white; }
.header .nav-request { color: #916a37; font-weight: 700; }
.sidebar-request { display: block; margin-top: 25px; padding: 14px 16px; background: var(--brass); color: var(--navy); border-radius: 7px; font-size: 12px; font-weight: 650; text-align: center; }
.sidebar-request:hover { background: #f5d4a2; }

.home .contact-grid { grid-template-columns: .8fr 1.2fr; gap: 85px; align-items: start; }
.home .contact-intro { position: sticky; top: 125px; padding-top: 12px; }
.home .contact-intro > p { max-width: 390px; }
.contact-intro .contact-phone { margin-top: 22px; }
.home .contact-intro .contact-emergency { border-left: 2px solid var(--brass); padding-left: 18px; margin-top: 36px; max-width: 360px; }
.contact-emergency strong { display: block; font-size: 14px; color: white; margin-bottom: 6px; font-weight: 600; }
.contact-emergency a { color: #f1c98e; font-weight: 650; text-decoration: underline; text-underline-offset: 4px; white-space: nowrap; }
.contact-emergency small { display: block; font-size: 11px; line-height: 1.7; margin-top: 10px; color: #c5dadd; }
.home .request-card { background: #f9faf5; color: var(--ink); padding: 34px; border: 1px solid #cddbd2; border-radius: 16px; box-shadow: 0 24px 60px #071e2c33; }
.request-card .prep-label { color: #7a603e; font-size: 9px; letter-spacing: .16em; margin-bottom: 12px; }
.request-card h3 { font-size: 27px; line-height: 1.25; letter-spacing: -.04em; }
.request-card .form-intro { color: #5a6e74; font-size: 12px; line-height: 1.7; margin: 12px 0 24px; }
.request-card fieldset { margin: 0 0 23px; padding: 0; border: 0; min-width: 0; }
.request-card legend { font-size: 12px; font-weight: 600; margin-bottom: 9px; }
.request-card .segmented { border-color: #c0d2cc; background: #e9efea; border-radius: 8px; }
.request-card .segmented label { color: #566e73; font-size: 12px; }
.request-card .segmented span { padding: 10px; border-radius: 5px; }
.request-card .segmented input:checked + span { background: #153a44; color: white; box-shadow: 0 3px 8px #15353e18; }
.request-card #customer-guidance { color: #5a6e74; font-size: 11px; line-height: 1.7; margin: 9px 0 0; min-height: 0; }
.request-card .selected-concern { color: #153a44; border-color: #9c7948; }
.request-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 16px; }
.request-field { min-width: 0; }
.request-field.full-width { grid-column: 1 / -1; }
.request-field label { display: block; font-size: 12px; font-weight: 600; margin-bottom: 7px; }
.request-field .optional { color: #6d7d80; font-size: 10px; font-weight: 400; }
.request-field input, .request-field select, .request-field textarea {
  display: block;
  width: 100%;
  min-height: 45px;
  border: 1px solid #bccdc6;
  border-radius: 7px;
  background: white;
  color: #15353e;
  padding: 11px 12px;
  font: 400 14px/1.5 var(--body);
  transition: border-color .15s, box-shadow .15s;
}
.request-field textarea { resize: vertical; min-height: 112px; }
.request-field select { padding-right: 28px; }
.request-field input::placeholder, .request-field textarea::placeholder { color: #78888a; opacity: 1; }
.request-field input:focus-visible, .request-field select:focus-visible, .request-field textarea:focus-visible { outline: 2px solid #967244; outline-offset: 2px; border-color: #967244; }
.request-field .field-help { display: block; color: #64787b; font-size: 10px; line-height: 1.6; margin-top: 5px; }
.request-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.request-card .request-submit { width: 100%; justify-content: center; margin-top: 24px; background: #153a44; color: white; border: 0; border-radius: 7px; font-size: 13px; min-height: 50px; }
.request-card .request-submit:hover { background: #245867; }
.request-submit:disabled { opacity: .65; cursor: wait; transform: none; }
.request-submit .submit-label { font-size: 13px; line-height: 1.5; }
.request-card .request-note { margin: 12px 0 0; color: #5d7276; font-size: 10px; line-height: 1.7; }
.request-status { margin-top: 19px; border: 1px solid #c4d4ce; border-radius: 9px; padding: 15px 17px; font-size: 13px; line-height: 1.7; color: #153a44; background: #edf3ee; }
.request-status[hidden] { display: none; }
.request-status[data-state="success"] { background: #e7f1e5; border-color: #96b394; color: #254e2b; }
.request-status[data-state="error"] { background: #fff1e7; border-color: #c99875; color: #6b3d23; }
.request-status a { text-decoration: underline; text-underline-offset: 3px; font-weight: 600; }
.request-complete { padding: 100px 20px; min-height: 55vh; background: radial-gradient(ellipse at top right, #d7e6de, transparent 70%), #f2f5ef; }
.request-complete .container { max-width: 690px; }
.request-complete h1 { font-size: clamp(37px, 4vw, 55px); }
.request-complete p { max-width: 590px; margin: 24px 0; color: #526a70; font-size: 15px; line-height: 1.85; }
.request-complete .button { background: var(--navy); }
.request-complete .receipt-links { display: flex; flex-wrap: wrap; gap: 20px; align-items: center; margin-top: 30px; }
.request-complete .receipt-emergency { border-left: 3px solid #bc925a; padding-left: 18px; font-size: 13px; }
.request-complete .receipt-emergency a { color: #153a44; font-weight: 650; text-decoration: underline; }

@media (max-width: 1080px) {
  .home .contact-grid { gap: 40px; grid-template-columns: .8fr 1.2fr; }
  .home .request-card { padding: 28px; }
  .contact-intro .contact-phone { font-size: 30px; }
}
@media (max-width: 820px) {
  .home .contact-grid { grid-template-columns: 1fr; gap: 33px; }
  .home .contact-intro { position: static; }
  .home .contact-intro > p, .home .contact-intro .contact-emergency { max-width: 550px; }
  .request-card h3 { font-size: 29px; }
}
@media (max-width: 600px) {
  .topbar .container { min-height: 62px; gap: 12px; padding-block: 8px; }
  .emergency-banner-label strong { font-size: 11px; }
  .emergency-banner-label small { font-size: 9px; }
  .topbar .emergency-banner-call { gap: 7px; padding: 11px 10px; border-radius: 6px; }
  .emergency-banner-call svg { width: 15px; height: 15px; }
  .emergency-banner-number { font-size: 14px; }
  .emergency-banner-action { display: none; }
  .home .request-card { padding: 25px 22px; }
  .request-fields { gap: 17px 13px; }
  .request-field input, .request-field select, .request-field textarea { font-size: 16px; }
  .request-card h3 { font-size: 27px; }
  .request-card .form-intro { font-size: 12px; }
  .request-card .request-note { font-size: 10px; }
  .request-complete { padding: 60px 0; }
}
@media (max-width: 420px) {
  .request-fields { grid-template-columns: 1fr; }
  .request-field.full-width { grid-column: auto; }
  .home .request-card { padding: 25px 20px; }
  .request-card .segmented label { font-size: 11px; }
  .request-card h3 { font-size: 25px; }
}
@media (max-width: 360px) {
  .topbar .container { gap: 8px; }
  .emergency-banner-label strong { font-size: 10px; }
  .emergency-banner-label small { font-size: 8px; }
  .topbar .emergency-banner-call { gap: 5px; padding-inline: 8px; }
  .emergency-banner-number { font-size: 13px; }
  .emergency-banner-call svg { width: 13px; height: 13px; }
}

/* A complete property address, with native browser autofill. */
.request-fields > .request-address-group { grid-column: 1 / -1; margin: 2px 0; padding: 19px 0; border-top: 1px solid #d5dfd9; border-bottom: 1px solid #d5dfd9; }
.request-address-group legend { float: left; width: 100%; margin: 0 0 15px; font-size: 13px; color: #153a44; }
.address-fields { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(64px, .55fr) minmax(90px, .8fr); gap: 16px 12px; clear: both; }
.request-address-group > .field-help { display: block; color: #64787b; font-size: 10px; line-height: 1.7; margin-top: 11px; }
#request-state { text-transform: uppercase; }
.request-status[data-state="slow"] { background: #fff1e7; border-color: #c99875; color: #6b3d23; }
.request-card[aria-busy="true"] .submit-label::before { content: ''; display: inline-block; width: 12px; height: 12px; margin-right: 9px; border: 2px solid #ffffff60; border-top-color: white; border-radius: 50%; vertical-align: -2px; animation: request-progress .9s linear infinite; }
@keyframes request-progress { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .request-card[aria-busy="true"] .submit-label::before { animation: none; } }
@media (max-width: 600px) { .address-fields { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .address-city { grid-column: 1 / -1; } }
