/* v315G — mobile-only follow-up polish.
   Fixes: Home Quick Fee Check readability, restores mobile visual interest on Home,
   and hardens chatbot open state so it always fits within the viewport.
   Desktop remains untouched because every rule is inside mobile breakpoints. */

@media (max-width: 820px) {
  /* Home hero: restore visual interest on mobile instead of a text-only first fold. */
  .home-page .hero-plane-stage-v295G {
    display: block !important;
    height: 108px !important;
    margin: 0 0 10px !important;
    overflow: visible !important;
  }

  .home-page .hero-plane-image-v295G {
    width: min(210px, 58vw) !important;
    right: 6px !important;
    top: 2px !important;
  }

  .home-page .hero-plane-wind-v295G {
    opacity: .42 !important;
    right: min(48vw, 180px) !important;
  }

  .home-page .hero-plane-wind-v295G.wind-a {
    top: 36px !important;
    width: min(116px, 32vw) !important;
  }

  .home-page .hero-plane-wind-v295G.wind-b {
    top: 52px !important;
    width: min(88px, 24vw) !important;
    right: min(50vw, 188px) !important;
  }

  .home-page .hero-plane-wind-v295G.wind-c {
    top: 68px !important;
    width: min(64px, 18vw) !important;
    right: min(52vw, 198px) !important;
  }

  .home-page .home-hero-side-stack-v295G {
    gap: 12px !important;
  }

  /* Quick Fee Check readability: fix washed-out light blue text. */
  .home-page .home-fee-preview-card .compact-fee-head p,
  .home-page .home-fee-preview-card .compact-fee-summary,
  .home-page .home-fee-preview-card .fee-note,
  .home-page .home-fee-preview-card .compact-total span {
    color: #5a6f8e !important;
    opacity: 1 !important;
  }

  .home-page .home-fee-preview-card .compact-fee-summary,
  .home-page .home-fee-preview-card .fee-note {
    line-height: 1.5 !important;
  }

  .home-page .home-fee-preview-card .compact-fee-head h2,
  .home-page .home-fee-preview-card .compact-total strong {
    color: #11203a !important;
  }

  .home-page .home-fee-preview-card {
    background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(247,250,255,.98) 100%) !important;
  }

  /* Surface imagery on Home earlier and make image blocks feel more intentional. */
  .home-page .home-fees-teaser .grid.two,
  .home-page .home-visa-info-teaser .grid.two {
    gap: 14px !important;
  }

  .home-page .home-fees-teaser .home-image-panel,
  .home-page .home-visa-info-teaser .home-image-panel {
    order: -1 !important;
    margin-bottom: 2px !important;
  }

  .home-page .home-image-panel,
  .home-page .home-addon-image {
    display: block !important;
  }

  .home-page .home-image-panel img,
  .home-page .home-addon-image img {
    display: block !important;
    width: 100% !important;
    height: 210px !important;
    max-height: 210px !important;
    object-fit: cover !important;
    border-radius: 20px !important;
    box-shadow: 0 18px 38px rgba(15, 23, 42, .10) !important;
  }

  /* Chatbot: keep the opened panel fully inside mobile viewport so the close button is always visible. */
  .vge-chatbot-root.is-open {
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    top: auto !important;
    width: 100% !important;
  }

  .vge-chatbot-root.is-open .vge-chatbot-panel,
  .vge-chatbot-root.is-open .vge-chatbot-panel-minimal,
  .vge-chatbot-panel {
    position: fixed !important;
    left: 10px !important;
    right: 10px !important;
    top: max(10px, env(safe-area-inset-top, 0px)) !important;
    bottom: max(10px, env(safe-area-inset-bottom, 0px)) !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    border-radius: 20px !important;
    overflow: hidden !important;
  }

  .vge-chatbot-root.is-open .vge-chatbot-header,
  .vge-chatbot-root.is-open .vge-chatbot-form,
  .vge-chatbot-root.is-open .vge-chatbot-note,
  .vge-chatbot-root.is-open .vge-chatbot-quick-wrap {
    flex: 0 0 auto !important;
  }

  .vge-chatbot-root.is-open .vge-chatbot-messages,
  .vge-chatbot-messages {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
  }

  .vge-chatbot-root.is-open .vge-chatbot-header {
    padding-top: 14px !important;
  }

  .vge-chatbot-root.is-open .vge-chatbot-close {
    width: 36px !important;
    height: 36px !important;
    flex: 0 0 36px !important;
  }

  body.vge-chatbot-is-open {
    overflow: hidden !important;
  }
}

@media (max-width: 480px) {
  .home-page .hero-plane-stage-v295G {
    height: 92px !important;
    margin-bottom: 8px !important;
  }

  .home-page .hero-plane-image-v295G {
    width: min(182px, 56vw) !important;
    right: 2px !important;
    top: 4px !important;
  }

  .home-page .hero-plane-wind-v295G.wind-a {
    top: 32px !important;
  }

  .home-page .hero-plane-wind-v295G.wind-b {
    top: 46px !important;
  }

  .home-page .hero-plane-wind-v295G.wind-c {
    top: 60px !important;
  }

  .home-page .home-image-panel img,
  .home-page .home-addon-image img {
    height: 190px !important;
    max-height: 190px !important;
    border-radius: 18px !important;
  }

  .vge-chatbot-root.is-open .vge-chatbot-panel,
  .vge-chatbot-root.is-open .vge-chatbot-panel-minimal,
  .vge-chatbot-panel {
    left: 8px !important;
    right: 8px !important;
    top: max(8px, env(safe-area-inset-top, 0px)) !important;
    bottom: max(8px, env(safe-area-inset-bottom, 0px)) !important;
    border-radius: 18px !important;
  }

  .vge-chatbot-root.is-open .vge-chatbot-header {
    padding: 12px 12px 10px !important;
  }

  .vge-chatbot-root.is-open .vge-chatbot-messages {
    padding: 12px !important;
  }

  .vge-chatbot-root.is-open .vge-chatbot-form {
    padding: 10px !important;
  }
}