/*
Theme Name: Torbay Theosophy
Theme URI: https://torbaytheosophy.org
Author: Rokethouse
Author URI: https://rokethouse.com
Description: A clean, print-style institutional theme for the Theosophical Society in England - Torbay Lodge. Typography-first design with editorial aesthetics. Includes members area with notice board.
Version: 2.3.4
Requires at least: 6.0
Tested up to: 6.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: torbay-theosophy
Tags: custom-menu, custom-logo, editor-style, featured-images, full-width-template, one-column, theme-options
*/

/* ==========================================================================
   CSS RESET & BASE
   ========================================================================== */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    font-size: 18px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
}

body {
    margin: 0;
    padding: 0;
    font-family: 'Source Serif 4', 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
    font-size: 1.05rem;
    font-weight: 450;
    line-height: 1.65;
    color: #1a1a1a;
    background:
        radial-gradient(
            ellipse at center,
            rgba(0,0,0,0.02) 0%,
            rgba(0,0,0,0.00) 55%,
            rgba(0,0,0,0.035) 100%
        ),
        url('https://torbay.theosophicalsociety.org.uk/wp-content/uploads/2026/01/Background6.jpg') repeat !important;
    background-color: #f3efe8 !important;
    background-size: auto !important;
    overflow-x: hidden;
    width: 100%;
    max-width: 100%;
}

/* Shared container width (keeps header + hero + page content aligned) */
:root {
    --torbay-container: 1100px;
    --torbay-navy: #0c182e;
    --torbay-navy-hover: #162f57;
}

/* ==========================================================================
   TYPOGRAPHY
   ========================================================================== */

h1, h2, h3, h4, h5, h6 {
    font-family: 'Cinzel', Georgia, serif;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #1a1a1a;
    margin-top: 0;
    line-height: 1.25;
}

h1 {
    font-size: 2.5rem;
    letter-spacing: 0.2em;
    margin-bottom: 1rem;
}

h2 {
    font-size: 1.5rem;
    margin-bottom: 1.5rem;
}

h3 {
    font-size: 1.25rem;
    margin-bottom: 1rem;
}

h4 {
    font-size: 1.05rem;
    margin-bottom: 0.75rem;
}

p {
    margin-top: 0;
    margin-bottom: 1.5rem;
}

a {
    color: #4a7ab8;
    text-decoration: none;
    transition: color 0.2s ease;
}

a:hover,
a:focus {
    color: #3a6298;
}

blockquote {
    margin: 2rem 0;
    padding: 1.5rem 2rem;
    border-left: 3px solid #4a7ab8;
    font-style: italic;
    font-size: 1.15rem;
    color: #3a3a3a;
    background: rgba(255, 255, 255, 0.4);
}

blockquote cite {
    display: block;
    margin-top: 1rem;
    font-size: 0.85rem;
    font-style: normal;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-family: 'Cinzel', Georgia, serif;
}

/* ==========================================================================
   LAYOUT
   ========================================================================== */

.site-container {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

.site-main {
    width: 100%;
    max-width: 100%;
}

.site-content {
    flex: 1;
    width: 100%;
    /* Keep pages readable, but don't make inner pages feel "tiny" on desktop */
    max-width: var(--torbay-container);
    margin: 0 auto;
    padding: 3rem 2rem;
}

.content-narrow {
    max-width: 700px;
    margin: 0 auto;
}

/* Section subhead underline (used for small H2 titles across the site) */
.site-main section h2 {
    position: relative;
    padding-bottom: 0.65rem;
}

.site-main section h2::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: min(80%, 520px);
    height: 1px;
    background: rgba(12, 24, 46, 0.35);
}

/* Don't underline the big hero title */
.hero-section h1::after,
.hero-section h2::after {
    content: none !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.site-header {
    width: 100%;
    padding: 0;
    /* Header navigation band */
    position: sticky;
    top: 0;
    z-index: 999;
    background: none;
    overflow: hidden;
}

/* Blurred header strip image + dark wash (separate layers for control) */
.site-header::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url('https://torbay.theosophicalsociety.org.uk/wp-content/uploads/2026/01/HeaderStrip.jpg');
    background-size: cover;
    background-position: center;
    filter: blur(2px);
    transform: scale(1.05);
    opacity: 1;
    pointer-events: none;
}

.site-header::after {
    content: '';
    position: absolute;
    inset: 0;
    /* Slightly darker to avoid the mid-strip looking washed out */
    background: rgba(0,0,0,0.30);
    pointer-events: none;
}

.site-header .header-inner {
    position: relative;
    z-index: 1;
}

.header-inner {
    max-width: var(--torbay-container);
    margin: 0 auto;
    padding: 1rem 2rem 0;
}

/* Header Top Row - Logo left, Public Nav centered */
.header-top {
    display: flex;
    justify-content: center; /* centre the menu text in the header band */
    align-items: center;
    padding-bottom: 0.5rem;
    position: relative;
}

/* When no logo (homepage), keep layout stable; the public nav is centred via flex */
.header-top.no-logo {
    justify-content: center;
}

/* Auth button (Login/Logout) sits above the line, right aligned */
.header-auth {
    flex-shrink: 0;
    margin-left: auto;
}

.header-auth__btn {
    display: inline-block;
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 0.55rem 0.95rem;
    border-radius: 3px;
    border: 1px solid rgba(245, 243, 239, 0.55);
    color: rgba(245, 243, 239, 0.98);
    background: rgba(255, 255, 255, 0.12);
    box-shadow: 0 10px 22px rgba(0,0,0,0.12);
    transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
    white-space: nowrap;
}

.header-auth__btn:hover,
.header-auth__btn:focus {
    transform: translateY(-1px);
    box-shadow: 0 14px 26px rgba(0,0,0,0.12);
    background: rgba(255, 255, 255, 0.18);
}

.header-auth__btn--logout {
    border-color: rgba(245, 243, 239, 0.38);
    color: rgba(245, 243, 239, 0.88);
}
.header-logo {
    /* keep the logo anchored left without pushing the menu off-centre */
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    flex-shrink: 0;
}

/* Lock header height across pages (homepage uses a hidden placeholder logo) */
.header-logo--placeholder {
    visibility: hidden;
}

.header-top {
    min-height: 72px;
}

.header-logo img {
    max-height: 50px;
    width: auto;
    display: block;
}

.header-logo a {
    display: block;
}

.header-logo-text {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #1a1a1a;
}

/* Top Navigation (Public) */
.nav-public {
    padding: 0;
    width: 100%;
}


.nav-public ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.25rem 2rem;
}

.nav-public li {
    margin: 0;
}

.nav-public a {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: rgba(245, 243, 239, 0.95);
    text-decoration: none;
    padding: 0.25rem 0;
    display: block;
    transition: color 0.2s ease;
}

.nav-public a:hover,
.nav-public a:focus,
.nav-public .current-menu-item a,
.nav-public .current_page_item a {
    color: #ffffff;
}

/* Header Divider */
.header-divider {
    /* Pin the divider to the bottom of the sticky header to avoid
       subpixel "steps" / seams on the homepage */
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: rgba(245, 243, 239, 0.55);
    margin: 0;
    border: none;
}

/* Bottom Navigation (Members) */
.nav-members {
    padding: 0.4rem 0;
}

.nav-members ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.25rem 2rem;
}

.nav-members li {
    margin: 0;
}

.nav-members a {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.7rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #4a4a4a;
    text-decoration: none;
    padding: 0.2rem 0;
    display: block;
    transition: color 0.2s ease;
}

.nav-members a:hover,
.nav-members a:focus,
.nav-members .current-menu-item a,
.nav-members .current_page_item a {
    color: #4a7ab8;
}


/*
   Members menu (logged-in):
   - vertical list under the Login/Logout button
   - MUST NOT increase header height (so it must be taken out of normal flow)
   - stays attached to the sticky header (no floating as you scroll)
*/
body.is-member .header-inner {
    position: relative;
}

body.is-member .nav-members {
    /* Keep hero position unchanged: take members menu out of normal flow */
    position: absolute;
    top: calc(100% + 0.75rem); /* below the divider line */
    right: 0;
    z-index: 1001;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.65rem;
    margin: 0;
    padding: 0;
}

body.is-member .nav-members__label {
    display: none;
}

body.is-member .nav-members a {
    display: block;
    margin: 0;
    padding: 0.75rem 0.9rem;
    font-size: 0.95rem;
    letter-spacing: 0.12em;
    color: #ffffff;
    background: rgba(22, 59, 108, 0.92);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 8px;
    text-align: center;
    box-shadow: 0 10px 24px rgba(0,0,0,0.14);
}

body.is-member .nav-members a:hover,
body.is-member .nav-members a:focus {
    color: #ffffff;
    filter: brightness(1.05);
}

/* On smaller screens: keep it right-aligned but allow full width if needed */
@media (max-width: 900px) {
    /* On small screens, keep it in-flow so it doesn't overlap important content */
    body.is-member .nav-members {
        position: static;
        padding: 0.55rem 0 0.8rem;
        margin-left: auto;
        align-items: flex-end;
    }

    body.is-member .nav-members a {
        max-width: 260px;
    }
}

/* ==========================================================================
   HOMEPAGE / FRONT PAGE
   ========================================================================== */

.front-page-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 12rem 2rem;
    text-align: center;
}

.site-logo {
    margin-bottom: 6rem;
}

.site-logo img {
    max-width: 380px;
    height: auto;
    display: block;
    margin: 0 auto;
}

.site-identity {
    text-align: center;
    margin-bottom: 4rem;
}

.site-title-main {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 3.2rem;
    font-weight: 400;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: #1a1a1a;
    margin: 0 0 0.15em;
    line-height: 1.1;
}

.site-title-sub {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 3.2rem;
    font-weight: 400;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: #1a1a1a;
    margin: 0 0 0.5em;
    line-height: 1.1;
}

.site-title-location {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 1.35rem;
    font-weight: 500;
    letter-spacing: 0.5em;
    text-transform: uppercase;
    color: #3a3a3a;
    margin: 0;
}

/* Homepage introduction text */
.front-page-intro {
    max-width: 600px;
    margin: 3rem auto 0;
    text-align: center;
}

.front-page-intro p {
    font-size: 1.05rem;
    color: #3a3a3a;
}

/* ==========================================================================
   PAGE CONTENT
   ========================================================================== */

/* Secondary Hero - Inner Page Headers - FULL WIDTH */
.page-header {
    display: block;
    box-sizing: border-box;
    text-align: center;
    padding: 7rem 2rem 6rem;
    width: 100%;
    max-width: none !important;
    margin: 0 !important;
    /* Make all inner-page headers feel like "chapters".
       Avoid the cheap/inconsistent look of different JPG strips by using a
       single, subtle etched watermark background across all pages.
       (We keep per-page classes but intentionally point them to the same asset.) */
    background-color: #f3efe8;
    background-image: url('https://torbay.theosophicalsociety.org.uk/wp-content/uploads/2026/01/MandalaBkg.jpg');
    background-repeat: repeat;
    background-size: 1400px auto;
    background-position: center;
    position: relative;
    overflow: hidden;
}

/* Cool wash + parchment wash (two layers) */
.page-header::before,
.page-header::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

/* Slight cool tint to neutralise warm/yellow hero JPGs */
.page-header::before {
    background: rgba(22, 59, 108, 0.10);
    mix-blend-mode: multiply;
}

/* Main parchment wash (reduces harshness, keeps image visible) */
.page-header::after {
    background: rgba(243, 239, 232, 0.62);
}

.page-header > * {
    position: relative;
    z-index: 1;
}

/* Option A: architectural framing so inner-page headers feel as "chapter" as the home hero */
.page-header__frame {
    display: inline-block;
    max-width: 760px;
    margin: 0 auto;
    padding: 2.05rem 2.2rem 1.8rem;
    background: rgba(252, 250, 245, 0.86);
    border: 1px solid rgba(22, 59, 108, 0.24);
    border-radius: 6px;
    box-shadow:
        0 14px 32px rgba(0,0,0,0.10),
        inset 0 0 0 1px rgba(255,255,255,0.55);
}

.page-header__frame::before,
.page-header__frame::after {
    content: "";
    display: block;
    height: 2px;
    background: linear-gradient(
        to right,
        transparent,
        rgba(22, 59, 108, 0.25),
        transparent
    );
    margin: 0.2rem auto 1.6rem;
    max-width: 520px;
    border-top: 1px solid rgba(255,255,255,0.35);
}

.page-header__frame::after {
    margin: 1.6rem auto 0;
}

@media (max-width: 700px) {
    .page-header__frame {
        padding: 1.7rem 1.4rem 1.4rem;
        border-radius: 12px;
    }
    .page-header__frame::before,
    .page-header__frame::after {
        max-width: 320px;
    }
}

/* Page-specific hero backgrounds intentionally unified (avoid inconsistent JPG strips) */
.page-header.events-page,
.page-header.resources-page,
.page-header.about-page,
.page-header.noticeboard-page,
.page-header.contact-page,
.page-header.minutes-page,
.page-header.watch-page {
    background-image: url('https://torbay.theosophicalsociety.org.uk/wp-content/uploads/2026/01/MandalaBkg.jpg');
}

.page-title {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 2.2rem;
    font-weight: 500;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: #1a1a1a;
    margin: 0 0 1rem;
    line-height: 1.2;
}

.page-intro {
    font-family: 'Source Serif 4', Georgia, serif;
    font-size: 1.05rem;
    font-weight: 400;
    font-style: normal;
    color: #3a3a3a;
    max-width: 480px;
    margin: 0 auto;
    line-height: 1.55;
}

/* Compact header variant for pages with immediate content */
.page-header--compact {
    padding: 3rem 2rem 2.5rem;
}

.page-header--compact .page-title {
    font-size: 1.8rem;
    letter-spacing: 0.25em;
}

.entry-content {
    font-size: 1.05rem;
}

.entry-content h2 {
    margin-top: 3rem;
}

.entry-content h3 {
    margin-top: 2.5rem;
}

.entry-content ul,
.entry-content ol {
    margin: 1.5rem 0;
    padding-left: 1.5rem;
}

.entry-content li {
    margin-bottom: 0.5rem;
}

.entry-content img {
    max-width: 100%;
    height: auto;
    margin: 2rem 0;
}

.entry-content figure {
    margin: 2rem 0;
}

.entry-content figcaption {
    font-size: 0.9rem;
    color: #505050;
    text-align: center;
    margin-top: 0.75rem;
    font-style: italic;
}

/* ==========================================================================
   SINGLE POST
   ========================================================================== */

.post-meta {
    text-align: center;
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.8rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #505050;
    margin-top: 0.5rem;
}

.post-meta time {
    display: inline-block;
}

.post-meta .separator {
    margin: 0 0.75rem;
}

.post-navigation {
    margin-top: 4rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(74, 122, 184, 0.3);
    display: flex;
    justify-content: space-between;
    gap: 2rem;
}

.post-navigation a {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.8rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

/* ==========================================================================
   FOOTER
   ========================================================================== */

.site-footer {
    text-align: center;
    padding: 2.5rem 2rem;
    margin-top: auto;
    background-image: url('https://torbay.theosophicalsociety.org.uk/wp-content/uploads/2026/01/BlueStrip_01.jpg');
    background-size: cover;
    background-position: center;
    position: relative;
    overflow: hidden;
}

/* Darker tint so the footer feels "finished" */
.site-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(12, 24, 46, 0.72);
    pointer-events: none;
}

.site-footer .footer-content,
.site-footer .footer-divider {
    position: relative;
    z-index: 1;
}

.footer-divider {
    width: 100%;
    max-width: 200px;
    height: 1px;
    background-color: rgba(255, 255, 255, 0.3);
    margin: 0 auto 1.5rem;
    border: none;
}

.footer-content {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.75rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #f5f3ef;
}

.footer-content p {
    margin: 0.5rem 0;
}

.footer-content a {
    color: #f5f3ef;
}

.footer-content a:hover {
    color: #ffffff;
}

/* ==========================================================================
   GUTENBERG BLOCKS SUPPORT
   ========================================================================== */

/* Alignment */
.alignwide {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
}

.alignfull {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.alignleft {
    float: left;
    margin-right: 2rem;
    margin-bottom: 1rem;
}

.alignright {
    float: right;
    margin-left: 2rem;
    margin-bottom: 1rem;
}

/* Buttons */
.wp-block-button__link {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.85rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 1rem 2rem;
    border-radius: 0;
    background-color: var(--torbay-navy);
    color: #fff;
    transition: background-color 0.2s ease;
}

.wp-block-button__link:hover {
    background-color: var(--torbay-navy-hover);
    color: #fff;
}

.is-style-outline .wp-block-button__link {
    background-color: transparent;
    border: 1px solid #4a7ab8;
    color: #4a7ab8;
}

.is-style-outline .wp-block-button__link:hover {
    background-color: #4a7ab8;
    color: #fff;
}

/* Separator */
.wp-block-separator {
    border: none;
    border-top: 1px solid rgba(74, 122, 184, 0.4);
    margin: 3rem auto;
    max-width: 200px;
}

.wp-block-separator.is-style-wide {
    max-width: 100%;
}

.wp-block-separator.is-style-dots {
    border: none;
    text-align: center;
    max-width: 100%;
}

.wp-block-separator.is-style-dots::before {
    content: '· · ·';
    color: #4a7ab8;
    font-size: 1.5rem;
    letter-spacing: 1rem;
}

/* Quote */
.wp-block-quote {
    margin: 2rem 0;
    padding: 1.5rem 2rem;
    border-left: 3px solid #4a7ab8;
    font-style: italic;
    background: rgba(255, 255, 255, 0.4);
}

.wp-block-quote cite,
.wp-block-quote footer {
    font-size: 0.85rem;
    font-style: normal;
    font-family: 'Cinzel', Georgia, serif;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-top: 1rem;
    display: block;
}

/* Pullquote */
.wp-block-pullquote {
    border-top: 1px solid #4a7ab8;
    border-bottom: 1px solid #4a7ab8;
    padding: 2rem 0;
    text-align: center;
}

.wp-block-pullquote blockquote {
    border: none;
    padding: 0;
    background: transparent;
}

.wp-block-pullquote p {
    font-size: 1.5rem;
    font-style: italic;
}

/* Table */
.wp-block-table {
    margin: 2rem 0;
}

.wp-block-table table {
    width: 100%;
    border-collapse: collapse;
}

.wp-block-table th,
.wp-block-table td {
    padding: 0.75rem 1rem;
    border: 1px solid rgba(74, 122, 184, 0.3);
    text-align: left;
}

.wp-block-table th {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.85rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    background: rgba(74, 122, 184, 0.1);
}

/* Cover */
.wp-block-cover {
    min-height: 400px;
}

.wp-block-cover-text,
.wp-block-cover p {
    font-family: 'Cinzel', Georgia, serif;
    letter-spacing: 0.1em;
}

/* Columns */
.wp-block-columns {
    gap: 3rem;
    margin: 2rem 0;
}

/* Gallery */
.wp-block-gallery {
    margin: 2rem 0;
}

/* ==========================================================================
   FORMS
   ========================================================================== */

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
textarea,
select {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 1rem;
    padding: 0.75rem 1rem;
    border: 1px solid rgba(74, 122, 184, 0.4);
    background: rgba(255, 255, 255, 0.6);
    color: #3d3d3d;
    width: 100%;
    max-width: 100%;
    transition: border-color 0.2s ease;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
textarea:focus,
select:focus {
    outline: none;
    border-color: #4a7ab8;
}

button,
input[type="button"],
input[type="submit"] {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.85rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 1rem 2rem;
    background-color: #4a7ab8;
    color: #fff;
    border: none;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

button:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
    background-color: #5a7eb0;
}

/* ==========================================================================
   UTILITY CLASSES
   ========================================================================== */

.text-center {
    text-align: center;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

.mt-0 { margin-top: 0; }
.mt-1 { margin-top: 1rem; }
.mt-2 { margin-top: 2rem; }
.mt-3 { margin-top: 3rem; }
.mt-4 { margin-top: 4rem; }

.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: 1rem; }
.mb-2 { margin-bottom: 2rem; }
.mb-3 { margin-bottom: 3rem; }
.mb-4 { margin-bottom: 4rem; }

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media screen and (max-width: 768px) {
    html {
        font-size: 15px;
    }
    
    .site-title-main,
    .site-title-sub {
        font-size: 2rem;
        letter-spacing: 0.15em;
    }
    
    .site-title-location {
        font-size: 0.9rem;
        letter-spacing: 0.2em;
    }
    
    .site-logo img {
        max-width: 150px;
    }
    
    .front-page-content {
        min-height: 60vh;
        padding: 3rem 1.5rem;
    }
    
    .site-content {
        padding: 2rem 1.5rem;
    }
    
    .nav-public ul,
    .nav-members ul {
        gap: 0.25rem 1.5rem;
    }
    
    .nav-public a {
        font-size: 0.7rem;
    }
    
    .nav-members a {
        font-size: 0.65rem;
    }
    
    h1 {
        font-size: 1.75rem;
    }
    
    h2 {
        font-size: 1.4rem;
    }
    
    .page-header {
        padding: 4rem 1.5rem 3rem;
    }
    
    .page-title {
        font-size: 1.8rem;
        letter-spacing: 0.25em;
    }
    
    .page-intro {
        font-size: 1rem;
    }
    
    blockquote {
        padding: 1rem 1.5rem;
        margin: 1.5rem 0;
    }
    
    .post-navigation {
        flex-direction: column;
        text-align: center;
    }
}

@media screen and (max-width: 480px) {
    .site-title-main,
    .site-title-sub {
        font-size: 1.6rem;
        letter-spacing: 0.1em;
    }
    
    .page-header {
        padding: 3rem 1rem 2.5rem;
    }
    
    .page-title {
        font-size: 1.5rem;
        letter-spacing: 0.2em;
    }
    
    .page-intro {
        font-size: 0.95rem;
    }
    
    .site-title-location {
        font-size: 0.8rem;
        letter-spacing: 0.15em;
    }
    
    .site-logo img {
        max-width: 120px;
    }
    
    .nav-public ul,
    .nav-members ul {
        flex-direction: column;
        gap: 0;
    }
    
    .nav-public a,
    .nav-members a {
        padding: 0.4rem 0;
    }
}

/* ==========================================================================
   PRINT STYLES
   ========================================================================== */

@media print {
    body {
        background: #fff;
        background-image: none;
        color: #000;
    }
    
    .site-header,
    .site-footer,
    .post-navigation {
        display: none;
    }
    
    .site-content {
        max-width: 100%;
        padding: 0;
    }
    
    a {
        color: #000;
        text-decoration: underline;
    }
    
    h1, h2, h3, h4, h5, h6 {
        color: #000;
        page-break-after: avoid;
    }
    
    img {
        max-width: 100% !important;
        page-break-inside: avoid;
    }
    
    blockquote {
        border-color: #000;
    }
}

/* ==========================================================================
   HOMEPAGE SECTIONS
   ========================================================================== */

/* Hero Section */
.hero-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 38vh;
    padding: 3rem 2rem;
    text-align: center;
}

.hero-inner {
    max-width: var(--torbay-container);
    margin: 0 auto;
    text-align: center;
}

.hero-logo {
    margin-bottom: 1.5rem;
}

.hero-logo img {
    max-width: 180px;
    height: auto;
    display: block;
    margin: 0 auto;
}

/* Inner page heroes - match the HOME hero language */
.hero-section--inner {
    min-height: 30vh;
    padding: 3.25rem 2rem 2.25rem;
}

.hero-section--inner .hero-inner {
    position: relative;
}

.hero-logo--locked img,
.hero-logo--locked .custom-logo {
    max-width: 180px; /* locked, same as homepage */
    height: auto;
    display: block;
    margin: 0 auto;
}

.hero-page-identity {
    text-align: center;
}

.hero-page-title {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 3.0rem;
    font-weight: 400;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    color: #1a1a1a;
    margin: 0 0 0.35em;
    line-height: 1.1;
}

.hero-page-intro {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 1.1rem;
    color: #3a3a3a;
    margin: 0;
}

/* Tiny emblem watermark inside hero only */
.hero-watermark {
    position: absolute;
    inset: 0;
    opacity: 0.03; /* ultra subtle */ /* very subtle */
    pointer-events: none;
    background-repeat: no-repeat;
    background-position: 70% 72%; /* keep off the logo */
    background-size: 1080px auto; /* bigger mark */
    mix-blend-mode: multiply;
    /* Warm it into the paper, not a cold graphic overlay */
    filter: sepia(1) saturate(12) hue-rotate(-25deg) brightness(0.55) contrast(1.1);
}

/* Simple emblem SVGs (inline data URIs) */
.hero-watermark--events {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cg fill='none' stroke='%231b2c4d' stroke-width='2'%3E%3Ccircle cx='100' cy='100' r='70'/%3E%3Cpath d='M100 30v140M30 100h140'/%3E%3Cpath d='M50 60h100v80H50z'/%3E%3C/g%3E%3C/svg%3E");
}

.hero-watermark--watch {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cg fill='none' stroke='%231b2c4d' stroke-width='2'%3E%3Ccircle cx='100' cy='100' r='70'/%3E%3Cpath d='M80 70l60 30-60 30z'/%3E%3Cpath d='M55 100c20-30 70-30 90 0-20 30-70 30-90 0z'/%3E%3C/g%3E%3C/svg%3E");
}

.hero-watermark--about {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cg fill='none' stroke='%231b2c4d' stroke-width='2'%3E%3Ccircle cx='100' cy='100' r='70'/%3E%3Cpath d='M100 40l18 40 44 4-34 28 10 44-38-22-38 22 10-44-34-28 44-4z'/%3E%3C/g%3E%3C/svg%3E");
}

.hero-watermark--resources {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cg fill='none' stroke='%231b2c4d' stroke-width='2'%3E%3Ccircle cx='100' cy='100' r='70'/%3E%3Cpath d='M70 65h70v90H70z'/%3E%3Cpath d='M85 80h40M85 95h40M85 110h40'/%3E%3C/g%3E%3C/svg%3E");
}

.hero-watermark--contact {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cg fill='none' stroke='%231b2c4d' stroke-width='2'%3E%3Ccircle cx='100' cy='100' r='70'/%3E%3Cpath d='M100 45c-20 0-36 16-36 36 0 30 36 74 36 74s36-44 36-74c0-20-16-36-36-36z'/%3E%3Ccircle cx='100' cy='81' r='10'/%3E%3C/g%3E%3C/svg%3E");
}

.hero-watermark--noticeboard {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cg fill='none' stroke='%231b2c4d' stroke-width='2'%3E%3Ccircle cx='100' cy='100' r='70'/%3E%3Cpath d='M60 70h80v60H60z'/%3E%3Cpath d='M70 85h60M70 100h40M70 115h50'/%3E%3C/g%3E%3C/svg%3E");
}

/* Container */
.container {
    max-width: var(--torbay-container);
    margin: 0 auto;
    padding: 0 2rem;
}

/* Section Dividers */
.section-divider {
    text-align: center;
    padding: 1.5rem 0;
}

.section-divider.small {
    padding: 1rem 0;
}

.divider-image {
    max-width: 560px;
    height: auto;
    opacity: 0.75;
}

/* Next Event Section */
.section-next-event {
    padding: 3rem 0;
    position: relative;
    overflow: hidden;
}

/* Calendar-style rules instead of a banner background */
.section-next-event .container {
    position: relative;
}

.event-card {
    background: #fdfcfa;
    border: none;
    border-left: 4px solid #3a6298;
    padding: 2rem 2rem 1.75rem;
    max-width: 680px;
    margin: 0 auto;
    position: relative;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

/* Remove tiny extra rules (the divider images handle separation) */
.event-card::before,
.event-card::after {
    content: none;
}

.event-card.featured {
    border-left-width: 4px;
}

/* Emblem positioned in right side of event card - half box height */
.event-card__emblem {
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    height: 70%;
    width: auto;
    opacity: 0.18;
    pointer-events: none;
}

.event-label {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: #ffffff;
    background: #3a6298;
    display: inline-block;
    padding: 0.4rem 0.8rem;
    margin-bottom: 1rem;
}

/* Next Event layout: main left, date/time right */
.event-grid {
    display: flex;
    gap: 2.0rem;
    align-items: flex-start;
}

.event-main {
    flex: 1;
    min-width: 0;
}

.event-meta {
    flex: 0 0 210px;
    text-align: right;
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.95rem;
    letter-spacing: 0.02em;
    color: #1a1a1a;
    padding-left: 1.25rem;
    border-left: 1px solid rgba(0, 0, 0, 0.08);
}

.event-meta .event-when {
    padding-top: 0.15rem;
}

@media (max-width: 700px) {
    .event-grid {
        flex-direction: column;
        gap: 1.25rem;
    }
    .event-meta {
        flex: 1 1 auto;
        text-align: left;
        padding-left: 0;
        border-left: none;
        border-top: 1px solid rgba(0, 0, 0, 0.08);
        padding-top: 1rem;
    }
}

.event-tags {
    margin-top: 1rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.tag-pill {
    display: inline-block;
    font-size: 0.75rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 0.3rem 0.55rem;
    border-radius: 10px;
    border: 1px solid rgba(27, 44, 77, 0.22);
    background: rgba(255, 255, 255, 0.55);
    color: rgba(27, 44, 77, 0.85);
}

.event-details .event-when {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.95rem;
    font-weight: 500;
    letter-spacing: 0.02em;
    color: #1a1a1a;
    margin-bottom: 1rem;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.event-details .event-title {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 1.4rem;
    font-weight: 400;
    letter-spacing: 0.01em;
    color: #111111;
    margin: 0 0 1rem;
    text-transform: none;
    line-height: 1.35;
}

.event-details .event-speaker {
    font-size: 0.95rem;
    color: #2a2a2a;
    margin-bottom: 1rem;
    font-style: italic;
}

.event-details .event-blurb {
    line-height: 1.65;
    margin-bottom: 1rem;
    color: #1a1a1a;
}

.event-details .event-tags {
    font-size: 0.8rem;
    color: #555555;
    font-style: italic;
    margin-bottom: 0;
}

/* About Introduction Section */
.section-about-intro {
    padding: 3rem 0;
}

.about-intro-grid {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 2.5rem;
    align-items: center;
}

.about-intro-text {
    text-align: left;
}

.about-intro-text p {
    line-height: 1.65;
}

.about-intro-image img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* What is Theosophy Section */
.section-what-is-theosophy {
    background-size: cover;
    background-position: center right;
    /* "fixed" backgrounds jitter badly on some browsers; keep it stable */
    background-attachment: scroll;
    padding: 3rem 0;
    min-height: 450px;
    display: flex;
    align-items: center;
}

.theosophy-content-box {
    background: rgba(253, 252, 250, 0.97);
    padding: 2.5rem;
    max-width: 620px;
    border: none;
    border-left: 4px solid #3a6298;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.07);
}

.theosophy-content-box h2 {
    margin-top: 0;
    margin-bottom: 1.25rem;
}

.theosophy-content-box p {
    line-height: 1.65;
}

.theosophy-content-box p:last-child {
    margin-bottom: 0;
}

/* About Torbay Lodge Section */
.section-about-lodge {
    padding: 2.5rem 0;
}

/* Keep this section in the same comfortable measure as the home contact block */
.section-about-lodge .container {
    max-width: 900px;
}

.about-lodge-grid {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 2.5rem;
    align-items: start;
}

.about-lodge-image img {
    max-width: 100%;
    height: auto;
    display: block;
    padding: 6px;
    border-radius: 10px;
    border: 1px solid rgba(27, 44, 77, 0.24);
    background: rgba(255, 255, 255, 0.55);
}

.about-lodge-image img + img {
    margin-top: 1.5rem;
}

.about-lodge-text h2 {
    margin-top: 0;
}

.about-lodge-text p {
    line-height: 1.65;
}

/* Finding Us Section */
.section-finding-us {
    padding: 3.5rem 0;
    background-image: url('https://torbay.theosophicalsociety.org.uk/wp-content/uploads/2026/01/BlueStrip_01.jpg');
    background-size: cover;
    background-position: center;
    position: relative;
}

/* Crisp top/bottom edges on the blue strip */
.section-finding-us::before,
.section-finding-us::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 2px;
    background: rgba(27, 44, 77, 0.75);
}

.section-finding-us::before { top: 0; }
.section-finding-us::after { bottom: 0; }

.section-finding-us .container {
    max-width: 720px;
}

.section-finding-us .finding-us-box {
    background: rgba(255, 255, 255, 0.96);
    padding: 2.6rem 2.75rem;
    border-radius: 16px;
    border: 1px solid rgba(58, 98, 152, 0.18);
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.14);
}

.section-finding-us h2 {
    text-align: center;
    margin-bottom: 1.5rem;
    color: #1a1a1a;
}

.section-finding-us p {
    color: #2a2a2a;
}

.parking-note {
    font-size: 0.9rem;
    color: #505050;
    font-style: italic;
    margin-top: 1.25rem;
}

/* Contact Section */
.section-contact {
    padding: 2.5rem 0 3rem;
}

.section-contact h2 {
    text-align: center;
    margin-bottom: 2rem;
}

.contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2.5rem;
    max-width: 900px;
    margin: 0 auto;
}

.contact-info h4 {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.9rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #4a4a4a;
    margin-top: 1.5rem;
    margin-bottom: 0.5rem;
}

.contact-info h4:first-child {
    margin-top: 0;
}

.contact-info p {
    margin-bottom: 0.5rem;
}

.contact-note {
    font-size: 0.9rem;
    color: #505050;
    font-style: italic;
}

.contact-buttons {
    margin-top: 2rem;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.contact-map iframe {
    display: block;
    border-radius: 2px;
}

/* Buttons */
.btn {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.8rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 0.875rem 1.75rem;
    display: inline-block;
    text-decoration: none;
    transition: all 0.2s ease;
    cursor: pointer;
    border: none;
}

.btn-primary {
    background-color: var(--torbay-navy);
    color: #fff;
}

.btn-primary:hover {
    background-color: var(--torbay-navy-hover);
    color: #fff;
}

.btn-outline {
    background-color: transparent;
    border: 1px solid var(--torbay-navy);
    color: var(--torbay-navy);
}

.btn-outline:hover {
    background-color: var(--torbay-navy);
    color: #fff;
}

.btn-small {
    font-size: 0.7rem;
    padding: 0.5rem 1rem;
    letter-spacing: 0.1em;
}

/* ==========================================================================
   TABS COMPONENT
   ========================================================================== */

.tabs-container {
    margin: 2rem 0;
}

.tabs-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: center;
    margin-bottom: 2rem;
    border-bottom: 1px solid rgba(74, 122, 184, 0.3);
    padding-bottom: 1rem;
}

.tab-btn {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.75rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 0.85rem 1.5rem;
    background: rgba(255, 255, 255, 0.6);
    border: 1px solid rgba(74, 122, 184, 0.3);
    color: #3a3a3a;
    cursor: pointer;
    transition: all 0.2s ease;
}

.tab-btn:hover {
    background: rgba(255, 255, 255, 0.9);
    border-color: rgba(74, 122, 184, 0.5);
    color: #1a1a1a;
}

.tab-btn.active {
    color: #fff;
    background: #3a6298;
    border-color: #3a6298;
}

.tabs-content {
    max-width: 750px;
    margin: 0 auto;
    background: rgba(255, 255, 255, 0.4);
    padding: 2rem 2.5rem;
    border: 1px solid rgba(74, 122, 184, 0.15);
}

.tab-panel {
    display: none;
}

.tab-panel.active {
    display: block;
}

.tab-panel h3 {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
}

.tab-panel h3:first-of-type {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}

/* ==========================================================================
   PAGE TEMPLATES
   ========================================================================== */

/* Page Header */
.page-intro {
    font-size: 1.05rem;
    color: #3a3a3a;
    text-align: center;
    max-width: 600px;
    margin: 0 auto;
}

/* About Page */
.building-image {
    margin-top: 2rem;
}

.building-image img {
    max-width: 100%;
    height: auto;
    display: block;
}

.membership-cta {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(74, 122, 184, 0.2);
    text-align: center;
}

/* Resources Page - Objects */
.objects-list {
    margin: 2rem 0;
}

.object-item {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
    padding: 1.5rem;
    background: rgba(255, 255, 255, 0.5);
    border-left: 3px solid #4a7ab8;
}

.object-number {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 1.5rem;
    color: #4a7ab8;
    flex-shrink: 0;
    width: 40px;
    text-align: center;
}

.object-item p {
    margin: 0;
    flex: 1;
}

/* Resources Page - Authors */
.authors-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 2rem;
    margin: 2rem 0;
}

.author-card {
    background: rgba(255, 255, 255, 0.5);
    padding: 1.5rem;
    border: 1px solid rgba(74, 122, 184, 0.2);
}

.author-card h4 {
    margin-top: 0;
    margin-bottom: 0.25rem;
}

.author-dates {
    font-size: 0.9rem;
    color: #4a7ab8;
    margin-bottom: 1rem;
}

.author-card p:last-child {
    margin-bottom: 0;
}

/* Resources Page - Library Note */
.library-note {
    background: rgba(74, 122, 184, 0.1);
    padding: 1.5rem;
    margin-top: 2rem;
    border-left: 3px solid #4a7ab8;
}

.library-note p {
    margin: 0;
}

/* Resources Page - External Links */
.external-links {
    display: grid;
    gap: 1.5rem;
    margin: 2rem 0;
}

.external-link-card {
    background: rgba(255, 255, 255, 0.5);
    padding: 1.5rem;
    border: 1px solid rgba(74, 122, 184, 0.2);
}

.external-link-card h4 {
    margin-top: 0;
    margin-bottom: 0.5rem;
}

.external-link-card p {
    margin-bottom: 0.75rem;
    font-size: 0.95rem;
}

.external-link {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.8rem;
    letter-spacing: 0.1em;
}

.external-note {
    font-size: 0.9rem;
    color: #505050;
    font-style: italic;
    text-align: center;
    margin-top: 2rem;
}

/* Events Page */
.events-page {
    /* Don't double-constrain inside .site-content (prevents the "tiny" Events page) */
    max-width: none;
    margin: 0;
}

.events-section {
    margin-bottom: 2rem;
}

.events-section h2 {
    text-align: center;
    margin-bottom: 2rem;
}

/* Events Programme */
.events-programme {
    margin-bottom: 3rem;
}

.events-year-group {
    margin-bottom: 3rem;
}

.events-year {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 1.15rem;
    font-weight: 600;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: #2b2b2b;
    margin: 0 0 1.75rem;
    text-align: center;
    position: relative;
    padding: 0.75rem 0;
}

.events-year::before,
.events-year::after {
    content: "";
    position: absolute;
    bottom: 0;
    width: 34%;
    height: 1px;
    background: rgba(22, 56, 102, 0.25);
}

.events-year::before { left: 0; }
.events-year::after  { right: 0; }

.events-list {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Individual Event Item - Card Style */
.event-item {
    padding: 1.9rem 2.15rem;
    position: relative;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 14px;
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.07);
}

.event-item:last-child {
    /* No special styling needed - all cards are equal */
}

.event-item--next {
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(74, 122, 184, 0.25);
    box-shadow: 0 3px 12px rgba(74, 122, 184, 0.08);
}

/* Featured event wrapper with subtle gold strip background */
.event-featured-wrapper {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    padding: 2.75rem 2rem;
    position: relative;
    overflow: hidden;
    margin-bottom: 1.5rem;
}

.event-featured-wrapper::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url('https://torbay.theosophicalsociety.org.uk/wp-content/uploads/2026/01/GoldenStripBKG.jpg');
    background-size: cover;
    background-position: center;
    opacity: 0.25;
    pointer-events: none;
}

.event-featured-wrapper > * {
    position: relative;
    z-index: 1;
}

.event-featured-wrapper .event-item {
    max-width: 740px;
    margin: 0 auto;
    background: rgba(255, 255, 255, 0.96);
}

.event-item__badge {
    position: absolute;
    top: 1.75rem;
    right: 2rem;
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.6rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #4a7ab8;
    background: rgba(74, 122, 184, 0.1);
    padding: 0.25rem 0.5rem;
}

.event-item--next .event-item__badge {
    color: #fff;
    background: #3a6298;
}

.event-item__date {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.95rem;
    font-weight: 500;
    letter-spacing: 0.02em;
    color: #1a1a1a;
    margin-bottom: 0.75rem;
}

.event-item__title {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 1.25rem;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
    color: #1a1a1a;
    margin: 0 0 0.5rem;
    line-height: 1.35;
    max-width: 90%;
}

.event-item__speaker {
    font-size: 0.9rem;
    font-style: italic;
    color: #555;
    margin-bottom: 0.75rem;
}

.event-item__description {
    font-size: 0.95rem;
    line-height: 1.6;
    color: #333;
    margin-bottom: 0.5rem;
}

.event-item__tags {
    font-size: 0.8rem;
    color: #777;
    font-style: italic;
}

/* Events Activities & Attending */
.events-activities,
.events-attending {
    max-width: 620px;
    margin: 0 auto 2rem;
}

.events-activities h2,
.events-attending h2 {
    text-align: center;
    margin-bottom: 1.5rem;
}

.activities-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 2rem;
}

.activity-card {
    background: rgba(255, 255, 255, 0.5);
    padding: 1.5rem;
    border: 1px solid rgba(74, 122, 184, 0.2);
}

.activity-card h4 {
    margin-top: 0;
    color: #4a7ab8;
}

.activity-card p {
    margin-bottom: 0;
    font-size: 0.95rem;
}

.attending-info {
    max-width: 650px;
    margin: 0 auto;
}

.attending-info h4 {
    margin-top: 1.5rem;
    margin-bottom: 0.5rem;
}

.attending-cta {
    margin-top: 2rem;
    text-align: center;
}

/* Contact Page */
.contact-page-grid {
    display: grid;
    /* Keep map close to the text block and avoid huge empty gutters */
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    margin-bottom: 2rem;
    align-items: start;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

.contact-note {
    max-width: 48ch;
}

.contact-page-map {
    min-width: 0;
}


.contact-block {
    margin-bottom: 2rem;
}

.contact-block h3 {
    font-size: 1rem;
    margin-bottom: 0.75rem;
}

.phone-number {
    font-size: 1.3rem;
    color: #4a4a4a;
    margin-bottom: 0.5rem;
}

.email-link {
    font-size: 1.1rem;
}

.contact-page-map iframe {
    display: block;
    border-radius: 2px;
}

.finding-us-section {
    max-width: 700px;
    margin: 0 auto;
}

.finding-us-section h2 {
    text-align: center;
    margin-bottom: 2rem;
}

.directions-content {
    text-align: left;
}

.parking-notice {
    background: rgba(74, 122, 184, 0.1);
    padding: 1.5rem;
    margin-top: 2rem;
    border-left: 3px solid #4a7ab8;
}

.parking-notice h4 {
    margin-top: 0;
    margin-bottom: 0.5rem;
}

.parking-notice p {
    margin-bottom: 0;
}

/* ==========================================================================
   MEMBERS SECTION - LOGIN & NAVIGATION
   ========================================================================== */

/* Members Nav - Subordinate Row */
.nav-members {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1.25rem;
    padding: 0.35rem 0;
}

.nav-members__label {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #666;
}

.nav-members a {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #555;
    text-decoration: none;
    transition: color 0.2s ease;
}

.nav-members a:hover {
    color: #4a7ab8;
}

.nav-members__logout {
    color: #999 !important;
}

.nav-members__logout:hover {
    color: #b44 !important;
}

.nav-members__login {
    color: #777 !important;
}

.nav-members__login:hover {
    color: #4a7ab8 !important;
}

/* --------------------------------------------------------------------------
   MEMBER BUTTONS (Logged-in): make them look like calm, typographic plates
   - less "SaaS pill"
   - clearer, larger
   - vertical on the right on desktop
   -------------------------------------------------------------------------- */

/* IMPORTANT: keep hero position stable.
   Members menu must NOT increase header height.
   Take it out of normal flow and anchor it to the sticky header.
*/
.site-header .header-inner { position: relative; }

body.is-member .nav-members {
    position: absolute;
    right: 0;
    top: calc(100% + 0.65rem); /* sits just below the header divider */
    z-index: 50;
    padding: 0;
    margin: 0;

    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.65rem;
}

body.is-member .nav-members__label {
    display: none;
}

body.is-member .nav-members a {
    display: block;
    min-width: 180px;
    padding: 0.85rem 1rem;
    font-size: 0.92rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;

    /* Plate styling (ties directly to the blue header band)
       Use the same textured strip, but as a small "plaque".
       This stops it looking like generic UI widgets.
    */
    color: rgba(255,255,255,0.96);
    background-image:
        linear-gradient(rgba(0,0,0,0.35), rgba(0,0,0,0.35)),
        url('https://torbay.theosophicalsociety.org.uk/wp-content/uploads/2026/01/BlueStrip_01.jpg');
    background-size: cover;
    background-position: center;
    border: 1px solid rgba(255,255,255,0.30);
    border-radius: 6px;
    box-shadow:
        0 10px 22px rgba(0,0,0,0.18),
        inset 0 0 0 1px rgba(255,255,255,0.16),
        inset 0 -1px 0 rgba(0,0,0,0.25);
    text-shadow: 0 1px 0 rgba(0,0,0,0.25);

    transition: filter 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

body.is-member .nav-members a:hover,
body.is-member .nav-members a:focus {
    filter: brightness(1.08);
    border-color: rgba(255,255,255,0.42);
    color: rgba(255,255,255,0.99);
}

/* Logout: slightly "outlined" so it doesn't shout */
body.is-member .nav-members a.nav-members__logout {
    /* Same plaque, but more "outlined" */
    background-image:
        linear-gradient(rgba(0,0,0,0.55), rgba(0,0,0,0.55)),
        url('https://torbay.theosophicalsociety.org.uk/wp-content/uploads/2026/01/BlueStrip_01.jpg');
    border-color: rgba(255,255,255,0.22);
    color: rgba(255,255,255,0.92);
    box-shadow:
        0 10px 22px rgba(0,0,0,0.16),
        inset 0 0 0 1px rgba(255,255,255,0.10),
        inset 0 -1px 0 rgba(0,0,0,0.28);
}

body.is-member .nav-members a.nav-members__logout:hover,
body.is-member .nav-members a.nav-members__logout:focus {
    filter: brightness(1.06);
    border-color: rgba(255,255,255,0.34);
    color: rgba(255,255,255,0.98);
}

/* On smaller screens: keep it in flow, still stacked and readable */
@media (max-width: 900px) {
    body.is-member .nav-members {
        position: static;
        padding: 0.6rem 0 0.2rem;
        margin-left: auto;
        align-items: flex-end;
    }

    body.is-member .nav-members a {
        min-width: 0;
        width: auto;
        max-width: 260px;
    }
}

/* Login Success Banner */
.login-banner {
    text-align: center;
    padding: 0.75rem 1rem;
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.8rem;
    letter-spacing: 0.1em;
}

.login-banner--success {
    background: #4a7ab8;
    color: #fff;
}

/* Login Modal */
.login-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-modal__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
}

.login-modal__box {
    position: relative;
    background: #f5f3ef;
    padding: 2.5rem;
    max-width: 360px;
    width: 90%;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.login-modal__close {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #999;
    cursor: pointer;
    line-height: 1;
    padding: 0.25rem;
}

.login-modal__close:hover {
    color: #333;
}

.login-modal__box h3 {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 1rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    text-align: center;
    margin: 0 0 1.5rem;
    color: #333;
}

.login-modal__error {
    background: #fef2f2;
    border: 1px solid #fca5a5;
    color: #b91c1c;
    padding: 0.75rem 1rem;
    margin-bottom: 1.25rem;
    font-size: 0.9rem;
    text-align: center;
}

.login-modal__form label {
    display: block;
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.7rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #666;
    margin-bottom: 0.5rem;
}

.login-modal__form input[type="password"] {
    width: 100%;
    margin-bottom: 1.25rem;
    font-size: 1rem;
    padding: 0.75rem;
}

.login-modal__form .btn {
    width: 100%;
}

.login-modal__help {
    font-size: 0.8rem;
    color: #888;
    text-align: center;
    margin: 1.25rem 0 0;
    font-style: italic;
}

/* ==========================================================================
   RESPONSIVE - HOMEPAGE & PAGE TEMPLATES
   ========================================================================== */

@media screen and (max-width: 900px) {
    .header-top {
        flex-direction: column;
        align-items: center;
        gap: 0.75rem;
    }
    
    .nav-public ul {
        justify-content: center;
    }
    
    .nav-members ul {
        justify-content: center;
    }
    
    .about-intro-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .about-intro-image {
        order: -1;
        text-align: center;
    }
    
    .about-intro-image img {
        max-width: 250px;
        margin: 0 auto;
    }
    
    .about-lodge-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .about-lodge-image {
        order: -1;
    }
    
    .about-lodge-image img {
        max-width: 400px;
        margin: 0 auto;
    }
    
    .contact-grid {
        grid-template-columns: 1fr;
    }
    
    .contact-page-grid {
        grid-template-columns: 1fr;
    }
}

@media screen and (max-width: 768px) {
    .hero-section {
        min-height: 32vh;
        padding: 2.5rem 1.5rem;
    }
    
    .site-title-main,
    .site-title-sub {
        font-size: 1.8rem;
        letter-spacing: 0.15em;
    }
    
    .site-title-location {
        font-size: 1rem;
    }
    
    .section-what-is-theosophy {
        background-attachment: scroll;
        padding: 2.5rem 1.5rem;
    }
    
    .theosophy-content-box {
        padding: 2rem;
    }
    
    .event-card {
        padding: 2rem;
    }
    
    .event-card__emblem {
        height: 60%;
        right: 0.75rem;
        opacity: 0.15;
    }
    
    .tabs-nav {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }
    
    .tab-btn {
        padding: 0.75rem 1rem;
        text-align: center;
        border-bottom: 1px solid rgba(74, 122, 184, 0.2);
    }
    
    .tab-btn:last-child {
        border-bottom: none;
    }
    
    .authors-grid {
        grid-template-columns: 1fr;
    }
    
    .activities-grid {
        grid-template-columns: 1fr;
    }
    
    .object-item {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .object-number {
        width: auto;
        text-align: left;
    }
}

@media screen and (max-width: 480px) {
    .header-logo img {
        max-height: 40px;
    }
    
    .nav-public ul,
    .nav-members ul {
        flex-direction: column;
        gap: 0.25rem;
        align-items: center;
    }
    
    .site-title-main,
    .site-title-sub {
        font-size: 1.5rem;
        letter-spacing: 0.1em;
    }
    
    .site-title-location {
        font-size: 0.9rem;
        letter-spacing: 0.25em;
    }
    
    .divider-image {
        max-width: 200px;
    }
    
    .event-card {
        padding: 1.5rem;
    }
    
    .event-card__emblem {
        height: 50%;
        right: 0.5rem;
        opacity: 0.12;
    }
    
    .theosophy-content-box {
        padding: 1.5rem;
    }
    
    .contact-buttons {
        flex-direction: column;
    }
    
    .contact-buttons .btn {
        width: 100%;
        text-align: center;
    }
}

/* ==========================================================================
   WATCH PAGE
   ========================================================================== */

.watch-page {
    max-width: 800px;
    margin: 0 auto;
}

.watch-live {
    margin-bottom: 3rem;
}

.watch-live h2,
.watch-recordings h2 {
    text-align: center;
    margin-bottom: 2rem;
}

.watch-player {
    background: #1a1a1a;
    aspect-ratio: 16 / 9;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #999;
}

.watch-player__placeholder p {
    margin: 0.5rem 0;
}

.watch-player__note {
    font-size: 0.85rem;
    font-style: italic;
}

.watch-recordings {
    margin-bottom: 2rem;
}

.recordings-list {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.recording-item {
    padding: 1.5rem;
    background: rgba(255, 255, 255, 0.5);
    border-left: 3px solid #3a6298;
}

.recording-item__date {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.8rem;
    letter-spacing: 0.1em;
    color: #666;
    margin-bottom: 0.5rem;
}

.recording-item__title {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 1.15rem;
    font-weight: 400;
    margin: 0 0 0.25rem;
    color: #1a1a1a;
}

.recording-item__speaker {
    font-style: italic;
    color: #555;
    margin-bottom: 0.75rem;
}

.recording-item__link {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.8rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #3a6298;
}

.recording-item__link:hover {
    color: #1a1a1a;
}

/* ==========================================================================
   NOTICE BOARD
   ========================================================================== */

.noticeboard-page {
    max-width: 720px;
    margin: 0 auto;
}

/* Members hub (tabbed internal pages, still public) */
.members-hub {
    max-width: 820px;
    margin: 0 auto;
}

.members-tabs {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin: 0 0 2rem;
    padding: 0.25rem 0;
}

.members-tab {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.75rem;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 0.55rem 0.9rem;
    border-radius: 14px;
    border: 1px solid rgba(27, 44, 77, 0.20);
    background: rgba(255, 255, 255, 0.35);
    color: rgba(27, 44, 77, 0.85);
    transition: transform 0.15s ease, background 0.15s ease;
}

.members-tab:hover {
    transform: translateY(-1px);
    background: rgba(255, 255, 255, 0.55);
}

.members-tab.is-active {
    border-color: rgba(58, 98, 152, 0.42);
    background: rgba(255, 255, 255, 0.72);
}

.members-panel {
    max-width: 900px;
    margin: 0 auto;
}

/* Add Notice Form */
.noticeboard-add-form {
    margin-bottom: 2.5rem;
}

.form-toggle {
    text-align: center;
    margin-bottom: 1.5rem;
}

.notice-form {
    background: rgba(255, 255, 255, 0.5);
    padding: 2rem;
    border: 1px solid rgba(74, 122, 184, 0.2);
    margin-top: 1rem;
}

.form-group {
    margin-bottom: 1.25rem;
}

.form-row {
    display: flex;
    gap: 1.5rem;
}

.form-group-half {
    flex: 1;
}

.notice-form label {
    display: block;
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.75rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #505050;
    margin-bottom: 0.5rem;
}

.notice-form textarea,
.notice-form input[type="url"],
.notice-form select {
    width: 100%;
    font-family: 'Source Serif 4', Georgia, serif;
    font-size: 0.95rem;
}

.notice-form textarea {
    resize: vertical;
    min-height: 80px;
}

.image-upload-area {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.image-preview {
    flex-shrink: 0;
}

.image-preview img {
    max-width: 80px;
    max-height: 80px;
    border: 1px solid rgba(74, 122, 184, 0.3);
}

.form-actions {
    display: flex;
    gap: 1rem;
    margin-top: 1.5rem;
}

.form-message {
    margin-top: 1rem;
    padding: 0.75rem 1rem;
    font-size: 0.9rem;
    display: none;
}

.form-message.success {
    background: rgba(76, 175, 80, 0.1);
    color: #2e7d32;
    border: 1px solid rgba(76, 175, 80, 0.3);
    display: block;
}

.form-message.error {
    background: rgba(244, 67, 54, 0.1);
    color: #c62828;
    border: 1px solid rgba(244, 67, 54, 0.3);
    display: block;
}

/* Filter Tags */
.noticeboard-filters {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(74, 122, 184, 0.15);
}

.filter-label {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.7rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #707070;
    margin-right: 0.5rem;
}

.filter-tag {
    font-family: 'Source Serif 4', Georgia, serif;
    font-size: 0.8rem;
    color: #606060;
    padding: 0.25rem 0.6rem;
    text-decoration: none;
    border-radius: 2px;
    transition: all 0.15s ease;
}

.filter-tag:hover {
    color: #3a6298;
    background: rgba(74, 122, 184, 0.08);
}

.filter-tag.active {
    color: #3a6298;
    background: rgba(74, 122, 184, 0.12);
    font-weight: 500;
}

/* Year Groups */
.year-group {
    margin-bottom: 2.5rem;
}

.year-heading {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.9rem;
    font-weight: 500;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #808080;
    margin-bottom: 1.25rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

/* Notice Items */
.notices-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.notice-item {
    background: #fdfcfa;
    padding: 1.25rem 1.5rem;
    position: relative;
    border-left: 3px solid transparent;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    transition: box-shadow 0.15s ease;
}

.notice-item:hover {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

.notice-pin {
    position: absolute;
    top: -4px;
    left: 50%;
    transform: translateX(-50%);
    width: 10px;
    height: 10px;
    background: #c9b896;
    border-radius: 50%;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.notice-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
}

.notice-tag {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.65rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 0.2rem 0.5rem;
    background: rgba(0, 0, 0, 0.04);
    color: #606060;
}

.notice-tag.tag-external-link { 
    color: #4a7ab8; 
    background: rgba(74, 122, 184, 0.08);
}
.notice-tag.tag-suggestion { 
    color: #7b8a5c; 
    background: rgba(123, 138, 92, 0.1);
}
.notice-tag.tag-question { 
    color: #9a7b4f; 
    background: rgba(154, 123, 79, 0.1);
}
.notice-tag.tag-note { 
    color: #707070; 
    background: rgba(0, 0, 0, 0.04);
}

.notice-date {
    font-size: 0.8rem;
    color: #909090;
    font-style: italic;
}

.notice-content {
    font-size: 0.95rem;
    line-height: 1.6;
    color: #2a2a2a;
}

.notice-content p {
    margin: 0 0 0.75rem;
}

.notice-content p:last-child {
    margin-bottom: 0;
}

.notice-link {
    margin-top: 0.5rem;
}

.notice-link a {
    font-size: 0.85rem;
    color: #4a7ab8;
}

/* YouTube Preview */
.notice-youtube-preview {
    margin-top: 1rem;
    position: relative;
    display: inline-block;
}

.notice-youtube-preview a {
    display: block;
    position: relative;
}

.notice-youtube-preview img {
    max-width: 280px;
    height: auto;
    display: block;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.youtube-play-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 50px;
    height: 35px;
    background: rgba(0, 0, 0, 0.7);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    border-radius: 6px;
    transition: background 0.15s ease;
}

.notice-youtube-preview a:hover .youtube-play-icon {
    background: #cc0000;
}

/* YouTube Embed */
.notice-youtube-embed {
    margin-top: 1rem;
    position: relative;
    width: 100%;
    max-width: 400px;
    padding-bottom: 56.25%; /* 16:9 aspect ratio */
    height: 0;
    overflow: hidden;
}

.notice-youtube-embed iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

/* Notice Image */
.notice-image {
    margin-top: 1rem;
}

.notice-image img {
    max-width: 100%;
    max-height: 300px;
    height: auto;
    border: 1px solid rgba(0, 0, 0, 0.08);
}

/* Delete Button */
.notice-delete {
    position: absolute;
    bottom: 0.7rem;
    right: 0.8rem;
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.65rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(196, 68, 68, 0.85);
    cursor: pointer;
    opacity: 0.55;
    transition: opacity 0.15s ease, transform 0.15s ease;
}

.notice-item:hover .notice-delete {
    opacity: 0.95;
}

.notice-delete:hover {
    transform: translateY(-1px);
}

.notice-delete.is-disabled {
    color: rgba(0,0,0,0.32);
    cursor: default;
    opacity: 0.25;
}

/* No Notices */
.no-notices {
    text-align: center;
    padding: 3rem 2rem;
    color: #808080;
    font-style: italic;
}

/* ==========================================================================
   EVENTS LIST (old - removed, see Events Page section)
   ========================================================================== */

/* ==========================================================================
   RESPONSIVE - NOTICE BOARD
   ========================================================================== */

@media screen and (max-width: 600px) {
    .form-row {
        flex-direction: column;
        gap: 0;
    }
    
    .noticeboard-filters {
        justify-content: center;
    }
    
    .filter-label {
        width: 100%;
        text-align: center;
        margin-bottom: 0.5rem;
    }
    
    .notice-item {
        padding: 1rem 1.25rem;
    }
    
    .notice-youtube-preview img {
        max-width: 100%;
    }
    
    .form-actions {
        flex-direction: column;
    }
    
    .form-actions .btn {
        width: 100%;
    }
}

/* ======================================================================
   SECRET GATEWAY (HOME PAGE)
   Subtle, unlabelled link to the inner section.
   ====================================================================== */

.secret-gateway {
    padding: 2.5rem 0 4rem;
    text-align: center;
}

.secret-gateway__link {
    display: inline-block;
    text-decoration: none;
}

.secret-gateway__image {
    width: 120px;
    max-width: 42vw;
    height: auto;
    opacity: 0.28;
    transition: opacity 180ms ease;
}

.secret-gateway__link:hover .secret-gateway__image,
.secret-gateway__link:focus .secret-gateway__image {
    opacity: 0.40;
}

/* =====================================================================
   MINUTES: subtle add control
   ===================================================================== */
.minutes-footer-control {
    display: flex;
    justify-content: flex-end;
    padding-top: 1.25rem;
}

.minutes-add-hidden {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.7rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(12, 24, 46, 0.55);
    text-decoration: none;
    opacity: 0.35;
    transition: opacity 0.15s ease;
}

.minutes-add-hidden:hover,
.minutes-add-hidden:focus {
    opacity: 0.9;
}


/* Events page month grouping */
.events-month-divider{
    display:flex;
    align-items:center;
    gap:1rem;
    margin:2.2rem 0 1.2rem;
}
.events-month-divider::before,
.events-month-divider::after{
    content:'';
    height:1px;
    background: rgba(0,0,0,0.18);
    flex:1;
}
.events-month-name{
    font-size:0.95rem;
    letter-spacing:0.18em;
    text-transform:uppercase;
    color: rgba(0,0,0,0.60);
    white-space:nowrap;
}
.event-card--programme{
    margin-bottom: 1.6rem;
}

/* Give programme cards subtle variety so the list is easier to scan */
.events-month-group .event-card--programme {
    background: rgba(255, 255, 255, 0.78);
}
.events-month-group .event-card--programme:nth-of-type(4n+1) {
    background: rgba(232, 242, 255, 0.40); /* faint blue */
}
.events-month-group .event-card--programme:nth-of-type(4n+2) {
    background: rgba(255, 244, 228, 0.42); /* faint warm sand */
}
.events-month-group .event-card--programme:nth-of-type(4n+3) {
    background: rgba(240, 232, 255, 0.38); /* faint lilac */
}
.events-month-group .event-card--programme:nth-of-type(4n+4) {
    background: rgba(232, 255, 244, 0.34); /* faint sage */
}


/* Noticeboard YouTube thumbnails (avoid embed errors) */
.notice-youtube-thumb{
    display:block;
    position:relative;
    margin-top: 1rem;
    border-radius: 2px;
    overflow:hidden;
    background: rgba(0,0,0,0.04);
}
.notice-youtube-thumb img{
    width:100%;
    height:auto;
    display:block;
}
.notice-youtube-play{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size: 2.2rem;
    color: rgba(255,255,255,0.92);
    text-shadow: 0 2px 10px rgba(0,0,0,0.45);
}
.notice-youtube-thumb:hover{
    opacity: 0.96;
}