/* ═══════════════════════════════════════════════════════════════
   Myhna Vistara | responsive.css
   Single source for ALL @media rules — load LAST after all other
   CSS files so source-order wins over equal-specificity base rules.
   ═══════════════════════════════════════════════════════════════ */

/* ── MIN-WIDTH: 1200px (Desktop max-width container) ── */
@media (min-width: 1200px){

  /* LAYOUT — constrain all content sections to 1280px max */
  .nav-inner,
  .stats,
  .trust-bar,
  .overview-grid,
  .am-grid,
  .am-head,
  .am-foot,
  .plans-head,
  .plans-tabs,
  .plans-content,
  .plan-price-banner,
  .loc-top,
  .tl-inner,
  .loc-cta-inner,
  .faq-head,
  .faq-list,
  .footer-top,
  .footer-bottom{
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
  }

}

/* ── MAX-WIDTH: 1280px (Large viewport compression) ── */
@media (max-width: 1280px){

  /* LAYOUT */
  .nav, .stats, .location,
  .overview, .amenities, .plans, .faq, .footer{ padding-left: 48px; padding-right: 48px; }
  .nav-links{ gap: 28px; }
  .hero-left{ padding: 0 48px; }
  .hero-form-card{ right: 48px; width: 340px; padding: 32px 28px 26px; }
  .hero-bottom-bar{ padding: 0 48px; height: 76px; }
  .hero-bottom-col{ padding: 0 32px; }
  .hero-addr, .hero-watch{ left: 48px; right: 48px; }
  .hero-watch{ left: auto; right: 48px; }
  .hero-addr{ right: auto; left: 48px; }
  .section-h, .overview-h, .am-head .section-h, .plans-h, .faq-h{ font-size: 52px; }
  .am-grid{ grid-template-columns: repeat(3, 1fr); }
  .footer-top{ grid-template-columns: 1.4fr 1fr 1fr; }
  .footer-col.contact{ display: none; }

}

/* ── MAX-WIDTH: 1024px (Tablet landscape) ── */
@media (max-width: 1024px){

  /* LAYOUT */
  .hero{ height: auto; min-height: 100vh; padding-bottom: 0; }
  .hero-left{ width: 100%; padding: 110px 32px 40px; }
  .hero-form-card{
    position: relative;
    right: auto; top: auto; transform: none;
    width: calc(100% - 48px);
    max-width: 480px;
    margin: 0 auto 120px;
    animation: heroFadeUpSm 1s ease 0.3s both;
  }
  .hero-bottom-bar{ padding: 0 24px; height: auto; flex-wrap: wrap; }
  .hero-bottom-col{ padding: 14px 16px; flex: 1 1 50%; border-left: 0; }
  .hero-bottom-col:nth-child(3){ display: none; }
  .hero-addr, .hero-watch, .scroll-cue{ display: none; }
  .lead-panel{ width: 100%; padding: 68px 28px 32px; }
  .stats{ grid-template-columns: repeat(5, 1fr); }
  .nav-links{ display:none; }
  .overview-grid, .plans-content, .faq-head{ grid-template-columns: 1fr; gap: 40px; }
  .overview-facts{ grid-template-columns: 1fr 1fr; }
  .am-grid{ grid-template-columns: repeat(3, 1fr); }
  .am-head{ flex-direction: column; align-items: flex-start; gap: 24px; }
  .plans-head{ flex-direction: column; align-items: flex-start; gap: 24px; }
  .footer-top{ grid-template-columns: 1fr 1fr; gap: 40px; }
  .footer-col.contact{ display: block; }

  /* HOME PAGE (overrides layout above for home-section classes) */
  .hero{ height: auto; min-height: 100vh; padding-bottom: 0; flex-direction: column; align-items: stretch; }
  .hero-left{ width: 100% !important; max-width: none !important; padding: 110px 32px 40px; }
  .hero-form-card{
    position: relative;
    right: auto; top: auto; transform: none;
    width: calc(100% - 48px);
    max-width: 480px;
    margin: 0 auto 120px;
    animation: heroFadeUpSm 1s ease 0.3s both;
  }
  .hero-bottom-bar{ padding: 0 24px; height: auto; flex-wrap: wrap; }
  .hero-bottom-col{ padding: 14px 16px; flex: 1 1 50%; border-left: 0; }
  .hero-bottom-col:nth-child(3){ display: none; }
  .hero-addr, .hero-watch, .scroll-cue{ display: none; }
  .stats{ grid-template-columns: repeat(5, 1fr); }
  .overview-grid, .plans-content, .faq-head{ grid-template-columns: 1fr; gap: 40px; }
  .overview-facts{ grid-template-columns: 1fr 1fr; }
  .am-grid{ grid-template-columns: repeat(3, 1fr); }
  .am-head{ flex-direction: column; align-items: flex-start; gap: 24px; }
  .plans-head{ flex-direction: column; align-items: flex-start; gap: 24px; }

}

/* ── MAX-WIDTH: 768px (Tablet & large phone) ── */
@media (max-width: 768px){

  /* MISSING MOBILE SAFETY (Step 5) */
  html, body{ overflow-x: hidden; max-width: 100%; }

  /* LAYOUT — nav */
  .nav{ padding: 0 16px; height: 60px; }
  .nav-phone{ display: none; }
  .nav-right .cta-gold{ display: none; }
  .nav-burger{ display: block; }
  .nav-right{ gap: 10px; }
  .logo img{ height: 44px; }
  .logo-text .top{ font-size: 8px; }
  .logo-text .bottom{ font-size: 16px; }

  /* LAYOUT — hero */
  .hero{ padding-top: 60px; min-height: 0; }
  .hero-left{ padding: 60px 24px 32px; }
  .hero-h1{ font-size: 44px !important; line-height: 1.08; }
  .hero-rule{ margin: 20px 0; }
  .hero-sub{ font-size: 12px; line-height: 1.7; letter-spacing: 0.06em; margin-bottom: 24px; }
  .trust-row{ gap: 8px; }
  .trust-pill{ padding: 8px 14px; font-size: 10px; letter-spacing: 0.08em; }
  .hero-cta{ flex-direction: column; gap: 10px; margin-top: 24px; align-items: stretch; }
  .hero-cta a,
  .hero-cta button,
  .hero-cta-primary,
  .hero-cta-secondary { width: 100%; max-width: 360px; min-width: 0; padding: 13px 22px; font-size: 12px; letter-spacing: 0.12em; }
  .hero-cta-note{ font-size: 13px; margin-top: 16px; }
  .hero-form-card{ padding: 28px 22px 24px; margin-bottom: 24px; max-width: none; width: calc(100% - 32px); }
  .hero-form-card .form-fields{ gap: 8px; }
  .hero-row-2{ grid-template-columns: 1fr; gap: 8px; }
  .hero-row-2 .field-ic input{ padding-left: 38px; }
  .hero-row-2 .field-ic > svg{ display: block; left: 14px; }
  .hero-bottom-bar{ padding: 0; flex-direction: column; border-top: 0; position: relative; }
  .hero-bottom-col{
    padding: 14px 24px !important;
    flex: 1 1 100% !important;
    border-left: 0;
    border-top: 1px solid rgba(255,255,255,0.10);
    text-align: left;
  }
  .hero-bottom-col:first-child{ border-top: 0; }
  .hero-bottom-col:nth-child(3){ display: flex !important; }
  .hero-bottom-col .lab{ font-size: 10px; margin-bottom: 4px; }
  .hero-bottom-col .val{ font-size: 16px !important; }

  /* LAYOUT — stats */
  .stats{
    grid-template-columns: 1fr 1fr;
    padding: 28px 20px;
    row-gap: 28px;
    column-gap: 18px;
  }
  .stat + .stat::before{ display: none; }
  .stat:last-child{ grid-column: 1 / -1; }
  .stat-value{ font-size: 36px !important; }
  .stat-label{ font-size: 10px; letter-spacing: 0.16em; margin-top: 6px; }

  /* LAYOUT — trust bar */
  .trust-bar{
    grid-template-columns: 1fr 1fr;
    height: auto;
  }
  .tb-item{
    padding: 16px 18px;
    border-bottom: 1px solid rgba(90, 70, 30, 0.08);
  }
  .tb-item:nth-child(2){ border-left: 1px solid rgba(90, 70, 30, 0.08); }
  .tb-item:nth-child(3){ border-bottom: 0; border-left: 0; }
  .tb-item:nth-child(4){ border-bottom: 0; border-left: 1px solid rgba(90, 70, 30, 0.08); }
  .tb-stat{ font-size: 12px; white-space: normal; }
  .tb-sub{ font-size: 10.5px; white-space: normal; }
  .tb-ic{ width: 20px; height: 20px; flex: 0 0 20px; }
  .tb-live{
    width: 100%;
    align-self: stretch;
    justify-content: center;
    font-size: 10.5px;
    padding: 4px 10px;
    margin-top: 8px;
  }

  /* LAYOUT — shared section padding */
  .overview, .amenities, .plans, .location, .faq{ padding: 64px 24px !important; }
  .section-h{ font-size: 36px !important; line-height: 1.1; }
  .section-eyebrow{ font-size: 11px; gap: 12px; margin-bottom: 20px; }
  .section-eyebrow .rule{ width: 22px; }

  /* LAYOUT — overview */
  .overview-grid{ gap: 36px; }
  .overview-body{ font-size: 15px !important; line-height: 1.7; }
  .overview-quote{ font-size: 18px !important; padding-left: 16px; }
  .overview-facts{ grid-template-columns: 1fr; gap: 22px 20px; padding: 24px 0; }
  .fact-num{ font-size: 32px !important; }
  .fact-num .small{ font-size: 16px; }
  .fact-label{ font-size: 10px; margin-top: 8px; }
  .fact-desc{ font-size: 13px; margin-top: 6px; }

  /* LAYOUT — amenities */
  .am-grid{ grid-template-columns: 1fr 1fr; }
  .am-card{ min-height: 0; padding: 22px 18px; gap: 10px; }
  .am-card i{ font-size: 26px; }
  .am-card .name{ font-size: 17px !important; }
  .am-card .desc{ font-size: 13px; line-height: 1.55; }
  .am-card .num{ font-size: 10px; padding-top: 10px; }
  .am-sub{ font-size: 14px; }
  .am-foot{ flex-direction: column; align-items: flex-start; gap: 16px; }
  .am-foot-left{ font-size: 18px !important; line-height: 1.4; }
  .am-foot-cta{ padding: 14px 22px; font-size: 10px; }

  /* LAYOUT — floor plans */
  .plans-tabs{ overflow-x: auto; flex-wrap: nowrap; }
  .plan-price-banner{
    flex-direction: column;
    align-items: stretch;
    gap: 18px;
    padding: 22px 22px;
  }
  .plan-price-banner .pb-title{ font-size: 20px; }
  .plan-price-banner .pb-sub{ font-size: 13px; }
  .plan-price-banner .pb-cta{ width: 100%; }
  .plans-tab{ flex: 0 0 auto; padding: 16px 18px; min-width: 130px; }
  .plans-tab .name{ font-size: 18px !important; }
  .plans-tab .typ{ font-size: 9px; margin-top: 6px; }
  .plans-info .typology{ font-size: 32px !important; }
  .typo-blurb{ font-size: 14px; }
  .unit-row{ padding: 14px 0 12px; }
  .unit-row .typ-name, .unit-row .price{ font-size: 18px !important; }
  .unit-row .size{ font-size: 12px; }
  .plans-cta-row{ flex-direction: column; }
  .plans-image{ padding: 18px; }
  .plans-image .tag, .plans-image .compass{ font-size: 9px; padding: 7px 12px; }
  .plans-sub{ font-size: 14px; }

  /* LAYOUT — footer social */
  .footer-social .social-icons{ justify-content: center; }

  /* LAYOUT — location */
  .loc-top{ flex-direction: column; align-items: flex-start; gap: 12px; }
  .loc-addr{ font-size: 14px; }
  .loc-maps{ padding: 12px 22px; font-size: 10px; }
  .dist-time{ font-size: 32px !important; }
  .dist-time .unit{ font-size: 11px; margin-left: 6px; }
  .dist-place{ font-size: 13px; }

  /* LAYOUT — faq */
  .faq-head{ gap: 24px; margin-bottom: 32px; }
  .faq-sub{ font-size: 14px; }
  .faq-answer{ font-size: 14px; padding: 0 0 24px; }

  /* LAYOUT — location CTA band */
  .loc-cta{ padding: 56px 20px; }
  .loc-cta-h{ font-size: 28px !important; }
  .loc-cta-sub{ font-size: 19px !important; }
  .loc-cta-body{ font-size: 14px; }
  .loc-cta-btn{ width: 100%; max-width: 360px; min-width: 0; padding: 13px 22px; font-size: 12px; }
  .loc-cta-meta{ font-size: 11px; gap: 6px 10px; }
  .loc-cta-eyebrow::before, .loc-cta-eyebrow::after{ width: 16px; }

  /* LAYOUT — footer */
  .footer{ padding: 60px 24px 24px; text-align: center; }
  .footer-top{ grid-template-columns: 1fr; gap: 36px; padding-bottom: 32px; }
  .footer-bottom{ flex-direction: column; gap: 20px; text-align: center; align-items: center; }
  .ft-parent-logo{ margin: 0 auto; }
  .ft-badges{ justify-content: center; }
  .footer-social .social-icons{ justify-content: center; }
  .ft-addr{ margin: 0 auto; }

  /* LAYOUT — lead panel */
  .lead-panel{ padding: 56px 22px 24px; }
  .form-title{ font-size: 26px; }
  .field input, .field .country-code{ font-size: 13px; }

  /* LAYOUT — sticky bottom bar */
  .sticky-bar{ height: 60px; }
  .sticky-bar a,
  .sticky-bar button{
    flex-direction: column;
    gap: 4px;
    padding: 8px 6px;
  }
  .sticky-bar .ic{ width: 18px; height: 18px; flex: 0 0 18px; }
  .sticky-bar .lbl{ align-items: center; text-align: center; }
  .sticky-bar .lbl .title{ font-size: 10px; letter-spacing: 0.08em; }
  .sticky-bar .lbl .sub{ display: none; }
  .sticky-bar .sb-book{
    height: 68px;
    margin-top: -8px;
    min-width: 0;
    flex: 1.1 0 0;
    padding: 0 14px;
    font-size: 11px;
    letter-spacing: 0.12em;
    border-radius: 8px 8px 0 0;
    gap: 6px;
  }
  .sticky-bar .sb-book .arrow{ display: none; }
  body.sticky-active .footer{ padding-bottom: 80px; }

  /* HOME PAGE — hero (overrides layout above) */
  .hero{ padding-top: 60px; min-height: 0; }
  .hero-left{ padding: 60px 24px 32px; }
  .hero-h1{ font-size: 44px !important; line-height: 1.08; }
  .hero-rule{ margin: 20px 0; }
  .hero-sub{ font-size: 12px; line-height: 1.7; letter-spacing: 0.06em; margin-bottom: 24px; }
  .trust-row{ gap: 8px; }
  .trust-pill{ padding: 8px 14px; font-size: 10px; letter-spacing: 0.08em; }
  .hero-cta{ flex-direction: column; gap: 10px; margin-top: 24px; align-items: stretch; }
  .hero-cta a,
  .hero-cta button,
  .hero-cta-primary,
  .hero-cta-secondary { width: 100%; max-width: 360px; min-width: 0; padding: 13px 22px; font-size: 12px; letter-spacing: 0.12em; }
  .hero-cta-note{ font-size: 13px; margin-top: 16px; }
  .hero-form-card{ padding: 28px 22px 24px; margin-bottom: 24px; max-width: none; width: calc(100% - 32px); }
  .hero-form-card .form-fields{ gap: 8px; }
  .hero-row-2{ grid-template-columns: 1fr; gap: 8px; }
  .hero-row-2 .field-ic input{ padding-left: 38px; }
  .hero-row-2 .field-ic > svg{ display: block; left: 14px; }
  .hero-bottom-bar{ padding: 0; flex-direction: column; border-top: 0; position: relative; }
  .hero-bottom-col{
    padding: 14px 24px !important;
    flex: 1 1 100% !important;
    border-left: 0;
    border-top: 1px solid rgba(255,255,255,0.10);
    text-align: left;
  }
  .hero-bottom-col:first-child{ border-top: 0; }
  .hero-bottom-col:nth-child(3){ display: flex !important; }
  .hero-bottom-col .lab{ font-size: 10px; margin-bottom: 4px; }
  .hero-bottom-col .val{ font-size: 16px !important; }

  /* HOME PAGE — stats */
  .stats{
    grid-template-columns: 1fr 1fr;
    padding: 28px 20px;
    row-gap: 28px;
    column-gap: 18px;
  }
  .stat + .stat::before{ display: none; }
  .stat:last-child{ grid-column: 1 / -1; }
  .stat-value{ font-size: 36px !important; }
  .stat-label{ font-size: 10px; letter-spacing: 0.16em; margin-top: 6px; }

  /* HOME PAGE — trust bar */
  .trust-bar{
    grid-template-columns: 1fr 1fr;
    height: auto;
  }
  .tb-item{
    padding: 16px 18px;
    border-bottom: 1px solid rgba(90, 70, 30,0.08);
  }
  .tb-item:nth-child(2){ border-left: 1px solid rgba(90, 70, 30,0.08); }
  .tb-item:nth-child(3){ border-bottom: 0; border-left: 0; }
  .tb-item:nth-child(4){ border-bottom: 0; border-left: 1px solid rgba(90, 70, 30,0.08); }
  .tb-stat{ font-size: 12px; white-space: normal; }
  .tb-sub{ font-size: 10.5px; white-space: normal; }
  .tb-ic{ width: 20px; height: 20px; flex: 0 0 20px; }
  .tb-live{
    width: 100%;
    align-self: stretch;
    justify-content: center;
    font-size: 10.5px;
    padding: 4px 10px;
    margin-top: 8px;
  }

  /* HOME PAGE — shared section padding */
  .overview, .amenities, .plans, .location, .faq{ padding: 64px 24px !important; }
  .section-h{ font-size: 36px !important; line-height: 1.1; }
  .section-eyebrow{ font-size: 11px; gap: 12px; margin-bottom: 20px; }
  .section-eyebrow .rule{ width: 22px; }

  /* HOME PAGE — overview */
  .overview-grid{ gap: 36px; }
  .overview-body{ font-size: 15px !important; line-height: 1.7; }
  .overview-quote{ font-size: 18px !important; padding-left: 16px; }
  .overview-facts{ grid-template-columns: 1fr; gap: 22px 20px; padding: 24px 0; }
  .fact-num{ font-size: 32px !important; }
  .fact-num .small{ font-size: 16px; }
  .fact-label{ font-size: 10px; margin-top: 8px; }
  .fact-desc{ font-size: 13px; margin-top: 6px; }

  /* HOME PAGE — amenities */
  .am-grid{ grid-template-columns: 1fr 1fr; }
  .am-card{ min-height: 0; padding: 22px 18px; gap: 10px; }
  .am-card i{ font-size: 26px; }
  .am-card .name{ font-size: 17px !important; }
  .am-card .desc{ font-size: 13px; line-height: 1.55; }
  .am-card .num{ font-size: 10px; padding-top: 10px; }
  .am-sub{ font-size: 14px; }
  .am-foot{ flex-direction: column; align-items: flex-start; gap: 16px; }
  .am-foot-left{ font-size: 18px !important; line-height: 1.4; }
  .am-foot-cta{ padding: 14px 22px; font-size: 10px; }

  /* HOME PAGE — floor plans */
  .plans-tabs{ overflow-x: auto; flex-wrap: nowrap; }
  .plan-price-banner{
    flex-direction: column;
    align-items: stretch;
    gap: 18px;
    padding: 22px 22px;
  }
  .plan-price-banner .pb-title{ font-size: 20px; }
  .plan-price-banner .pb-sub{ font-size: 13px; }
  .plan-price-banner .pb-cta{ width: 100%; }
  .plans-tab{ flex: 0 0 auto; padding: 16px 18px; min-width: 130px; }
  .plans-tab .name{ font-size: 18px !important; }
  .plans-tab .typ{ font-size: 9px; margin-top: 6px; }
  .plans-info .typology{ font-size: 32px !important; }
  .typo-blurb{ font-size: 14px; }
  .unit-row{ padding: 14px 0 12px; }
  .unit-row .typ-name, .unit-row .price{ font-size: 18px !important; }
  .unit-row .size{ font-size: 12px; }
  .plans-cta-row{ flex-direction: column; }
  .plans-image{ padding: 18px; }
  .plans-image .tag, .plans-image .compass{ font-size: 9px; padding: 7px 12px; }
  .plans-sub{ font-size: 14px; }

  /* HOME PAGE — footer social */
  .footer-social .social-icons{ justify-content: center; }

  /* HOME PAGE — location */
  .loc-top{ flex-direction: column; align-items: flex-start; gap: 12px; }
  .loc-addr{ font-size: 14px; }
  .loc-maps{ padding: 12px 22px; font-size: 10px; }
  .dist-time{ font-size: 32px !important; }

  /* connectivity timeline — matches index.html's mobile #connTimeline override */
  .masterplan-strip{ margin-bottom: 20px; }
  .tl{ margin-top: 40px; }
  .tl-tabs{ gap: 4px; }
  .tl-tab{ font-size: 16px; padding: 9px 12px; gap: 7px; }
  .tl-tab svg{ width: 18px; height: 18px; }
  .tl-journey{ height: auto; padding: 8px 0 8px 24px; }
  .tl-line{ top: 8px; bottom: 8px; left: 7px; right: auto; width: 2px; height: auto; transform: none; }
  .tl-nodes{ position: static; display: flex; flex-direction: column; gap: 22px; }
  .tl-node{ position: static; transform: none; width: auto; text-align: left; display: flex; align-items: baseline; gap: 14px; }
  .tl-node .dot{ position: static; margin: 0; order: -1; flex: 0 0 14px; align-self: center; }
  .tl-node .body{ position: static; }
  .tl-node .num{ font-size: 34px; }
  .tl-node .place{ margin-top: 2px; }
  .dist-time .unit{ font-size: 11px; margin-left: 6px; }
  .dist-place{ font-size: 13px; }

  /* HOME PAGE — faq */
  .faq-head{ gap: 24px; margin-bottom: 32px; }
  .faq-sub{ font-size: 14px; }
  .faq-answer{ font-size: 14px; padding: 0 0 24px; }

  /* HOME PAGE — location CTA band */
  .loc-cta{ padding: 56px 20px; }
  .loc-cta-h{ font-size: 28px !important; }
  .loc-cta-sub{ font-size: 19px !important; }
  .loc-cta-body{ font-size: 14px; }
  .loc-cta-btn{ width: 100%; max-width: 360px; min-width: 0; padding: 13px 22px; font-size: 12px; }
  .loc-cta-meta{ font-size: 11px; gap: 6px 10px; }
  .loc-cta-eyebrow::before, .loc-cta-eyebrow::after{ width: 16px; }

}

/* ── MAX-WIDTH: 767px (Popup slide-up + floor plan overlay) ── */
@media(max-width:767px){

  /* COMPONENTS — timed popup */
  .popup-overlay{ align-items:flex-end; padding:0; }
  .popup-modal{
    width:100%; max-width:100%; border-radius:16px 16px 0 0;
    padding:28px 20px 24px;
    animation:popupSlideUp 300ms ease-out forwards;
  }
  .popup-overlay.popup-closing .popup-modal{ animation:popupSlideDown 200ms ease-in forwards; }

  /* FLOOR PLAN — overlay mobile adjustments */
  .floor-plan-img{ filter: blur(10px); }
  .floor-plan-lock-overlay .lock-title{ font-size: 18px; }
  .floor-plan-lock-overlay .lock-sub{ font-size: 11px; max-width: 160px; }
  .floor-plan-lock-overlay .btn-unlock{ font-size: 12px; padding: 10px 20px; min-height: 44px; }

}

/* ── MAX-WIDTH: 480px (Small phone) ── */
@media (max-width: 480px){

  /* LAYOUT */
  .nav{ padding: 0 16px; }
  .nav-right{ gap: 12px; }
  .nav-right .cta-gold{ padding: 9px 14px; font-size: 9.5px; }

  .hero-left{ padding: 44px 20px 28px; }
  .hero-h1{ font-size: 38px !important; }
  .hero-sub{ font-size: 11px; }
  .trust-pill{ padding: 7px 12px; font-size: 9.5px; }

  .overview, .amenities, .plans, .location, .faq{ padding: 56px 20px !important; }
  .section-h{ font-size: 30px !important; }

  .overview-facts{ grid-template-columns: 1fr; gap: 20px; }
  .fact-num{ font-size: 30px !important; }

  .am-grid{ grid-template-columns: 1fr; }
  .am-card{ padding: 22px 20px; }

  .stats{ grid-template-columns: 1fr 1fr; gap: 18px 12px; padding: 24px 18px; }
  .stat-value{ font-size: 30px !important; }

  .plans-info .typology{ font-size: 26px !important; }
  .plans-image{ padding: 14px; }

  .dist-time{ font-size: 28px !important; }

  .faq-answer{ font-size: 13px; }

  .footer{ padding: 48px 20px 20px; }

  /* HOME PAGE (overrides layout above) */
  .hero-left{ padding: 44px 20px 28px; }
  .hero-h1{ font-size: 38px !important; }
  .hero-sub{ font-size: 11px; }
  .trust-pill{ padding: 7px 12px; font-size: 9.5px; }

  .overview, .amenities, .plans, .location, .faq{ padding: 56px 20px !important; }
  .section-h{ font-size: 30px !important; }

  .overview-facts{ grid-template-columns: 1fr; gap: 20px; }
  .fact-num{ font-size: 30px !important; }

  .am-grid{ grid-template-columns: 1fr; }
  .am-card{ padding: 22px 20px; }

  .stats{ grid-template-columns: 1fr 1fr; gap: 18px 12px; padding: 24px 18px; }
  .stat-value{ font-size: 30px !important; }

  .plans-info .typology{ font-size: 26px !important; }
  .plans-image{ padding: 14px; }

  .dist-time{ font-size: 28px !important; }

  .faq-answer{ font-size: 13px; }

  /* MISSING MOBILE SAFETY (Step 5) */
  .row-2{ grid-template-columns: 1fr; }

}

/* ── Price List Page ──────────────────────────────── */
/* .hero-locality*, .location-cta-band, .faq-question--static, .distance-grid,
   .locality-distance-badge, .distance-number, .pl-hero and .pl-form-card were
   removed from here — all eight were rules for markup that no longer exists
   (the old locality/price-list heroes, since rebuilt on .bhk-hero, and the
   old always-open FAQ variant, since converted to .bhk-faq-item). Confirmed
   zero pages reference any of these classes before deleting. */

@media (max-width: 1280px) {
  .pl-price-bar           { padding: 0 48px; }
  .pl-config-section      { padding: 80px 48px; }
  .pl-included-section    { padding: 80px 48px; }
  .pl-payment-section     { padding: 80px 48px; }
  .pl-faq-section         { padding: 80px 48px; }
}

@media (max-width: 1024px) {
  .pl-price-bar           { padding: 0 32px; }
  .pl-config-section      { padding: 72px 32px; }
  .pl-included-section    { padding: 72px 32px; }
  .pl-inc-grid            { grid-template-columns: repeat(2, 1fr); }
  .pl-payment-section     { padding: 72px 32px; }
  .pl-payment-grid        { grid-template-columns: 1fr; }
  .pl-faq-section         { padding: 72px 32px; }
}

@media (max-width: 768px) {
  .pl-price-bar           { grid-template-columns: 1fr; padding: 0 24px; }
  .pl-price-col + .pl-price-col::before { display: none; }
  .pl-price-col           { padding: 28px 20px; border-top: 1px solid rgba(210,171,103,0.15); }
  .pl-config-section      { padding: 64px 24px; }
  .pl-included-section    { padding: 64px 24px; }
  .pl-inc-grid            { grid-template-columns: 1fr; }
  .pl-payment-section     { padding: 64px 24px; }
  .pl-faq-section         { padding: 64px 24px; }
}

@media (max-width: 480px) {
  .pl-config-section      { padding: 56px 20px; }
  .pl-included-section    { padding: 56px 20px; }
  .pl-payment-section     { padding: 56px 20px; }
  .pl-faq-section         { padding: 56px 20px; }
  table.pl-table th,
  table.pl-table td       { padding: 14px 12px; font-size: 13px; }
}

/* ── PRINT ── */
@media print{
  .sticky-bar,
  .lead-panel,
  .lead-tab,
  .lead-backdrop,
  .popup-overlay,
  nav{ display: none !important; }
}

/* sticky bar mobile: Book CTA only, full width — mirrors index.php */
@media (max-width: 767px){
  .sticky-bar{ border-top: 0; background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: none; }
  .sticky-bar a{ display: none; }
  .sticky-bar .sb-book,
  .sticky-bar .sb-book.btn-gold-primary{
    flex: 1 1 100%;
    margin: 0;
    height: 100%;
    border-radius: 0;
    min-width: 0;
    box-shadow: 0 -10px 26px -12px rgba(122,90,42,0.45);
  }
}

/* Nav breathing room at mid widths — the Configuration item added a 6th
   label, so the default 40px gap overflowed between ~1024 and ~1400px. */
@media (min-width: 1025px) and (max-width: 1400px){
  .nav{ padding: 0 40px; }
  .nav-links{ gap: 26px; }
  .nav-links .dot{ margin-left: -15px; margin-right: 12px; }
  .nav-right{ gap: 16px; }
}