/* =========================================================================
   Postmark Travel — Country / blog page typography standardization
   
   Applies to: bali.html, japan.html, kashmir.html, kashmir-blog.html,
   meghalaya.html, uzbekistan.html.
   
   Goal: align heading sizes, subtext sizes, weights, and section rhythm
   with the product-page scale.
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. Hero headings — 36px desktop / 32px mobile
   ------------------------------------------------------------------------- */
.elementor-3338 .elementor-element-ce018ef .elementor-heading-title,
.elementor-3338 .elementor-element-262b486 .elementor-heading-title,
.elementor-3242 .elementor-element-904f94f .elementor-heading-title,
.elementor-3242 .elementor-element-62497fe .elementor-heading-title,
.elementor-1589 .elementor-element-7ec3534 .elementor-heading-title,
.elementor-2555 .elementor-element-19028fe .elementor-heading-title,
.elementor-2555 .elementor-element-62497fe .elementor-heading-title,
.elementor-3258 .elementor-element-fb13b40 .elementor-heading-title,
.elementor-3251 .elementor-element-c090eff .elementor-heading-title,
.elementor-3251 .elementor-element-62497fe .elementor-heading-title {
  font-size: 36px !important;
  line-height: 1.2 !important;
  /* Normalized 700 -> 200 to match the light hero weight used on home &
     product pages (site-wide hero consistency). */
  font-weight: 200 !important;
  letter-spacing: -0.8px !important;
}

@media (max-width: 767px) {
  .elementor-3338 .elementor-element-ce018ef .elementor-heading-title,
  .elementor-3338 .elementor-element-262b486 .elementor-heading-title,
  .elementor-3242 .elementor-element-904f94f .elementor-heading-title,
  .elementor-3242 .elementor-element-62497fe .elementor-heading-title,
  .elementor-1589 .elementor-element-7ec3534 .elementor-heading-title,
  .elementor-2555 .elementor-element-19028fe .elementor-heading-title,
  .elementor-2555 .elementor-element-62497fe .elementor-heading-title,
  .elementor-3258 .elementor-element-fb13b40 .elementor-heading-title,
  .elementor-3251 .elementor-element-c090eff .elementor-heading-title,
  .elementor-3251 .elementor-element-62497fe .elementor-heading-title {
    font-size: 32px !important;
    line-height: 1.2 !important;
  }
}

/* -------------------------------------------------------------------------
   2. Section headings — 36px desktop / 32px mobile
   ("You may also like" and Kashmir "What you can expect?")
   ------------------------------------------------------------------------- */
.elementor-element-3afe071 .elementor-heading-title,
.elementor-1589 .elementor-element-4928811 .elementor-heading-title {
  font-size: 36px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  letter-spacing: -0.8px !important;
}

@media (max-width: 767px) {
  .elementor-element-3afe071 .elementor-heading-title,
  .elementor-1589 .elementor-element-4928811 .elementor-heading-title {
    font-size: 32px !important;
    line-height: 1.2 !important;
  }
}

/* -------------------------------------------------------------------------
   3. "You may also like" card titles — 32px
   ------------------------------------------------------------------------- */
.elementor-3338 .elementor-widget-image-box .elementor-image-box-title,
.elementor-3242 .elementor-widget-image-box .elementor-image-box-title,
.elementor-2555 .elementor-widget-image-box .elementor-image-box-title,
.elementor-3258 .elementor-widget-image-box .elementor-image-box-title,
.elementor-3251 .elementor-widget-image-box .elementor-image-box-title {
  font-size: 32px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
}

/* -------------------------------------------------------------------------
   4. Intro / hero subtext — 24px / 200 / Cormorant Garamond
   ------------------------------------------------------------------------- */
.elementor-3338 .elementor-element-a312226 .elementor-widget-container,
.elementor-3242 .elementor-element-d763b11 .elementor-widget-container,
.elementor-2555 .elementor-element-b7b87a7 .elementor-widget-container,
.elementor-3258 .elementor-element-c3b2f85 .elementor-widget-container,
.elementor-3251 .elementor-element-b7b87a7 .elementor-widget-container,
.elementor-3338 .elementor-element-a312226 p,
.elementor-3242 .elementor-element-d763b11 p,
.elementor-2555 .elementor-element-b7b87a7 p,
.elementor-3258 .elementor-element-c3b2f85 p,
.elementor-3251 .elementor-element-b7b87a7 p {
  font-family: "Cormorant Garamond", serif !important;
  font-size: 24px !important;
  font-weight: 200 !important;
  font-style: normal !important;
  line-height: 36px !important;
  text-align: left !important;
}

/* -------------------------------------------------------------------------
   5. Main body copy — 20px / 400 weight / comfortable line-height / left-aligned
   ------------------------------------------------------------------------- */
.elementor-3338 .elementor-element-7454196 .elementor-widget-container,
.elementor-3242 .elementor-element-7454196 .elementor-widget-container,
.elementor-1589 .elementor-element-973a56c .elementor-widget-container,
.elementor-2555 .elementor-element-7454196 .elementor-widget-container,
.elementor-2555 .elementor-element-6f2b6a5 .elementor-widget-container,
.elementor-3258 .elementor-element-7454196 .elementor-widget-container,
.elementor-3258 .elementor-element-fd05b27 .elementor-widget-container,
.elementor-3251 .elementor-element-7454196 .elementor-widget-container,
.elementor-3251 .elementor-element-27bb5ab .elementor-widget-container,
.elementor-3338 .elementor-element-7454196 p,
.elementor-3242 .elementor-element-7454196 p,
.elementor-1589 .elementor-element-973a56c p,
.elementor-2555 .elementor-element-7454196 p,
.elementor-2555 .elementor-element-6f2b6a5 p,
.elementor-3258 .elementor-element-7454196 p,
.elementor-3258 .elementor-element-fd05b27 p,
.elementor-3251 .elementor-element-7454196 p,
.elementor-3251 .elementor-element-27bb5ab p {
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  text-align: left !important;
}

/* -------------------------------------------------------------------------
   6. Section rhythm — match product-page max-width and vertical padding
   ------------------------------------------------------------------------- */
.elementor-3338 > .e-con,
.elementor-3242 > .e-con,
.elementor-1589 > .e-con,
.elementor-2555 > .e-con,
.elementor-3258 > .e-con,
.elementor-3251 > .e-con {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.elementor-3338 > .e-con:not(:first-child),
.elementor-3242 > .e-con:not(:first-child),
.elementor-1589 > .e-con:not(:first-child),
.elementor-2555 > .e-con:not(:first-child),
.elementor-3258 > .e-con:not(:first-child),
.elementor-3251 > .e-con:not(:first-child) {
  /* Normalized 40 -> 32 to match the site-wide desktop section rhythm
     (product & home pages). Mobile drops to 20 in §11. */
  padding-top: 32px !important;
  padding-bottom: 32px !important;
}

/* -------------------------------------------------------------------------
   7. Tighter vertical spacing for the main content blocks on blog pages
   ------------------------------------------------------------------------- */

/* Title / hero-heading sections — group the title tightly with the body
   text below it (8px title->body gap, matching product pages). The 32px
   top keeps the section rhythm above; the 4px bottom + body's 4px top +
   removed intro padding (§11) sum to the ~8px title->body gap. */
.elementor-3338 .elementor-element.elementor-element-3b34c2f,
.elementor-3242 .elementor-element.elementor-element-3b34c2f,
.elementor-2555 .elementor-element.elementor-element-3b34c2f,
.elementor-3258 .elementor-element.elementor-element-3b34c2f,
.elementor-3251 .elementor-element.elementor-element-3b34c2f,
.elementor-1589 .elementor-element.elementor-element-8130689 {
  padding-top: 32px !important;
  padding-bottom: 4px !important;
}

/* Main body-copy sections — sit tightly under the title */
.elementor-3338 .elementor-element.elementor-element-5e09ca7,
.elementor-3242 .elementor-element.elementor-element-5e09ca7,
.elementor-2555 .elementor-element.elementor-element-5e09ca7,
.elementor-3258 .elementor-element.elementor-element-5e09ca7,
.elementor-3251 .elementor-element.elementor-element-5e09ca7,
.elementor-1589 .elementor-element.elementor-element-a76a3e5 {
  padding-top: 4px !important;
  padding-bottom: 32px !important;
}

/* "You may also like" related-posts section */
.elementor-3338 .elementor-element.elementor-element-985dd96,
.elementor-3242 .elementor-element.elementor-element-985dd96,
.elementor-2555 .elementor-element.elementor-element-985dd96,
.elementor-3258 .elementor-element.elementor-element-985dd96,
.elementor-3251 .elementor-element.elementor-element-985dd96 {
  padding-top: 32px !important;
  padding-bottom: 32px !important;
}

/* Hero image section on blog pages — reduce its bottom padding so the
   title (when it lives inside this section, e.g. bali.html) sits closer
   to the body text below. */
.elementor-3338 .elementor-element.elementor-element-5665f6a,
.elementor-3242 .elementor-element.elementor-element-5665f6a,
.elementor-2555 .elementor-element.elementor-element-5665f6a,
.elementor-3258 .elementor-element.elementor-element-5665f6a,
.elementor-3251 .elementor-element.elementor-element-5665f6a {
  padding-top: 10px !important;
  padding-bottom: 16px !important;
}

/* -------------------------------------------------------------------------
   7. Clean up dead duplicate hero heading in kashmir-blog.html
   ------------------------------------------------------------------------- */
.elementor-2555 .elementor-element-9a90ddb {
  display: none !important;
}

/* -------------------------------------------------------------------------
   8. Mobile hygiene — align hero subtext with body text
   ------------------------------------------------------------------------- */
@media (max-width: 767px) {
  /* Some pages wrap the hero subtext in an inner container that adds an
     extra 10 px horizontal padding, making it misalign with the body text.
     Remove that extra padding so both sit on the same left edge. */
  .elementor-2555 .elementor-element-5ef1155,
  .elementor-3258 .elementor-element-ea0663d,
  .elementor-3251 .elementor-element-5ef1155 {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* -------------------------------------------------------------------------
   9. Mobile adaptation — "You may also like" cards
   ------------------------------------------------------------------------- */
@media (max-width: 767px) {
  /* Compact the related-post cards so they don't dominate the viewport */
  .elementor-3338 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image),
  .elementor-3242 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image),
  .elementor-2555 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image),
  .elementor-3258 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image),
  .elementor-3251 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image) {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: auto !important;
    max-height: 220px !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
  }

  /* Make the image's ancestor chain fill the compact wrapper */
  .elementor-3338 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image) > .elementor-widget-image,
  .elementor-3242 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image) > .elementor-widget-image,
  .elementor-2555 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image) > .elementor-widget-image,
  .elementor-3258 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image) > .elementor-widget-image,
  .elementor-3251 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image) > .elementor-widget-image,
  .elementor-3338 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image) > .elementor-widget-image > .elementor-widget-container,
  .elementor-3242 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image) > .elementor-widget-image > .elementor-widget-container,
  .elementor-2555 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image) > .elementor-widget-image > .elementor-widget-container,
  .elementor-3258 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image) > .elementor-widget-image > .elementor-widget-container,
  .elementor-3251 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image) > .elementor-widget-image > .elementor-widget-container {
    height: 100% !important;
    min-height: 100% !important;
  }

  .elementor-3338 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image) img,
  .elementor-3242 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image) img,
  .elementor-2555 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image) img,
  .elementor-3258 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image) img,
  .elementor-3251 .elementor-element-985dd96 .e-con.e-child:has(> .elementor-widget-image) img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  /* Reduce the generous bottom padding on each card and keep stacked cards
     from stretching to the full section height */
  .elementor-3338 .elementor-element-985dd96 [data-settings*="background_background"],
  .elementor-3242 .elementor-element-985dd96 [data-settings*="background_background"],
  .elementor-2555 .elementor-element-985dd96 [data-settings*="background_background"],
  .elementor-3258 .elementor-element-985dd96 [data-settings*="background_background"],
  .elementor-3251 .elementor-element-985dd96 [data-settings*="background_background"] {
    padding-bottom: 24px !important;
    align-self: flex-start !important;
    height: auto !important;
    min-height: auto !important;
  }
}

/* -------------------------------------------------------------------------
   10. Mobile overflow fix — neutralise desktop negative side-margins
   -------------------------------------------------------------------------
   The original per-page Elementor exports (images/elementor/css/post-XXXX.css)
   outdent some text/heading widget containers with NEGATIVE horizontal margins
   (e.g. `margin: -32px`) so they sit flush against a wide desktop hero column.
   On a ~370px mobile column those negative margins push the text box ~20-30px
   PAST the left/right screen edge — the "left overflow" visible on uzbekistan
   (and present on kashmir-blog, meghalaya, japan). Zero the horizontal margins
   at mobile so the text stays inside the viewport. Desktop is untouched.
   ------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .elementor-3251 .elementor-widget-text-editor > .elementor-widget-container,
  .elementor-3251 .elementor-widget-heading > .elementor-widget-container,
  .elementor-2555 .elementor-widget-text-editor > .elementor-widget-container,
  .elementor-2555 .elementor-widget-heading > .elementor-widget-container,
  .elementor-3258 .elementor-widget-text-editor > .elementor-widget-container,
  .elementor-3258 .elementor-widget-heading > .elementor-widget-container,
  .elementor-3242 .elementor-widget-text-editor > .elementor-widget-container,
  .elementor-3242 .elementor-widget-heading > .elementor-widget-container {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* -------------------------------------------------------------------------
   11. Title -> paragraph gap (8px) + mobile section rhythm (20px)
   -------------------------------------------------------------------------
   Normalized to match product pages: an ~8px title->body gap and a 20px
   mobile section rhythm (down from the old airy 40px). Desktop rhythm = 32
   (§6-7).
   ------------------------------------------------------------------------- */

/* Zero the intro-subtext widget's own top padding — at ~20px it was the main
   contributor to the old ~52px title->intro gap. With the title section's
   4px bottom + body section's 4px top, the title now sits ~8px above the
   intro/body. All viewports. */
.elementor-3338 .elementor-element-a312226 > .elementor-widget-container,
.elementor-3242 .elementor-element-d763b11 > .elementor-widget-container,
.elementor-2555 .elementor-element-b7b87a7 > .elementor-widget-container,
.elementor-3258 .elementor-element-c3b2f85 > .elementor-widget-container,
.elementor-3251 .elementor-element-b7b87a7 > .elementor-widget-container {
  padding-top: 0 !important;
}

/* The body section's inner container (.e-con-inner, ~10px) and the
   hero-subtext wrapper (5ef1155, ~10px) each add top padding above the
   intro. Collapse them so the title->body gap reaches the ~8px target. */
.elementor-3338 .elementor-element-5e09ca7 > .e-con-inner,
.elementor-3242 .elementor-element-5e09ca7 > .e-con-inner,
.elementor-2555 .elementor-element-5e09ca7 > .e-con-inner,
.elementor-3258 .elementor-element-5e09ca7 > .e-con-inner,
.elementor-3251 .elementor-element-5e09ca7 > .e-con-inner,
.elementor-1589 .elementor-element-a76a3e5 > .e-con-inner,
.elementor-2555 .elementor-element-5ef1155,
.elementor-3251 .elementor-element-5ef1155 {
  padding-top: 0 !important;
}

@media (max-width: 767px) {
  /* Mobile section rhythm: 20px (matches product pages). */
  .elementor-3338 > .e-con:not(:first-child),
  .elementor-3242 > .e-con:not(:first-child),
  .elementor-1589 > .e-con:not(:first-child),
  .elementor-2555 > .e-con:not(:first-child),
  .elementor-3258 > .e-con:not(:first-child),
  .elementor-3251 > .e-con:not(:first-child) {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
  /* Title section: 20px top (rhythm) / 4px bottom (grouped with body). */
  .elementor-3338 .elementor-element.elementor-element-3b34c2f,
  .elementor-3242 .elementor-element.elementor-element-3b34c2f,
  .elementor-2555 .elementor-element.elementor-element-3b34c2f,
  .elementor-3258 .elementor-element.elementor-element-3b34c2f,
  .elementor-3251 .elementor-element.elementor-element-3b34c2f,
  .elementor-1589 .elementor-element.elementor-element-8130689 {
    padding-top: 20px !important;
    padding-bottom: 4px !important;
  }
  /* Body section: 4px top (grouped with title) / 20px bottom (rhythm). */
  .elementor-3338 .elementor-element.elementor-element-5e09ca7,
  .elementor-3242 .elementor-element.elementor-element-5e09ca7,
  .elementor-2555 .elementor-element.elementor-element-5e09ca7,
  .elementor-3258 .elementor-element.elementor-element-5e09ca7,
  .elementor-3251 .elementor-element.elementor-element-5e09ca7,
  .elementor-1589 .elementor-element.elementor-element-a76a3e5 {
    padding-top: 4px !important;
    padding-bottom: 20px !important;
  }
  /* "You may also like" related-posts section: 20/20. */
  .elementor-3338 .elementor-element.elementor-element-985dd96,
  .elementor-3242 .elementor-element.elementor-element-985dd96,
  .elementor-2555 .elementor-element.elementor-element-985dd96,
  .elementor-3258 .elementor-element.elementor-element-985dd96,
  .elementor-3251 .elementor-element.elementor-element-985dd96 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
}

/* -------------------------------------------------------------------------
   12. Per-page title/intro wrapper tightening
   -------------------------------------------------------------------------
   Uzbekistan (the reference page) achieves an ~8px title->intro gap purely
   from the title-section's 4px bottom + the body-section's 4px top padding,
   with every intermediate wrapper collapsed to 0. Some pages carry EXTRA
   top/bottom padding (or negative-cancelled margins) on intermediate
   wrappers that uzbekistan does not, leaving a looser gap. Zero those extra
   contributors so all pages match the reference 4+4 padding sum.
   Applies at all viewports (desktop rhythm 32 and mobile rhythm 20 are set
   on the SECTIONS in §6-7/§11; these rules only touch the intermediate
   wrappers, never the section rhythm).
   ------------------------------------------------------------------------- */

/* --- JAPAN (3242): the title's boxed wrapper cddb4ea carries a 26px bottom
   padding, and the intro widget-container adds a 10px top margin — together
   ~36px looser than uzbekistan. Collapse both. --- */
.elementor-3242 .elementor-element.elementor-element-cddb4ea {
  padding-bottom: 0 !important;
}
.elementor-3242 .elementor-element-d763b11 > .elementor-widget-container {
  margin-top: 0 !important;
}

/* --- BALI (3338): the hero title lives INSIDE the hero-image section
   5665f6a (not the shared 3b34c2f title section). Its title sits in the
   boxed wrapper c48165a, which has a 26px bottom padding, and the hero
   section itself keeps a 16px bottom padding (§7). Reduce the hero
   section's bottom padding to 4px (matching the reference title section)
   and zero the wrapper so the title groups tightly with the body section
   (5e09ca7, already 4px top). --- */
.elementor-3338 .elementor-element.elementor-element-5665f6a {
  padding-bottom: 4px !important;
}
.elementor-3338 .elementor-element.elementor-element-c48165a {
  padding-bottom: 0 !important;
}

/* --- KASHMIR (1589): sections 8130689/a76a3e5 are already 4px/4px, but the
   intro paragraph's widget-container carries a 22px top padding that
   uzbekistan does not. Zero it so the body text sits tight under the
   section top. (The large in-section hero image below the title is real
   page content and is left untouched.) --- */
.elementor-1589 .elementor-element-973a56c > .elementor-widget-container {
  padding-top: 0 !important;
}

/* -------------------------------------------------------------------------
   13. Mobile — consistent horizontal side margins across all content blocks
   -------------------------------------------------------------------------
   The title / body / related sections rendered with mismatched side padding
   (0px / 10px / 20px), so text started at three different left edges down the
   page. Give every content section a uniform 20px side margin on mobile; the
   hero image section (first child) stays full-bleed. The photo carousel lives
   inside the body section, so zero its own side padding to keep it flush with
   the 20px text margin instead of double-indenting to 40px.
   ------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .elementor-3338 > .e-con:not(:first-child),
  .elementor-3242 > .e-con:not(:first-child),
  .elementor-1589 > .e-con:not(:first-child),
  .elementor-2555 > .e-con:not(:first-child),
  .elementor-3258 > .e-con:not(:first-child),
  .elementor-3251 > .e-con:not(:first-child) {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .elementor-3338 .elementor-widget-image-carousel,
  .elementor-3242 .elementor-widget-image-carousel,
  .elementor-1589 .elementor-widget-image-carousel,
  .elementor-2555 .elementor-widget-image-carousel,
  .elementor-3258 .elementor-widget-image-carousel,
  .elementor-3251 .elementor-widget-image-carousel {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* -------------------------------------------------------------------------
   14. Mobile — uniform body-text side inset across all country pages
   -------------------------------------------------------------------------
   The Elementor exports gave each country page a DIFFERENT side padding on
   the main body-copy widgets (bali/japan/uzbekistan 25px, kashmir 22px,
   meghalaya 15px, kashmir-blog 0px), so body paragraphs sat at anywhere from
   20px (kashmir-blog — visibly tighter) to 45px. Pin them all to 25px so the
   body copy has the same inset on every country page. (Section side margin is
   20px from §13; 20 + 25 = 45px total, matching the majority of pages.)
   ------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .elementor-3338 .elementor-element-7454196 > .elementor-widget-container,
  .elementor-3242 .elementor-element-7454196 > .elementor-widget-container,
  .elementor-1589 .elementor-element-973a56c > .elementor-widget-container,
  .elementor-2555 .elementor-element-7454196 > .elementor-widget-container,
  .elementor-2555 .elementor-element-6f2b6a5 > .elementor-widget-container,
  .elementor-3258 .elementor-element-7454196 > .elementor-widget-container,
  .elementor-3258 .elementor-element-fd05b27 > .elementor-widget-container,
  .elementor-3251 .elementor-element-7454196 > .elementor-widget-container,
  .elementor-3251 .elementor-element-27bb5ab > .elementor-widget-container {
    padding-left: 25px !important;
    padding-right: 25px !important;
  }
}
