/* ============================================
     ACE INSURANCE — TurboRater Theme v5 (Mobile)
     ============================================ */

  @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

  :root {
    --navy:     #0f1d56;
    --navy-mid: #1a2b6d;
    --sky:      #38b6e8;
    --sky-dim:  #2aaad8;
    --sky-glow: rgba(56,182,232,0.28);
    --bright:   #4ec9ff;
    --white:    #ffffff;
    --off:      #f7f9fc;
    --text:     #1a1f36;
    --text-2:   #4a5578;
    --text-3:   #8492b0;
    --border:   rgba(0,0,0,0.07);
    --gold:     #f59e0b;
    --ease:     cubic-bezier(0.4,0,0.2,1);
    --spring:   cubic-bezier(0.34,1.56,0.64,1);
  }

  *, *::before, *::after { box-sizing: border-box; }

  body {
    font-family: 'Inter', system-ui, sans-serif !important;
    background: var(--off) !important;
    color: var(--text) !important;
    -webkit-font-smoothing: antialiased !important;
    margin: 0 !important;
  }

  /* ============================================
     ANIMATIONS
     ============================================ */
  @keyframes orbFloat1 {
    0%,100% { transform: translate(0,0) scale(1); }
    33%      { transform: translate(40px,30px) scale(1.06); }
    66%      { transform: translate(-25px,55px) scale(0.95); }
  }
  @keyframes orbFloat2 {
    0%,100% { transform: translate(0,0) scale(1); }
    50%      { transform: translate(-50px,-35px) scale(1.1); }
  }
  @keyframes shimmer {
    0%   { left: -100%; }
    100% { left: 150%; }
  }
  @keyframes fadeUp {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
  }
  @keyframes borderGlow {
    0%,100% { box-shadow: 0 4px 24px rgba(15,29,86,0.4); }
    50%      { box-shadow: 0 4px 32px rgba(15,29,86,0.5), 0 2px 16px rgba(56,182,232,0.3); }
  }
  @keyframes slideDown {
    from { opacity: 0; transform: translateY(-8px); }
    to   { opacity: 1; transform: translateY(0); }
  }

  /* ============================================
     HEADER
     ============================================ */
  header {
    background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%) !important;
    border-bottom: 3px solid var(--sky) !important;
    animation: borderGlow 4s ease-in-out infinite !important;
    padding: 14px 32px !important;
    position: relative !important;
    overflow: hidden !important;
  }

  header::before {
    content: '' !important;
    position: absolute !important;
    top: -60px !important; right: -60px !important;
    width: 280px !important; height: 280px !important;
    background: radial-gradient(circle, rgba(56,182,232,0.18), transparent 70%) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
    animation: orbFloat2 12s ease-in-out infinite !important;
  }

  header::after {
    content: '' !important;
    position: absolute !important;
    bottom: -40px !important; left: 25% !important;
    width: 180px !important; height: 180px !important;
    background: radial-gradient(circle, rgba(99,130,255,0.1), transparent 70%) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
    animation: orbFloat1 16s ease-in-out infinite !important;
  }

  header > div {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
    width: 100% !important;
    position: relative !important;
    z-index: 1 !important;
  }

  /* Logo */
  header img,
  header .agencyLogo img,
  header [class*="logo"] img,
  header [class*="Logo"] img,
  header > div > a > img,
  header > div > img,
  header > div > div:first-child img {
    height: 56px !important;
    width: auto !important;
    max-width: 200px !important;
    object-fit: contain !important;
    filter: brightness(0) invert(1) !important;
    transition: filter 0.3s, transform 0.3s var(--ease) !important;
    display: block !important;
  }

  header img:hover { transform: scale(1.03) !important; }

  /* Contact block */
  .AgencyContactInfoContainer {
    background: rgba(255,255,255,0.07) !important;
    border: 1px solid rgba(255,255,255,0.12) !important;
    border-radius: 10px !important;
    padding: 10px 16px !important;
    text-align: right !important;
    backdrop-filter: blur(8px) !important;
  }

  .AgencyNameLabel,
  .AgencyAddressLabel,
  .AgencyCityStateZipLabel,
  .AgencyPhoneLabel,
  .AgencyContactEmail {
    font-family: 'Inter', sans-serif !important;
    color: rgba(255,255,255,0.72) !important;
    font-size: 0.8rem !important;
    margin: 2px 0 !important;
    line-height: 1.5 !important;
  }

  .AgencyNameLabel {
    font-weight: 700 !important;
    font-size: 0.64rem !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    color: rgba(255,255,255,0.38) !important;
  }

  .AgencyPhoneLabel a,
  .AgencyContactEmail a {
    color: var(--bright) !important;
    font-weight: 600 !important;
    text-decoration: none !important;
  }

  .AgencyPhoneLabel a:hover,
  .AgencyContactEmail a:hover {
    color: var(--white) !important;
    text-decoration: underline !important;
  }

  .HomeLinkContainer { color: rgba(255,255,255,0.3) !important; }
  .HomeLinkContainer a { color: var(--bright) !important; }

  /* ============================================
     NAVIGATION BAR
     ============================================ */
  #ace-nav {
    background: var(--navy-mid) !important;
    border-bottom: 1px solid rgba(255,255,255,0.08) !important;
    padding: 0 20px !important;
    animation: slideDown 0.4s var(--ease) both !important;
    position: relative !important;
    z-index: 99 !important;
    overflow: hidden !important;
  }

  .ace-nav-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
    height: 44px !important;
    gap: 8px !important;
  }

  .ace-nav-links {
    display: flex !important;
    align-items: center !important;
    gap: 2px !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    flex: 1 !important;
  }

  .ace-nav-links::-webkit-scrollbar { display: none !important; }

  .ace-nav-link {
    font-family: 'Inter', sans-serif !important;
    font-size: 0.82rem !important;
    font-weight: 500 !important;
    color: rgba(255,255,255,0.7) !important;
    padding: 6px 12px !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    transition: all 0.2s !important;
    letter-spacing: -0.01em !important;
    white-space: nowrap !important;
  }

  .ace-nav-link:hover {
    color: var(--white) !important;
    background: rgba(255,255,255,0.1) !important;
  }

  .ace-nav-cta {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 0.78rem !important;
    font-weight: 600 !important;
    color: var(--sky) !important;
    background: rgba(56,182,232,0.1) !important;
    border: 1px solid rgba(56,182,232,0.25) !important;
    padding: 6px 12px !important;
    border-radius: 50px !important;
    text-decoration: none !important;
    transition: all 0.2s !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
  }

  .ace-nav-cta svg { width: 12px !important; height: 12px !important; }

  .ace-nav-cta:hover {
    background: var(--sky) !important;
    color: var(--white) !important;
    border-color: var(--sky) !important;
  }

  /* ============================================
     GREETING / DESCRIPTION
     ============================================ */
  .description {
    background: var(--white) !important;
    border-bottom: 1px solid rgba(0,0,0,0.06) !important;
    padding: 44px 24px 20px !important;
    text-align: center !important;
    position: relative !important;
    overflow: hidden !important;
  }

  .description::before {
    content: '' !important;
    position: absolute !important;
    top: -80px !important; left: -80px !important;
    width: 320px !important; height: 320px !important;
    background: radial-gradient(circle, rgba(56,182,232,0.07), transparent 65%) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
    animation: orbFloat1 14s ease-in-out infinite !important;
  }

  .description::after {
    content: '' !important;
    position: absolute !important;
    bottom: -60px !important; right: -60px !important;
    width: 260px !important; height: 260px !important;
    background: radial-gradient(circle, rgba(99,130,255,0.06), transparent 65%) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
    animation: orbFloat2 18s ease-in-out infinite !important;
  }

  #GreetingTxt {
    font-family: 'Inter', sans-serif !important;
    max-width: 700px !important;
    margin: 0 auto !important;
    position: relative !important;
    z-index: 1 !important;
    animation: fadeUp 0.6s var(--ease) both !important;
  }

  #GreetingTxt p { font-family: 'Inter', sans-serif !important; margin: 2px 0 !important; }

  #GreetingTxt p:first-child strong {
    font-size: 2.4rem !important;
    font-weight: 900 !important;
    color: var(--navy) !important;
    letter-spacing: -0.04em !important;
    line-height: 1.1 !important;
    display: block !important;
  }

  #GreetingTxt p:nth-child(2) span {
    font-size: 1.05rem !important;
    font-weight: 500 !important;
    color: var(--text-2) !important;
  }

  #GreetingTxt p[style*="text-align: center"] strong {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-top: 18px !important;
    font-size: 0.68rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    color: var(--sky) !important;
  }

  #GreetingTxt p[style*="text-align: center"] strong::before,
  #GreetingTxt p[style*="text-align: center"] strong::after {
    content: '' !important;
    display: inline-block !important;
    width: 28px !important; height: 2px !important;
    background: linear-gradient(90deg, transparent, var(--sky)) !important;
    border-radius: 2px !important;
  }

  #GreetingTxt p[style*="text-align: center"] strong::after {
    background: linear-gradient(90deg, var(--sky), transparent) !important;
  }

  /* Trust Badge */
  #ace-trust {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 8px 12px !important;
    margin-top: 18px !important;
    padding-top: 16px !important;
    border-top: 1px solid rgba(0,0,0,0.06) !important;
  }

  .ace-trust-item {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
    color: var(--text-3) !important;
  }

  .ace-trust-item svg {
    width: 14px !important; height: 14px !important;
    stroke: var(--sky) !important;
    flex-shrink: 0 !important;
  }

  .ace-trust-star { color: var(--gold) !important; font-weight: 600 !important; }
  .ace-trust-star svg { fill: var(--gold) !important; stroke: none !important; }

  .ace-trust-dot {
    width: 3px !important; height: 3px !important;
    background: rgba(0,0,0,0.15) !important;
    border-radius: 50% !important;
    display: inline-block !important;
  }

  /* ============================================
     SOCIAL PROOF BAR
     ============================================ */
  #ace-proof {
    background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%) !important;
    padding: 0 24px !important;
    border-bottom: 1px solid rgba(255,255,255,0.06) !important;
    animation: fadeUp 0.5s 0.1s var(--ease) both !important;
  }

  .ace-proof-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    max-width: 900px !important;
    margin: 0 auto !important;
    height: 72px !important;
  }

  .ace-proof-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 24px !important;
    gap: 2px !important;
  }

  .ace-proof-item.ace-proof-star {
    flex-direction: row !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
  }

  .ace-proof-star svg {
    width: 16px !important; height: 16px !important;
    fill: var(--gold) !important;
    flex-shrink: 0 !important;
  }

  .ace-proof-num {
    font-family: 'Inter', sans-serif !important;
    font-size: 1.4rem !important;
    font-weight: 900 !important;
    color: var(--white) !important;
    letter-spacing: -0.04em !important;
    line-height: 1 !important;
  }

  .ace-proof-plus { color: var(--sky) !important; font-size: 1rem !important; }

  .ace-proof-label {
    font-family: 'Inter', sans-serif !important;
    font-size: 0.7rem !important;
    font-weight: 500 !important;
    color: rgba(255,255,255,0.5) !important;
    letter-spacing: 0.02em !important;
    white-space: nowrap !important;
  }

  .ace-proof-divider {
    width: 1px !important; height: 32px !important;
    background: rgba(255,255,255,0.1) !important;
    flex-shrink: 0 !important;
  }

  /* ============================================
     MAIN CONTAINER
     ============================================ */
  #container {
    max-width: 880px !important;
    margin: 0 auto !important;
    padding: 32px 16px 60px !important;
    position: relative !important;
  }

  #container::before {
    content: '' !important;
    position: fixed !important;
    inset: 0 !important;
    background-image: radial-gradient(circle, rgba(56,182,232,0.06) 1px, transparent 1px) !important;
    background-size: 28px 28px !important;
    pointer-events: none !important;
    z-index: 0 !important;
  }

  #pgSelect, #additionalLob { position: relative !important; z-index: 1 !important; }

  .stepTitle {
    font-family: 'Inter', sans-serif !important;
    font-size: 1.8rem !important;
    font-weight: 900 !important;
    color: var(--navy) !important;
    text-align: center !important;
    letter-spacing: -0.04em !important;
    margin-bottom: 24px !important;
    animation: fadeUp 0.6s 0.1s var(--ease) both !important;
  }

  /* ============================================
     PRIMARY CARDS
     ============================================ */
  #selectLines {
    display: flex !important;
    gap: 12px !important;
    justify-content: center !important;
    margin-bottom: 20px !important;
  }

  #selectLines .inputPanel {
    background: var(--white) !important;
    border: 1.5px solid var(--border) !important;
    border-radius: 16px !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05) !important;
    padding: 28px 16px 22px !important;
    cursor: pointer !important;
    transition: all 0.28s var(--ease) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 14px !important;
    flex: 1 !important;
    max-width: 240px !important;
    min-width: 0 !important;
    position: relative !important;
    overflow: hidden !important;
  }

  #selectLines .inputPanel:nth-child(1) { animation: fadeUp 0.5s 0.15s var(--spring) both !important; }
  #selectLines .inputPanel:nth-child(2) { animation: fadeUp 0.5s 0.25s var(--spring) both !important; }
  #selectLines .inputPanel:nth-child(3) { animation: fadeUp 0.5s 0.35s var(--spring) both !important; }

  #selectLines .inputPanel::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important; right: 0 !important;
    height: 3px !important;
    background: linear-gradient(90deg, transparent, var(--sky), transparent) !important;
    opacity: 0 !important;
    transition: opacity 0.3s !important;
  }

  #selectLines .inputPanel::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important; left: -100% !important;
    width: 60% !important; height: 100% !important;
    background: linear-gradient(90deg, transparent, rgba(56,182,232,0.07), transparent) !important;
    transform: skewX(-15deg) !important;
    pointer-events: none !important;
  }

  #selectLines .inputPanel:hover::before { opacity: 1 !important; }
  #selectLines .inputPanel:hover::after { animation: shimmer 0.6s var(--ease) !important; }

  #selectLines .inputPanel:hover {
    border-color: var(--sky) !important;
    transform: translateY(-5px) scale(1.02) !important;
    box-shadow: 0 0 0 4px rgba(56,182,232,0.1), 0 12px 36px rgba(56,182,232,0.2) !important;
    background: linear-gradient(160deg, var(--white) 0%, #e8f4fd 100%) !important;
  }

  .panelTitle {
    font-family: 'Inter', sans-serif !important;
    font-size: 0.88rem !important;
    font-weight: 700 !important;
    color: var(--navy) !important;
    letter-spacing: -0.01em !important;
    text-align: center !important;
    order: -1 !important;
    transition: color 0.2s !important;
  }

  #selectLines .inputPanel:hover .panelTitle { color: var(--sky-dim) !important; }

  #selectLines .panelImage img {
    width: 46px !important; height: 46px !important;
    filter: brightness(0) saturate(100%) invert(56%) sepia(70%) saturate(500%) hue-rotate(172deg) brightness(105%)
  !important;
    transition: filter 0.25s ease, transform 0.3s var(--spring) !important;
  }

  #selectLines .inputPanel:hover .panelImage img {
    filter: brightness(0) saturate(100%) invert(40%) sepia(90%) saturate(700%) hue-rotate(172deg) brightness(100%)
  !important;
    transform: scale(1.12) rotate(-3deg) !important;
  }

  .multiImage { display: flex !important; align-items: center !important; gap: 3px !important; }

  #multiPlus {
    font-family: 'Inter', sans-serif !important;
    font-size: 1rem !important; font-weight: 900 !important;
    color: var(--sky) !important; line-height: 1 !important;
  }

  /* ============================================
     DIVIDER
     ============================================ */
  #additionalLob { margin-top: 6px !important; }

  #additionalLob::before {
    content: 'MORE COVERAGE OPTIONS' !important;
    display: block !important;
    text-align: center !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 0.64rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.14em !important;
    color: var(--text-3) !important;
    margin-bottom: 6px !important;
  }

  /* ============================================
     SECONDARY LOB BUTTONS
     ============================================ */
  .addlCovList {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
    max-width: 680px !important;
    margin: 0 auto !important;
  }

  #additionalLines .inputPanel {
    background: var(--white) !important;
    border: 1.5px solid var(--border) !important;
    border-radius: 10px !important;
    padding: 12px 14px !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
    transition: all 0.2s var(--ease) !important;
    position: relative !important;
    overflow: hidden !important;
  }

  #additionalLines .inputPanel::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important; left: -100% !important;
    width: 60% !important; height: 100% !important;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent) !important;
    transform: skewX(-15deg) !important;
    pointer-events: none !important;
  }

  #additionalLines .inputPanel:hover::after { animation: shimmer 0.5s var(--ease) !important; }

  #additionalLines .inputPanel:nth-child(1) { animation: fadeUp 0.4s 0.20s var(--ease) both !important; }
  #additionalLines .inputPanel:nth-child(2) { animation: fadeUp 0.4s 0.25s var(--ease) both !important; }
  #additionalLines .inputPanel:nth-child(3) { animation: fadeUp 0.4s 0.30s var(--ease) both !important; }
  #additionalLines .inputPanel:nth-child(4) { animation: fadeUp 0.4s 0.35s var(--ease) both !important; }
  #additionalLines .inputPanel:nth-child(5) { animation: fadeUp 0.4s 0.40s var(--ease) both !important; }
  #additionalLines .inputPanel:nth-child(6) { animation: fadeUp 0.4s 0.45s var(--ease) both !important; }
  #additionalLines .inputPanel:nth-child(7) { animation: fadeUp 0.4s 0.50s var(--ease) both !important; }
  #additionalLines .inputPanel:nth-child(8) { animation: fadeUp 0.4s 0.55s var(--ease) both !important; }

  #additionalLines .inputPanel:hover {
    background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%) !important;
    border-color: var(--sky) !important;
    box-shadow: 0 6px 22px rgba(15,29,86,0.28) !important;
    transform: translateY(-2px) !important;
  }

  #additionalLines .panelTitle {
    font-family: 'Inter', sans-serif !important;
    font-size: 0.86rem !important; font-weight: 600 !important;
    color: var(--navy) !important;
    transition: color 0.2s !important; order: 1 !important;
  }

  #additionalLines .inputPanel:hover .panelTitle { color: var(--white) !important; }

  #additionalLines .panelImage {
    display: flex !important; align-items: center !important; justify-content: center !important;
    width: 34px !important; height: 34px !important; min-width: 34px !important;
    background: rgba(56,182,232,0.1) !important; border-radius: 8px !important;
    transition: background 0.2s !important; order: 0 !important;
  }

  #additionalLines .inputPanel:hover .panelImage { background: rgba(255,255,255,0.15) !important; }

  #additionalLines .panelImage img {
    width: 18px !important; height: 18px !important;
    filter: brightness(0) saturate(100%) invert(56%) sepia(70%) saturate(500%) hue-rotate(172deg) brightness(105%)
  !important;
    transition: filter 0.2s, transform 0.2s var(--spring) !important;
  }

  #additionalLines .inputPanel:hover .panelImage img {
    filter: brightness(0) invert(1) !important;
    transform: scale(1.15) !important;
  }

  /* ============================================
     CUSTOM FOOTER
     ============================================ */
  #ace-footer {
    background: var(--navy) !important;
    border-top: 3px solid var(--sky) !important;
    padding: 48px 24px 0 !important;
    font-family: 'Inter', sans-serif !important;
    position: relative !important;
    overflow: hidden !important;
  }

  #ace-footer::before {
    content: '' !important;
    position: absolute !important;
    top: -60px !important; right: -60px !important;
    width: 300px !important; height: 300px !important;
    background: radial-gradient(circle, rgba(56,182,232,0.08), transparent 70%) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
  }

  .ace-footer-inner {
    display: grid !important;
    grid-template-columns: 2fr 1fr 1.2fr 1fr !important;
    gap: 40px !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
    padding-bottom: 48px !important;
    position: relative !important;
    z-index: 1 !important;
  }

  .ace-footer-brand p {
    font-size: 0.85rem !important;
    color: rgba(255,255,255,0.45) !important;
    line-height: 1.75 !important;
    margin: 12px 0 20px !important;
    max-width: 240px !important;
  }

  .ace-footer-logo-text {
    font-family: 'Inter', sans-serif !important;
    font-size: 1.2rem !important; font-weight: 900 !important;
    color: var(--white) !important; letter-spacing: -0.02em !important;
  }

  .ace-footer-logo-text span { color: var(--sky) !important; }
  .ace-footer-social { display: flex !important; gap: 10px !important; }

  .ace-social-btn {
    width: 38px !important; height: 38px !important;
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    border-radius: 8px !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    color: rgba(255,255,255,0.5) !important;
    text-decoration: none !important;
    transition: all 0.2s !important;
  }

  .ace-social-btn svg { width: 16px !important; height: 16px !important; }

  .ace-social-btn:hover {
    background: var(--sky) !important; border-color: var(--sky) !important;
    color: var(--white) !important; transform: translateY(-2px) !important;
  }

  #ace-footer h4 {
    font-family: 'Inter', sans-serif !important;
    font-size: 0.68rem !important; font-weight: 700 !important;
    letter-spacing: 0.1em !important; text-transform: uppercase !important;
    color: rgba(255,255,255,0.35) !important;
    margin: 0 0 16px !important;
  }

  .ace-footer-hours {
    list-style: none !important; padding: 0 !important; margin: 0 !important;
    display: flex !important; flex-direction: column !important; gap: 8px !important;
  }

  .ace-footer-hours li {
    display: flex !important; justify-content: space-between !important;
    gap: 8px !important; font-size: 0.82rem !important;
  }

  .ace-footer-hours li span:first-child { color: rgba(255,255,255,0.6) !important; }
  .ace-footer-hours li span:last-child { color: rgba(255,255,255,0.85) !important; font-weight: 500 !important; }

  .ace-footer-contact {
    list-style: none !important; padding: 0 !important; margin: 0 !important;
    display: flex !important; flex-direction: column !important; gap: 12px !important;
  }

  .ace-footer-contact li {
    display: flex !important; align-items: flex-start !important;
    gap: 10px !important; font-size: 0.82rem !important;
    color: rgba(255,255,255,0.6) !important; line-height: 1.5 !important;
  }

  .ace-footer-contact svg {
    width: 15px !important; height: 15px !important;
    stroke: var(--sky) !important; flex-shrink: 0 !important; margin-top: 2px !important;
  }

  .ace-footer-contact a { color: rgba(255,255,255,0.75) !important; text-decoration: none !important; transition: color 0.2s
   !important; }
  .ace-footer-contact a:hover { color: var(--sky) !important; }

  .ace-footer-links {
    list-style: none !important; padding: 0 !important; margin: 0 !important;
    display: flex !important; flex-direction: column !important; gap: 8px !important;
  }

  .ace-footer-links a {
    font-size: 0.85rem !important; color: rgba(255,255,255,0.55) !important;
    text-decoration: none !important; transition: all 0.2s !important; display: inline-block !important;
  }

  .ace-footer-links a:hover { color: var(--sky) !important; transform: translateX(4px) !important; }

  .ace-footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.07) !important;
    padding: 20px 0 !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    font-size: 0.75rem !important;
    color: rgba(255,255,255,0.28) !important;
    position: relative !important; z-index: 1 !important;
  }

  .ace-footer-bottom a { color: var(--sky) !important; text-decoration: none !important; font-weight: 500 !important; }

  footer {
    background: rgba(15,29,86,0.95) !important;
    border-top: none !important; padding: 12px 24px !important;
  }

  footer div, footer p, footer span {
    font-family: 'Inter', sans-serif !important;
    color: rgba(255,255,255,0.2) !important; font-size: 0.7rem !important;
  }

  /* ============================================
     GLOBAL
     ============================================ */
  a { color: var(--sky) !important; text-decoration: none !important; transition: color 0.2s !important; }
  a:hover { color: var(--sky-dim) !important; }
  ::-webkit-scrollbar { width: 7px; }
  ::-webkit-scrollbar-track { background: var(--off); }
  ::-webkit-scrollbar-thumb { background: #c8d9ee; border-radius: 4px; }
  ::-webkit-scrollbar-thumb:hover { background: var(--sky); }
  ::selection { background: rgba(56,182,232,0.18); color: var(--navy); }

  /* ============================================
     TABLET — max-width: 768px
     ============================================ */
  @media (max-width: 768px) {

    /* Header — stack logo above contact */
    header { padding: 14px 18px !important; }

    header > div {
      flex-direction: column !important;
      align-items: flex-start !important;
      gap: 10px !important;
    }

    header img,
    header .agencyLogo img,
    header > div > img,
    header > div > a > img,
    header > div > div:first-child img {
      height: 46px !important;
      max-width: 160px !important;
    }

    .AgencyContactInfoContainer {
      text-align: left !important;
      padding: 8px 12px !important;
      width: 100% !important;
    }

    /* Nav — scrollable row, hide "Visit Website" text label */
    #ace-nav { padding: 0 12px !important; }
    .ace-nav-inner { height: 40px !important; }
    .ace-nav-link { font-size: 0.76rem !important; padding: 5px 9px !important; }
    .ace-nav-cta { font-size: 0.72rem !important; padding: 5px 10px !important; }

    /* Greeting */
    .description { padding: 28px 18px 16px !important; }

    #GreetingTxt p:first-child strong {
      font-size: 1.8rem !important;
      letter-spacing: -0.03em !important;
    }

    #GreetingTxt p:nth-child(2) span { font-size: 0.95rem !important; }

    /* Trust badge — wrap to 2 per row */
    #ace-trust { gap: 8px !important; }
    .ace-trust-dot { display: none !important; }

    /* Social proof — 2x2 grid */
    #ace-proof { padding: 0 16px !important; }

    .ace-proof-inner {
      display: grid !important;
      grid-template-columns: 1fr 1fr !important;
      height: auto !important;
      padding: 16px 0 !important;
      gap: 0 !important;
    }

    .ace-proof-divider { display: none !important; }

    .ace-proof-item {
      padding: 12px 8px !important;
      border-bottom: 1px solid rgba(255,255,255,0.06) !important;
    }

    .ace-proof-item:nth-child(odd) {
      border-right: 1px solid rgba(255,255,255,0.06) !important;
    }

    .ace-proof-num { font-size: 1.2rem !important; }
    .ace-proof-label { font-size: 0.65rem !important; }

    /* Step title */
    .stepTitle { font-size: 1.45rem !important; margin-bottom: 20px !important; }

    /* Primary cards — stack vertically */
    #selectLines {
      flex-direction: column !important;
      align-items: center !important;
      gap: 10px !important;
    }

    #selectLines .inputPanel {
      flex-direction: row !important;
      max-width: 100% !important;
      width: 100% !important;
      padding: 18px 20px !important;
      gap: 16px !important;
      justify-content: flex-start !important;
      border-radius: 12px !important;
    }

    #selectLines .panelTitle {
      order: 0 !important;
      font-size: 1rem !important;
      text-align: left !important;
    }

    #selectLines .panelImage {
      order: -1 !important;
      flex-shrink: 0 !important;
    }

    #selectLines .panelImage img { width: 36px !important; height: 36px !important; }

    /* Multi card */
    .multiImage { gap: 2px !important; }
    #selectLines .panelImage #multiCar,
    #selectLines .panelImage #multiHome { width: 28px !important; height: 28px !important; }

    /* Secondary buttons — stay 2-col */
    .addlCovList {
      grid-template-columns: repeat(2, 1fr) !important;
      gap: 8px !important;
    }

    #additionalLines .inputPanel { padding: 10px 12px !important; gap: 8px !important; }
    #additionalLines .panelTitle { font-size: 0.82rem !important; }
    #additionalLines .panelImage { width: 30px !important; height: 30px !important; min-width: 30px !important; }
    #additionalLines .panelImage img { width: 16px !important; height: 16px !important; }

    /* Footer — single column */
    #ace-footer { padding: 36px 18px 0 !important; }

    .ace-footer-inner {
      grid-template-columns: 1fr !important;
      gap: 28px !important;
      padding-bottom: 32px !important;
    }

    .ace-footer-brand p { max-width: 100% !important; }

    .ace-footer-bottom {
      flex-direction: column !important;
      gap: 8px !important;
      text-align: center !important;
      padding: 16px 0 !important;
    }
  }

  /* ============================================
     MOBILE — max-width: 480px
     ============================================ */
  @media (max-width: 480px) {

    /* Header */
    header { padding: 12px 14px !important; }

    header img,
    header .agencyLogo img,
    header > div > img,
    header > div > a > img {
      height: 38px !important;
      max-width: 130px !important;
    }

    .AgencyAddressLabel,
    .AgencyCityStateZipLabel { display: none !important; }

    /* Nav — hide "Visit Website" text, show just icon */
    .ace-nav-cta span { display: none !important; }
    .ace-nav-cta { padding: 6px 10px !important; }
    .ace-nav-link { font-size: 0.72rem !important; padding: 5px 7px !important; }

    /* Greeting */
    .description { padding: 22px 14px 14px !important; }

    #GreetingTxt p:first-child strong {
      font-size: 1.5rem !important;
      letter-spacing: -0.03em !important;
    }

    #GreetingTxt p:nth-child(2) span { font-size: 0.88rem !important; }

    .ace-trust-item { font-size: 0.72rem !important; }

    /* Social proof — compact */
    .ace-proof-num { font-size: 1.1rem !important; }
    .ace-proof-label { font-size: 0.6rem !important; }

    /* Step title */
    .stepTitle { font-size: 1.25rem !important; }

    /* Container */
    #container { padding: 24px 12px 48px !important; }

    /* Primary cards */
    #selectLines { gap: 8px !important; }

    #selectLines .inputPanel {
      padding: 14px 16px !important;
      border-radius: 10px !important;
    }

    #selectLines .panelTitle { font-size: 0.92rem !important; }
    #selectLines .panelImage img { width: 30px !important; height: 30px !important; }

    /* Secondary — full width single column */
    .addlCovList {
      grid-template-columns: 1fr !important;
      gap: 7px !important;
      max-width: 100% !important;
    }

    /* Footer */
    #ace-footer { padding: 28px 14px 0 !important; }
    .ace-footer-inner { gap: 22px !important; }
    .ace-footer-logo-text { font-size: 1rem !important; }
  }