/* ============================================================
   PUBLIC SITE CSS V2
   ============================================================

   Shared stylesheet for all public website pages.

   Theme colours are supplied by:
   resources/views/site/layouts/theme.blade.php

   Homepage-specific layouts remain inside their individual
   theme stylesheets.

   IMPORTANT:
   - Use the canonical CSS variables from theme.blade.php.
   - Do not create page-specific duplicates where a shared
     component can be used.
   - Keep structural/layout CSS separate from theme colours.
   
   01 GLOBAL
   02 TYPOGRAPHY 
   03 BUTTONS 
   04 FORMS & INPUTS 
   05 CARDS & PANELS
   06 SEARCH & SIDEBARS 
   07 TABLES 
   08 ALERTS & MESSAGES 
   09 PAGE HEADERS & BREADCRUMBS 
   10 SHARED PAGE COMPONENTS 
   11 ABOUT 
   12 SHOP / PRODUCTS 
   13 EVENTS 
   14 BLOG 
   15 SCHEDULE 
   16 ACCOUNT / MEMBERS
   17 PAGE CURVE
   18 RESPONSIVE 
   
   ============================================================ */


/* ============================================================
   01. GLOBAL
   ============================================================ */

/* Main public site background and text */
body {
    background: var(--siteBackground) !important;
    color: var(--theme-paragraph-color);
}

/* Keep media responsive */
img {
    max-width: 100%;
    height: auto;
}

/* Standard public-site links */
a {
    color: var(--theamColor);
    text-decoration: none;
}

a:hover,
a:focus {
    color: var(--theamHoverColor);
}

/* Shared site container protection */
.container,
.container-fluid {
    box-sizing: border-box;
}

/* Prevent long content from breaking page layouts */
p,
li,
td,
th,
a,
span {
    overflow-wrap: break-word;
}

/* ============================================================
   02. TYPOGRAPHY
   Shared public-site heading and text colours
   ============================================================ */

/* Main headings */
h1,
h2 {
    color: var(--theme-heading-color);
}

/* Supporting headings */
h3,
h4,
h5,
h6 {
    color: var(--theme-subheading-color);
}

/* Standard body copy */
p,
.text {
    color: var(--theme-paragraph-color);
}

/* Shared section title */
.site-section-title {
    color: var(--theme-heading-color);
}

/* Shared section subtitle */
.site-section-subtitle {
    color: var(--theme-subheading-color);
}

/* Shared body/content text */
.site-text {
    color: var(--theme-paragraph-color);
}

/* ============================================================
   03. BUTTONS
   Shared public-site button styling
   ============================================================ */

/* Primary buttons */
.btn-primary,
.site-btn,
.site-btn-primary {
    background: var(--btn-primary-bg) !important;
    border-color: var(--btn-primary-bg) !important;
    color: var(--button-text) !important;
}

/* Primary button hover */
.btn-primary:hover,
.btn-primary:focus,
.site-btn:hover,
.site-btn:focus,
.site-btn-primary:hover,
.site-btn-primary:focus {
    background: var(--btn-primary-hover-bg) !important;
    border-color: var(--btn-primary-hover-bg) !important;
    color: var(--button-text) !important;
}

/* Outline buttons use the same theme colours */
.btn-outline-primary {
    background: transparent !important;
    border-color: var(--btn-primary-bg) !important;
    color: var(--btn-primary-bg) !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
    background: var(--btn-primary-hover-bg) !important;
    border-color: var(--btn-primary-hover-bg) !important;
    color: var(--button-text) !important;
}

/* Shared button behaviour */
.site-btn,
.site-btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.25s ease, border-color 0.25s ease;
}


/* ============================================================
   04. FORMS & INPUTS
   Shared public-site form styling
   ============================================================ */

/* Standard form controls */
.form-control,
.input-text,
.site-form-control {
    background: var(--theme-form-control-bg) !important;
    border: 1px solid var(--theme-form-control-border) !important;
    color: var(--theme-paragraph-color) !important;
}

/* Select controls */
select.form-control,
select.site-form-control {
    background: var(--theme-form-control-bg) !important;
    border-color: var(--theme-form-control-border) !important;
    color: var(--theme-paragraph-color) !important;
}

/* Textareas */
textarea.form-control,
textarea.site-form-control {
    background: var(--theme-form-control-bg) !important;
    border-color: var(--theme-form-control-border) !important;
    color: var(--theme-paragraph-color) !important;
}

/* Input focus */
.form-control:focus,
.input-text:focus,
.site-form-control:focus {
    background: var(--theme-form-control-bg) !important;
    border-color: var(--btn-primary-bg) !important;
    color: var(--theme-paragraph-color) !important;
    box-shadow: 0 0 0 0.2rem color-mix(
        in srgb,
        var(--btn-primary-bg) 20%,
        transparent
    );
}

/* Standard search controls */
input[type="search"].site-search-input,
.form-control-search {
    background: var(--theme-search-input-bg) !important;
    border: 1px solid var(--theme-search-input-border) !important;
    color: var(--theme-paragraph-color) !important;
}

/* Shared form labels */
.site-form-label {
    color: var(--theme-heading-color);
    font-weight: 600;
}


/* ============================================================
   05. CARDS & PANELS
   Shared public-site content containers
   ============================================================ */

/* Standard content card */
.site-card {
    background: var(--theme-card-bg);
    border: 1px solid var(--theme-card-border);
    border-radius: 10px;
}

/* Standard content panel */
.site-panel {
    background: var(--theme-card-bg);
    border: 1px solid var(--theme-card-border);
    border-radius: 10px;
    padding: 20px;
}

/* Shared card body */
.site-card-body {
    padding: 20px;
}

/* Shared card heading */
.site-card-title {
    color: var(--theme-heading-color);
}

/* Shared card text */
.site-card-text {
    color: var(--theme-paragraph-color);
}

/* Featured / soft panel */
.site-soft-card {
    background: var(--theme-card-bg);
    border: 1px solid var(--theme-card-border);
    border-radius: 10px;
    overflow: hidden;
}

/* Featured / soft panel header */
.site-soft-card-header {
    background: var(--soft-card-header-grad-start);
    border-bottom: 1px solid var(--soft-card-header-border);
    padding: 15px 20px;
}

/* Featured / soft panel body */
.site-soft-card-body {
    padding: 20px;
}

/* ============================================================
   06. SEARCH & SIDEBARS
   Shared public-site search and sidebar styling
   ============================================================ */

/* Shared search input */
.site-search-input,
.sidebar__search-form input[type="search"],
.shop-sidebar .sidebar-search .search-form .form-group input[type="search"] {
    background: var(--theme-sidebar-search-input-bg) !important;
    border: 1px solid var(--theme-search-input-border) !important;
    color: var(--theme-paragraph-color) !important;
}

/* Main page search input */
.site-main-search .site-search-input {
    background: var(--theme-search-input-bg) !important;
    border-color: var(--theme-search-input-border) !important;
}

/* Search buttons */
.site-search-button,
.shop-sidebar .sidebar-search .search-form .form-group button {
    background: var(--theme-shop-search-button-bg) !important;
    color: var(--button-text) !important;
}

/* Search button hover */
.site-search-button:hover,
.site-search-button:focus,
.shop-sidebar .sidebar-search .search-form .form-group button:hover,
.shop-sidebar .sidebar-search .search-form .form-group button:focus {
    background: var(--btn-primary-hover-bg) !important;
    color: var(--button-text) !important;
}

/* Shared left sidebar */
.site-sidebar,
.sidebar-left {
    background: var(--theme-sidebar-left-bg);
}

/* Sidebar category/content box */
.site-sidebar-box,
.category-box {
    background: var(--theme-category-box-bg);
    border: 1px solid var(--theme-category-box-border);
    border-radius: 10px;
}

/* Sidebar headings */
.site-sidebar-title,
.sidebar__title {
    color: var(--theme-heading-color);
}

/* Sidebar text and links */
.site-sidebar p,
.site-sidebar li,
.site-sidebar-box p,
.site-sidebar-box li {
    color: var(--theme-paragraph-color);
}

/* ============================================================
   07. TABLES
   Shared public-site table styling
   ============================================================ */

/* Shared responsive table wrapper */
.site-table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* Shared public-site table */
.site-table {
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
}

/* Standard table cells */
.site-table th,
.site-table td {
    padding: 12px;
    border: 1px solid var(--theme-card-border);
    color: var(--theme-paragraph-color);
    vertical-align: middle;
}

/* Table headings */
.site-table th {
    color: var(--theme-heading-color);
    font-weight: 600;
}

/* Keep wide tables usable on smaller screens */
@media (max-width: 767px) {
    .site-table-responsive {
        overflow-x: auto;
    }

    .site-table {
        min-width: 600px;
    }
}

/* ============================================================
   08. ALERTS & MESSAGES
   Shared public-site information and status panels
   ============================================================ */

/* Standard information panel */
.site-info-panel,
.alert-info {
    background: var(--theme-alert-info-bg) !important;
    color: var(--theme-alert-info-text) !important;
    border: 1px solid var(--theme-alert-info-border) !important;
}

/* Ensure content inside information panels inherits the text colour */
.site-info-panel p,
.site-info-panel li,
.site-info-panel a,
.alert-info p,
.alert-info li,
.alert-info a {
    color: inherit;
}

/* Shared empty / no-results message */
.site-empty-state {
    background: var(--theme-card-bg);
    border: 1px solid var(--theme-card-border);
    color: var(--theme-paragraph-color);
    border-radius: 10px;
    padding: 20px;
    text-align: center;
}

/* Shared empty-state heading */
.site-empty-state h2,
.site-empty-state h3,
.site-empty-state h4 {
    color: var(--theme-heading-color);
}

/* ============================================================
   09. PAGE HEADERS & BREADCRUMBS
   Shared public-site page heading structure
   ============================================================ */

/* Standard page heading area */
.site-page-header {
    position: relative;
    width: 100%;
}

/* Main page title */
.site-page-title {
    color: var(--theme-heading-color);
    margin-bottom: 10px;
}

/* Optional page subtitle / introduction */
.site-page-subtitle {
    color: var(--theme-subheading-color);
    margin-bottom: 0;
}

/* Breadcrumb wrapper */
.site-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Breadcrumb text */
.site-breadcrumb li {
    color: var(--theme-paragraph-color);
}

/* Breadcrumb links */
.site-breadcrumb a {
    color: var(--theamColor);
    text-decoration: none;
}

/* Breadcrumb links on hover */
.site-breadcrumb a:hover,
.site-breadcrumb a:focus {
    color: var(--theamHoverColor);
}

/* Breadcrumb separator */
.site-breadcrumb li + li::before {
    content: "/";
    margin-right: 8px;
    color: var(--theme-subheading-color);
}

/* Shared public page image hero */
.site-page-hero {
    min-height: 260px;
    background-color: var(--siteBackground);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    z-index: 2;
}

/* ============================================================
   10. SHARED PAGE COMPONENTS
   Reusable structures for normal public-site pages
   ============================================================ */

/* Standard public page section */
.site-section {
    position: relative;
    width: 100%;
    padding: 60px 0;
}

/* Reduced spacing option */
.site-section-sm {
    padding: 35px 0;
}

/* Standard section heading area */
.site-section-header {
    margin-bottom: 30px;
}

/* Centred section heading */
.site-section-header.text-center {
    text-align: center;
}

/* Themed section background */
.site-themed-section {
    background: var(--soft-card-header-grad-start);
}

/* Shared content box */
.site-content-box {
    background: var(--theme-card-bg);
    border: 1px solid var(--theme-card-border);
    border-radius: 10px;
    padding: 25px;
}

/* Shared content heading */
.site-content-title {
    color: var(--theme-heading-color);
    margin-bottom: 15px;
}

/* Shared content text */
.site-content-text,
.site-content-text p {
    color: var(--theme-paragraph-color);
}

/* Standard responsive content image */
.site-content-image {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 10px;
}

/* Shared divider */
.site-divider {
    width: 100%;
    height: 1px;
    background: var(--theme-card-border);
    border: 0;
    margin: 25px 0;
}

/* Shared metadata row
   Useful for dates, authors, categories, locations, etc. */
.site-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 18px;
    color: var(--theme-subheading-color);
}

/* Make metadata children follow the same colour */
.site-meta span,
.site-meta li {
    color: inherit;
}

/* Shared tag / badge */
.site-tag {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border: 1px solid var(--theme-card-border);
    border-radius: 20px;
    background: var(--theme-card-bg);
    color: var(--theme-paragraph-color);
    font-size: 0.875rem;
}

/* ============================================================
   11. ABOUT
   Only About-specific layout and interactive behaviour
   ============================================================ */

.about-page-wrap {
    position: relative;
    overflow: hidden;
}

/* Story */
.about-story-left {
    padding-right: 30px;
}

.about-story-columns {
    display: flex;
    gap: 30px;
    margin-bottom: 25px;
}

.about-story-text {
    flex: 1;
    font-size: 16px;
    line-height: 1.9;
}

.about-readmore-text {
    font-size: 15px;
    line-height: 1.9;
}

.about-readmore-text.is-collapsed {
    display: -webkit-box;
    -webkit-line-clamp: 8;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* About image gallery */
.about-story-images {
    padding-left: 30px;
}

.about-main-image {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
}

.about-main-image img {
    display: block;
    width: 100%;
    height: 420px;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.about-main-image:hover img {
    transform: scale(1.02);
}

.about-main-caption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 15px 20px;
    background: rgba(0, 0, 0, 0.65);
    color: #fff;
    font-size: 15px;
    line-height: 1.5;
}

.about-thumb-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 15px;
}

.about-thumb-row img {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border: 2px solid transparent;
    border-radius: 8px;
    cursor: pointer;
    transition: transform 0.2s ease, border-color 0.2s ease;
}

.about-thumb-row img:hover {
    transform: translateY(-2px);
}

.about-thumb-row img.is-active {
    border-color: var(--theamColor);
}

@media (max-width: 768px) {
    .about-story-images {
        padding-left: 0;
    }

    .about-main-image img {
        height: 300px;
    }
}

@media (max-width: 480px) {
    .about-main-image img {
        height: 270px;
    }

    .about-thumb-row img {
        width: 72px;
        height: 72px;
    }
}

.about-btn {
    margin-top: 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 22px;
    border: 0;
    border-radius: 25px;
    background: var(--btn-primary-bg);
    color: var(--button-text) !important;
    font-size: 13px;
    cursor: pointer;
    transition: background 0.25s ease;
}

.about-btn:hover,
.about-btn:focus {
    background: var(--btn-primary-hover-bg);
    color: var(--button-text) !important;
}

@media (max-width: 768px) {
    .about-story-columns {
        flex-direction: column;
    }

    .about-story-left {
        padding-right: 0;
        margin-bottom: 30px;
    }
}

/* About values */
.about-values-head-modern {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
}

.about-values-head-modern .sub-title {
    display: inline-block;
    font-size: 12px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 18px;
}

.about-values-head-modern p {
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.about-value-card-modern {
    height: 100%;
    padding: 30px 26px;
    transition: transform 0.3s ease;
}

.about-value-card-modern:hover {
    transform: translateY(-6px);
}

.about-value-icon-modern {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
    background: var(--soft-card-header-grad-end);
    color: var(--button-text) !important;
    font-size: 22px;
}

.about-value-card-modern h4 {
    margin-bottom: 14px;
}

.about-value-card-modern p {
    margin-bottom: 0;
}

@media (max-width: 767px) {
    .about-value-card-modern {
        padding: 24px 20px;
    }
}

/* About quote */
.about-quote-box {
    position: relative;
    overflow: hidden;
    text-align: center;
    padding: 55px 35px;
}

.about-quote-mark {
    font-size: 54px;
    line-height: 1;
    color: var(--theme-subheading-color);
    margin-bottom: 10px;
    font-family: Georgia, serif;
    opacity: 0.35;
}

.about-quote-text {
    font-size: clamp(24px, 3vw, 36px);
    line-height: 1.5;
    color: var(--theme-heading-color);
    font-family: "Cormorant", serif;
    margin-bottom: 12px;
}

.about-quote-author {
    color: var(--theme-subheading-color);
    font-size: 14px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

@media (max-width: 767px) {
    .about-quote-box {
        padding: 38px 20px;
    }

    .about-quote-text {
        font-size: 26px;
    }
}

/* About journey slider */
.about-section-head-modern {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
}

.about-section-head-modern .sub-title {
    display: inline-block;
    font-size: 12px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.about-section-head-modern p {
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.timeline-slider-wrap {
    position: relative;
    padding: 0 58px;
}

.timeline-top-nav-wrap {
    position: relative;
    margin: 0 auto 34px;
    padding: 10px 0 0;
}

.timeline-top-nav-line {
    position: absolute;
    left: 0;
    right: 0;
    top: 48px;
    height: 2px;
    background: var(--theme-card-border);
    border-radius: 999px;
}

.timeline-top-nav {
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    z-index: 2;
}

.timeline-top-nav-item {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    min-width: 70px;
    padding: 0;
    background: none;
    border: 0;
    cursor: pointer;
}

.timeline-top-nav-year {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--theme-paragraph-color);
    transition: transform 0.28s ease, color 0.28s ease;
}

.timeline-top-nav-dot {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--theme-card-border);
    border: 4px solid var(--theme-card-bg);
    transition: transform 0.28s ease, background 0.28s ease;
}

.timeline-top-nav-item.is-active .timeline-top-nav-year {
    color: var(--theamColor);
    transform: translateY(-1px);
}

.timeline-top-nav-item.is-active .timeline-top-nav-dot {
    background: var(--theamColor);
    transform: scale(1.12);
}

.timeline-slider-track {
    display: flex;
    gap: 22px;
    overflow-x: auto;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    padding-bottom: 24px;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.timeline-slider-track::-webkit-scrollbar {
    display: none;
}

.timeline-slide {
    flex: 0 0 calc(33.333% - 15px);
    min-width: calc(33.333% - 15px);
    scroll-snap-align: start;
}

.timeline-slide-card {
    height: 100%;
    overflow: hidden;
    transition: transform 0.3s ease;
}

.timeline-slide-card:hover {
    transform: translateY(-4px);
}

.timeline-slide-image {
    position: relative;
    overflow: hidden;
}

.timeline-slide-image img {
    display: block;
    width: 100%;
    height: 160px;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.timeline-slide-card:hover .timeline-slide-image img {
    transform: scale(1.03);
}

.timeline-slide-body {
    padding: 24px 22px;
}

.timeline-slide-year {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 82px;
    padding: 8px 14px;
    border-radius: 999px;
    background: var(--soft-card-header-grad-end);
    color: var(--button-text);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 16px;
}

.timeline-slide-body h4 {
    margin-bottom: 10px;
}

.timeline-slide-body p {
    margin-bottom: 0;
}

.timeline-slider-arrow {
    position: absolute;
    top: calc(50% + 35px);
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border: 1px solid var(--theme-card-border);
    border-radius: 50%;
    background: var(--theme-card-bg);
    color: var(--theamColor);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.3s ease, background 0.3s ease;
    z-index: 3;
}

.timeline-slider-arrow:hover,
.timeline-slider-arrow:focus {
    background: var(--btn-primary-bg);
    color: var(--button-text);
    transform: translateY(-50%) scale(1.04);
}

.timeline-slider-arrow-prev {
    left: 0;
}

.timeline-slider-arrow-next {
    right: 0;
}

@media (max-width: 1199px) {
    .timeline-slide {
        flex: 0 0 calc(50% - 11px);
        min-width: calc(50% - 11px);
    }
}

@media (max-width: 767px) {
    .timeline-slider-wrap {
        padding: 0;
    }

    .timeline-top-nav-wrap {
        margin-bottom: 26px;
        overflow-x: auto;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .timeline-top-nav-wrap::-webkit-scrollbar {
        display: none;
    }

    .timeline-top-nav {
        width: max-content;
        min-width: 100%;
        gap: 24px;
        padding: 0 4px;
    }

    .timeline-top-nav-line {
        min-width: 100%;
    }

    .timeline-slider-arrow {
        display: none;
    }

    .timeline-slide {
        flex: 0 0 86%;
        min-width: 86%;
    }

    .timeline-slide-image img {
        height: 200px;
    }

    .timeline-slide-body {
        padding: 22px 18px;
    }
}

@media (max-width: 480px) {
    .timeline-slide {
        flex: 0 0 98%;
        min-width: 98%;
    }
}

/* About testimonials */
.about-section-head {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
}

.about-section-head .sub-title {
    display: inline-block;
    font-size: 12px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.about-section-head p {
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.testimonial-slider-wrap {
    position: relative;
}

.testimonial-slider-track {
    display: flex;
    gap: 22px;
    overflow-x: auto;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    padding-bottom: 18px;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.testimonial-slider-track::-webkit-scrollbar {
    display: none;
}

.testimonial-slide {
    flex: 0 0 calc(33.333% - 15px);
    min-width: calc(33.333% - 15px);
    scroll-snap-align: start;
}

.testimonial-card-modern {
    height: 100%;
    padding: 26px 22px;
    transition: transform 0.3s ease;
}

.testimonial-card-modern:hover {
    transform: translateY(-4px);
}

.testimonial-top {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
}

.testimonial-avatar {
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    border-radius: 50%;
    background: var(--theme-card-border);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    color: var(--theme-subheading-color);
}

.testimonial-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.testimonial-meta {
    flex: 1;
}

.testimonial-name {
    font-size: 16px;
    font-weight: 700;
    color: var(--theme-heading-color);
}

.testimonial-location {
    font-size: 13px;
    color: var(--theme-subheading-color);
}

.testimonial-rating {
    margin-bottom: 12px;
}

.testimonial-rating .fa {
    font-size: 14px;
    color: #f4c150;
    margin-right: 2px;
}

.testimonial-text {
    font-size: 18px;
    line-height: 1.6;
    color: var(--theme-paragraph-color);
    font-family: "Cormorant", serif;
}

.testimonial-video-play-small {
    position: absolute;
    right: -6px;
    bottom: -6px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--btn-primary-bg);
    color: var(--button-text) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    z-index: 5;
    transition: transform 0.2s ease, background 0.2s ease;
}

.testimonial-video-play-small:hover,
.testimonial-video-play-small:focus {
    background: var(--btn-primary-hover-bg);
    color: var(--button-text) !important;
    transform: scale(1.05);
    text-decoration: none !important;
}

.testimonial-video-play-small i {
    font-size: 11px;
}

@media (max-width: 1199px) {
    .testimonial-slide {
        flex: 0 0 calc(50% - 11px);
        min-width: calc(50% - 11px);
    }
}

@media (max-width: 767px) {
    .testimonial-slide {
        flex: 0 0 86%;
        min-width: 86%;
    }

    .testimonial-card-modern {
        padding: 22px 18px;
    }

    .testimonial-text {
        font-size: 15px;
    }
}

@media (max-width: 480px) {
    .testimonial-slide {
        flex: 0 0 90%;
        min-width: 90%;
    }
}

/* ============================================================
   12. SHOP / PRODUCTS
   ============================================================ */


/* ============================================================
   13. EVENTS
   ============================================================ */


/* ============================================================
   14. BLOG
   ============================================================ */


/* ============================================================
   15. SCHEDULE
   ============================================================ */


/* ============================================================
   15. ACCOUNT / MEMBERS
   ============================================================ */

/* =========================================================
   16. PAGE CURVE
========================================================= */

@font-face {
    font-family: 'TenorSans';
    src: url('/fonts/TenorSans-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

.page-mini-hero .hero-title {
    font-family: 'TenorSans', serif;
    letter-spacing: 1.5px;
}

.test-curved-hero {
    position: relative;
    margin-top: -90px;
    min-height: 280px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    overflow: hidden;
    border-bottom-left-radius: 50% 20%;
    border-bottom-right-radius: 50% 20%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    box-shadow: 0 10px 18px rgba(0,0,0,0.12);
}

.test-curved-hero::before {
    content: "";
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(90, 48, 102, 0.10) 0%,
            rgba(129, 71, 122, 0.06) 100%
        );
}

.test-curved-hero-content {
    position: relative;
    z-index: 2;
    max-width: 760px;
    padding: 30px 20px 45px;
    color: #ffffff;
}

.test-curved-hero-content h2,
.hero-title,
.sidebar-search h2 {
    font-family: 'TenorSans', serif;
    margin-top: 90px;
    letter-spacing: 1.5px;
    color: #ffffff;
    margin-bottom: 10px;
    text-shadow: 0 2px 12px rgba(0,0,0,0.4);
}

.test-curved-hero-content p {
    color: rgba(255,255,255,0.92);
    margin-bottom: 0;
    font-size: 15px;
    line-height: 1.6;
    text-shadow: 0 2px 10px rgba(0,0,0,0.25);
}

@media (max-width: 991.98px) {
    .test-curved-hero {
        min-height: 200px;
        border-bottom-left-radius: 50% 18%;
        border-bottom-right-radius: 50% 18%;
        margin-top: -90px
    }

    .test-curved-hero-content {
        padding: 24px 16px 34px;
        margin-top: 20px;
    }

    .test-curved-hero-content h2 {
        font-size: 30px;
    }

    .test-curved-hero-content p {
        font-size: 14px;
    }
    
    .about-btn {
        margin-bottom: 40px;
    }
}

@media (max-width: 575.98px) {
    .test-curved-hero {
        min-height: 210px !important;
        border-bottom-left-radius: 50% 18%;
        border-bottom-right-radius: 50% 18%;
        margin-top: -80px;
    }

    .test-curved-hero-content {
        padding: 20px 14px 28px;
        margin-top: 10px;
    }

    .test-curved-hero-content h2 {
        font-size: 24px;
        margin-bottom: 6px;
    }

    .test-curved-hero-content p {
        font-size: 13px;
        line-height: 1.5;
    }
}


/* ============================================================
   17. RESPONSIVE
   ============================================================ */