/* ============================================================
   RESPONSIVE TYPOGRAPHY — Consistent & Professional on Phones & Tablets
   ------------------------------------------------------------
   Ensures clean, readable typography across every device width:
     Tablets (max-width: 1024px):
       - Badges, chips, metadata: 12px–13px (no 8–10px text)
       - Body text, values, subtitles: 13.5px–15px
       - Card titles: 16px–18px
       - Price amounts: 20px–24px, units/from: 12px–13px
       - Inputs & selects: 15px–16px
     Mobile Phones (max-width: 640px):
       - Micro badges & chips: 11.5px–12px
       - Metadata & labels: 12px–12.5px
       - Body & search values: 13.5px–15.5px
       - Card titles: 15.5px–16.5px (line-height: 1.35)
       - Native inputs & selects: 16px (stops iOS auto-zoom)
       - Footers & legal text: 12px–12.5px
   ============================================================ */

/* ════════════════════════════════════════════════════════════════
   1. TABLETS & MOBILE DEVICES (Screen width ≤ 1024px)
   ════════════════════════════════════════════════════════════════ */
@media (max-width: 1024px) {
  /* ——— Shared Listing Cards (Hotels, Stays, Packages) ——— */
  .bk-card-name,
  .lp-hotel-card-name,
  .fpk-title {
    font-size: 16.5px !important;
    line-height: 1.35;
    font-weight: 700;
  }

  .bk-card-type-badge,
  .bk-card-amenity,
  .bk-card-amenity-more,
  .bk-card-taxline,
  .bk-card-price-info,
  .bk-card-reviews,
  .bk-card-distance,
  .bk-card-map-line,
  .bk-map-badge,
  .bk-card-tag,
  .bk-card-deal,
  .featured-badge,
  .lp-hotel-card-stars,
  .lp-hotel-card-location,
  .lp-hotel-card-amenity,
  .lp-hotel-card-taxes,
  .lp-hotel-card-badge,
  .lp-hotel-card-counter {
    font-size: 12px !important;
    line-height: 1.4;
  }

  .bk-card-score-outof {
    font-size: 11.5px !important;
  }

  .bk-card-price .from,
  .bk-price .from,
  .tour-price .from,
  .lp-tour-price .from,
  .lp-tour-price .per,
  .tftr-card-from,
  .tftr-card-unit {
    font-size: 12px !important;
    letter-spacing: 0.03em;
  }

  .bk-card-price .unit,
  .bk-price .unit,
  .tour-price .unit {
    font-size: 12.5px !important;
  }

  .bk-card-price strong,
  .bk-price strong,
  .tour-price strong,
  .lp-tour-price .amount,
  .lp-hotel-card-price .amount,
  .fpk-price-val {
    font-size: 21px !important;
  }

  /* Filter rail counts & labels */
  .cnt {
    font-size: 12px !important;
  }

  .lp-filter-label,
  .lp-check-item {
    font-size: 13px !important;
  }

  /* ——— Tours & Transfers ——— */
  .lp-tour-title {
    font-size: 16px !important;
    line-height: 1.35;
    font-weight: 700;
  }

  .tour-meta-chip,
  .tour-type-badge,
  .tour-amenity-chip,
  .tour-date-line,
  .tour-price-from,
  .lp-tour-location,
  .lp-tour-meta span,
  .lp-tour-badge,
  .lp-tour-duration,
  .lp-tour-rating .reviews {
    font-size: 12px !important;
    line-height: 1.4;
  }

  .lp-tour-rating .stars {
    font-size: 12px !important;
  }

  .lp-tour-rating .score,
  .lp-hotel-card-rating .score {
    font-size: 12.5px !important;
  }

  /* ——— Vacation Rentals ——— */
  .vr-dest-badge,
  .vr-review-score-tag,
  .vr-review-badge-verified,
  .vr-review-badge-date,
  .vr-host-badge,
  .vr-meta-item {
    font-size: 12px !important;
  }

  /* ——— Family Packages ——— */
  .fpk-pill,
  .fpk-chip,
  .fpk-price-lbl,
  .fpk-tag-kicker,
  .fpk-meta-chip {
    font-size: 12px !important;
  }

  .fpk-cta-tag {
    font-size: 12px !important;
  }

  /* ——— Destinations ——— */
  .tf-dest-country,
  .tf-dest-card .n,
  .tf-hero-badge,
  .dest-h-count,
  .dest-h-rating {
    font-size: 12px !important;
  }

  .dest-h-name {
    font-size: 15px !important;
  }

  /* ——— Blog ——— */
  .tf-card-cat,
  .tf-card-time,
  .tf-featured-badge,
  .tf-featured-cat-tag,
  .tf-blog-card .count {
    font-size: 12px !important;
  }

  /* ——— Events ——— */
  .tf-ev-exp-label,
  .tf-ev-exp-lead__eyebrow,
  .tf-ev-card-date,
  .tf-ev-card-venue {
    font-size: 12px !important;
  }

  /* ——— Contact / About / Support ——— */
  .cu-channel-tag,
  .cu-support-pill,
  .cu-cta-eyebrow,
  .pill-tag {
    font-size: 12px !important;
  }

  /* ——— Search Bars (Hero & Listing) ——— */
  .sf-label,
  .tf-sf-label,
  .lp-search-field .field-label {
    font-size: 12px !important;
    letter-spacing: 0.05em;
  }

  .sf-value,
  .tf-sf-value {
    font-size: 14.5px !important;
  }

  .lp-search-btn {
    font-size: 14.5px !important;
  }

  /* ——— Hotel & Tour Detail Pages ——— */
  .bk-rc-count,
  .bk-room-type-badge,
  .bk-price-taxes,
  .bk-avail-col-label,
  .bk-desc-source,
  .bk-reserve-subnote,
  .trust-desc,
  .price-unit,
  .tfd-dep-badge,
  .tfd-dep-seats,
  .tfd-faq-q-num,
  .tfd-mo-label,
  .input-lbl,
  .cal-month-name,
  .tfd-dategrid-days-header,
  .lp-occ-label span {
    font-size: 12px !important;
  }

  .bk-room-table th,
  .bk-room-table thead th,
  .bk-table-avail th,
  .bk-table-avail thead th {
    font-size: 12.5px !important;
  }

  /* ——— Trust Bars & Testimonials ——— */
  .lp-trust-text h4 {
    font-size: 13.5px !important;
  }

  .lp-trust-text p {
    font-size: 12px !important;
  }

  .hv2-trust-bar-text strong {
    font-size: 14.5px !important;
  }

  .hv2-trust-bar-text span {
    font-size: 12.5px !important;
  }

  .hv2-testimonial-quote {
    font-size: 14px !important;
    line-height: 1.6;
  }

  .hv2-testimonial-meta h4 {
    font-size: 14px !important;
  }

  .hv2-testimonial-meta span {
    font-size: 12px !important;
  }

  /* ——— Why Choose Us & Travel Categories ——— */
  .hv2-why-card h3 {
    font-size: 15.5px !important;
  }

  .hv2-why-card p {
    font-size: 13.5px !important;
    line-height: 1.55 !important;
  }

  .hv2-cat-name {
    font-size: 13.5px !important;
  }

  .hv2-cat-count {
    font-size: 12px !important;
  }

  /* ——— Luxury Experiences ——— */
  .hv2-lux-body h3 {
    font-size: 15.5px !important;
  }

  .hv2-lux-body .lux-country {
    font-size: 12px !important;
  }

  .hv2-lux-body .lux-price {
    font-size: 13px !important;
  }

  /* ——— Footer & Legal Copy ——— */
  .payment-label,
  .footer-tagline,
  .troy-badge,
  .site-footer .footer-bottom-left > span,
  .site-footer .footer-legal,
  .site-footer .footer-legal a,
  .hv2-footer-bottom,
  .hv2-footer-col a,
  .hv2-footer-contact li {
    font-size: 12px !important;
    line-height: 1.5;
  }

  .footer-secure small,
  .footer small {
    font-size: 12px !important;
  }

  .site-footer .footer-secure strong {
    font-size: 12.5px !important;
  }
}

/* ════════════════════════════════════════════════════════════════
   2. MOBILE PHONES (Screen width ≤ 640px)
   ════════════════════════════════════════════════════════════════ */
@media (max-width: 640px) {
  /* Native inputs: 16px strictly required on mobile to prevent iOS Safari auto-zoom */
  .sf-field input,
  .sf-field select,
  .ts-field input,
  .ts-field select,
  .sw-field input,
  .sw-field select,
  .tf-search-input-field,
  .lp-search-field select,
  .lp-search-field input,
  .hv2-search-field input[type="text"],
  .hv2-search-field input[type="date"],
  .hv2-search-field #hv2-dest {
    font-size: 16px !important;
  }

  /* Shared listing card typography */
  .bk-card-name,
  .lp-hotel-card-name,
  .lp-tour-title,
  .fpk-title {
    font-size: 16px !important;
    line-height: 1.35 !important;
  }

  .bk-card-type-badge,
  .bk-card-amenity,
  .bk-card-amenity-more,
  .bk-card-taxline,
  .bk-card-price-info,
  .bk-card-reviews,
  .bk-card-distance,
  .bk-card-map-line,
  .bk-map-badge {
    font-size: 12px !important;
  }

  .bk-card-score-outof {
    font-size: 11.5px !important;
  }

  .bk-card-price .from,
  .bk-price .from,
  .tour-price .from,
  .lp-tour-price .from,
  .lp-tour-price .per {
    font-size: 12px !important;
  }

  .bk-card-price .unit,
  .bk-price .unit,
  .tour-price .unit {
    font-size: 12px !important;
  }

  .bk-card-price strong,
  .bk-price strong,
  .tour-price strong,
  .lp-tour-price .amount,
  .fpk-price-val {
    font-size: 20px !important;
  }

  /* Tours & Transfers mobile */
  .tour-meta-chip,
  .tour-type-badge,
  .tour-amenity-chip,
  .tour-date-line,
  .tour-price-from,
  .tftr-card-from,
  .tftr-card-unit,
  .lp-tour-location,
  .lp-tour-meta span,
  .lp-tour-badge,
  .lp-tour-duration {
    font-size: 12px !important;
  }

  /* Shared Search Bars */
  .sf-label,
  .tf-sf-label,
  .lp-search-field .field-label {
    font-size: 12px !important;
    letter-spacing: 0.05em;
  }

  .sf-value,
  .tf-sf-value {
    font-size: 14.5px !important;
  }

  .tf-sticky-search-bar .sf-label.tf-sf-label {
    font-size: 12px !important;
  }

  .tf-sticky-search-bar .sf-value.tf-sf-value {
    font-size: 14.5px !important;
    line-height: 1.35 !important;
  }

  /* Home page card components */
  .hv2-scroll-container > .hv2-tour-card {
    height: 348px;
    min-height: 348px;
  }

  .hv2-tour-body h3 {
    font-size: 15.5px !important;
    line-height: 1.35;
  }

  .hv2-tour-loc {
    font-size: 12px !important;
    height: auto !important;
    min-height: 20px !important;
  }

  .hv2-tour-rating,
  .hv2-tour-rating span,
  .hv2-tour-dur {
    font-size: 12px !important;
  }

  .hv2-tour-price small {
    font-size: 12px !important;
  }

  .hv2-tour-price strong {
    font-size: 18px !important;
  }

  .hv2-tour-badge {
    font-size: 11.5px !important;
    padding: 4px 9px !important;
  }

  .hv2-fact {
    font-size: 12px !important;
    padding: 4px 10px;
  }

  .hv2-star-rating,
  .hv2-type-text {
    font-size: 12px !important;
  }

  .dest-h-name {
    font-size: 15px !important;
  }

  .dest-h-count,
  .dest-h-rating {
    font-size: 12px !important;
  }

  .hv2-why-card h3 {
    font-size: 15px !important;
  }

  .hv2-why-card p {
    font-size: 13px !important;
    line-height: 1.55 !important;
  }

  .hv2-cat-name {
    font-size: 13px !important;
  }

  .hv2-cat-count {
    font-size: 12px !important;
  }

  .hv2-lux-body .lux-country,
  .hv2-lux-body .lux-price {
    font-size: 12px !important;
  }

  .hv2-testimonial-meta span {
    font-size: 12px !important;
  }

  .nl-badge,
  .hv2-hero-tag {
    font-size: 11.5px !important;
  }

  .nl-perk {
    font-size: 12px !important;
  }

  .hv2-search-wrap .hv2-search-field > .field-label {
    font-size: 11.5px !important;
  }

  .hv2-search-wrap .hv2-search-field .field-value {
    font-size: 15.5px !important;
    font-weight: 700;
  }

  /* Navigation & action buttons */
  .hv2-btn-login,
  .hv2-btn-signup {
    font-size: 12px !important;
  }
}

/* ════════════════════════════════════════════════════════════════
   3. NARROW PHONES (Screen width ≤ 400px)
   Keep fonts readable — only margins and gutters tighten
   ════════════════════════════════════════════════════════════════ */
@media (max-width: 400px) {
  .hv2-tour-body h3,
  .lp-tour-title,
  .lp-hotel-card-name,
  .fpk-title {
    font-size: 15px !important;
  }

  .hv2-tour-price strong,
  .lp-tour-price .amount,
  .fpk-price-val {
    font-size: 18px !important;
  }

  .hv2-why-card h3,
  .dest-h-name {
    font-size: 14.5px !important;
  }

  .hv2-why-card p {
    font-size: 12.5px !important;
    line-height: 1.5 !important;
  }

  .hv2-tour-badge,
  .lp-tour-badge,
  .nl-badge,
  .dest-h-rating {
    font-size: 11.5px !important;
  }
}