.layout-container__content ul{
  padding-left: 1.25rem !important; /* 20px */
}
/* =========================================
   Guide header
========================================= */
.newGuideHeader {
  justify-content: flex-start;
}

.newGuideHeader p {
  margin-top: 0.8rem !important;
}

.newGuideHeader p span {
  color: #7d7d7d;
}

.headerSection hr {
  color: #cccccc;
}

.headerSection h1 {
  font-family: "Kapra", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 4rem;
  line-height: 100%;
  letter-spacing: 0%;
  text-transform: uppercase;
  color: var(--Royal-Navy-Blue, #0c214d);
  margin-top: 0;
}

.headerSection p,
.readingTime p {
  font-family: "Proxima Nova", Arial, sans-serif;
  font-weight: 400;
  font-style: italic;
  font-size: 1.5rem; /* 24px */
  line-height: 36px;
  letter-spacing: 0%;
  color: var(--Dark-Gray, #4a4a4a);
  margin-top: 0.4rem !important;
  margin-bottom: 0.3rem !important;
}
.headerSection .title {
    margin-bottom: 0.8rem !important;
    margin-top: 0rem !important;
}
.readingTime {
  font-style: normal;
  font-size: 1.25rem !important;
  float: left;
  margin-bottom: 0.9rem !important;
  padding-left:0;
}
.guideHeader span.imageCaption{
  vertical-align: bottom;
}
.readingTime::before {
  content: "";
  width: 20px;
  height: 20px;
  display: inline-block;
  margin-right: 0; /* the   inside .readingTime leaves a ~7px gap to the text (6px gave ~13px) */
  /* Inline SVG instead of Vector.png: stays sharp on high-density (mobile) screens */
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%234a4a4a' stroke-width='2'%3E%3Ccircle cx='10' cy='10' r='9'/%3E%3Cpath d='M10 4v6h4'/%3E%3C/svg%3E")
    center/contain no-repeat;
  transform: translateY(3px);
}

/* =========================================
   Intro text
========================================= */
.introTextSection {
  padding-bottom: 1rem;
}

.introTextSection p {
  font-family: "Proxima Nova", Arial, sans-serif;
  font-weight: 400;
  font-style: italic;
  font-size: 1.25rem; /* 20px */
  line-height: 36px;
  letter-spacing: 0;
  margin-bottom: 1rem; /* 16px */
  color: #0c214d;
}
.introTextSection p:first-of-type {
  margin-top: -0.5rem;
}

/* =========================================
   Key takeaways
========================================= */
.keyTakeawaySection {
  padding-bottom: 1.75rem;
  border-block: 1px solid #cccccc;
  margin-bottom: 1rem;
}

.keyTakeawaySection ul li,
.keyTakeawaySection p {
  font-weight: 400;
  font-style: normal;
  font-size: 1.25rem; /* 20px */
  line-height: 32px;
  letter-spacing: 0;
  margin-bottom: 1rem; /* 16px */
  color: #4a4a4a;
}

/* =========================================
   H2 headings
========================================= */
.articleContent h2,
.keyTakeawaySection h2 {
  font-family: "Kapra", sans-serif;
  font-weight: 400;
  font-style: normal;
  line-height: 42px;
  letter-spacing: 0;
  text-transform: uppercase;
  color: #0c214d;
}

.keyTakeawaySection h2 {
  font-size: 2.25rem !important;
}

.articleContent h2 {
  margin-top: 0rem !important;

}

/* =========================================
   Article content: body text + links
========================================= */
.articleContent p,
.articleContent ul li {
  font-family: ProximaNova-Regular, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.25rem;
  line-height: 32px;
  letter-spacing: 0;
  color: #4a4a4a;
}

.articleContent ul li {
  margin-bottom: 0.5rem; /* 8px */
}

.articleContent p a,
.articleContent ul li a {
  text-underline-offset: 3px;
  text-decoration-thickness: 1px !important;
}

.articleContent p b a {
  color: #005edc !important;
}

/* =========================================
   Article content: media
========================================= */

.articleContent .basic-tile__container {
    margin-top: 0.25rem !important;
}

.articleContent figure {
  margin-left: 0.625rem; /* 10px */
}

.articleContent figure,
.articleContent figure img {
  border-radius: 10px !important;
}

/* =========================================
   Article content: h3
========================================= */
.articleContent h3 {
  font-family: ProximaNova-Bold, Arial, sans-serif !important;
  font-weight: 700 !important;
  font-style: normal !important;
  font-size: 1.5rem !important;
  margin-top: 2rem !important;
  margin-bottom: 0 !important;
  letter-spacing: 0 !important;
  color: #0c214d;
}

/* =========================================
   Pull quote
========================================= */
.NewPullQuote {
  font-family: ProximaNova-Regular, Arial, sans-serif;
  font-weight: 400;
  font-style: italic;
  font-size: 2.25rem;
  line-height: 48px;
  letter-spacing: 0;
  text-align: center;
  width: 70%;
  margin: 4.375rem auto; /* 64px */
}

.NewPullQuote::before,
.NewPullQuote::after {
  content: "";
  display: block;
  height: 2px;
  width: 200px;
  margin-inline: auto;
  background-color: #005edc;
}

.NewPullQuote::before {
  margin-bottom: 2.5rem; /* 40px */
}

.NewPullQuote::after {
  margin-top: 2.5rem; /* 40px */
}

/* =========================================
   Book now
========================================= */
.NewBookNow {
  border-top: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
  padding-top: 1.875rem; /* 30px */
  padding-bottom: 3.125rem; /* 50px */
  margin-top: 4.5rem; /* 30px */
  margin-bottom: 4.5rem; /* 30px */
}

.NewBookNow p {
  font-family: "Kapra", sans-serif;
  font-weight: 400;
  font-size: 2.25rem; /* 36px */
  line-height: 42px;
  letter-spacing: 0;
  text-transform: uppercase;
  color: #0c214d;
}

.NewBookNow p a {
  color: #005edc !important;
  text-decoration: none !important;
}

/* Shared blue button */
.NewBookNow .blueBtn,
.deals_promoBanner .blueBtn {
  font-family: ProximaNova-Bold, Arial, sans-serif;
  font-weight: 700;
  font-size: 1.25rem;
  line-height: 1.25rem;
  text-align: center;
  text-transform: uppercase;
  color: #fff !important;
  border-radius: 0.313rem;
}

/* =========================================
   Meet the author
========================================= */
.new-meet-the-author-section {
  border-block: 1px solid #ccc;
  padding-block: 3.125rem; /* 50px */
  margin-block: 4.5rem;
}

.meet-the-author-content {
  display: flex;
  align-items: center;
  gap: 1.875rem; /* 30px */
  margin: 0 auto;
  padding: 0 1.5rem; /* 24px */
}

.meet-the-author img {
  width: 158px;
  border-radius: 100%;
  object-fit: cover;
  display: block;
}

.new-meet-the-author-section h3 {
  font-family: ProximaNova-Bold, Arial, sans-serif !important;
  font-weight: 700 !important;
  font-style: normal !important;
  font-size: 1.5rem !important;
  margin-bottom: 0 !important;
  letter-spacing: 0 !important;
  color: #0c214d;
}

.new-meet-the-author-section p {
  font-family: ProximaNova-Regular, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.25rem;
  line-height: 32px;
  letter-spacing: 0;
  color: #7d7d7d;
}

/*
.New_SignUpSection h2 {
  font-family: "Kapra", sans-serif;
  font-weight: 400;
  font-style: normal;
  line-height: 42px;
  letter-spacing: 0;
  text-transform: uppercase;
  color: #0C214D;
  margin-bottom: -0.625rem !important;  // -10px
  margin-left: -0.5rem !important;
}

.New_SignUpSection input {
  border: 1px solid #0C214D !important;
  border-radius: 5px !important;
}
*/

/* =========================================
   Deals promo banner
========================================= */
.deals_promoBanner {
  margin-top: 2.5rem;
  margin-bottom: 6rem;
}

.deals_promoBanner .basic-tile__background {
  height: auto !important;
}

.deals_promoBanner figure,
.deals_promoBanner figure img {
  border-radius: 30px;
}

.deals_promoBanner h2 {
  font-family: "Kapra", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 4rem;
  line-height: 65px;
  letter-spacing: 0;
  text-transform: uppercase;
}

.deals_promoBanner p {
  font-family: ProximaNova-Regular, Arial, sans-serif;
  font-weight: 400;
  font-style: italic;
  font-size: 1.5rem;
  line-height: 36px;
  letter-spacing: 0;
}

.deals_promoBanner .basic-tile__content {
  padding-left: 3.125rem; /* 50px */
}

/* =========================================
   Related articles
========================================= */
.new_relatedArticles {
  background: #f5f5f5;
  padding-bottom: 1.35rem;
}

.new_relatedArticles h2 {
  font-family: "Kapra", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.25rem; /* 36px */
  line-height: 42px;
  letter-spacing: 0;
  text-transform: uppercase;
  color: #0c214d;
}

.new_relatedArticles .relatedArticleItem {
  background: #fff;
  border-radius: 10px;
}

.new_relatedArticles h4 {
  font-family: ProximaNova-Bold, Arial, sans-serif !important;
  font-weight: 700;
  font-style: normal;
  font-size: 1.5rem; /* 24px */
  line-height: 32px !important;
  color: #0c214d;
}

.new_relatedArticles .articleLink {
  font-family: ProximaNova-Regular, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 0.875rem; /* 14px */
  line-height: 100%;
  text-transform: uppercase;
  color: #005edc;
}

.new_relatedArticles .articleLink::after {
  content: "›";
  margin-left: 0.625rem; /* 10px */
  display: inline-block;
  font-size: 1.625rem; /* 26px */
}

.new_relatedArticles .relatedArticleItem .cmp-text.text__base {
  padding: 0 1.875rem !important; /* 30px */
}

.new_relatedArticles .basic-tile__background {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

/* =========================================
   Explore More
========================================= */
.NewexploreMoreSection .basic-tile__content {
  background: linear-gradient(180deg, rgba(12, 33, 77, 0) 0%, #0c214d 100%);
  border-radius: 10px;
}

.NewexploreMoreSection h2 {
  padding-bottom: 0;
}

.new_relatedArticles .NewexploreMoreSection .basic-tile__background {
  border-radius: 10px;
}

/* Social */
.social {
  top: -60px;
}

/* =========================================
   Responsive
========================================= */
@media (max-width: 768px) {
  .readingTime {
    margin-bottom: 0 !important;
  }

  .meet-the-author-content {
    flex-direction: column;
    align-items: flex-start;
    gap: 1.875rem; /* 30px */
    padding: 0 0.2rem;
  }

  .deals_promoBanner .basic-tile__content {
    padding-inline: 3.125rem;
  }

  .deals_promoBanner .basic-tile__content h2 {
    font-size: 3rem;
  }

  .headerSection h1 {
    font-size: 3rem;
  }

  /* No width: 100% here: it pushes the text below the floated clock icon */
  .newGuideHeader {
    margin-bottom: 3.5rem;
  }

  /* If the meta line wraps: balanced lines and tighter leading.
     The 9px padding = (36px - 18px) / 2, so a single line stays exactly where it was, level with the icon. */
  .newGuideHeader p,
  .newGuideHeader p span {
    line-height: 18px;
  }

  .newGuideHeader p {
    padding: 9px 0;
    text-wrap: balance;
  }

  .socialMedia .social {
    position: absolute;
    right: auto;
    top: -4rem;
  }

  .socialMedia .social a img {
    margin-bottom: 3.5rem;
  }

  .socialMedia .social a:last-child img {
    margin-bottom: auto;
  }

  .keyTakeawaySection {
    padding-bottom: 1.55rem;
  }

  .articleContent h2 {
    font-size: 2.25rem !important;
  }

  .NewPullQuote {
    margin: 3rem auto;
    font-size: 2rem !important;
    width: 100%;
  }

  .NewBookNow {
    margin-top: 3rem;
    margin-bottom: 3rem;
  }

  .new_relatedArticles h2 {
    font-size: 2.25rem !important;
    padding-top: 3.5rem !important;
  }

  .deals_promoBanner {
    margin-bottom: 2.5rem;
  }

  .new_relatedArticles .relatedArticleItem {
    margin-bottom: 1.875rem;
  }

  .NewexploreMoreSection h2 {
    padding-top: 2rem !important;
  }
}