/* ============================================================================
   Sri Yoga Ashram — central site theme
   ----------------------------------------------------------------------------
   This file holds ALL page-level custom CSS that previously lived in inline
   <style> blocks across the site. Load it AFTER plugins.css / style.css /
   templete.css so its overrides win. (The old skin/skin-1.css has been
   merged into the section at the bottom of this file.)

   Palette  : earth #7b6d61 | gold #c79c66 | cream #fbf7f1 | ink #3f3832
   Headings : Marcellus (premium serif), body stays Poppins
   ============================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Marcellus&display=swap');

:root {
    --font-heading: 'Marcellus', Georgia, serif;

    --course-earth: #7b6d61;
    --course-earth-dark: #62564d;
    --course-gold: #c79c66;
    --course-cream: #fbf7f1;
    --course-ink: #3f3832;
    --course-card: #ffffff;
    --course-line: rgba(123, 109, 97, 0.22);
    --course-table-line: rgba(123, 109, 97, 0.4);
    --course-shadow: 0 10px 24px rgba(63, 56, 50, 0.06);

    /* Re-map the shared template tokens (style.css / templete.css read these) */
    --primary: #7b6d61;
    --color-primary: #7b6d61;
    --color-primary-dark: #62564d;
    --color-secondary: #7b6d61;
    --color-accent: #c79c66;
    --color-text: #3f3832;
    --color-black: #3f3832;
    --color-muted: #5c534b;
    --color-light: #f1e7dc;
    --color-surface: #fbf7f1;
    --color-border: #e5ddd3;
    --color-success: #2e9e5b;
    --color-danger: #c0533f;
}

/* ============================================================
   1. Page canvas — one background color everywhere
   ============================================================ */
html,
body,
body#bg,
.page-wraper,
.page-content,
.top-bar,
.main-bar,
.breadcrumb-row {
    background: var(--course-cream) !important;
}

.section-full,
.section-full.bg-white,
.section-full.bg-gray,
.section-full.bg-grey {
    background: var(--course-cream) !important;
}

.section-full.content-inner {
    padding: 56px 0 36px;
}

.section-head {
    margin-bottom: 30px;
}

/* ============================================================
   2. Typography — one uniform scale across the whole site
   (Marcellus ships in one weight; keep 400 to avoid faux bold)
   ============================================================ */
html {
    scroll-behavior: smooth;
}

body {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-size: 16px;
    line-height: 1.7;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    color: var(--course-ink);
    font-family: var(--font-heading);
    font-weight: 400;
    letter-spacing: 0.015em;
}

/* Fluid heading scale — the same hierarchy on every page and viewport */
h1, .h1 { font-size: clamp(28px, 2vw + 20px, 38px);   line-height: 1.25; margin-bottom: 20px; }
h2, .h2 { font-size: clamp(24px, 1.2vw + 18px, 30px); line-height: 1.3;  margin-bottom: 18px; }
h3, .h3 { font-size: clamp(20px, 0.7vw + 17px, 24px); line-height: 1.35; margin-bottom: 14px; }
h4, .h4 { font-size: 19px; line-height: 1.4;  margin-bottom: 12px; }
h5, .h5 { font-size: 17px; line-height: 1.45; margin-bottom: 10px; }
h6, .h6 { font-size: 15px; line-height: 1.5;  margin-bottom: 10px; }

p {
    font-size: 16px;
    line-height: 1.7;
    margin-bottom: 18px;
}

ul li,
ol li {
    line-height: 1.7;
}

/* The shared template un-bolds <strong>; restore real emphasis */
strong, b {
    font-weight: 600;
}

/* Section intro paragraphs read slightly larger, consistently */
.section-head p {
    color: var(--color-muted);
    font-size: 17px;
}

.dez-separator.bg-primary,
.dez-separator-outer .dez-separator.style-liner.bg-primary {
    background-color: var(--course-gold) !important;
}

/* ============================================================
   3. One single background on every page (like the holistic
      course page): sections that used photo backgrounds or
      dark overlays render on the same cream canvas, and their
      "white" text flips to the normal ink/muted colors.
   ============================================================ */
.section-full[class*="overlay-"],
.section-full[style*="background-image"],
.section-full.text-white {
    background: var(--course-cream) !important;
    background-image: none !important;
}

.section-full[class*="overlay-"]:after {
    display: none;
}

/* (scoped to .section-full so footers that legacy markup accidentally
   nests inside .page-wraper keep their own white-on-earth styling) */
.section-full .text-white h1, .section-full .text-white h2,
.section-full .text-white h3, .section-full .text-white h4,
.section-full .text-white h5, .section-full .text-white h6,
.section-full .text-white .h1, .section-full .text-white .h2,
.section-full .text-white .h3, .section-full .text-white .h4,
.section-full .text-white .h5, .section-full .text-white .h6,
.section-full.text-white h1, .section-full.text-white h2,
.section-full.text-white h3, .section-full.text-white h4,
.section-full.text-white h5, .section-full.text-white h6,
.section-full[class*="overlay-"] h1,
.section-full[class*="overlay-"] h2,
.section-full[class*="overlay-"] h3,
.section-full[class*="overlay-"] h4,
.section-full[class*="overlay-"] h5,
.section-full[class*="overlay-"] h6 {
    color: var(--course-ink) !important;
}

.section-full .text-white,
.section-full .text-white p,
.section-full .text-white li,
.section-full.text-white p,
.section-full.text-white li,
.section-full[class*="overlay-"] p,
.section-full[class*="overlay-"] li,
.section-full[style*="background-image"] p,
.section-full[style*="background-image"] li {
    color: var(--color-muted) !important;
}

.section-full .text-white .text-primary,
.section-full.text-white .text-primary,
.section-full[class*="overlay-"] .text-primary,
.section-full[style*="background-image"] .text-primary {
    color: var(--course-earth) !important;
}

.section-full .text-white a:not(.site-button):not(.enroll-btn):not(.enroll-btn a):not(.site-button a),
.section-full a.text-white:not(.site-button):not(.enroll-btn):not(.enroll-btn a):not(.site-button a) {
    color: var(--course-earth) !important;
}

.section-full .text-white a:not(.site-button):not(.enroll-btn):not(.enroll-btn a):not(.site-button a):hover,
.section-full a.text-white:not(.site-button):not(.enroll-btn):not(.enroll-btn a):not(.site-button a):hover {
    color: var(--course-gold) !important;
}

/* Anchors styled as buttons keep white text on their earth background */
.enroll-btn a,
.enroll-btn a.text-white,
.site-button:not(.white) .text-white,
a.site-button:not(.white),
.page-wraper a.enroll-btn {
    color: #fff !important;
}

/* Full-width colored column panels (e.g. video + text splits) flatten
   onto the single cream background */
[class*="col-"].bg-primary,
[class*="col-"].bg-secondry,
.dis-tbl.bg-primary {
    background-color: var(--course-cream) !important;
}

/* White separator lines used inside the old dark sections */
.section-full .dez-separator.bg-white {
    background-color: var(--course-gold) !important;
}

/* Team-member cards: the earth name bar under the photo keeps white text */
.section-full .dez-box-team,
.section-full .dez-box-team p,
.section-full .dez-box-team a,
.section-full .dez-box-team span,
.section-full .dez-box-team .dez-member-position,
.section-full .dez-box-team h1, .section-full .dez-box-team h2,
.section-full .dez-box-team h3, .section-full .dez-box-team h4,
.section-full .dez-box-team h5, .section-full .dez-box-team h6 {
    color: #fff !important;
}

/* Team-member cards: the sliding info bar keeps its earth background,
   so everything on it stays white */
.section-full .dez-info-has {
    background-color: rgba(123, 109, 97, 0.92) !important;
}

.section-full .dez-info-has h1, .section-full .dez-info-has h2,
.section-full .dez-info-has h3, .section-full .dez-info-has h4,
.section-full .dez-info-has h5, .section-full .dez-info-has h6,
.section-full .dez-info-has p,
.section-full .dez-info-has span,
.section-full .dez-info-has a,
.section-full .dez-info-has .dez-member-position {
    color: #fff !important;
}

/* Short "Note:" strips (counter-style-1) read as styled callouts */
.section-full .counter-style-1 {
    margin-bottom: 0 !important;
}

.section-full .counter-style-1 p {
    color: var(--course-earth) !important;
    font-family: var(--font-heading);
    font-size: 20px;
    letter-spacing: 0.03em;
    margin: 0;
    text-align: center;
}

.section-full.content-inner:has(.counter-style-1) {
    border-bottom: 1px solid rgba(199, 156, 102, 0.5);
    border-top: 1px solid rgba(199, 156, 102, 0.5);
    padding: 28px 0;
}

/* Text sitting on white surfaces (cards, tabs, tables, quotes) inside earth
   bands must stay ink — these come after the band rules so they win. */
.section-full .tab-content1,
.section-full .tab-content1 h1,
.section-full .tab-content1 h2,
.section-full .tab-content1 h3,
.section-full .tab-content1 h4,
.section-full .tab-content1 h5,
.section-full .tab-content1 h6,
.section-full .tab-content1 p,
.section-full .tab-content1 li,
.section-full .dez-tabs .tab-content,
.section-full .dez-tabs .tab-content h1,
.section-full .dez-tabs .tab-content h2,
.section-full .dez-tabs .tab-content h3,
.section-full .dez-tabs .tab-content h4,
.section-full .dez-tabs .tab-content h5,
.section-full .dez-tabs .tab-content h6,
.section-full .dez-tabs .tab-content p,
.section-full .dez-tabs .tab-content li,
.section-full blockquote,
.section-full blockquote p,
.section-full blockquote li,
.section-full table td,
.section-full table td p,
.section-full table td li,
.section-full .acod-content,
.section-full .acod-content p,
.section-full .acod-content li,
.section-full .content-card,
.section-full .content-card p,
.section-full .content-card li,
.section-full .feature-item,
.section-full .feature-item p,
.section-full .feature-item li,
.section-full .dez-box,
.section-full .dez-box p,
.section-full .dez-box a,
.section-full .dez-box h1,
.section-full .dez-box h2,
.section-full .dez-box h3,
.section-full .dez-box h4,
.section-full .dez-box h5,
.section-full .dez-box h6 {
    color: var(--course-ink) !important;
}

/* Inner page banners keep their photo, tinted to the palette */
.dez-bnr-inr[class*="overlay-"]:after {
    background: var(--course-earth) !important;
    background-color: var(--course-earth) !important;
    opacity: 0.55 !important;
}

/* Banner used on the holistic course page (plain image, no overlay) */
.course-banner {
    background: none !important;
    display: block !important;
    height: auto !important;
    line-height: 0;
    overflow: hidden;
}

.course-banner img {
    display: block;
    height: auto;
    width: 100%;
}

/* Banner image block on the astro course page */
.ay-banner-img {
    line-height: 0;
}

.ay-banner-img img {
    height: auto;
    width: 100%;
}

/* ============================================================
   4. Header, breadcrumb, scroll-top, footer
   ============================================================ */
.top-bar {
    border-bottom: 1px solid var(--course-line);
    color: var(--course-ink);
}

.top-bar a,
.dez-topbar-left li,
.dez-topbar-left a,
.topbar-social a {
    color: var(--course-ink) !important;
}

.topbar-social a:hover,
.dez-topbar-left a:hover {
    color: var(--course-gold) !important;
}

/* ---------- Main menu: clearly readable ink text ---------- */
.header-nav .nav > li > a {
    color: var(--course-ink) !important;
    font-size: 15px;
    font-weight: 500;
}

.header-nav .nav > li:hover > a,
.header-nav .nav > li.active > a {
    color: var(--course-earth) !important;
}

.header-nav .nav > li > a:after,
.header-nav .nav > li.active > a:after {
    background-color: var(--course-gold) !important;
}

/* Dropdowns & mega menu: white panels, ink links, gold accents */
@media (min-width: 992px) {
    .header-nav .nav > li > .sub-menu,
    .header-nav .nav > li > .mega-menu,
    .header-nav .nav > li .sub-menu li > .sub-menu {
        background-color: #fff !important;
        border: 1px solid var(--course-line) !important;
        border-radius: 0 0 8px 8px;
        border-top: 3px solid var(--course-gold) !important;
        box-shadow: 0 16px 34px rgba(63, 56, 50, 0.14);
    }

    .header-nav .nav > li .sub-menu li a,
    .header-nav .nav > li .mega-menu ul li a {
        color: var(--course-ink) !important;
        font-weight: 400;
    }

    .header-nav .nav > li .sub-menu li:hover > a,
    .header-nav .nav > li .sub-menu li.active > a,
    .header-nav .nav > li .mega-menu ul li:hover > a,
    .nav-dark.header-nav .nav > li .sub-menu li:hover > a,
    .nav-dark.header-nav .nav > li .mega-menu > li ul a:hover,
    .nav-dark.header-nav .nav > li .mega-menu ul li:hover > a {
        background-color: var(--course-cream) !important;
        color: var(--course-earth) !important;
    }

    /* Mega menu column headings */
    .header-nav .nav > li .mega-menu > li > a {
        border-bottom: 1px solid rgba(199, 156, 102, 0.5) !important;
        color: var(--course-earth) !important;
        font-family: var(--font-heading);
        font-size: 16px;
        font-weight: 400 !important;
    }

    /* Keep headings readable on hover (style.css nav-dark rule turns them white) */
    .header-nav .nav > li .mega-menu > li > a:hover,
    .nav-dark.header-nav .nav > li .mega-menu > li > a:hover,
    .nav-dark.header-nav .nav > li ul.mega-menu > li > a:hover {
        color: var(--course-earth) !important;
    }
}

/* Mobile slide-in menu: deep earth panel, fully white links */
@media (max-width: 991px) {
    .header-nav.navbar-collapse,
    .header-nav .nav,
    .header-nav .nav > li > .sub-menu,
    .header-nav .nav > li > .mega-menu {
        background-color: var(--course-earth-dark) !important;
    }

    .header-nav .nav > li > a {
        color: #fff !important;
    }

    .header-nav .nav > li .sub-menu li a,
    .header-nav .nav > li .mega-menu ul li a,
    .header-nav .nav > li .mega-menu > li > a {
        color: rgba(255, 255, 255, 0.92) !important;
    }

    .header-nav .nav > li:hover > a,
    .header-nav .nav > li.active > a,
    .header-nav .nav > li .sub-menu li:hover > a,
    .header-nav .nav > li .mega-menu ul li:hover > a {
        color: var(--course-gold) !important;
    }

    .header-nav .nav > li,
    .header-nav .nav > li .sub-menu li,
    .header-nav .nav > li .mega-menu li {
        border-color: rgba(255, 255, 255, 0.12) !important;
    }
}

.breadcrumb-row {
    border-bottom: 1px solid var(--course-line);
}

.breadcrumb-row ul li,
.breadcrumb-row ul li a {
    color: var(--course-earth) !important;
}

.breadcrumb-row ul li:after {
    color: var(--course-earth) !important;
}

button.scroltop {
    background: #fff !important;
    border: 1px solid var(--course-line) !important;
    border-radius: 50%;
    box-shadow: 0 6px 16px rgba(63, 56, 50, 0.22);
    color: var(--course-earth) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

button.scroltop:hover {
    background: var(--course-gold) !important;
    border-color: var(--course-gold) !important;
    color: #fff !important;
}

.site-footer,
.site-footer .footer-top,
.site-footer .footer-bottom,
.site-footer .footer-image {
    background-color: var(--course-earth) !important;
    background-image: none !important;
}

.site-footer .overlay-black-dark:after {
    display: none;
}

.site-footer a,
.site-footer a:hover {
    color: #fff !important;
}

.site-footer h1, .site-footer h2, .site-footer h3,
.site-footer h4, .site-footer h5, .site-footer h6 {
    color: #fff;
}

/* ============================================================
   5. Buttons
   ============================================================ */
.site-button,
.enroll-btn {
    background: var(--course-earth) !important;
    border: 1px solid var(--course-earth) !important;
    border-radius: 6px;
    box-shadow: 0 8px 18px rgba(123, 109, 97, 0.18);
    color: #fff !important;
    cursor: pointer;
    display: inline-block;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none !important;
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

a.enroll-btn,
button.enroll-btn {
    padding: 9px 20px;
}

.site-button:hover,
.site-button:focus,
.site-button:active,
.enroll-btn:hover,
.enroll-btn:focus {
    background: var(--course-gold) !important;
    border-color: var(--course-gold) !important;
    box-shadow: 0 10px 22px rgba(199, 156, 102, 0.28);
    color: #fff !important;
    transform: translateY(-1px);
}

/* White pill variant (used by tab/filter buttons) */
.site-button.white {
    background: #fff !important;
    border-color: var(--course-gold) !important;
    color: var(--course-earth) !important;
}

.site-button.white:hover,
.site-button.white:focus,
.site-filters .active > .site-button.white,
.site-button.white[aria-selected="true"] {
    background: var(--course-gold) !important;
    border-color: var(--course-gold) !important;
    color: #fff !important;
}

/* ============================================================
   6. Perk cards (icon cards strip under the banner)
      Legacy markup: .main-card > .box > .card
      Holistic markup: .perk-grid > .perk-card
   ============================================================ */
.main-card {
    margin: auto;
    max-width: 1140px;
    padding: 20px 15px 0;
}

.box {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: space-between;
}

.box .card {
    background: var(--course-card);
    border: 1px solid var(--course-line);
    border-bottom: 3px solid var(--course-gold);
    border-radius: 10px;
    box-shadow: var(--course-shadow);
    flex: 1 1 0;
    min-width: 170px;
    padding: 18px 12px 14px;
    text-align: center;
}

.box .card .icon,
.main-card .icon,
.main-card .icon span {
    color: var(--course-gold) !important;
    font-size: 30px;
    padding: 0 0 10px;
}

.box .card h6 {
    color: var(--course-ink);
    font-size: 16px;
    line-height: 1.4;
    margin: 0;
}

.perk-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin: 0 auto;
    max-width: 1140px;
    padding: 30px 15px 0;
}

.perk-card {
    background: var(--course-card);
    border: 1px solid var(--course-line);
    border-bottom: 3px solid var(--course-gold);
    border-radius: 10px;
    box-shadow: var(--course-shadow);
    flex: 1 1 0;
    min-width: 170px;
    padding: 18px 12px 14px;
    text-align: center;
}

.perk-card .icon {
    color: var(--course-gold);
    font-size: 30px;
    margin-bottom: 10px;
}

.perk-card h6 {
    font-size: 16px;
    line-height: 1.4;
    margin: 0;
}

/* ============================================================
   7. Note / CTA strips and seat notices
   ============================================================ */
.course-note {
    border-bottom: 1px solid rgba(199, 156, 102, 0.5);
    border-top: 1px solid rgba(199, 156, 102, 0.5);
    padding: 28px 0;
    text-align: center;
}

.course-note p {
    color: var(--course-earth);
    font-family: var(--font-heading);
    font-size: 20px;
    font-weight: 400;
    letter-spacing: 0.03em;
    margin: 0;
    text-align: center; /* the shared stylesheet justifies paragraphs */
}

.course-note .site-button {
    margin-top: 18px;
    padding: 12px 28px;
}

.seats-notice {
    align-items: center;
    color: var(--course-earth);
    display: flex;
    font-weight: 600;
    gap: 10px;
    justify-content: center;
    margin: 0 0 4px;
    text-align: center;
}

.seats-notice .pulse-dot {
    animation: seats-pulse 1.6s ease-in-out infinite;
    background: var(--course-gold);
    border-radius: 50%;
    display: inline-block;
    flex: 0 0 auto;
    height: 9px;
    width: 9px;
}

@keyframes seats-pulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.5); opacity: 0.55; }
}

/* Legacy marquee wrapper (kept for any page still using it) */
.discount-wrap {
    background: var(--course-card);
    border: 1px solid rgba(199, 156, 102, 0.35);
    border-radius: 6px;
    color: var(--course-earth) !important;
    display: block;
    font-weight: 700;
    padding: 8px 12px;
}

.discount-value {
    color: var(--course-gold) !important;
}

/* ============================================================
   8. Content tables (course dates, fee inclusions, ...)
   ============================================================ */
.section-full table {
    background: var(--course-card);
    border: 1px solid var(--course-table-line);
    border-collapse: separate;
    border-radius: 10px;
    border-spacing: 0;
    box-shadow: 0 12px 28px rgba(63, 56, 50, 0.08);
    color: var(--course-ink);
    margin: 16px 0 10px;
    overflow: hidden;
    width: 100%;
}

.section-full table th {
    background: var(--course-gold) !important;
    border: none;
    border-bottom: 1px solid var(--course-table-line);
    color: #fff !important;
    font-weight: 600;
    padding: 12px 10px;
    text-align: center;
}

.section-full table th + th {
    border-left: 1px solid rgba(255, 255, 255, 0.4);
}

.section-full table td {
    border: none;
    border-top: 1px solid var(--course-table-line);
    padding: 12px 10px;
    text-align: center;
    vertical-align: middle;
}

.section-full table td + td {
    border-left: 1px solid var(--course-table-line);
}

.dates {
    position: relative;
    text-align: center;
}

.price {
    color: var(--course-ink);
    font-weight: 700;
}

.strikethrough {
    color: #9b9189;
    font-size: 0.8em;
    text-decoration: line-through;
}

.seats-left {
    background: var(--course-gold) !important;
    border-radius: 15px;
    color: #fff !important;
    display: inline-block;
    font-size: 0.8em;
    margin-top: 6px;
    padding: 2px 12px;
    position: relative;
    text-align: center;
}

.fa-check {
    color: var(--course-earth);
}

.fa-times {
    color: var(--course-gold);
}

/* The holistic page table uses an explicit class; same look */
.course-table { width: 100%; }
.course-table .price { color: var(--course-ink); font-weight: 700; }

/* ============================================================
   9. Tabs
      a) Bootstrap tabs (.dez-tabs.bg-tabs) — course modules
      b) Legacy label tabs (.tabs / .tab-link / .tab-content1)
   ============================================================ */
.dez-tabs.bg-tabs .nav-tabs {
    border-bottom: 0;
    gap: 6px;
}

.dez-tabs.bg-tabs .nav-tabs .nav-link,
.dez-tabs.bg-tabs .nav-tabs > li > a {
    background: var(--course-card) !important;
    border: 1px solid var(--course-line) !important;
    border-radius: 6px;
    color: var(--course-earth) !important;
    font-weight: 600;
    margin: 0;
}

.dez-tabs.bg-tabs .nav-tabs .nav-link.active,
.dez-tabs.bg-tabs .nav-tabs > li > a.active,
.dez-tabs.bg-tabs .nav-tabs > li.active > a {
    background: var(--course-gold) !important;
    border-color: var(--course-gold) !important;
    color: #fff !important;
}

.dez-tabs.bg-tabs .nav-tabs .title-head {
    color: inherit !important;
}

.dez-tabs.bg-tabs .tab-content {
    background: var(--course-card);
    border: 1px solid var(--course-line);
    border-radius: 8px;
    box-shadow: var(--course-shadow);
    margin-top: 8px;
    padding: 24px;
}

.dez-tabs.bg-tabs .tab-pane {
    padding: 0;
}

.tabs {
    border-bottom: 0;
    display: flex;
    flex-direction: column;
}

.tab-link {
    color: var(--course-earth);
    font-size: 1.1rem;
    margin: 5px 0;
    text-decoration: none;
}

.tab-link label {
    background: var(--course-card) !important;
    border: 1px solid var(--course-line);
    border-radius: 6px;
    color: var(--course-earth) !important;
    cursor: pointer;
    display: block;
    font-weight: 600;
    padding: 10px 14px;
}

.tab-link label.active {
    background: var(--course-gold) !important;
    border-color: var(--course-gold);
    color: #fff !important;
}

.tab-content1 {
    animation: fadeIn 0.3s ease-in-out;
    background: var(--course-card);
    border: 1px solid var(--course-line);
    border-radius: 0 0 8px 8px;
    color: var(--course-ink);
    display: none;
    padding: 18px;
}

.tab-content1 h2 {
    font-size: 24px;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ============================================================
   10. Daily schedule cards
   ============================================================ */
.schedule {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 10px;
    text-align: left;
}

.time-slot {
    align-items: center;
    background: var(--course-card) !important;
    border: 1px solid var(--course-line) !important;
    border-radius: 8px;
    box-shadow: var(--course-shadow);
    color: var(--course-ink) !important;
    display: flex;
    flex: 1 1 calc(50% - 12px);
    gap: 12px;
    margin-bottom: 0;
    min-width: 270px;
    padding: 10px 14px;
    width: auto;
}

.time-slot span {
    background: var(--course-gold) !important;
    border-radius: 6px;
    color: #fff !important;
    flex: 0 0 auto;
    font-size: 14px;
    font-weight: 600;
    padding: 8px 10px;
    white-space: nowrap;
}

/* ============================================================
   11. Cards & feature blocks (holistic-style content layout)
   ============================================================ */
.content-card {
    background: var(--course-card);
    border: 1px solid var(--course-line);
    border-radius: 10px;
    box-shadow: var(--course-shadow);
    height: 100%;
    padding: 24px;
    width: 100%;
}

.feature-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(3, 1fr);
}

.feature-grid.feature-grid-2 {
    grid-template-columns: repeat(2, 1fr);
}

.feature-item {
    background: var(--course-card);
    border: 1px solid var(--course-line);
    border-left: 4px solid var(--course-gold);
    border-radius: 8px;
    box-shadow: var(--course-shadow);
    padding: 20px;
}

.feature-item h3 {
    font-size: 19px;
    margin-bottom: 8px;
}

.feature-item p {
    margin: 0;
}

.intro-media img {
    border: 1px solid var(--course-line);
    border-radius: 10px;
    box-shadow: var(--course-shadow);
    height: auto;
    width: 100%;
}

.sub-points {
    list-style: disc;
    margin: 8px 0 0;
    padding-left: 22px;
}

.sub-points li {
    padding: 2px 0;
}

.sub-points li:before {
    display: none;
}

@media (min-width: 768px) {
    .benefits-list {
        column-count: 2;
        column-gap: 36px;
    }

    .benefits-list li {
        break-inside: avoid;
    }
}

/* ============================================================
   12. Quotes, lists, accents
   ============================================================ */
blockquote {
    background: var(--course-card);
    border-left: 4px solid var(--course-gold);
    border-radius: 0 8px 8px 0;
    box-shadow: var(--course-shadow);
    color: var(--course-ink);
    font-size: 15px;
    font-style: normal;
    line-height: 1.6;
    margin: 20px 0 0;
    padding: 16px 20px;
}

blockquote:before {
    display: none;
}

blockquote p {
    color: var(--course-ink);
    font-size: 15px;
    line-height: 1.6;
}

.list-num-count > li:before {
    background-color: var(--course-gold) !important;
}

.navbar-toggle,
.widget_gallery li:hover,
.border-4 {
    border-color: var(--course-earth) !important;
}

/* ============================================================
   12b. Images & media cards
   ============================================================ */
.section-full img {
    border-radius: 8px;
    height: auto;
    max-width: 100%;
}

/* Full-bleed banner imagery stays square-cornered */
.dez-bnr-inr img,
.course-banner img,
.ay-banner-img img {
    border-radius: 0;
}

/* Embedded media never overflows the viewport */
.section-full iframe,
.section-full video {
    max-width: 100%;
}

/* Video / review cards */
.section-full .dez-box {
    background: var(--course-card);
    border: 1px solid var(--course-line);
    border-radius: 10px;
    box-shadow: var(--course-shadow);
    overflow: hidden;
}

.section-full .dez-box iframe {
    border: 0;
    border-radius: 8px;
    display: block;
    width: 100%;
}

/* ============================================================
   12c. Premium polish — spacing, equal-height cards, carousels
   ============================================================ */

/* Justified text creates uneven word gaps; flush-left reads cleaner.
   Centered contexts stay centered. */
.section-full p,
.section-full li {
    text-align: left;
}

.section-full .text-center p,
.section-full .section-head p,
.section-full .counter-style-1 p,
.course-note p {
    text-align: center;
}

/* Perk/icon cards: equal heights, centered content, room below the strip */
.main-card {
    margin-bottom: 14px;
}

.box,
.perk-grid {
    align-items: stretch;
}

.box .card,
.perk-card {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Numbered lists: a little breathing room */
.list-num-count > li {
    margin-bottom: 6px;
}

/* Nested sub-lists inside numbered lists (book titles, seasons, ...) */
.list-num-count ul {
    list-style: disc;
    margin: 8px 0 4px;
    padding-left: 24px;
}

.list-num-count ul li {
    margin-bottom: 2px;
    padding: 2px 0;
}

.list-num-count ul li:before {
    display: none;
}

/* Owl carousels: cards stretch to equal height, media is uniform,
   and the CTA pins to the bottom edge so buttons align across cards */
.owl-carousel .owl-stage {
    display: flex;
}

.owl-carousel .owl-item {
    display: flex;
    height: auto;
}

.owl-carousel .owl-item > .item {
    display: flex;
    width: 100%;
}

.ow-carousel-entry {
    background: var(--course-card);
    border: 1px solid var(--course-line);
    border-radius: 10px;
    box-shadow: var(--course-shadow);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    width: 100%;
}

.ow-carousel-entry .ow-entry-media {
    flex: 0 0 auto;
}

.ow-carousel-entry .ow-entry-media img {
    border-radius: 0;
    height: 230px;
    object-fit: cover;
    width: 100%;
}

.ow-carousel-entry .ow-entry-content {
    border: none;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    padding: 20px 18px 22px;
}

.ow-carousel-entry .ow-entry-title h3 {
    font-size: 20px;
    margin-bottom: 10px;
}

.ow-carousel-entry .ow-entry-text p {
    margin-bottom: 0;
}

.ow-carousel-entry .ow-entry-content > div:last-child {
    margin-top: auto;
    padding-top: 16px;
}

/* Carousel arrows & dots in the palette */
.owl-carousel .owl-nav .owl-prev,
.owl-carousel .owl-nav .owl-next,
.owl-carousel .owl-prev,
.owl-carousel .owl-next {
    background: #fff !important;
    border: 1px solid var(--course-line) !important;
    border-radius: 50% !important;
    box-shadow: 0 6px 16px rgba(63, 56, 50, 0.12);
    color: var(--course-earth) !important;
    height: 42px !important;
    opacity: 1 !important;
    width: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.owl-carousel .owl-nav .owl-prev:hover,
.owl-carousel .owl-nav .owl-next:hover,
.owl-carousel .owl-prev:hover,
.owl-carousel .owl-next:hover {
    background: var(--course-gold) !important;
    border-color: var(--course-gold) !important;
    color: #fff !important;
}

.owl-carousel .owl-dots .owl-dot span {
    background: rgba(123, 109, 97, 0.3) !important;
}

.owl-carousel .owl-dots .owl-dot.active span {
    background: var(--course-gold) !important;
}

/* Equal-height card rows built on bootstrap columns */
.section-full .row > [class*="col-"] > .dez-box {
    height: 100%;
}

/* ============================================================
   12d. Interaction polish
   ============================================================ */
::selection {
    background: var(--course-gold);
    color: #fff;
}

a {
    transition: color 0.2s ease;
}

a:focus-visible,
button:focus-visible {
    outline: 2px solid var(--course-gold);
    outline-offset: 2px;
}

/* Cards lift gently on hover so the page feels responsive */
.content-card,
.feature-item,
.perk-card,
.box .card,
.section-full .dez-box,
.ow-carousel-entry {
    transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.content-card:hover,
.feature-item:hover,
.perk-card:hover,
.box .card:hover,
.section-full .dez-box:hover,
.ow-carousel-entry:hover {
    box-shadow: 0 14px 30px rgba(63, 56, 50, 0.12);
    transform: translateY(-3px);
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

/* ============================================================
   13. Responsive
   ============================================================ */
@media (max-width: 991px) {
    .feature-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .section-full.content-inner {
        padding: 40px 0 24px;
    }

    .feature-grid,
    .feature-grid.feature-grid-2 {
        grid-template-columns: 1fr;
    }

    .box .card,
    .perk-card {
        flex: 1 1 calc(50% - 16px);
    }

    .time-slot {
        flex-basis: 100%;
        min-width: 0;
    }

    .hide-mobile {
        display: none;
    }

    /* Keep the copyright line clear of the fixed WhatsApp bar on
       small screens */
    .site-footer .footer-info-box {
        padding-bottom: 88px;
    }

    /* WhatsApp becomes a full-width bottom bar on mobile; the
       scroll-top arrow sits above it so both stay visible */
    button.scroltop {
        bottom: 72px !important;
        height: 44px;
        line-height: 44px;
        right: 12px;
        width: 44px;
        z-index: 1001;
    }

    /* Stack content tables into labelled cards */
    .section-full table thead {
        display: none;
    }

    .section-full table tbody tr {
        display: block;
        padding: 4px 0;
    }

    .section-full table td {
        border-left: none;
        border-top: none;
        display: block;
        padding: 10px 16px;
        text-align: left;
    }

    .section-full table td + td {
        border-left: none;
        border-top: 1px dashed var(--course-table-line);
    }

    .section-full table td[data-label]::before {
        color: var(--course-earth);
        content: attr(data-label);
        display: block;
        font-size: 0.85em;
        font-weight: 600;
        margin-bottom: 4px;
    }
}

@media (max-width: 480px) {
    .box .card,
    .perk-card {
        flex-basis: 100%;
    }
}

/* ============================================================
   14. Hugeicons (free set, self-hosted as colorable masks)
   Usage: <i class="hicon hicon-taxi-02"></i> - inherits color
   ============================================================ */
.hicon {
    /* the mask fill IS the background-color; !important guards against
       template rules that put chip backgrounds on <i> elements */
    background-color: currentColor !important;
    display: inline-block;
    height: 1em;
    width: 1em;
    flex: 0 0 auto;
    vertical-align: -0.125em;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.hicon-arrow-down-01 { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22M18 9s-4.419 6-6 6s-6-6-6-6%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22M18 9s-4.419 6-6 6s-6-6-6-6%22/%3E%3C/svg%3E"); }
.hicon-arrow-left-double { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22M11.5 18s-6-4.419-6-6s6-6 6-6m7 12s-6-4.419-6-6s6-6 6-6%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22M11.5 18s-6-4.419-6-6s6-6 6-6m7 12s-6-4.419-6-6s6-6 6-6%22/%3E%3C/svg%3E"); }
.hicon-arrow-right-01 { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22M9 6s6 4.419 6 6s-6 6-6 6%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22M9 6s6 4.419 6 6s-6 6-6 6%22/%3E%3C/svg%3E"); }
.hicon-arrow-right-double { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22M12.5 18s6-4.419 6-6s-6-6-6-6m-7 12s6-4.419 6-6s-6-6-6-6%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22M12.5 18s6-4.419 6-6s-6-6-6-6m-7 12s6-4.419 6-6s-6-6-6-6%22/%3E%3C/svg%3E"); }
.hicon-arrow-up-01 { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22M18 15s-4.42-6-6-6s-6 6-6 6%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22M18 15s-4.42-6-6-6s-6 6-6 6%22/%3E%3C/svg%3E"); }
.hicon-badge { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22m14.394 3l-.246-.209a3.31 3.31 0 0 0-4.296 0l-.246.21a4 4 0 0 1-2.276.943l-.323.025A3.31 3.31 0 0 0 3.97 7.007l-.025.323A4 4 0 0 1 3 9.606l-.21.246a3.31 3.31 0 0 0 0 4.296l.21.246a4 4 0 0 1 .943 2.276l.025.323a3.31 3.31 0 0 0 3.038 3.038l.323.025A4 4 0 0 1 9.606 21l.246.21a3.31 3.31 0 0 0 4.296 0l.246-.21a4 4 0 0 1 2.276-.943l.323-.025a3.31 3.31 0 0 0 3.038-3.038l.025-.323A4 4 0 0 1 21 14.394l.21-.246a3.31 3.31 0 0 0 0-4.296L21 9.606a4 4 0 0 1-.943-2.276l-.025-.323a3.31 3.31 0 0 0-3.038-3.038l-.323-.025A4 4 0 0 1 14.394 3Z%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22m14.394 3l-.246-.209a3.31 3.31 0 0 0-4.296 0l-.246.21a4 4 0 0 1-2.276.943l-.323.025A3.31 3.31 0 0 0 3.97 7.007l-.025.323A4 4 0 0 1 3 9.606l-.21.246a3.31 3.31 0 0 0 0 4.296l.21.246a4 4 0 0 1 .943 2.276l.025.323a3.31 3.31 0 0 0 3.038 3.038l.323.025A4 4 0 0 1 9.606 21l.246.21a3.31 3.31 0 0 0 4.296 0l.246-.21a4 4 0 0 1 2.276-.943l.323-.025a3.31 3.31 0 0 0 3.038-3.038l.025-.323A4 4 0 0 1 21 14.394l.21-.246a3.31 3.31 0 0 0 0-4.296L21 9.606a4 4 0 0 1-.943-2.276l-.025-.323a3.31 3.31 0 0 0-3.038-3.038l-.323-.025A4 4 0 0 1 14.394 3Z%22/%3E%3C/svg%3E"); }
.hicon-binoculars { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22M21.855 15.5L18.93 5.607A2.26 2.26 0 0 0 16.76 4c-1.285 0-2.312 1.057-2.258 2.324L15 16m7 .5a3.5 3.5 0 1 1-7 0a3.5 3.5 0 0 1 7 0M10 8h4m-5 8h6m-12.855-.5L5.07 5.607A2.26 2.26 0 0 1 7.24 4c1.284 0 2.31 1.057 2.257 2.324L9 16m0 .5a3.5 3.5 0 1 1-7 0a3.5 3.5 0 0 1 7 0%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22M21.855 15.5L18.93 5.607A2.26 2.26 0 0 0 16.76 4c-1.285 0-2.312 1.057-2.258 2.324L15 16m7 .5a3.5 3.5 0 1 1-7 0a3.5 3.5 0 0 1 7 0M10 8h4m-5 8h6m-12.855-.5L5.07 5.607A2.26 2.26 0 0 1 7.24 4c1.284 0 2.31 1.057 2.257 2.324L9 16m0 .5a3.5 3.5 0 1 1-7 0a3.5 3.5 0 0 1 7 0%22/%3E%3C/svg%3E"); }
.hicon-calendar-03 { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22M16 2v4M8 2v4m5-2h-2C7.229 4 5.343 4 4.172 5.172S3 8.229 3 12v2c0 3.771 0 5.657 1.172 6.828S7.229 22 11 22h2c3.771 0 5.657 0 6.828-1.172S21 17.771 21 14v-2c0-3.771 0-5.657-1.172-6.828S16.771 4 13 4M3 10h18%22/%3E%3Cpath d=%22M12.126 14H12m.125 4H12m-4.376-4H7.5m.125 4H7.5m9.125-4H16.5m-4.25 0a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0m0 4a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0m-4.5-4a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0m0 4a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0m9-4a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0%22/%3E%3C/g%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22M16 2v4M8 2v4m5-2h-2C7.229 4 5.343 4 4.172 5.172S3 8.229 3 12v2c0 3.771 0 5.657 1.172 6.828S7.229 22 11 22h2c3.771 0 5.657 0 6.828-1.172S21 17.771 21 14v-2c0-3.771 0-5.657-1.172-6.828S16.771 4 13 4M3 10h18%22/%3E%3Cpath d=%22M12.126 14H12m.125 4H12m-4.376-4H7.5m.125 4H7.5m9.125-4H16.5m-4.25 0a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0m0 4a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0m-4.5-4a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0m0 4a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0m9-4a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0%22/%3E%3C/g%3E%3C/svg%3E"); }
.hicon-calendar-check-in-01 { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22M16 2v4M8 2v4m13 10v-4c0-3.771 0-5.657-1.172-6.828S16.771 4 13 4h-2C7.229 4 5.343 4 4.172 5.172S3 8.229 3 12v2c0 3.771 0 5.657 1.172 6.828S7.229 22 11 22h1M3 10h18%22/%3E%3Cpath d=%22M21 19.5h-6.5m2 2.5c-.506-.491-2.5-1.8-2.5-2.5s1.994-2.009 2.5-2.5%22/%3E%3C/g%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22M16 2v4M8 2v4m13 10v-4c0-3.771 0-5.657-1.172-6.828S16.771 4 13 4h-2C7.229 4 5.343 4 4.172 5.172S3 8.229 3 12v2c0 3.771 0 5.657 1.172 6.828S7.229 22 11 22h1M3 10h18%22/%3E%3Cpath d=%22M21 19.5h-6.5m2 2.5c-.506-.491-2.5-1.8-2.5-2.5s1.994-2.009 2.5-2.5%22/%3E%3C/g%3E%3C/svg%3E"); }
.hicon-call-02 { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-width=%221.5%22 d=%22m9.159 5.712l-.403-.906c-.263-.592-.395-.888-.592-1.115a2 2 0 0 0-.928-.603C6.949 3 6.625 3 5.976 3c-.948 0-1.422 0-1.82.182a2.12 2.12 0 0 0-1.061 1.169c-.143.413-.102.838-.02 1.689q1.31 13.575 14.886 14.885c.85.082 1.275.123 1.689-.02a2.12 2.12 0 0 0 1.168-1.06c.182-.399.182-.873.182-1.821c0-.649 0-.973-.088-1.26a2 2 0 0 0-.603-.928c-.226-.197-.523-.328-1.115-.592l-.906-.402c-.642-.285-.962-.428-1.288-.459a2 2 0 0 0-.919.128c-.305.119-.574.343-1.114.793c-.537.447-.805.67-1.133.79a2.16 2.16 0 0 1-.981.101c-.346-.05-.61-.192-1.14-.475c-1.645-.88-2.553-1.787-3.433-3.433c-.283-.53-.424-.794-.475-1.14a2.16 2.16 0 0 1 .1-.98c.12-.329.344-.597.791-1.134c.45-.54.675-.809.793-1.114c.114-.292.158-.607.128-.919c-.03-.326-.173-.646-.459-1.288Z%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-width=%221.5%22 d=%22m9.159 5.712l-.403-.906c-.263-.592-.395-.888-.592-1.115a2 2 0 0 0-.928-.603C6.949 3 6.625 3 5.976 3c-.948 0-1.422 0-1.82.182a2.12 2.12 0 0 0-1.061 1.169c-.143.413-.102.838-.02 1.689q1.31 13.575 14.886 14.885c.85.082 1.275.123 1.689-.02a2.12 2.12 0 0 0 1.168-1.06c.182-.399.182-.873.182-1.821c0-.649 0-.973-.088-1.26a2 2 0 0 0-.603-.928c-.226-.197-.523-.328-1.115-.592l-.906-.402c-.642-.285-.962-.428-1.288-.459a2 2 0 0 0-.919.128c-.305.119-.574.343-1.114.793c-.537.447-.805.67-1.133.79a2.16 2.16 0 0 1-.981.101c-.346-.05-.61-.192-1.14-.475c-1.645-.88-2.553-1.787-3.433-3.433c-.283-.53-.424-.794-.475-1.14a2.16 2.16 0 0 1 .1-.98c.12-.329.344-.597.791-1.134c.45-.54.675-.809.793-1.114c.114-.292.158-.607.128-.919c-.03-.326-.173-.646-.459-1.288Z%22/%3E%3C/svg%3E"); }
.hicon-cancel-01 { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22M18 6L6 18m12 0L6 6%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22M18 6L6 18m12 0L6 6%22/%3E%3C/svg%3E"); }
.hicon-checkmark-circle-02 { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-width=%221.5%22%3E%3Cpath d=%22M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12s4.477 10 10 10s10-4.477 10-10Z%22/%3E%3Cpath stroke-linecap=%22round%22 stroke-linejoin=%22round%22 d=%22m8 12.5l2.5 2.5L16 9%22/%3E%3C/g%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-width=%221.5%22%3E%3Cpath d=%22M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12s4.477 10 10 10s10-4.477 10-10Z%22/%3E%3Cpath stroke-linecap=%22round%22 stroke-linejoin=%22round%22 d=%22m8 12.5l2.5 2.5L16 9%22/%3E%3C/g%3E%3C/svg%3E"); }
.hicon-circle { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%2210%22 fill=%22none%22 stroke=%22currentColor%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%2210%22 fill=%22none%22 stroke=%22currentColor%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22/%3E%3C/svg%3E"); }
.hicon-comment-02 { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-width=%221.5%22 d=%22M6.099 19q-1.949-.192-2.927-1.172C2 16.657 2 14.771 2 11v-.5c0-3.771 0-5.657 1.172-6.828S6.229 2.5 10 2.5h4c3.771 0 5.657 0 6.828 1.172S22 6.729 22 10.5v.5c0 3.771 0 5.657-1.172 6.828S17.771 19 14 19c-.56.012-1.007.055-1.445.155c-1.199.276-2.309.89-3.405 1.424c-1.563.762-2.344 1.143-2.834.786c-.938-.698-.021-2.863.184-3.865%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-width=%221.5%22 d=%22M6.099 19q-1.949-.192-2.927-1.172C2 16.657 2 14.771 2 11v-.5c0-3.771 0-5.657 1.172-6.828S6.229 2.5 10 2.5h4c3.771 0 5.657 0 6.828 1.172S22 6.729 22 10.5v.5c0 3.771 0 5.657-1.172 6.828S17.771 19 14 19c-.56.012-1.007.055-1.445.155c-1.199.276-2.309.89-3.405 1.424c-1.563.762-2.344 1.143-2.834.786c-.938-.698-.021-2.863.184-3.865%22/%3E%3C/svg%3E"); }
.hicon-facebook-01 { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22M2.5 12c0-4.478 0-6.718 1.391-8.109S7.521 2.5 12 2.5c4.478 0 6.718 0 8.109 1.391S21.5 7.521 21.5 12c0 4.478 0 6.718-1.391 8.109S16.479 21.5 12 21.5c-4.478 0-6.718 0-8.109-1.391S2.5 16.479 2.5 12Z%22/%3E%3Cpath stroke-linecap=%22round%22 d=%22M16.927 8.026h-2.945a1.9 1.9 0 0 0-1.9 1.886l-.086 11.515m-1.914-7.425h4.803%22/%3E%3C/g%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22M2.5 12c0-4.478 0-6.718 1.391-8.109S7.521 2.5 12 2.5c4.478 0 6.718 0 8.109 1.391S21.5 7.521 21.5 12c0 4.478 0 6.718-1.391 8.109S16.479 21.5 12 21.5c-4.478 0-6.718 0-8.109-1.391S2.5 16.479 2.5 12Z%22/%3E%3Cpath stroke-linecap=%22round%22 d=%22M16.927 8.026h-2.945a1.9 1.9 0 0 0-1.9 1.886l-.086 11.515m-1.914-7.425h4.803%22/%3E%3C/g%3E%3C/svg%3E"); }
.hicon-flower { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22M14.5 12.5a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Z%22/%3E%3Cpath d=%22M12 3c2.21 0 3.998 1.917 3.998 4.127Q16.48 7 17 7a4 4 0 0 1 1.712 7.616A4 4 0 1 1 12 18.938a4 4 0 1 1-6.712-4.322a4 4 0 0 1 2.714-7.49C8.002 4.918 9.79 3 12 3Z%22/%3E%3C/g%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22M14.5 12.5a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Z%22/%3E%3Cpath d=%22M12 3c2.21 0 3.998 1.917 3.998 4.127Q16.48 7 17 7a4 4 0 0 1 1.712 7.616A4 4 0 1 1 12 18.938a4 4 0 1 1-6.712-4.322a4 4 0 0 1 2.714-7.49C8.002 4.918 9.79 3 12 3Z%22/%3E%3C/g%3E%3C/svg%3E"); }
.hicon-help-circle { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%2210%22/%3E%3Cpath d=%22M9.5 9.5a2.5 2.5 0 1 1 3.912 2.064C12.728 12.032 12 12.672 12 13.5m.125 3.25H12m.25 0a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0%22/%3E%3C/g%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%2210%22/%3E%3Cpath d=%22M9.5 9.5a2.5 2.5 0 1 1 3.912 2.064C12.728 12.032 12 12.672 12 13.5m.125 3.25H12m.25 0a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0%22/%3E%3C/g%3E%3C/svg%3E"); }
.hicon-instagram { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22M3 12c0-4.243 0-6.364 1.318-7.682S7.758 3 12 3s6.364 0 7.682 1.318S21 7.758 21 12s0 6.364-1.318 7.682S16.242 21 12 21s-6.364 0-7.682-1.318S3 16.242 3 12%22/%3E%3Cpath d=%22M16 12a4 4 0 1 1-8 0a4 4 0 0 1 8 0m1.375-5.25h-.125m.25 0a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0%22/%3E%3C/g%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22M3 12c0-4.243 0-6.364 1.318-7.682S7.758 3 12 3s6.364 0 7.682 1.318S21 7.758 21 12s0 6.364-1.318 7.682S16.242 21 12 21s-6.364 0-7.682-1.318S3 16.242 3 12%22/%3E%3Cpath d=%22M16 12a4 4 0 1 1-8 0a4 4 0 0 1 8 0m1.375-5.25h-.125m.25 0a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0%22/%3E%3C/g%3E%3C/svg%3E"); }
.hicon-location-01 { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-width=%221.5%22%3E%3Cpath d=%22M13.618 21.367A2.37 2.37 0 0 1 12 22a2.37 2.37 0 0 1-1.617-.633C6.412 17.626 1.09 13.447 3.685 7.38C5.09 4.1 8.458 2 12.001 2s6.912 2.1 8.315 5.38c2.592 6.06-2.717 10.259-6.698 13.987Z%22/%3E%3Cpath d=%22M15.5 11a3.5 3.5 0 1 1-7 0a3.5 3.5 0 0 1 7 0Z%22/%3E%3C/g%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-width=%221.5%22%3E%3Cpath d=%22M13.618 21.367A2.37 2.37 0 0 1 12 22a2.37 2.37 0 0 1-1.617-.633C6.412 17.626 1.09 13.447 3.685 7.38C5.09 4.1 8.458 2 12.001 2s6.912 2.1 8.315 5.38c2.592 6.06-2.717 10.259-6.698 13.987Z%22/%3E%3Cpath d=%22M15.5 11a3.5 3.5 0 1 1-7 0a3.5 3.5 0 0 1 7 0Z%22/%3E%3C/g%3E%3C/svg%3E"); }
.hicon-mail-01 { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22m2 6l6.913 3.917c2.549 1.444 3.625 1.444 6.174 0L22 6%22/%3E%3Cpath d=%22M2.016 13.476c.065 3.065.098 4.598 1.229 5.733c1.131 1.136 2.705 1.175 5.854 1.254c1.94.05 3.862.05 5.802 0c3.149-.079 4.723-.118 5.854-1.254c1.131-1.135 1.164-2.668 1.23-5.733c.02-.986.02-1.966 0-2.952c-.066-3.065-.099-4.598-1.23-5.733c-1.131-1.136-2.705-1.175-5.854-1.254a115 115 0 0 0-5.802 0c-3.149.079-4.723.118-5.854 1.254c-1.131 1.135-1.164 2.668-1.23 5.733a69 69 0 0 0 0 2.952Z%22/%3E%3C/g%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22m2 6l6.913 3.917c2.549 1.444 3.625 1.444 6.174 0L22 6%22/%3E%3Cpath d=%22M2.016 13.476c.065 3.065.098 4.598 1.229 5.733c1.131 1.136 2.705 1.175 5.854 1.254c1.94.05 3.862.05 5.802 0c3.149-.079 4.723-.118 5.854-1.254c1.131-1.135 1.164-2.668 1.23-5.733c.02-.986.02-1.966 0-2.952c-.066-3.065-.099-4.598-1.23-5.733c-1.131-1.136-2.705-1.175-5.854-1.254a115 115 0 0 0-5.802 0c-3.149.079-4.723.118-5.854 1.254c-1.131 1.135-1.164 2.668-1.23 5.733a69 69 0 0 0 0 2.952Z%22/%3E%3C/g%3E%3C/svg%3E"); }
.hicon-moon-02 { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22M21.5 14.078A8.557 8.557 0 0 1 9.922 2.5C5.668 3.497 2.5 7.315 2.5 11.873a9.627 9.627 0 0 0 9.627 9.627c4.558 0 8.376-3.168 9.373-7.422%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22M21.5 14.078A8.557 8.557 0 0 1 9.922 2.5C5.668 3.497 2.5 7.315 2.5 11.873a9.627 9.627 0 0 0 9.627 9.627c4.558 0 8.376-3.168 9.373-7.422%22/%3E%3C/svg%3E"); }
.hicon-mortarboard-01 { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22M1.998 8c0 1.341 8.096 5 9.988 5s9.987-3.659 9.987-5c0-1.343-8.096-5.001-9.987-5.001s-9.988 3.658-9.988 5%22/%3E%3Cpath d=%22m5.992 11l1.251 5.8c.086.398.284.769.614 1.005c2.222 1.595 6.034 1.595 8.256 0c.33-.236.527-.607.613-1.005l1.251-5.8m2.5-1.5v7m0 0c-.79 1.447-1.14 2.222-1.496 3.501c-.077.455-.016.684.298.888c.127.083.28.112.431.112h1.519a.8.8 0 0 0 .457-.125c.291-.201.366-.422.287-.875c-.311-1.187-.708-2-1.496-3.5%22/%3E%3C/g%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22M1.998 8c0 1.341 8.096 5 9.988 5s9.987-3.659 9.987-5c0-1.343-8.096-5.001-9.987-5.001s-9.988 3.658-9.988 5%22/%3E%3Cpath d=%22m5.992 11l1.251 5.8c.086.398.284.769.614 1.005c2.222 1.595 6.034 1.595 8.256 0c.33-.236.527-.607.613-1.005l1.251-5.8m2.5-1.5v7m0 0c-.79 1.447-1.14 2.222-1.496 3.501c-.077.455-.016.684.298.888c.127.083.28.112.431.112h1.519a.8.8 0 0 0 .457-.125c.291-.201.366-.422.287-.875c-.311-1.187-.708-2-1.496-3.5%22/%3E%3C/g%3E%3C/svg%3E"); }
.hicon-new-twitter { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22m3 21l7.548-7.548M21 3l-7.548 7.548m0 0L8 3H3l7.548 10.452m2.904-2.904L21 21h-5l-5.452-7.548%22/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22 d=%22m3 21l7.548-7.548M21 3l-7.548 7.548m0 0L8 3H3l7.548 10.452m2.904-2.904L21 21h-5l-5.452-7.548%22/%3E%3C/svg%3E"); }
.hicon-pinterest { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-width=%221.5%22%3E%3Cpath stroke-linecap=%22round%22 stroke-linejoin=%22round%22 d=%22M12 11L8 21m1.974-4.428A5 5 0 1 0 7.67 14.5%22/%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%2210%22/%3E%3C/g%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-width=%221.5%22%3E%3Cpath stroke-linecap=%22round%22 stroke-linejoin=%22round%22 d=%22M12 11L8 21m1.974-4.428A5 5 0 1 0 7.67 14.5%22/%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%2210%22/%3E%3C/g%3E%3C/svg%3E"); }
.hicon-taxi-02 { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22M22 16.922V19.5c0 .466 0 .699-.076.883a1 1 0 0 1-.541.54c-.184.077-.417.077-.883.077s-.699 0-.883-.076a1 1 0 0 1-.54-.541C19 20.199 19 19.966 19 19.5s0-.699-.076-.883a1 1 0 0 0-.541-.54C18.199 18 17.966 18 17.5 18h-11c-.466 0-.699 0-.883.076a1 1 0 0 0-.54.541C5 18.801 5 19.034 5 19.5s0 .699-.076.883a1 1 0 0 1-.541.54C4.199 21 3.966 21 3.5 21s-.699 0-.883-.076a1 1 0 0 1-.54-.541C2 20.199 2 19.966 2 19.5v-2.578c0-1.202 0-1.803.172-2.37s.505-1.067 1.172-2.067L4 11.5l.962-2.308c.745-1.79 1.118-2.684 1.874-3.188S8.56 5.5 10.5 5.5h3c1.939 0 2.908 0 3.664.504s1.129 1.399 1.874 3.188L20 11.5l.656.985c.667 1 1 1.5 1.172 2.067S22 15.72 22 16.922%22/%3E%3Cpath d=%22m2 10l2 1.5l2 .5h12l2-.5l2-1.5m-7-4.5V5c0-.943 0-1.414-.293-1.707S13.943 3 13 3h-2c-.943 0-1.414 0-1.707.293S9 4.057 9 5v.5M6.125 15H6m.25 0a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0m11.875 0H18m.25 0a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0%22/%3E%3C/g%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22M22 16.922V19.5c0 .466 0 .699-.076.883a1 1 0 0 1-.541.54c-.184.077-.417.077-.883.077s-.699 0-.883-.076a1 1 0 0 1-.54-.541C19 20.199 19 19.966 19 19.5s0-.699-.076-.883a1 1 0 0 0-.541-.54C18.199 18 17.966 18 17.5 18h-11c-.466 0-.699 0-.883.076a1 1 0 0 0-.54.541C5 18.801 5 19.034 5 19.5s0 .699-.076.883a1 1 0 0 1-.541.54C4.199 21 3.966 21 3.5 21s-.699 0-.883-.076a1 1 0 0 1-.54-.541C2 20.199 2 19.966 2 19.5v-2.578c0-1.202 0-1.803.172-2.37s.505-1.067 1.172-2.067L4 11.5l.962-2.308c.745-1.79 1.118-2.684 1.874-3.188S8.56 5.5 10.5 5.5h3c1.939 0 2.908 0 3.664.504s1.129 1.399 1.874 3.188L20 11.5l.656.985c.667 1 1 1.5 1.172 2.067S22 15.72 22 16.922%22/%3E%3Cpath d=%22m2 10l2 1.5l2 .5h12l2-.5l2-1.5m-7-4.5V5c0-.943 0-1.414-.293-1.707S13.943 3 13 3h-2c-.943 0-1.414 0-1.707.293S9 4.057 9 5v.5M6.125 15H6m.25 0a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0m11.875 0H18m.25 0a.25.25 0 1 1-.5 0a.25.25 0 0 1 .5 0%22/%3E%3C/g%3E%3C/svg%3E"); }
.hicon-user { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22M17 8.5a5 5 0 1 0-10 0a5 5 0 0 0 10 0%22/%3E%3Cpath d=%22M19 20.5a7 7 0 1 0-14 0%22/%3E%3C/g%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-width=%221.5%22%3E%3Cpath d=%22M17 8.5a5 5 0 1 0-10 0a5 5 0 0 0 10 0%22/%3E%3Cpath d=%22M19 20.5a7 7 0 1 0-14 0%22/%3E%3C/g%3E%3C/svg%3E"); }
.hicon-youtube { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-width=%221.5%22%3E%3Cpath d=%22M12 20.5c1.81 0 3.545-.179 5.153-.507c2.01-.41 3.014-.614 3.93-1.792c.917-1.179.917-2.532.917-5.238v-1.926c0-2.706 0-4.06-.917-5.238c-.916-1.178-1.92-1.383-3.93-1.792A26 26 0 0 0 12 3.5c-1.81 0-3.545.179-5.153.507c-2.01.41-3.014.614-3.93 1.792C2 6.978 2 8.331 2 11.037v1.926c0 2.706 0 4.06.917 5.238c.916 1.178 1.92 1.383 3.93 1.792c1.608.328 3.343.507 5.153.507Z%22/%3E%3Cpath stroke-linejoin=%22round%22 d=%22M15.962 12.313c-.148.606-.938 1.04-2.517 1.911c-1.718.947-2.577 1.42-3.272 1.237a1.7 1.7 0 0 1-.635-.317C9 14.709 9 13.806 9 12s0-2.709.538-3.144c.182-.147.4-.256.635-.317c.695-.183 1.554.29 3.272 1.237c1.58.87 2.369 1.305 2.517 1.911c.05.206.05.42 0 .626Z%22/%3E%3C/g%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22none%22 stroke=%22currentColor%22 stroke-width=%221.5%22%3E%3Cpath d=%22M12 20.5c1.81 0 3.545-.179 5.153-.507c2.01-.41 3.014-.614 3.93-1.792c.917-1.179.917-2.532.917-5.238v-1.926c0-2.706 0-4.06-.917-5.238c-.916-1.178-1.92-1.383-3.93-1.792A26 26 0 0 0 12 3.5c-1.81 0-3.545.179-5.153.507c-2.01.41-3.014.614-3.93 1.792C2 6.978 2 8.331 2 11.037v1.926c0 2.706 0 4.06.917 5.238c.916 1.178 1.92 1.383 3.93 1.792c1.608.328 3.343.507 5.153.507Z%22/%3E%3Cpath stroke-linejoin=%22round%22 d=%22M15.962 12.313c-.148.606-.938 1.04-2.517 1.911c-1.718.947-2.577 1.42-3.272 1.237a1.7 1.7 0 0 1-.635-.317C9 14.709 9 13.806 9 12s0-2.709.538-3.144c.182-.147.4-.256.635-.317c.695-.183 1.554.29 3.272 1.237c1.58.87 2.369 1.305 2.517 1.911c.05.206.05.42 0 .626Z%22/%3E%3C/g%3E%3C/svg%3E"); }

/* Hugeicons sizing in their contexts */
.header-nav .nav > li > a .hicon { font-size: 11px; margin-left: 5px; }
.top-bar .hicon { font-size: 15px; margin-right: 4px; }
.perk-card .icon .hicon, .main-card .icon .hicon { font-size: 32px; }
button.scroltop .hicon { font-size: 18px; }
.dez-social-icon li a { align-items: center; display: inline-flex; justify-content: center; }
.dez-social-icon .hicon { font-size: 15px; }
.widget_getintuch .hicon { color: var(--course-gold); font-size: 20px; left: 0; position: absolute; top: 7px; }
/* Footer sits on the earth background — icons must be white there */
.site-footer .widget_getintuch .hicon,
.site-footer .hicon { color: #fff !important; }
.acod-title .hicon { font-size: 17px; margin-right: 8px; }
.section-full table .hicon { font-size: 18px; }
.hicon-checkmark-circle-02 { color: var(--course-earth); }
.hicon-cancel-01 { color: var(--course-gold); }

/* ============================================================
   15. === merged from skin/skin-1.css ===
   The old template skin file has been deleted; only the rules
   whose selectors still exist in the markup AND are not already
   overridden elsewhere in this file survive here. They read the
   re-mapped palette tokens defined in :root at the top, so they
   render in the earth/gold palette.
   ============================================================ */

/* Legacy token still consumed by templete.css (skin-1 was its
   only source; do not remove while templete.css uses it) */
:root {
    --secondary: #2d3239;
}

/* Base link color — without this, style.css falls back to
   var(--color-accent) (gold) for plain anchors */
a {
    color: var(--color-primary);
}

/* Primary background utility (style.css ships .bg-primary with an
   empty value, so this is the only rule that paints it) */
.bg-primary {
    background-color: var(--color-primary) !important;
}

/* Primary backgrounds for components still present in the markup
   (blog post dates, blog pagination, Spanish-page testimonials) */
.date-style-2 .post-date,
.testimonial-2 .quote-left:before,
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus,
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
    background-color: var(--color-primary);
}

/* Primary text color for components style.css would otherwise
   color with var(--color-accent) */
.primary li:before,
.acod-head a,
.acod-head a:after,
.acod-head a:hover,
.acod-head a.collapsed:hover,
.testimonial-2 .testimonial-position,
h1 a:hover, h2 a:hover, h3 a:hover,
h4 a:hover, h5 a:hover, h6 a:hover {
    color: var(--color-primary);
}

.text-primary {
    color: var(--color-primary) !important;
}

/* ============================================================
   10. Yoga Alliance Section Redesign (Premium Grid Layout)
   ============================================================ */
.sya-certification-section {
    background-image: url(../images/background/background-2.jpg) !important;
    background-position: bottom !important;
    background-size: 100% !important;
    background-repeat: no-repeat !important;
    padding: 70px 0 60px !important;
}

/* Intro Lead Paragraph */
.sya-section-intro-lead {
    font-size: 17px;
    line-height: 1.8;
    color: var(--color-muted);
    max-width: 850px;
    margin: 0 auto 35px;
    text-align: center;
    font-family: 'Poppins', sans-serif;
}

/* Fancy Subtitle style */
.sya-section-subtitle {
    font-family: var(--font-heading);
    color: var(--course-ink);
    font-size: 23px;
    margin-top: 10px;
    margin-bottom: 24px;
    font-weight: 400;
    letter-spacing: 0.02em;
    position: relative;
    padding-bottom: 10px;
    display: inline-block;
}
.sya-section-subtitle::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 40px;
    height: 2px;
    background: var(--course-gold);
    transition: width 0.3s ease;
}
.sya-row-learn:hover .sya-section-subtitle::after,
.sya-row-why:hover .sya-section-subtitle::after {
    width: 65px;
}

/* Learning Grid */
.sya-learn-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}
.sya-learn-card {
    background: #ffffff;
    border: 1px solid rgba(123, 109, 97, 0.1);
    border-radius: 12px;
    padding: 22px 24px;
    box-shadow: 0 4px 15px rgba(63, 56, 50, 0.02);
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    position: relative;
    overflow: hidden;
}
.sya-learn-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: var(--course-gold);
    opacity: 0.7;
    transition: all 0.3s ease;
}
.sya-learn-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(63, 56, 50, 0.07);
    border-color: rgba(199, 156, 102, 0.25);
}
.sya-learn-card:hover::before {
    opacity: 1;
    background: var(--course-earth);
    width: 6px;
}
.sya-learn-card-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}
.sya-learn-card-num {
    font-size: 13px;
    font-weight: 700;
    color: var(--course-gold);
    background: rgba(199, 156, 102, 0.1);
    padding: 3px 9px;
    border-radius: 20px;
    font-family: var(--font-heading);
}
.sya-learn-card-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--course-ink);
    margin: 0;
    font-family: 'Poppins', sans-serif;
}
.sya-learn-card-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--color-muted);
    margin: 0;
}

/* Credentials Badge Card */
.sya-badge-card {
    background: #ffffff;
    border: 1px solid rgba(123, 109, 97, 0.1);
    border-radius: 16px;
    padding: 24px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 4px 20px rgba(63, 56, 50, 0.03);
    transition: all 0.3s ease;
}
.sya-badge-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(63, 56, 50, 0.08);
    border-color: rgba(199, 156, 102, 0.25);
}
.sya-badge-header {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--course-earth);
    font-weight: 600;
    margin-bottom: 15px;
}
.sya-shield-icon {
    font-size: 15px;
    color: var(--course-gold);
}
.sya-badge-image-container {
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 15px;
}
.sya-badge-image-container img {
    max-height: 220px;
    width: auto;
    object-fit: contain;
}
.sya-badge-footer {
    font-size: 12px;
    color: var(--color-muted);
    font-weight: 500;
    text-align: center;
    letter-spacing: 0.02em;
}

/* Perks Heading */
.sya-perks-title {
    font-family: var(--font-heading);
    color: var(--course-ink);
    font-size: 24px;
    margin-bottom: 28px;
    font-weight: 400;
    letter-spacing: 0.02em;
    text-align: center;
    position: relative;
    padding-bottom: 12px;
}
.sya-perks-title::after {
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    width: 50px;
    height: 2px;
    background: var(--course-gold);
}

/* Perks Grid */
.sya-perks-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
    width: 100%;
}
.sya-perk-card {
    background: #ffffff;
    border: 1px solid rgba(123, 109, 97, 0.08);
    border-radius: 12px;
    padding: 26px 16px 22px;
    text-align: center;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    box-shadow: 0 4px 15px rgba(63, 56, 50, 0.02);
}
.sya-perk-card:hover {
    transform: translateY(-5px);
    border-color: rgba(199, 156, 102, 0.3);
    box-shadow: 0 12px 25px rgba(63, 56, 50, 0.08);
}
.sya-perk-icon {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background: rgba(199, 156, 102, 0.08);
    color: var(--course-gold);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
    transition: all 0.3s ease;
}
.sya-perk-card:hover .sya-perk-icon {
    background: var(--course-gold);
    color: #ffffff;
    transform: scale(1.08);
}
.sya-perk-icon i {
    font-size: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.sya-perk-name {
    color: var(--course-ink);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    margin: 0;
    font-family: 'Poppins', sans-serif;
}

/* Why Choose Checklist */
.sya-section-intro {
    font-size: 15.5px;
    line-height: 1.7;
    color: var(--color-muted);
    margin-bottom: 24px;
}
.sya-why-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 24px;
}
.sya-why-card {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 12px 18px;
    background: rgba(255, 255, 255, 0.6);
    border: 1px solid rgba(123, 109, 97, 0.08);
    border-radius: 10px;
    transition: all 0.25s ease;
}
.sya-why-card:hover {
    background: #ffffff;
    transform: translateX(4px);
    border-color: rgba(199, 156, 102, 0.3);
    box-shadow: 0 4px 12px rgba(63, 56, 50, 0.04);
}
.sya-why-card-check {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background: rgba(199, 156, 102, 0.15);
    color: var(--course-gold);
    border-radius: 50%;
    font-size: 11px;
    flex-shrink: 0;
    margin-top: 2px;
}
.sya-why-card-content {
    font-size: 14.5px;
    line-height: 1.6;
    color: var(--color-muted);
}
.sya-why-card-content strong {
    color: var(--course-ink);
    font-weight: 600;
}

/* Trust Guarantee Banner */
.sya-trust-banner {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px 22px;
    background: rgba(199, 156, 102, 0.07);
    border-left: 4px solid var(--course-gold);
    border-radius: 8px;
    margin-top: 28px;
    border-top: 1px solid rgba(199, 156, 102, 0.1);
    border-right: 1px solid rgba(199, 156, 102, 0.1);
    border-bottom: 1px solid rgba(199, 156, 102, 0.1);
}
.sya-trust-icon {
    color: var(--course-gold);
    font-size: 24px;
    flex-shrink: 0;
}
.sya-trust-text {
    font-size: 14px;
    line-height: 1.65;
    color: var(--course-ink);
    margin: 0;
}
.sya-trust-text a {
    color: var(--course-earth);
    font-weight: 600;
    text-decoration: underline;
}

/* Responsive Video Card */
.sya-video-card {
    background: #ffffff;
    border: 1px solid rgba(123, 109, 97, 0.1);
    border-radius: 16px;
    padding: 16px;
    box-shadow: 0 4px 20px rgba(63, 56, 50, 0.03);
    transition: all 0.3s ease;
}
.sya-video-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(63, 56, 50, 0.08);
    border-color: rgba(199, 156, 102, 0.25);
}
.sya-video-header {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--course-earth);
    font-weight: 600;
    margin-bottom: 12px;
    padding-left: 4px;
}
.sya-play-icon {
    font-size: 15px;
    color: var(--course-gold);
}
.sya-video-wrapper {
    position: relative;
    padding-bottom: 127%;
    height: 0;
    width: 100%;
    border-radius: 10px;
    overflow: hidden;
}
.sya-video-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Responsive grid media queries */
@media (max-width: 991px) {
    .sya-perks-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 768px) {
    .sya-learn-grid {
        grid-template-columns: 1fr;
    }
    .sya-perks-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .sya-badge-card {
        margin-top: 20px;
        height: auto;
    }
    .sya-video-card {
        margin-top: 30px;
    }
}
@media (max-width: 575px) {
    .sya-perks-grid {
        grid-template-columns: 1fr;
    }
}

/* ============================================================
   11. Early Bird Discount Banner
   ============================================================ */
.sya-discount-banner-section {
    padding: 40px 0 !important;
    background: var(--course-ink) !important;
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(199, 156, 102, 0.15);
    border-bottom: 1px solid rgba(199, 156, 102, 0.15);
}
.sya-discount-banner-section::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -10%;
    width: 50%;
    height: 200%;
    background: radial-gradient(circle, rgba(199, 156, 102, 0.12) 0%, rgba(255, 255, 255, 0) 70%);
    transform: rotate(-25deg);
    pointer-events: none;
}
.sya-discount-banner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 30px;
    width: 100%;
}
.sya-discount-content {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-grow: 1;
}
.sya-discount-badge {
    background: var(--course-gold);
    color: #ffffff;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    padding: 6px 14px;
    border-radius: 30px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    box-shadow: 0 4px 10px rgba(199, 156, 102, 0.2);
    flex-shrink: 0;
}
.sya-discount-title {
    color: #ffffff;
    font-family: var(--font-heading);
    font-size: clamp(20px, 1.3vw + 17px, 25px);
    margin: 0;
    letter-spacing: 0.02em;
    font-weight: 400;
    line-height: 1.35;
}
.sya-discount-btn {
    background: transparent;
    color: var(--course-gold) !important;
    border: 1px solid var(--course-gold);
    padding: 10px 24px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 600;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Poppins', sans-serif;
}
.sya-discount-btn:hover {
    background: var(--course-gold);
    color: #ffffff !important;
    box-shadow: 0 4px 15px rgba(199, 156, 102, 0.3);
    transform: translateY(-2px);
}

@media (max-width: 991px) {
    .sya-discount-banner {
        flex-direction: column;
        gap: 20px;
        text-align: center;
    }
    .sya-discount-content {
        flex-direction: column;
        gap: 12px;
    }
}

/* ============================================================
   12. Premium Video Play Link (fixes YouTube player errors)
   ============================================================ */
.sya-video-play-link {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    text-decoration: none !important;
}
.sya-video-poster-container {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: 8px;
    background: #000000;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(63, 56, 50, 0.05);
}
.sya-video-poster-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.45s ease, filter 0.45s ease;
}
.sya-video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(63, 56, 50, 0.4);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    transition: background-color 0.3s ease;
}
.sya-video-play-btn {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: #ffffff;
    color: var(--course-gold);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    padding-left: 4px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.25);
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.sya-video-play-label {
    color: #ffffff;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    opacity: 0.95;
    transition: all 0.3s ease;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}
.sya-video-play-link:hover .sya-video-poster-img {
    transform: scale(1.04);
    filter: brightness(0.85);
}
.sya-video-play-link:hover .sya-video-overlay {
    background-color: rgba(63, 56, 50, 0.25);
}
.sya-video-play-link:hover .sya-video-play-btn {
    background: var(--course-gold);
    color: #ffffff;
    transform: scale(1.08);
    box-shadow: 0 8px 25px rgba(199, 156, 102, 0.45);
}
.sya-video-play-link:hover .sya-video-play-label {
    opacity: 1;
    transform: translateY(1px);
}

/* Reset wrapper constraints when nested in aspect-ratio wrappers */
.sya-video-wrapper .sya-video-play-link {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.sya-video-wrapper .sya-video-poster-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
}

/* ============================================================
   13. Premium Footer Styling
   ============================================================ */
.sya-footer {
    background-color: var(--course-ink) !important;
    color: rgba(255, 255, 255, 0.75) !important;
    font-family: 'Poppins', sans-serif;
    font-size: 14px;
    line-height: 1.65;
    position: relative;
    border-top: 3px solid var(--course-gold);
}

.sya-footer-top {
    padding: 70px 0 40px !important;
    background-color: var(--course-ink) !important;
}

.sya-footer-widget {
    margin-bottom: 30px;
}

.sya-footer-widget-title {
    color: #ffffff !important;
    font-family: var(--font-heading);
    font-size: 20px;
    margin-bottom: 24px;
    position: relative;
    padding-bottom: 10px;
    font-weight: 400;
    letter-spacing: 0.03em;
}

.sya-footer-widget-title::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 35px;
    height: 1px;
    background-color: var(--course-gold);
}

.sya-footer-logo {
    margin-bottom: 20px;
    max-width: 220px;
}

.sya-footer-logo img {
    max-height: 60px;
    width: auto;
    display: block;
    filter: brightness(0) invert(1);
}

.sya-footer-about-text {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 20px;
    text-align: left;
}

.sya-footer-social {
    display: flex;
    gap: 6px;
    margin-top: 15px;
}

.sya-footer-social a {
    width: 30px !important;
    height: 30px !important;
    border-radius: 6px !important;
    background-color: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    color: rgba(255, 255, 255, 0.8) !important;
    display: grid !important;
    place-items: center !important;
    transition: background 0.22s, border-color 0.22s, color 0.22s, transform 0.22s !important;
    text-decoration: none !important;
}

.sya-footer-social a:hover {
    background-color: var(--nh-gold) !important;
    border-color: var(--nh-gold) !important;
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(199, 156, 102, 0.3) !important;
}

.sya-footer-social svg {
    width: 13px !important;
    height: 13px !important;
    fill: currentColor !important;
    display: block !important;
}

.sya-footer-links {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.sya-footer-links li {
    margin-bottom: 12px;
    padding-left: 0 !important;
    border: 0 !important;
    list-style: none !important;
}

.sya-footer-links li a {
    color: rgba(255, 255, 255, 0.7) !important;
    text-decoration: none !important;
    transition: all 0.25s ease;
    display: inline-block;
}

.sya-footer-links li a:hover {
    color: var(--course-gold) !important;
    transform: translateX(4px);
}

.sya-footer-contact-info {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.sya-footer-contact-info li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 16px;
    color: rgba(255, 255, 255, 0.7) !important;
    list-style: none !important;
}

.sya-footer-contact-info li i {
    color: var(--course-gold) !important;
    font-size: 16px;
    margin-top: 4px;
    flex-shrink: 0;
}

.sya-footer-contact-info li a {
    color: rgba(255, 255, 255, 0.7) !important;
    text-decoration: none !important;
    transition: color 0.25s ease;
}

.sya-footer-contact-info li a:hover {
    color: var(--course-gold) !important;
}

.sya-footer-bottom {
    background-color: rgba(0, 0, 0, 0.2) !important;
    padding: 24px 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.sya-footer-bottom-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}

.sya-footer-copy p {
    color: rgba(255, 255, 255, 0.5) !important;
    margin: 0;
    font-size: 13px;
}

.sya-footer-legal {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.sya-footer-legal a {
    color: rgba(255, 255, 255, 0.5) !important;
    font-size: 13px;
    text-decoration: none !important;
    transition: color 0.25s ease;
}

.sya-footer-legal a:hover {
    color: var(--course-gold) !important;
}

.sya-footer-divider {
    color: rgba(255, 255, 255, 0.15);
    font-size: 12px;
}

@media (max-width: 768px) {
    .sya-footer-top {
        padding: 50px 0 20px !important;
    }
    .sya-footer-bottom-inner {
        flex-direction: column;
        text-align: center;
    }
    .sya-footer-legal {
        justify-content: center;
    }
    .sya-footer-logo {
        margin-left: auto !important;
        margin-right: auto !important;
        max-width: 220px !important;
    }
    .sya-footer-logo img {
        margin: 0 auto !important;
    }
    .sya-footer-about-text {
        text-align: center;
    }
    .sya-footer-social {
        justify-content: center;
    }
    .sya-footer-contact-info li {
        justify-content: flex-start !important;
        text-align: left !important;
    }
}

/* ════════════ SECTION 2.1: YOGA CAPITAL OF THE WORLD ════════════ */
.sya-capital-section {
    position: relative;
    padding: 80px 0;
    background-image: url(../images/background/background-2.jpg);
    background-position: bottom center;
    background-size: 100% auto;
    background-repeat: no-repeat;
    overflow: hidden;
}

.sya-capital-header {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.sya-capital-header h2 {
    font-family: 'Marcellus', Georgia, serif;
    font-size: 36px;
    color: var(--course-ink);
    margin-bottom: 15px;
    font-weight: 500;
}

.sya-capital-lead {
    font-size: 16px;
    line-height: 1.8;
    color: var(--nh-muted);
    margin-top: 20px;
}

.sya-capital-grid {
    align-items: center;
}

.sya-capital-image-card {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(63, 56, 50, 0.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border: 1px solid rgba(123, 109, 97, 0.1);
}

.sya-capital-image-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(63, 56, 50, 0.15);
}

.sya-capital-image-card img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.5s ease;
}

.sya-capital-image-card:hover img {
    transform: scale(1.02);
}

.sya-capital-image-overlay {
    position: absolute;
    top: 15px;
    left: 15px;
    z-index: 2;
}

.sya-capital-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background-color: var(--nh-white);
    color: var(--course-ink);
    padding: 6px 14px;
    border-radius: 30px;
    font-size: 12px;
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(63, 56, 50, 0.12);
    font-family: 'Poppins', sans-serif;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.sya-capital-badge i {
    color: var(--nh-gold);
}

.sya-capital-content {
    padding-left: 20px;
}

@media (max-width: 991px) {
    .sya-capital-content {
        padding-left: 0;
    }
}

.sya-capital-subtitle {
    font-family: 'Marcellus', Georgia, serif;
    font-size: 22px;
    color: var(--course-ink);
    margin-bottom: 18px;
    font-weight: 500;
    line-height: 1.4;
}

.sya-capital-content p {
    font-size: 15px;
    line-height: 1.8;
    color: var(--nh-muted);
    margin-bottom: 16px;
}

.sya-capital-list-title {
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: var(--course-ink);
    margin-bottom: 25px;
    letter-spacing: 0.2px;
}

.sya-capital-list-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

@media (max-width: 991px) {
    .sya-capital-list-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 575px) {
    .sya-capital-list-grid {
        grid-template-columns: 1fr;
    }
}

.sya-capital-list-item {
    background: var(--nh-white);
    padding: 24px;
    border-radius: 10px;
    border: 1px solid rgba(123, 109, 97, 0.1);
    box-shadow: 0 4px 15px rgba(63, 56, 50, 0.03);
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.sya-capital-list-item:hover {
    transform: translateY(-4px);
    border-color: var(--nh-gold);
    box-shadow: 0 10px 25px rgba(199, 156, 102, 0.12);
}

.sya-capital-list-num {
    font-family: 'Marcellus', Georgia, serif;
    font-size: 24px;
    font-weight: 500;
    color: var(--nh-gold);
    line-height: 1;
    display: block;
}

.sya-capital-list-text {
    font-size: 14px;
    line-height: 1.6;
    color: var(--course-ink);
    font-weight: 500;
    margin: 0 !important;
}

.sya-capital-why-best {
    border-top: 1px solid rgba(123, 109, 97, 0.12);
    padding-top: 40px;
    margin-top: 20px;
}

.sya-capital-intro-text, .sya-capital-outro-text {
    font-size: 15px;
    line-height: 1.8;
    color: var(--nh-muted);
    margin-bottom: 25px;
}

/* ============================================================
   Section 5 — Why Should I Join Sri Yoga Ashram
   ============================================================ */
.sya-why-section {
    background: var(--course-cream) !important;
    padding: 72px 0 60px;
}

/* Centered header */
.sya-why-header {
    text-align: center;
    max-width: 680px;
    margin: 0 auto 48px;
}

.sya-why-eyebrow {
    color: var(--course-gold);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin-bottom: 10px !important;
}

.sya-why-subtitle {
    color: var(--color-muted);
    font-size: 17px;
    line-height: 1.7;
    margin-bottom: 0 !important;
}

/* Force centered text in headers to prevent global .section-full overrides */
.sya-why-header p,
.sya-prep-header p {
    text-align: center !important;
}

/* 4-column feature cards */
.sya-why-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 56px;
}

.sya-why-grid-card {
    background: #fff;
    border: 1px solid var(--course-line);
    border-bottom: 3px solid var(--course-gold);
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(63,56,50,0.07);
    padding: 28px 22px 24px;
    text-align: center;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    display: block;
}

.sya-why-grid-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 36px rgba(63,56,50,0.13);
}

.sya-why-grid-card-icon {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: rgba(199,156,102,0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
    font-size: 22px;
    color: var(--course-gold);
}

.sya-why-grid-card h5 {
    font-size: 16px;
    font-family: var(--font-heading);
    color: var(--course-ink);
    margin-bottom: 8px;
    text-align: center !important;
}

.sya-why-grid-card p {
    font-size: 14px;
    line-height: 1.65;
    color: var(--color-muted);
    margin: 0 !important;
    text-align: center !important;
}

/* Text + Video two-column */
.sya-why-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
    margin-bottom: 56px;
    padding-bottom: 56px;
    border-bottom: 1px solid var(--course-line);
}

.sya-why-text-block p {
    color: var(--color-muted);
    font-size: 16px;
    line-height: 1.8;
}

.sya-why-video-block {
    position: relative;
}

.sya-why-video-caption {
    text-align: center;
    margin-top: 12px !important;
    font-size: 13px !important;
    color: var(--color-muted) !important;
}

/* Photo + closing text bottom row */
.sya-why-bottom-row {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 48px;
    align-items: start;
}

.sya-why-photo-wrap {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 12px 32px rgba(63,56,50,0.14);
}

.sya-why-photo {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 12px;
}

.sya-why-photo-badge {
    position: absolute;
    bottom: 16px;
    left: 16px;
    background: var(--course-gold);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    padding: 5px 14px;
    border-radius: 20px;
    letter-spacing: 0.05em;
    display: flex;
    align-items: center;
    gap: 6px;
}

.sya-why-closing p {
    color: var(--color-muted);
    font-size: 16px;
    line-height: 1.8;
}

.sya-why-cta {
    margin-top: 8px;
    padding: 14px 32px !important;
    font-size: 15px;
}

/* Responsive: Why Join */
@media (max-width: 1023px) {
    .sya-why-cards {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .sya-why-section {
        padding: 48px 0 40px;
    }
    .sya-why-cards {
        grid-template-columns: 1fr 1fr;
        gap: 14px;
    }
    .sya-why-two-col,
    .sya-why-bottom-row {
        grid-template-columns: 1fr;
        gap: 28px;
    }
    .sya-why-two-col {
        margin-bottom: 32px;
        padding-bottom: 32px;
    }
}

@media (max-width: 480px) {
    .sya-why-cards {
        grid-template-columns: 1fr;
    }
}

/* ============================================================
   Section 6 — Prepare & Pack (Two-column card layout)
   ============================================================ */
.sya-prep-section {
    background: var(--course-cream) !important;
    padding: 72px 0 72px;
    border-top: 1px solid var(--course-line);
}

.sya-prep-header {
    text-align: center;
    margin-bottom: 48px;
}

.sya-prep-header h2 {
    margin-bottom: 0;
}

/* Two equal columns */
.sya-prep-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 36px;
    align-items: stretch;
}

/* Each column card */
.sya-prep-column {
    background: #fff;
    border: 1px solid var(--course-line);
    border-radius: 16px;
    box-shadow: 0 8px 28px rgba(63,56,50,0.07);
    overflow: hidden;
}

/* Column header bar */
.sya-prep-col-head {
    background: var(--course-earth);
    padding: 24px 28px;
    display: flex;
    align-items: center;
    gap: 16px;
}

.sya-prep-col-icon {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(255,255,255,0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: var(--course-gold);
    flex-shrink: 0;
}

.sya-prep-col-head h3 {
    color: #fff !important;
    font-size: 18px;
    line-height: 1.35;
    margin: 0;
}

.sya-prep-col-head h3 .text-primary {
    color: var(--course-gold) !important;
}

/* Items list */
.sya-prep-items {
    padding: 8px 0;
}

.sya-prep-item {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 18px 24px;
    border-bottom: 1px solid var(--course-line);
    transition: background 0.2s ease;
}

.sya-prep-item:last-child {
    border-bottom: none;
}

.sya-prep-item:hover {
    background: var(--course-cream);
}

.sya-prep-item-num {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(199,156,102,0.12);
    color: var(--course-earth);
    font-size: 13px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-family: var(--font-heading);
}

.sya-prep-item-body {
    font-size: 15px;
    line-height: 1.7;
    color: var(--color-muted);
    flex: 1;
}

.sya-prep-item-body strong {
    color: var(--course-ink);
    display: block;
    margin-bottom: 2px;
}

.sya-prep-item-body a {
    color: var(--course-earth);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.sya-prep-item-body a:hover {
    color: var(--course-gold);
}

/* Highlight item (open heart) */
.sya-prep-item--highlight {
    background: linear-gradient(135deg, rgba(199,156,102,0.08), rgba(123,109,97,0.06));
}

.sya-prep-item--highlight .sya-prep-item-num {
    background: rgba(199,156,102,0.2);
    color: var(--course-gold);
    font-size: 14px;
}

.sya-prep-item--highlight .sya-prep-item-body strong {
    color: var(--course-earth);
}

/* Book list */
.sya-prep-book-list {
    list-style: none;
    padding: 10px 0 0;
    margin: 0;
}

.sya-prep-book-list li {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 0;
    font-size: 14px;
    color: var(--color-muted);
}

.sya-prep-book-list li .fa-book {
    color: var(--course-gold);
    font-size: 12px;
    flex-shrink: 0;
}

/* Season tags list */
.sya-prep-season-list {
    list-style: none;
    padding: 10px 0 0;
    margin: 0;
}

.sya-prep-season-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 0;
    font-size: 14px;
    color: var(--color-muted);
    border-bottom: 1px dashed var(--course-line);
}

.sya-prep-season-list li:last-child {
    border-bottom: none;
}

.sya-season-tag {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 10px;
    border-radius: 20px;
    letter-spacing: 0.04em;
    flex-shrink: 0;
    min-width: 64px;
    text-align: center;
}

.sya-season-tag.summer  { background: #fff3d4; color: #b45309; }
.sya-season-tag.monsoon { background: #dbeafe; color: #1d4ed8; }
.sya-season-tag.autumn  { background: #fce7d0; color: #9a3412; }
.sya-season-tag.winter  { background: #e0f2fe; color: #0369a1; }

/* Responsive: Prepare & Pack */
@media (max-width: 899px) {
    .sya-prep-two-col {
        grid-template-columns: 1fr;
    }
    .sya-prep-section {
        padding: 48px 0 48px;
    }
}

/* ============================================================
   Section 7 — Premium Yoga Teachers Section UI Redesign
   ============================================================ */

/* 1. Ensure Owl Carousel stage items have equal height and flex fill */
.our-schedule .blog-carousel.owl-carousel .owl-stage {
    display: flex !important;
}

.our-schedule .blog-carousel.owl-carousel .owl-item {
    display: flex !important;
    float: none !important;
}

.our-schedule .blog-carousel.owl-carousel .item {
    display: flex !important;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

/* 2. Premium card layout */
.sya-teacher-card {
    background: var(--course-card); /* White background #ffffff */
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(63, 56, 50, 0.04);
    border: 1px solid rgba(123, 109, 97, 0.12);
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), 
                box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1),
                border-color 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
    margin: 15px 10px 25px; /* Add margin spacing inside slider */
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Float and rich shadow transition on hover */
.sya-teacher-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(63, 56, 50, 0.12), 
                0 10px 20px rgba(199, 156, 102, 0.06); /* Blended dark & warm golden shadows */
    border-color: rgba(199, 156, 102, 0.4); /* Elegant gold border on hover */
}

/* 3. Image wrapper & zoom effect */
.sya-teacher-img-wrap {
    width: 100%;
    aspect-ratio: 1 / 1.1; /* Perfectly balanced portrait aspect ratio */
    overflow: hidden;
    position: relative;
    background-color: var(--course-cream);
}

.sya-teacher-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top; /* Ensure teacher faces are never cut off */
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
    display: block;
}

.sya-teacher-card:hover .sya-teacher-img-wrap img {
    transform: scale(1.05); /* Premium zoom effect */
}

/* Subtle warm overlay on hover */
.sya-teacher-img-wrap::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, rgba(199, 156, 102, 0) 50%, rgba(123, 109, 97, 0.15) 100%);
    opacity: 0;
    transition: opacity 0.4s ease;
    pointer-events: none;
}

.sya-teacher-card:hover .sya-teacher-img-wrap::after {
    opacity: 1;
}

/* 4. Elegant text info box below photo */
.sya-teacher-info {
    padding: 24px 20px 28px;
    text-align: center;
    background: var(--course-card);
    position: relative;
    z-index: 2;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-top: 1px solid rgba(123, 109, 97, 0.06);
}

/* Teacher Name */
.sya-teacher-name {
    font-family: var(--font-heading);
    color: var(--course-ink) !important;
    font-size: 21px !important;
    font-weight: 400 !important;
    margin: 0 0 6px 0 !important;
    letter-spacing: 0.02em;
    line-height: 1.3;
}

/* Teacher Role */
.sya-teacher-role {
    font-family: 'Poppins', sans-serif;
    color: var(--course-gold) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    display: inline-block;
}

/* Elegant expandable line below role on hover */
.sya-teacher-role::after {
    content: '';
    display: block;
    width: 20px;
    height: 2px;
    background-color: var(--course-gold);
    margin: 12px auto 0;
    transition: width 0.3s ease;
}

.sya-teacher-card:hover .sya-teacher-role::after {
    width: 48px; /* Expands line on hover */
}

/* ============================================================
   Section 8 — FAQ Section UI & Alignment Refinements
   ============================================================ */

/* Force same height on FAQ header descriptions on desktop to align accordions */
@media (min-width: 768px) {
    .sya-faq-desc {
        min-height: 68px; /* Standardize vertical space for 3 lines of text */
        margin-bottom: 24px !important;
    }
}

/* Align and size accordion header boxes to prevent uneven question boxes */
.dez-accordion .acod-head a {
    display: flex !important;
    align-items: center;
    min-height: 68px; /* Standardize vertical space for up to 2 lines of text */
    padding-top: 6px !important;
    padding-bottom: 6px !important;
    position: relative;
}

/* Vertically center the absolute-positioned expand/collapse pseudo-elements */
.dez-accordion .acod-head a:after {
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin-top: 0 !important;
}

/* ============================================================
   Section 6 — How to Reach Section UI Redesign
   ============================================================ */

.sya-reach-section {
    background: var(--course-cream) !important;
}

.sya-reach-intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--course-ink);
    margin-bottom: 24px;
}

/* Structured options grid */
.sya-reach-options {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 28px;
}

.sya-reach-option {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.sya-reach-num {
    background: var(--course-earth);
    color: #ffffff;
    font-family: var(--font-heading);
    font-size: 16px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 2px;
}

.sya-reach-detail h5 {
    font-family: var(--font-heading);
    font-size: 17px;
    margin-bottom: 4px;
    color: var(--course-ink);
}

.sya-reach-detail p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.6;
    color: var(--color-muted);
}

/* Callout taxi box */
.sya-reach-taxi-box {
    background: var(--course-card); /* White #ffffff */
    border: 1px solid rgba(199, 156, 102, 0.25); /* Subtle gold border */
    border-left: 4px solid var(--course-gold); /* Gold left accent bar */
    border-radius: 12px;
    padding: 20px 24px;
    display: flex;
    gap: 16px;
    margin-bottom: 30px;
    box-shadow: 0 4px 15px rgba(63, 56, 50, 0.03);
}

.sya-taxi-icon-wrap {
    color: var(--course-gold);
    font-size: 24px;
    flex-shrink: 0;
    margin-top: 2px;
}

.sya-taxi-details h4 {
    font-family: var(--font-heading);
    font-size: 18px !important;
    font-weight: 400 !important;
    margin-bottom: 6px;
    color: var(--course-ink);
    letter-spacing: 0.02em;
}

.sya-taxi-details p {
    font-size: 14px;
    line-height: 1.5;
    color: var(--color-muted);
    margin-bottom: 12px;
}

/* Route & Price Badges */
.sya-taxi-rates {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.sya-rate-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13.5px;
}

.sya-rate-route {
    color: var(--color-muted);
}

.sya-rate-price {
    font-family: var(--font-heading);
    color: var(--course-gold);
    font-weight: 600;
    font-size: 15px;
}

.sya-rate-divider {
    width: 1px;
    height: 14px;
    background-color: var(--course-line);
}

@media (max-width: 576px) {
    .sya-taxi-rates {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    .sya-rate-divider {
        display: none;
    }
    .sya-reach-taxi-box {
        flex-direction: column;
        gap: 12px;
    }
}

/* Premium Contact button */
.sya-contact-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--course-earth);
    color: #ffffff !important;
    padding: 12px 28px;
    border-radius: 30px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.03em;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(123, 109, 97, 0.2);
    border: none;
    cursor: pointer;
    text-decoration: none !important;
}

.sya-contact-btn:hover {
    background: var(--course-ink);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(63, 56, 50, 0.25);
    color: #ffffff !important;
}

.sya-contact-btn i {
    font-size: 14px;
}

/* Image styling */
.sya-reach-img-container {
    width: 100%;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(63, 56, 50, 0.08);
    border: 1px solid rgba(123, 109, 97, 0.1);
    background-color: var(--course-card);
}

.sya-reach-img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.sya-reach-img-container:hover .sya-reach-img {
    transform: scale(1.03);
}

/* ============================================================
   Client Logo / Badges Section UI Redesign
   ============================================================ */

.sya-badges-section {
    background: var(--course-cream) !important;
    border-top: 1px solid rgba(123, 109, 97, 0.1);
    border-bottom: 1px solid rgba(123, 109, 97, 0.1);
}

.sya-badges-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 32px;
    flex-wrap: wrap;
    padding: 10px 0;
}

/* Scoped to .sya-badges-wrapper so it doesn't clash with the
   "Official Credentials" .sya-badge-card on the homepage intro section */
.sya-badges-wrapper .sya-badge-card {
    background: var(--course-card); /* White */
    border: 1px solid rgba(123, 109, 97, 0.12);
    border-radius: 12px;
    padding: 16px;
    width: 160px;
    height: 160px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 15px rgba(63, 56, 50, 0.03);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1),
                border-color 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.sya-badges-wrapper .sya-badge-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(63, 56, 50, 0.08);
    border-color: rgba(199, 156, 102, 0.3);
}

.sya-badges-wrapper .sya-badge-card img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    transition: transform 0.3s ease;
    filter: grayscale(10%) contrast(95%);
}

.sya-badges-wrapper .sya-badge-card:hover img {
    transform: scale(1.04);
    filter: grayscale(0%) contrast(100%);
}

@media (max-width: 768px) {
    .sya-badges-wrapper {
        gap: 20px;
    }
    .sya-badges-wrapper .sya-badge-card {
        width: 130px;
        height: 130px;
        padding: 12px;
    }
}

@media (max-width: 480px) {
    .sya-badges-wrapper {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        justify-items: center;
        gap: 16px;
    }
    .sya-badges-wrapper .sya-badge-card {
        width: 100%;
        max-width: 140px;
        height: 120px;
    }
}

/* ============================================================
   Teachers Profile Page Redesign (our-teachers.html)
   ============================================================ */

.sya-teachers-section {
    background-color: var(--course-cream);
    padding: 60px 0 90px 0;
}

.sya-teachers-container {
    display: flex;
    flex-direction: column;
    gap: 48px;
    padding: 20px 0 40px;
}

.sya-teacher-profile-card {
    background: var(--course-card); /* White #ffffff */
    border: 1px solid rgba(123, 109, 97, 0.1);
    border-radius: 24px;
    box-shadow: 0 10px 40px rgba(63, 56, 50, 0.03);
    display: flex;
    overflow: hidden;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1),
                border-color 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.sya-teacher-profile-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 48px rgba(63, 56, 50, 0.07);
    border-color: rgba(199, 156, 102, 0.25);
}

/* Alternating Layout */
.sya-teacher-profile-card.sya-tpc-reverse {
    flex-direction: row-reverse;
}

/* Image Side */
.sya-tpc-image-side {
    width: 35%;
    flex-shrink: 0;
    position: relative;
    background-color: var(--course-cream);
    overflow: hidden;
}

.sya-tpc-img-wrap {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.sya-tpc-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
    display: block;
}

.sya-teacher-profile-card:hover .sya-tpc-img-wrap img {
    transform: scale(1.05);
}

/* Info Side */
.sya-tpc-info-side {
    width: 65%;
    padding: 48px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.sya-tpc-name {
    font-family: var(--font-heading);
    color: var(--course-ink) !important;
    font-size: 32px !important;
    font-weight: 400 !important;
    margin: 0 0 6px 0 !important;
    letter-spacing: 0.01em;
    line-height: 1.25;
    transition: color 0.3s ease;
}

.sya-teacher-profile-card:hover .sya-tpc-name {
    color: var(--color-primary-dark) !important;
}

.sya-tpc-role {
    font-family: 'Poppins', sans-serif;
    color: var(--course-gold) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    display: inline-block;
    margin-bottom: 24px;
}

/* Metadata Grid (Specialty + Experience) */
.sya-tpc-meta {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-bottom: 28px;
    padding-bottom: 24px;
    border-bottom: 1px dashed rgba(123, 109, 97, 0.15);
}

.sya-tpc-meta-item {
    display: flex;
    align-items: center;
    gap: 16px;
}

.sya-tpc-meta-item i {
    color: var(--course-gold);
    background: var(--course-cream);
    font-size: 18px;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(199, 156, 102, 0.15);
    flex-shrink: 0;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), background 0.3s ease, color 0.3s ease;
}

.sya-teacher-profile-card:hover .sya-tpc-meta-item i {
    transform: translateY(-2px);
    background: rgba(199, 156, 102, 0.1);
}

.sya-tpc-meta-item div {
    display: flex;
    flex-direction: column;
}

.sya-meta-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-muted);
    margin-bottom: 2px;
}

.sya-meta-val {
    font-size: 15px;
    font-weight: 600;
    color: var(--course-ink);
}

/* Bio Text */
.sya-tpc-bio {
    font-size: 15px;
    line-height: 1.8;
    color: var(--color-muted);
    margin: 0;
}

/* Responsive adjustments */
@media (max-width: 991px) {
    .sya-teachers-section {
        padding: 50px 0 70px 0;
    }
    .sya-teacher-profile-card,
    .sya-teacher-profile-card.sya-tpc-reverse {
        flex-direction: column !important;
    }
    .sya-tpc-image-side {
        width: 100% !important;
        height: 400px;
    }
    .sya-tpc-info-side {
        width: 100% !important;
        padding: 36px;
    }
}

@media (max-width: 576px) {
    .sya-tpc-image-side {
        height: 320px;
    }
    .sya-tpc-meta {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .sya-tpc-name {
        font-size: 26px !important;
    }
    .sya-tpc-info-side {
        padding: 24px;
    }
}

/* ============================================================
   Redesign of 5 Core Website Pages
   ============================================================ */

/* Shared Sections */
.sya-cream-section {
    background-color: var(--course-cream);
    padding: 40px 0 50px 0;
}

.sya-white-section {
    background-color: var(--course-card); /* White #ffffff */
    padding: 40px 0 50px 0;
}

/* 1. About Us Page Styles */
.sya-about-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin: 24px 0;
    padding: 0;
}

.sya-about-item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    font-size: 15.5px;
    color: var(--color-text);
}

.sya-about-item-icon {
    color: var(--course-gold);
    background: rgba(199, 156, 102, 0.1);
    font-size: 12px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 2px;
}

/* Why Only Grid (Cards) */
.sya-why-only-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    margin-top: 30px;
    width: 100%;
}

.sya-why-only-card-full {
    /* 1 / -1 spans all tracks without creating implicit columns (span 2 does on 1-col grids) */
    grid-column: 1 / -1;
}

.sya-why-only-card {
    background: var(--course-card);
    border: 1px solid rgba(123, 109, 97, 0.1);
    border-radius: 20px;
    padding: 24px;
    box-shadow: 0 8px 30px rgba(63, 56, 50, 0.02);
    display: flex;
    align-items: flex-start;
    gap: 16px;
    min-width: 0;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.sya-why-only-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 36px rgba(63, 56, 50, 0.06);
    border-color: rgba(199, 156, 102, 0.25);
}

.sya-why-only-card-icon {
    color: var(--course-gold);
    background: var(--course-cream);
    font-size: 16px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(199, 156, 102, 0.15);
    flex-shrink: 0;
}

.sya-why-only-card-content h5 {
    font-family: var(--font-heading);
    color: var(--course-ink);
    font-size: 18px;
    margin: 0 0 6px 0;
    font-weight: 400;
}

.sya-why-only-card-content p {
    font-size: 14.5px;
    line-height: 1.6;
    color: var(--color-muted);
    margin: 0;
}

/* Rules and Guidelines List */
.sya-rules-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 0;
    margin: 30px 0;
}

.sya-rules-item {
    background: var(--course-card);
    border: 1px solid rgba(123, 109, 97, 0.08);
    border-radius: 16px;
    padding: 20px 24px;
    display: flex;
    align-items: flex-start;
    gap: 18px;
    box-shadow: 0 6px 24px rgba(63, 56, 50, 0.01);
    transition: transform 0.3s ease, border-color 0.3s ease;
}

.sya-rules-item:hover {
    transform: translateX(4px);
    border-color: rgba(199, 156, 102, 0.2);
}

.sya-rules-num {
    background: var(--course-cream);
    color: var(--course-gold);
    font-family: var(--font-heading);
    font-size: 16px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    flex-shrink: 0;
    border: 1px solid rgba(199, 156, 102, 0.12);
}

.sya-rules-text {
    font-size: 15px;
    line-height: 1.6;
    color: var(--color-muted);
    margin: 0;
    text-align: justify;
}

/* 2. Accommodation Page Styles */
.sya-features-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin: 30px 0;
}

.sya-features-card {
    background: var(--course-card);
    border: 1px solid rgba(123, 109, 97, 0.1);
    border-radius: 20px;
    padding: 24px;
    text-align: center;
    box-shadow: 0 10px 30px rgba(63, 56, 50, 0.02);
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.sya-features-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 16px 36px rgba(63, 56, 50, 0.06);
    border-color: rgba(199, 156, 102, 0.25);
}

.sya-features-icon {
    color: var(--course-gold);
    background: var(--course-cream);
    font-size: 20px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    border: 1px solid rgba(199, 156, 102, 0.15);
}

.sya-features-card h5 {
    font-family: var(--font-heading);
    color: var(--course-ink);
    font-size: 17px;
    margin: 0 0 6px 0;
    font-weight: 400;
}

.sya-features-card p {
    font-size: 14px;
    line-height: 1.5;
    color: var(--color-muted);
    margin: 0;
}

/* Attractions Grid */
.sya-attractions-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin: 30px 0;
}

.sya-attractions-card {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    padding: 20px 24px;
    display: flex;
    align-items: center;
    gap: 16px;
    transition: background 0.3s ease, border-color 0.3s ease;
}

.sya-attractions-card:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: var(--course-gold);
}

.sya-attractions-num {
    background: rgba(199, 156, 102, 0.15);
    color: var(--course-gold);
    font-family: var(--font-heading);
    font-size: 15px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    flex-shrink: 0;
    border: 1px solid rgba(199, 156, 102, 0.3);
}

.sya-attractions-text {
    font-size: 15px;
    color: #ffffff;
    margin: 0;
}

/* Room Carousel Container */
.sya-carousel-wrapper {
    background: var(--course-card);
    border: 1px solid rgba(123, 109, 97, 0.1);
    border-radius: 24px;
    padding: 20px;
    box-shadow: 0 15px 40px rgba(63, 56, 50, 0.04);
    margin-top: 30px;
}

.sya-carousel-wrapper .ow-carousel-entry {
    border-radius: 16px;
    overflow: hidden;
}

/* 3. Syllabus Page Styles */
.sya-sequence-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-bottom: 40px;
}

.sya-sequence-card {
    background: var(--course-card);
    border: 1px solid rgba(123, 109, 97, 0.1);
    border-radius: 24px;
    padding: 36px;
    box-shadow: 0 10px 36px rgba(63, 56, 50, 0.03);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.sya-sequence-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 44px rgba(63, 56, 50, 0.06);
}

.sya-sequence-card h3 {
    font-family: var(--font-heading);
    color: var(--course-ink);
    font-size: 22px;
    font-weight: 400;
    margin: 0 0 20px 0;
    padding-bottom: 12px;
    border-bottom: 1px dashed rgba(123, 109, 97, 0.15);
    letter-spacing: 0.02em;
}

/* Syllabus Grid (Cards) */
.sya-syllabus-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin: 30px 0;
}

.sya-syllabus-card {
    background: var(--course-card);
    border: 1px solid rgba(123, 109, 97, 0.1);
    border-radius: 24px;
    padding: 36px;
    box-shadow: 0 10px 36px rgba(63, 56, 50, 0.03);
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.sya-syllabus-card.dark-theme {
    background: var(--course-ink);
    border-color: rgba(255, 255, 255, 0.05);
}

.sya-syllabus-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 44px rgba(63, 56, 50, 0.07);
    border-color: rgba(199, 156, 102, 0.25);
}

.sya-syllabus-card h3 {
    font-family: var(--font-heading);
    color: var(--course-ink);
    font-size: 22px;
    font-weight: 400;
    margin: 0 0 16px 0;
    padding-bottom: 12px;
    border-bottom: 1px dashed rgba(123, 109, 97, 0.15);
    letter-spacing: 0.02em;
}

.sya-syllabus-card.dark-theme h3 {
    color: #ffffff;
    border-bottom-color: rgba(255, 255, 255, 0.1);
}

.sya-syllabus-card h3 span {
    color: var(--course-gold) !important;
}

.sya-syllabus-card p {
    font-size: 14.5px;
    line-height: 1.6;
    color: var(--color-muted);
    margin-bottom: 20px;
}

.sya-syllabus-card.dark-theme p {
    color: #c5beb7;
}

/* Bullet list overrides */
.sya-syllabus-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sya-syllabus-list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 15px;
    color: var(--color-muted);
    line-height: 1.5;
}

.sya-syllabus-card.dark-theme .sya-syllabus-list li {
    color: #e5ddd3;
}

.sya-syllabus-list li::before {
    content: "\f00c"; /* FontAwesome check icon */
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color: var(--course-gold);
    font-size: 13px;
    margin-top: 3px;
    flex-shrink: 0;
}

/* Lightweight item rows for Kundalini */
.sya-syllabus-item {
    background: var(--course-card);
    border: 1px solid rgba(123, 109, 97, 0.08);
    border-radius: 16px;
    padding: 16px 20px;
    display: flex;
    align-items: center;
    gap: 14px;
    box-shadow: 0 6px 24px rgba(63, 56, 50, 0.01);
    transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
    margin-bottom: 12px;
}

.sya-syllabus-item:hover {
    transform: translateY(-2px);
    border-color: rgba(199, 156, 102, 0.2);
    box-shadow: 0 10px 28px rgba(63, 56, 50, 0.04);
}

.sya-syllabus-item-icon {
    color: var(--course-gold);
    background: var(--course-cream);
    font-size: 11px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(199, 156, 102, 0.12);
    flex-shrink: 0;
}

.sya-syllabus-item-text {
    font-size: 15px;
    font-weight: 500;
    color: var(--course-ink);
}

/* 4. Blog Listing Page Styles */
.sya-blog-section {
    background-color: var(--course-cream);
    padding: 60px 0 90px 0;
}

.sya-blog-grid {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-top: 30px;
}

.sya-blog-card {
    background: var(--course-card);
    border: 1px solid rgba(123, 109, 97, 0.1);
    border-radius: 24px;
    box-shadow: 0 10px 40px rgba(63, 56, 50, 0.03);
    display: flex;
    overflow: hidden;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1),
                border-color 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.sya-blog-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 48px rgba(63, 56, 50, 0.07);
    border-color: rgba(199, 156, 102, 0.25);
}

.sya-blog-img-side {
    width: 35%;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
    background-color: var(--course-cream);
}

.sya-blog-img-side img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
    display: block;
}

.sya-blog-card:hover .sya-blog-img-side img {
    transform: scale(1.05);
}

.sya-blog-info-side {
    width: 65%;
    padding: 40px 48px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.sya-blog-title {
    font-family: var(--font-heading);
    color: var(--course-ink) !important;
    font-size: 26px !important;
    font-weight: 400 !important;
    margin: 0 0 12px 0 !important;
    line-height: 1.3;
    transition: color 0.3s ease;
}

.sya-blog-card:hover .sya-blog-title {
    color: var(--color-primary-dark) !important;
}

.sya-blog-meta {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 18px;
}

.sya-blog-meta span {
    font-size: 13px;
    color: var(--color-muted);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.sya-blog-meta i {
    color: var(--course-gold);
    font-size: 14px;
}

.sya-blog-text p {
    font-size: 15px;
    line-height: 1.7;
    color: var(--color-muted);
    margin: 0 0 20px 0;
}

.sya-blog-readmore {
    font-family: 'Poppins', sans-serif;
    color: var(--course-gold) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: color 0.3s ease, transform 0.3s ease;
}

.sya-blog-card:hover .sya-blog-readmore {
    color: var(--course-earth-dark) !important;
    transform: translateX(4px);
}

/* Pagination Styling */
.sya-pagination {
    margin-top: 50px;
}

.sya-pagination .pagination {
    display: flex;
    justify-content: center;
    gap: 10px;
    padding: 0;
    list-style: none;
}

.sya-pagination .pagination li a {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--course-card);
    border: 1px solid rgba(123, 109, 97, 0.15);
    color: var(--course-ink);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    font-weight: 500;
    transition: all 0.3s ease;
}

.sya-pagination .pagination li.active a,
.sya-pagination .pagination li a:hover {
    background: var(--course-gold);
    border-color: var(--course-gold);
    color: #ffffff !important;
}

/* ============================================================
   Redesign Pages Responsive Queries
   ============================================================ */
@media (max-width: 991px) {
    .sya-why-only-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    /* In the single-column layout the full-width card must not span 2
       tracks, or it creates an implicit column that overflows the screen */
    .sya-why-only-card-full {
        grid-column: auto;
    }
    .sya-features-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .sya-attractions-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }
    .sya-sequence-grid,
    .sya-syllabus-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .sya-blog-card {
        flex-direction: column !important;
    }
    .sya-blog-img-side {
        width: 100% !important;
        height: 300px;
    }
    .sya-blog-info-side {
        width: 100% !important;
        padding: 30px;
    }
}

@media (max-width: 768px) {
    .sya-features-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

@media (max-width: 576px) {
    .sya-why-only-card,
    .sya-features-card,
    .sya-sequence-card,
    .sya-syllabus-card {
        padding: 24px;
    }
    .sya-blog-img-side {
        height: 240px;
    }
    .sya-blog-title {
        font-size: 22px !important;
    }
    .sya-blog-info-side {
        padding: 24px;
    }
}

/* ============================================================
   Yin Yoga page -- spacing & layout fixes
   ============================================================ */

/* Reduce heavy section padding -- p-t60/p-t70/p-b50 classes add too much vertical air. */
.page-content .section-full.p-t60 {
    padding-top: 36px;
}
.page-content .section-full.p-t70 {
    padding-top: 40px;
}
.page-content .section-full.p-b50 {
    padding-bottom: 32px;
}

/* Section 1 -- Remove excess bottom margin from the h1 wrapper. */
.page-content .section-full .m-b20 {
    margin-bottom: 12px;
}

/* Section 2 -- heading col with m-b30 pushed content down too far. */
.page-content .section-full .col-lg-12.m-b30 {
    margin-bottom: 10px;
}

/* Numbered list 2-column grid -- fills the whitespace in the learn/details sections */
.page-content .list-num-count {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px 32px;
    list-style: none;
    padding-left: 0;
    margin: 0;
}
.page-content .list-num-count > li {
    margin-left: 36px;
    margin-bottom: 8px;
}

/* Fix section-head so heading and separator don't leave a huge gap before list content */
.page-content .section-head {
    margin-bottom: 18px;
}
.page-content .dez-separator-outer {
    margin-bottom: 0;
}

/* On mobile collapse to single column */
@media (max-width: 767px) {
    .page-content .list-num-count {
        grid-template-columns: 1fr;
    }
}

/* ============================================================
   Site-wide mobile layout safeguards
   ============================================================ */
html {
    overflow-x: clip;
}

/* Prevent grid/flex children from forcing horizontal scroll */
.section-content .row > [class*="col-"] {
    min-width: 0;
}

@media (max-width: 767px) {
    /* Redesign grids: single column on phones */
    .sya-why-only-grid,
    .sya-learn-grid,
    .sya-features-grid,
    .sya-attractions-grid,
    .sya-sequence-grid,
    .sya-syllabus-grid,
    .sya-capital-list-grid {
        grid-template-columns: 1fr !important;
        gap: 16px;
    }

    .sya-why-only-card-full {
        grid-column: 1 / -1;
    }

    /* Off-screen drawer must not widen the page */
    .nh-drawer:not(.open) {
        pointer-events: none;
    }
}