.pk_footer,
.pk-site-footer__card > .uk-tile {
    background: url("../images/white-pattern.png") repeat;
}

@font-face {
    font-family: 'Noveau';
    src: url('.../fonts/Noveau.eot');
    src: url('../fonts/Noveau.eot') format('embedded-opentype'),
         url('../fonts/Noveau.woff2') format('woff2'),
         url('../fonts/Noveau.woff') format('woff'),
         url('../fonts/Noveau.ttf') format('truetype'),
         url('../fonts/Noveau.svg#Noveau') format('svg');
}


.pk-title span:nth-child(odd) {
    margin-left: 50px;
}

.pk-title span:nth-child(odd):nth-child(3n+3) {
    margin-left: 90px;
}
.pk-title {
    font-size: 6.8vw;
    font-size: clamp(40px, 5vw, 80px);
    line-height: 1;
    text-transform: uppercase;
}
.pk-title span {
    display: block;
}


/* About page: stair image sits over the top-right corner of the cafe image below it.
   -61% of the column width is half the image height (1046 x 1280). .uk-margin is needed to beat
   YOOtheme's last-child margin reset in builder columns. */
@media (min-width: 960px) {
    .pk-about-overlap.uk-margin {
        position: relative;
        z-index: 1;
        margin-bottom: -61%;
    }
}

/* About page team heading: one line on desktop, smaller than the stepped section titles. */
.pk-team__title {
    font-size: clamp(30px, 3vw, 44px);
}

/* About page team cards: role colour matches each portrait's background. */
.pk-team__role--blue { color: #034772; }
.pk-team__role--green { color: #0b5a3a; }
.pk-team__role--magenta { color: #921948; }
.pk-team__role--ochre { color: #b97918; }

/* Donate page: faint line-art beside the lead text, over the usual paper texture. */
.pk-donate-motif {
    background-image: url(../images/Intro.svg), url(../images/white-pattern.png);
    background-size: 200px, 120px;
    background-position: 42% 38%, 0 0;
    background-repeat: no-repeat, repeat;
}

/* Donate page: the dancer reaches past its column and sits over the stage image's left edge. */
@media (min-width: 960px) {
    .pk-donate-overlap {
        position: relative;
        z-index: 1;
        margin-right: -16%;
    }

    /* Text beside the dancer clears the overlap (same 16%) plus a gap. */
    .pk-donate-aside {
        padding-left: calc(16% + 60px);
    }
}

.home-multi-bg {
    background-image: url(../images/intro.svg), url(../images/Moments.svg), url(../images/white-pattern.png);
    background-size: 200px, 200px, 120px;
    background-position: 100% 39%, 0 53%, 0 20%;
    background-repeat: no-repeat, no-repeat, repeat;
}
/* -------------------------------------------------------------------------
   Contact page — Event Enquiries form ([licchavi_enquiry], licchavi-core plugin)
   ------------------------------------------------------------------------- */
.licchavi-contact {
    --licchavi-contact-accent: #6b1c2a;
    --licchavi-contact-ink: #2a2a2a;
    --licchavi-contact-muted: #8a8a8a;
    --licchavi-contact-line: rgba(42, 42, 42, 0.25);
    color: var(--licchavi-contact-ink);
}

.licchavi-contact__hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.licchavi-contact__form {
    border-top: 1px solid var(--licchavi-contact-line);
}

.licchavi-contact__field {
    position: relative;
    border-bottom: 1px solid var(--licchavi-contact-line);
}

.licchavi-contact__names > * {
    border-bottom: 1px solid var(--licchavi-contact-line);
}

.licchavi-contact__names .licchavi-contact__field {
    border-bottom: 0;
}

@media (min-width: 960px) {
    .licchavi-contact__names > *:not(:last-child) {
        border-right: 1px solid var(--licchavi-contact-line);
    }
}

.licchavi-contact__form .uk-input,
.licchavi-contact__form .uk-select:not([multiple]):not([size]),
.licchavi-contact__form .uk-textarea {
    height: auto;
    padding: 1.1rem 1rem;
    background: transparent;
    color: var(--licchavi-contact-ink);
    font-size: 0.8rem;
    letter-spacing: 0.06em;
}

.licchavi-contact__form .uk-textarea {
    min-height: 9rem;
    resize: vertical;
}

.licchavi-contact__form .uk-input::placeholder,
.licchavi-contact__form .uk-textarea::placeholder {
    color: var(--licchavi-contact-muted);
    text-transform: uppercase;
    opacity: 1;
}

.licchavi-contact__form .uk-input:focus,
.licchavi-contact__form .uk-select:focus,
.licchavi-contact__form .uk-textarea:focus {
    background: rgba(107, 28, 42, 0.04);
    color: var(--licchavi-contact-ink);
}

/* Selects can't have placeholders, so a floating label stands in until a value is chosen. */
.licchavi-contact__field--select .uk-select:not([multiple]):not([size]) {
    padding-right: 2.5rem;
    cursor: pointer;
    background-image: none;
    -webkit-appearance: none;
    appearance: none;
}

.licchavi-contact__field--select::after {
    content: "";
    position: absolute;
    right: 1.1rem;
    top: 50%;
    width: 7px;
    height: 7px;
    border-right: 1.5px solid var(--licchavi-contact-ink);
    border-bottom: 1.5px solid var(--licchavi-contact-ink);
    transform: translateY(-70%) rotate(45deg);
    pointer-events: none;
}

.licchavi-contact__select-label {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--licchavi-contact-muted);
    font-size: 0.8rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    pointer-events: none;
}

.licchavi-contact__field--select.has-value .licchavi-contact__select-label {
    display: none;
}

.licchavi-contact__field--select.is-empty .uk-select {
    color: transparent;
}

.licchavi-contact__field--select.has-value .uk-select,
.licchavi-contact__field--select .uk-select.has-value {
    color: var(--licchavi-contact-ink);
}

.licchavi-contact__field--select .uk-select option {
    color: var(--licchavi-contact-ink);
    background: #ffffff;
}

.licchavi-contact__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1.75rem;
}

.licchavi-contact__submit {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    background: var(--licchavi-contact-accent);
    color: #ffffff;
    letter-spacing: 0.08em;
}

.licchavi-contact__submit:hover,
.licchavi-contact__submit:focus {
    background: #561622;
    color: #ffffff;
}

.licchavi-contact__required {
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--licchavi-contact-muted);
}

.licchavi-contact__form input[type="number"]::-webkit-outer-spin-button,
.licchavi-contact__form input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.licchavi-contact__form input[type="number"] {
    -moz-appearance: textfield;
    appearance: textfield;
}

/* -------------------------------------------------------------------------
   Events page — [cnc_events] listing (cnc-events plugin)
   ------------------------------------------------------------------------- */
.cnc-events {
    --cnc-events-row-gap: 64px;
}

/* Filter tabs: underline grows from the centre on the active tab, short preview on hover. */
.cnc-events__tabs > * > a {
    position: relative;
    padding: 0 0.75rem 0.2rem;
    color: #8a8a8a;
    transition: color 0.3s ease;
}

.cnc-events__tabs > * > a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    background: #7f0f15;
    transform: scaleX(0);
    transition: transform 0.4s cubic-bezier(0.65, 0, 0.35, 1);
}

.cnc-events__tabs > * > a:hover,
.cnc-events__tabs > * > a:focus-visible {
    color: #7f0f15;
}

.cnc-events__tabs > * > a:hover::after,
.cnc-events__tabs > * > a:focus-visible::after {
    transform: scaleX(0.35);
}

.cnc-events__tabs > .uk-active > a {
    color: #7f0f15;
}

.cnc-events__tabs > .uk-active > a::after {
    transform: scaleX(1);
}

@media (prefers-reduced-motion: reduce) {
    .cnc-events__tabs > * > a,
    .cnc-events__tabs > * > a::after {
        transition: none;
    }
}

/* 64px above and below each uk-list-divider line; UIkit's spacing scale has no 64px step. */
.uk-list-divider > .cnc-events__item:not(:last-child) {
    padding-bottom: var(--cnc-events-row-gap);
}

.uk-list-divider > .cnc-events__item:nth-child(n+2) {
    margin-top: 0;
    padding-top: var(--cnc-events-row-gap);
}

/* Layout, colour, size and weight come from UIkit classes in the markup; only gaps and line-height are custom. */
.cnc-events__dates {
    gap: 0.75rem;
}

@media (min-width: 960px) {
    .cnc-events__dates {
        gap: 1rem;
        width: 5.5rem;
    }
}

.cnc-events__date {
    gap: 0.75rem;
}

.cnc-events__month,
.cnc-events__day,
.cnc-events__dash {
    line-height: 1;
}

.cnc-events__day {
    font-variant-numeric: tabular-nums;
}

/* Month and category label; UIkit has no 16px text size. */
.cnc-events__label {
    font-size: 16px;
}

/* Time and price */
.cnc-events__meta-item {
    color: #c52e5d;
}

/* Event description; UIkit has no 18px text size. */
.cnc-events__intro {
    font-size: 18px;
}

/* Typography comes from uk-label; only the pill shape and status colours are custom. */
.cnc-events__badge {
    border-radius: 999px;
}

.cnc-events__badge--upcoming {
    background: #e8b33a;
}

.cnc-events__badge--ongoing {
    background: #3f8f5a;
}

.cnc-events__badge--concluded {
    background: #3a0308;
}

.cnc-events__badge--cancelled {
    background: #7f0f15;
}

/* Width and object-fit come from uk-width-1-1 / uk-object-cover; the fixed ratio keeps every card's thumbnail the same size. */
.cnc-events__image {
    height: auto;
    aspect-ratio: 4 / 3;
}

@media (max-width: 959px) {
    .cnc-events__image {
        aspect-ratio: 16 / 9;
    }
}

.cnc-events__item[data-status="cancelled"] h3,
.cnc-events__item[data-status="concluded"] .cnc-events__image {
    opacity: 0.75;
}

/* -------------------------------------------------------------------------
   Offcanvas menu — YOOtheme dialog "Modal Top" (#tm-dialog / #tm-dialog-mobile)
   ------------------------------------------------------------------------- */
:root {
    --lh-menu-accent: #6b1c2a;
    --lh-menu-ink: #1f1f1f;
    --lh-menu-muted: #8a8a8a;
    --lh-menu-ease: cubic-bezier(0.77, 0, 0.18, 1);
    --lh-menu-duration: 0.8s;
    --lh-menu-width: clamp(420px, 34vw, 580px);
    --lh-menu-gutter: clamp(28px, 3.5vw, 56px);
}

/* Header toggle: "MENU" + three thin lines */
.tm-header .uk-navbar-toggle,
.tm-header-mobile .uk-navbar-toggle {
    gap: 14px;
    color: var(--lh-menu-accent);
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.tm-header .uk-navbar-toggle > span,
.tm-header-mobile .uk-navbar-toggle > span {
    margin-right: 0 !important;
    line-height: 1;
}

.tm-header .uk-navbar-toggle [uk-navbar-toggle-icon],
.tm-header-mobile .uk-navbar-toggle [uk-navbar-toggle-icon] {
    width: 24px;
    height: 13px;
    background:
        linear-gradient(currentColor, currentColor) right top / 100% 1px no-repeat,
        linear-gradient(currentColor, currentColor) right center / 100% 1px no-repeat,
        linear-gradient(currentColor, currentColor) right bottom / 100% 1px no-repeat;
    transition: background-size 0.3s ease;
}

.tm-header .uk-navbar-toggle [uk-navbar-toggle-icon] svg,
.tm-header-mobile .uk-navbar-toggle [uk-navbar-toggle-icon] svg {
    display: none;
}

.tm-header .uk-navbar-toggle:hover [uk-navbar-toggle-icon],
.tm-header-mobile .uk-navbar-toggle:hover [uk-navbar-toggle-icon] {
    background-size: 100% 1px, 60% 1px, 100% 1px;
}

.tm-header .uk-navbar-toggle:hover,
.tm-header-mobile .uk-navbar-toggle:hover {
    color: var(--lh-menu-accent);
}

.uk-light .uk-navbar-toggle,
.uk-light .uk-navbar-toggle:hover {
    color: #fff;
}

/* Right-hand panel slides down from the top over a dimmed page.
   UIkit times open/close from the .uk-modal-dialog transition. */
#tm-dialog.uk-modal,
#tm-dialog-mobile.uk-modal {
    padding: 0;
    background: rgba(0, 0, 0, 0);
    opacity: 1;
    overflow-x: hidden;
    overscroll-behavior: contain;
    scrollbar-width: none;
    transition: background-color var(--lh-menu-duration) ease;
}

/* Hidden scrollbar: the reveal animations briefly overflow and would toggle it, shifting the layout */
#tm-dialog.uk-modal::-webkit-scrollbar,
#tm-dialog-mobile.uk-modal::-webkit-scrollbar {
    display: none;
}

#tm-dialog.uk-modal.uk-open,
#tm-dialog-mobile.uk-modal.uk-open {
    background: rgba(0, 0, 0, 0.45);
}

#tm-dialog .uk-modal-dialog,
#tm-dialog-mobile .uk-modal-dialog {
    position: relative;
    width: var(--lh-menu-width);
    max-width: 100%;
    min-height: 100vh;
    min-height: 100dvh;
    margin-left: auto;
    overflow: hidden;
    overflow: clip;
    background: #eeeeec url("../images/white-pattern.png") repeat;
    opacity: 1;
    transform: translateY(-100%);
    transition: transform var(--lh-menu-duration) var(--lh-menu-ease);
    will-change: transform;
}

#tm-dialog.uk-open .uk-modal-dialog,
#tm-dialog-mobile.uk-open .uk-modal-dialog {
    transform: translateY(0);
}

/* Animals strip */
#tm-dialog .uk-modal-dialog::after,
#tm-dialog-mobile .uk-modal-dialog::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    aspect-ratio: 683 / 135;
    background: url("../images/menu-animals.png") no-repeat center bottom / 100% auto;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0s linear var(--lh-menu-duration), transform 0s linear var(--lh-menu-duration);
    pointer-events: none;
}

#tm-dialog.uk-open .uk-modal-dialog::after,
#tm-dialog-mobile.uk-open .uk-modal-dialog::after {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.5s ease, transform 0.5s ease;
    transition-delay: calc(var(--lh-menu-duration) * 0.6);
}

/* Content area */
#tm-dialog .uk-modal-body,
#tm-dialog-mobile .uk-modal-body {
    box-sizing: border-box;
    width: 100%;
    padding: 36px var(--lh-menu-gutter) calc(var(--lh-menu-width) * 0.2 + 40px);
    background: transparent;
}

#tm-dialog .tm-height-expand,
#tm-dialog-mobile .uk-margin-auto-bottom,
#tm-dialog .widget_builderwidget,
#tm-dialog-mobile .widget_builderwidget {
    display: flex;
    flex: 1;
    flex-direction: column;
    margin-bottom: 0;
}

#tm-dialog .lh-dialog-nav,
#tm-dialog-mobile .lh-dialog-nav {
    margin-top: auto;
    margin-bottom: auto;
    margin-left: -24px;
    padding-top: 40px;
    align-items: flex-start;
}

#tm-dialog .lh-dialog-nav > *,
#tm-dialog-mobile .lh-dialog-nav > * {
    padding-left: 24px;
}

/* Close: thin line top-right */
#tm-dialog .uk-modal-close-full,
#tm-dialog-mobile .uk-modal-close-full,
#tm-dialog-mobile .uk-modal-close-default {
    position: absolute;
    top: 36px;
    right: var(--lh-menu-gutter);
    z-index: 1;
    width: 36px;
    height: 20px;
    padding: 0;
    background: transparent;
    color: var(--lh-menu-ink);
}

#tm-dialog .uk-modal-close-full svg,
#tm-dialog-mobile .uk-modal-close-full svg,
#tm-dialog-mobile .uk-modal-close-default svg {
    display: none;
}

#tm-dialog .uk-modal-close-full::before,
#tm-dialog-mobile .uk-modal-close-full::before,
#tm-dialog-mobile .uk-modal-close-default::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 4px;
    right: 4px;
    height: 1px;
    background: currentColor;
    transition: transform 0.3s ease;
}

#tm-dialog .uk-modal-close-full:hover,
#tm-dialog-mobile .uk-modal-close-full:hover,
#tm-dialog-mobile .uk-modal-close-default:hover {
    color: var(--lh-menu-accent);
}

#tm-dialog .uk-modal-close-full:hover::before,
#tm-dialog-mobile .uk-modal-close-full:hover::before,
#tm-dialog-mobile .uk-modal-close-default:hover::before {
    transform: scaleX(0.7);
}

/* Menus */
.lh-menu-primary .uk-nav > li > a {
    padding: 0.2em 0;
    color: var(--lh-menu-accent);
    font-family: "Noveau", Georgia, "Times New Roman", serif;
    font-size: 40px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    transition: color 0.25s ease, transform 0.25s ease;
}

.lh-menu-secondary .uk-nav > li > a {
    padding: 0.5em 0;
    color: var(--lh-menu-ink);
    font-size: 22px;
    line-height: 1.1;
    transition: color 0.25s ease, transform 0.25s ease;
}

.lh-menu-primary .uk-nav > li > a:hover,
.lh-menu-secondary .uk-nav > li > a:hover {
    transform: translateX(6px);
}

.lh-menu-primary .uk-nav > li > a:hover,
.lh-menu-primary .uk-nav > li.uk-active > a {
    color: var(--lh-menu-ink);
}

.lh-menu-secondary .uk-nav > li > a:hover,
.lh-menu-secondary .uk-nav > li.uk-active > a {
    color: var(--lh-menu-accent);
}

.lh-menu-social .el-link {
    color: var(--lh-menu-accent);
}

.lh-menu-social .el-link:hover {
    color: var(--lh-menu-ink);
}

/* Staggered reveal after the panel lands. Closing resets only once the panel has left:
   transitionend bubbles to .uk-modal-dialog and UIkit would otherwise hide the modal mid-slide. */
:is(#tm-dialog, #tm-dialog-mobile) :is(.lh-lang, .lh-menu-primary li, .lh-menu-secondary li, .lh-menu-social) {
    opacity: 0;
    transform: translateY(-12px);
    transition: opacity 0s linear var(--lh-menu-duration), transform 0s linear var(--lh-menu-duration);
}

:is(#tm-dialog, #tm-dialog-mobile).uk-open :is(.lh-lang, .lh-menu-primary li, .lh-menu-secondary li, .lh-menu-social) {
    opacity: 1;
    transform: none;
    transition: opacity 0.4s ease, transform 0.4s ease;
    transition-delay: calc(var(--lh-menu-duration) * 0.55 + var(--lh-i, 0) * 0.06s);
}

:is(#tm-dialog, #tm-dialog-mobile) :is(.lh-menu-primary, .lh-menu-secondary) li:nth-child(2) { --lh-i: 1; }
:is(#tm-dialog, #tm-dialog-mobile) :is(.lh-menu-primary, .lh-menu-secondary) li:nth-child(3) { --lh-i: 2; }
:is(#tm-dialog, #tm-dialog-mobile) :is(.lh-menu-primary, .lh-menu-secondary) li:nth-child(4) { --lh-i: 3; }
:is(#tm-dialog, #tm-dialog-mobile) :is(.lh-menu-primary, .lh-menu-secondary) li:nth-child(n+5) { --lh-i: 4; }
:is(#tm-dialog, #tm-dialog-mobile) .lh-menu-social { --lh-i: 5; }

@media (max-width: 639px) {
    :root {
        --lh-menu-width: 100vw;
        --lh-menu-gutter: 28px;
    }

    #tm-dialog .uk-modal-body,
    #tm-dialog-mobile .uk-modal-body {
        padding-top: 24px;
    }

    #tm-dialog .uk-modal-close-full,
    #tm-dialog-mobile .uk-modal-close-full,
    #tm-dialog-mobile .uk-modal-close-default {
        top: 24px;
    }
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --lh-menu-duration: 0.01s;
    }
}

/* Language switcher "En | ने | 中文" ([licchavi_lang] + GTranslate) */
.lh-lang {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    font-size: 0.875rem;
    line-height: 20px;
    color: var(--lh-menu-muted);
}

.lh-lang a {
    color: var(--lh-menu-muted);
    text-decoration: none;
    transition: color 0.2s ease;
}

.lh-lang a:hover,
.lh-lang a.gt-current-lang {
    color: var(--lh-menu-accent);
}

.lh-lang__sep {
    color: var(--lh-menu-muted);
    font-size: 0.8em;
}

/* Hide Google Translate's injected banner, tooltip and page offset */
body {
    top: 0 !important;
}

.skiptranslate iframe,
iframe.skiptranslate,
.goog-te-banner-frame,
#goog-gt-tt,
.goog-te-balloon-frame,
.VIpgJd-ZVi9od-ORHb-OEVmcd,
.VIpgJd-ZVi9od-aZ2wEe-wOHMyf {
    display: none !important;
}

.goog-text-highlight {
    background: none !important;
    box-shadow: none !important;
}

/* -------------------------------------------------------------------------
   Text button with arrow — .uk-button-text::after
   The arrow is images/btn-arrow-right.svg used as a mask, so it follows the
   button's text colour. Tweak via the --btn-arrow-* properties.
   ------------------------------------------------------------------------- */
.uk-button-text {
    --btn-arrow-icon: url("../images/btn-arrow-right.svg");
    --btn-arrow-size: 2.25em;
    --btn-arrow-gap: 0.8em;
    --btn-arrow-hover-rotate: -20deg;
    --btn-arrow-duration: 0.3s;
}

.uk-button-text::after {
    content: "";
    display: inline-block;
    flex: 0 0 auto;
    width: var(--btn-arrow-size);
    height: var(--btn-arrow-size);
    margin-left: var(--btn-arrow-gap);
    vertical-align: middle;
    background-color: currentColor;
    -webkit-mask: var(--btn-arrow-icon) center / contain no-repeat;
    mask: var(--btn-arrow-icon) center / contain no-repeat;
    transition: transform var(--btn-arrow-duration) ease;
}

.uk-button-text:hover::after,
.uk-button-text:focus-visible::after {
    transform: rotate(var(--btn-arrow-hover-rotate));
}

@media (max-width: 639px) {
    .uk-button-text {
        --btn-arrow-gap: 1em;
    }
}

@media (prefers-reduced-motion: reduce) {
    .uk-button-text::after {
        transition: none;
    }
}