/* ===========================================================================
   Blog — listing, sidebar and article.
   Uses the site palette: #175F52 structure · #1B7061 accent · #C9A96E gold
   · #F2F0EC bands · Belleza headings / Figtree body.
   =========================================================================== */

.bl-wrap { padding-block: clamp(34px, 5vw, 70px); }

/* ── page shell: content + sidebar ───────────────────────────────────── */
.bl-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: clamp(20px, 2.6vw, 34px);
  align-items: start;
}
@media (max-width: 991px) { .bl-layout { grid-template-columns: 1fr; } }

/* ── trending strip ──────────────────────────────────────────────────── */
.bl-trending {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: clamp(16px, 2vw, 28px);
  align-items: center;
  margin-bottom: clamp(26px, 3.4vw, 44px);
  padding: clamp(16px, 2vw, 24px);
  border: 1px solid #e8efec;
  border-radius: 16px;
  background: #fff;
}
@media (max-width: 767px) { .bl-trending { grid-template-columns: 1fr; } }

.bl-trending__kicker {
  margin: 0 0 6px;
  font: 700 10.5px/1.5 "Figtree", sans-serif;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #c9a96e;
}
.bl-trending__title {
  margin: 0 0 10px;
  font: 400 clamp(21px, 2vw, 27px)/1.2 "Belleza", sans-serif;
  color: #17231f;
  position: relative;
  padding-bottom: 10px;
}
.bl-trending__title::after {
  content: ""; position: absolute; left: 0; bottom: 0;
  width: 54px; height: 2px; background: #c9a96e;
}
.bl-trending__sub { margin: 0; font: 400 13.5px/1.65 "Figtree", sans-serif; color: #5d6b66; }

.bl-trending__rail { position: relative; }
.bl-trending__track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(210px, 1fr);
  gap: 14px;
  overflow-x: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
  padding: 2px;
}
.bl-trending__track::-webkit-scrollbar { display: none; }

.bl-mini {
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr);
  gap: 11px;
  align-items: center;
  padding: 9px;
  border: 1px solid #eef3f1;
  border-radius: 12px;
  background: #fff;
  text-decoration: none;
  transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.bl-mini:hover {
  border-color: #46a598;
  box-shadow: 0 8px 20px rgba(23,95,82,.1);
  transform: translateY(-2px);
}
.bl-mini img { width: 62px; height: 52px; object-fit: cover; border-radius: 8px; display: block; }
.bl-mini__title {
  margin: 0 0 3px;
  font: 600 12.5px/1.4 "Figtree", sans-serif;
  color: #175f52;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.bl-mini__text {
  margin: 0;
  font: 400 11.5px/1.5 "Figtree", sans-serif;
  color: #7b8783;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

.bl-rail-btn {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 30px; height: 30px; z-index: 2;
  display: grid; place-items: center;
  border: 1px solid #e0e8e5; border-radius: 50%;
  background: #fff; color: #175f52; cursor: pointer;
  box-shadow: 0 3px 10px rgba(0,0,0,.09);
  transition: background .2s ease, color .2s ease;
}
.bl-rail-btn:hover { background: #175f52; color: #fff; }
.bl-rail-btn--prev { left: -13px; }
.bl-rail-btn--next { right: -13px; }

/* ── the card grid ───────────────────────────────────────────────────── */
.bl-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(16px, 2vw, 26px);
}
@media (max-width: 575px) { .bl-grid { grid-template-columns: 1fr; } }

.bl-card {
  display: flex;
  flex-direction: column;
  border: 1px solid #e8efec;
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  text-decoration: none;
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.bl-card:hover {
  transform: translateY(-4px);
  border-color: #cfe2dd;
  box-shadow: 0 18px 38px rgba(23,95,82,.12);
}

.bl-card__media { position: relative; margin: 0; aspect-ratio: 16/11; overflow: hidden; }
.bl-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s ease; }
.bl-card:hover .bl-card__media img { transform: scale(1.05); }

.bl-card__date {
  position: absolute; top: 10px; right: 10px;
  min-width: 46px; padding: 6px 8px;
  text-align: center; border-radius: 10px;
  background: rgba(7,44,38,.82);
  backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
  color: #fff; font-family: "Figtree", sans-serif;
}
.bl-card__day   { display: block; font-size: 17px; font-weight: 700; line-height: 1.1; }
.bl-card__month { display: block; font-size: 9.5px; font-weight: 600; letter-spacing: .1em; opacity: .88; }

.bl-card__body { padding: clamp(14px, 1.6vw, 20px); display: flex; flex-direction: column; flex: 1; }

.bl-card__tag {
  margin: 0 0 8px;
  font: 700 10px/1.5 "Figtree", sans-serif;
  letter-spacing: .14em; text-transform: uppercase; color: #1b7061;
}
.bl-card__title {
  margin: 0 0 9px;
  font: 600 clamp(15px, 1.2vw, 17px)/1.42 "Figtree", sans-serif;
  color: #17231f;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  transition: color .25s ease;
}
.bl-card:hover .bl-card__title { color: #175f52; }
.bl-card__excerpt {
  margin: 0 0 14px;
  font: 400 13.5px/1.7 "Figtree", sans-serif; color: #5d6b66;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.bl-card__more {
  margin-top: auto;
  display: inline-flex; align-items: center; gap: 7px;
  font: 700 11px/1 "Figtree", sans-serif;
  letter-spacing: .12em; text-transform: uppercase; color: #175f52;
}
.bl-card__more svg { transition: transform .25s ease; }
.bl-card:hover .bl-card__more svg { transform: translateX(5px); }

/* ── sidebar ─────────────────────────────────────────────────────────── */
.bl-side { display: grid; gap: clamp(16px, 2vw, 24px); position: sticky; top: 92px; }
@media (max-width: 991px) { .bl-side { position: static; } }

.bl-widget {
  border: 1px solid #e8efec;
  border-radius: 16px;
  background: #fff;
  padding: clamp(16px, 1.8vw, 22px);
}
.bl-widget__title {
  margin: 0 0 14px; padding-bottom: 10px;
  font: 400 clamp(18px, 1.6vw, 21px)/1.25 "Belleza", sans-serif;
  color: #175f52; position: relative;
}
.bl-widget__title::after {
  content: ""; position: absolute; left: 0; bottom: 0;
  width: 46px; height: 2px; background: #c9a96e;
}

.bl-latest { display: grid; gap: 13px; }
.bl-latest__item {
  display: grid; grid-template-columns: 58px minmax(0,1fr); gap: 11px;
  align-items: center; text-decoration: none;
}
.bl-latest__item img { width: 58px; height: 50px; object-fit: cover; border-radius: 8px; display: block; }
.bl-latest__title {
  margin: 0 0 3px; font: 600 12.5px/1.45 "Figtree", sans-serif; color: #17231f;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  transition: color .2s ease;
}
.bl-latest__item:hover .bl-latest__title { color: #1b7061; }
.bl-latest__date { font: 400 11px/1.4 "Figtree", sans-serif; color: #8a9793; }

.bl-cats { list-style: none; margin: 0; padding: 0; }
.bl-cats li { border-bottom: 1px dashed #e8efec; }
.bl-cats li:last-child { border-bottom: 0; }
.bl-cats a {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 10px 0; text-decoration: none;
  font: 500 13.5px/1.5 "Figtree", sans-serif; color: #3d4a46;
  transition: color .2s ease;
}
.bl-cats a:hover { color: #175f52; }
.bl-cats__count {
  flex: none; min-width: 24px; padding: 2px 7px; text-align: center;
  border-radius: 999px; background: rgba(70,165,152,.12);
  font: 700 11px/1.5 "Figtree", sans-serif; color: #175f52;
}

/* the enquiry form, narrowed for the sidebar */
.bl-widget .ryp-field { margin-bottom: 12px; }
.bl-widget .ryp-field label { font-size: 12.5px; }
.bl-widget .form-control,
.bl-widget .form-select { font-size: 13.5px; padding: 9px 12px; }
.bl-widget .theme-button { width: 100%; justify-content: center; font-size: 14px; }

/* ── article page ────────────────────────────────────────────────────── */
.bl-post__head { margin-bottom: clamp(16px, 2vw, 24px); }
.bl-post__crumb {
  margin: 0 0 12px; font: 400 12.5px/1.6 "Figtree", sans-serif; color: #7b8783;
}
.bl-post__crumb a { color: #1b7061; text-decoration: none; }
.bl-post__crumb a:hover { text-decoration: underline; }
.bl-post__title {
  margin: 0 0 14px;
  font: 400 clamp(25px, 2.9vw, 38px)/1.22 "Belleza", sans-serif;
  color: #175f52;
}

.bl-meta { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 clamp(16px,2vw,22px); padding: 0; list-style: none; }
.bl-meta li {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 13px; border-radius: 999px;
  border: 1px solid rgba(27,112,97,.22); background: rgba(70,165,152,.07);
  font: 500 12px/1.5 "Figtree", sans-serif; color: #175f52;
}
.bl-meta svg { flex: none; opacity: .75; }

.bl-post__hero { margin: 0 0 clamp(18px,2.2vw,26px); border-radius: 16px; overflow: hidden; }
.bl-post__hero img { width: 100%; height: auto; display: block; }

.bl-toc { margin: 0 0 clamp(18px,2.2vw,26px); }
.bl-toc > summary {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 11px 19px; border-radius: 10px;
  background: #175f52; color: #fff; cursor: pointer; list-style: none;
  font: 600 13.5px/1 "Figtree", sans-serif;
}
.bl-toc > summary::-webkit-details-marker { display: none; }
.bl-toc > summary svg { transition: transform .25s ease; }
.bl-toc[open] > summary svg { transform: rotate(90deg); }
.bl-toc__list {
  margin: 12px 0 0; padding: 14px 18px 14px 32px;
  border: 1px solid #e8efec; border-radius: 12px; background: #fbfdfc;
}
.bl-toc__list li { margin-bottom: 7px; }
.bl-toc__list a { color: #1b7061; text-decoration: none; font: 400 13.5px/1.6 "Figtree", sans-serif; }
.bl-toc__list a:hover { text-decoration: underline; }

.bl-prose h2 {
  margin: clamp(26px,3vw,38px) 0 12px;
  font: 400 clamp(21px,2.1vw,27px)/1.3 "Belleza", sans-serif; color: #175f52;
}
.bl-prose h3 {
  margin: clamp(20px,2.4vw,28px) 0 10px;
  font: 600 clamp(16px,1.5vw,19px)/1.4 "Figtree", sans-serif; color: #17231f;
}
.bl-prose p,
.bl-prose li { font: 400 clamp(14.5px,1.1vw,15.5px)/1.85 "Figtree", sans-serif; color: #3d4a46; }
.bl-prose p { margin: 0 0 15px; }
.bl-prose ul, .bl-prose ol { margin: 0 0 18px; padding-left: 22px; }
.bl-prose li { margin-bottom: 7px; }
.bl-prose a { color: #1b7061; }
.bl-prose img { max-width: 100%; height: auto; border-radius: 12px; margin: 10px 0 18px; }

.bl-prose table {
  width: 100%; border-collapse: collapse; margin: 0 0 20px;
  border: 1px solid #e8efec; border-radius: 12px; overflow: hidden;
  font-family: "Figtree", sans-serif; font-size: 13.5px;
}
.bl-prose thead th {
  background: #175f52; color: #fff; text-align: left;
  padding: 11px 14px; font-weight: 600;
}
.bl-prose tbody td { padding: 11px 14px; border-top: 1px solid #eef3f1; color: #3d4a46; line-height: 1.7; }
.bl-prose tbody tr:nth-child(even) { background: #fbfdfc; }

.bl-post__foot {
  margin-top: clamp(26px,3vw,40px); padding-top: clamp(18px,2vw,24px);
  border-top: 1px solid #e8efec;
}

/* ===========================================================================
   Courses index — /course/
   =========================================================================== */

/* the featured card on the courses index */
.course-details-card { position: relative; }

.course-details-card--featured {
  border: 1px solid #175f52 !important;
  box-shadow: 0 16px 36px rgba(23,95,82,.16) !important;
}

.cs-card__flag {
  position: absolute; top: 0; left: 0; z-index: 3;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 14px 7px 12px;
  border-radius: 14px 0 14px 0;
  background: linear-gradient(135deg, #c9a96e, #e0c48c);
  color: #3f2d08;
  font: 700 10.5px/1 "Figtree", sans-serif;
  letter-spacing: .1em; text-transform: uppercase;
  pointer-events: none;
}

/* the cards in a row should finish level with each other */
.yoga-card-section .row > [class*="col-"] { display: flex; }
.yoga-card-section .course-details-card { width: 100%; display: flex; flex-direction: column; }
.yoga-card-section .course-highlight-footer { margin-top: auto; }

/* a short reassurance strip under the grid */
.cs-note {
  margin-top: clamp(24px, 3vw, 40px);
  padding: clamp(16px, 2vw, 24px);
  border: 1px solid #e8efec; border-radius: 16px;
  background: #fbfdfc;
  display: grid; grid-template-columns: repeat(3, minmax(0,1fr));
  gap: clamp(14px, 2vw, 26px);
}
@media (max-width: 767px) { .cs-note { grid-template-columns: 1fr; } }
.cs-note__item { display: flex; gap: 11px; align-items: flex-start; }
.cs-note__icon {
  flex: none; width: 34px; height: 34px; border-radius: 9px;
  display: grid; place-items: center;
  background: rgba(70,165,152,.12); color: #175f52;
}
.cs-note__title {
  margin: 0 0 3px;
  font: 600 13.5px/1.4 "Figtree", sans-serif; color: #17231f;
}
.cs-note__text { margin: 0; font: 400 12.5px/1.6 "Figtree", sans-serif; color: #5d6b66; }

/* ===========================================================================
   Gallery — the Instagram profile
   =========================================================================== */

.ig-wrap { padding-block: clamp(30px, 4.5vw, 64px); }

/* ── profile header ──────────────────────────────────────────────────── */
.ig-profile {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: clamp(18px, 3vw, 44px);
  align-items: center;
  max-width: 880px;
  margin: 0 auto clamp(26px, 3.6vw, 48px);
  padding: clamp(20px, 2.6vw, 34px);
  border: 1px solid #e8efec;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 10px 34px rgba(23, 95, 82, .07);
}
@media (max-width: 575px) {
  .ig-profile { grid-template-columns: 1fr; justify-items: center; text-align: center; }
}

.ig-avatar {
  width: clamp(92px, 11vw, 142px);
  height: clamp(92px, 11vw, 142px);
  border-radius: 50%;
  padding: 4px;
  background: conic-gradient(from 210deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888, #f09433);
}
.ig-avatar img {
  width: 100%; height: 100%; display: block;
  border-radius: 50%; object-fit: contain;
  background: #fff; border: 4px solid #fff;
}

.ig-id { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 14px; }
.ig-id__handle {
  margin: 0;
  font: 400 clamp(19px, 2vw, 25px)/1.2 "Belleza", sans-serif;
  color: #17231f;
}
.ig-id__verified { display: inline-flex; color: #3897f0; }

.ig-follow {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 20px; border-radius: 9px;
  background: linear-gradient(118deg, #f09433, #dc2743 48%, #bc1888);
  color: #fff; text-decoration: none;
  font: 600 13.5px/1 "Figtree", sans-serif;
  transition: filter .25s ease, transform .25s ease;
}
.ig-follow:hover { filter: brightness(1.08); transform: translateY(-1px); color: #fff; }

/* The Follow buttons are the point of this page, so they are deliberately
   louder than an ordinary link: a halo that breathes once every few seconds
   draws the eye without the page feeling busy. */
.ig-follow--cta {
  position: relative;
  padding: 12px 26px;
  font-size: 14.5px;
  box-shadow: 0 6px 18px -6px rgba(188, 24, 136, .55);
}
.ig-follow--cta::after {
  content: "";
  position: absolute; inset: 0;
  border-radius: inherit;
  border: 2px solid #dc2743;
  opacity: 0;
  pointer-events: none;
  animation: ig-pulse 3.6s cubic-bezier(.22,.61,.36,1) infinite;
}
.ig-follow--cta:hover { transform: translateY(-2px); box-shadow: 0 10px 24px -6px rgba(188, 24, 136, .6); }
.ig-follow--cta:hover::after { animation-play-state: paused; opacity: 0; }
.ig-follow--cta:focus-visible { outline: 3px solid #175f52; outline-offset: 3px; }

.ig-follow--lg { padding: 15px 34px; font-size: 16px; border-radius: 11px; }
.ig-follow--lg svg { width: 19px; height: 19px; }

@keyframes ig-pulse {
  0%   { opacity: .75; transform: scale(1); }
  70%  { opacity: 0;   transform: scale(1.22); }
  100% { opacity: 0;   transform: scale(1.22); }
}
@media (prefers-reduced-motion: reduce) {
  .ig-follow--cta::after { animation: none; }
}

.ig-join {
  margin: 14px 0 0;
  font: 400 13.8px/1.6 "Figtree", sans-serif;
  color: #3d4a46;
}
.ig-join strong { font-weight: 700; color: #175f52; }
.ig-join a { color: #bc1888; font-weight: 600; text-decoration: none; border-bottom: 1px solid rgba(188,24,136,.35); }
.ig-join a:hover { color: #bc1888; border-bottom-color: #bc1888; }

.ig-more__note {
  margin: 12px 0 0;
  font: 400 13.5px/1.6 "Figtree", sans-serif;
  color: #5d6b66;
}

.ig-stats {
  display: flex; flex-wrap: wrap; gap: clamp(18px, 3vw, 38px);
  list-style: none; margin: 0 0 14px; padding: 0;
}
.ig-stats li { font: 400 13.5px/1.5 "Figtree", sans-serif; color: #5d6b66; }
.ig-stats strong { display: block; font: 700 clamp(16px,1.5vw,20px)/1.25 "Figtree", sans-serif; color: #175f52; }

.ig-bio { margin: 0; font: 400 13.8px/1.75 "Figtree", sans-serif; color: #3d4a46; }
.ig-bio span { display: block; }

.ig-more { margin-top: clamp(22px, 3vw, 36px); text-align: center; }