/*
Theme Name: Stars
Theme URI: https://starsprogrammes.co.nz
Author: Stars Holiday Programme
Description: Accessibility-first child theme of OnePress. Layers a WCAG-AA
    brand design system (tokens, type scale, spacing, focus states, reduced
    motion) on top of the imported Gutenberg-rendered content.
Template: onepress
Version: 3.4.7
Requires at least: 6.2
Requires PHP: 7.4
*/

/* ========================================================================
   Design tokens
   ======================================================================== */
:root {
    /* Brand green — a deep, grounded grass green (#0c7a2e) for large fills:
       header, footer, heroes, buttons. Text-on-white uses --stars-green-dark so
       links and accents keep WCAG-AA contrast. */
    --stars-green:        #0c7a2e;
    --stars-green-dark:   #005f06;
    --stars-purple:       #5d276f;
    --stars-purple-dark:  #4a1f59;

    /* Neutrals */
    --stars-ink:    #1f2937;
    --stars-body:   #3b4252;
    --stars-muted:  #5b6573;
    --stars-line:   #e5e7eb;
    --stars-bg:     #ffffff;
    --stars-bg-alt: #f6f8fa;

    /* Radii, shadows, motion */
    --stars-radius:   12px;
    --stars-radius-sm: 8px;
    --stars-shadow-sm: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .10);
    --stars-shadow:    0 6px 18px rgba(16, 24, 40, .08), 0 2px 6px rgba(16, 24, 40, .06);
    --stars-transition: 180ms cubic-bezier(.4, 0, .2, 1);

    /* Type */
    --stars-leading: 1.65;
    --stars-measure: 72ch;

    /* Focus ring */
    --stars-focus-color: #0c7a2e;
    --stars-focus-width: 3px;
}

/* ========================================================================
   Base typography
   ======================================================================== */
body {
    color: var(--stars-body);
    line-height: var(--stars-leading);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--stars-ink);
    font-weight: 700;
    line-height: 1.25;
    text-wrap: balance;
}

.entry-content h2 { margin-top: 2.4rem; margin-bottom: .8rem; font-size: 1.7rem; }
.entry-content h3 { margin-top: 2rem;   margin-bottom: .6rem; font-size: 1.3rem; }
.entry-content h4 { margin-top: 1.6rem; margin-bottom: .5rem; font-size: 1.1rem; }
.entry-content p,
.entry-content ul,
.entry-content ol { margin-top: 0; margin-bottom: 1.1rem; }
.entry-content li { margin-bottom: .35rem; }

/* Links — accessible, underlined with a comfortable offset (descenders
   'g y p q' clear the line), thicker on hover. */
a {
    color: var(--stars-green-dark);
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
    transition: color var(--stars-transition), text-decoration-thickness var(--stars-transition);
}
a:hover { color: var(--stars-green); text-decoration-thickness: 2px; }

/* Actions, nav, logos and image links are NOT text links — drop the underline
   (they use their own affordance: background, border, or none). Prevents
   doubled lines and stray underlines running through button text / images. */
.wp-block-button a,
.wp-block-button__link,
.hero__btn,
.home-cta__btn,
.programme-hero__cta,
.programme-cta__button,
.card__link,
.card__media,
.onepress-menu > li > a,
.custom-logo-link,
.site-title a,
.page-header .entry-title a,
.footer-widgets a,
.site-info a,
a:has(> img) {
    text-decoration: none;
}
.wp-block-button a:hover,
.wp-block-button__link:hover,
.hero__btn:hover,
.home-cta__btn:hover,
.programme-hero__cta:hover,
.programme-cta__button:hover,
.card__link:hover,
.footer-widgets a:hover,
.site-info a:hover {
    text-decoration: none;
}

/* ========================================================================
   Headings with a brand background (green/purple section banners)
   ======================================================================== */
.entry-content .wp-block-heading.has-background,
.entry-content h2.has-background,
.entry-content h3.has-background,
.entry-content h4.has-background {
    color: #ffffff !important;
    padding: .85rem 1.25rem;
    border-radius: var(--stars-radius-sm);
    box-shadow: var(--stars-shadow-sm);
}
.entry-content .has-text-color.has-background a { color: inherit; }

/* ========================================================================
   Buttons
   ======================================================================== */
.wp-block-button { margin-bottom: 1.1rem; }

.wp-block-button__link,
.wp-block-button .wp-block-button__link {
    background-color: var(--stars-green);
    color: #ffffff;
    border: 2px solid var(--stars-green);
    border-radius: 999px;
    padding: .7rem 1.6rem;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    transition: background-color var(--stars-transition),
                border-color var(--stars-transition),
                transform var(--stars-transition);
}
.wp-block-button__link:hover,
.wp-block-button .wp-block-button__link:hover,
.wp-block-button__link:focus-visible,
.wp-block-button .wp-block-button__link:focus-visible {
    background-color: var(--stars-green-dark);
    border-color: var(--stars-green-dark);
    color: #ffffff;
    text-decoration: none;
    transform: translateY(-1px);
}

/* Outline button variant */
.wp-block-button.is-style-outline .wp-block-button__link {
    background-color: transparent;
    color: var(--stars-green-dark);
    border: 2px solid var(--stars-green);
}
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:focus-visible {
    background-color: var(--stars-green);
    color: #ffffff;
}

/* ========================================================================
   Cover blocks — section spacing + readable overlays
   ======================================================================== */
.wp-block-cover {
    border-radius: var(--stars-radius);
    overflow: hidden;
    margin-bottom: 1.5rem;
    min-height: 340px;
}
.wp-block-cover .wp-block-cover__inner-container {
    text-shadow: 0 1px 3px rgba(0, 0, 0, .45);
}
.wp-block-cover h1,
.wp-block-cover h2,
.wp-block-cover h3 { color: #ffffff; }
.wp-block-cover .wp-block-cover__inner-container > * { max-width: var(--stars-measure); }

/* ========================================================================
   Columns + images + galleries
   ======================================================================== */
.wp-block-columns { gap: 2rem; margin-bottom: 1.6rem; }
.wp-block-column { gap: 1rem; }

.wp-block-image img,
.wp-block-gallery img {
    border-radius: var(--stars-radius-sm);
    box-shadow: var(--stars-shadow-sm);
}
.wp-block-gallery { margin-bottom: 1.6rem; }
.wp-block-gallery .blocks-gallery-item { padding: 0; }
.wp-block-gallery figure { margin: 0; }

/* ========================================================================
   Tables (e.g. programme schedule)
   ======================================================================== */
.entry-content table,
.wp-block-table table {
    border-collapse: collapse;
    width: 100%;
    margin-bottom: 1.6rem;
    box-shadow: var(--stars-shadow-sm);
    border-radius: var(--stars-radius-sm);
    overflow: hidden;
}
.wp-block-table th,
.wp-block-table td,
.entry-content th,
.entry-content td {
    padding: .75rem 1rem;
    border-bottom: 1px solid var(--stars-line);
    text-align: left;
}
.wp-block-table th,
.entry-content th {
    background-color: var(--stars-bg-alt);
    color: var(--stars-ink);
    font-weight: 700;
}
.wp-block-table tbody tr:nth-child(even),
.entry-content tbody tr:nth-child(even) { background-color: var(--stars-bg-alt); }

/* Separator */
.wp-block-separator { border: none; border-top: 2px solid var(--stars-line); margin: 2rem auto; }

/* ========================================================================
   Forms (e.g. enrolment / contact)
   ======================================================================== */
.entry-content input[type="text"],
.entry-content input[type="email"],
.entry-content input[type="tel"],
.entry-content input[type="url"],
.entry-content input[type="password"],
.entry-content textarea,
.entry-content select {
    border: 1px solid var(--stars-line);
    border-radius: var(--stars-radius-sm);
    padding: .6rem .75rem;
    background-color: #ffffff;
    color: var(--stars-ink);
    transition: border-color var(--stars-transition), box-shadow var(--stars-transition);
}
.entry-content input:focus,
.entry-content textarea:focus,
.entry-content select:focus {
    outline: none;
    border-color: var(--stars-green);
    box-shadow: 0 0 0 var(--stars-focus-width) rgba(12, 122, 46, .25);
}

/* ========================================================================
   Accessibility — focus visibility + reduced motion
   ======================================================================== */
:focus-visible {
    outline: var(--stars-focus-width) solid var(--stars-focus-color);
    outline-offset: 2px;
    border-radius: 3px;
}
/* Keep buttons/links readable when focus ring sits on the green bg */
.wp-block-button__link:focus-visible,
.onepress-menu > li > a:focus-visible,
.site-title a:focus-visible {
    outline-color: #ffffff;
    outline-offset: 2px;
    box-shadow: 0 0 0 var(--stars-focus-width) rgba(0, 0, 0, .35);
}

/* Skip link visible on focus */
.skip-link:focus {
    top: 0; left: 0;
    z-index: 100000;
    background: #ffffff;
    color: var(--stars-green-dark);
    padding: .6rem 1rem;
    border-radius: 0 0 var(--stars-radius-sm) 0;
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }
}

/* ========================================================================
   Page header (OnePress title banner) — branded to match the homepage hero
   ======================================================================== */
.page-header {
    background-color: var(--stars-green);
    color: #ffffff;
    padding: 2.9rem 1.5rem;
    margin: 0 0 2.75rem;
    text-align: center;
    box-shadow: var(--stars-shadow-sm);
}
.page-header .container { max-width: 880px; }
.page-header .entry-title,
.page-header .entry-title a {
    color: #ffffff;
    font-size: clamp(1.7rem, 1.2rem + 2.2vw, 2.5rem);
    margin: 0;
    line-height: 1.2;
    text-shadow: 0 1px 6px rgba(0, 0, 0, .15);
}
/* Breadcrumb sits on the green banner — keep it readable. */
.page-header + * .onepress-breadcrumb,
.breadcrumb > * { color: rgba(255, 255, 255, .9); }

/* ========================================================================
   Responsive
   ======================================================================== */
@media (max-width: 782px) {
    .entry-content h2 { font-size: 1.45rem; }
    .entry-content h3 { font-size: 1.15rem; }
    .wp-block-columns { gap: 1.25rem; }
    .wp-block-button__link { display: inline-block; width: 100%; text-align: center; }
    .wp-block-cover { min-height: 280px; }
}

/* ========================================================================
   Polish — micro-typography, selection, anchors, responsive tables
   ======================================================================== */

/* Text selection — defer to the browser/OS default. Overrides OnePress's hard
   black; the Highlight/HighlightText system colours follow the user's OS theme
   (with a standard blue fallback for browsers that don't resolve them). */
::selection {
    background-color: #3297fd;
    color: #ffffff;
    background-color: Highlight;
    color: HighlightText;
}

/* Smooth in-page anchor scrolling (e.g. "#shp" links on the homepage), but
   never when the user prefers reduced motion. */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* Avoid rivers/orphans in body copy. */
.entry-content p { text-wrap: pretty; }

/* Keep wide schedule/data tables scrollable on narrow screens instead of
   overflowing the layout. */
.wp-block-table { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.entry-content table { min-width: 100%; }

/* Front page: the cover sections are the visual hero, so the plain page-title
   banner is hidden. The page <h1> (renamed "Stars Holiday Programme") is kept
   via screen-reader-text so the page still has a meaningful, accessible
   heading — better than either showing "Home Page New" or having no <h1>. */
.home .page-header {
    position: absolute !important;
    width: 1px !important; height: 1px !important;
    margin: -1px !important; padding: 0 !important; border: 0 !important;
    clip: rect(1px, 1px, 1px, 1px) !important;
    clip-path: inset(50%) !important;
    overflow: hidden !important; word-wrap: normal !important;
}

/* ========================================================================
   "Programme" page template (shp-primary, shp-intermediate)
   ======================================================================== */

/* Hero -------------------------------------------------------------------- */
.programme-hero {
    position: relative;
    overflow: hidden;
    background-color: var(--stars-green);
    color: #ffffff;
    min-height: min(62vh, 520px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4rem 1.5rem;
    margin: 0 0 2.75rem;
    text-align: center;
}
/* Photo variant: the green gradient is just the fallback; with an image the
   hero gets a dark scrim so the white title/CTA stay readable. */
.programme-hero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; }
.programme-hero__scrim {
    position: absolute; inset: 0; z-index: 2;
    background: linear-gradient(135deg, rgba(15, 23, 32, .80) 0%, rgba(15, 23, 32, .50) 100%);
}
.programme-hero__inner { position: relative; z-index: 3; max-width: 760px; }
.programme-hero__title { text-shadow: 0 2px 10px rgba(0, 0, 0, .3); }
@media (max-width: 782px) {
    .programme-hero { min-height: min(56vh, 420px); padding: 3rem 1.25rem; }
}
.programme-hero__eyebrow {
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: .8rem;
    font-weight: 700;
    margin: 0 0 .6rem;
    opacity: .92;
}
.programme-hero__title {
    color: #ffffff;
    font-size: clamp(1.9rem, 1.2rem + 2.4vw, 2.8rem);
    margin: 0 0 1.3rem;
    line-height: 1.15;
}
.programme-hero__cta,
.programme-cta__button {
    display: inline-block;
    background-color: #ffffff;
    color: var(--stars-green-dark);
    font-weight: 700;
    padding: .8rem 1.9rem;
    border-radius: 999px;
    text-decoration: none;
    border: 2px solid #ffffff;
    transition: background-color var(--stars-transition), transform var(--stars-transition);
}
.programme-hero__cta:hover,
.programme-cta__button:hover {
    background-color: transparent;
    color: #ffffff;
    transform: translateY(-1px);
}


/* Closing CTA band -------------------------------------------------------- */
.programme-cta {
    background-color: var(--stars-green);
    color: #ffffff;
    border-radius: var(--stars-radius);
    box-shadow: var(--stars-shadow);
    padding: 2.75rem 1.5rem;
    margin: 3rem auto;
    max-width: 880px;
    text-align: center;
}
.programme-cta__title { color: #ffffff; margin: 0 0 .5rem; font-size: 1.8rem; }
.programme-cta__text  { margin: 0 0 1.3rem; opacity: .95; }

/* Programme template — responsive */
@media (max-width: 782px) {
    .programme-hero { padding: 2.25rem 1.25rem; margin-bottom: 2rem; }
    .programme-cta { padding: 2rem 1.25rem; margin-top: 2.25rem; }
}

/* ========================================================================
   Front page — "Bold hero + programme cards"
   ======================================================================== */
.stars-home { padding: 0; }
.stars-home .page-header { display: none; }   /* belt-and-suspenders */

/* Shared section heading -------------------------------------------------- */
.section-head { text-align: center; max-width: 720px; margin: 0 auto 2.5rem; }
.section-head__title {
    font-size: clamp(1.6rem, 1.1rem + 1.8vw, 2.1rem);
    margin: 0 0 .5rem;
}
.section-head__sub { margin: 0; color: var(--stars-muted); font-size: 1.05rem; }

/* Hero — full-bleed photo with a dark gradient scrim for the text. The image
   spans the viewport edge-to-edge; a left-to-right dark gradient guarantees
   white-text contrast (no muddy white fade) and looks premium. Other sections
   below stay in their centered containers. */
.hero {
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;
    min-height: min(80vh, 640px);
    background-color: var(--stars-ink); /* fallback before the photo loads */
}
.hero__slides {
    position: absolute; inset: 0;
    z-index: 1;
    --slide-time: 8s;
}
.hero__bg {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    opacity: 0;
    animation: heroFade calc(var(--slides, 3) * var(--slide-time, 8s)) infinite;
    animation-delay: calc(var(--i, 0) * var(--slide-time, 8s));
    will-change: opacity;
}
/* Crossfade: each slide fades in, holds, fades out as the next fades in. */
@keyframes heroFade {
    0%   { opacity: 0; }
    4%   { opacity: 1; }
    24%  { opacity: 1; }
    33%  { opacity: 0; }
    100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .hero__bg { animation: none; opacity: 0; }
    .hero__bg:first-child { opacity: 1; }
}
.hero__scrim {
    position: absolute; inset: 0;
    z-index: 2;
    background: linear-gradient(
        100deg,
        rgba(15, 23, 32, .92) 0%,
        rgba(15, 23, 32, .78) 28%,
        rgba(15, 23, 32, .40) 62%,
        rgba(15, 23, 32, .12) 100%
    );
}
.hero__inner {
    position: relative;
    z-index: 3;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.5rem;
}
.hero__content {
    max-width: 620px;
    padding: 5.5rem 0;
}
.hero__eyebrow {
    color: rgba(255, 255, 255, .82);
    text-transform: uppercase;
    letter-spacing: .14em;
    font-size: .8rem;
    font-weight: 700;
    margin: 0 0 .7rem;
}
.hero__title {
    color: #ffffff;
    font-size: clamp(2.1rem, 1.4rem + 3.4vw, 3.4rem);
    line-height: 1.1;
    margin: 0 0 1rem;
    text-shadow: 0 2px 10px rgba(0, 0, 0, .3);
}
.hero__sub {
    color: rgba(255, 255, 255, .92);
    font-size: clamp(1.05rem, 1rem + .4vw, 1.25rem);
    margin: 0 0 1.8rem;
    max-width: 48ch;
}
.hero__actions { display: flex; gap: .8rem; flex-wrap: wrap; }
.hero__btn {
    display: inline-block;
    padding: .85rem 1.9rem;
    border-radius: 999px;
    font-weight: 700;
    font-size: 1.1rem;
    text-decoration: none;
    border: 2px solid transparent;
    transition: background-color var(--stars-transition), color var(--stars-transition), transform var(--stars-transition);
}
.hero__btn--primary { background-color: var(--stars-green); color: #ffffff; border-color: var(--stars-green); }
.hero__btn--primary:hover { background-color: var(--stars-green-dark); border-color: var(--stars-green-dark); color: #ffffff; transform: translateY(-2px); }
.hero__btn--ghost { color: #ffffff; border-color: rgba(255, 255, 255, .85); }
.hero__btn--ghost:hover { background-color: #ffffff; color: var(--stars-green-dark); transform: translateY(-2px); }

/* Hero — responsive: centre text on narrow screens */
@media (max-width: 880px) {
    .hero { min-height: min(70vh, 520px); }
    .hero__scrim {
        background: linear-gradient(180deg, rgba(15, 23, 32, .35) 0%, rgba(15, 23, 32, .82) 100%);
    }
    .hero__content { padding: 4rem 0; text-align: center; margin: 0 auto; }
    .hero__sub { margin-left: auto; margin-right: auto; }
    .hero__actions { justify-content: center; }
}

/* Programme cards --------------------------------------------------------- */
.programmes { padding: 4rem 1.5rem; max-width: 1140px; margin: 0 auto; }
.programmes__grid {
    display: grid;
    gap: 1.75rem;
    grid-template-columns: repeat(3, 1fr);
}
.card {
    background: var(--stars-bg);
    border: 1px solid var(--stars-line);
    border-radius: var(--stars-radius);
    box-shadow: var(--stars-shadow-sm);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: box-shadow var(--stars-transition), transform var(--stars-transition);
}
.card:hover { box-shadow: var(--stars-shadow); transform: translateY(-4px); }
.card__media { display: block; aspect-ratio: 4 / 3; background: var(--stars-bg-alt); overflow: hidden; }
.card__img { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; }
/* Placeholder for cards without a photo (e.g. the online Stars Club): a
   branded purple panel so the card still reads as part of the set. */
.card__media--placeholder {
    background: var(--stars-purple);
    display: flex;
    align-items: center;
    justify-content: center;
}
.card__badge {
    color: #ffffff;
    font-weight: 800;
    font-size: 1.3rem;
    letter-spacing: .03em;
    text-transform: uppercase;
    opacity: .94;
    padding: 0 .75rem;
    text-align: center;
}
.card__body { padding: 1.4rem 1.4rem 1.6rem; display: flex; flex-direction: column; flex: 1; }
.card__title { font-size: 1.4rem; margin: 0 0 .15rem; color: var(--stars-ink); }
.card__years { color: var(--stars-green-dark); font-weight: 700; font-size: .95rem; margin: 0 0 .35rem; }
.card__meta { color: var(--stars-muted); font-size: .9rem; margin: 0 0 .7rem; }
.card__desc { margin: 0 0 1.1rem; color: var(--stars-body); flex: 1; }
.card__link {
    align-self: flex-start;
    font-weight: 700;
    color: var(--stars-green-dark);
    text-decoration: none;
    padding: .35rem 0;
    border-bottom: 2px solid transparent;
    transition: border-color var(--stars-transition), color var(--stars-transition);
}
.card__link:hover { border-bottom-color: var(--stars-green); }
.card__arrow { display: inline-block; transition: transform var(--stars-transition); }
.card__link:hover .card__arrow { transform: translateX(3px); }

/* Features ---------------------------------------------------------------- */
.features { background: var(--stars-bg-alt); padding: 4rem 1.5rem; }
.features__inner { max-width: 1080px; margin: 0 auto; }
.features__title {
    text-align: center;
    font-size: clamp(1.6rem, 1.1rem + 1.8vw, 2.1rem);
    margin: 0 0 2rem;
}
.features__list {
    list-style: none;
    margin: 0; padding: 0;
    display: grid;
    gap: 1.25rem 2rem;
    grid-template-columns: repeat(2, 1fr);
}
.feature {
    display: flex;
    align-items: flex-start;
    gap: .85rem;
    background: var(--stars-bg);
    border: 1px solid var(--stars-line);
    border-radius: var(--stars-radius-sm);
    padding: 1.1rem 1.2rem;
    box-shadow: var(--stars-shadow-sm);
}
.feature__check {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center; justify-content: center;
    width: 1.75rem; height: 1.75rem;
    border-radius: 50%;
    background: var(--stars-green);
    color: #ffffff;
    font-weight: 700;
    font-size: .9rem;
}
.feature__text { display: flex; flex-direction: column; }
.feature__name { color: var(--stars-ink); font-size: 1.05rem; margin-bottom: .15rem; }
.feature__desc { color: var(--stars-muted); font-size: .92rem; }

/* Gallery band ------------------------------------------------------------ */
.gallery-band { padding: 4rem 1.5rem; max-width: 1140px; margin: 0 auto; }
.gallery-band__grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, 1fr);
}
.gallery-band__item {
    margin: 0;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: var(--stars-radius-sm);
    box-shadow: var(--stars-shadow-sm);
    background: var(--stars-bg-alt);
}
.gallery-band__img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform var(--stars-transition); }
.gallery-band__item:hover .gallery-band__img { transform: scale(1.04); }

/* Closing CTA ------------------------------------------------------------- */
.home-cta {
    max-width: 880px;
    margin: 3rem auto;
    border-radius: var(--stars-radius);
    padding: 2.75rem 1.5rem;
    text-align: center;
    color: #ffffff;
    background-color: var(--stars-green);
    box-shadow: var(--stars-shadow);
}
.home-cta__title { color: #ffffff; font-size: clamp(1.6rem, 1.1rem + 1.8vw, 2.2rem); margin: 0 0 .5rem; }
.home-cta__text { margin: 0 auto 1.4rem; max-width: 52ch; opacity: .96; }
.home-cta__btn {
    display: inline-block;
    background-color: #ffffff;
    color: var(--stars-green-dark);
    font-weight: 700;
    padding: .85rem 2rem;
    border-radius: 999px;
    text-decoration: none;
    border: 2px solid #ffffff;
    transition: background-color var(--stars-transition), color var(--stars-transition), transform var(--stars-transition);
}
.home-cta__btn:hover { background-color: transparent; color: #ffffff; transform: translateY(-2px); }

/* Next-programme highlight strip — sits directly under the hero so the next
   dates are the first thing seen on landing. Mirrors the brand panel styling. */
.next-up { background-color: var(--stars-green); color: #ffffff; }
/* Stars Club "join now" variant — swaps the strip to the club's purple so it
   reads as a different, attention-grabbing call to action. */
.next-up--club { background-color: var(--stars-purple); }
.next-up--club .next-up__btn { color: var(--stars-purple-dark); }
.next-up__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1.5rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    flex-wrap: wrap;
}
.next-up__text { min-width: 0; }
.next-up__eyebrow {
    margin: 0 0 .25rem;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .85);
}
.next-up__title {
    margin: 0 0 .6rem;
    font-size: clamp(1.5rem, 1.1rem + 1.5vw, 2.1rem);
    line-height: 1.15;
    color: #ffffff;
}
.next-up__dates {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}
.next-up__dates li {
    font-size: .92rem;
    background: rgba(255, 255, 255, .15);
    padding: .35rem .8rem;
    border-radius: 999px;
}
.next-up__btn {
    flex: 0 0 auto;
    display: inline-block;
    background-color: #ffffff;
    color: var(--stars-green-dark);
    font-weight: 700;
    font-size: 1.1rem;
    padding: .85rem 1.9rem;
    border-radius: 999px;
    text-decoration: none;
    border: 2px solid #ffffff;
    white-space: nowrap;
    transition: background-color var(--stars-transition), color var(--stars-transition), transform var(--stars-transition);
}
.next-up__btn:hover { background-color: transparent; color: #ffffff; transform: translateY(-2px); }
/* Action cluster — the closing date to the left of the enrol button. */
.next-up__action { flex: 0 0 auto; display: flex; flex-direction: row; align-items: center; gap: 1rem; }
.next-up__closes { font-size: 1rem; color: rgba(255, 255, 255, .85); }
@media (max-width: 782px) {
    .next-up__inner { flex-direction: column; align-items: flex-start; }
    .next-up__action { align-self: stretch; flex-wrap: wrap; }
    .next-up__btn { flex: 1 1 auto; text-align: center; }
}

/* "Enrol soon" disabled state — a muted, non-clickable span styled like its
   button. Shared by every enrol button (hero, next-up, CTA, enrol page) so the
   pending messaging reads consistently while the Jotform link is unset. */
.hero__btn--primary.is-disabled,
.next-up__btn.is-disabled,
.home-cta__btn.is-disabled,
.enrol-cta__btn.is-disabled {
    opacity: .6;
    cursor: default;
    pointer-events: none;
}

/* Front page — responsive ------------------------------------------------- */
@media (max-width: 960px) {
    .programmes__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 782px) {
    .programmes { padding: 2.75rem 1.25rem; }
    .programmes__grid { grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; }
    .features { padding: 2.75rem 1.25rem; }
    .features__list { grid-template-columns: 1fr; }
    .gallery-band { padding: 2.75rem 1.25rem; }
    .gallery-band__grid { grid-template-columns: repeat(2, 1fr); }
    .home-cta { margin: 2rem 1rem; padding: 2.25rem 1.25rem; }
}

/* ========================================================================
   Navbar — a clean, self-contained bar rendered by the child header.php
   (logo left, nav right, hamburger toggle on mobile). Nothing here relies on
   OnePress's header markup, so there is no parent-theme CSS to fight.
   ======================================================================== */
.stars-nav {
    position: sticky;
    top: 0;
    z-index: 500;
    background-color: var(--stars-green);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
}
.stars-nav__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.5rem;
    min-height: 76px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
}

/* Brand / logo */
.stars-nav__brand { flex: 0 0 auto; display: flex; align-items: center; }
.stars-nav .custom-logo-link { display: inline-flex; align-items: center; line-height: 0; padding: 6px 0; }
.stars-nav .custom-logo { height: auto; max-height: 46px; width: auto; display: block; }

/* Primary menu */
.stars-nav__nav { flex: 1 1 auto; display: flex; justify-content: flex-end; }
.stars-nav__menu {
    list-style: none;
    display: flex;
    align-items: center;
    gap: .15rem;
    margin: 0;
    padding: 0;
}
.stars-nav__menu > li { margin: 0; }
.stars-nav__menu > li > a {
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    padding: .6rem .9rem;
    font-weight: 600;
    text-decoration: none;
    position: relative;
    transition: color var(--stars-transition);
}
/* Animated white underline on hover/active (a colour change is invisible on green). */
.stars-nav__menu > li > a::after {
    content: '';
    position: absolute;
    left: .9rem; right: .9rem; bottom: .3rem;
    height: 2px;
    background: #ffffff;
    border-radius: 2px;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform var(--stars-transition);
}
.stars-nav__menu > li > a:hover::after,
.stars-nav__menu > li.current-menu-item > a::after,
.stars-nav__menu > li.current_page_item > a::after {
    transform: scaleX(1);
}
.stars-nav__menu > li > a:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 2px;
    border-radius: 4px;
}

/* Hamburger toggle — desktop hidden, mobile shown */
.stars-nav__toggle {
    display: none;
    background: transparent;
    border: 0;
    color: #ffffff;
    cursor: pointer;
    align-items: center;
    gap: .5rem;
    padding: .5rem 0 .5rem .5rem;
    font-weight: 600;
    font-size: 1rem;
}
.stars-nav__toggle-icon { position: relative; display: block; width: 24px; height: 2px; background: #ffffff; border-radius: 2px; transition: background var(--stars-transition); }
.stars-nav__toggle-icon::before,
.stars-nav__toggle-icon::after {
    content: '';
    position: absolute; left: 0;
    display: block; width: 24px; height: 2px;
    background: #ffffff; border-radius: 2px;
    transition: transform var(--stars-transition), background var(--stars-transition);
}
.stars-nav__toggle-icon::before { top: -7px; }
.stars-nav__toggle-icon::after  { top: 7px; }

/* Mobile layout */
@media (max-width: 880px) {
    .stars-nav__inner { min-height: 62px; gap: 1rem; padding: 0 1rem; }
    .stars-nav .custom-logo { max-height: 40px; }
    .stars-nav__toggle { display: inline-flex; }
    .stars-nav__nav {
        position: absolute;
        top: 100%; left: 0; right: 0;
        background-color: var(--stars-green-dark);
        flex-direction: column;
        max-height: 0;
        overflow: hidden;
        transition: max-height var(--stars-transition);
        box-shadow: 0 8px 14px rgba(0, 0, 0, .18);
    }
    .stars-nav.is-open .stars-nav__nav { max-height: 75vh; overflow: auto; }
    .stars-nav__menu {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        padding: .4rem 0;
    }
    .stars-nav__menu > li > a {
        padding: .9rem 1.25rem;
        width: 100%;
        justify-content: flex-start;
    }
    .stars-nav__menu > li > a::after { display: none; }
    /* Toggle animates into an X when open. */
    .stars-nav.is-open .stars-nav__toggle-icon { background: transparent; }
    .stars-nav.is-open .stars-nav__toggle-icon::before { transform: translateY(7px) rotate(45deg); }
    .stars-nav.is-open .stars-nav__toggle-icon::after  { transform: translateY(-7px) rotate(-45deg); }
}

/* ========================================================================
   Footer — branded multi-column footer (replaces OnePress widget footer)
   ======================================================================== */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
}

.stars-footer {
    background-color: var(--stars-green);
    color: rgba(255, 255, 255, .94);
    margin-top: 0;
}
.stars-footer__top {
    max-width: 1180px;
    margin: 0 auto;
    padding: 3.5rem 1.5rem 2.5rem;
    display: grid;
    grid-template-columns: 1.7fr 1fr 1fr 1.2fr;
    gap: 2.5rem;
}
.stars-footer__brand-logo img.custom-logo { height: 46px; width: auto; filter: brightness(0) invert(1); opacity: 1; }
.stars-footer__brand-name { color: #ffffff; font-size: 1.25rem; font-weight: 800; text-decoration: none; }
.stars-footer__tagline { margin: 1.1rem 0 1.25rem; font-size: .92rem; line-height: 1.6; max-width: 34ch; color: rgba(255, 255, 255, .92); }
.stars-footer__badge {
    display: inline-block; font-size: .76rem; font-weight: 600; letter-spacing: .02em;
    color: #ffffff; background: rgba(255, 255, 255, .15);
    border: 1px solid rgba(255, 255, 255, .32);
    padding: .35rem .8rem; border-radius: 999px;
}
.stars-footer__col h3 {
    color: #ffffff; font-size: .78rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: .1em;
    margin: 0 0 1rem;
}
.stars-footer__col ul { list-style: none; margin: 0; padding: 0; }
.stars-footer__col li { margin: 0 0 .55rem; }
.stars-footer__col a {
    color: rgba(255, 255, 255, .92); text-decoration: none; font-size: .93rem;
    transition: color var(--stars-transition);
}
.stars-footer__col a:hover { color: #ffffff; text-decoration: underline; }
.stars-footer__contact p { margin: 0 0 .5rem; font-size: .93rem; line-height: 1.5; color: rgba(255, 255, 255, .92); }
.stars-footer__contact a { color: rgba(255, 255, 255, .95); text-decoration: none; white-space: nowrap; }
.stars-footer__contact a:hover { color: #ffffff; text-decoration: underline; }
.stars-footer__address { line-height: 1.6; }
.stars-footer__bottom {
    border-top: 1px solid rgba(255, 255, 255, .22);
    max-width: 1180px; margin: 0 auto;
    padding: 1.1rem 1.5rem;
    display: flex; justify-content: space-between; align-items: center; gap: 1rem;
    font-size: .85rem;
    color: rgba(255, 255, 255, .92);
}
.stars-footer__copy { margin: 0; }
.stars-footer__btt { color: rgba(255, 255, 255, .88); text-decoration: none; font-size: .85rem; transition: color var(--stars-transition); }
.stars-footer__btt:hover { color: #ffffff; }

@media (max-width: 880px) {
    .stars-footer__top { grid-template-columns: 1fr 1fr; gap: 2rem; }
    .stars-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
    .stars-footer__top { grid-template-columns: 1fr; gap: 1.75rem; padding: 2.5rem 1.25rem 2rem; }
    .stars-footer__bottom { flex-direction: column; gap: .6rem; text-align: center; }
}
@media (max-width: 480px) {
    .gallery-band__grid { grid-template-columns: 1fr; }
}

/* ========================================================================
   Inner page templates — Contact / Enrol / Stars Club
   A shared "page hero" + key-facts + form layout. Reusable, consistent.
   ======================================================================== */
.stars-formpage { padding: 0; }
.stars-formpage__body { max-width: 1100px; margin: 0 auto; padding: 3rem 1.5rem 4rem; }

/* Page hero (green banner; purple variant for Stars Club) */
.page-hero {
    background-color: var(--stars-green);
    color: #ffffff;
    padding: 3.5rem 1.5rem;
    text-align: center;
}
.page-hero--purple {
    background-color: var(--stars-purple);
}
.page-hero__inner { max-width: 760px; margin: 0 auto; }
.page-hero__eyebrow { text-transform: uppercase; letter-spacing: .12em; font-size: .8rem; font-weight: 700; margin: 0 0 .6rem; opacity: .92; }
.page-hero__title { color: #ffffff; font-size: clamp(1.9rem, 1.3rem + 2.4vw, 2.8rem); margin: 0 0 .7rem; }
.page-hero__sub { color: rgba(255, 255, 255, .94); font-size: 1.1rem; margin: 0 auto; max-width: 56ch; }
.page-hero__btn {
    display: inline-block; margin-top: 1.4rem;
    background-color: #ffffff; color: var(--stars-green-dark);
    font-weight: 700; padding: .8rem 1.8rem; border-radius: 999px;
    text-decoration: none; border: 2px solid #ffffff;
    transition: background-color var(--stars-transition), color var(--stars-transition), transform var(--stars-transition);
}
.page-hero__btn:hover { background-color: transparent; color: #ffffff; transform: translateY(-2px); }

/* Key facts grid (auto-fits 3 or 4 cards) */
.facts-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 1rem;
    margin-bottom: 2.75rem;
}
.facts-grid--programme { margin-bottom: 2rem; }
.fact-card {
    background: #ffffff;
    border: 1px solid var(--stars-line);
    border-radius: var(--stars-radius);
    box-shadow: var(--stars-shadow-sm);
    padding: 1.25rem 1.1rem;
    text-align: center;
    display: flex; flex-direction: column; gap: .3rem;
}
.fact-card__label { text-transform: uppercase; letter-spacing: .06em; font-size: .75rem; font-weight: 700; color: var(--stars-muted); }
.fact-card__value { font-size: 1.1rem; font-weight: 700; color: var(--stars-ink); }
.fact-card__sub { font-size: .85rem; font-weight: 500; color: var(--stars-muted); line-height: 1.4; }

/* Contact layout */
.contact-grid {
    display: grid;
    grid-template-columns: 1fr 1.3fr;
    gap: 2rem;
    align-items: start;
}
.contact-grid--details-only {
    grid-template-columns: 1fr;
    max-width: 580px;
    margin: 0 auto;
}
.contact-info {
    background: var(--stars-bg-alt);
    border: 1px solid var(--stars-line);
    border-radius: var(--stars-radius);
    padding: 1.6rem 1.5rem;
}
.contact-info__title { margin: 0 0 1rem; font-size: 1.25rem; }
.info-list { list-style: none; margin: 0 0 1.2rem; padding: 0; }
.info-item { padding: .6rem 0; border-bottom: 1px solid var(--stars-line); display: flex; flex-direction: column; gap: .15rem; }
.info-item:last-child { border-bottom: 0; }
.info-item__label { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; font-weight: 700; color: var(--stars-muted); }
.info-item__value { color: var(--stars-ink); font-weight: 600; word-break: break-word; }
a.info-item__value { text-decoration: none; }
a.info-item__value:hover { text-decoration: underline; }
.contact-info__note { font-size: .92rem; color: var(--stars-muted); margin: 0; }

/* Form card + fields */
.form-card {
    background: #ffffff;
    border: 1px solid var(--stars-line);
    border-radius: var(--stars-radius);
    box-shadow: var(--stars-shadow);
    padding: 1.8rem 1.6rem;
}
.form-card--wide { max-width: 760px; margin: 0 auto; }
.form-card__title { margin: 0 0 .4rem; font-size: 1.4rem; }
.form-card__intro { margin: 0 0 1.4rem; color: var(--stars-muted); }
.stars-form .form-row { margin: 0 0 1.1rem; }
.stars-form label { display: block; font-weight: 600; font-size: .92rem; margin-bottom: .35rem; color: var(--stars-ink); }
.stars-form .req { color: var(--stars-green-dark); }
.stars-form input[type="text"],
.stars-form input[type="email"],
.stars-form input[type="tel"],
.stars-form select,
.stars-form textarea {
    width: 100%;
    border: 1px solid var(--stars-line);
    border-radius: var(--stars-radius-sm);
    padding: .65rem .8rem;
    font-size: 1rem;
    background: #ffffff;
    color: var(--stars-ink);
    transition: border-color var(--stars-transition), box-shadow var(--stars-transition);
}
.stars-form input:focus,
.stars-form select:focus,
.stars-form textarea:focus {
    outline: none;
    border-color: var(--stars-green);
    box-shadow: 0 0 0 3px rgba(12, 122, 46, .18);
}
.stars-form textarea { resize: vertical; min-height: 120px; }
.stars-form__submit {
    background-color: var(--stars-green);
    color: #ffffff;
    border: 2px solid var(--stars-green);
    border-radius: 999px;
    padding: .75rem 1.8rem;
    font-weight: 700;
    font-size: 1rem;
    cursor: pointer;
    transition: background-color var(--stars-transition), border-color var(--stars-transition), transform var(--stars-transition);
}
.stars-form__submit:hover { background-color: var(--stars-green-dark); border-color: var(--stars-green-dark); transform: translateY(-1px); }
.stars-form--grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.25rem; }
.stars-form--grid .form-row--full,
.stars-form--grid .form-row--submit { grid-column: 1 / -1; }

/* Form feedback messages */
.form-feedback { border-radius: var(--stars-radius-sm); padding: 1rem 1.1rem; margin-bottom: 1.2rem; border: 1px solid; }
.form-feedback p { margin: 0; }
.form-feedback--ok { background: rgba(12, 122, 46, .08); border-color: rgba(12, 122, 46, .35); color: var(--stars-green-dark); }
.form-feedback--err { background: rgba(220, 38, 38, .07); border-color: rgba(220, 38, 38, .35); color: #991b1b; }

/* Stars Club — purple variants of the programme-page sections (mirrors the
   primary template layout but themed purple). */
.programme-hero--purple {
    background-color: var(--stars-purple);
}
.programme-hero__cta--on-purple,
.programme-cta__button--on-purple { color: var(--stars-purple-dark); }
.programme-hero__cta--on-purple:hover,
.programme-cta__button--on-purple:hover { color: #ffffff; }

.programme-cta--purple {
    background-color: var(--stars-purple);
}

/* Purple-tinted "note" pill on the Stars Club about block */
.about-block__note--purple { background: rgba(93, 39, 111, .10); color: var(--stars-purple-dark); }

/* Stars Club — purple accents through the page body, scoped to the club page
   so the primary/intermediate pages keep their green treatment. */
.programme-page--club .primary-block__title,
.programme-page--club .about-block__title { color: var(--stars-purple-dark); }
.programme-page--club .primary-block__title--center { position: relative; padding-bottom: .7rem; }
.programme-page--club .primary-block__title--center::after {
    content: ""; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);
    width: 52px; height: 3px; border-radius: 2px; background: var(--stars-purple);
}
/* Fact cards: purple wash + accent for a visible purple strip */
.programme-page--club .fact-card {
    background: rgba(93, 39, 111, .05);
    border-color: rgba(93, 39, 111, .22);
    border-top: 3px solid var(--stars-purple);
}
.programme-page--club .fact-card__label { color: var(--stars-purple); }
/* Term tables: subtle purple zebra rows */
.programme-page--club .club-term .schedule-table tbody tr:nth-child(even) { background: rgba(93, 39, 111, .05); }

/* Term schedule — two clean cards side by side, dates as rows */
.club-terms { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; max-width: 760px; margin: 2rem auto 0; }
.club-term {
    background: #ffffff;
    border: 1px solid var(--stars-line);
    border-radius: var(--stars-radius);
    box-shadow: var(--stars-shadow-sm);
    overflow: hidden;
}
.club-term__title {
    margin: 0; padding: .9rem 1.4rem;
    font-size: 1.1rem; color: var(--stars-purple-dark);
    background: var(--stars-bg-alt);
    border-bottom: 2px solid var(--stars-purple);
}
.club-term .schedule-table th { width: auto; color: var(--stars-ink); font-weight: 600; white-space: normal; }
@media (max-width: 600px) {
    .club-terms { grid-template-columns: 1fr; }
}

/* Enrol: detail content (Terms / Pricing / OSCAR / Refund) */
.stars-formpage__detail { max-width: 820px; margin: 3rem auto 0; padding-top: 2rem; border-top: 1px solid var(--stars-line); }
/* Enrol detail: quick-link buttons + green section headers read as intentional */
.stars-formpage__detail .wp-block-buttons { margin: 0 0 2.5rem; justify-content: center; }
.stars-formpage__detail .wp-block-button__link {
    border-radius: 999px; padding: .55rem 1.2rem; font-weight: 600; font-size: .9rem;
    background-color: var(--stars-green); color: #ffffff; text-decoration: none;
}
.stars-formpage__detail h2.wp-block-heading { margin-top: 2.5rem; margin-bottom: 1rem; font-size: 1.3rem; color: var(--stars-ink); }
.stars-formpage__detail h2.wp-block-heading.has-background {
    background-color: var(--stars-green) !important; color: #ffffff;
    padding: .7rem 1.15rem; border-radius: var(--stars-radius-sm);
    margin-top: 2.75rem; margin-bottom: 1.25rem;
}
.stars-formpage__detail p { color: var(--stars-body); line-height: 1.7; }
.stars-formpage__detail a { color: var(--stars-green-dark); }
.stars-formpage__detail hr.wp-block-separator { margin: 2.5rem auto; border-bottom: 1px solid var(--stars-line); }

/* Enrol: programme dates list + Jotform CTA */
.enrol-dates { max-width: 640px; margin: 0 auto 1rem; }
.enrol-dates__list { list-style: none; margin: 1.25rem 0 0; padding: 0; display: grid; gap: .65rem; }
.enrol-dates__list li {
    background: #ffffff; border: 1px solid var(--stars-line);
    border-left: 4px solid var(--stars-green);
    border-radius: var(--stars-radius-sm); padding: .85rem 1.15rem;
    font-weight: 600; color: var(--stars-ink); box-shadow: var(--stars-shadow-sm);
}
.enrol-cta { text-align: center; margin: 2.5rem auto 1rem; max-width: 760px; }
.enrol-cta__btn {
    display: inline-block; background-color: var(--stars-green); color: #ffffff;
    font-weight: 700; font-size: 1.1rem; padding: 1rem 2.2rem; border-radius: 999px;
    text-decoration: none; border: 2px solid var(--stars-green);
    transition: background-color var(--stars-transition), border-color var(--stars-transition), transform var(--stars-transition), box-shadow var(--stars-transition);
}
.enrol-cta__btn:hover { background-color: var(--stars-green-dark); border-color: var(--stars-green-dark); color: #ffffff; transform: translateY(-2px); box-shadow: 0 10px 18px -10px rgba(0,0,0,.28); }
.enrol-cta__btn:active { color: #ffffff; transform: translateY(0); box-shadow: 0 4px 10px -8px rgba(0,0,0,.3); }
.enrol-cta__btn [aria-hidden] { display: inline-block; transition: transform var(--stars-transition); }
.enrol-cta__btn:hover [aria-hidden] { transform: translateX(3px); }

/* Combined enrol CTA — close-date panel (left) visually connected to the enrol
   action (right). The whole right cell is the clickable green CTA. */
.enrol-panel {
    display: flex;
    align-items: stretch;
    border: 1px solid var(--stars-line);
    border-radius: var(--stars-radius);
    box-shadow: var(--stars-shadow-sm);
    overflow: hidden;
}
.enrol-panel__closes {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: .15rem;
    background: #ffffff;
    padding: 1.5rem 1.6rem;
    text-align: left;
}
.enrol-panel__label { text-transform: uppercase; letter-spacing: .06em; font-size: .75rem; font-weight: 700; color: var(--stars-muted); }
.enrol-panel__date { font-size: 1.4rem; font-weight: 800; color: var(--stars-ink); line-height: 1.15; }
.enrol-panel__urgency { margin-top: .2rem; font-size: .85rem; font-weight: 600; color: var(--stars-green-dark); }
.enrol-panel__cta {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: .3rem;
    min-width: 240px;
    padding: 1.5rem 1.8rem;
    background-color: var(--stars-green);
    color: #ffffff;
    text-decoration: none;
    text-align: center;
    transition: background-color var(--stars-transition);
}
.enrol-panel__cta:visited { color: #ffffff; }
.enrol-panel__cta:hover { background-color: var(--stars-green-dark); color: #ffffff; text-decoration: none; }
.enrol-panel__cta-main { display: flex; align-items: center; justify-content: center; gap: .55rem; font-size: 1.3rem; font-weight: 800; }
.enrol-panel__cta-arrow { display: inline-block; font-size: 1.45rem; line-height: 1; transition: transform var(--stars-transition); }
.enrol-panel__cta:hover .enrol-panel__cta-arrow { transform: translateX(4px); }
/* No close date configured — the CTA cell fills the panel alone. */
.enrol-panel--cta-only .enrol-panel__cta { flex: 1 1 auto; }
@media (max-width: 560px) {
    .enrol-panel { flex-direction: column; }
    .enrol-panel__closes { text-align: center; }
    .enrol-panel__cta { min-width: 0; }
}
.enrol-cta__note { margin: 1rem 0 0; color: var(--stars-muted); font-size: .92rem; }
.enrol-cta__note a { color: var(--stars-green-dark); font-weight: 600; }
.enrol-cta__note--pending { font-size: 1rem; color: var(--stars-body); }
/* Enrolment closing date — sits between the button and the helper note. */
.enrol-cta__closes { font-weight: 600; color: var(--stars-ink); }

/* ========================================================================
   Primary programme template — designed sections (schedule / activities /
   info cards / photos / video) instead of one long stack.
   ======================================================================== */
.programme-page--primary .primary-body { max-width: 1140px; margin: 0 auto; padding: 0 1.5rem; }
.programme-hero__tag { color: rgba(255, 255, 255, .92); font-size: 1.05rem; margin: 0 0 1.25rem; }

.primary-block { padding: 3rem 0; }
.primary-block:first-of-type { padding-top: 0; }
.primary-block__head { max-width: 720px; margin: 0 auto 2rem; text-align: center; }
.primary-block__title { font-size: clamp(1.6rem, 1.1rem + 1.8vw, 2.1rem); margin: 0 0 .5rem; }
.primary-block__sub { margin: 0; color: var(--stars-muted); font-size: 1.05rem; }

/* Section titles (centred) */
.primary-block__title--center { text-align: center; max-width: 720px; margin-left: auto; margin-right: auto; }

/* Pricing note under the facts strip */
.pricing-note { text-align: center; color: var(--stars-muted); font-size: .92rem; margin: .9rem auto 0; max-width: 760px; }

/* Schedule: two columns — table + a photo to keep it light */
.primary-schedule__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; align-items: stretch; max-width: 1040px; margin: 0 auto; }
.primary-schedule__table {
    background: #ffffff; border: 1px solid var(--stars-line);
    border-radius: var(--stars-radius); box-shadow: var(--stars-shadow-sm);
    overflow: hidden;
    display: flex; flex-direction: column; justify-content: center;
}
.primary-schedule__table .primary-block__title {
    margin: 0; padding: 1rem 1.4rem; font-size: 1.1rem;
    background: var(--stars-bg-alt); border-bottom: 2px solid var(--stars-green);
}
.schedule-table { width: 100%; border-collapse: collapse; }
.schedule-table th, .schedule-table td { padding: .5rem 1.4rem; border: 0; text-align: left; font-size: .92rem; }
.schedule-table tbody tr { border-top: 1px solid var(--stars-line); }
.schedule-table tbody tr:nth-child(even) { background: rgba(16, 24, 40, .022); }
.schedule-table th { width: 46%; font-weight: 700; color: var(--stars-green-dark); white-space: nowrap; }
/* The Friday singing row — set apart as a special end-of-week item. */
.schedule-table tbody tr.schedule-table__row--special {
    background: rgba(12, 122, 46, .10);
    border-top: 1px solid rgba(12, 122, 46, .35);
}
.schedule-table tbody tr.schedule-table__row--special td { font-style: italic; color: var(--stars-ink); }
.schedule-table tbody tr.schedule-table__row--special th { color: var(--stars-green-dark); }
.primary-schedule__note {
    margin: 0; padding: .85rem 1.4rem; font-size: .8rem; color: var(--stars-muted);
    background: var(--stars-bg-alt); border-top: 1px solid var(--stars-line); text-align: center; line-height: 1.5;
}
.primary-schedule__photo { border-radius: var(--stars-radius); overflow: hidden; box-shadow: var(--stars-shadow-sm); min-height: 280px; }
.primary-schedule__photo-img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 880px) {
    .primary-schedule__grid { grid-template-columns: 1fr; }
    .primary-schedule__photo { min-height: 220px; order: -1; }
}

/* Important information — highlighted callout for parents */
.important-info {
    max-width: 900px; margin: 0 auto;
    background: rgba(12, 122, 46, .06);
    border: 1px solid rgba(12, 122, 46, .25);
    border-left: 4px solid var(--stars-green);
    border-radius: var(--stars-radius);
    padding: 1.75rem 1.75rem 1.25rem;
}
.important-info__head { display: flex; align-items: center; gap: .65rem; margin-bottom: 1.1rem; }
.important-info__badge { display: inline-flex; align-items: center; justify-content: center; width: 1.7rem; height: 1.7rem; border-radius: 50%; background: var(--stars-green); color: #ffffff; font-weight: 800; flex-shrink: 0; }
.important-info__title { margin: 0; font-size: 1.35rem; color: var(--stars-ink); }
.important-info__list { display: grid; gap: .7rem; }
.important-info__item { background: #ffffff; border-radius: var(--stars-radius-sm); padding: .85rem 1rem; font-size: .93rem; color: var(--stars-body); line-height: 1.5; }
.important-info__item strong { display: block; margin-bottom: .15rem; color: var(--stars-ink); }
.important-info__item--alert { background: rgba(220, 38, 38, .06); border: 1px solid rgba(220, 38, 38, .28); }
.important-info__item--alert strong { color: #991b1b; }

/* Learning experiences: light cards */
.activity-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.activity-card { background: #ffffff; border: 1px solid var(--stars-line); border-radius: var(--stars-radius); padding: 1.4rem; }
.activity-card__name { margin: 0 0 .15rem; font-size: 1.15rem; color: var(--stars-ink); }
.activity-card__years { margin: 0 0 .5rem; color: var(--stars-green-dark); font-weight: 700; font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; }
.activity-card__desc { margin: 0; color: var(--stars-body); font-size: .94rem; }

/* "Good to know": a clean 2-column list (no boxes) */
.info-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem 2.5rem; max-width: 820px; margin: 0 auto; }
.info-item { display: flex; flex-direction: column; gap: .12rem; padding: .3rem 0; }
.info-item__name { font-weight: 700; color: var(--stars-ink); font-size: .98rem; }
.info-item__text { color: var(--stars-muted); font-size: .94rem; }

/* Photo grid */
.photo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.photo-grid__item { position: relative; margin: 0; aspect-ratio: 4 / 3; border-radius: var(--stars-radius-sm); overflow: hidden; box-shadow: var(--stars-shadow-sm); background: var(--stars-bg-alt); }
.photo-grid__img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform var(--stars-transition); }
.photo-grid__item:hover .photo-grid__img { transform: scale(1.04); }
.photo-grid__cap { position: absolute; left: 0; right: 0; bottom: 0; margin: 0; padding: .5rem .8rem; font-size: .85rem; color: #ffffff; background: linear-gradient(to top, rgba(0, 0, 0, .7), rgba(0, 0, 0, 0)); }
.photo-grid__item { cursor: pointer; }

/* Lightbox overlay */
.stars-lightbox { position: fixed; inset: 0; z-index: 9999; display: none; background: rgba(0, 0, 0, .92); align-items: center; justify-content: center; flex-direction: column; }
.stars-lightbox.is-open { display: flex; }
.stars-lightbox__img { max-width: 90vw; max-height: 80vh; border-radius: var(--stars-radius-sm); box-shadow: 0 8px 40px rgba(0, 0, 0, .5); object-fit: contain; }
.stars-lightbox__caption { color: rgba(255, 255, 255, .85); font-size: .9rem; margin-top: 1rem; text-align: center; max-width: 600px; padding: 0 1rem; }
.stars-lightbox__close { position: absolute; top: .5rem; right: 1.5rem; background: none; border: 0; color: #ffffff; font-size: 2.5rem; cursor: pointer; line-height: 1; padding: .5rem; opacity: .7; transition: opacity var(--stars-transition); }
.stars-lightbox__close:hover { opacity: 1; }
.stars-lightbox__nav { position: absolute; top: 50%; transform: translateY(-50%); background: none; border: 0; color: #ffffff; font-size: 3rem; cursor: pointer; padding: 1rem; line-height: 1; opacity: .6; transition: opacity var(--stars-transition); }
.stars-lightbox__nav:hover { opacity: 1; }
.stars-lightbox__nav--prev { left: .5rem; }
.stars-lightbox__nav--next { right: .5rem; }

/* Video */
.video-wrap { position: relative; aspect-ratio: 16 / 9; max-width: 900px; margin: 0 auto; border-radius: var(--stars-radius); overflow: hidden; box-shadow: var(--stars-shadow); }
.video-wrap iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* About-the-programme block (intermediate) — editorial, not a table card */
.about-block__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: center; max-width: 1040px; margin: 0 auto; }
.about-block__title { font-size: clamp(1.5rem, 1.1rem + 1.5vw, 2rem); margin: 0 0 1.25rem; color: var(--stars-ink); }
.about-block__lead { font-size: 1.15rem; line-height: 1.6; color: var(--stars-body); margin-bottom: 1rem; font-weight: 500; }
.about-block__text p { font-size: 1rem; line-height: 1.6; color: var(--stars-body); margin-bottom: 1rem; }
.about-block__note { display: inline-block; background: rgba(12, 122, 46, .08); color: var(--stars-green-dark); font-weight: 600; font-size: .9rem; padding: .5rem .9rem; border-radius: 999px; margin-top: .5rem; }
.about-block__photo { border-radius: var(--stars-radius); overflow: hidden; box-shadow: var(--stars-shadow); aspect-ratio: 4 / 3; }
.about-block__photo-img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Primary template — responsive */
@media (max-width: 880px) {
    .about-block__grid { grid-template-columns: 1fr; gap: 2rem; }
    .activity-grid, .photo-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
    .activity-grid, .info-grid, .photo-grid { grid-template-columns: 1fr; }
    .primary-block { padding: 2.25rem 0; }
}

/* Inner templates — responsive */
@media (max-width: 880px) {
    .facts-grid { grid-template-columns: repeat(2, 1fr); }
    .contact-grid { grid-template-columns: 1fr; }
    .stars-form--grid { grid-template-columns: 1fr; gap: 0; }
}
@media (max-width: 480px) {
    .facts-grid { grid-template-columns: 1fr; }
}