/*
Theme Name: Divi Child Theme
Theme URI: https://divireadythemes.com/
Description: Divi Child Theme
Author: Divi Ready Themes
Author URI: https://divireadythemes.com/
Template: Divi
Version: 2.0 - Reference design
*/

/*------------------------------------------------*/
/*-------------------[GENERAL]--------------------*/
/*------------------------------------------------*/

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&family=Caveat:wght@400;500;600;700&display=swap');
@import url('https://use.fontawesome.com/releases/v5.15.4/css/brands.css');

:root {
    --jaya-green: #b0d66e;
    --jaya-purple: #66308c;
    --jaya-text: #433d53;
    --jaya-bg-light: #f9f9f9;
    --font-script: 'Caveat', cursive;
    --font-body: 'Montserrat', sans-serif;
}

/* Smooth in-page scrolling for anchor buttons/links (e.g. hero CTA -> #opportunities-section).
   scroll-padding-top offsets the landing point so the target section isn't hidden
   behind the fixed header (.jaya-header reserves ~76px; 90px leaves a small gap). */
html {
    scroll-behavior: smooth;
    scroll-padding-top: 90px;
}

body,
body #page-container {
    font-family: var(--font-body);
    color: var(--jaya-text);
    background: #ffffff;
}

/* All script-looking headings use Caveat */
h1,
h2,
h3,
h4 {
    font-family: var(--font-body);
}

/*------------------------------------------------*/
/*-----------------[HEADER-MENU]------------------*/
/*------------------------------------------------*/

/* Theme Builder global header — logo left, menu center, "Купи билет" CTA right.
   Edit in WP admin → Divi → Theme Builder → Default Website Template → Header. */
.et-tb-has-header .jaya-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    background-color: rgba(255, 255, 255, 0.72) !important;
    -webkit-backdrop-filter: saturate(160%) blur(14px);
    backdrop-filter: saturate(160%) blur(14px);
    border-bottom: 1px solid rgba(102, 48, 140, 0.06);
    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.03);
}

/* Reserve exactly the header height so the first section sits flush under it.
   Header = section padding (10px top + 10px bottom) + logo max-height (68px) = 88px. */
.et-tb-has-header #et-boc {
    padding-top: 76px;
}

.jaya-header>.et_pb_row.jaya-header-row {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Give the middle column more room so all menu items stay on one line. */
.jaya-header-col-logo {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 160px !important;
    margin-right: 0 !important;
}

.jaya-header-col-menu {
    flex: 1 1 auto !important;
    width: auto !important;
    justify-content: center !important;
    margin-right: 0 !important;
}

.jaya-header-col-cta {
    flex: 0 0 auto !important;
    width: auto !important;
    justify-content: flex-end !important;
    margin-right: 0 !important;
}

.jaya-header-col-logo,
.jaya-header-col-menu,
.jaya-header-col-cta {
    display: flex !important;
    align-items: center !important;
    margin-bottom: 0 !important;
}

.jaya-header-logo .et_pb_image_wrap,
.jaya-header-logo img {
    display: block;
    max-height: 68px;
    width: auto;
}

/* Menu module inside the TB header — one-line, uniform item styling. */
.jaya-header-menu .et_pb_menu__wrap {
    justify-content: center !important;
    background: transparent !important;
}

.jaya-header-menu .et_pb_menu__menu>nav>ul {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
}

.jaya-header-menu .et_pb_menu__menu>nav>ul>li,
.jaya-header-menu .et_pb_menu__menu>nav>ul>li:last-child {
    white-space: nowrap !important;
    background: transparent !important;
}

.jaya-header-menu .et_pb_menu__menu>nav>ul>li>a,
.jaya-header-menu .et_pb_menu__menu>nav>ul>li:last-child>a {
    font-family: var(--font-body) !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    color: var(--jaya-text) !important;
    padding: 10px 14px !important;
    letter-spacing: 0.5px !important;
    background: transparent !important;
    border-radius: 0 !important;
    text-transform: none !important;
    opacity: 1 !important;
    transition: color 0.2s ease;
}

.jaya-header-menu .et_pb_menu__menu>nav>ul>li.current-menu-item>a,
.jaya-header-menu .et_pb_menu__menu>nav>ul>li>a:hover {
    color: var(--jaya-purple) !important;
    background: transparent !important;
    transform: none !important;
}

.jaya-header-cta.et_pb_button:hover {
    background-color: #9cc25e !important;
    transform: translateY(-1px);
}

@media (max-width: 980px) {
    .et-tb-has-header #et-boc {
        padding-top: 64px;
    }

    /* ROW: full-viewport flex container, no column wrap. */
    .et-l--header .jaya-header > .et_pb_row.jaya-header-row {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        gap: 10px;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 16px !important;
        margin: 0 !important;
    }

    /* COLUMNS: flex children with explicit roles.
       Explicit `width: auto !important` is required to beat Divi's
       `.et_block_row .et_pb_column { width: 100% !important }` rule
       at ≤479px (and the equivalent non-important rule at ≤980px).
       Without this, columns stack vertically and the logo + hamburger
       get pushed off-screen while only the CTA remains visible. */
    .et-l--header .jaya-header .jaya-header-row > .et_pb_column.jaya-header-col-logo,
    .et-l--header .jaya-header .jaya-header-row > .et_pb_column.jaya-header-col-cta,
    .et-l--header .jaya-header .jaya-header-row > .et_pb_column.jaya-header-col-menu {
        display: flex !important;
        align-items: center !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        background: transparent !important;
    }

    .et-l--header .jaya-header .jaya-header-row > .et_pb_column.jaya-header-col-logo {
        order: 1 !important;
        flex: 1 1 auto !important;
        min-width: 0 !important;
        justify-content: flex-start !important;
    }

    .et-l--header .jaya-header .jaya-header-row > .et_pb_column.jaya-header-col-cta {
        order: 2 !important;
        flex: 0 0 auto !important;
        justify-content: flex-end !important;
    }

    .et-l--header .jaya-header .jaya-header-row > .et_pb_column.jaya-header-col-menu {
        order: 3 !important;
        flex: 0 0 auto !important;
        min-width: 0 !important;
        justify-content: flex-end !important;
    }

    /* LOGO: flush left, no auto margin from Divi defaults. */
    .et-l--header .jaya-header-logo {
        margin: 0 !important;
    }
    .et-l--header .jaya-header-logo .et_pb_image_wrap,
    .et-l--header .jaya-header-logo img {
        display: block !important;
        margin: 0 !important;
        max-height: 44px;
        width: auto !important;
    }

    /* CTA "Билет": compact pill, height-matched to hamburger. */
    .et-l--header .jaya-header-cta.et_pb_button,
    .et-l--header .jaya-header-cta.et_pb_button:hover {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 6px 18px !important;
        height: 40px !important;
        font-size: 12px !important;
        line-height: 1 !important;
    }

    /* HAMBURGER WRAPPERS — flex containers, transparent backgrounds. */
    .et-l--header .jaya-header-menu .et_mobile_nav_menu {
        display: flex !important;
        align-items: center !important;
        margin: 0 !important;
        padding: 0 !important;
        float: none !important;
        background: transparent !important;
    }

    .et-l--header .jaya-header-menu .mobile_nav {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        height: 40px !important;
        padding: 0 4px !important;
        background: transparent !important;
        cursor: pointer;
    }

    /* HAMBURGER ICON — animated hamburger ↔ X morph.
       Both ETmodules glyphs (\61 hamburger, \4d X) are stacked at the
       same spot via ::before and ::after; we crossfade + rotate to
       morph between them on .mobile_nav.opened. Specificity raised to
       (0,4,1) to beat Divi's per-module color/font-size rule. */
    .et-l--header .jaya-header-menu .mobile_menu_bar {
        position: relative !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 1em !important;
        height: 1em !important;
        font-size: 62px !important;
        line-height: 1 !important;
        padding: 0 !important;
    }

    .et-l--header .jaya-header-menu .mobile_nav .mobile_menu_bar::before,
    .et-l--header .jaya-header-menu .mobile_nav .mobile_menu_bar::after {
        position: absolute !important;
        inset: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-family: ETmodules !important;
        font-size: inherit !important;
        line-height: 1 !important;
        color: transparent !important;
        background: linear-gradient(90deg, #9ec66f 0%, #6b488f 100%);
        -webkit-background-clip: text !important;
        background-clip: text !important;
        -webkit-text-fill-color: transparent !important;
        transition: opacity 0.25s ease, transform 0.25s ease;
        cursor: pointer;
    }

    .et-l--header .jaya-header-menu .mobile_nav .mobile_menu_bar::before {
        content: "\61" !important;             /* hamburger */
        opacity: 1;
        transform: rotate(0);
    }

    .et-l--header .jaya-header-menu .mobile_nav .mobile_menu_bar::after {
        content: "\4d" !important;             /* X */
        opacity: 0;
        transform: rotate(-90deg);
    }

    .et-l--header .jaya-header-menu .mobile_nav.opened .mobile_menu_bar::before {
        opacity: 0;
        transform: rotate(90deg);
    }

    .et-l--header .jaya-header-menu .mobile_nav.opened .mobile_menu_bar::after {
        opacity: 1;
        transform: rotate(0);
    }

    /* DRAWER: hidden by default, shown only when .mobile_nav.opened.
       Divi's JS toggles inline display:block/none on .et_mobile_menu when
       the user taps the hamburger; we override only when .opened so the
       toggle is honored. The selector covers both possible DOM placements
       (descendant of .mobile_nav, or sibling/cousin within the menu). */
    .et-l--header .jaya-header .jaya-header-menu .et_mobile_menu {
        display: none !important;
        position: fixed !important;
        top: 60px !important;
        left: 0 !important;
        right: 0 !important;
        width: 100vw !important;
        max-width: 100vw !important;
        height: calc(100vh - 64px) !important;
        margin: 0 !important;
        padding: 32px 28px 40px !important;
        background: #ffffff !important;
        background-color: #ffffff !important;
        border-top: 1px solid rgba(102, 48, 140, 0.08) !important;
        box-shadow: none !important;
        overflow-y: auto !important;
        z-index: 9998 !important;
        flex-direction: column !important;
        align-items: stretch !important;
        text-align: left !important;
    }

    /* Drawer visible when hamburger is opened. Both descendant and sibling
       selectors are listed so this works regardless of where Divi's JS
       inserts the .et_mobile_menu UL. */
    .et-l--header .jaya-header-menu .mobile_nav.opened .et_mobile_menu,
    .et-l--header .jaya-header-menu .mobile_nav.opened ~ .et_mobile_menu,
    .et-l--header .jaya-header-menu:has(.mobile_nav.opened) .et_mobile_menu {
        display: flex !important;
    }

    /* Belt-and-braces background override. Divi 5 ships a per-module inline
       rule `.et_pb_menu_0_tb_header.et_pb_menu .et_mobile_menu { background-color:
       RGBA(255,255,255,0)!important }` (specificity 0,3,0). It loads AFTER our
       stylesheet in the <head>, and while our (0,4,0) rule should win on
       specificity, some browsers / build pipelines appear to let the later
       !important declaration leak through. An ID-based selector (1,2,0)
       removes any ambiguity. */
    #et-boc .et_pb_menu .et_mobile_menu,
    #et-boc .et_pb_menu_0_tb_header .et_mobile_menu,
    #et-boc .jaya-header-menu .et_mobile_menu {
        background: #ffffff !important;
        background-color: #ffffff !important;
    }

    .et-l--header .jaya-header-menu .et_mobile_menu::before {
        display: none !important;
    }

    .et-l--header .jaya-header-menu .et_mobile_menu ul {
        list-style: none !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        text-align: left !important;
        background: transparent !important;
    }

    .et-l--header .jaya-header-menu .et_mobile_menu li {
        margin: 0 !important;
        padding: 0 !important;
        border-bottom: 1px solid rgba(102, 48, 140, 0.08) !important;
        background: transparent !important;
        list-style: none !important;
    }

    .et-l--header .jaya-header-menu .et_mobile_menu li:last-child {
        border-bottom: 0 !important;
    }

    .et-l--header .jaya-header-menu .et_mobile_menu li > a {
        display: flex !important;
        align-items: center !important;
        padding: 18px 4px !important;
        font-family: var(--font-body) !important;
        font-weight: 600 !important;
        font-size: 18px !important;
        letter-spacing: 0.3px !important;
        color: var(--jaya-text) !important;
        text-transform: none !important;
        text-align: left !important;
        background: transparent !important;
        opacity: 1 !important;
        transition: color 0.2s ease, padding-left 0.2s ease;
    }

    .et-l--header .jaya-header-menu .et_mobile_menu li > a:hover,
    .et-l--header .jaya-header-menu .et_mobile_menu li.current-menu-item > a {
        color: var(--jaya-purple) !important;
        padding-left: 8px !important;
        background: transparent !important;
    }

    /* Lock background scroll while the drawer is open. */
    body:has(.jaya-header-menu .mobile_nav.opened) {
        overflow: hidden;
    }
}

/* Phone breakpoint — keep logo + hamburger visible on 360-479px screens. */
@media (max-width: 479px) {
    .et-l--header .jaya-header > .et_pb_row.jaya-header-row {
        gap: 6px;
        padding: 0 12px !important;
    }

    .et-l--header .jaya-header-logo .et_pb_image_wrap,
    .et-l--header .jaya-header-logo img {
        max-height: 36px;
    }

    .et-l--header .jaya-header-cta.et_pb_button,
    .et-l--header .jaya-header-cta.et_pb_button:hover {
        padding: 6px 14px !important;
        font-size: 11px !important;
        height: 36px !important;
    }

    .et-l--header .jaya-header-menu .mobile_nav {
        height: 36px !important;
    }

    .et-l--header .jaya-header-menu .mobile_nav .mobile_menu_bar::before {
        font-size: 52px !important;
    }
}

/* Legacy Divi header (rendered when TB header is NOT active). */
#main-header {
    background-color: #ffffff !important;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.04) !important;
    min-height: 80px;
}

#main-header .container {
    max-width: 1400px;
}

#logo {
    max-height: 60px !important;
}

#top-menu li a {
    font-family: var(--font-body) !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    color: var(--jaya-text) !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    padding-bottom: 0 !important;
}

#top-menu li.current-menu-item a,
#top-menu li a:hover {
    color: var(--jaya-purple) !important;
}

/* Legacy CTA-as-last-menu-item pill — only applies to the classic #top-menu,
   NOT to our Theme Builder .jaya-header-menu (its CTA is a dedicated button module). */
#top-menu li.menu-item:last-child a {
    background-color: var(--jaya-green) !important;
    color: #ffffff !important;
    padding: 10px 24px !important;
    border-radius: 30px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    transition: all 0.3s ease;
}

#top-menu li.menu-item:last-child a:hover {
    background-color: #9cc25e !important;
    transform: translateY(-1px);
}

/*------------------------------------------------*/
/*------------------[HERO]------------------------*/
/*------------------------------------------------*/


.et_pb_section .et-pb-background-video {
	overflow: unset;
}

/* Hero section — unmasked outer container (so splatter can overflow).
   Size = viewport minus the fixed header so the hero fits exactly one screen. */
.jaya-hero-section {
    min-height: calc(100vh - 88px) !important;
    position: relative;
    display: flex;
    align-items: stretch;
    padding: 0 !important;
    overflow: visible !important;
}

/* Wavy bottom mask applied to the ROW (inner content layer) */
.jaya-hero-section>.et_pb_row,
.jaya-hero-row {
    min-height: calc(100vh - 88px) !important;
    height: calc(100vh - 88px);
    display: flex !important;
    align-items: stretch !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    position: relative;
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1920 1080' preserveAspectRatio='none'><path d='M0,0 L1920,0 L1920,1010 C1680,1055 1440,1080 1200,1065 C960,1050 720,1005 480,1015 C240,1025 120,1060 0,1045 Z' fill='black'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1920 1080' preserveAspectRatio='none'><path d='M0,0 L1920,0 L1920,1010 C1680,1055 1440,1080 1200,1065 C960,1050 720,1005 480,1015 C240,1025 120,1060 0,1045 Z' fill='black'/></svg>");
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center bottom;
    mask-position: center bottom;
}

.jaya-hero-row .et_pb_column {
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 0 !important;
    height: auto !important;
}

.home .jaya-hero-row .et_pb_column {
    height:90vh !important;
}

.home .et_pb_section_0 .jaya-hero-row {
    padding-bottom:0 !important;
}


/* Text column keeps padding so content doesn't touch the edge.
   Symmetric vertical padding so justify-content: center actually lands on the visual center. */
.jaya-hero-row .et_pb_column:first-child {
    padding: 60px 5% 60px 8%;
}

.jaya-hero-text h1 {
    font-family: var(--font-script) !important;
    font-weight: 700 !important;
    color: var(--jaya-purple) !important;
    font-size: 56px !important;
    line-height: 1.1em !important;
    margin-bottom: 0 !important;
}

/* Date + location row below the H1 */
.jaya-hero-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 22px;
    margin-top: 18px;
    font-family: var(--font-body);
    font-size: 18px;
    font-weight: 600;
    color: var(--jaya-text);
}

.jaya-hero-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.jaya-meta-icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-color: var(--jaya-green);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-position: center;
    mask-position: center;
    flex-shrink: 0;
}

.jaya-meta-calendar {
    -webkit-mask-image: url('../../assets/calendar.png');
    mask-image: url('../../assets/calendar.png');
}

.jaya-meta-location {
    -webkit-mask-image: url('../../assets/location.png');
    mask-image: url('../../assets/location.png');
}

/* Video column: flush to the right edge, no padding */
.jaya-hero-video-col {
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: stretch !important;
    align-self: stretch !important;
    height: 100% !important;
}

.jaya-hero-video-col>.et_pb_module,
.jaya-hero-video-col>.et_pb_code {
    height: 100% !important;
    width: 100%;
    margin-bottom: 0 !important;
    flex: 1 1 auto;
}

.jaya-hero-video-wrap,
.jaya-hero-video-wrap .et_pb_code_inner {
    height: 100% !important;
    width: 100%;
}

/* Match the row height exactly so there's no gap below the video before the wavy mask */
.jaya-hero-video {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: calc(100vh - 88px);
    overflow: hidden;
}

.jaya-hero-video video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Fade ONLY on the left edge where video meets text */
.jaya-hero-video::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(to right, #ffffff 0%, rgba(255, 255, 255, 0) 22%);
}

/* Hide the old splatter that was inside the masked video container */
.jaya-splatter-purple-hero {
    display: none !important;
}

/* Purple splatter overlay — sits on the section (unmasked), over the wave edge */
.jaya-hero-section::after {
    content: '';
    position: absolute;
    right: 8%;
    bottom: -50px;
    width: 280px;
    height: 180px;
    background-image: url('../../assets/v2/splatter-graphics-purple.png');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    z-index: 10;
    pointer-events: none;
}

/*------------------------------------------------*/
/*------------------[STATS CARDS]----------------*/
/*------------------------------------------------*/

.jaya-stat-card .et_pb_main_blurb_image {
    margin-bottom: 15px !important;
}

.jaya-stat-card .et_pb_main_blurb_image img {
    max-width: 80px !important;
    width: 80px !important;
    height: 80px !important;
    object-fit: contain;
    /* Override Divi's scroll-animation initial opacity so icons are always visible */
    opacity: 1 !important;
    transform: none !important;
    -webkit-animation: none !important;
    animation: none !important;
}

/* Neutralize Divi's animation-hides-until-scroll behavior on stat icons */
.jaya-stat-card .et-waypoint {
    opacity: 1 !important;
    transform: none !important;
}

.jaya-stat-card h4.et_pb_module_header,
.jaya-stat-card h4.et_pb_module_header span {
    font-family: var(--font-script) !important;
    font-weight: 700 !important;
    font-size: 52px !important;
    color: var(--jaya-purple) !important;
    line-height: 1 !important;
    margin-bottom: 8px !important;
}

.jaya-stat-card .et_pb_blurb_description {
    font-size: 15px !important;
    color: var(--jaya-text) !important;
    line-height: 1.5em;
}

/*------------------------------------------------*/
/*------------------[SECTION HEADINGS]------------*/
/*------------------------------------------------*/

/* Script section headings */
.et_pb_text h2 {
    font-family: var(--font-script) !important;
    font-weight: 700 !important;
    line-height: 1.1em !important;
}

/* Brush underline under headings */
.jaya-underline-green .et_pb_text_inner h2 {
    display: inline-block;
    padding-bottom: 15px;
    background-image: url('../../../wp-content/assets/v2/underline-green.png');
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 70% 14px;
}

.jaya-center-underline .et_pb_text_inner {
    text-align: center;
}

/*------------------------------------------------*/
/*------------------[ONE DAY SECTION]-------------*/
/*------------------------------------------------*/

.jaya-bullet-list {
    list-style: none !important;
    padding: 0 !important;
    margin-top: 20px !important;
}

.jaya-bullet-list li {
    position: relative;
    padding-left: 26px;
    margin-bottom: 10px;
    font-size: 15px;
    color: var(--jaya-text);
    line-height: 1.6em;
    background-image: url('../../assets/bullet.png');
    background-repeat: no-repeat;
    background-position: 0 6px;
    background-size: 14px auto;
}

.jaya-bullet-list li:before {
    content: none;
}

/* Blob image wrapper — keep for splatter positioning, no image masking */
.jaya-blob-wrap {
    position: relative;
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    padding: 40px;
}

/* Use section-1-img.png as-is (it already has brushstroke edges baked in) */
.jaya-blob-image {
    width: 100%;
    display: block;
    border-radius: 0 !important;
    aspect-ratio: auto !important;
    object-fit: contain;
    -webkit-mask-image: none !important;
    mask-image: none !important;
}

.jaya-splatter {
    position: absolute;
    width: 150px;
    opacity: 0.9;
    pointer-events: none;
    z-index: 3;
}

.jaya-splatter-tl {
    top: 0;
    left: 0;
    transform: rotate(180deg);
}

.jaya-splatter-br {
    bottom: 0;
    right: 0;
}

/*------------------------------------------------*/
/*------------------[LECTURERS]-------------------*/
/*------------------------------------------------*/

.jaya-lecturer-img {
    text-align: center !important;
    margin-bottom: 10px !important;
}

.jaya-lecturer-img .et_pb_image_wrap {
    display: inline-block;
    max-width: 140px;
}

/*------------------------------------------------*/
/*------------------[FOR WHOM]--------------------*/
/*------------------------------------------------*/

.jaya-forwhom-section {
    min-height: 600px;
    background-attachment: scroll !important;
}

.jaya-forwhom-wrap {
    display: flex;
    justify-content: flex-end;
    width: 100%;
}

/* Purple panel with brushstroke-edge mask */
.jaya-forwhom-panel {
    position: relative;
    background: #66308c;
    color: #ffffff;
    padding: 60px 60px 140px 50px;
    max-width: 680px;
    width: 100%;
    -webkit-mask-image: url('../../assets/brush-shapes/shape-3.svg');
    mask-image: url('../../assets/brush-shapes/shape-3.svg');
    -webkit-mask-size: cover;
    mask-size: cover;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

.jaya-forwhom-panel h2 {
    font-family: var(--font-body) !important;
    font-weight: 700 !important;
    font-size: 34px !important;
    color: #ffffff !important;
    letter-spacing: 2px !important;
    margin-bottom: 20px !important;
    line-height: 1.2em !important;
}

.jaya-forwhom-intro {
    font-family: var(--font-body);
    font-size: 15px;
    color: #ffffff;
    margin-bottom: 20px;
}

.jaya-forwhom-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 25px !important;
}

.jaya-forwhom-list li {
    position: relative;
    padding-left: 26px;
    margin-bottom: 12px;
    color: #ffffff;
    font-size: 14px;
    font-family: var(--font-body);
    line-height: 1.5em;
    background-image: url('../../assets/bullet.png');
    background-repeat: no-repeat;
    background-position: 0 6px;
    background-size: 14px auto;
}

.jaya-forwhom-list li:before {
    content: none;
}

.jaya-forwhom-outro {
    font-family: var(--font-body);
    font-size: 14px;
    color: #ffffff;
    line-height: 1.6em;
    margin: 0;
}

.jaya-forwhom-outro strong {
    color: var(--jaya-green);
    font-weight: 700;
}

/* Fallback for browsers without mask support - slight organic edges */
@supports not (mask-image: url('#')) {
    .jaya-forwhom-panel {
        border-radius: 8px 30px 12px 24px;
    }
}

/*------------------------------------------------*/
/*------------------[PROGRAM]---------------------*/
/*------------------------------------------------*/

/* Category palette — used by left accent, tag, icon, timeline dot.
   Kept as CSS vars so each category stays internally consistent. */
.jaya-program-card {
    --cat-color: #9b9aa3;
    --cat-bg: #f3f3f5;
    --cat-tint: rgba(155, 154, 163, 0.08);
}

.jaya-program-card .jaya-card-inner[data-type="practice"] {
    --cat-color: #7db342;
    --cat-bg: #f1f7e8;
    --cat-tint: rgba(125, 179, 66, 0.10);
}

.jaya-program-card .jaya-card-inner[data-type="talk"] {
    --cat-color: #66308c;
    --cat-bg: #f3ecf7;
    --cat-tint: rgba(102, 48, 140, 0.09);
}

.jaya-program-card .jaya-card-inner[data-type="workshop"] {
    --cat-color: #8e57b2;
    --cat-bg: #f6f0fa;
    --cat-tint: rgba(142, 87, 178, 0.09);
}

.jaya-program-card .jaya-card-inner[data-type="integration"] {
    --cat-color: #c99526;
    --cat-bg: #fbf3df;
    --cat-tint: rgba(201, 149, 38, 0.10);
}

.jaya-program-card .jaya-card-inner[data-type="logistics"] {
    --cat-color: #9b9aa3;
    --cat-bg: #f3f3f5;
    --cat-tint: rgba(155, 154, 163, 0.08);
}

.jaya-program-card .jaya-card-inner[data-type="meal"] {
    --cat-color: #9b9aa3;
    --cat-bg: #f3f3f5;
    --cat-tint: rgba(155, 154, 163, 0.08);
}

.jaya-program-card .jaya-card-inner[data-type="welcome"] {
    --cat-color: #9b9aa3;
    --cat-bg: #f3f3f5;
    --cat-tint: rgba(155, 154, 163, 0.08);
}

.jaya-program-card .jaya-card-inner[data-type="dance"] {
    --cat-color: #7db342;
    --cat-bg: #f1f7e8;
    --cat-tint: rgba(125, 179, 66, 0.10);
}

.jaya-program-card .et_pb_text_inner {
    position: relative;
    padding: 0 !important;
    margin-bottom: 18px;
    background: transparent;
    border: none;
    border-radius: 16px;
    overflow: visible;
}

.jaya-program-card .jaya-card-inner {
    position: relative;
    padding: 22px;
    background: #ffffff;
    background-image: linear-gradient(180deg, var(--cat-tint) 0%, rgba(255, 255, 255, 0) 60%);
    border: 1px solid #ebe5f0;
    border-radius: 14px;
    min-height: 140px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    box-shadow: 0 1px 2px rgba(67, 61, 83, 0.04);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.jaya-program-card .jaya-card-inner:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(102, 48, 140, 0.12);
    border-color: var(--cat-color);
}

/* Category icon, top-right. SVG mask keeps the icon crisp and tintable
   per category; no new asset files needed. */
.jaya-program-card .jaya-card-inner::after {
    content: '';
    position: absolute;
    top: 20px;
    right: 20px;
    width: 26px;
    height: 26px;
    background-color: var(--cat-color);
    opacity: 0.55;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.jaya-program-card .jaya-card-inner[data-type="logistics"]::after {
    /* key / entry dot */
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='9'/><circle cx='12' cy='12' r='3' fill='black'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='9'/><circle cx='12' cy='12' r='3' fill='black'/></svg>");
}

.jaya-program-card .jaya-card-inner[data-type="practice"]::after {
    /* wave / movement */
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M2 9c2 0 2 3 4 3s2-3 4-3 2 3 4 3 2-3 4-3 2 3 4 3'/><path d='M2 15c2 0 2 3 4 3s2-3 4-3 2 3 4 3 2-3 4-3 2 3 4 3'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M2 9c2 0 2 3 4 3s2-3 4-3 2 3 4 3 2-3 4-3 2 3 4 3'/><path d='M2 15c2 0 2 3 4 3s2-3 4-3 2 3 4 3 2-3 4-3 2 3 4 3'/></svg>");
}

.jaya-program-card .jaya-card-inner[data-type="talk"]::after {
    /* speech bubble */
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 11.5a8.38 8.38 0 01-.9 3.8 8.5 8.5 0 01-7.6 4.7 8.38 8.38 0 01-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 01-.9-3.8 8.5 8.5 0 014.7-7.6 8.38 8.38 0 013.8-.9h.5a8.48 8.48 0 018 8v.5z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 11.5a8.38 8.38 0 01-.9 3.8 8.5 8.5 0 01-7.6 4.7 8.38 8.38 0 01-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 01-.9-3.8 8.5 8.5 0 014.7-7.6 8.38 8.38 0 013.8-.9h.5a8.48 8.48 0 018 8v.5z'/></svg>");
}

.jaya-program-card .jaya-card-inner[data-type="workshop"]::after {
    /* sparkle / hands-on */
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 3v4M12 17v4M3 12h4M17 12h4M5.6 5.6l2.8 2.8M15.6 15.6l2.8 2.8M5.6 18.4l2.8-2.8M15.6 8.4l2.8-2.8'/><circle cx='12' cy='12' r='2.5'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 3v4M12 17v4M3 12h4M17 12h4M5.6 5.6l2.8 2.8M15.6 15.6l2.8 2.8M5.6 18.4l2.8-2.8M15.6 8.4l2.8-2.8'/><circle cx='12' cy='12' r='2.5'/></svg>");
}

.jaya-program-card .jaya-card-inner[data-type="integration"]::after {
    /* breath / inward spiral — concentric circles */
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='9'/><circle cx='12' cy='12' r='5.5'/><circle cx='12' cy='12' r='2'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='9'/><circle cx='12' cy='12' r='5.5'/><circle cx='12' cy='12' r='2'/></svg>");
}

.jaya-program-card .jaya-card-inner[data-type="meal"]::after {
    /* fork (left) + spoon (right) — same 24x24 grid and stroke weight as the other icons */
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M7 3v6'/><path d='M11 3v6'/><path d='M15 3v6'/><path d='M11 9v12'/><path d='M19 3c-2 0-3 2-3 5s1 4 3 4z'/><path d='M19 12v9'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M7 3v6'/><path d='M11 3v6'/><path d='M15 3v6'/><path d='M11 9v12'/><path d='M19 3c-2 0-3 2-3 5s1 4 3 4z'/><path d='M19 12v9'/></svg>");
}

.jaya-program-card .jaya-card-inner[data-type="welcome"]::after {
    /* Clipboard with checkmark — universal "register/check-in" icon. */
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='5' y='5' width='14' height='17' rx='2'/><path d='M9 3h6v4H9z'/><path d='M9 14l2 2 4-4'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='5' y='5' width='14' height='17' rx='2'/><path d='M9 3h6v4H9z'/><path d='M9 14l2 2 4-4'/></svg>");
}

.jaya-program-card .jaya-card-inner[data-type="dance"]::after {
    /* Music / dance — two connected notes with a beam */
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='7' cy='18' r='2.5'/><circle cx='17' cy='16' r='2.5'/><path d='M9.5 18V6l10-2v12'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='7' cy='18' r='2.5'/><circle cx='17' cy='16' r='2.5'/><path d='M9.5 18V6l10-2v12'/></svg>");
}

.jaya-program-card .jaya-tag {
    display: inline-block;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 10px;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    color: var(--cat-color);
    padding: 4px 10px;
    border-radius: 30px;
    background: var(--cat-bg);
    margin-bottom: 12px;
    line-height: 1.2;
}

.jaya-program-card .jaya-time {
    font-family: var(--font-script);
    font-weight: 700;
    color: var(--jaya-purple);
    font-size: 26px;
    line-height: 1;
    margin-bottom: 6px;
    letter-spacing: 0.5px;
}

.jaya-program-card .jaya-title {
    font-family: var(--font-body);
    font-weight: 600;
    color: var(--jaya-text);
    font-size: 14px;
    line-height: 1.45em;
    margin: 0;
    padding-right: 36px;
    /* keep title clear of the corner icon */
}

@media (max-width: 767px) {
    .jaya-program-card .jaya-card-inner {
        min-height: 0;
        padding: 18px;
    }

    .jaya-program-card .jaya-time {
        font-size: 22px;
    }
}

/*------------------------------------------------*/
/*------------------[TICKETS]---------------------*/
/*------------------------------------------------*/

/* Tickets reuse the program-card pattern: white card, soft purple tint,
   image-bullet list, lift-on-hover. */
.jaya-ticket-card .et_pb_text_inner {
    position: relative;
    padding: 32px 28px 28px;
    background: #ffffff;
    background-image: linear-gradient(180deg, rgba(102, 48, 140, 0.06) 0%, rgba(255, 255, 255, 0) 60%);
    border: 1px solid #ebe5f0;
    border-radius: 16px;
    color: var(--jaya-text);
    box-shadow: 0 1px 2px rgba(67, 61, 83, 0.04);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    overflow: visible;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.jaya-ticket-card .et_pb_text_inner:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(102, 48, 140, 0.12);
    border-color: var(--jaya-purple);
}

.jaya-ticket-card h3 {
    font-family: var(--font-body) !important;
    font-weight: 700 !important;
    color: var(--jaya-purple) !important;
    font-size: 22px !important;
    margin-bottom: 20px !important;
    text-align: left;
}

.jaya-ticket-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 24px !important;
}

.jaya-ticket-list li {
    position: relative;
    padding-left: 26px;
    margin-bottom: 10px;
    color: var(--jaya-text);
    font-size: 15px;
    font-family: var(--font-body);
    line-height: 1.5em;
    background-image: url('../../assets/bullet.png');
    background-repeat: no-repeat;
    background-position: 0 6px;
    background-size: 14px auto;
}

.jaya-ticket-list li:before {
    content: none;
}

/* Price row (last <li>) — promoted as an emphasised block with a subtle
   top divider, no bullet. */
.jaya-ticket-list li:last-child {
    font-family: var(--font-script);
    font-weight: 700;
    color: var(--jaya-purple);
    font-size: 26px;
    line-height: 1.1;
    border-top: 1px solid #ebe5f0;
    padding: 16px 0 0 0;
    margin-top: 18px;
    background-image: none;
}

.jaya-ticket-btn-wrap {
    text-align: center;
    margin-top: auto;
    padding-top: 8px;
}

/* "Active" primary CTA — filled green pill, matches the header "Купи билет". */
.jaya-ticket-btn {
    display: inline-block;
    background: var(--jaya-green);
    color: #ffffff !important;
    border: none;
    padding: 14px 32px;
    border-radius: 30px;
    text-decoration: none;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 1px;
    box-shadow: 0 6px 14px rgba(176, 214, 110, 0.35);
    transition: all 0.25s ease;
}

.jaya-ticket-btn:hover {
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(176, 214, 110, 0.45);
}

/*------------------------------------------------*/
/*------------------[CTA]-------------------------*/
/*------------------------------------------------*/

/* Shape-4 brushstroke is set as the SECTION background (not a pseudo-element) so
   Divi's dynamic-asset pipeline can't drop the relative url and the shape always
   covers whatever width the section is rendered at. */
.et_pb_section.jaya-cta-section {
    position: relative;
    overflow: hidden;
    background-color: #ffffff !important;
    background-image: url('../../assets/brush-shapes/shape-4.svg') !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 96% auto !important;
    padding: 80px 0 !important;
}

/* High-specificity row overrides — Divi 5 scopes column widths on its own classes,
   so we need to out-specify them to get the flex layout we want. */
.et_pb_section.jaya-cta-section .et_pb_row.jaya-cta-row {
    position: relative;
    z-index: 1;
    max-width: 1200px !important;
    width: 90% !important;
    padding: 30px 40px !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 30px;
}

.et_pb_section.jaya-cta-section .jaya-cta-row>.et_pb_column {
    margin-bottom: 0 !important;
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    float: none !important;
}

.et_pb_section.jaya-cta-section .jaya-cta-row>.et_pb_column:first-child {
    flex: 0 0 40% !important;
    max-width: 40% !important;
    width: 40% !important;
}

.et_pb_section.jaya-cta-section .jaya-cta-row>.et_pb_column:last-child {
    flex: 1 1 auto !important;
    max-width: 60% !important;
}

.jaya-cta-image .et_pb_image_wrap {
    display: block;
    margin: 0 !important;
}

.et_pb_section.jaya-cta-section .jaya-cta-image img {
    width: 100% !important;
    height: auto !important;
    max-width: 500px !important;
    min-height: 0 !important;
    max-height: none !important;
    object-fit: contain;
    display: block;
    margin: 0 auto;
}

.jaya-cta-col {
    padding: 20px 0 20px 10px;
}

.jaya-cta-col .et_pb_text h2 {
    font-family: var(--font-script) !important;
    font-weight: 700 !important;
    font-style: italic;
    color: var(--jaya-text) !important;
    font-size: 42px !important;
    line-height: 1.2em !important;
    margin-bottom: 0 !important;
}

.jaya-cta-col .et_pb_text p {
    font-size: 16px !important;
    color: var(--jaya-text) !important;
    max-width: 520px;
    line-height: 1.6em !important;
}

@media (max-width: 980px) {
    /* Zoom the brushstroke and anchor it to the right screen edge so only the
       right-hand portion of the stroke shows; y-offset puts it behind the text area. */
    .et_pb_section.jaya-cta-section {
        background-size: 220% auto !important;
        background-position: right 70% !important;
        padding: 50px 0 !important;
    }

    /* 95%-wide content row on mobile. */
    .et_pb_section.jaya-cta-section .et_pb_row.jaya-cta-row {
        width: 95% !important;
        max-width: 95% !important;
        padding: 30px 15px !important;
        flex-direction: column !important;
        gap: 20px;
    }

    .et_pb_section.jaya-cta-section .jaya-cta-row>.et_pb_column:first-child,
    .et_pb_section.jaya-cta-section .jaya-cta-row>.et_pb_column:last-child {
        flex: 1 1 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    .jaya-cta-col {
        padding: 0 10px;
        text-align: center;
    }

    .jaya-cta-col .et_pb_text p {
        margin-left: auto;
        margin-right: auto;
    }

    .et_pb_section.jaya-cta-section .jaya-cta-image img {
        max-width: 380px !important;
    }
}

/*------------------------------------------------*/
/*------------------[FOOTER]----------------------*/
/*------------------------------------------------*/

.jaya-footer {
    color: #ffffff;
}

.jaya-footer-col h4 {
    font-family: var(--font-body) !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    font-size: 13px !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    margin-bottom: 15px !important;
}

.jaya-footer-col a {
    color: #ffffff !important;
    text-decoration: none;
    opacity: 0.9;
    transition: opacity 0.2s ease;
}

.jaya-footer-col a:hover {
    opacity: 1;
    color: var(--jaya-green) !important;
}

.jaya-footer-contact {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.jaya-footer-contact li {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #ffffff;
    font-family: var(--font-body);
    font-size: 15px;
    line-height: 1.4;
}

.jaya-footer-contact li img {
    width: 28px;
    height: 28px;
    object-fit: contain;
    flex-shrink: 0;
}

.jaya-footer-contact li a {
    color: #ffffff;
    text-decoration: none;
    transition: color 0.2s ease;
}

.jaya-footer-contact li a:hover {
    color: var(--jaya-green);
}

.jaya-social {
    display: flex;
    gap: 12px;
    margin-top: 15px;
    font-family: 'Font Awesome 5 Brands', sans-serif;
}

.jaya-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff !important;
    font-size: 16px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.jaya-social a:hover {
    background: var(--jaya-green);
    transform: translateY(-2px);
}

/* Hide default Divi footer */
#main-footer {
    display: none !important;
}

/*------------------------------------------------*/
/*------------------[BUTTONS]---------------------*/
/*------------------------------------------------*/

.et_pb_button {
    font-family: var(--font-body) !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    border-radius: 30px !important;
    padding: 14px 32px !important;
    transition: all 0.3s ease !important;
}

.et_pb_button:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
}

.et_pb_button:after {
    display: none !important;
}

/* GRADIENT WIPE on hover — every primary button keeps its solid resting
   color and the secondary shade slides in from the right edge.

   The trick: a 200%-wide background-image whose left half is fully
   transparent and right half fades from transparent to the secondary
   color. background-position animates 0% → 100%, which slides the
   gradient image left. Because the leading edge of the overlay is
   transparent (not a slightly-different green), there is NEVER a hard
   color seam against the resting fill — the secondary color literally
   fades up from invisibility as it sweeps across.

   For purple-base / ghost buttons the image is mirrored: the wipe
   carries the green secondary in from the right over a purple base. */
.et_pb_button,
.jaya-header-cta.et_pb_button,
.jaya-ticket-btn,
.jaya-404__btn--primary,
.jaya-404__btn--ghost,
.jaya-brand-cta,
.jaya-contact-submit,
#top-menu li.menu-item:last-child a {
    background-image: linear-gradient(90deg,
        rgba(102, 48, 140, 0) 0%,
        rgba(102, 48, 140, 0) 50%,
        var(--jaya-purple) 100%);
    background-size: 200% 100%;
    background-position: 0% 0%;
    background-repeat: no-repeat;
    transition: background-position 0.55s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.25s ease,
                box-shadow 0.25s ease,
                color 0.25s ease,
                background-color 0.25s ease !important;
}

.et_pb_button:hover,
.jaya-header-cta.et_pb_button:hover,
.jaya-ticket-btn:hover,
.jaya-404__btn--primary:hover,
.jaya-404__btn--ghost:hover,
.jaya-brand-cta:hover,
.jaya-contact-submit:hover,
#top-menu li.menu-item:last-child a:hover {
    background-position: 100% 0%;
}

/* Purple-base / ghost button: green secondary wipes in from the right
   over a purple fill (the ghost's hover sets background-color: purple).

   The .jaya-btn-purple modifier is the opt-in for any other button (e.g.
   Divi modules whose Background panel is set to var(--jaya-purple)) to
   get the reversed wipe — green slides in from the right over purple. */
.jaya-404__btn--ghost,
.jaya-btn-purple,
.jaya-btn-purple.et_pb_button {
    background-image: linear-gradient(90deg,
        rgba(176, 214, 110, 0) 0%,
        rgba(176, 214, 110, 0) 50%,
        var(--jaya-green) 100%);
}

/* Hero CTA: the button carries a GREEN resting fill (#b0d66e) but was tagged
   .jaya-btn-purple, which swaps the wipe overlay to green as well — green over
   green is invisible, so its hover looked dead. Restore the default wipe for the
   hero button only: purple sweeps in from the right over the green fill (on-brand
   green -> purple). Higher specificity than the .jaya-btn-purple rule above;
   background-size / position / transition still inherit from .et_pb_button. */
.jaya-hero-section .jaya-btn-purple.et_pb_button {
    background-image: linear-gradient(90deg,
        rgba(102, 48, 140, 0) 0%,
        rgba(102, 48, 140, 0) 50%,
        var(--jaya-purple) 100%);
}

/*------------------------------------------------*/
/*--------------------[RWD]-----------------------*/
/*------------------------------------------------*/

@media (max-width: 980px) {
    .jaya-hero-text h1 {
        font-size: 44px !important;
    }

    .et_pb_text h2 {
        font-size: 40px !important;
    }

    .jaya-stat-card h4.et_pb_module_header {
        font-size: 42px !important;
    }

    .jaya-cta-col .et_pb_text h2 {
        font-size: 36px !important;
    }

    /* Stack hero: video on top at full width, text below it. */
    .jaya-hero-section {
        min-height: 0 !important;
        height: auto !important;
    }

    .jaya-hero-section>.et_pb_row,
    .jaya-hero-row {
        flex-direction: column !important;
        min-height: 0 !important;
        height: auto !important;
    }

    .jaya-hero-video-col {
        order: 1;
        width: 100% !important;
        height: auto !important;
    }

    .jaya-hero-row .et_pb_column:first-child {
        order: 2;
        padding: 30px 6% 160px!important;
        height: auto !important;
    }

    .jaya-hero-video-col>.et_pb_module,
    .jaya-hero-video-col>.et_pb_code,
    .jaya-hero-video-wrap,
    .jaya-hero-video-wrap .et_pb_code_inner {
        height: auto !important;
        min-height: 0 !important;
    }

    /* Full-width video with its natural aspect ratio preserved (no crop). */
    .jaya-hero-video {
        margin-top: 0;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: auto !important;
    }

    .jaya-hero-video video {
        width: 100%;
        height: auto;
        object-fit: initial;
    }

    /* Remove the left edge fade; fade the bottom so video blends into the text below. */
    .jaya-hero-video::after {
        background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 65%, #ffffff 100%);
    }

    /* The purple splatter is anchored to the desktop wave edge — hide on mobile. */
    .jaya-hero-section::after {
        display: none !important;
    }

    .jaya-forwhom-panel {
        padding: 50px 20px 50px 20px;
        max-width: 100%;
    }

    .jaya-forwhom-panel h2 {
        font-size: 28px !important;
    }
}

@media (max-width: 767px) {
    .jaya-hero-text h1 {
        font-size: 36px !important;
    }

    .et_pb_text h2 {
        font-size: 34px !important;
    }

    .jaya-stat-card h4.et_pb_module_header {
        font-size: 36px !important;
    }

    .jaya-lecturer-img img {
        width: 110px !important;
    }

    .jaya-cta-col .et_pb_text h2 {
        font-size: 28px !important;
    }

    .jaya-cta-col .et_pb_text {
        margin: 30px 20px 10px !important;
    }

    .jaya-cta-col .et_pb_button_module_wrapper {
        margin: 0 20px 40px !important;
    }

    .jaya-forwhom-panel {
        padding-bottom: 110px !important;
    }

}

/*------------------------------------------------*/
/*------------------[404 PAGE]--------------------*/
/*------------------------------------------------*/

.jaya-404 {
    position: relative;
    min-height: calc(100vh - 88px);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 80px 24px 80px;
    background:
        radial-gradient(ellipse at 20% 10%, rgba(176, 214, 110, 0.18) 0%, transparent 55%),
        radial-gradient(ellipse at 85% 90%, rgba(102, 48, 140, 0.14) 0%, transparent 50%),
        #ffffff;
    overflow: hidden;
}


.error404 #et-main-area {
    position: relative !important;
    z-index: 0 !important;
}

.jaya-404__inner {
    position: relative;
    max-width: 720px;
    width: 100%;
    text-align: center;
    z-index: 2;
}

.jaya-404__eyebrow {
    display: inline-block;
    font-family: var(--font-script);
    font-size: 56px;
    line-height: 1;
    color: var(--jaya-purple);
    transform: rotate(-3deg);
    margin-bottom: 8px;
}

.jaya-404__code {
    font-family: var(--font-body);
    font-weight: 800;
    font-size: clamp(120px, 22vw, 240px);
    line-height: 0.9;
    letter-spacing: -6px;
    color: var(--jaya-text);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 0 0 16px;
}

.jaya-404__zero {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1em;
    height: 1em;
}

.jaya-404__zero img {
    position: absolute;
    inset: -12% -18%;
    width: 136%;
    height: 136%;
    object-fit: contain;
    opacity: 0.85;
    pointer-events: none;
    animation: jaya404-spin 24s linear infinite;
}

.jaya-404__zero em {
    position: relative;
    font-style: normal;
    color: var(--jaya-purple);
    z-index: 1;
}

@keyframes jaya404-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.jaya-404__title {
    font-family: var(--font-script);
    font-weight: 700;
    font-size: clamp(36px, 5vw, 56px);
    line-height: 1.1;
    color: var(--jaya-purple);
    margin: 0 0 14px;
}

.jaya-404__text {
    font-family: var(--font-body);
    font-size: 17px;
    line-height: 1.7;
    color: var(--jaya-text);
    max-width: 520px;
    margin: 0 auto 36px;
}

.jaya-404__actions {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 14px;
}

.jaya-404__btn {
    display: inline-block;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 14px 30px;
    border-radius: 30px;
    text-decoration: none;
    transition: all 0.25s ease;
    border: 2px solid transparent;
}

.jaya-404__btn--primary {
    background: var(--jaya-green);
    color: #ffffff;
    box-shadow: 0 6px 18px rgba(176, 214, 110, 0.45);
}

.jaya-404__btn--primary:hover {
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(176, 214, 110, 0.55);
}

.jaya-404__btn--ghost {
    background: transparent;
    color: var(--jaya-purple);
    border-color: rgba(102, 48, 140, 0.25);
}

.jaya-404__btn--ghost:hover {
    color: #ffffff;
    background-color: var(--jaya-purple);
    border-color: var(--jaya-purple);
    transform: translateY(-2px);
}

.jaya-404__splatter {
    position: absolute;
    width: 360px;
    max-width: 45vw;
    height: auto;
    right: -40px;
    bottom: -60px;
    opacity: 0.35;
    pointer-events: none;
    z-index: 1;
    transform: rotate(12deg);
}

.jaya-404__splatter--green {
    filter: saturate(120%);
}

@media (max-width: 680px) {
    .jaya-404 {
        min-height: calc(100vh - 72px);
        padding: 50px 20px 60px;
    }

    .jaya-404__eyebrow {
        font-size: 44px;
    }

    .jaya-404__code {
        letter-spacing: -3px;
        gap: 4px;
    }

    .jaya-404__text {
        font-size: 15px;
    }

    .jaya-404__actions {
        flex-direction: column;
        width: 100%;
        gap: 10px;
    }

    .jaya-404__btn {
        width: 100%;
    }

    .jaya-404__splatter {
        width: 240px;
        right: -30px;
        bottom: -30px;
    }
}

/*------------------------------------------------*/
/*------------------[PROGRAMA PAGE]---------------*/
/*------------------------------------------------*/

/* Two-column layout: timeline on the left, sticky map on the right.
   Cards reuse the homepage .jaya-program-card shell verbatim; this block
   only adds the page-scoped structure (rail, pins, sticky col, map panel). */

/* Intro section: tight top padding; DOM order is title -> eyebrow -> subtitle. */
.jaya-program-intro-section.et_pb_section {
    padding-top: 16px !important;
}

/* Title — h1, purple, script face (matches homepage heading convention).
   Scoped tightly so the global .et_pb_text h2 rule doesn't apply. */
.jaya-program-intro-section .jaya-program-h2 {
    text-align: center;
}

.jaya-program-intro-section .jaya-program-h2 .et_pb_text_inner h1 {
    font-family: var(--font-script) !important;
    font-weight: 700 !important;
    color: var(--jaya-purple) !important;
    font-size: 96px !important;
    line-height: 1.02em !important;
    margin: 0 !important;
    padding: 0 10px 14px !important;
    display: inline-block;
    /* Brush underline — parallels the .jaya-underline-green h2 rule but scoped to h1 here. */
    background-image: url('../../../wp-content/assets/v2/underline-green.png');
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 70% 14px;
}

/* Eyebrow sits BELOW the title in DOM order. */
.jaya-program-intro-section .jaya-program-eyebrow {
    text-align: center;
}

.jaya-program-intro-section .jaya-program-eyebrow p {
    display: inline-block;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 2.4px;
    text-transform: uppercase;
    color: var(--jaya-green);
    margin: 18px 0 0;
}

.jaya-program-intro-section .jaya-program-subtitle {
    text-align: center;
    max-width: 640px;
    margin: 16px auto 0;
}

.jaya-program-intro-section .jaya-program-subtitle p {
    font-size: 16px;
    line-height: 1.7em;
    color: var(--jaya-text);
    opacity: 0.85;
}

@media (max-width: 980px) {
    .jaya-program-intro-section .jaya-program-h2 .et_pb_text_inner h1 {
        font-size: 72px !important;
    }
}

@media (max-width: 640px) {
    .jaya-program-intro-section .jaya-program-h2 .et_pb_text_inner h1 {
        font-size: 52px !important;
        background-size: 80% 10px;
    }

    .jaya-program-intro-section .jaya-program-eyebrow p {
        font-size: 11px;
        letter-spacing: 1.6px;
    }

    .jaya-program-intro-section .jaya-program-subtitle p {
        font-size: 14px;
    }
}

/* Layout math
   ============
   Row is full viewport width with a 24px horizontal safety gutter on each side.
   Columns use flex-grow ratios (35 : 65) with an explicit gap between them,
   so the gap is subtracted from the available width *before* the 35/65 split
   is computed. That's the only way Divi's scoped per-column rules and the
   row's built-in gutter don't skew the proportions.

   Desktop layout:
     row outer width   = 100vw (content area) - 48px horizontal padding
     column gap        = 40px
     column widths     = (row - 40) × 35/100  and  (row - 40) × 65/100
     sticky map        = top: 96px  (76px header + 20px breathing room) */

.jaya-program-main-section .et_pb_row.jaya-program-row {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    gap: 40px;
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 24px !important;
    margin: 0 auto !important;
}

.jaya-program-main-section .et_pb_row.jaya-program-row>.et_pb_column.jaya-program-timeline-col {
    flex: 35 1 0 !important;
    max-width: none !important;
    width: auto !important;
    min-width: 0 !important;
    /* let flex shrink below intrinsic content width */
    margin-right: 0 !important;
}

.jaya-program-main-section .et_pb_row.jaya-program-row>.et_pb_column.jaya-program-map-col {
    flex: 65 1 0 !important;
    max-width: none !important;
    width: auto !important;
    min-width: 0 !important;
    margin-right: 0 !important;
    position: sticky;
    top: 96px;
    align-self: flex-start;
    margin-top: -60px;
}

/* ---- TIMELINE RAIL ---- */

.jaya-program-timeline {
    position: relative;
    padding-left: 72px;
    /* room for the pin gutter */
}

/* Vertical rail connecting all pins. Gradient fades softly at both ends. */
.jaya-program-timeline::before {
    content: '';
    position: absolute;
    left: 28px;
    /* aligns with pin center (pin width 56 / 2 = 28) */
    top: 28px;
    bottom: 28px;
    width: 2px;
    background: linear-gradient(180deg,
            rgba(176, 214, 110, 0) 0%,
            rgba(176, 214, 110, 0.55) 10%,
            rgba(102, 48, 140, 0.35) 90%,
            rgba(102, 48, 140, 0) 100%);
    border-radius: 2px;
    pointer-events: none;
}

.jaya-timeline-entry {
    position: relative;
    margin-bottom: 22px;
    transition: transform 0.25s ease;
}

.jaya-timeline-entry:last-child {
    margin-bottom: 0;
}

/* Each entry's jaya-program-card already has its own margin-bottom from
   the existing .jaya-program-card .et_pb_text_inner rule. In the timeline
   we don't have a text_inner wrapper, so reset and let the entry spacing own it. */
.jaya-timeline-entry .jaya-program-card {
    margin: 0;
}

/* ---- PINS (shared timeline + map) ---- */

/* A pin is a gradient-filled circle with the category SVG icon centered
   via mask. Same visual treatment in both places; .jaya-timeline-pin and
   .jaya-map-pin only differ in size and position. */
.jaya-cat-pin {
    --cat-color: #9b9aa3;
    --cat-light: #c8c7cc;
    position: relative;
    display: inline-block;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--cat-color) 0%, var(--cat-light) 100%);
    box-shadow:
        0 4px 14px rgba(67, 61, 83, 0.18),
        0 0 0 4px #ffffff,
        0 0 0 5px rgba(67, 61, 83, 0.06);
    border: 0;
    padding: 0;
    cursor: pointer;
    transition: transform 0.25s ease, box-shadow 0.25s ease, filter 0.25s ease;
}

/* Category palette applied to the pin (mirror of the card's data-type map) */
.jaya-cat-pin[data-type="logistics"] {
    --cat-color: #9b9aa3;
    --cat-light: #d5d4d9;
}

.jaya-cat-pin[data-type="meal"] {
    --cat-color: #9b9aa3;
    --cat-light: #d5d4d9;
}

.jaya-cat-pin[data-type="welcome"] {
    --cat-color: #9b9aa3;
    --cat-light: #d5d4d9;
}

.jaya-cat-pin[data-type="dance"] {
    --cat-color: #7db342;
    --cat-light: #b9dd7c;
}

.jaya-cat-pin[data-type="practice"] {
    --cat-color: #7db342;
    --cat-light: #b9dd7c;
}

.jaya-cat-pin[data-type="talk"] {
    --cat-color: #66308c;
    --cat-light: #9d6ebf;
}

.jaya-cat-pin[data-type="workshop"] {
    --cat-color: #8e57b2;
    --cat-light: #c29ddd;
}

.jaya-cat-pin[data-type="integration"] {
    --cat-color: #c99526;
    --cat-light: #ebc874;
}

/* Icon inside the pin: same SVG set as the card corner icon, rendered in
   white via mask-image. The ::after is positioned to fill the pin. */
.jaya-cat-pin::after {
    content: '';
    position: absolute;
    inset: 0;
    background-color: #ffffff;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: 48% 48%;
    mask-size: 48% 48%;
}

.jaya-cat-pin[data-type="logistics"]::after {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='9'/><circle cx='12' cy='12' r='3' fill='black'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='9'/><circle cx='12' cy='12' r='3' fill='black'/></svg>");
}

.jaya-cat-pin[data-type="practice"]::after {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M2 9c2 0 2 3 4 3s2-3 4-3 2 3 4 3 2-3 4-3 2 3 4 3'/><path d='M2 15c2 0 2 3 4 3s2-3 4-3 2 3 4 3 2-3 4-3 2 3 4 3'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M2 9c2 0 2 3 4 3s2-3 4-3 2 3 4 3 2-3 4-3 2 3 4 3'/><path d='M2 15c2 0 2 3 4 3s2-3 4-3 2 3 4 3 2-3 4-3 2 3 4 3'/></svg>");
}

.jaya-cat-pin[data-type="talk"]::after {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 11.5a8.38 8.38 0 01-.9 3.8 8.5 8.5 0 01-7.6 4.7 8.38 8.38 0 01-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 01-.9-3.8 8.5 8.5 0 014.7-7.6 8.38 8.38 0 013.8-.9h.5a8.48 8.48 0 018 8v.5z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 11.5a8.38 8.38 0 01-.9 3.8 8.5 8.5 0 01-7.6 4.7 8.38 8.38 0 01-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 01-.9-3.8 8.5 8.5 0 014.7-7.6 8.38 8.38 0 013.8-.9h.5a8.48 8.48 0 018 8v.5z'/></svg>");
}

.jaya-cat-pin[data-type="workshop"]::after {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 3v4M12 17v4M3 12h4M17 12h4M5.6 5.6l2.8 2.8M15.6 15.6l2.8 2.8M5.6 18.4l2.8-2.8M15.6 8.4l2.8-2.8'/><circle cx='12' cy='12' r='2.5'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 3v4M12 17v4M3 12h4M17 12h4M5.6 5.6l2.8 2.8M15.6 15.6l2.8 2.8M5.6 18.4l2.8-2.8M15.6 8.4l2.8-2.8'/><circle cx='12' cy='12' r='2.5'/></svg>");
}

.jaya-cat-pin[data-type="integration"]::after {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='9'/><circle cx='12' cy='12' r='5.5'/><circle cx='12' cy='12' r='2'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='9'/><circle cx='12' cy='12' r='5.5'/><circle cx='12' cy='12' r='2'/></svg>");
}

.jaya-cat-pin[data-type="meal"]::after {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M7 3v6'/><path d='M11 3v6'/><path d='M15 3v6'/><path d='M11 9v12'/><path d='M19 3c-2 0-3 2-3 5s1 4 3 4z'/><path d='M19 12v9'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M7 3v6'/><path d='M11 3v6'/><path d='M15 3v6'/><path d='M11 9v12'/><path d='M19 3c-2 0-3 2-3 5s1 4 3 4z'/><path d='M19 12v9'/></svg>");
}

.jaya-cat-pin[data-type="welcome"]::after {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='5' y='5' width='14' height='17' rx='2'/><path d='M9 3h6v4H9z'/><path d='M9 14l2 2 4-4'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='5' y='5' width='14' height='17' rx='2'/><path d='M9 3h6v4H9z'/><path d='M9 14l2 2 4-4'/></svg>");
}

.jaya-cat-pin[data-type="dance"]::after {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='7' cy='18' r='2.5'/><circle cx='17' cy='16' r='2.5'/><path d='M9.5 18V6l10-2v12'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='7' cy='18' r='2.5'/><circle cx='17' cy='16' r='2.5'/><path d='M9.5 18V6l10-2v12'/></svg>");
}

/* Timeline-pin placement: absolute, centered on the rail */
.jaya-timeline-pin {
    position: absolute;
    left: -72px;
    /* card padding-left=72, pin width=56, gap=8, (72-56-8)=8 */
    top: 22px;
    z-index: 2;
}

/* ---- MAP PANEL ---- */

.jaya-program-map-wrap {
    padding-left: 8px;
}

.jaya-program-map-heading {
    font-family: var(--font-body) !important;
    font-weight: 700 !important;
    font-size: 22px !important;
    color: var(--jaya-text) !important;
    margin: 0 0 20px !important;
    line-height: 1.3em;
}

/* Illustration panel: outer frame (border, shadow, clipping). Background + pins
   live inside .jaya-map-zoom-target so they scale together; the frame stays fixed. */
.jaya-map-panel {
    position: relative;
    width: 100%;
    aspect-ratio: 5 / 2.8;
    border-radius: 24px;
    border: 1px solid rgba(176, 214, 110, 0.35);
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(102, 48, 140, 0.06);
    --map-zoom: 1;
}

/* Scaled + panned layer: holds the illustration background and the pins.
   Clients can later swap the gradient for a real illustration by adding a
   background-image here. JS sets inline `transform: translate(...) scale(N)`
   directly; this rule's fallback scale() only applies before JS runs. */
.jaya-map-zoom-target {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    aspect-ratio: 1200 / 1042;
    background-image: url('https://jayafest.com/wp-content/uploads/2026/07/Sofia-tech-park-MAP.jpg');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    transform: translate(0px, 0px) scale(1);
    transform-origin: 0 0;
    transition: transform 0.3s cubic-bezier(0.2, 0.7, 0.2, 1);
    will-change: transform;
    touch-action: none;
    user-select: none;
}

.jaya-map-zoom-target::before { content: none; }

/* When pannable, show grab cursor on empty map area (pins override with pointer) */
.jaya-map-panel.is-pannable .jaya-map-zoom-target {
    cursor: grab;
}

.jaya-map-panel.is-panning .jaya-map-zoom-target {
    cursor: grabbing;
}

/* Pins must stay clickable and show pointer even over the grabbable layer */
.jaya-map-panel .jaya-map-pin {
    cursor: pointer;
}

/* Zoom controls: stacked in bottom-right. Shown on desktop; hidden on mobile
   where the layout gives pinch-zoom room anyway. */
.jaya-map-controls {
    position: absolute;
    right: 12px;
    bottom: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    z-index: 6;
}

.jaya-map-zoom-btn {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #ffffff;
    border: 1px solid rgba(67, 61, 83, 0.08);
    box-shadow: 0 4px 12px rgba(67, 61, 83, 0.12);
    color: var(--jaya-text);
    font-family: var(--font-body);
    font-size: 20px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}

.jaya-map-zoom-btn:hover {
    background: #f7f5fa;
    transform: translateY(-1px);
}

.jaya-map-zoom-btn:active {
    transform: translateY(0);
}

.jaya-map-zoom-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
    transform: none;
}

/* Map-pin: smaller than timeline pin, absolutely positioned via inline style.
   The `left`/`top` come from post_content inline style so the client can
   tweak positions in the Visual Builder without touching CSS. */
.jaya-map-pin {
    position: absolute;
    width: 44px;
    height: 44px;
    transform: translate(-50%, -50%);
    z-index: 2;
}

.jaya-map-pin:focus-visible {
    outline: 3px solid rgba(102, 48, 140, 0.45);
    outline-offset: 4px;
}

.jaya-program-map-note {
    margin-top: 16px;
    font-size: 14px;
    line-height: 1.6em;
    color: var(--jaya-text);
    opacity: 0.75;
}

/* ---- HOVER / ACTIVE SYNC ---- */
/* JS toggles .is-active on matching entry + pin pairs (and individual hover). */

.jaya-timeline-entry.is-active .jaya-card-inner,
.jaya-program-card .jaya-card-inner:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 32px rgba(102, 48, 140, 0.14);
    border-color: var(--cat-color);
}

.jaya-cat-pin:hover,
.jaya-cat-pin.is-active {
    transform: scale(1.08);
    box-shadow:
        0 8px 22px rgba(67, 61, 83, 0.25),
        0 0 0 4px #ffffff,
        0 0 0 5px var(--cat-color);
    filter: saturate(115%);
}

.jaya-map-pin.is-active {
    transform: translate(-50%, -50%) scale(1.12);
}

/* ---- RESPONSIVE ---- */

/* Side-by-side at every viewport; internal density + gap shrink with width.
   Divi's own ~980px stacking is defeated by the flex ratios + !important above. */

@media (max-width: 980px) {
    .jaya-program-main-section .et_pb_row.jaya-program-row {
        gap: 24px;
        padding: 0 16px !important;
    }

    .jaya-program-timeline {
        padding-left: 58px;
    }

    .jaya-program-timeline::before {
        left: 22px;
    }

    .jaya-cat-pin {
        width: 44px;
        height: 44px;
    }

    .jaya-timeline-pin {
        left: -58px;
        top: 18px;
    }

    .jaya-map-pin {
        width: 36px;
        height: 36px;
    }

    .jaya-program-map-heading {
        font-size: 20px !important;
    }

    /* Tighter card interior on tablet so the narrow column still fits the content */
    .jaya-program-timeline .jaya-card-inner {
        padding: 16px;
    }

    .jaya-program-timeline .jaya-time {
        font-size: 22px;
    }

    .jaya-program-timeline .jaya-title {
        font-size: 13px;
        padding-right: 28px;
    }
}

/* Mobile: stack columns vertically, timeline becomes horizontal scroll-snap strip
   above the map, map panel fills the remaining viewport below. */
@media (max-width: 767px) {

    /* Row flips to column; timeline first, map second */
    .jaya-program-main-section .et_pb_row.jaya-program-row {
        flex-direction: column !important;
        gap: 20px;
        padding: 0 !important;
    }

    .jaya-program-main-section .et_pb_row.jaya-program-row>.et_pb_column.jaya-program-timeline-col,
    .jaya-program-main-section .et_pb_row.jaya-program-row>.et_pb_column.jaya-program-map-col {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .et_pb_column.jaya-program-map-col {
        position: static !important;
        /* drop out of sticky */
        top: auto !important;
    }

    /* Timeline: horizontal, scroll-snap on cards */
    .jaya-program-timeline {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 14px;
        padding: 42px 16px 18px !important;
        /* extra top padding for pins above cards */
        margin: 0;
        overflow-x: auto;
        overflow-y: visible;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        /* hide scrollbar on firefox */
    }

    .jaya-program-timeline::-webkit-scrollbar {
        display: none;
    }

    /* Hide the vertical rail — the horizontal row has no line */
    .jaya-program-timeline::before {
        display: none;
    }

    .jaya-timeline-entry {
        position: relative;
        flex: 0 0 76vw;
        /* ~3/4 of viewport so next card peeks */
        max-width: 300px;
        margin: 0;
        scroll-snap-align: center;
    }

    /* Pin moves to the top-center, floating above each card */
    .jaya-timeline-pin {
        left: 50%;
        top: -22px;
        transform: translateX(-50%);
    }

    .jaya-cat-pin {
        width: 44px;
        height: 44px;
    }

    .jaya-timeline-entry .jaya-cat-pin.is-active,
    .jaya-timeline-entry .jaya-cat-pin:hover {
        transform: translateX(-50%) scale(1.08);
    }

    /* Card density for mobile */
    .jaya-program-timeline .jaya-card-inner {
        padding: 16px 14px 14px;
        min-height: 0;
    }

    .jaya-program-timeline .jaya-tag {
        font-size: 9px;
        letter-spacing: 0.8px;
        padding: 3px 8px;
        margin-bottom: 8px;
    }

    .jaya-program-timeline .jaya-time {
        font-size: 20px;
        margin-bottom: 4px;
    }

    .jaya-program-timeline .jaya-title {
        font-size: 12px;
        line-height: 1.45em;
        padding-right: 0;
    }

    /* Corner icon on the card is redundant with the pin above — hide on mobile */
    .jaya-program-timeline .jaya-card-inner::after {
        display: none;
    }

    /* Map fills the rest of the viewport width */
    .jaya-program-map-wrap {
        padding: 0 16px;
    }

    .jaya-program-map-heading {
        font-size: 16px !important;
        margin-bottom: 12px !important;
    }

    .jaya-program-map-note {
        font-size: 12px;
    }

    .jaya-map-panel {
        aspect-ratio: 3 / 4;
        /* taller-than-wide fills vertical space on phones */
        max-height: 70vh;
        border-radius: 18px;
    }

    .jaya-map-pin {
        width: 28px;
        height: 28px;
    }

    /* Zoom controls remain visible on mobile too (pinch-to-zoom can also be used)
       but sized down to not dominate the narrow panel. */
    .jaya-map-zoom-btn {
        width: 34px;
        height: 34px;
        font-size: 18px;
    }

    .jaya-map-controls {
        right: 10px;
        bottom: 10px;
        gap: 5px;
    }
}


@media (max-width: 490px) {
    .jaya-program-main-section .et_pb_row.jaya-program-row>.et_pb_column.jaya-program-map-col {
        margin-top: -30px;
    }
}

/*------------------------------------------------*/
/*------------------[ABOUT-US PAGE]---------------*/
/*------------------------------------------------*/

/* HERO — text on the left, person photo on the right.
   Push the background image to the right so the woman stays clear of the copy column. */
.et_pb_section.jaya-about-hero {
    background-position: right center !important;
    /* Section is display:flex from the block attrs; override centering so the row hugs the left edge. */
    justify-content: center !important;
}

/* Pin the row to the left half of the section so text never overlaps the person. */
.et_pb_section.jaya-about-hero .et_pb_row {
    margin-left: 0 !important;
    margin-right: auto !important;
    width: 90%;
    max-width: 1200px;
    padding-left: 5% !important;
}

.jaya-about-hero-text .et_pb_text_inner {
    text-align: left;
    max-width: 520px;
}

.jaya-about-hero-text .jaya-about-h1 {
    font-family: var(--font-script);
    font-weight: 700;
    font-size: 72px;
    line-height: 1.05em;
    color: var(--jaya-purple);
    margin: 0 0 24px;
}

/* Brush underline on the highlighted phrase inside the H1.
   Same green-brush asset used by .jaya-underline-green, scaled to fit a span. */
.jaya-h1-brush-green {
    display: inline-block;
    padding-bottom: 12px;
    background-image: url('../../../wp-content/assets/v2/underline-green.png');
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 100% 12px;
    line-height: 1;
}

.jaya-about-hero-text .jaya-about-lead {
    font-family: var(--font-body);
    font-size: 18px;
    line-height: 1.7em;
    color: var(--jaya-text);
    max-width: 520px;
    margin: 0;
}

/* MISSION — two-column text + image. Reuses the photo's baked-in brushstroke edge,
   so we don't apply a mask here (mirrors how .jaya-blob-image is used on the homepage). */
.jaya-about-mission-image-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 0;
}

.jaya-about-mission-image {
    display: block;
    width: 100%;
    max-width: 460px;
    height: auto;
}

/* BENEFITS — heading + 4-card grid. Each card = photo on top, schedule-card below.
   Reuses .jaya-program-card so the gradient/icon styling stays consistent with the Program page. */
.jaya-about-benefits-heading .et_pb_text_inner h2 {
    font-family: var(--font-script) !important;
    font-weight: 700 !important;
    color: var(--jaya-purple) !important;
    font-size: 56px !important;
    line-height: 1.15em !important;
    margin: 0 auto 50px !important;
}

.jaya-about-benefits-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    align-items: stretch;
    justify-content: center;
}

.jaya-about-benefit-card {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    min-width: 0;
    /* 4-up on desktop without overshooting */
    max-width: calc((100% - 72px) / 4);
    padding: 0px 28px;
}

.jaya-about-benefit-photo {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    width: 100%;
    margin-bottom: -16px;
    /* let the photo overlap the card slightly so the two read as one element */
    z-index: 2;
    position: relative;
}

.jaya-about-benefit-photo img {
    display: block;
    width: 100%;
    max-width: 220px;
    height: auto;
}

/* The schedule-card sits below the photo and inherits all its own styling
   (gradient + corner icon) from the [PROGRAM] section above.
   We only override what's specific to this layout. */
.jaya-about-benefit-card .jaya-program-card {
    flex: 1 1 auto;
    width: 100%;
}

.jaya-about-benefit-card .jaya-program-card .jaya-card-inner {
    padding-top: 36px;
    /* room for the photo overlap on top */
    min-height: 180px;
}

/* Drop the schedule card's corner icon down a bit so it doesn't visually clash with the photo */
.jaya-about-benefit-card .jaya-program-card .jaya-card-inner::after {
    top: 32px;
}

/* Tablet: 2x2 */
@media (max-width: 980px) {
    .jaya-about-benefit-card {
        max-width: calc((100% - 24px) / 2);
        flex: 1 1 calc((100% - 24px) / 2);
    }

    .jaya-about-hero-text .jaya-about-h1 {
        font-size: 56px;
    }
}

/* Phone: single column */
@media (max-width: 600px) {
    .jaya-about-benefit-card {
        max-width: 360px;
        flex: 1 1 100%;
    }

    .jaya-about-hero-text .jaya-about-h1 {
        font-size: 44px;
    }

    .jaya-about-hero-text .jaya-about-lead {
        font-size: 16px;
    }

    .jaya-about-benefits-heading .et_pb_text_inner h2 {
        font-size: 42px !important;
    }

    .jaya-about-mission-image {
        max-width: 320px;
    }

    .page-id-81 .et_pb_text_0 .et_pb_text_inner h1 {
  font-size: 30px;
}

}

/* TRIBE & FINAL CTA — borrow the same heading + button rhythm used elsewhere.
   New helper: a purple-brushstroke underline (parallels .jaya-underline-green). */
.jaya-underline-purple .et_pb_text_inner h2 {
    display: inline-block;
    padding-bottom: 15px;
    background-image: url('../../../wp-content/assets/v2/underline-purple.png');
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 70% 14px;
}

.et_pb_section.jaya-about-tribe-section .et_pb_text_inner {
    text-align: center;
}

.et_pb_section.jaya-about-final-cta .et_pb_text_inner {
    text-align: center;
}

/*------------------[CONTACT PAGE]----------------*/
/*------------------------------------------------*/

/* HERO — centered H1 "Contact form" on the light background, with an eyebrow + lead. */
.et_pb_section.jaya-contact-hero .et_pb_text_inner {
    text-align: center;
}

.jaya-contact-eyebrow {
    font-family: var(--font-body);
    font-size: 13px;
    letter-spacing: 3px;
    font-weight: 600;
    color: var(--jaya-purple);
    text-transform: uppercase;
    margin: 0 0 16px;
}

.jaya-contact-h1 {
    font-family: var(--font-script);
    font-weight: 700;
    font-size: 72px;
    line-height: 1.05em;
    color: var(--jaya-purple);
    margin: 0 0 20px;
}

.jaya-contact-lead {
    font-family: var(--font-body);
    font-size: 18px;
    line-height: 1.7em;
    color: var(--jaya-text);
    max-width: 620px;
    margin: 0 auto;
}

/* MAIN — two-column layout: form on the left, contact info on the right. */
.jaya-contact-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 60px;
    align-items: flex-start;
    justify-content: center;
}

.jaya-contact-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
    flex: 1 1 420px;
    min-width: 0;
    max-width: 600px;
    background: #ffffff;
    padding: 36px;
    border-radius: 18px;
    box-shadow: 0 12px 40px rgba(67, 61, 83, 0.08);
}

.jaya-contact-form .jaya-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.jaya-contact-form label {
    font-family: var(--font-body);
    font-size: 13px;
    font-weight: 600;
    color: var(--jaya-text);
    letter-spacing: 0.5px;
}

.jaya-contact-form input,
.jaya-contact-form textarea {
    font-family: var(--font-body);
    font-size: 15px;
    color: var(--jaya-text);
    background: #f9f9f9;
    border: 1px solid #e6e3ec;
    border-radius: 10px;
    padding: 12px 14px;
    width: 100%;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.jaya-contact-form textarea {
    resize: vertical;
    min-height: 140px;
}

.jaya-contact-form input:focus,
.jaya-contact-form textarea:focus {
    outline: none;
    border-color: var(--jaya-purple);
    box-shadow: 0 0 0 3px rgba(102, 48, 140, 0.15);
}

.jaya-contact-submit {
    align-self: flex-start;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #ffffff;
    background: var(--jaya-green);
    border: none;
    border-radius: 30px;
    padding: 14px 32px;
    cursor: pointer;
    transition: transform 0.15s ease, filter 0.15s ease;
}

.jaya-contact-submit:hover {
    transform: translateY(-1px);
}

/* CONTACT INFO — phone & email beside the form, each with a custom PNG icon. */
.jaya-contact-info {
    display: flex;
    flex-direction: column;
    gap: 24px;
    flex: 0 1 340px;
    min-width: 0;
    padding-top: 8px;
}

.jaya-contact-info-heading {
    font-family: var(--font-script);
    font-weight: 700;
    font-size: 44px;
    line-height: 1.1em;
    color: var(--jaya-purple);
    margin: 0 0 4px;
}

.jaya-contact-info-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.jaya-contact-info-item {
    display: flex;
    align-items: center;
    gap: 16px;
}

.jaya-contact-icon {
    display: block;
    width: 44px;
    height: 44px;
    object-fit: contain;
    flex: 0 0 auto;
}

.jaya-contact-info-body {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.jaya-contact-info-label {
    font-family: var(--font-body);
    font-size: 12px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--jaya-purple);
}

.jaya-contact-info-value {
    font-family: var(--font-body);
    font-size: 17px;
    font-weight: 500;
    color: var(--jaya-text);
    text-decoration: none;
    word-break: break-word;
    transition: color 0.2s ease;
}

.jaya-contact-info-value:hover {
    color: var(--jaya-purple);
}

/* Tablet — keep side-by-side but tighten gaps. */
@media (max-width: 980px) {
    .jaya-contact-h1 {
        font-size: 56px;
    }

    .jaya-contact-grid {
        gap: 40px;
    }
}

/* Phone — stack: form on top, contact info below. */
@media (max-width: 720px) {
    .jaya-contact-grid {
        flex-direction: column;
        align-items: stretch;
        gap: 32px;
    }

    .jaya-contact-form,
    .jaya-contact-info {
        flex: 1 1 auto;
        max-width: 100%;
    }

    .jaya-contact-h1 {
        font-size: 44px;
    }

    .jaya-contact-lead {
        font-size: 16px;
    }

    .jaya-contact-form {
        padding: 24px;
    }

    .jaya-contact-info-heading {
        font-size: 36px;
    }

    .jaya-contact-icon {
        width: 38px;
        height: 38px;
    }
}

/*------------------------------------------------*/
/*------------------[WORKSHOPS PAGE]--------------*/
/*------------------------------------------------*/

/* HERO — split layout that reuses the homepage's .jaya-hero-section shell
   (100vh minus the fixed header, wavy bottom mask on the row, purple splatter
   overflow) but swaps the video column for a still image. Text sits left on
   white; the image is flush right with a left-edge fade-to-white so it blends
   into the copy column. Mirrors the composition on the homepage hero. */
.et_pb_section.jaya-workshops-hero {
    background: #ffffff;
}

/* Text column — left half of the row. Sized + padded via this class so the
   Caveat H1 font-size below wins over the generic .jaya-hero-text rule which
   uses `!important` at 56px for the homepage. */
.jaya-workshops-hero-text {
    padding: 60px 5% 60px 8% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    background: #ffffff;
}

.jaya-workshops-hero-text .et_pb_code_inner {
    max-width: 520px;
}

.jaya-workshops-eyebrow {
    font-family: var(--font-body);
    font-size: 13px;
    letter-spacing: 3px;
    font-weight: 600;
    color: var(--jaya-purple);
    text-transform: uppercase;
    margin: 0 0 16px;
}

.jaya-workshops-hero-text .jaya-workshops-h1 {
    font-family: var(--font-script);
    font-weight: 700;
    font-size: 62px;
    line-height: 1.05em;
    color: var(--jaya-purple);
    margin: 0 0 22px;
}

.jaya-workshops-hero-text .jaya-workshops-h1 .jaya-h1-brush-green {
    background-size: 100% 12px;
}

.jaya-workshops-hero-text .jaya-workshops-lead {
    font-family: var(--font-body);
    font-size: 18px;
    line-height: 1.7em;
    color: var(--jaya-text);
    max-width: 480px;
    margin: 0;
}

/* Image column — right half of the row. The shell classes parallel the
   homepage's .jaya-hero-video-* names so the two heroes share a mental model;
   the behaviour is identical except an <img> replaces the <video>. */
.jaya-hero-image-col {
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: stretch !important;
    align-self: stretch !important;
    height: 100% !important;
}

.jaya-hero-image-col > .et_pb_module,
.jaya-hero-image-col > .et_pb_code {
    height: 100% !important;
    width: 100%;
    margin-bottom: 0 !important;
    flex: 1 1 auto;
}

.jaya-hero-image-wrap,
.jaya-hero-image-wrap .et_pb_code_inner {
    height: 100% !important;
    width: 100%;
}

.jaya-hero-image {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: calc(100vh - 88px);
    overflow: hidden;
}

.jaya-hero-image img {
    width: 100%;
    height: 95vh;
    object-fit: cover;
    display: block;
    object-position: right;
}

/* Left-edge fade-to-white — same ratio as .jaya-hero-video::after on homepage
   so the image blends softly into the text column. */
.jaya-hero-image::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(to right, #ffffff 0%, rgba(255, 255, 255, 0) 22%);
}

/* INTRO — centered prose, then an H2 with green underline, then a bullet list. */
.et_pb_section.jaya-workshops-intro .et_pb_text_inner {
    text-align: center;
}

.jaya-workshops-intro-prose {
    font-family: var(--font-body);
    font-size: 17px;
    line-height: 1.8em;
    color: var(--jaya-text);
    max-width: 780px;
    margin: 0 auto 50px;
}

.jaya-workshops-benefits-heading .et_pb_text_inner h2 {
    font-family: var(--font-script) !important;
    font-weight: 700 !important;
    color: var(--jaya-purple) !important;
    font-size: 48px !important;
    line-height: 1.15em !important;
    margin: 0 auto 14px !important;
}

.jaya-workshops-benefits-list {
    display: flex;
    justify-content: center;
}

.jaya-workshops-benefits-list .jaya-bullet-list {
    display: inline-block;
    text-align: left;
    max-width: 520px;
    margin: 0 auto !important;
}

/* PULL QUOTE — centered purple Caveat passage that closes the intro before
   the schedule begins. */
.jaya-workshops-pullquote {
    font-family: var(--font-script);
    font-weight: 700;
    color: var(--jaya-purple);
    font-size: 46px;
    line-height: 1.2em;
    text-align: center;
    max-width: 780px;
    margin: 0 auto;
}

.jaya-workshops-pullquote span {
    display: block;
    margin-top: 4px;
}

/* SCHEDULE — chronological list of workshop blocks, grouped by time slot.
   Each block pairs a title + time header with a grid of lecturer cards. */
.jaya-workshops-schedule {
    display: flex;
    flex-direction: column;
    gap: 48px;
    max-width: 1200px;
    margin: 0 auto;
}

.jaya-workshop-slot {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.jaya-workshop-slot-heading {
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: var(--font-script);
    font-weight: 700;
    color: var(--jaya-purple);
    font-size: 40px;
    line-height: 1;
    margin: 0;
}

.jaya-workshop-slot-heading::before,
.jaya-workshop-slot-heading::after {
    content: '';
    flex: 1 1 auto;
    height: 2px;
    background: linear-gradient(90deg, rgba(102, 48, 140, 0) 0%, rgba(102, 48, 140, 0.25) 50%, rgba(102, 48, 140, 0) 100%);
}

.jaya-workshop-block {
    --cat-color: #8e57b2;
    --cat-bg: #f6f0fa;
    --cat-tint: rgba(142, 87, 178, 0.09);
    position: relative;
    background: #ffffff;
    background-image: linear-gradient(180deg, var(--cat-tint) 0%, rgba(255, 255, 255, 0) 55%);
    border: 1px solid #ebe5f0;
    border-radius: 18px;
    padding: 32px 36px;
    box-shadow: 0 1px 2px rgba(67, 61, 83, 0.04);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.jaya-workshop-block:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(102, 48, 140, 0.12);
    border-color: var(--cat-color);
}

/* Category palette — mirrors the data-type map on .jaya-program-card so a workshop
   block reads as the same "family" as its schedule card on the Program page. */
.jaya-workshop-block[data-type="practice"] {
    --cat-color: #7db342;
    --cat-bg: #f1f7e8;
    --cat-tint: rgba(125, 179, 66, 0.10);
}
/* Lectures (Лекция) — green family, so a lecture card reads as a different track
   from the purple workshop cards sharing the same time slot. */
.jaya-workshop-block[data-type="lecture"] {
    --cat-color: #7db342;
    --cat-bg: #f1f7e8;
    --cat-tint: rgba(125, 179, 66, 0.10);
}

.jaya-workshop-block[data-type="talk"] {
    --cat-color: #66308c;
    --cat-bg: #f3ecf7;
    --cat-tint: rgba(102, 48, 140, 0.09);
}

.jaya-workshop-block[data-type="integration"] {
    --cat-color: #c99526;
    --cat-bg: #fbf3df;
    --cat-tint: rgba(201, 149, 38, 0.10);
}

.jaya-workshop-header {
    display: flex;
    align-items: center;
    gap: 18px;
    padding-bottom: 22px;
    margin-bottom: 26px;
    border-bottom: 1px dashed #ebe5f0;
    flex-wrap: wrap;
}

.jaya-workshop-tag {
    display: inline-flex;
    align-items: center;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 10px;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    color: var(--cat-color);
    padding: 6px 12px;
    border-radius: 30px;
    background: var(--cat-bg);
    line-height: 1.2;
    flex: 0 0 auto;
}

.jaya-workshop-time {
    display: inline-flex;
    align-items: center;
    font-family: var(--font-script);
    font-weight: 700;
    color: var(--jaya-purple);
    font-size: 30px;
    line-height: 1;
    letter-spacing: 0.5px;
    flex: 0 0 auto;
}

.jaya-workshop-title {
    font-family: var(--font-body);
    font-weight: 700;
    color: var(--jaya-text);
    font-size: 22px;
    line-height: 1.3em;
    margin: 0;
    flex: 1 1 260px;
    min-width: 0;
}

/* Lecturers grid — circular photo + name, 4-up desktop. */
.jaya-workshop-lecturers {
    display: flex;
    flex-wrap: wrap;
    gap: 28px;
    justify-content: flex-start;
    align-items: flex-start;
}

.jaya-workshop-lecturer {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    flex: 0 0 auto;
    width: calc((100% - 84px) / 4);
    max-width: 180px;
    text-align: center;
}

.jaya-workshop-lecturer-photo {
    position: relative;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    overflow: hidden;
    background: var(--jaya-bg-light);
    border: 3px solid #ffffff;
    box-shadow: 0 6px 18px rgba(102, 48, 140, 0.12);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.jaya-workshop-lecturer:hover .jaya-workshop-lecturer-photo {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(102, 48, 140, 0.18);
}

.jaya-workshop-lecturer-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.jaya-workshop-lecturer-name {
    font-family: var(--font-body);
    font-weight: 600;
    color: var(--jaya-text);
    font-size: 15px;
    line-height: 1.35em;
    margin: 0;
}

.jaya-workshop-lecturer-role {
    font-family: var(--font-body);
    font-weight: 500;
    color: var(--jaya-purple);
    font-size: 12px;
    letter-spacing: 0.4px;
    line-height: 1.4em;
    margin: 0;
}

/* Tablet — 3 lecturer cards per row, smaller heading, tighter block padding.
   Hero stacks: image on top at natural aspect ratio, text below (mirrors the
   homepage hero stacking pattern at this breakpoint). */
@media (max-width: 980px) {
    .jaya-workshops-hero-text .jaya-workshops-h1 {
        font-size: 48px;
    }

    /* Stack hero cols: image first, text second. */
    .et_pb_section.jaya-workshops-hero .jaya-hero-row {
        flex-direction: column !important;
    }

    .jaya-hero-image-col {
        order: 1;
        width: 100% !important;
        height: auto !important;
    }

    .jaya-workshops-hero-text {
        order: 2;
        width: 100% !important;
        padding: 30px 6% 60px !important;
        height: auto !important;
    }

    .jaya-hero-image-col > .et_pb_module,
    .jaya-hero-image-col > .et_pb_code,
    .jaya-hero-image-wrap,
    .jaya-hero-image-wrap .et_pb_code_inner {
        height: auto !important;
        min-height: 0 !important;
    }

    .jaya-hero-image {
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: unset;
    }

    .jaya-hero-image img {
        width: 100%;
        height: auto;
    }

    /* Swap the left-edge fade for a bottom fade so the image blends into the
       text below (same move the homepage hero makes on mobile). */
    .jaya-hero-image::after {
        background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 65%, #ffffff 100%);
    }

    .jaya-workshop-block {
        padding: 28px 24px;
    }

    .jaya-workshop-title {
        font-size: 20px;
    }

    .jaya-workshops-pullquote {
        font-size: 36px;
    }

    .jaya-workshop-slot-heading {
        font-size: 34px;
    }

    .jaya-workshop-lecturer {
        width: calc((100% - 56px) / 3);
    }

    .jaya-workshops-schedule {
        gap: 40px;
    }
}

/* Small tablet / large phone — drop the schedule card to 2-up lecturers,
   tighten hero text padding + H1. The hero already stacked at ≤980; this
   band just shrinks the text rhythm. */
@media (max-width: 767px) {
    .jaya-workshops-hero-text .jaya-workshops-h1 {
        font-size: 42px;
    }

    .jaya-workshops-hero-text {
        padding: 24px 6% 50px !important;
    }

    .et_pb_section.jaya-workshops-intro {
        padding-top: 60px !important;
        padding-bottom: 20px !important;
    }

    .jaya-workshop-block {
        padding: 24px 20px;
    }

    .jaya-workshop-header {
        padding-bottom: 18px;
        margin-bottom: 22px;
    }

    .jaya-workshop-lecturers {
        gap: 22px;
    }

    .jaya-workshop-lecturer {
        width: calc((100% - 22px) / 2);
        max-width: none;
    }

    .jaya-workshops-schedule {
        gap: 32px;
    }

    /* Hide the flanking dividers — they visually chop the time heading at narrow widths. */
    .jaya-workshop-slot-heading::before,
    .jaya-workshop-slot-heading::after {
        display: none;
    }

    .jaya-workshop-slot-heading {
        justify-content: center;
        text-align: center;
    }
}

/* Phone — 2 lecturer cards per row, smallest type, workshop header wraps
   so the title stacks under the tag/time pair. */
@media (max-width: 600px) {
    .jaya-workshops-hero-text .jaya-workshops-h1 {
        font-size: 36px;
    }

    .jaya-workshops-hero-text .jaya-workshops-lead {
        font-size: 16px;
    }

    .jaya-workshops-intro-prose {
        font-size: 16px;
    }

    .jaya-workshops-benefits-heading .et_pb_text_inner h2 {
        font-size: 38px !important;
    }

    .jaya-workshops-pullquote {
        font-size: 28px;
    }

    .jaya-workshop-slot-heading {
        font-size: 26px;
    }

    .jaya-workshop-header {
        gap: 10px 12px;
        padding-bottom: 16px;
        margin-bottom: 18px;
    }

    .jaya-workshop-tag {
        font-size: 9px;
        padding: 4px 9px;
    }

    .jaya-workshop-time {
        font-size: 24px;
    }

    .jaya-workshop-title {
        font-size: 18px;
        flex-basis: 100%;
        margin-top: 2px;
    }

    .jaya-workshop-block {
        padding: 22px 18px;
        border-radius: 14px;
    }

    .jaya-workshop-lecturers {
        gap: 18px 16px;
    }

    .jaya-workshop-lecturer {
        width: calc((100% - 16px) / 2);
        gap: 10px;
    }

    .jaya-workshop-lecturer-photo {
        width: 96px;
        height: 96px;
        border-width: 2px;
    }

    .jaya-workshop-lecturer-name {
        font-size: 14px;
    }

    .jaya-workshop-lecturer-role {
        font-size: 11px;
    }

    /* Section padding — shrink the generous desktop rhythm so the page doesn't
       feel airy-empty on a 375-wide screen. Hero handles its own padding
       via .jaya-workshops-hero-text, not the section. */
    .jaya-workshops-hero-text {
        padding: 20px 6% 40px !important;
    }

    .et_pb_section.jaya-workshops-intro {
        padding-top: 48px !important;
        padding-bottom: 10px !important;
    }

    .jaya-workshops-intro-prose {
        margin-bottom: 32px;
    }

    .jaya-hero-image img {
        height: 48vh;
    }
}

/*------------------------------------------------*/
/*------------------[EXHIBITION PAGE]-------------*/
/*------------------------------------------------*/

/* HERO — centered eyebrow + purple Caveat H1 + lead on the light bg.
   Same rhythm as .jaya-contact-hero / .jaya-workshops-hero but centered. */
.et_pb_section.jaya-exhibition-hero .et_pb_code_inner {
    text-align: center;
}

.jaya-exhibition-eyebrow {
    font-family: var(--font-body);
    font-size: 13px;
    letter-spacing: 3px;
    font-weight: 600;
    color: var(--jaya-purple);
    text-transform: uppercase;
    margin: 0 0 16px;
}

.jaya-exhibition-h1 {
    font-family: var(--font-script);
    font-weight: 700;
    font-size: 72px;
    line-height: 1.05em;
    color: var(--jaya-purple);
    margin: 0 0 22px;
}

.jaya-exhibition-lead {
    font-family: var(--font-body);
    font-size: 18px;
    line-height: 1.7em;
    color: var(--jaya-text);
    max-width: 640px;
    margin: 0 auto;
}

/* TABS WRAPPER — holds the tablist + panels. */
.jaya-brand-tabs-wrap {
    max-width: 1200px;
    margin: 0 auto;
}

/* TABLIST — three pill buttons, centered. Active state uses the signature
   green→purple gradient that the header mobile-icon already uses. */
.jaya-brand-tabs {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 14px;
    margin-bottom: 56px;
}

.jaya-brand-tab {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 24px;
    border-radius: 999px;
    border: 1px solid rgba(102, 48, 140, 0.18);
    background: #ffffff;
    color: var(--jaya-text);
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 15px;
    line-height: 1;
    cursor: pointer;
    transition: color 0.25s ease, border-color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}

.jaya-brand-tab-icon {
    display: inline-flex;
    width: 22px;
    height: 22px;
    color: var(--jaya-purple);
    transition: color 0.25s ease;
}

.jaya-brand-tab-icon svg {
    width: 100%;
    height: 100%;
}

.jaya-brand-tab:hover {
    border-color: var(--jaya-green);
    color: var(--jaya-purple);
    transform: translateY(-1px);
}

.jaya-brand-tab[aria-selected="true"] {
    background: linear-gradient(90deg, #9ec66f 0%, #6b488f 100%);
    border-color: transparent;
    color: #ffffff;
    box-shadow: 0 8px 22px rgba(102, 48, 140, 0.18);
}

.jaya-brand-tab[aria-selected="true"] .jaya-brand-tab-icon {
    color: #ffffff;
}

/* PANELS — only the active panel is visible. [hidden] handles that; we also
   animate a soft fade when switching. */
.jaya-brand-panel {
    animation: jaya-brand-fade 0.35s ease both;
}

.jaya-brand-panel[hidden] {
    display: none;
}

@keyframes jaya-brand-fade {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* GRID — 3 cards wide on desktop; responsive collapse handled below. */
.jaya-brand-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    align-items: stretch;
}

/* CARD — delicate tint that matches the tab's category.
   --cat-color / --cat-bg / --cat-tint mirror the [PROGRAM] palette so new
   categories added there propagate here for free. */
.jaya-brand-card {
    --cat-color: #9b9aa3;
    --cat-bg: #f3f3f5;
    --cat-tint: rgba(155, 154, 163, 0.10);
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: #ffffff;
    border: 1px solid rgba(67, 61, 83, 0.06);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 6px 20px rgba(67, 61, 83, 0.04);
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.jaya-brand-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 36px rgba(102, 48, 140, 0.10);
    border-color: var(--cat-color);
}

/* Category palette per card — matches tab colours and program-card colours. */
.jaya-brand-card[data-type="body"] {
    --cat-color: #7db342;
    --cat-bg: #f1f7e8;
    --cat-tint: rgba(125, 179, 66, 0.10);
}

.jaya-brand-card[data-type="soul"] {
    --cat-color: #66308c;
    --cat-bg: #f3ecf7;
    --cat-tint: rgba(102, 48, 140, 0.09);
}

.jaya-brand-card[data-type="material"] {
    --cat-color: #c99526;
    --cat-bg: #fbf3df;
    --cat-tint: rgba(201, 149, 38, 0.10);
}

/* LOGO area — square-ish tinted panel that holds the (placeholder) mark.
   Gradient goes from a slightly stronger cat-tint at the top to pure white at
   the bottom so it blends into the card body. */
.jaya-brand-logo-wrap {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background:
        radial-gradient(ellipse at 50% 40%, var(--cat-tint) 0%, rgba(255, 255, 255, 0) 70%),
        linear-gradient(180deg, var(--cat-bg) 0%, #ffffff 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.jaya-brand-logo {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow:
        0 8px 22px rgba(67, 61, 83, 0.08),
        0 0 0 1px rgba(67, 61, 83, 0.04);
}

.jaya-brand-logo-mark {
    font-family: var(--font-script);
    font-weight: 700;
    font-size: 42px;
    line-height: 1;
    background: linear-gradient(135deg, var(--cat-color) 0%, color-mix(in srgb, var(--cat-color) 55%, #ffffff) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: var(--cat-color);
}

/* Small round category icon in the top-right corner of the logo panel — same
   SVG set used in the tablist. Lets the eye bind a card to its category even
   once filtered. */
.jaya-brand-cat-icon {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #ffffff;
    color: var(--cat-color);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(67, 61, 83, 0.08);
}

.jaya-brand-cat-icon svg {
    width: 18px;
    height: 18px;
}

/* CARD BODY — title + tagline + description. */
.jaya-brand-body {
    padding: 24px 24px 18px;
    flex: 1 1 auto;
}

.jaya-brand-name {
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 22px;
    line-height: 1.25em;
    color: var(--jaya-text);
    margin: 0 0 6px;
}

.jaya-brand-tagline {
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 12px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--cat-color);
    margin: 0 0 14px;
}

.jaya-brand-desc {
    font-family: var(--font-body);
    font-size: 15px;
    line-height: 1.65em;
    color: var(--jaya-text);
    margin: 0;
}

/* CARD FOOTER — green "Научи повече" pill + two circular social icons. */
.jaya-brand-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 24px 24px;
}

.jaya-brand-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 22px;
    border-radius: 999px;
    background: var(--jaya-green);
    color: #ffffff !important;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-decoration: none !important;
    transition: background 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

.jaya-brand-cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(102, 48, 140, 0.18);
}

.jaya-brand-socials {
    display: flex;
    gap: 8px;
}

.jaya-brand-social {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--cat-bg);
    color: var(--cat-color);
    transition: background 0.25s ease, color 0.25s ease, transform 0.25s ease;
}

.jaya-brand-social svg {
    width: 18px;
    height: 18px;
}

.jaya-brand-social:hover {
    background: var(--cat-color);
    color: #ffffff;
    transform: translateY(-1px);
}

/* Tablet: 2-up cards, tighter tabs. */
@media (max-width: 980px) {
    .et_pb_section.jaya-exhibition-hero {
        padding-top: 96px !important;
        padding-bottom: 56px !important;
    }

    .et_pb_section.jaya-exhibition-tabs-section {
        padding-top: 56px !important;
        padding-bottom: 72px !important;
    }

    .jaya-exhibition-h1 {
        font-size: 56px;
    }

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

    .jaya-brand-tab {
        padding: 11px 18px;
        font-size: 14px;
    }

    .jaya-brand-tabs {
        margin-bottom: 44px;
    }
}

/* Phone: horizontally-scrolling tab strip + single-column cards.
   Three Bulgarian labels on one line never fit on a 375-wide viewport, and
   flex-wrapping them produces 3 awkward stacked rows. A scroll strip keeps
   all three tabs visible in peripheral vision and feels native on touch. */
@media (max-width: 600px) {
    .et_pb_section.jaya-exhibition-hero {
        padding-top: 72px !important;
        padding-bottom: 44px !important;
    }

    .et_pb_section.jaya-exhibition-tabs-section {
        padding-top: 44px !important;
        padding-bottom: 56px !important;
    }

    .et_pb_section.jaya-about-final-cta {
        padding-top: 56px !important;
        padding-bottom: 64px !important;
    }

    .jaya-exhibition-h1 {
        font-size: 44px;
    }

    .jaya-exhibition-lead {
        font-size: 16px;
    }

    /* Break out of the row's 92% width so the scroll strip runs edge-to-edge.
       Inner padding restores the content gutter on the first/last tab. */
    .jaya-brand-tabs {
        display: flex;
        flex-wrap: nowrap;
        justify-content: flex-start;
        gap: 10px;
        margin: 0 -4% 32px;
        padding: 4px 4% 12px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .jaya-brand-tabs::-webkit-scrollbar {
        display: none;
    }

    .jaya-brand-tab {
        flex: 0 0 auto;
        scroll-snap-align: start;
        min-height: 44px;       /* touch target */
        padding: 10px 16px;
        font-size: 13px;
        gap: 8px;
    }

    .jaya-brand-tab-icon {
        width: 18px;
        height: 18px;
    }

    /* Single column so cards use the full row width. */
    .jaya-brand-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    /* Shorter logo panel — 16:9 becomes too dominant at full card width. */
    .jaya-brand-logo-wrap {
        aspect-ratio: auto;
        height: 160px;
    }

    .jaya-brand-logo {
        width: 96px;
        height: 96px;
    }

    .jaya-brand-logo-mark {
        font-size: 36px;
    }

    .jaya-brand-cat-icon {
        top: 12px;
        right: 12px;
        width: 32px;
        height: 32px;
    }

    .jaya-brand-cat-icon svg {
        width: 16px;
        height: 16px;
    }

    .jaya-brand-name {
        font-size: 20px;
    }

    .jaya-brand-body {
        padding: 20px 20px 14px;
    }

    /* Keep CTA + socials on a single row — flex-wrap produced an orphaned
       social pair under the pill when content was tight. A smaller CTA
       keeps them side-by-side even at 320px. */
    .jaya-brand-footer {
        flex-wrap: nowrap;
        padding: 0 20px 20px;
    }

    .jaya-brand-cta {
        padding: 10px 18px;
        font-size: 12px;
        letter-spacing: 0.5px;
    }

    .jaya-brand-social {
        width: 40px;
        height: 40px;       /* touch target */
    }
}

/* ==== JAYA-CHECKOUT-STYLES START ==== */
/*------------------------------------------------------------------
[CHECKOUT & TICKETS COMMERCE]
Styles the Event Tickets Commerce checkout (/kupi-bilet, page 225) and
the ticket-selection form on the tickets host page (/jaya-tickets-host,
page 236). Plugin output is otherwise unstyled. Brand vars from :root.
------------------------------------------------------------------*/

body.page-id-236 .container {
    width: 100%;
  max-width: 1080px;
}



/* ---- Shared wrapper ---- */
.tribe-common.event-tickets {
    font-family: var(--font-body) !important;
    color: var(--jaya-text);
    max-width: 760px;
    margin: 40px auto;
}
.tribe-common.event-tickets * {
    box-sizing: border-box;
}

/* =================================================================
   CHECKOUT PAGE (page 225 — [tec_tickets_checkout], Divi-5 wrapped)
================================================================= */

/* Card container around the whole checkout.
   Prefixed + !important because Tribe's framework zeroes the section padding. */
.tribe-common.event-tickets .tribe-tickets__commerce-checkout,
.tribe-tickets__commerce-checkout {
    background: #fff;
    background-image: linear-gradient(180deg, rgba(102,48,140,0.05) 0%, rgba(255,255,255,0) 40%);
    border: 1px solid #ebe5f0;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(67,61,83,0.07);
    padding: 34px 40px 40px !important;
}

/* Header: "Purchase Tickets" + "back" */
.tribe-tickets__commerce-checkout-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 8px;
}
.tribe-tickets__commerce-checkout-header-title,
.tribe-tickets__commerce-checkout-header h1,
.tribe-tickets__commerce-checkout-header h2 {
    font-family: var(--font-body) !important;
    font-weight: 700 !important;
    color: var(--jaya-purple) !important;
    margin: 0 !important;
    letter-spacing: -0.5px;
}
.tribe-tickets__commerce-checkout-header-link-back-to-event {
    color: var(--jaya-green) !important;
    font-weight: 600;
}
.tribe-tickets__commerce-checkout-header-link-back-to-event:hover {
    color: var(--jaya-purple) !important;
}

/* Cart section title ("Билети — Jaya Fest" event link) */
.tribe-tickets__commerce-checkout-cart-header,
.tribe-tickets__commerce-checkout-cart-header-title {
    font-weight: 600;
    color: var(--jaya-purple);
    padding: 14px 0;
    border-bottom: 2px solid #efeaf3;
}
.tribe-tickets__commerce-checkout-cart-header-title,
.tribe-tickets__commerce-checkout-cart-header-title a,
.tribe-tickets__commerce-checkout-cart-header a {
    color: var(--jaya-purple) !important;
}

/* Cart item rows */
.tribe-tickets__commerce-checkout-cart-item {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 22px 0;
    border-bottom: 1px solid #f0ecf5;
}
.tribe-tickets__commerce-checkout-cart-item-details {
    flex: 1 1 auto;
    min-width: 0;
}
.tribe-tickets__commerce-checkout-cart-item-details-title,
.tribe-tickets__commerce-checkout-cart-item-details .tribe-tickets__commerce-checkout-cart-item-details-title {
    font-weight: 700 !important;
    font-size: 18px;
    color: var(--jaya-purple) !important;
}
.tribe-tickets__commerce-checkout-cart-item-price,
.tribe-tickets__commerce-checkout-cart-item-subtotal {
    font-weight: 700;
    color: var(--jaya-text);
    white-space: nowrap;
    text-align: right;
    min-width: 84px;
}
.tribe-tickets__commerce-checkout-cart-item-price .tec-tickets-price,
.tribe-tickets__commerce-checkout-cart-item-price {
    font-weight: 600;
}
.tribe-tickets__commerce-checkout-cart-item-subtotal {
    font-size: 18px;
    color: var(--jaya-purple);
}
.tribe-tickets__commerce-checkout-cart-item-quantity {
    min-width: 120px;
    display: flex;
    justify-content: center;
}

/* Coupon link */
.tribe-tickets__commerce-checkout-cart-coupons a,
.tribe-tickets__commerce-checkout-cart-coupons button,
.tribe-tickets__commerce-checkout-cart-coupons .tribe-common-anchor,
.tribe-tickets__commerce-checkout a.tribe-tickets__commerce-checkout-cart-coupons-add {
    color: var(--jaya-purple) !important;
    font-weight: 600;
}

/* Footer: quantity + total */
.tribe-tickets__commerce-checkout-cart-footer {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
    padding-top: 20px;
    margin-top: 4px;
}
.tribe-tickets__commerce-checkout-cart-footer-quantity,
.tribe-tickets__commerce-checkout-cart-footer-total {
    font-size: 15px;
    color: var(--jaya-text);
}
.tribe-tickets__commerce-checkout-cart-footer-total {
    font-size: 20px;
    font-weight: 700;
}
.tribe-tickets__commerce-checkout-cart-footer-total-label {
    color: var(--jaya-text);
}
.tribe-tickets__commerce-checkout-cart-footer-total-wrap {
    color: var(--jaya-purple);
    margin-left: 6px;
}

/* Purchaser info fields */
.tribe-tickets__commerce-checkout-purchaser-info-wrapper input[type="text"],
.tribe-tickets__commerce-checkout-purchaser-info-wrapper input[type="email"] {
    border: 1px solid #d9d0e4 !important;
    border-radius: 10px !important;
    padding: 12px 14px !important;
}
.tribe-tickets__commerce-checkout-purchaser-info-wrapper input:focus {
    border-color: var(--jaya-purple) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(102,48,140,0.12) !important;
}

/* ---- Injected +/- quantity stepper (checkout) ----
   Prefixed with .tribe-common.event-tickets + !important to beat Tribe's
   .tribe-common button reset (which strips border/background). */
.tribe-common.event-tickets .jaya-qty {
    display: inline-flex !important;
    align-items: center;
    gap: 10px;
}
.tribe-common.event-tickets .jaya-qty-btn {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    padding: 0 !important;
    border: 2px solid var(--jaya-purple) !important;
    border-radius: 50% !important;
    background: #fff !important;
    color: var(--jaya-purple) !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    box-shadow: none !important;
    cursor: pointer;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    transition: background-color .2s ease, color .2s ease, transform .2s ease;
}
.tribe-common.event-tickets .jaya-qty-btn:hover {
    background: var(--jaya-purple) !important;
    color: #fff !important;
    transform: translateY(-1px);
}
.tribe-common.event-tickets .jaya-qty-btn:disabled {
    opacity: .45 !important;
    cursor: default;
    transform: none;
}
.tribe-common.event-tickets .jaya-qty-num {
    min-width: 26px;
    text-align: center;
    font-size: 17px;
    font-weight: 700;
    color: var(--jaya-text);
}
.jaya-qty--busy {
    opacity: .55;
}

/* ---- "Checkout Unavailable" / gateway notice ---- */
.tribe-tickets__notice,
.tribe-tickets__commerce-checkout-footer-notice-error--no-gateway {
    background: #f7f2fb !important;
    border: 1px solid #e3d6ef !important;
    border-left: 4px solid var(--jaya-purple) !important;
    border-radius: 12px !important;
    padding: 18px 20px !important;
    margin-top: 26px !important;
    color: var(--jaya-text) !important;
}
.tribe-tickets-notice__title,
.tribe-tickets__notice .tribe-common-h7 {
    color: var(--jaya-purple) !important;
    font-weight: 700 !important;
}
.tribe-tickets__notice--error {
    border-left-color: #c0563f !important;
    background: #fdf3f1 !important;
}
.tribe-tickets__notice--error .tribe-tickets-notice__title {
    color: #b5472f !important;
}

/* =================================================================
   TICKETS HOST FORM (page 236 — the ticket picker, raw plugin markup)
   Layout: 3 ticket cards in a row (desktop) / horizontal slider (mobile).
   The .jaya-tickets-row wrapper around the ticket items is injected by
   wp-content/novamira-sandbox/jaya-tickets-host.php.
================================================================= */

/* This page needs room for a 3-across card row. The wrapper div carries BOTH
   .tribe-common.event-tickets (760 for the checkout) and
   .tribe-tickets__tickets-wrapper — widen only on page 236. */

:root {
    --tec-font-size-3: 18px !important;
}


.entry .entry-content .event-tickets .tribe-tickets__tickets-form, 
.event-tickets .tribe-tickets__tickets-form {
    max-width: 1440px !important;
    border: none !important;
}

.event-tickets .tribe-tickets__tickets-footer {
    border-top:none !important;
}

.event-tickets .tribe-common-b3 {
    display:none !important;
}


body.page-id-236 .entry-title.main_title {
    max-width: 1080px;
    margin-left: auto;
    margin-right: auto;
    font-family: var(--font-body) !important;
    font-weight: 700 !important;
    color: var(--jaya-purple) !important;
    letter-spacing: -0.5px;
    text-align: center;
}
body.page-id-236 .tribe-common.event-tickets,
.tribe-tickets__tickets-wrapper {
    max-width: 1280px;
    margin: 40px auto;
}

body.page-id-236 .et_pb_row:not([class*="et_flex_column"]) {
    max-width:  1280px;
}

/* Festival date + location bar on the host page (injected by jaya-tickets-host.php). */
.jaya-host-meta {
    justify-content: center;
    max-width: 1080px;
    margin: 4px auto 12px;
    font-size: 17px;
}


/* Page title 'Избери билети' above the date/location bar (injected by jaya-tickets-host.php). */
.jaya-host-title {
    max-width: 1080px;
    margin: 34px auto 6px;
    text-align: center;
    font-family: var(--font-script);
    font-weight: 700;
    font-size: 72px;
    line-height: 1.4;
    color: #66308c;
}
@media (max-width: 767px) {
    .jaya-host-title { font-size: 26px; margin-top: 20px; }
}

/* Hide Event Tickets' built-in 'Билети' form title on the host page. */
body.page-id-236 .tribe-tickets__tickets-title {
    display: none !important;
}

/* Row of ticket cards (the wrapper injected by the sandbox JS). */
.jaya-tickets-row {
    display: flex;
    gap: 20px;
    align-items: stretch;
    margin: 10px 0 6px;
}

/* Each ticket = a self-contained vertical card. This overrides the old
   horizontal-row treatment (title | features | price | stepper on one line). */
.jaya-tickets-row .tribe-tickets__tickets-item {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    padding: 26px 24px;
    border: 1px solid #ebe5f0;
    border-radius: 16px;
    background-color: #fff;
    background-image: linear-gradient(180deg, rgba(102,48,140,0.06) 0%, rgba(255,255,255,0) 45%);
    box-shadow: 0 6px 20px rgba(67,61,83,0.06);
    transition: transform .25s ease, box-shadow .25s ease;
}
.jaya-tickets-row .tribe-tickets__tickets-item:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 32px rgba(67,61,83,0.12);
}

/* Title */
.tribe-tickets__tickets-item-content-title-container {
    flex: 0 0 auto;
    min-width: 0;
}
.tribe-tickets__tickets-item-content-title {
    font-weight: 700 !important;
    font-size: 20px;
    color: var(--jaya-purple) !important;
}

/* Feature list — grows so the price + stepper align along the card bottoms
   regardless of how many features each tier lists. */
.tribe-tickets__tickets-item-details-content {
    margin-top: 14px;
    flex: 1 1 auto;
}
.tribe-tickets__tickets-item-details-content ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.tribe-tickets__tickets-item-details-content li {
    position: relative;
    padding-left: 20px;
    margin: 0 0 8px;
    font-size: 14px;
    line-height: 1.4;
    color: var(--jaya-text);
}
.tribe-tickets__tickets-item-details-content li:last-child {
    margin-bottom: 0;
}
.tribe-tickets__tickets-item-details-content li::before {
    content: '';
    position: absolute;
    left: 2px;
    top: 7px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--jaya-green);
}
.tribe-tickets__tickets-item-details-content li strong {
    color: var(--jaya-purple);
    font-weight: 700;
}

/* Price + availability — separated from the features by a hairline rule. */
.tribe-tickets__tickets-item-extra {
    flex: 0 0 auto;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid #f0ecf5;
}
.tribe-tickets__tickets-item-extra-price,
.tribe-tickets__tickets-sale-price {
    font-weight: 700;
    color: var(--jaya-purple);
    font-size: 24px;
}
.tribe-tickets__tickets-item-extra-available {
    color: var(--jaya-text);
    opacity: .65;
    font-size: 13px;
    margin-top: 4px;
}

/* Stepper pinned at the bottom of the card, centered. */
.tribe-tickets__tickets-item-quantity {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 18px;
}
.tribe-common.event-tickets .tribe-tickets__tickets-item-quantity-remove,
.tribe-common.event-tickets .tribe-tickets__tickets-item-quantity-add {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    padding: 0 !important;
    border: 2px solid var(--jaya-purple) !important;
    border-radius: 50% !important;
    background: #fff !important;
    color: var(--jaya-purple) !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    box-shadow: none !important;
    cursor: pointer;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    transition: background-color .2s ease, color .2s ease, transform .2s ease;
}
.tribe-common.event-tickets .tribe-tickets__tickets-item-quantity-remove:hover,
.tribe-common.event-tickets .tribe-tickets__tickets-item-quantity-add:hover {
    background: var(--jaya-purple) !important;
    color: #fff !important;
    transform: translateY(-1px);
}
.tribe-tickets__tickets-item-quantity-number-input {
    width: 52px !important;
    text-align: center !important;
    border: 1px solid #d9d0e4 !important;
    border-radius: 10px !important;
    padding: 6px 4px !important;
    font-weight: 700 !important;
    color: var(--jaya-text) !important;
    font-size: 16px !important;
}
.tribe-tickets__tickets-item-quantity-number-input:focus {
    border-color: var(--jaya-purple) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(102,48,140,0.12) !important;
}

/* Host form footer + submit (full width, under the row of cards). */
.tribe-tickets__tickets-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 18px;
    padding-top: 22px;
    flex-wrap: wrap;
}
.tribe-tickets__tickets-footer-total {
    font-size: 20px;
    font-weight: 700;
    color: var(--jaya-purple);
}
.tribe-tickets__tickets-buy,
.tribe-common-c-btn.tribe-tickets__tickets-buy {
    background: var(--jaya-green) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 30px !important;
    padding: 14px 34px !important;
    font-family: var(--font-body) !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    cursor: pointer;
    transition: background-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.tribe-tickets__tickets-buy:hover:not(:disabled) {
    background: var(--jaya-purple) !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(102,48,140,0.25);
}
.tribe-tickets__tickets-buy:disabled {
    opacity: .5 !important;
    cursor: default;
}

/* ---- Responsive ---- */
@media (max-width: 767px) {
    .tribe-tickets__commerce-checkout,
    .tribe-tickets__tickets-form {
        padding: 24px 16px !important;
    }
    /* Checkout cart rows still wrap on small screens. */
    .tribe-tickets__commerce-checkout-cart-item {
        flex-wrap: wrap;
        gap: 10px;
    }
    .tribe-tickets__commerce-checkout-cart-item-quantity {
        min-width: 0;
        justify-content: flex-start;
    }
    .tribe-common.event-tickets {
        margin: 24px auto;
    }
    body.page-id-236 .tribe-common.event-tickets {
        max-width: 100%;
    }

    /* Ticket cards become a horizontal snap-slider. */
    .jaya-tickets-row {
        gap: 14px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        margin: 6px -16px 4px;
        padding: 4px 16px 14px;
        scroll-padding-left: 16px;
    }
    .jaya-tickets-row .tribe-tickets__tickets-item {
        flex: 0 0 80%;
        scroll-snap-align: center;
    }
    .jaya-tickets-row .tribe-tickets__tickets-item:hover {
        transform: none;
        box-shadow: 0 6px 20px rgba(67,61,83,0.06);
    }
    .jaya-tickets-row::-webkit-scrollbar {
        height: 6px;
    }
    .jaya-tickets-row::-webkit-scrollbar-track {
        background: transparent;
    }
    .jaya-tickets-row::-webkit-scrollbar-thumb {
        background: rgba(102,48,140,.28);
        border-radius: 3px;
    }
}


/* ---- Host page (236) MOBILE refinements (2026-07-08) ----
   Later source order than the block above, so these win on phones. Fixes:
   description hidden, card content misaligned, and the footer cutting off
   "Quantity" off the left edge. */
@media (max-width: 767px) {


    body.page-id-236  .et_pb_row:not([class*="et_flex_column"]) {
        width: 100% !important;
    }

    /* The slider bleeds to the screen edges; keep that from scrolling the page. */
    body.page-id-236 { overflow-x: hidden; }

    /* Show each ticket's description on mobile — Tribe's own CSS hides
       .tribe-tickets__tickets-item-details-content below 768px. */
    .jaya-tickets-row .tribe-tickets__tickets-item-details-content {
        display: block !important;
        margin-top: 12px;
    }

    /* Roomier cards, left-aligned content to match the homepage ticket cards. */
    .jaya-tickets-row .tribe-tickets__tickets-item {
        flex: 0 0 82%;
        padding: 22px 20px;
        text-align: left;
    }
    .jaya-tickets-row .tribe-tickets__tickets-item-content-title-container,
    .jaya-tickets-row .tribe-tickets__tickets-item-content-title,
    .jaya-tickets-row .tribe-tickets__tickets-item-extra {
        text-align: left !important;
    }

    /* Footer: Quantity + Total on one row, buy button full-width below.
       (The desktop justify-content:flex-end pushed the overflow off the LEFT
       edge on narrow screens, cutting "Quantity".) */
    .event-tickets .tribe-tickets__tickets-footer {
        justify-content: space-between !important;
        align-items: center;
        gap: 10px 16px;
        flex-wrap: wrap;
        padding: 18px 0 0 !important;
    }
    .tribe-tickets__tickets-footer-quantity,
    .tribe-tickets__tickets-footer-total {
        flex: 0 0 auto;
    }
    .event-tickets .tribe-tickets__tickets-buy,
    .tribe-common-c-btn.tribe-tickets__tickets-buy {
        flex: 1 1 100%;
        width: 100% !important;
        order: 10;
        margin-top: 6px;
        padding: 14px 20px !important;
    }
}


/* ---- Host page (236): FULL-WIDTH cards container + reliable swipe snap (2026-07-08) ----
   Breaks the ticket section out of the theme's centered column so the cards use
   the full screen width (was capped at 1080/1440px, leaving unappealing side
   margins). overflow-x:hidden stops the 100vw bleed from adding a scrollbar.
   Later in the file than the blocks above, so these win. */
body.page-id-236 { overflow-x: hidden; }

body.page-id-236 .tribe-tickets__tickets-wrapper {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}
body.page-id-236 .event-tickets .tribe-tickets__tickets-form,
body.page-id-236 .tribe-tickets__tickets-form {
    max-width: 100% !important;
    padding-left: 48px !important;
    padding-right: 48px !important;
}

/* Each ticket snaps into place when swiping (start-aligned, never skipped). */
.jaya-tickets-row .tribe-tickets__tickets-item {
    scroll-snap-align: start;
    scroll-snap-stop: always;
}

@media (max-width: 767px) {
    body.page-id-236 .event-tickets .tribe-tickets__tickets-form,
    body.page-id-236 .tribe-tickets__tickets-form {
        padding-left: 12px !important;
        padding-right: 0px !important;
    }


    body.page-id-236 .event-tickets .tribe-tickets__tickets-footer {
       padding-right: 12px !important;
    }
    /* Slider inset by the form padding; one card per swipe with the next peeking. */
    .jaya-tickets-row {
        margin: 6px 0 4px !important;
        padding: 4px 0 16px !important;
        scroll-padding-left: 0 !important;
    }
    .jaya-tickets-row .tribe-tickets__tickets-item {
        flex: 0 0 88%;
        scroll-snap-align: start !important;
        scroll-snap-stop: always !important;
    }
}


/* ---- Checkout page (225) MOBILE refinements (2026-07-08) ----
   Realigns the broken cart-item row, and lowers the outer left/right spacing +
   the card's inner padding. Later in the file than the blocks above, so wins. */
@media (max-width: 767px) {
    /* Lower outer left/right spacing: tighten the Divi section/row/column wrapping
       the checkout on page 225 so the card sits closer to the screen edges. Scoped
       to the numbered content wrappers so the TB header/footer stay untouched. */
    body.page-id-225 .et_pb_section_0 {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    body.page-id-225 .et_pb_row_0 {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    body.page-id-225 .et_pb_column_0,
    body.page-id-225 .et_pb_code_0 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Lower the checkout card's inner padding. */
    .tribe-tickets__commerce-checkout {
        padding: 18px 14px !important;
    }

    /* Re-align the cart item cleanly:
         row 1: title + "more info"  (full width)
         row 2: unit price | +/- stepper
         row 3: line subtotal (bold, right) */
    .event-tickets .tribe-tickets__commerce-checkout-cart-item {
        display: grid !important;
        grid-template-columns: 1fr auto;
        grid-template-areas:
            "details  details"
            "price    quantity"
            "subtotal subtotal";
        column-gap: 12px;
        row-gap: 8px;
        align-items: center;
        padding: 18px 0 !important;
    }
    .tribe-tickets__commerce-checkout-cart-item-details {
        grid-area: details;
        padding-right: 0 !important;
        min-width: 0;
    }
    .tribe-tickets__commerce-checkout-cart-item-details-title {
        white-space: normal;
        font-size: 17px !important;
    }
    .tribe-tickets__commerce-checkout-cart-item-price {
        grid-area: price;
        text-align: left !important;
        min-width: 0 !important;
        font-size: 15px;
        opacity: .85;
    }
    .tribe-tickets__commerce-checkout-cart-item-quantity {
        grid-area: quantity;
        justify-content: flex-end !important;
        min-width: 0 !important;
    }
    .tribe-tickets__commerce-checkout-cart-item-subtotal {
        grid-area: subtotal;
        text-align: right !important;
        min-width: 0 !important;
        font-size: 19px;
    }
}


/* ==== JAYA-HOST-FONT: force Montserrat on the ticket host page (236) ==== */
/* Every .tribe-common descendant reads font-family: var(--tec-font-family-sans-serif),
   which the plugin defaults to a Helvetica stack. Overriding the variable on the
   page-236 wrapper cascades to all ticket-form text (dashicons icon fonts untouched). */
body.page-id-236 .tribe-common {
	--tec-font-family-sans-serif: 'Montserrat', sans-serif !important;
}


/* ==== JAYA-DUAL-CURRENCY: checkout cart row (2026-07-23, rev 2) ====
   SPECIFICITY NOTE — verified from the <link> order rendered on /kupi-bilet/:
   the child stylesheet is #1 and event-tickets/tickets-commerce.css is #9, so a
   rule of ours that merely TIES the plugin's specificity LOSES on source order.
   The plugin sets, all at (0,2,0):
       ...-cart-item          { display: flex }
       ...-cart-item-price,
       ...-cart-item-subtotal { flex: 0 0 85px; max-width: 85px; text-align: center }
       ...-cart-item-quantity { flex: 0 0 60px }
       ...-cart-item-details  { flex: 1 }
   Every contested property below is therefore scoped with body.page-id-225
   (0,3,0) AND marked !important. A previous revision used bare .event-tickets
   prefixes and silently lost — it only appeared to help because min-width wins
   over max-width when both are set. */

/* Card wide enough for title + stepper + the two money figures. */

body.page-id-225 .tribe-common.event-tickets {
    max-width: 720px;
}

.event-tickets .tribe-tickets__commerce-checkout, .tribe-common .tribe-tickets__commerce-checkout {
    max-width: 100% !important;
  position: relative;
  width: 100% !important;
}


/* Desktop row:  Ценител            [-] 2 [+]      €69.00 / 134.95 лв
                 More info                        €138.00 / 269.90 лв
   The two money figures share one right-hand column — light unit price on
   top, bold line total under it — which is what buys back the width. */
@media (min-width: 768px) {
    body.page-id-225 .tribe-tickets__commerce-checkout-cart-item {
        display: grid !important;
        grid-template-columns: minmax(140px, 1fr) auto auto;
        grid-template-areas:
            "details quantity price"
            "details quantity subtotal";
        align-items: center;
        column-gap: 24px;
        row-gap: 2px;
    }
    body.page-id-225 .tribe-tickets__commerce-checkout-cart-item-details {
        grid-area: details;
        min-width: 0;
        padding-right: 20px;
    }
    body.page-id-225 .tribe-tickets__commerce-checkout-cart-item-quantity {
        grid-area: quantity;
        justify-self: end;
        min-width: 110px;
    }
    body.page-id-225 .tribe-tickets__commerce-checkout-cart-item-price {
        grid-area: price;
        justify-self: end;
        max-width: none !important;
        text-align: right !important;
        font-weight: 400 !important;
        font-size: 14px;
        opacity: .75;
        white-space: nowrap;
    }
    body.page-id-225 .tribe-tickets__commerce-checkout-cart-item-subtotal {
        grid-area: subtotal;
        justify-self: end;
        max-width: none !important;
        text-align: right !important;
        white-space: nowrap;
    }
}

/* Mobile: the ≤767px grid (details / price+stepper / subtotal) already gives
   every figure its own area. It needs the 85px cap lifted, the same
   de-emphasis on the unit price, and permission to wrap on a 320px phone —
   .jaya-bgn stays nowrap, so a break can only land at the " / " between the
   two currencies, never inside "134.95 лв". */
@media (max-width: 767px) {
    body.page-id-225 .tribe-tickets__commerce-checkout-cart-item-price,
    body.page-id-225 .tribe-tickets__commerce-checkout-cart-item-subtotal,
    body.page-id-225 .tribe-tickets__commerce-checkout-cart-footer-total-wrap {
        max-width: none !important;
        white-space: normal;
    }
    body.page-id-225 .tribe-tickets__commerce-checkout-cart-item-price {
        font-weight: 400 !important;
        opacity: .75;
    }
}

/* Ticket picker (236): the plugin clips that price line with overflow:hidden +
   text-overflow:ellipsis, which would eat the лв figure. */
body.page-id-236 .tribe-tickets__tickets-item-extra-price {
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
}

/* Never break a лв figure across lines. */
.jaya-bgn {
    white-space: nowrap;
}

/* ==== JAYA-CHECKOUT-STYLES END ==== */





/*------------------------------------------------*/
/*----------[WORKSHOPS — PRESENTER CARD]----------*/
/*------------------------------------------------*/

/* Single-presenter variant of .jaya-workshop-block: a "Кой съм аз?" heading,
   then a photo-left / text-right layout with a short bio and a read-more link
   to the presenter's detail page. Reuses the block shell (border, radius,
   hover-lift) from .jaya-workshop-block. */
.jaya-presenter-header {
    margin-bottom: 24px;
}

.jaya-presenter-heading {
    font-family: var(--font-script);
    font-weight: 700;
    color: var(--jaya-purple);
    font-size: 32px;
    line-height: 1.1;
    flex: 1 1 auto;
}

.jaya-presenter {
    display: flex;
    align-items: flex-start;
    gap: 30px;
}

.jaya-presenter-photo {
    flex: 0 0 auto;
    display: block;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    overflow: hidden;
    background: var(--jaya-bg-light);
    border: 3px solid #ffffff;
    box-shadow: 0 6px 18px rgba(102, 48, 140, 0.12);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.jaya-presenter-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.jaya-presenter-block:hover .jaya-presenter-photo {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(102, 48, 140, 0.18);
}

.jaya-presenter-body {
    flex: 1 1 auto;
    min-width: 0;
}

.jaya-presenter-name {
    display: inline-block;
    font-family: var(--font-body);
    font-weight: 700;
    color: var(--jaya-text);
    font-size: 22px;
    line-height: 1.3;
    margin: 0 0 12px;
    text-decoration: none;
    transition: color 0.2s ease;
}

.jaya-presenter-name:hover {
    color: var(--jaya-purple);
}

.jaya-presenter-bio {
    font-family: var(--font-body);
    font-size: 15px;
    line-height: 1.75;
    color: var(--jaya-text);
    margin: 0 0 20px;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.jaya-presenter-bio-label {
    font-weight: 700;
    color: var(--jaya-purple);
    letter-spacing: 0.3px;
    margin-right: 4px;
}

.jaya-presenter-readmore {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.9px;
    color: var(--jaya-purple);
    text-decoration: none;
    padding: 11px 24px;
    border: 2px solid var(--jaya-purple);
    border-radius: 30px;
    transition: background-color 0.25s ease, color 0.25s ease;
}

.jaya-presenter-readmore span {
    transition: transform 0.25s ease;
}

.jaya-presenter-readmore:hover {
    background: var(--jaya-purple);
    color: #ffffff;
}

.jaya-presenter-readmore:hover span {
    transform: translateX(3px);
}

@media (max-width: 600px) {
    .jaya-presenter-heading {
        font-size: 27px;
        text-align: center;
    }

    .jaya-presenter {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 18px;
    }

    .jaya-presenter-photo {
        width: 120px;
        height: 120px;
    }
}

/*------------------------------------------------*/
/*--------[PRESENTER DETAIL PAGE]-----------------*/
/*------------------------------------------------*/

.jaya-presenter-detail {
    max-width: 1024px;
    margin: 0 auto;
    padding: 60px 6% 90px;
}

.jaya-presenter-detail-head {
    display: flex;
    align-items: center;
    gap: 34px;
    margin-bottom: 48px;
}

.jaya-presenter-detail-photo {
    flex: 0 0 auto;
    width: 170px;
    height: 170px;
    border-radius: 50%;
    overflow: hidden;
    background: var(--jaya-bg-light);
    border: 4px solid #ffffff;
    box-shadow: 0 10px 28px rgba(102, 48, 140, 0.15);
}

.jaya-presenter-detail-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.jaya-presenter-detail-eyebrow {
    font-family: var(--font-body);
    font-size: 12px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--jaya-purple);
    margin: 0 0 8px;
}

.jaya-presenter-detail-name {
    font-family: var(--font-script);
    font-weight: 700;
    color: var(--jaya-purple);
    font-size: 56px;
    line-height: 1.05;
    margin: 0;
}

.jaya-presenter-detail-section {
    margin-bottom: 44px;
}

.jaya-presenter-detail-h2 {
    font-family: var(--font-script);
    font-weight: 700;
    color: var(--jaya-purple);
    font-size: 34px;
    line-height: 1.15;
    margin: 0 0 16px;
}

.jaya-presenter-detail-section p {
    font-family: var(--font-body);
    font-size: 17px;
    line-height: 1.85;
    color: var(--jaya-text);
    margin: 0 0 16px;
}

.jaya-presenter-detail-section ul {
    list-style: none;
    margin: 0 0 16px;
    padding: 0;
}

.jaya-presenter-detail-section li {
    font-family: var(--font-body);
    font-size: 17px;
    line-height: 1.85;
    color: var(--jaya-text);
    margin: 0 0 10px;
    padding-left: 28px;
    position: relative;
}

.jaya-presenter-detail-section li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.66em;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--jaya-green);
}

.jaya-presenter-detail-cta {
    position: relative;
    text-align: center;
    color: #ffffff;
    background: transparent;
    border-radius: 0;
    padding: 66px 56px 74px;
    isolation: isolate;
}

.jaya-presenter-detail-cta::before {
    content: "";
    position: absolute;
   inset: 0% -45%;
    z-index: -1;
    background: var(--jaya-purple);
    -webkit-mask-image: url('../../assets/brush-shapes/shape-4.svg');
    mask-image: url('../../assets/brush-shapes/shape-4.svg');
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

/* Fallback for browsers without mask support */
@supports not (mask-image: url('#')) {
    .jaya-presenter-detail-cta::before {
        inset: 0;
        border-radius: 18px 30px 16px 26px;
    }
}

.jaya-presenter-detail-cta h3 {
    font-family: var(--font-script);
    font-weight: 700;
    color: #ffffff;
    font-size: 42px;
    line-height: 1.15;
    margin: 0 0 12px;
}

.jaya-presenter-detail-cta p {
    font-family: var(--font-body);
    font-size: 17px;
    color: rgba(255, 255, 255, 0.92);
    margin: 0 0 26px;
}

@media (max-width: 600px) {
    /* Horizontal inset used to stack up: Divi's 4% row gutter + this block's 6%
       + the CTA panel's own 56px = ~91px per side, which left the purple CTA a
       188px content column on a 390px screen. All three trimmed here, plus the
       section's 30/100px band, which read as dead space at this width. */
    body .et_pb_section:has(.jaya-presenter-detail) {
        padding-top: 8px;
        padding-bottom: 40px;
    }

    .jaya-presenter-detail {
        padding: 24px 5% 44px;
    }

    .jaya-presenter-detail-cta {
        padding: 46px 24px 52px;
    }

    .jaya-presenter-detail-head {
        flex-direction: column;
        text-align: center;
        gap: 22px;
        margin-bottom: 36px;
    }

    .jaya-presenter-detail-photo {
        width: 140px;
        height: 140px;
    }

    .jaya-presenter-detail-name {
        font-size: 42px;
    }

    .jaya-presenter-detail-h2 {
        font-size: 28px;
    }

    .jaya-presenter-detail-cta h3 {
        font-size: 32px;
    }

    .jaya-presenter-detail-cta::before {
        inset: 0;
        -webkit-mask-image: none;
        mask-image: none;
        border-radius: 18px 30px 16px 26px;
    }
}


/* ==== JAYA-WORKSHOP-MODAL START ==== */
body.jaya-wsm-open { overflow: hidden; }
.jaya-wsm-overlay {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 40px 16px;
    overflow-y: auto;
    background: rgba(67, 61, 83, 0.55);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}
.jaya-wsm-overlay[hidden] { display: none; }
.jaya-wsm-dialog {
    position: relative;
    width: 100%;
    max-width: 760px;
    margin: auto;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 24px 60px rgba(67, 61, 83, 0.35);
    padding: 34px 38px 40px;
}
.jaya-wsm-close {
    position: absolute;
    top: 14px;
    right: 16px;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 50%;
    background: #f2eef7;
    color: #66308c;
    font-size: 26px;
    line-height: 1;
    cursor: pointer;
    transition: background .2s, color .2s;
    z-index: 2;
}
.jaya-wsm-close:hover { background: #66308c; color: #fff; }
.jaya-wsm-head { margin: 0 44px 4px 0; }
.jaya-wsm-head:empty { display: none; }
.jaya-wsm-tag {
    display: inline-block;
    background: #b0d66e;
    color: #2f3b16;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .04em;
    text-transform: uppercase;
    padding: 4px 12px;
    border-radius: 999px;
}
.jaya-wsm-wtitle {
    font-family: var(--font-body);
    font-weight: 700;
    color: #433d53;
    font-size: 26px;
    line-height: 1.2;
    margin: 10px 0 0;
}
.jaya-wsm-body { font-family: var(--font-body); color: #433d53; }
.jaya-wsm-body img { max-width: 100%; height: auto; }
/* the pulled-in detail block styles itself; make it fill the modal */
.jaya-wsm-body .jaya-presenter-detail {
    max-width: none;
    margin: 0;
    padding: 0;
}
.jaya-wsm-spinner {
    width: 34px;
    height: 34px;
    margin: 46px auto;
    border: 3px solid #eadff5;
    border-top-color: #66308c;
    border-radius: 50%;
    animation: jaya-wsm-spin .8s linear infinite;
}
@keyframes jaya-wsm-spin { to { transform: rotate(360deg); } }
.jaya-wsm-empty {
    text-align: center;
    padding: 46px 0;
    color: #8a8396;
    font-family: var(--font-body);
}
@media (max-width: 767px) {
    .jaya-wsm-overlay { padding: 16px 8px; }
    .jaya-wsm-dialog { padding: 26px 18px 30px; border-radius: 14px; }
    .jaya-wsm-wtitle { font-size: 22px; }
    .jaya-wsm-head { margin-right: 40px; }
}
/* ==== JAYA-WORKSHOP-MODAL END ==== */

/* ---- Homepage: video-intro section (2026-07-23) ----
   Two-column section (copy left, YouTube right). The section/row/type scale
   follow the same conventions as .jaya-oneday-section: white background, 90%
   row capped at 1440px, h2 in Caveat purple with the green brush underline
   (.jaya-underline-green), body in Montserrat 16/1.8. Only the embed itself
   needs CSS: a responsive 16:9 frame with the site's card rounding/shadow,
   replacing the old fixed height="400". */
.jaya-videointro-section .jaya-video-embed {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 18px 40px rgba(67, 61, 83, 0.14);
    background: #000;
}
.jaya-videointro-section .jaya-video-embed iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}

/* The 60px Caveat heading is set on the module (desktop only), so step it down
   for narrower viewports the way the other sections' headings do. */
@media (max-width: 980px) {
    .jaya-videointro-section .et_pb_text_inner h2 {
        font-size: 46px !important;
    }
}
@media (max-width: 767px) {
    .jaya-videointro-section .et_pb_text_inner h2 {
        font-size: 38px !important;
    }
    .jaya-videointro-section .jaya-video-embed {
        border-radius: 12px;
        box-shadow: 0 10px 24px rgba(67, 61, 83, 0.12);
    }
    /* Text first, video under it — the row wraps at phone width. */
    .jaya-videointro-section .et_pb_column {
        margin-bottom: 24px;
    }
}


/* ---- Homepage: "Водещите на уъркшопите" carousel (2026-07-23) ----
   Mirrors the Водещите carousel (divi/group-carousel, 3/2/1 slides) but each
   slide is one linked card: circular photo + Caveat name + workshop title,
   linking to /workshops/#<slug> where the matching card carries that id.
   NOTE the photo treatment differs from Водещите on purpose — those lecturer
   JPEGs have the brush-stroke edge baked into the image file and there is no
   brush mask asset to reuse, so these use the site's other portrait style, the
   circular frame from the workshop cards (.jaya-presenter-photo). */
.jaya-wpresenter {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    text-decoration: none !important;
    padding: 8px 12px 4px;
}
.jaya-wpresenter-photo {
    display: block;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    overflow: hidden;
    background: #f5f1fb;
    border: 3px solid #ffffff;
    box-shadow: 0 6px 18px rgba(102, 48, 140, 0.12);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.jaya-wpresenter-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.jaya-wpresenter:hover .jaya-wpresenter-photo {
    transform: translateY(-3px);
    box-shadow: 0 12px 26px rgba(102, 48, 140, 0.20);
}
.jaya-wpresenter-name {
    display: block;
    margin-top: 14px;
    font-family: var(--font-script), 'Caveat', cursive;
    font-weight: 700;
    font-size: 26px;
    line-height: 1.2;
    color: var(--jaya-purple);
}
.jaya-wpresenter-title {
    display: block;
    margin-top: 4px;
    max-width: 260px;
    font-family: var(--font-body), 'Montserrat', sans-serif;
    font-size: 13px;
    line-height: 1.55;
    color: var(--jaya-text);
}
.jaya-wpresenter:hover .jaya-wpresenter-title {
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* Landing target on the workshops page: keep the card clear of the fixed
   header when arriving via /workshops/#<slug>, and flash it briefly so it is
   obvious which card was meant. */
.jaya-workshop-block[id] {
    scroll-margin-top: 120px;
}
.jaya-presenter-block:target {
    animation: jaya-card-flash 2.4s ease-out 1;
}
@keyframes jaya-card-flash {
    0%, 40% {
        box-shadow: 0 0 0 3px var(--jaya-green), 0 10px 30px rgba(102, 48, 140, 0.18);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(176, 214, 110, 0), 0 0 0 rgba(102, 48, 140, 0);
    }
}

@media (max-width: 767px) {
    .jaya-wpresenter-photo {
        width: 130px;
        height: 130px;
    }
    .jaya-wpresenter-name {
        font-size: 24px;
    }
    .jaya-workshop-block[id] {
        scroll-margin-top: 90px;
    }
}


/* ==== JAYA-PROGRAM-BUILDINGS START ==== */
.jaya-buildings{display:flex;flex-direction:column;gap:18px;}
.jaya-building-card{display:flex;align-items:flex-start;gap:16px;background:#fff;border:1px solid rgba(102,48,140,.10);border-radius:18px;padding:20px 22px;box-shadow:0 10px 30px rgba(102,48,140,.06);transition:box-shadow .2s ease,transform .2s ease,border-color .2s ease;outline:none;}
.jaya-building-card.is-active,.jaya-building-card:hover{border-color:rgba(176,214,110,.65);box-shadow:0 14px 34px rgba(102,48,140,.14);transform:translateY(-2px);}
.jaya-building-card:focus-visible{border-color:var(--jaya-purple);box-shadow:0 0 0 3px rgba(102,48,140,.25);}
.jaya-bmarker{flex:0 0 auto;display:inline-flex;line-height:0;}
.jaya-bmarker--card{width:48px;height:48px;}
.jaya-bmarker-svg{width:100%;height:100%;display:block;}
.jaya-building-body{flex:1 1 auto;min-width:0;}
.jaya-building-name{font-family:var(--font-body)!important;font-weight:700!important;font-size:20px!important;color:var(--jaya-purple)!important;margin:4px 0 10px!important;line-height:1.3em;}
.jaya-building-workshops{list-style:none!important;margin:0;padding:0!important;}
.jaya-building-workshops li{position:relative;list-style:none!important;padding-left:16px;margin:0 0 6px;font-family:var(--font-body);font-size:15px;line-height:1.5em;color:var(--jaya-text);background-image:url('../../assets/bullet.png');background-repeat:no-repeat;background-position:0 6px;background-size:8px auto;}
.jaya-building-workshops li:last-child{margin-bottom:0;}
.jaya-building-workshops li::before{content:none;}
.jaya-building-workshops:empty::before{content:'Работилниците ще бъдат обявени скоро.';display:block;font-family:var(--font-body);font-size:14px;color:var(--jaya-text);opacity:.5;font-style:italic;}
.jaya-map-panel .jaya-building-pin{width:48px;height:48px;background:none;border:none;padding:0;transition:transform .18s ease;}
.jaya-building-pin .jaya-bmarker-svg{filter:drop-shadow(0 3px 6px rgba(0,0,0,.32));}
.jaya-building-pin:hover{transform:translate(-50%,-50%) scale(1.12);}
.jaya-program-main-section .et_pb_row.jaya-program-row>.et_pb_column.jaya-program-map-col{margin-top:0 !important;}
@media (max-width:980px){
  .jaya-map-panel .jaya-building-pin{width:42px;height:42px;}
}
@media (max-width:767px){
  .jaya-map-zoom-target{width:auto;height:100%;}
  .jaya-map-panel .jaya-building-pin{width:40px;height:40px;}
  .jaya-buildings{gap:14px;}
  .jaya-building-card{padding:16px 16px;border-radius:14px;}
  .jaya-building-name{font-size:18px!important;}
}
/* ==== JAYA-PROGRAM-BUILDINGS END ==== */

/* ==== JAYA-KIDS-WORKSHOP START ==== */
.jaya-kidsws-section{background:#ffffff !important;}
.jaya-kidsws{position:relative;background:linear-gradient(180deg,#f2f7ec 0%,#fff 30%);border:1px solid #b0d66e;border-radius:24px;box-shadow:0 12px 34px rgba(67,61,83,.06);padding:46px 48px 44px;overflow:hidden;}
.jaya-kidsws-eyebrow{display:inline-block;font-family:var(--font-body);font-weight:700;font-size:12px;letter-spacing:2px;text-transform:uppercase;color:#ffffff;background:#b0d66e;padding:6px 14px;border-radius:999px;margin-bottom:16px;}
.jaya-kidsws-title{font-family:var(--font-body)!important;font-weight:800!important;text-transform:uppercase;font-size:30px!important;line-height:1.22em!important;color:var(--jaya-purple)!important;margin:0 0 12px!important;letter-spacing:.4px;}
.jaya-kidsws-subtitle{font-family:var(--font-script,'Caveat'),cursive;font-weight:700;font-size:34px;line-height:1.1em;color:var(--jaya-purple);margin:0 0 4px;}
.jaya-kidsws-subnote{font-family:var(--font-body);font-size:15px;font-style:italic;color:var(--jaya-text);opacity:.7;margin:0 0 8px;}
.jaya-kidsws-leads-heading{position:relative;font-family:var(--font-body)!important;font-weight:700!important;font-size:20px!important;color:var(--jaya-purple)!important;margin:26px 0 20px!important;padding-bottom:10px;}
.jaya-kidsws-leads-heading::after{content:'';position:absolute;left:0;bottom:0;width:52px;height:3px;border-radius:3px;background:var(--jaya-green);}
.jaya-kidsws-leads{display:grid;grid-template-columns:1fr 1fr;gap:26px;}
.jaya-kidsws-lead{display:flex;gap:18px;align-items:center;}
.jaya-kidsws-lead-photo{flex:0 0 auto;width:120px;height:120px;border-radius:50%;overflow:hidden;background:var(--jaya-bg-light);border:3px solid #ffffff;box-shadow:0 6px 18px rgba(102,48,140,.12);}
.jaya-kidsws-lead-photo img{display:block;width:100%;height:100%;object-fit:cover;}
.jaya-kidsws-lead-info{flex:1 1 auto;min-width:0;}
.jaya-kidsws-lead-name{font-family:var(--font-body)!important;font-weight:700!important;font-size:18px!important;color:var(--jaya-purple)!important;margin:0 0 6px!important;}
.jaya-kidsws-lead-role{font-family:var(--font-body);font-size:14px;line-height:1.5em;color:var(--jaya-text);margin:0 0 8px;}
.jaya-kidsws-lead-bio{font-family:var(--font-body);font-size:14px;line-height:1.6em;color:var(--jaya-text);opacity:.85;margin:0;}
.jaya-kidsws-text{margin-top:30px;}
.jaya-kidsws-text p{font-family:var(--font-body);font-size:16px;line-height:1.8em;color:var(--jaya-text);margin:0 0 16px;}
.jaya-kidsws-text p:last-child{margin-bottom:0;}
/* Share row, top-right of the card (the section has no presenter page of its
   own, so it shares the homepage anchor #kids-workshop). Sits on the eyebrow
   line; the card is already position:relative. */
.jaya-kidsws-share{position:absolute;top:42px;right:48px;z-index:2;}
@media (max-width:767px){
  /* No room beside the eyebrow pill at phone widths, so it drops to the foot
     of the card, centered — same place as on the workshop cards. */
  .jaya-kidsws-share{position:static;justify-content:center;margin-top:26px;}
  .jaya-kidsws{padding:32px 22px 30px;border-radius:18px;}
  .jaya-kidsws-title{font-size:23px!important;}
  .jaya-kidsws-subtitle{font-size:28px;}
  .jaya-kidsws-leads{grid-template-columns:1fr;gap:22px;}
  .jaya-kidsws-lead-photo{width:100px;height:100px;}
}
/* ==== JAYA-KIDS-WORKSHOP END ==== */

/* ==== JAYA-SOFIATECH START ==== */
/* Venue name in the date/location bars links out to Sofia Tech Park.
   Keep it looking exactly like the surrounding text, green on hover -
   same treatment as the footer contact links. */
.jaya-hero-meta-item a {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease;
}

.jaya-hero-meta-item a:hover,
.jaya-hero-meta-item a:focus-visible {
    color: var(--jaya-green);
}

/* Sofia Tech Park sponsor logo is square, while the logos beside it are wide.
   Cap its width so it reads at a comparable visual weight, and centre it. */
.jaya-sponsor-stp {
    max-width: 200px;
    margin-left: auto;
    margin-right: auto;
}

.jaya-sponsor-stp img {
    width: 100%;
    height: auto;
}
/* ==== JAYA-SOFIATECH END ==== */

/* ==== JAYA-SHARE START (2026-08-06) ====
   Social share row for the workshops. One component, two placements:
     .jaya-presenter-foot .jaya-share  — bottom right of every workshop card
                                         (.jaya-workshop-block), beside the
                                         "Прочети повече" button;
     .jaya-presenter-detail-share      — under the lecturer's <h1> on the
                                         presenter detail page, which is also
                                         what the workshop modal loads into
                                         .jaya-wsm-body.
   Each button shares that workshop's presenter-page URL. Icons are the brand
   marks inlined as mask-image data URIs, so the markup stays a bare <a> and
   the glyph just inherits `color` — no icon font, no extra request, and the
   ~7KB of path data lives here once instead of in 40 copies of the markup.
   Instagram has no web share intent, so that one is a <button> that copies the
   link to the clipboard instead (js/share.js). */
.jaya-share {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.jaya-share-label {
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 0.9px;
    text-transform: uppercase;
    color: #8a8396;
    margin-right: 2px;
}

.jaya-share-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background-color: #f4f0f9;
    color: var(--jaya-purple);
    cursor: pointer;
    text-decoration: none !important;
    -webkit-appearance: none;
    appearance: none;
    transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.jaya-share-btn::before {
    content: "";
    display: block;
    width: 16px;
    height: 16px;
    background-color: currentColor;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.jaya-share-btn:hover,
.jaya-share-btn:focus-visible {
    color: #ffffff;
    transform: translateY(-2px);
}

.jaya-share-btn.is-fb::before { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9.101 23.691v-7.98H6.627v-3.667h2.474v-1.58c0-4.085 1.848-5.978 5.858-5.978.401 0 .955.042 1.468.103a8.68 8.68 0 0 1 1.141.195v3.325a8.623 8.623 0 0 0-.653-.036 26.805 26.805 0 0 0-.733-.009c-.707 0-1.259.096-1.675.309a1.686 1.686 0 0 0-.679.622c-.258.42-.374.995-.374 1.752v1.297h3.919l-.386 2.103-.287 1.564h-3.246v8.245C19.396 23.238 24 18.179 24 12.044c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.628 3.874 10.35 9.101 11.647Z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9.101 23.691v-7.98H6.627v-3.667h2.474v-1.58c0-4.085 1.848-5.978 5.858-5.978.401 0 .955.042 1.468.103a8.68 8.68 0 0 1 1.141.195v3.325a8.623 8.623 0 0 0-.653-.036 26.805 26.805 0 0 0-.733-.009c-.707 0-1.259.096-1.675.309a1.686 1.686 0 0 0-.679.622c-.258.42-.374.995-.374 1.752v1.297h3.919l-.386 2.103-.287 1.564h-3.246v8.245C19.396 23.238 24 18.179 24 12.044c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.628 3.874 10.35 9.101 11.647Z'/%3E%3C/svg%3E"); }
.jaya-share-btn.is-ig::before { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7.0301.084c-1.2768.0602-2.1487.264-2.911.5634-.7888.3075-1.4575.72-2.1228 1.3877-.6652.6677-1.075 1.3368-1.3802 2.127-.2954.7638-.4956 1.6365-.552 2.914-.0564 1.2775-.0689 1.6882-.0626 4.947.0062 3.2586.0206 3.6671.0825 4.9473.061 1.2765.264 2.1482.5635 2.9107.308.7889.72 1.4573 1.388 2.1228.6679.6655 1.3365 1.0743 2.1285 1.38.7632.295 1.6361.4961 2.9134.552 1.2773.056 1.6884.069 4.9462.0627 3.2578-.0062 3.668-.0207 4.9478-.0814 1.28-.0607 2.147-.2652 2.9098-.5633.7889-.3086 1.4578-.72 2.1228-1.3881.665-.6682 1.0745-1.3378 1.3795-2.1284.2957-.7632.4966-1.636.552-2.9124.056-1.2809.0692-1.6898.063-4.948-.0063-3.2583-.021-3.6668-.0817-4.9465-.0607-1.2797-.264-2.1487-.5633-2.9117-.3084-.7889-.72-1.4568-1.3876-2.1228C21.2982 1.33 20.628.9208 19.8378.6165 19.074.321 18.2017.1197 16.9244.0645 15.6471.0093 15.236-.005 11.977.0014 8.718.0076 8.31.0215 7.0301.0839m.1402 21.6932c-1.17-.0509-1.8053-.2453-2.2287-.408-.5606-.216-.96-.4771-1.3819-.895-.422-.4178-.6811-.8186-.9-1.378-.1644-.4234-.3624-1.058-.4171-2.228-.0595-1.2645-.072-1.6442-.079-4.848-.007-3.2037.0053-3.583.0607-4.848.05-1.169.2456-1.805.408-2.2282.216-.5613.4762-.96.895-1.3816.4188-.4217.8184-.6814 1.3783-.9003.423-.1651 1.0575-.3614 2.227-.4171 1.2655-.06 1.6447-.072 4.848-.079 3.2033-.007 3.5835.005 4.8495.0608 1.169.0508 1.8053.2445 2.228.408.5608.216.96.4754 1.3816.895.4217.4194.6816.8176.9005 1.3787.1653.4217.3617 1.056.4169 2.2263.0602 1.2655.0739 1.645.0796 4.848.0058 3.203-.0055 3.5834-.061 4.848-.051 1.17-.245 1.8055-.408 2.2294-.216.5604-.4763.96-.8954 1.3814-.419.4215-.8181.6811-1.3783.9-.4224.1649-1.0577.3617-2.2262.4174-1.2656.0595-1.6448.072-4.8493.079-3.2045.007-3.5825-.006-4.848-.0608M16.953 5.5864A1.44 1.44 0 1 0 18.39 4.144a1.44 1.44 0 0 0-1.437 1.4424M5.8385 12.012c.0067 3.4032 2.7706 6.1557 6.173 6.1493 3.4026-.0065 6.157-2.7701 6.1506-6.1733-.0065-3.4032-2.771-6.1565-6.174-6.1498-3.403.0067-6.156 2.771-6.1496 6.1738M8 12.0077a4 4 0 1 1 4.008 3.9921A3.9996 3.9996 0 0 1 8 12.0077'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7.0301.084c-1.2768.0602-2.1487.264-2.911.5634-.7888.3075-1.4575.72-2.1228 1.3877-.6652.6677-1.075 1.3368-1.3802 2.127-.2954.7638-.4956 1.6365-.552 2.914-.0564 1.2775-.0689 1.6882-.0626 4.947.0062 3.2586.0206 3.6671.0825 4.9473.061 1.2765.264 2.1482.5635 2.9107.308.7889.72 1.4573 1.388 2.1228.6679.6655 1.3365 1.0743 2.1285 1.38.7632.295 1.6361.4961 2.9134.552 1.2773.056 1.6884.069 4.9462.0627 3.2578-.0062 3.668-.0207 4.9478-.0814 1.28-.0607 2.147-.2652 2.9098-.5633.7889-.3086 1.4578-.72 2.1228-1.3881.665-.6682 1.0745-1.3378 1.3795-2.1284.2957-.7632.4966-1.636.552-2.9124.056-1.2809.0692-1.6898.063-4.948-.0063-3.2583-.021-3.6668-.0817-4.9465-.0607-1.2797-.264-2.1487-.5633-2.9117-.3084-.7889-.72-1.4568-1.3876-2.1228C21.2982 1.33 20.628.9208 19.8378.6165 19.074.321 18.2017.1197 16.9244.0645 15.6471.0093 15.236-.005 11.977.0014 8.718.0076 8.31.0215 7.0301.0839m.1402 21.6932c-1.17-.0509-1.8053-.2453-2.2287-.408-.5606-.216-.96-.4771-1.3819-.895-.422-.4178-.6811-.8186-.9-1.378-.1644-.4234-.3624-1.058-.4171-2.228-.0595-1.2645-.072-1.6442-.079-4.848-.007-3.2037.0053-3.583.0607-4.848.05-1.169.2456-1.805.408-2.2282.216-.5613.4762-.96.895-1.3816.4188-.4217.8184-.6814 1.3783-.9003.423-.1651 1.0575-.3614 2.227-.4171 1.2655-.06 1.6447-.072 4.848-.079 3.2033-.007 3.5835.005 4.8495.0608 1.169.0508 1.8053.2445 2.228.408.5608.216.96.4754 1.3816.895.4217.4194.6816.8176.9005 1.3787.1653.4217.3617 1.056.4169 2.2263.0602 1.2655.0739 1.645.0796 4.848.0058 3.203-.0055 3.5834-.061 4.848-.051 1.17-.245 1.8055-.408 2.2294-.216.5604-.4763.96-.8954 1.3814-.419.4215-.8181.6811-1.3783.9-.4224.1649-1.0577.3617-2.2262.4174-1.2656.0595-1.6448.072-4.8493.079-3.2045.007-3.5825-.006-4.848-.0608M16.953 5.5864A1.44 1.44 0 1 0 18.39 4.144a1.44 1.44 0 0 0-1.437 1.4424M5.8385 12.012c.0067 3.4032 2.7706 6.1557 6.173 6.1493 3.4026-.0065 6.157-2.7701 6.1506-6.1733-.0065-3.4032-2.771-6.1565-6.174-6.1498-3.403.0067-6.156 2.771-6.1496 6.1738M8 12.0077a4 4 0 1 1 4.008 3.9921A3.9996 3.9996 0 0 1 8 12.0077'/%3E%3C/svg%3E"); }
.jaya-share-btn.is-in::before { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z'/%3E%3C/svg%3E"); }
.jaya-share-btn.is-vb::before { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11.4 0C9.473.028 5.333.344 3.02 2.467 1.302 4.187.696 6.7.633 9.817.57 12.933.488 18.776 6.12 20.36h.003l-.004 2.416s-.037.977.61 1.177c.777.242 1.234-.5 1.98-1.302.407-.44.972-1.084 1.397-1.58 3.85.326 6.812-.416 7.15-.525.776-.252 5.176-.816 5.892-6.657.74-6.02-.36-9.83-2.34-11.546-.596-.55-3.006-2.3-8.375-2.323 0 0-.395-.025-1.037-.017zm.058 1.693c.545-.004.88.017.88.017 4.542.02 6.717 1.388 7.222 1.846 1.675 1.435 2.53 4.868 1.906 9.897v.002c-.604 4.878-4.174 5.184-4.832 5.395-.28.09-2.882.737-6.153.524 0 0-2.436 2.94-3.197 3.704-.12.12-.26.167-.352.144-.13-.033-.166-.188-.165-.414l.02-4.018c-4.762-1.32-4.485-6.292-4.43-8.895.054-2.604.543-4.738 1.996-6.173 1.96-1.773 5.474-2.018 7.11-2.03zm.38 2.602c-.167 0-.303.135-.304.302 0 .167.133.303.3.305 1.624.01 2.946.537 4.028 1.592 1.073 1.046 1.62 2.468 1.633 4.334.002.167.14.3.307.3.166-.002.3-.138.3-.304-.014-1.984-.618-3.596-1.816-4.764-1.19-1.16-2.692-1.753-4.447-1.765zm-3.96.695c-.19-.032-.4.005-.616.117l-.01.002c-.43.247-.816.562-1.146.932-.002.004-.006.004-.008.008-.267.323-.42.638-.46.948-.008.046-.01.093-.007.14 0 .136.022.27.065.4l.013.01c.135.48.473 1.276 1.205 2.604.42.768.903 1.5 1.446 2.186.27.344.56.673.87.984l.132.132c.31.308.64.6.984.87.686.543 1.418 1.027 2.186 1.447 1.328.733 2.126 1.07 2.604 1.206l.01.014c.13.042.265.064.402.063.046.002.092 0 .138-.008.31-.036.627-.19.948-.46.004 0 .003-.002.008-.005.37-.33.683-.72.93-1.148l.003-.01c.225-.432.15-.842-.18-1.12-.004 0-.698-.58-1.037-.83-.36-.255-.73-.492-1.113-.71-.51-.285-1.032-.106-1.248.174l-.447.564c-.23.283-.657.246-.657.246-3.12-.796-3.955-3.955-3.955-3.955s-.037-.426.248-.656l.563-.448c.277-.215.456-.737.17-1.248-.217-.383-.454-.756-.71-1.115-.25-.34-.826-1.033-.83-1.035-.137-.165-.31-.265-.502-.297zm4.49.88c-.158.002-.29.124-.3.282-.01.167.115.312.282.324 1.16.085 2.017.466 2.645 1.15.63.688.93 1.524.906 2.57-.002.168.13.306.3.31.166.003.305-.13.31-.297.025-1.175-.334-2.193-1.067-2.994-.74-.81-1.777-1.253-3.05-1.346h-.024zm.463 1.63c-.16.002-.29.127-.3.287-.008.167.12.31.288.32.523.028.875.175 1.113.422.24.245.388.62.416 1.164.01.167.15.295.318.287.167-.008.295-.15.287-.317-.03-.644-.215-1.178-.58-1.557-.367-.378-.893-.574-1.52-.607h-.018z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11.4 0C9.473.028 5.333.344 3.02 2.467 1.302 4.187.696 6.7.633 9.817.57 12.933.488 18.776 6.12 20.36h.003l-.004 2.416s-.037.977.61 1.177c.777.242 1.234-.5 1.98-1.302.407-.44.972-1.084 1.397-1.58 3.85.326 6.812-.416 7.15-.525.776-.252 5.176-.816 5.892-6.657.74-6.02-.36-9.83-2.34-11.546-.596-.55-3.006-2.3-8.375-2.323 0 0-.395-.025-1.037-.017zm.058 1.693c.545-.004.88.017.88.017 4.542.02 6.717 1.388 7.222 1.846 1.675 1.435 2.53 4.868 1.906 9.897v.002c-.604 4.878-4.174 5.184-4.832 5.395-.28.09-2.882.737-6.153.524 0 0-2.436 2.94-3.197 3.704-.12.12-.26.167-.352.144-.13-.033-.166-.188-.165-.414l.02-4.018c-4.762-1.32-4.485-6.292-4.43-8.895.054-2.604.543-4.738 1.996-6.173 1.96-1.773 5.474-2.018 7.11-2.03zm.38 2.602c-.167 0-.303.135-.304.302 0 .167.133.303.3.305 1.624.01 2.946.537 4.028 1.592 1.073 1.046 1.62 2.468 1.633 4.334.002.167.14.3.307.3.166-.002.3-.138.3-.304-.014-1.984-.618-3.596-1.816-4.764-1.19-1.16-2.692-1.753-4.447-1.765zm-3.96.695c-.19-.032-.4.005-.616.117l-.01.002c-.43.247-.816.562-1.146.932-.002.004-.006.004-.008.008-.267.323-.42.638-.46.948-.008.046-.01.093-.007.14 0 .136.022.27.065.4l.013.01c.135.48.473 1.276 1.205 2.604.42.768.903 1.5 1.446 2.186.27.344.56.673.87.984l.132.132c.31.308.64.6.984.87.686.543 1.418 1.027 2.186 1.447 1.328.733 2.126 1.07 2.604 1.206l.01.014c.13.042.265.064.402.063.046.002.092 0 .138-.008.31-.036.627-.19.948-.46.004 0 .003-.002.008-.005.37-.33.683-.72.93-1.148l.003-.01c.225-.432.15-.842-.18-1.12-.004 0-.698-.58-1.037-.83-.36-.255-.73-.492-1.113-.71-.51-.285-1.032-.106-1.248.174l-.447.564c-.23.283-.657.246-.657.246-3.12-.796-3.955-3.955-3.955-3.955s-.037-.426.248-.656l.563-.448c.277-.215.456-.737.17-1.248-.217-.383-.454-.756-.71-1.115-.25-.34-.826-1.033-.83-1.035-.137-.165-.31-.265-.502-.297zm4.49.88c-.158.002-.29.124-.3.282-.01.167.115.312.282.324 1.16.085 2.017.466 2.645 1.15.63.688.93 1.524.906 2.57-.002.168.13.306.3.31.166.003.305-.13.31-.297.025-1.175-.334-2.193-1.067-2.994-.74-.81-1.777-1.253-3.05-1.346h-.024zm.463 1.63c-.16.002-.29.127-.3.287-.008.167.12.31.288.32.523.028.875.175 1.113.422.24.245.388.62.416 1.164.01.167.15.295.318.287.167-.008.295-.15.287-.317-.03-.644-.215-1.178-.58-1.557-.367-.378-.893-.574-1.52-.607h-.018z'/%3E%3C/svg%3E"); }
.jaya-share-btn.is-wa::before { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413Z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413Z'/%3E%3C/svg%3E"); }

.jaya-share-btn.is-fb:hover, .jaya-share-btn.is-fb:focus-visible { background-color: #1877f2; }
.jaya-share-btn.is-ig:hover, .jaya-share-btn.is-ig:focus-visible { background-color: #e4405f; }
.jaya-share-btn.is-in:hover, .jaya-share-btn.is-in:focus-visible { background-color: #0a66c2; }
.jaya-share-btn.is-vb:hover, .jaya-share-btn.is-vb:focus-visible { background-color: #7360f2; }
.jaya-share-btn.is-wa:hover, .jaya-share-btn.is-wa:focus-visible { background-color: #25d366; }

/* Confirmation flash on the Instagram/copy button — the click has no visible
   result otherwise. Text comes from the aria-live label next to it. */
.jaya-share-btn.is-copied,
.jaya-share-btn.is-copied:hover {
    background-color: var(--jaya-green);
    color: #2f3b16;
    transform: none;
}

.jaya-share-note {
    font-family: var(--font-body);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: #7db342;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.jaya-share-note.is-visible {
    opacity: 1;
}

/* --- Card placement -------------------------------------------------------
   Replaces the bare "Прочети повече" link at the end of .jaya-presenter-body:
   button stays left, share row is pushed to the right edge of the card. */
.jaya-presenter-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px 20px;
    flex-wrap: wrap;
}

.jaya-presenter-foot .jaya-share {
    margin-left: auto;
}

@media (max-width: 600px) {
    /* The whole card centers at this width, so the footer follows. */
    .jaya-presenter-foot {
        justify-content: center;
    }

    .jaya-presenter-foot .jaya-share {
        margin-left: 0;
        justify-content: center;
    }
}

/* --- Detail / modal placement --------------------------------------------- */
.jaya-presenter-detail-share {
    margin-top: 16px;
}

@media (max-width: 600px) {
    /* .jaya-presenter-detail-head goes column + centered here. */
    .jaya-presenter-detail-share {
        justify-content: center;
    }
}
/* --- Programme placement (Екстатични танци) ---------------------------
   The closing dance section on Програма (67) has no presenter page of its
   own, so its row shares the section anchor /programa/#ekstatichni-tanci.
   Sits directly under .jaya-dance-intro, above the Водещи lineup. */
.jaya-dance-share {
    justify-content: center;
    margin-top: 28px;
}

@media (max-width: 767px) {
    .jaya-dance-share {
        margin-top: 22px;
    }
}

/* ==== JAYA-SHARE END ==== */

/* ==== JAYA-DANCE START (2026-08-06, rev 3 — full-width highlight, white) ====
   Програма page (67), closing section: the evening ecstatic dance. Not a card —
   it spans the section's full width with hairline rules instead of a border, so
   it reads as a special event rather than one more workshop tile. Rev 2 gave the
   section a deep-purple band; reverted to the page's white on request, so the
   accents carry the emphasis instead of the background. Two brand splatters in
   opposite corners frame the section in place of any border. */
.jaya-dance-section {
    position: relative;
    overflow: hidden;
    /* Deep-link target for the homepage popup; clears the fixed header. */
    scroll-margin-top: 100px;
}

/* Brand splatter in the top-right corner — same graphic as the hero and the 404
   page. Sits outside the 1160px row on every breakpoint, so it never lands
   behind the bios; kept behind the row anyway. */
.jaya-dance-section::after {
    content: '';
    position: absolute;
    z-index: 0;
    top: 16px;
    right: 0;
    width: 260px;
    height: 195px;
    background: url('../../../wp-content/assets/v2/splatter-graphics-green.png') no-repeat center center;
    background-size: contain;
    opacity: 0.85;
    pointer-events: none;
}

/* Purple splatter answering it from the bottom-left corner. Anchored low so it
   mostly falls inside the section's 100px bottom padding, and clipped by the
   section's overflow where it runs past the edge. */
.jaya-dance-section::before {
    content: '';
    position: absolute;
    z-index: 0;
    bottom: -26px;
    left: -18px;
    width: 224px;
    height: 178px;
    background: url('../../../wp-content/assets/v2/splatter-graphics-purple.png') no-repeat center center;
    background-size: contain;
    opacity: 0.75;
    pointer-events: none;
}

.jaya-dance-section .et_pb_row {
    position: relative;
    z-index: 1;
}

.jaya-dance-section .jaya-dance-heading .et_pb_text_inner h2 {
    font-family: var(--font-script) !important;
    font-weight: 700 !important;
    color: var(--jaya-purple) !important;
    font-size: 68px !important;
    line-height: 1.05em !important;
    margin: 0 !important;
    background-size: 66% 16px;
}

.jaya-dance {
    text-align: center;
    margin-top: 18px;
}

/* Time chip — same pill language as the other .jaya-* eyebrows. */
.jaya-dance-time {
    display: inline-block;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 2.4px;
    text-transform: uppercase;
    color: #ffffff;
    background: var(--jaya-purple);
    padding: 8px 20px;
    border-radius: 999px;
    margin-bottom: 24px;
}

.jaya-dance-intro {
    font-family: var(--font-body);
    font-size: 20px;
    line-height: 1.75em;
    color: var(--jaya-text);
    max-width: 760px;
    margin: 0 auto;
}

.jaya-dance-lineup {
    margin-top: 58px;
    padding-top: 50px;
    border-top: 1px solid rgba(102, 48, 140, 0.14);
}

.jaya-dance-leads-heading {
    font-family: var(--font-body) !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    letter-spacing: 3px !important;
    text-transform: uppercase;
    color: #8a8396 !important;
    text-align: center;
    margin: 0 0 42px !important;
}

/* Two artists side by side, separated by a hairline instead of card borders. */
.jaya-dance-leads {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: start;
    text-align: left;
}

.jaya-dance-lead {
    padding: 0 42px;
    min-width: 0;
}

.jaya-dance-lead:first-child {
    padding-left: 0;
}

.jaya-dance-lead:last-child {
    padding-right: 0;
    border-left: 1px solid rgba(102, 48, 140, 0.14);
}

.jaya-dance-lead-head {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 22px;
}

.jaya-dance-lead-photo {
    flex: 0 0 auto;
    width: 116px;
    height: 116px;
    border-radius: 50%;
    overflow: hidden;
    background: var(--jaya-bg-light);
    box-shadow: 0 8px 22px rgba(102, 48, 140, 0.16);
}

.jaya-dance-lead-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.jaya-dance-lead-id {
    min-width: 0;
}

.jaya-dance-lead-name {
    font-family: var(--font-body) !important;
    font-weight: 700 !important;
    font-size: 22px !important;
    line-height: 1.25em !important;
    color: var(--jaya-purple) !important;
    margin: 0 0 7px !important;
}

.jaya-dance-lead-role {
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 11.5px;
    letter-spacing: 1.2px;
    line-height: 1.55em;
    text-transform: uppercase;
    color: #8a8396;
    margin: 0;
}

.jaya-dance-lead-bio {
    font-family: var(--font-body);
    font-size: 15px;
    line-height: 1.85em;
    color: var(--jaya-text);
    margin: 0;
}

/* Same pill as .jaya-presenter-readmore on the workshop cards. */
.jaya-dance-lead-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 20px;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.9px;
    color: var(--jaya-purple) !important;
    text-decoration: none !important;
    padding: 11px 24px;
    border: 2px solid var(--jaya-purple);
    border-radius: 30px;
    transition: background-color 0.25s ease, color 0.25s ease;
}

.jaya-dance-lead-link:hover {
    background: var(--jaya-purple);
    color: #ffffff !important;
}

/* Closing CTA for the whole programme — the page ends here, so it sends people
   to the ticket page. Reuses the shared green .jaya-ticket-btn pill. */
.jaya-dance-cta {
    margin-top: 56px;
    padding-top: 46px;
    border-top: 1px solid rgba(102, 48, 140, 0.14);
    text-align: center;
}

.jaya-dance-cta-text {
    font-family: var(--font-body);
    font-size: 18px;
    line-height: 1.7em;
    color: var(--jaya-text);
    max-width: 620px;
    margin: 0 auto 26px;
}

@media (max-width: 980px) {
    .jaya-dance-section .jaya-dance-heading .et_pb_text_inner h2 {
        font-size: 56px !important;
    }

    .jaya-dance-intro {
        font-size: 18px;
    }

    .jaya-dance-lead {
        padding: 0 26px;
    }

    .jaya-dance-lead-photo {
        width: 96px;
        height: 96px;
    }

    .jaya-dance-lead-name {
        font-size: 19px !important;
    }
}

@media (max-width: 767px) {
    .jaya-dance-section .jaya-dance-heading .et_pb_text_inner h2 {
        font-size: 44px !important;
        background-size: 78% 13px;
    }

    .jaya-dance-section::after {
        top: 8px;
        right: -14px;
        width: 150px;
        height: 112px;
        opacity: 0.7;
    }

    .jaya-dance-section::before {
        bottom: -18px;
        left: -22px;
        width: 132px;
        height: 105px;
        opacity: 0.6;
    }

    .jaya-dance {
        margin-top: 14px;
    }

    .jaya-dance-time {
        font-size: 11.5px;
        letter-spacing: 2px;
        padding: 7px 16px;
        margin-bottom: 18px;
    }

    .jaya-dance-intro {
        font-size: 16px;
        line-height: 1.7em;
    }

    .jaya-dance-lineup {
        margin-top: 40px;
        padding-top: 34px;
    }

    .jaya-dance-leads-heading {
        margin-bottom: 30px !important;
    }

    .jaya-dance-leads {
        grid-template-columns: 1fr;
    }

    .jaya-dance-lead {
        padding: 0 !important;
        border-left: 0 !important;
    }

    .jaya-dance-lead + .jaya-dance-lead {
        margin-top: 34px;
        padding-top: 32px !important;
        border-top: 1px solid rgba(102, 48, 140, 0.14);
    }

    .jaya-dance-lead-head {
        gap: 16px;
        margin-bottom: 18px;
    }

    .jaya-dance-lead-photo {
        width: 88px;
        height: 88px;
    }

    .jaya-dance-lead-name {
        font-size: 18px !important;
    }

    .jaya-dance-lead-bio {
        font-size: 14.5px;
    }

    .jaya-dance-cta {
        margin-top: 40px;
        padding-top: 34px;
    }

    .jaya-dance-cta-text {
        font-size: 15.5px;
        margin-bottom: 22px;
    }
}
/* ==== JAYA-DANCE END ==== */

/* ==== JAYA-DANCE-POPUP START (2026-08-06) ====
   Homepage teaser for the closing dance section of the Програма page. Markup,
   the 10s timer and the once-per-session rule live in the jaya-dance-popup.php
   sandbox plugin. Same overlay language as the workshop modal (.jaya-wsm-*),
   scaled down to a single centred card. */
body.jaya-dpop-open {
    overflow: hidden;
}

.jaya-dpop {
    position: fixed;
    inset: 0;
    z-index: 100001;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
}

.jaya-dpop[hidden] {
    display: none;
}

.jaya-dpop-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(67, 61, 83, 0.55);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}

.jaya-dpop-dialog {
    position: relative;
    width: 100%;
    max-width: 460px;
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    padding: 42px 36px 38px;
    background: #ffffff;
    border-radius: 22px;
    box-shadow: 0 24px 60px rgba(67, 61, 83, 0.35);
    text-align: center;
    animation: jaya-dpop-in 0.35s ease-out both;
}

@keyframes jaya-dpop-in {
    from { opacity: 0; transform: translateY(14px) scale(0.98); }
    to   { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    .jaya-dpop-dialog {
        animation: none;
    }
}

/* Same close affordance as .jaya-wsm-close on the workshop modal. */
.jaya-dpop-close {
    position: absolute;
    top: 12px;
    right: 14px;
    width: 38px;
    height: 38px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: #f2eef7;
    color: var(--jaya-purple);
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
}

.jaya-dpop-close:hover {
    background: var(--jaya-purple);
    color: #ffffff;
}

.jaya-dpop-eyebrow {
    display: inline-block;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 11.5px;
    letter-spacing: 2.2px;
    text-transform: uppercase;
    color: #ffffff;
    background: var(--jaya-purple);
    padding: 7px 17px;
    border-radius: 999px;
}

.jaya-dpop-title {
    font-family: var(--font-script) !important;
    font-weight: 700 !important;
    font-size: 44px !important;
    line-height: 1.05em !important;
    color: var(--jaya-purple) !important;
    margin: 16px 0 0 !important;
    padding: 0 !important;
}

/* The two leads, overlapped the way a line-up is usually shown. */
.jaya-dpop-photos {
    display: flex;
    justify-content: center;
    margin: 20px 0 18px;
}

.jaya-dpop-photos img {
    display: block;
    width: 78px;
    height: 78px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid #ffffff;
    box-shadow: 0 6px 16px rgba(102, 48, 140, 0.20);
}

.jaya-dpop-photos img + img {
    margin-left: -20px;
}

.jaya-dpop-text {
    font-family: var(--font-body);
    font-size: 15.5px;
    line-height: 1.75em;
    color: var(--jaya-text);
    margin: 0 0 26px;
}

/* Filled green pill, same primary CTA as .jaya-ticket-btn. */
.jaya-dpop-btn {
    display: inline-block;
    background: var(--jaya-green);
    color: #ffffff !important;
    padding: 14px 32px;
    border-radius: 30px;
    text-decoration: none !important;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 1px;
    box-shadow: 0 6px 14px rgba(176, 214, 110, 0.35);
    transition: all 0.25s ease;
}

.jaya-dpop-btn:hover {
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(176, 214, 110, 0.45);
}

@media (max-width: 767px) {
    .jaya-dpop-dialog {
        padding: 36px 22px 32px;
        border-radius: 18px;
    }

    .jaya-dpop-title {
        font-size: 36px !important;
    }

    .jaya-dpop-photos img {
        width: 68px;
        height: 68px;
    }

    .jaya-dpop-text {
        font-size: 15px;
    }
}
/* ==== JAYA-DANCE-POPUP END ==== */

/* ==== JAYA-SESSION-LINKS START (2026-08-06) ====
   "Виж повече" at the right end of the Сесия 1/2/3 card titles, on the homepage
   and in the Програма timeline, linking to the matching slot on the Workshops
   page (#sesiya-1..3). .jaya-card-inner is a flex column with
   align-items:flex-start, so the title row has to stretch itself to the card
   width before the link can sit at the far right. Only linked titles get the
   row treatment — every other card keeps the plain .jaya-title. */
.jaya-program-card .jaya-title-linked {
    align-self: stretch;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 2px 12px;
    padding-right: 0;
}

.jaya-program-card .jaya-card-link {
    margin-left: auto;
    display: inline-block;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 10.5px;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    white-space: nowrap;
    color: var(--jaya-purple) !important;
    text-decoration: underline !important;
    text-underline-offset: 3px;
    transition: opacity 0.2s ease;
}

.jaya-program-card .jaya-card-link:hover {
    opacity: 0.7;
}

/* Deep-link targets for those three links; clears the fixed header. */
.jaya-workshop-slot {
    scroll-margin-top: 100px;
}

@media (max-width: 980px) {
    .jaya-program-card .jaya-card-link {
        font-size: 10px;
        letter-spacing: 0.4px;
    }
}

@media (max-width: 767px) {
    .jaya-program-card .jaya-card-link {
        font-size: 10px;
    }
}
/* ==== JAYA-SESSION-LINKS END ==== */

/* ==== JAYA-PROGRAM-SWAP START ==== */
/* The building cards and the schedule cards traded places: the buildings now
   sit full width above the map, and the schedule runs down the narrow column
   beside the sticky map. Both keep their original card styling — only the
   layout of their new container changes. */

/* ---- Buildings: three across, full width, above the map ---- */
.jaya-program-cards-section .jaya-buildings {
    flex-direction: row;
    align-items: stretch;
    gap: 24px;
}

.jaya-program-cards-section .jaya-building-card {
    flex: 1 1 0;
    min-width: 0;
}

/* ---- Schedule: stacked in the 35% column next to the map ---- */
.jaya-program-timeline-col .jaya-program-card .jaya-card-inner {
    min-height: 0;
    padding: 18px 20px;
}

.jaya-program-timeline-col .jaya-program-card .et_pb_text_inner {
    margin-bottom: 16px;
}

.jaya-program-timeline-col .jaya-program-card:last-child .et_pb_text_inner {
    margin-bottom: 0;
}

@media (max-width: 980px) {
    .jaya-program-cards-section .jaya-buildings {
        gap: 16px;
    }

    .jaya-program-timeline-col .jaya-program-card .jaya-card-inner {
        padding: 15px 16px;
    }

    .jaya-program-timeline-col .jaya-program-card .jaya-card-inner::after {
        top: 16px;
        right: 16px;
        width: 22px;
        height: 22px;
    }

    .jaya-program-timeline-col .jaya-program-card .jaya-time {
        font-size: 22px;
    }

    .jaya-program-timeline-col .jaya-program-card .jaya-title {
        font-size: 13px;
        padding-right: 30px;
    }
}

@media (max-width: 767px) {
    .jaya-program-cards-section .jaya-buildings {
        flex-direction: column;
        gap: 14px;
    }

    .jaya-program-timeline-col .jaya-program-card .jaya-card-inner {
        padding: 18px;
    }
}
/* ==== JAYA-PROGRAM-SWAP END ==== */

/* ==== JAYA-LEGAL-STYLES START ==== */
.jaya-legal-content {
    max-width: 780px;
    margin: 0 auto;
    font-family: var(--font-body);
    color: var(--jaya-text);
    font-size: 16px;
    line-height: 1.75em;
}

.jaya-legal-content h2 {
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 24px;
    line-height: 1.3em;
    color: var(--jaya-purple);
    margin: 8px 0 16px;
}

.jaya-legal-content p {
    margin: 0 0 16px;
}

.jaya-legal-content ul {
    margin: 0 0 16px;
    padding-left: 22px;
}

.jaya-legal-content li {
    margin-bottom: 8px;
}

.jaya-legal-content strong {
    color: var(--jaya-text);
    font-weight: 700;
}

.jaya-legal-content a {
    color: var(--jaya-purple);
    text-decoration: underline;
}
/* ==== JAYA-LEGAL-STYLES END ==== */

/* ==== JAYA-PROGRAM-STACK START ==== */
/* 2026-09-15: the day schedule left the narrow sticky column. It is now a
   full-width grid row ABOVE the map, and the map lives in its own row below.
   No sticky / scroll-driven behaviour left on this page. The older
   .jaya-program-row two-column + sticky-map rules above are dormant — that
   class no longer exists in the DOM — and are kept only as history. */

.jaya-program-main-section .et_pb_row.jaya-program-timeline-row,
.jaya-program-main-section .et_pb_row.jaya-program-map-row {
    width: 90% !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

.jaya-program-main-section .et_pb_row.jaya-program-map-row {
    margin-top: 48px !important;
}

/* Schedule: one grid, three across. Workshop sessions will later span the full
   width of this grid (grid-column: 1 / -1), so the track count stays explicit
   rather than auto-fit. */
.jaya-program-main-section .et_pb_column.jaya-program-timeline-col {
    display: grid !important;
    /* beats Divi's scoped display:block */
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
}

.jaya-program-main-section .et_pb_column.jaya-program-map-col {
    width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    position: static !important;
    top: auto !important;
    margin-top: 0 !important;
}

/* Cards fill their grid cell; the grid gap owns the spacing, not module margin. */
.jaya-program-timeline-col .jaya-program-card,
.jaya-program-timeline-col .jaya-program-card .et_pb_text_inner {
    height: 100%;
    margin-bottom: 0 !important;
}

.jaya-program-timeline-col .jaya-program-card .jaya-card-inner {
    height: 100%;
    min-height: 140px;
    padding: 22px;
}

.jaya-program-map-wrap {
    padding-left: 0;
}

@media (max-width: 980px) {
    .jaya-program-main-section .et_pb_column.jaya-program-timeline-col {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }

    .jaya-program-main-section .et_pb_row.jaya-program-map-row {
        margin-top: 32px !important;
    }

    .jaya-program-timeline-col .jaya-program-card .jaya-card-inner {
        padding: 18px 20px;
    }
}

@media (max-width: 767px) {

    .jaya-program-main-section .et_pb_row.jaya-program-timeline-row,
    .jaya-program-main-section .et_pb_row.jaya-program-map-row {
        width: 100% !important;
        padding: 0 16px !important;
    }

    .jaya-program-main-section .et_pb_column.jaya-program-timeline-col {
        grid-template-columns: minmax(0, 1fr);
        gap: 14px;
    }

    .jaya-program-timeline-col .jaya-program-card .jaya-card-inner {
        min-height: 0;
        padding: 18px;
    }
}

/* ==== JAYA-PROGRAM-STACK END ==== */

/* ==== JAYA-PROGRAM-SESSIONS START ==== */
/* 2026-09-15, step 2: the three workshop slots are no longer plain schedule
   cards. Each is a full-width band inside the schedule grid — slot info on the
   left, a horizontal slider of that session's 9 workshops/lectures on the
   right, every card linking to the presenter's own page. Palette and card
   language are taken from .jaya-program-card[data-type="workshop"] and the
   .jaya-wpresenter carousel so the page still reads as one family. */

.jaya-program-timeline-col .jaya-session-band-module {
    grid-column: 1 / -1;
    margin-bottom: 0 !important;
}

.jaya-session-band {
    --cat-color: var(--slot-accent);
    --cat-bg: var(--slot-soft);
    --cat-tint: var(--slot-tint);
    display: flex;
    align-items: stretch;
    gap: 26px;
    padding: 22px;
    background: #ffffff;
    background-image: linear-gradient(180deg, var(--cat-tint) 0%, rgba(255, 255, 255, 0) 60%);
    border: 1px solid #ebe5f0;
    border-radius: 14px;
    box-shadow: 0 1px 2px rgba(67, 61, 83, 0.04);
}

/* ---- left: slot identity ---- */
.jaya-session-info {
    flex: 0 0 250px;
    max-width: 250px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.jaya-session-tag {
    display: inline-block;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 10px;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    color: var(--cat-color);
    background: var(--cat-bg);
    padding: 4px 10px;
    border-radius: 30px;
    margin-bottom: 12px;
    line-height: 1.2;
}

.jaya-session-time {
    font-family: var(--font-script);
    font-weight: 700;
    color: var(--jaya-purple);
    font-size: 26px;
    line-height: 1;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}

.jaya-session-title {
    font-family: var(--font-body) !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    line-height: 1.5em !important;
    letter-spacing: 0.6px;
    color: var(--jaya-text) !important;
    margin: 0 !important;
    padding: 0 !important;
}

.jaya-session-all {
    margin-top: 14px;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--jaya-purple);
    text-decoration: none !important;
    border-bottom: 1px solid rgba(102, 48, 140, 0.25);
    padding-bottom: 2px;
    transition: color 0.2s ease, border-color 0.2s ease;
}

.jaya-session-all::after {
    content: ' \2192';
}

.jaya-session-all:hover {
    color: var(--jaya-green);
    border-color: var(--jaya-green);
}

/* ---- right: the slider ---- */
.jaya-session-slider {
    position: relative;
    flex: 1 1 0;
    min-width: 0;
}

.jaya-session-track {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scroll-behavior: smooth;
    padding: 2px 2px 12px;
    scrollbar-width: thin;
    scrollbar-color: rgba(102, 48, 140, 0.35) transparent;
}

.jaya-session-track::-webkit-scrollbar {
    height: 6px;
}

.jaya-session-track::-webkit-scrollbar-thumb {
    background: rgba(102, 48, 140, 0.28);
    border-radius: 6px;
}

.jaya-session-track::-webkit-scrollbar-track {
    background: transparent;
}

.jaya-ws-card {
    flex: 0 0 172px;
    scroll-snap-align: start;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    text-decoration: none !important;
    background: #ffffff;
    border: 1px solid #ebe5f0;
    border-radius: 14px;
    padding: 14px 12px 16px;
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.jaya-ws-card:hover {
    transform: translateY(-3px);
    border-color: var(--cat-color);
    box-shadow: 0 10px 24px rgba(102, 48, 140, 0.12);
}

.jaya-ws-photo {
    display: block;
    width: 96px;
    height: 96px;
    border-radius: 50%;
    overflow: hidden;
    background: #f5f1fb;
    border: 3px solid #ffffff;
    box-shadow: 0 6px 18px rgba(102, 48, 140, 0.12);
}

.jaya-ws-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.jaya-ws-tag {
    display: inline-block;
    margin-top: 12px;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 9px;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--cat-color);
    background: var(--cat-bg);
    padding: 3px 9px;
    border-radius: 30px;
    line-height: 1.2;
}

/* Lectures keep the talk palette so the three lecturers read as a different
   kind of slot even inside a workshop session. */
.jaya-ws-card[data-type="lecture"] {
    --cat-color: #7db342;
    --cat-bg: #f1f7e8;
}

.jaya-ws-name {
    display: block;
    margin-top: 8px;
    font-family: var(--font-script);
    font-weight: 700;
    font-size: 20px;
    line-height: 1.15;
    color: var(--jaya-purple);
}

.jaya-ws-title {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 4px;
    font-family: var(--font-body);
    font-size: 12px;
    line-height: 1.45;
    color: var(--jaya-text);
}

.jaya-ws-card:hover .jaya-ws-title {
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* ---- arrows: only shown when the track actually overflows (JS adds the class) ---- */
.jaya-session-arrow {
    position: absolute;
    top: 62px;
    width: 34px;
    height: 34px;
    padding: 0;
    border-radius: 50%;
    border: 1px solid rgba(102, 48, 140, 0.18);
    background: rgba(255, 255, 255, 0.97);
    color: var(--jaya-purple);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    display: none;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(102, 48, 140, 0.14);
    z-index: 3;
    transition: background 0.2s ease, color 0.2s ease, opacity 0.2s ease;
}

.jaya-session-slider.is-scrollable .jaya-session-arrow {
    display: flex;
}

.jaya-session-arrow--prev {
    left: -14px;
}

.jaya-session-arrow--next {
    right: -14px;
}

.jaya-session-arrow:hover:not(:disabled) {
    background: var(--jaya-purple);
    color: #ffffff;
    border-color: var(--jaya-purple);
}

.jaya-session-arrow:disabled {
    opacity: 0.25;
    cursor: default;
}

@media (max-width: 980px) {
    .jaya-session-band {
        gap: 20px;
        padding: 18px;
    }

    .jaya-session-info {
        flex: 0 0 200px;
        max-width: 200px;
    }

    .jaya-session-time {
        font-size: 22px;
    }

    .jaya-session-title {
        font-size: 13px !important;
    }
}

@media (max-width: 767px) {
    .jaya-session-band {
        flex-direction: column;
        gap: 16px;
        padding: 18px;
    }

    .jaya-session-info {
        flex: 0 0 auto;
        max-width: 100%;
    }

    /* Arrows are pointless next to a native swipe; the track scrolls by touch. */
    .jaya-session-slider.is-scrollable .jaya-session-arrow {
        display: none;
    }

    .jaya-ws-card {
        flex: 0 0 152px;
    }

    .jaya-ws-photo {
        width: 84px;
        height: 84px;
    }

    .jaya-ws-name {
        font-size: 18px;
    }
}

/* ==== JAYA-PROGRAM-SESSIONS END ==== */

/* ==== JAYA-PROGRAM-MAPCOL START ==== */
/* 2026-09-15: the three building cards moved out of their own full-width
   section and into a left column beside the map. Instead of squeezing the
   cards into a fixed map ratio, the map panel now FILLS the row height
   (flex, no aspect-ratio) — so the two columns always end level whatever the
   card text says, and nothing can overflow. Desktop only; at <=980px the row
   wraps back to buildings-above-map. */

@media (min-width: 981px) {
    .jaya-program-main-section .et_pb_row.jaya-program-map-row {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        gap: 28px;
    }

    .jaya-program-main-section .et_pb_row.jaya-program-map-row>.et_pb_column.jaya-program-buildings-col {
        flex: 0 0 340px;
        width: 340px !important;
        max-width: 340px !important;
        min-width: 0;
        margin-right: 0 !important;
        /* line the cards up with the top of the map panel, under its heading */
        padding-top: 49px;
    }

    .jaya-program-main-section .et_pb_row.jaya-program-map-row>.et_pb_column.jaya-program-map-col {
        flex: 1 1 0;
        width: auto !important;
        max-width: none !important;
        min-width: 0;
        margin-right: 0 !important;
    }

    /* Divi's code module and its inner wrapper sit between the column and our
       markup, so the height chain has to pass through both of them. */
    .jaya-program-map-row>.et_pb_column>.et_pb_module,
    .jaya-program-map-row>.et_pb_column>.et_pb_module>.et_pb_code_inner {
        height: 100%;
    }

    /* Map fills whatever height the column has. */
    .jaya-program-map-row .jaya-program-map-wrap {
        display: flex;
        flex-direction: column;
        height: 100%;
    }

    .jaya-program-map-row .jaya-map-panel {
        flex: 1 1 auto;
        aspect-ratio: auto;
        min-height: 420px;
    }

    /* Three cards share the column height; they grow but never shrink below
       their own text, which is what keeps both columns level. */
    .jaya-program-buildings-col .jaya-buildings {
        height: 100%;
        gap: 14px;
    }

    .jaya-program-buildings-col .jaya-building-card {
        flex: 1 1 auto;
        align-items: center;
        gap: 12px;
        padding: 14px 16px;
        border-radius: 16px;
    }

    .jaya-program-buildings-col .jaya-bmarker--card {
        width: 40px;
        height: 40px;
    }

    .jaya-program-buildings-col .jaya-building-name {
        font-size: 17px !important;
        margin: 0 0 6px !important;
    }

    .jaya-program-buildings-col .jaya-building-workshops li {
        font-size: 13px;
        line-height: 1.45em;
        margin: 0 0 3px;
        padding-left: 15px;
        background-size: 7px auto;
        background-position: 0 5px;
    }

    .jaya-program-buildings-col .jaya-building-workshops:empty::before {
        font-size: 13px;
    }
}

/* Tablet and below: stacked again — buildings first, map underneath. */
@media (max-width: 980px) {
    .jaya-program-main-section .et_pb_row.jaya-program-map-row {
        flex-wrap: wrap !important;
    }

    .jaya-program-main-section .et_pb_row.jaya-program-map-row>.et_pb_column {
        flex: 1 1 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-right: 0 !important;
    }

    .jaya-program-buildings-col {
        margin-bottom: 28px;
    }
}

/* Tablet keeps the old three-across arrangement for the cards. */
@media (max-width: 980px) and (min-width: 768px) {
    .jaya-program-buildings-col .jaya-buildings {
        flex-direction: row;
        align-items: stretch;
        gap: 16px;
    }

    .jaya-program-buildings-col .jaya-building-card {
        flex: 1 1 0;
        min-width: 0;
    }
}

/* ==== JAYA-PROGRAM-MAPCOL END ==== */

/* ==== JAYA-PROGRAM-BUILDINGICONS START ==== */
/* 2026-09-15: the corner glyph on a schedule card now says WHERE the slot
   happens — the same numbered building marker used on the map pins and on the
   building cards — instead of a category doodle. The mapping lives in the
   markup as data-building on .jaya-card-inner / .jaya-session-band, taken from
   the building cards' own lists: 1 = Форум „Джон Атанасофф“, 2 = Лабораторен
   комплекс, 3 = Инкубатор. A slot with no building (the lunch break) simply
   has no data-building and keeps its category icon, which is why every rule
   here is keyed off the attribute and nothing else needed changing.
   The marker is the map SVG minus its tiny window rectangles — those are
   sub-pixel at 36px and only muddy the silhouette. */

.jaya-program-card .jaya-card-inner[data-building]::after,
.jaya-session-band[data-building] .jaya-session-info::after {
    content: '';
    position: absolute;
    width: 36px;
    height: 36px;
    opacity: 1;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    -webkit-mask-image: none;
    mask-image: none;
    filter: drop-shadow(0 2px 4px rgba(102, 48, 140, 0.16));
}

.jaya-program-card .jaya-card-inner[data-building]::after {
    top: 14px;
    right: 14px;
}

/* Keep the title clear of the marker (it is wider than the old 26px icon). */
.jaya-program-card .jaya-card-inner[data-building] .jaya-title {
    padding-right: 48px;
}

/* On a session band the marker belongs to the slot-info column, not the band's
   own top-right corner — that corner is over the slider track. */
.jaya-session-band[data-building] .jaya-session-info {
    position: relative;
    padding-right: 44px;
}

.jaya-session-band[data-building] .jaya-session-info::after {
    top: 0;
    right: 0;
}

/* ---- the three markers ---- */
.jaya-program-card .jaya-card-inner[data-building="1"]::after,
.jaya-session-band[data-building="1"] .jaya-session-info::after {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 44'><rect x='5' y='8' width='30' height='32' rx='8' fill='%2366308c'/><rect x='11' y='20' width='8' height='16' rx='1.2' fill='%23ffffff'/><rect x='20' y='15' width='9' height='21' rx='1.2' fill='%23ffffff'/><circle cx='34' cy='11' r='9.5' fill='%23b0d66e' stroke='%23ffffff' stroke-width='2'/><text x='34' y='15.4' text-anchor='middle' font-family='Montserrat,Helvetica,Arial,sans-serif' font-size='12.5' font-weight='800' fill='%23ffffff'>1</text></svg>");
}

.jaya-program-card .jaya-card-inner[data-building="2"]::after,
.jaya-session-band[data-building="2"] .jaya-session-info::after {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 44'><rect x='5' y='8' width='30' height='32' rx='8' fill='%2366308c'/><rect x='11' y='20' width='8' height='16' rx='1.2' fill='%23ffffff'/><rect x='20' y='15' width='9' height='21' rx='1.2' fill='%23ffffff'/><circle cx='34' cy='11' r='9.5' fill='%23b0d66e' stroke='%23ffffff' stroke-width='2'/><text x='34' y='15.4' text-anchor='middle' font-family='Montserrat,Helvetica,Arial,sans-serif' font-size='12.5' font-weight='800' fill='%23ffffff'>2</text></svg>");
}

.jaya-program-card .jaya-card-inner[data-building="3"]::after,
.jaya-session-band[data-building="3"] .jaya-session-info::after {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 44'><rect x='5' y='8' width='30' height='32' rx='8' fill='%2366308c'/><rect x='11' y='20' width='8' height='16' rx='1.2' fill='%23ffffff'/><rect x='20' y='15' width='9' height='21' rx='1.2' fill='%23ffffff'/><circle cx='34' cy='11' r='9.5' fill='%23b0d66e' stroke='%23ffffff' stroke-width='2'/><text x='34' y='15.4' text-anchor='middle' font-family='Montserrat,Helvetica,Arial,sans-serif' font-size='12.5' font-weight='800' fill='%23ffffff'>3</text></svg>");
}

/* 2026-09-21: the workshop & lecture sessions run in all three buildings, so
   those bands carry data-building="1 2 3" and show the three markers stacked
   in a column, 1 on top. The exact-value match keeps the single-marker rules
   above out of it; position, width and shadow still come from [data-building].
   Height = 3 markers + two 6px gaps. */
.jaya-session-band[data-building="1 2 3"] .jaya-session-info::after {
    height: 120px;
    background-image:
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 44'><rect x='5' y='8' width='30' height='32' rx='8' fill='%2366308c'/><rect x='11' y='20' width='8' height='16' rx='1.2' fill='%23ffffff'/><rect x='20' y='15' width='9' height='21' rx='1.2' fill='%23ffffff'/><circle cx='34' cy='11' r='9.5' fill='%23b0d66e' stroke='%23ffffff' stroke-width='2'/><text x='34' y='15.4' text-anchor='middle' font-family='Montserrat,Helvetica,Arial,sans-serif' font-size='12.5' font-weight='800' fill='%23ffffff'>1</text></svg>"),
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 44'><rect x='5' y='8' width='30' height='32' rx='8' fill='%2366308c'/><rect x='11' y='20' width='8' height='16' rx='1.2' fill='%23ffffff'/><rect x='20' y='15' width='9' height='21' rx='1.2' fill='%23ffffff'/><circle cx='34' cy='11' r='9.5' fill='%23b0d66e' stroke='%23ffffff' stroke-width='2'/><text x='34' y='15.4' text-anchor='middle' font-family='Montserrat,Helvetica,Arial,sans-serif' font-size='12.5' font-weight='800' fill='%23ffffff'>2</text></svg>"),
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 44'><rect x='5' y='8' width='30' height='32' rx='8' fill='%2366308c'/><rect x='11' y='20' width='8' height='16' rx='1.2' fill='%23ffffff'/><rect x='20' y='15' width='9' height='21' rx='1.2' fill='%23ffffff'/><circle cx='34' cy='11' r='9.5' fill='%23b0d66e' stroke='%23ffffff' stroke-width='2'/><text x='34' y='15.4' text-anchor='middle' font-family='Montserrat,Helvetica,Arial,sans-serif' font-size='12.5' font-weight='800' fill='%23ffffff'>3</text></svg>");
    background-position: center top, center center, center bottom;
    background-size: 36px 36px;
}

@media (max-width: 767px) {

    .jaya-program-card .jaya-card-inner[data-building]::after,
    .jaya-session-band[data-building] .jaya-session-info::after {
        width: 30px;
        height: 30px;
    }

    .jaya-program-card .jaya-card-inner[data-building] .jaya-title {
        padding-right: 40px;
    }

    /* 3 x 30px + two 5px gaps */
    .jaya-session-band[data-building="1 2 3"] .jaya-session-info::after {
        height: 100px;
        background-size: 30px 30px;
    }
}

/* ==== JAYA-PROGRAM-BUILDINGICONS END ==== */

/* ==== JAYA-WORKSHOP-SLOTS START ==== */
/* 2026-09-15: each time slot now announces itself — timeslot on the left, the
   group's name on the right, a rule stretching between them — and each group
   carries its own accent so the three sessions are told apart while scrolling.
   Group 1 keeps the brand purple, 2 is amber, 3 a muted blue of the same
   softness. The colour lives in per-slot custom properties, so every accent
   inside a slot (tag pill, card tint, hover border, bio label, button) follows
   from these two variables: --slot-accent for fills/borders/gradients and
   --slot-ink for anything that has to stay readable as text. */

.jaya-workshop-slot,
.jaya-session-band {
    --slot-accent: #8e57b2;
    --slot-ink: #66308c;
    --slot-soft: #f6f0fa;
    --slot-tint: rgba(142, 87, 178, 0.09);
    --slot-shadow: rgba(102, 48, 140, 0.12);
}

.jaya-workshop-slot#sesiya-2,
.jaya-session-band[data-session="2"] {
    --slot-accent: #e0902f;
    --slot-ink: #a75f0c;
    --slot-soft: #fdf2e4;
    --slot-tint: rgba(224, 144, 47, 0.12);
    --slot-shadow: rgba(167, 95, 12, 0.14);
}

.jaya-workshop-slot#sesiya-3,
.jaya-session-band[data-session="3"] {
    --slot-accent: #3a90ba;
    --slot-ink: #1f6383;
    --slot-soft: #eaf4f9;
    --slot-tint: rgba(58, 144, 186, 0.12);
    --slot-shadow: rgba(31, 99, 131, 0.14);
}

/* ---- heading: time | rule | group name ---- */
.jaya-workshop-slot-heading {
    gap: 20px;
    color: var(--slot-ink);
}

/* The old flanking rules are replaced by the single .jaya-slot-rule element. */
.jaya-workshop-slot-heading::before,
.jaya-workshop-slot-heading::after {
    content: none;
    display: none;
}

.jaya-slot-time {
    flex: 0 0 auto;
    font-family: var(--font-script);
    font-weight: 700;
    font-size: 40px;
    line-height: 1;
    color: var(--slot-ink);
}

.jaya-slot-rule {
    flex: 1 1 auto;
    min-width: 24px;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(90deg, transparent 0%, var(--slot-accent) 50%, transparent 100%);
    opacity: 0.5;
}

.jaya-slot-name {
    flex: 0 1 auto;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: 15px;
    line-height: 1.4;
    letter-spacing: 1.2px;
    text-align: right;
    color: var(--slot-ink);
}

/* ---- cards follow their slot's colour ---- */
.jaya-workshop-slot .jaya-workshop-block:not([data-type="lecture"]) {
    --cat-color: var(--slot-accent);
    --cat-bg: var(--slot-soft);
    --cat-tint: var(--slot-tint);
}

.jaya-workshop-slot .jaya-workshop-block:not([data-type="lecture"]):hover {
    box-shadow: 0 12px 30px var(--slot-shadow);
}

.jaya-workshop-slot .jaya-workshop-block:not([data-type="lecture"]) .jaya-workshop-tag {
    color: var(--slot-ink);
}

/* Lectures are deliberately EXCLUDED from the per-slot theming above: a
   Лекция card keeps the green it has always had, in every group, which
   is why every rule in this block is scoped away from that data-type. The
   green itself still comes from the original lecture rule further up this
   stylesheet — nothing here needs to restate it. */

.jaya-workshop-slot .jaya-workshop-block:not([data-type="lecture"]) .jaya-presenter-bio-label {
    color: var(--slot-ink);
}

.jaya-workshop-slot .jaya-workshop-block:not([data-type="lecture"]) .jaya-presenter-name:hover {
    color: var(--slot-ink);
}

.jaya-workshop-slot .jaya-workshop-block:not([data-type="lecture"]) .jaya-presenter-readmore {
    color: var(--slot-ink);
    border-color: var(--slot-ink);
}

.jaya-workshop-slot .jaya-workshop-block:not([data-type="lecture"]) .jaya-presenter-readmore:hover {
    background: var(--slot-ink);
    color: #ffffff;
}

@media (max-width: 980px) {
    .jaya-slot-time {
        font-size: 34px;
    }

    .jaya-slot-name {
        font-size: 14px;
    }
}

@media (max-width: 767px) {
    .jaya-workshop-slot-heading {
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
    }

    .jaya-slot-rule {
        display: none;
    }

    .jaya-slot-time {
        font-size: 28px;
    }

    .jaya-slot-name {
        flex: 1 1 100%;
        text-align: center;
        font-size: 13px;
        letter-spacing: 1px;
    }
}

@media (max-width: 600px) {
    .jaya-slot-time {
        font-size: 24px;
    }

    .jaya-slot-name {
        font-size: 12px;
    }
}

/* ==== JAYA-WORKSHOP-SLOTS END ==== */

/* ==== JAYA-PROGRAM-SESSION-COLORS START ==== */
/* A session band takes its group colour from the same --slot-* palette the
   /workshops slots use: JAYA-WORKSHOP-SLOTS now lists
   .jaya-session-band[data-session="N"] next to .jaya-workshop-slot#sesiya-N, so
   session 1 is purple, 2 amber and 3 blue on BOTH pages and the hex values live
   in exactly one place. Only the accents that were hard-coded purple need
   re-pointing here; the card tints and pills already run through --cat-*. */

.jaya-session-band .jaya-session-tag {
    color: var(--slot-ink);
}

.jaya-session-band .jaya-session-time {
    color: var(--slot-ink);
}

.jaya-session-band .jaya-ws-name {
    color: var(--slot-ink);
}

.jaya-session-band .jaya-ws-card:hover {
    box-shadow: 0 10px 24px var(--slot-shadow);
}

.jaya-session-band .jaya-session-all {
    color: var(--slot-ink);
    border-bottom-color: var(--slot-accent);
}

/* Restated because the rule above would otherwise outrank the original hover
   (same specificity, later in the file) and freeze the link on its base colour. */
.jaya-session-band .jaya-session-all:hover {
    color: var(--jaya-green);
    border-bottom-color: var(--jaya-green);
}

/* ==== JAYA-PROGRAM-SESSION-COLORS END ==== */

/* ==== JAYA-SESSION-DRAG START ==== */
/* Click-and-drag scrolling for the session sliders on a desktop pointer.
   Touch devices already scroll the track natively, so the grab cursor is
   gated behind a fine pointer. While dragging we turn OFF smooth scrolling
   and snapping — both fight a pointer that is setting scrollLeft directly. */

@media (hover: hover) and (pointer: fine) {
    .jaya-session-track {
        cursor: grab;
    }

    .jaya-session-track.is-dragging,
    .jaya-session-track.is-dragging .jaya-ws-card {
        cursor: grabbing;
    }
}

.jaya-session-track.is-dragging {
    scroll-behavior: auto;
    scroll-snap-type: none;
    -webkit-user-select: none;
    user-select: none;
}

/* ==== JAYA-SESSION-DRAG END ==== */