/*
 * TikkBay public design system: "The Programme".
 * Classical editorial aesthetic: Fraunces display over Inter body,
 * ivory ground, navy ink, gold used sparingly as the accent.
 *
 * This stylesheet layers on top of the existing Tailwind Play CDN
 * output while the public pages migrate section by section. All new
 * component classes carry the pg- prefix so nothing collides with
 * utility classes. Shell overrides scope under .pg-shell-nav and
 * .pg-shell-footer, which are single class hooks added to the layout.
 * When the migration completes, the Play CDN is removed and this file
 * remains the public styling layer.
 */

/* ------------------------------------------------------------------
   Self-hosted fonts. These declarations make Fraunces and Inter load
   on every public page, since this stylesheet is linked from the app
   layout directly. The woff2 files in public/fonts are the variable
   fonts from resources/fonts compressed for the web; the CSP already
   admits font-src 'self'. Without these faces the pg- font variables
   silently fall back to Georgia and the system sans, which is not the
   approved look.
   ------------------------------------------------------------------ */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('/fonts/inter-variable.woff2') format('woff2');
}
@font-face {
    font-family: 'Inter';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url('/fonts/inter-italic.woff2') format('woff2');
}
@font-face {
    font-family: 'Fraunces';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('/fonts/fraunces-variable.woff2') format('woff2');
}
@font-face {
    font-family: 'Fraunces';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url('/fonts/fraunces-italic.woff2') format('woff2');
}

:root {
    --pg-ivory: #fffdf7;
    --pg-gold-100: #fffbeb;
    --pg-gold-200: #fef3c7;
    --pg-gold-400: #fcd34d;
    --pg-gold-500: #fbbf24;
    --pg-gold-600: #f59e0b;
    --pg-gold-700: #d97706;
    --pg-gold-800: #b45309;
    --pg-navy-50: #f1f5f9;
    --pg-navy-100: #e2e9f0;
    --pg-navy-200: #c7d4e1;
    --pg-navy-300: #9db3c9;
    --pg-navy-400: #6a8aac;
    --pg-navy-500: #436690;
    --pg-navy-600: #2f4d72;
    --pg-navy-700: #1e3a5f;
    --pg-navy-800: #1a3050;
    --pg-navy-900: #172a44;
    --pg-ink: #172a44;
    --pg-body: #46536b;
    --pg-muted: #7d89a0;
    --pg-hairline: rgba(23, 42, 68, .12);
    --pg-hairline-soft: rgba(23, 42, 68, .07);
    --pg-font-display: 'Fraunces', Georgia, Cambria, 'Noto Serif', 'Times New Roman', Times, serif;
    --pg-font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif;
}

/* ---------------------------------------------------------------
   Page ground. The body hook is added by the public layout.
   --------------------------------------------------------------- */
body.pg-ground { background: var(--pg-ivory); color: var(--pg-body); font-family: var(--pg-font-sans); }

.pg-wrap { max-width: 1220px; margin: 0 auto; padding: 0 24px; }

/* ---------------------------------------------------------------
   Shared primitives
   --------------------------------------------------------------- */
.pg-eyebrow {
    font-family: var(--pg-font-sans);
    font-size: 11px; font-weight: 600; letter-spacing: .2em;
    text-transform: uppercase; color: var(--pg-gold-800);
}
.pg-display {
    font-family: var(--pg-font-display);
    font-feature-settings: "ss01" on, "calt" on;
    letter-spacing: -0.012em; color: var(--pg-ink); font-weight: 500;
}
.pg-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    font-family: var(--pg-font-sans); font-size: 14px; font-weight: 600; letter-spacing: .01em;
    padding: 13px 26px; border-radius: 2px; cursor: pointer;
    border: 1px solid transparent;
    transition: background .18s, color .18s, border-color .18s;
}
.pg-btn-navy { background: var(--pg-navy-900); color: #fff; }
.pg-btn-navy:hover { background: var(--pg-navy-700); color: #fff; }
.pg-btn-gold { background: var(--pg-gold-600); color: var(--pg-navy-900); }
.pg-btn-gold:hover { background: var(--pg-gold-500); color: var(--pg-navy-900); }
.pg-btn-outline { background: transparent; color: var(--pg-navy-900); border-color: var(--pg-hairline); }
.pg-btn-outline:hover { border-color: var(--pg-navy-900); color: var(--pg-navy-900); }
.pg-btn-outline-light { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .3); }
.pg-btn-outline-light:hover { border-color: #fff; color: #fff; }
.pg-textlink {
    font-family: var(--pg-font-sans); font-size: 13px; font-weight: 600;
    color: var(--pg-navy-900); border-bottom: 1px solid var(--pg-gold-600);
    padding-bottom: 2px; white-space: nowrap; text-decoration: none;
}
.pg-textlink:hover { color: var(--pg-gold-800); }

.pg-section { padding: 80px 0; }
.pg-section-white { background: #fff; border-top: 1px solid var(--pg-hairline-soft); border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-section-head { display: flex; align-items: baseline; gap: 24px; margin-bottom: 38px; }
.pg-section-head .pg-stack { flex-shrink: 0; min-width: 0; }
.pg-section-head .pg-eyebrow { display: block; margin-bottom: 10px; }
.pg-section-head h2 {
    font-family: var(--pg-font-display); font-weight: 500;
    font-size: clamp(28px, 3.4vw, 40px); line-height: 1.1;
    letter-spacing: -0.012em; color: var(--pg-ink); margin: 0;
}
.pg-lead-rule { flex: 1; height: 1px; background: var(--pg-hairline-soft); position: relative; top: -6px; }

/* ---------------------------------------------------------------
   Shell: navigation reskin. Scoped under the .pg-shell-nav hook on
   the existing <nav> so every auth branch, dropdown and the mobile
   menu keep their markup and behaviour untouched.
   --------------------------------------------------------------- */
.pg-shell-nav {
    background: rgba(255, 253, 247, .96) !important;
    backdrop-filter: blur(8px);
    box-shadow: none !important;
    border-bottom: 1px solid var(--pg-hairline-soft);
}
.pg-shell-nav a { font-family: var(--pg-font-sans); }
.pg-shell-nav .pg-navlink {
    color: var(--pg-body) !important;
    border-radius: 0 !important;
    background: transparent !important;
    border-bottom: 1px solid transparent;
    padding-left: 4px !important; padding-right: 4px !important;
    margin-left: 10px; margin-right: 10px;
    transition: color .15s, border-color .15s;
}
.pg-shell-nav .pg-navlink:hover { color: var(--pg-navy-900) !important; border-bottom-color: var(--pg-gold-600); background: transparent !important; }
/* Primary action (registration / list your event) squared navy */
.pg-shell-nav .pg-nav-cta {
    background: var(--pg-navy-900) !important; background-image: none !important;
    color: #fff !important; border-radius: 2px !important; box-shadow: none !important;
}
.pg-shell-nav .pg-nav-cta:hover { background: var(--pg-navy-700) !important; }
/* Secondary states (dashboard pill, sign in) */
.pg-shell-nav .pg-nav-quiet {
    background: transparent !important; border: 1px solid var(--pg-hairline) !important;
    color: var(--pg-navy-900) !important; border-radius: 2px !important;
}
.pg-shell-nav .pg-nav-quiet:hover { border-color: var(--pg-navy-900) !important; }

/* ---------------------------------------------------------------
   Shell: footer reskin, scoped under .pg-shell-footer.
   --------------------------------------------------------------- */
.pg-shell-footer { background: var(--pg-navy-900) !important; border-top: 1px solid rgba(251, 191, 36, .35); }
.pg-shell-footer h4 { color: var(--pg-navy-400) !important; letter-spacing: .18em !important; }
.pg-shell-footer a { color: var(--pg-navy-200); }
.pg-shell-footer a:hover { color: var(--pg-gold-400) !important; }

/* ---------------------------------------------------------------
   Home: hero
   --------------------------------------------------------------- */
.pg-hero { padding: 118px 0 84px; overflow: hidden; background: var(--pg-ivory); }
.pg-hero-grid { display: grid; grid-template-columns: 1.02fr .98fr; gap: 72px; align-items: center; }
.pg-hero h1 {
    font-family: var(--pg-font-display); font-weight: 500;
    font-size: clamp(42px, 5.1vw, 66px); line-height: 1.04;
    letter-spacing: -0.012em; color: var(--pg-ink); margin: 0 0 22px;
}
.pg-hero h1 em { font-style: italic; font-weight: 500; color: var(--pg-gold-700); }
.pg-hero .pg-sub { font-size: 17px; line-height: 1.65; color: var(--pg-body); max-width: 470px; margin-bottom: 34px; }

/* Search bar: the Alpine component keeps its wiring; these classes
   restyle the container, input, select and button. */
.pg-searchbar {
    display: flex; align-items: stretch; background: #fff;
    border: 1px solid var(--pg-hairline); border-radius: 3px;
    box-shadow: 0 1px 2px rgba(23, 42, 68, .04); max-width: 580px; position: relative;
}
.pg-searchbar:focus-within { border-color: var(--pg-navy-500); }
.pg-searchbar .pg-sfield { flex: 1; position: relative; display: flex; align-items: center; }
.pg-searchbar input[type="text"] {
    border: 0 !important; outline: 0 !important; box-shadow: none !important;
    font-family: var(--pg-font-sans); font-size: 15px; padding: 16px 12px 16px 44px;
    width: 100%; color: var(--pg-ink); background: transparent !important; border-radius: 0 !important;
}
.pg-searchbar .pg-sicon { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); pointer-events: none; }
.pg-searchbar .pg-sicon svg { width: 17px; height: 17px; stroke: var(--pg-muted); }
.pg-searchbar .pg-sdivider { width: 1px; background: var(--pg-hairline-soft); margin: 10px 0; }
.pg-searchbar select {
    border: 0 !important; outline: 0 !important; background-color: transparent !important;
    font-family: var(--pg-font-sans); font-size: 14px; font-weight: 500; color: var(--pg-navy-900);
    padding: 0 28px 0 16px; appearance: none; cursor: pointer; border-radius: 0 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%237d89a0' stroke-width='1.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 12px center;
}
.pg-searchbar .pg-sbtn {
    border-radius: 0 2px 2px 0; padding: 0 28px; border: 0; cursor: pointer;
    background: var(--pg-navy-900); color: #fff;
    font-family: var(--pg-font-sans); font-size: 14px; font-weight: 600;
    transition: background .18s;
}
.pg-searchbar .pg-sbtn:hover { background: var(--pg-navy-700); }
/* Results dropdown inherits its existing utility classes; anchor it */
.pg-searchbar .pg-sresults { position: absolute; top: calc(100% + 8px); left: 0; right: 0; z-index: 60; }

.pg-chips { display: flex; gap: 10px; margin-top: 18px; flex-wrap: wrap; }
.pg-chip {
    font-family: var(--pg-font-sans); font-size: 12.5px; font-weight: 600;
    color: var(--pg-navy-800); border: 1px solid var(--pg-hairline); background: #fff;
    border-radius: 99px; padding: 8px 16px; text-decoration: none; transition: all .15s;
}
.pg-chip:hover { border-color: var(--pg-gold-600); color: var(--pg-gold-800); }
.pg-chip-hot { border-color: var(--pg-gold-400); background: var(--pg-gold-100); color: var(--pg-gold-800); }

/* Hero art: framed photograph with the rotating featured stub */
.pg-hero-art { position: relative; }
.pg-hero-frame { position: relative; }
.pg-hero-frame::before {
    content: ""; position: absolute; inset: 18px -18px -18px 18px;
    border: 1px solid var(--pg-gold-600); border-radius: 3px; z-index: 0;
}
.pg-hero-frame img { position: relative; z-index: 1; width: 100%; aspect-ratio: 4/4.5; object-fit: cover; border-radius: 3px; display: block; }
.pg-hero-stub {
    position: absolute; z-index: 2; left: -44px; bottom: 44px; width: 256px;
    background: #fff; border-radius: 4px; text-decoration: none; display: block;
    box-shadow: 0 18px 44px -12px rgba(23, 42, 68, .28);
}
.pg-hero-stub .pg-stub-media { position: relative; height: 136px; border-radius: 4px 4px 0 0; overflow: hidden; background: var(--pg-navy-100); }
.pg-hero-stub .pg-stub-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .6s ease; }
.pg-hero-stub .pg-stub-media img.pg-show { opacity: 1; }
.pg-hero-stub .pg-stub-body { padding: 14px 16px 15px; }
.pg-hero-stub .pg-fade { transition: opacity .35s ease; }
.pg-hero-stub .pg-stub-when { font-size: 10.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--pg-gold-800); }
.pg-hero-stub h3 {
    font-family: var(--pg-font-display); font-weight: 500; font-size: 17px; line-height: 1.25;
    margin: 5px 0 3px; min-height: 42px; color: var(--pg-ink);
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.pg-hero-stub .pg-stub-where { font-size: 12.5px; color: var(--pg-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pg-hero-stub .pg-tear {
    position: relative; border-top: 1px dashed var(--pg-hairline);
    margin-top: 12px; padding-top: 11px;
    display: flex; justify-content: space-between; align-items: center;
}
.pg-hero-stub .pg-tear::before, .pg-hero-stub .pg-tear::after {
    content: ""; position: absolute; top: -6px; width: 12px; height: 12px;
    background: var(--pg-ivory); border-radius: 50%; border: 1px solid var(--pg-hairline-soft);
}
.pg-hero-stub .pg-tear::before { left: -22px; }
.pg-hero-stub .pg-tear::after { right: -22px; }
.pg-hero-stub .pg-stub-price { font-size: 14px; font-weight: 700; color: var(--pg-navy-900); font-variant-numeric: tabular-nums; }
.pg-hero-stub .pg-stub-cta { font-size: 12px; font-weight: 600; color: var(--pg-gold-800); }
.pg-hero-stub .pg-stub-dots { position: absolute; top: 10px; right: 12px; z-index: 3; display: flex; gap: 5px; }
.pg-hero-stub .pg-stub-dots i { width: 6px; height: 6px; border-radius: 50%; background: rgba(255, 255, 255, .55); }
.pg-hero-stub .pg-stub-dots i.pg-on { background: var(--pg-gold-500); }

/* ---------------------------------------------------------------
   Home: ticket-stub event cards and the featured rail
   --------------------------------------------------------------- */
.pg-card {
    position: relative; background: #fff; border-radius: 4px;
    border: 1px solid var(--pg-hairline-soft); display: flex; flex-direction: column;
    text-decoration: none; transition: transform .25s, box-shadow .25s;
}
.pg-card:hover { transform: translateY(-4px); box-shadow: 0 20px 40px -18px rgba(23, 42, 68, .22); }
.pg-card .pg-card-media { position: relative; overflow: hidden; border-radius: 4px 4px 0 0; background: var(--pg-navy-100); }
.pg-card .pg-card-media img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; transition: transform .6s; }
.pg-card:hover .pg-card-media img { transform: scale(1.04); }
.pg-card .pg-flag {
    position: absolute; top: 12px; left: 12px; z-index: 2;
    font-size: 10px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
    background: var(--pg-navy-900); color: var(--pg-gold-400); padding: 5px 9px; border-radius: 2px;
    white-space: nowrap;
}
.pg-card .pg-flag-urgent { background: var(--pg-gold-600); color: var(--pg-navy-900); }
.pg-card .pg-card-body { padding: 18px 18px 16px; display: flex; flex-direction: column; flex: 1; }
.pg-card .pg-card-when { font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--pg-gold-800); }
.pg-card h3 {
    font-family: var(--pg-font-display); font-weight: 500; font-size: 19px; line-height: 1.28;
    margin: 7px 0 5px; color: var(--pg-ink);
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.pg-card:hover h3 { color: var(--pg-navy-600); }
.pg-card .pg-card-where { font-size: 13px; color: var(--pg-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pg-card .pg-tear {
    position: relative; margin-top: 14px; padding-top: 13px;
    border-top: 1px dashed var(--pg-hairline);
    display: flex; justify-content: space-between; align-items: center; margin-top: auto;
}
.pg-card .pg-card-where + .pg-tear { margin-top: auto; }
.pg-card .pg-card-body { gap: 0; }
.pg-card .pg-tear::before, .pg-card .pg-tear::after {
    content: ""; position: absolute; top: -7px; width: 14px; height: 14px;
    background: var(--pg-ivory); border-radius: 50%; border: 1px solid var(--pg-hairline-soft);
}
.pg-card .pg-tear::before { left: -26px; }
.pg-card .pg-tear::after { right: -26px; }
.pg-on-white .pg-card .pg-tear::before, .pg-on-white .pg-card .pg-tear::after { background: #fff; }
.pg-card .pg-price { font-size: 14.5px; font-weight: 700; color: var(--pg-navy-900); font-variant-numeric: tabular-nums; }
.pg-card .pg-price .pg-from { font-size: 11px; font-weight: 500; color: var(--pg-muted); margin-right: 3px; }
.pg-card .pg-price-free { color: #047857; }
.pg-card .pg-go { font-size: 12.5px; font-weight: 600; color: var(--pg-gold-800); opacity: 0; transform: translateX(-4px); transition: all .22s; }
.pg-card:hover .pg-go { opacity: 1; transform: translateX(0); }

.pg-rail-wrap { position: relative; }
.pg-rail {
    display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 84px) / 4);
    gap: 28px; overflow-x: auto; scroll-snap-type: x mandatory;
    scrollbar-width: none; padding-bottom: 6px;
}
.pg-rail::-webkit-scrollbar { display: none; }
.pg-rail .pg-card { scroll-snap-align: start; }
.pg-rail-nav { position: absolute; top: -72px; right: 0; display: flex; gap: 8px; }
.pg-rail-nav button {
    width: 40px; height: 40px; border: 1px solid var(--pg-hairline); background: #fff;
    border-radius: 2px; cursor: pointer; font-size: 16px; color: var(--pg-navy-900); transition: all .15s;
}
.pg-rail-nav button:hover { border-color: var(--pg-navy-900); }
.pg-rail-nav button:disabled { color: var(--pg-navy-200); cursor: default; border-color: var(--pg-hairline-soft); }

/* ---------------------------------------------------------------
   Home: schedule (happening soon)
   --------------------------------------------------------------- */
.pg-sched { border-top: 1px solid var(--pg-hairline); }
.pg-sched-row {
    display: grid; grid-template-columns: 110px 1fr auto auto; gap: 32px; align-items: center;
    padding: 21px 4px; border-bottom: 1px solid var(--pg-hairline-soft);
    text-decoration: none; transition: background .15s;
}
.pg-sched-row:hover { background: rgba(245, 158, 11, .045); }
.pg-sched-date { text-align: center; border-right: 1px solid var(--pg-hairline-soft); padding-right: 26px; }
.pg-sched-date .pg-d { font-family: var(--pg-font-display); font-size: 32px; line-height: 1; color: var(--pg-ink); font-weight: 500; }
.pg-sched-date .pg-m { font-size: 10.5px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--pg-gold-800); margin-top: 3px; }
.pg-sched-main h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 20px; line-height: 1.25; color: var(--pg-ink); margin: 0; }
.pg-sched-row:hover .pg-sched-main h3 { color: var(--pg-navy-600); }
.pg-sched-main .pg-meta { font-size: 13px; color: var(--pg-muted); margin-top: 3px; }
.pg-sched-price { font-size: 14.5px; font-weight: 700; color: var(--pg-navy-900); font-variant-numeric: tabular-nums; text-align: right; }
.pg-sched-price .pg-free { color: #047857; }
.pg-sched-go { font-size: 13px; font-weight: 600; color: var(--pg-gold-800); border-bottom: 1px solid var(--pg-gold-600); padding-bottom: 1px; }

/* ---------------------------------------------------------------
   Home: category index
   --------------------------------------------------------------- */
.pg-cat-index { display: grid; grid-template-columns: 1fr 1fr; column-gap: 80px; }
.pg-cat-row {
    display: flex; align-items: center; gap: 20px; padding: 17px 4px;
    border-bottom: 1px solid var(--pg-hairline-soft); text-decoration: none;
    transition: padding-left .2s;
}
.pg-cat-row:hover { padding-left: 12px; }
.pg-cat-row img { width: 56px; height: 56px; object-fit: cover; border-radius: 3px; filter: saturate(.9); display: block; }
.pg-cat-row .pg-cat-name { font-family: var(--pg-font-display); font-size: 22px; color: var(--pg-ink); font-weight: 500; letter-spacing: -0.01em; }
.pg-cat-row:hover .pg-cat-name { color: var(--pg-gold-700); }
.pg-cat-row .pg-cat-count { margin-left: auto; font-size: 12.5px; color: var(--pg-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pg-cat-row .pg-cat-arr { font-size: 16px; color: var(--pg-navy-300); transition: transform .2s, color .2s; }
.pg-cat-row:hover .pg-cat-arr { transform: translateX(4px); color: var(--pg-gold-700); }

/* ---------------------------------------------------------------
   Home: figures band and organiser band
   --------------------------------------------------------------- */
.pg-figures { background: var(--pg-navy-900); padding: 50px 0; }
.pg-figures-row { display: flex; justify-content: center; align-items: center; text-align: center; }
.pg-figure { padding: 0 64px; }
.pg-figure + .pg-figure { border-left: 1px solid rgba(255, 255, 255, .12); }
.pg-figure .pg-num { font-family: var(--pg-font-display); font-size: 38px; color: #fff; font-weight: 500; line-height: 1.1; }
.pg-figure .pg-num span { color: var(--pg-gold-500); }
.pg-figure .pg-lbl { font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-navy-300); margin-top: 6px; }

.pg-organiser { background: var(--pg-navy-900); color: #fff; overflow: hidden; }
.pg-organiser .pg-org-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: stretch; }
.pg-organiser .pg-org-copy { padding: 92px 72px 92px 0; }
.pg-organiser .pg-eyebrow { color: var(--pg-gold-500); }
.pg-organiser h2 {
    font-family: var(--pg-font-display); font-weight: 500; color: #fff;
    font-size: clamp(30px, 3.6vw, 44px); line-height: 1.12; margin: 18px 0 20px; letter-spacing: -0.012em;
}
.pg-organiser h2 em { font-style: italic; color: var(--pg-gold-400); }
.pg-organiser p { color: var(--pg-navy-200); max-width: 440px; margin-bottom: 32px; }
.pg-organiser .pg-org-pic { position: relative; min-height: 320px; }
.pg-organiser .pg-org-pic img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pg-organiser .pg-org-pic::before {
    content: ""; position: absolute; inset: 0; z-index: 1;
    background: linear-gradient(90deg, var(--pg-navy-900) 0%, rgba(23, 42, 68, 0) 40%);
}
.pg-organiser .pg-points { display: flex; gap: 40px; margin-bottom: 36px; flex-wrap: wrap; }
.pg-organiser .pg-pt .pg-k { font-family: var(--pg-font-display); font-size: 22px; color: var(--pg-gold-500); }
.pg-organiser .pg-pt .pg-v { font-size: 12.5px; color: var(--pg-navy-300); margin-top: 2px; }

/* ---------------------------------------------------------------
   Home: reviews carousel (Programme card visuals; the Alpine strip
   mechanics keep their utility classes)
   --------------------------------------------------------------- */
.pg-reviews-head { display: flex; align-items: baseline; gap: 18px; margin-bottom: 38px; flex-wrap: wrap; }
.pg-reviews-head h2 {
    font-family: var(--pg-font-display); font-weight: 500;
    font-size: clamp(28px, 3.4vw, 40px); color: var(--pg-ink); margin: 0; letter-spacing: -0.012em;
}
.pg-reviews-head .pg-agg { font-size: 14px; color: var(--pg-muted); }
.pg-reviews-head .pg-agg b { color: var(--pg-ink); font-weight: 700; font-size: 16px; }
.pg-stars { color: var(--pg-gold-600); font-size: 14px; letter-spacing: 2px; }
.pg-review-card {
    background: #fff; border: 1px solid var(--pg-hairline-soft);
    border-top: 2px solid var(--pg-gold-600); border-radius: 0 0 4px 4px;
    padding: 26px 26px 22px; height: 100%; display: flex; flex-direction: column;
}
.pg-review-card .pg-q {
    font-family: var(--pg-font-display); font-style: italic; font-size: 17px;
    line-height: 1.55; color: var(--pg-ink); margin: 12px 0 18px; flex: 1;
}
.pg-review-card .pg-who { display: flex; align-items: center; gap: 12px; border-top: 1px solid var(--pg-hairline-soft); padding-top: 16px; }
.pg-review-card .pg-av {
    width: 38px; height: 38px; border-radius: 50%; background: var(--pg-navy-900);
    color: var(--pg-gold-400); display: flex; align-items: center; justify-content: center;
    font-size: 13px; font-weight: 600; flex-shrink: 0;
}
.pg-review-card .pg-n { font-size: 13.5px; font-weight: 600; color: var(--pg-ink); }
.pg-review-card .pg-c { font-size: 12px; color: var(--pg-muted); }
.pg-review-card .pg-c a { color: var(--pg-gold-800); }
.pg-rev-dots { display: flex; gap: 7px; justify-content: center; margin-top: 28px; }
.pg-rev-dots button { width: 7px; height: 7px; border-radius: 50%; background: var(--pg-navy-200); border: 0; padding: 0; cursor: pointer; transition: background .2s; }
.pg-rev-dots button.pg-on { background: var(--pg-gold-600); }

/* ---------------------------------------------------------------
   Home: preserved sections restyle (how it works snippet, features,
   pricing carousel, closing call to action)
   --------------------------------------------------------------- */
.pg-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid var(--pg-hairline-soft); border-radius: 4px; background: #fff; overflow: hidden; }
.pg-steps.pg-steps-4 { grid-template-columns: repeat(4, 1fr); }
.pg-step { padding: 38px 34px; }
.pg-step + .pg-step { border-left: 1px solid var(--pg-hairline-soft); }
.pg-step .pg-no { font-family: var(--pg-font-display); font-size: 15px; color: var(--pg-gold-700); }
.pg-step h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 22px; margin: 10px 0; color: var(--pg-ink); }
.pg-step p { font-size: 14px; color: var(--pg-body); margin: 0; }

.pg-feat-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 80px; max-width: 980px; }
.pg-feat-item { display: grid; grid-template-columns: 200px 1fr; gap: 20px; padding: 15px 2px; border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-feat-item .pg-fk { font-family: var(--pg-font-display); font-size: 17px; color: var(--pg-ink); }
.pg-feat-item .pg-fv { font-size: 13px; color: var(--pg-muted); }

.pg-band { background: var(--pg-navy-900); color: #fff; padding: 84px 0; }
.pg-band h2 {
    font-family: var(--pg-font-display); font-weight: 500; color: #fff;
    font-size: clamp(28px, 3.4vw, 42px); line-height: 1.12; letter-spacing: -0.012em; margin: 0 0 16px;
}
.pg-band h2 em { font-style: italic; color: var(--pg-gold-400); }
.pg-band p { color: var(--pg-navy-200); }

/* ---------------------------------------------------------------
   Responsive
   --------------------------------------------------------------- */
@media (max-width: 1080px) {
    .pg-hero-grid, .pg-organiser .pg-org-grid { grid-template-columns: 1fr; }
    .pg-hero { padding-top: 100px; }
    .pg-hero-stub { left: 12px; }
    .pg-organiser .pg-org-copy { padding: 64px 0; }
    .pg-cat-index { grid-template-columns: 1fr; }
    .pg-rail { grid-auto-columns: calc((100% - 28px) / 2); }
    .pg-feat-list { grid-template-columns: 1fr; }
    /* Three-step layout stacks; the four-step layout becomes a two by
       two grid so the cards stay readable on tablet widths. */
    .pg-steps { grid-template-columns: 1fr; }
    .pg-steps.pg-steps-4 { grid-template-columns: repeat(2, 1fr); }
    .pg-step + .pg-step { border-left: 0; border-top: 1px solid var(--pg-hairline-soft); }
    .pg-steps.pg-steps-4 .pg-step { border-left: 0; border-top: 1px solid var(--pg-hairline-soft); }
    .pg-steps.pg-steps-4 .pg-step:nth-child(-n+2) { border-top: 0; }
    .pg-steps.pg-steps-4 .pg-step:nth-child(2n) { border-left: 1px solid var(--pg-hairline-soft); }
}
@media (max-width: 640px) {
    .pg-section { padding: 56px 0; }
    .pg-section-head { flex-wrap: wrap; gap: 12px 16px; }
    .pg-section-head .pg-stack { flex-shrink: 1; min-width: 0; max-width: 100%; }
    .pg-section-head h2 { overflow-wrap: break-word; }
    .pg-lead-rule { display: none; }
    .pg-hero-frame::before { inset: 12px -8px -12px 8px; }
    .pg-searchbar { flex-direction: column; }
    .pg-searchbar .pg-sdivider { display: none; }
    .pg-searchbar select { padding: 14px 16px; border-top: 1px solid var(--pg-hairline-soft) !important; width: 100%; }
    .pg-searchbar .pg-sbtn { border-radius: 0 0 2px 2px; padding: 15px; }
    .pg-sched-row { grid-template-columns: 80px 1fr; row-gap: 8px; }
    .pg-sched-price, .pg-sched-go { grid-column: 2; text-align: left; }
    .pg-figures-row { flex-direction: column; gap: 28px; }
    .pg-figure + .pg-figure { border-left: 0; }
    .pg-rail { grid-auto-columns: 86%; }
    .pg-rail-nav { display: none; }
    .pg-feat-item { grid-template-columns: 1fr; gap: 3px; }
    .pg-steps.pg-steps-4 { grid-template-columns: 1fr; }
    .pg-steps.pg-steps-4 .pg-step { border-left: 0; border-top: 1px solid var(--pg-hairline-soft); }
    .pg-steps.pg-steps-4 .pg-step:first-child { border-top: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .pg-card, .pg-card .pg-card-media img, .pg-hero-stub .pg-stub-media img, .pg-hero-stub .pg-fade { transition: none !important; }
}

/* ---------------------------------------------------------------
   Shell: browsing-city indicator in the navigation
   --------------------------------------------------------------- */
.pg-nav-city {
    display: inline-flex; align-items: center; gap: 5px;
    font-family: var(--pg-font-sans); font-size: 12.5px; font-weight: 500;
    color: var(--pg-muted) !important; text-decoration: none;
    border: 1px solid var(--pg-hairline-soft); border-radius: 99px;
    padding: 6px 14px; margin-left: 14px; white-space: nowrap;
    transition: border-color .15s, color .15s;
}
.pg-nav-city b { color: var(--pg-navy-900); font-weight: 600; }
.pg-nav-city:hover { border-color: var(--pg-gold-600); color: var(--pg-gold-800) !important; }

/* ---------------------------------------------------------------
   Discover: editorial header, location controls, listing scope
   --------------------------------------------------------------- */
.pg-disc-head { padding: 128px 0 46px; background: var(--pg-ivory); border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-disc-title {
    font-family: var(--pg-font-display); font-weight: 500;
    font-size: clamp(34px, 4.2vw, 54px); line-height: 1.06;
    letter-spacing: -0.012em; color: var(--pg-ink); margin: 14px 0 26px;
}
.pg-disc-title em { font-style: italic; color: var(--pg-gold-700); }
.pg-loc-strip { display: flex; align-items: center; gap: 16px; margin-top: 16px; flex-wrap: wrap; }
.pg-loc-link {
    background: none; border: 0; padding: 0; cursor: pointer;
    font-family: var(--pg-font-sans); font-size: 12.5px; font-weight: 600;
    color: var(--pg-navy-900); border-bottom: 1px solid var(--pg-gold-600); padding-bottom: 1px;
    text-decoration: none;
}
.pg-loc-link:hover { color: var(--pg-gold-800); }
.pg-loc-note { font-size: 12.5px; color: var(--pg-muted); }
.pg-loc-note b { color: var(--pg-ink); }

/* Listing scope: the grid partial re-renders over AJAX, so all
   restyling keys off this wrapper class rather than edited markup. */
.pg-grid h2 { font-family: var(--pg-font-display); font-weight: 500; letter-spacing: -0.012em; }
.pg-grid a.group { border-radius: 4px !important; border-color: var(--pg-hairline-soft) !important; }
.pg-grid a.group:hover { border-color: var(--pg-hairline) !important; box-shadow: 0 14px 30px -16px rgba(23, 42, 68, .18) !important; }
.pg-grid a.group h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 17px; }
.pg-filter-select { border-radius: 3px !important; font-family: var(--pg-font-sans); font-size: 13.5px; }

/* ---------------------------------------------------------------
   Event detail scope
   --------------------------------------------------------------- */
.pg-event h2 { font-family: var(--pg-font-display); font-weight: 500; letter-spacing: -0.012em; }
.pg-event .rounded-2xl { border-radius: 5px !important; }
.pg-event .rounded-xl { border-radius: 4px !important; }
.pg-event .shadow-sm { box-shadow: none !important; }
.pg-event .border-slate-100 { border-color: var(--pg-hairline-soft) !important; }

.pg-map-facade {
    position: relative; border: 1px solid var(--pg-hairline-soft); border-radius: 4px; overflow: hidden;
    background:
        repeating-linear-gradient(0deg, #f2efe6 0 1px, transparent 1px 44px),
        repeating-linear-gradient(90deg, #f2efe6 0 1px, transparent 1px 44px),
        #faf8f0;
    display: flex; align-items: center; justify-content: center;
    min-height: 240px;
}
@media (min-width: 900px) { .pg-map-facade { aspect-ratio: 16 / 6; min-height: 0; } }
.pg-map-facade-inner {
    text-align: center; padding: 28px; max-width: 460px;
    display: flex; flex-direction: column; align-items: center; gap: 14px;
}
.pg-map-pin {
    width: 12px; height: 12px; border-radius: 50%; background: var(--pg-gold-600);
    border: 3px solid #fff; box-shadow: 0 2px 8px rgba(23, 42, 68, .3); box-sizing: content-box;
}
.pg-map-addr { font-weight: 600; font-size: 14px; color: var(--pg-ink); line-height: 1.5; margin: 0; }
.pg-map-sub { font-size: 12.5px; color: var(--pg-muted); margin: -10px 0 0; }
.pg-map-note { font-size: 11.5px; color: var(--pg-muted); margin-top: 14px; line-height: 1.5; }

@media (max-width: 640px) {
    .pg-disc-head { padding-top: 104px; }
    .pg-nav-city { display: none; }
}

/* ---------------------------------------------------------------
   Page scopes for the transaction and content surfaces. Each page
   opts in with a single class; the scope brings the display face to
   headings, calms surfaces to hairlines and squares the geometry
   without touching any markup that carries behaviour.
   --------------------------------------------------------------- */
.pg-page h1, .pg-page h2,
.pg-checkout h1, .pg-checkout h2,
.pg-confirm h1, .pg-confirm h2,
.pg-tickets h1, .pg-tickets h2 {
    font-family: var(--pg-font-display);
    font-weight: 500;
    letter-spacing: -0.012em;
}
.pg-page h3, .pg-confirm h3 { letter-spacing: -0.006em; }

.pg-page .rounded-3xl, .pg-checkout .rounded-3xl, .pg-confirm .rounded-3xl, .pg-tickets .rounded-3xl { border-radius: 6px !important; }
.pg-page .rounded-2xl, .pg-checkout .rounded-2xl, .pg-confirm .rounded-2xl, .pg-tickets .rounded-2xl { border-radius: 5px !important; }
.pg-page .rounded-xl,  .pg-checkout .rounded-xl,  .pg-confirm .rounded-xl,  .pg-tickets .rounded-xl  { border-radius: 4px !important; }

.pg-page .shadow-sm, .pg-checkout .shadow-sm, .pg-confirm .shadow-sm, .pg-tickets .shadow-sm { box-shadow: none !important; }
.pg-page .border-slate-100,  .pg-checkout .border-slate-100,  .pg-confirm .border-slate-100,  .pg-tickets .border-slate-100,
.pg-page .border-gray-100,   .pg-confirm .border-gray-100,    .pg-tickets .border-gray-100 { border-color: var(--pg-hairline-soft) !important; }

/* Checkout sits on the ivory ground rather than the old gradient. */
.pg-checkout { background: var(--pg-ivory) !important; }

/* Form fields across the scopes pick up the squared geometry. */
.pg-checkout input[type="text"], .pg-checkout input[type="email"], .pg-checkout input[type="tel"],
.pg-checkout input[type="number"], .pg-checkout input[type="date"], .pg-checkout input[type="url"],
.pg-checkout select, .pg-checkout textarea,
.pg-page input[type="text"], .pg-page input[type="email"], .pg-page select, .pg-page textarea {
    border-radius: 3px !important;
}

/* ---------------------------------------------------------------
   Structural components ported from the approved mockup for the
   transaction and content page rebuilds.
   --------------------------------------------------------------- */

/* Numbered step panels (checkout and long-form flows) */
.pg-panel { background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 4px; padding: 26px 26px 24px; }
.pg-panel + .pg-panel { margin-top: 18px; }
.pg-panel-head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 18px; }
.pg-panel-no { font-family: var(--pg-font-display); font-size: 13px; color: var(--pg-gold-700); white-space: nowrap; }
.pg-panel-head h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: 21px; letter-spacing: -0.01em; color: var(--pg-ink); margin: 0; }
.pg-panel-head .pg-panel-rule { flex: 1; height: 1px; background: var(--pg-hairline-soft); position: relative; top: -5px; }

/* Order summary as a ticket stub with perforation */
.pg-sum { background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 4px; overflow: visible; }
.pg-sum-head { padding: 18px 22px 14px; border-bottom: 1px dashed var(--pg-hairline); position: relative; }
.pg-sum-head::before, .pg-sum-head::after { content: ""; position: absolute; bottom: -8px; width: 16px; height: 16px; border-radius: 50%; background: var(--pg-ivory); border: 1px solid var(--pg-hairline-soft); }
.pg-sum-head::before { left: -9px; }
.pg-sum-head::after { right: -9px; }
.pg-sum-title { font-family: var(--pg-font-display); font-size: 18px; font-weight: 500; color: var(--pg-ink); }

/* Facts ledger (event detail) */
.pg-facts { border-top: 1px solid var(--pg-hairline); }
.pg-fact { display: grid; grid-template-columns: 150px 1fr; gap: 24px; padding: 15px 2px; border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-fact .pg-fk { font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-muted); padding-top: 2px; }
.pg-fact .pg-fv { font-size: 15px; color: var(--pg-ink); font-weight: 500; line-height: 1.55; }
@media (max-width: 640px) { .pg-fact { grid-template-columns: 1fr; gap: 3px; } }

/* Event detail editorial header */
.pg-detail-head { padding: 116px 0 40px; border-bottom: 1px solid var(--pg-hairline-soft); background: var(--pg-ivory); }
.pg-detail-head .pg-crumbs { font-size: 12px; color: var(--pg-muted); margin-bottom: 18px; }
.pg-detail-head .pg-crumbs a { color: var(--pg-muted); text-decoration: none; }
.pg-detail-head .pg-crumbs a:hover { color: var(--pg-gold-800); }
.pg-detail-head h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(32px, 4vw, 52px); line-height: 1.08; letter-spacing: -0.012em; color: var(--pg-ink); margin: 10px 0 14px; max-width: 900px; }
.pg-detail-meta { display: flex; flex-wrap: wrap; gap: 8px 26px; font-size: 14px; color: var(--pg-body); align-items: center; }
.pg-detail-meta b { color: var(--pg-ink); font-weight: 600; }

/* Discover listing rows (mockup geometry) */
.pg-rowlist { border-top: 1px solid var(--pg-hairline); }
.pg-lrow { display: grid; grid-template-columns: 96px 108px 1fr auto auto; gap: 24px; align-items: center; padding: 16px 4px; border-bottom: 1px solid var(--pg-hairline-soft); text-decoration: none; transition: background .15s; position: relative; }
.pg-lrow:hover { background: rgba(245, 158, 11, .045); }
.pg-lrow .pg-lthumb { width: 96px; height: 68px; border-radius: 3px; overflow: hidden; background: var(--pg-navy-100); position: relative; }
.pg-lrow .pg-lthumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pg-lrow .pg-ldate { text-align: center; border-right: 1px solid var(--pg-hairline-soft); padding-right: 22px; }
.pg-lrow .pg-ldate .pg-d { font-family: var(--pg-font-display); font-size: 28px; line-height: 1; color: var(--pg-ink); font-weight: 500; }
.pg-lrow .pg-ldate .pg-m { font-size: 10px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--pg-gold-800); margin-top: 3px; }
.pg-lrow h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 19px; line-height: 1.25; color: var(--pg-ink); margin: 0 0 3px; }
.pg-lrow:hover h3 { color: var(--pg-navy-600); }
.pg-lrow .pg-lmeta { font-size: 13px; color: var(--pg-muted); }
.pg-lrow .pg-lprice { font-size: 14.5px; font-weight: 700; color: var(--pg-navy-900); font-variant-numeric: tabular-nums; text-align: right; }
.pg-lrow .pg-lprice .pg-free { color: #047857; }
.pg-lrow .pg-lgo { font-size: 13px; font-weight: 600; color: var(--pg-gold-800); border-bottom: 1px solid var(--pg-gold-600); padding-bottom: 1px; white-space: nowrap; }
.pg-lrow .pg-lflag { position: absolute; top: 10px; left: 10px; z-index: 2; font-size: 9px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; background: var(--pg-navy-900); color: var(--pg-gold-400); padding: 3px 7px; border-radius: 2px; white-space: nowrap; }
.pg-lrow .pg-lended { position: absolute; inset: 0; background: rgba(23, 42, 68, .38); display: flex; align-items: flex-end; justify-content: center; padding-bottom: 6px; color: #fff; font-size: 10px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
@media (max-width: 800px) {
    .pg-lrow { grid-template-columns: 72px 1fr auto; gap: 14px; }
    .pg-lrow .pg-ldate { display: none; }
    .pg-lrow .pg-lthumb { width: 72px; height: 54px; }
    .pg-lrow .pg-lgo { display: none; }
}

/* Article and long-form prose */
.pg-article-head { padding: 118px 0 44px; border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-article-head h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(30px, 3.8vw, 48px); line-height: 1.1; letter-spacing: -0.012em; color: var(--pg-ink); margin: 12px 0 16px; max-width: 860px; }
.pg-article-meta { font-size: 13px; color: var(--pg-muted); display: flex; flex-wrap: wrap; gap: 6px 18px; }
.pg-prose { max-width: 720px; font-size: 16.5px; line-height: 1.75; color: var(--pg-body); }
.pg-prose h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: 26px; color: var(--pg-ink); margin: 40px 0 14px; letter-spacing: -0.01em; }
.pg-prose h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 21px; color: var(--pg-ink); margin: 30px 0 10px; }
.pg-prose p { margin: 0 0 18px; }
.pg-prose a { color: var(--pg-gold-800); border-bottom: 1px solid var(--pg-gold-400); text-decoration: none; }
.pg-prose blockquote { border-left: 2px solid var(--pg-gold-600); padding-left: 20px; font-family: var(--pg-font-display); font-style: italic; font-size: 21px; line-height: 1.5; color: var(--pg-ink); margin: 26px 0; }
.pg-prose ul, .pg-prose ol { padding-left: 22px; margin: 0 0 18px; }
.pg-prose img { border-radius: 4px; }

/* Legal layout: sticky contents rail plus prose */
.pg-legal-grid { display: grid; grid-template-columns: 240px 1fr; gap: 64px; align-items: start; }
.pg-legal-toc { position: sticky; top: 108px; border-left: 1px solid var(--pg-hairline); padding-left: 20px; }
.pg-legal-toc .pg-toc-title { font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-muted); margin-bottom: 12px; }
.pg-legal-toc a { display: block; font-size: 13px; color: var(--pg-body); text-decoration: none; padding: 5px 0; }
.pg-legal-toc a:hover { color: var(--pg-gold-800); }
@media (max-width: 900px) { .pg-legal-grid { grid-template-columns: 1fr; gap: 28px; } .pg-legal-toc { position: static; border-left: 0; padding-left: 0; } }

/* About capability grid (approved icon treatment) and feature ledger */
.pg-plat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 52px; }
.pg-plat-item .pg-picon { width: 26px; height: 26px; margin-bottom: 14px; }
.pg-plat-item .pg-picon svg { width: 26px; height: 26px; fill: none; stroke: var(--pg-navy-600); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; transition: stroke .18s; }
.pg-plat-item:hover .pg-picon svg { stroke: var(--pg-gold-700); }
.pg-plat-item h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 19px; line-height: 1.25; margin: 0 0 7px; color: var(--pg-ink); }
.pg-plat-item p { font-size: 13.5px; color: var(--pg-muted); line-height: 1.55; margin: 0; }
@media (max-width: 900px) { .pg-plat-grid { grid-template-columns: repeat(2, 1fr); gap: 34px 40px; } }
@media (max-width: 640px) { .pg-plat-grid { grid-template-columns: 1fr; gap: 26px; } }
.pg-ledger { border-top: 1px solid var(--pg-hairline); }
.pg-ledger-row { display: grid; grid-template-columns: 230px 1fr; gap: 24px; padding: 15px 2px; border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-ledger-row .pg-lk { font-family: var(--pg-font-display); font-size: 17px; color: var(--pg-ink); }
.pg-ledger-row .pg-lv { font-size: 13.5px; color: var(--pg-body); line-height: 1.6; }
@media (max-width: 640px) { .pg-ledger-row { grid-template-columns: 1fr; gap: 3px; } }

/* Careers roles */
.pg-role { display: grid; grid-template-columns: 1fr auto auto auto; gap: 26px; align-items: center; padding: 20px 4px; border-bottom: 1px solid var(--pg-hairline-soft); text-decoration: none; }
.pg-role:hover { background: rgba(245, 158, 11, .045); }
.pg-role h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 20px; color: var(--pg-ink); margin: 0; }
.pg-role .pg-rmeta { font-size: 13px; color: var(--pg-muted); white-space: nowrap; }
.pg-role .pg-rgo { font-size: 13px; font-weight: 600; color: var(--pg-gold-800); border-bottom: 1px solid var(--pg-gold-600); padding-bottom: 1px; }
@media (max-width: 700px) { .pg-role { grid-template-columns: 1fr; gap: 6px; } }

/* Blog listing */
.pg-post-lead { display: grid; grid-template-columns: 1.1fr .9fr; gap: 48px; align-items: center; padding-bottom: 44px; border-bottom: 1px solid var(--pg-hairline); margin-bottom: 8px; }
.pg-post-lead img { width: 100%; aspect-ratio: 16/10; object-fit: cover; border-radius: 4px; }
.pg-post-lead h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(26px, 2.8vw, 36px); line-height: 1.15; color: var(--pg-ink); margin: 12px 0 12px; }
@media (max-width: 900px) { .pg-post-lead { grid-template-columns: 1fr; gap: 22px; } }
.pg-post-row { display: grid; grid-template-columns: 150px 1fr auto; gap: 26px; align-items: center; padding: 22px 2px; border-bottom: 1px solid var(--pg-hairline-soft); text-decoration: none; }
.pg-post-row:hover h3 { color: var(--pg-navy-600); }
.pg-post-row img { width: 150px; height: 96px; object-fit: cover; border-radius: 3px; }
.pg-post-row h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 20px; line-height: 1.25; color: var(--pg-ink); margin: 4px 0 6px; }
.pg-post-row .pg-pmeta { font-size: 12.5px; color: var(--pg-muted); }
.pg-post-row .pg-pgo { font-size: 13px; font-weight: 600; color: var(--pg-gold-800); border-bottom: 1px solid var(--pg-gold-600); padding-bottom: 1px; white-space: nowrap; }
@media (max-width: 700px) { .pg-post-row { grid-template-columns: 96px 1fr; } .pg-post-row img { width: 96px; height: 68px; } .pg-post-row .pg-pgo { display: none; } }

/* Content pages: blog index feature card and post grid. The feature is
   a white card with a full-height image beside editorial text; the grid
   below is three columns of image-topped posts. */
.pg-blog-feature { display: grid; grid-template-columns: 1.15fr 1fr; gap: 52px; align-items: center; background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 4px; overflow: hidden; margin-bottom: 56px; text-decoration: none; }
.pg-blog-feature img { width: 100%; height: 100%; object-fit: cover; min-height: 340px; }
.pg-blog-feature .pg-bf-txt { padding: 44px 48px 44px 0; }
.pg-blog-feature h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(26px, 3vw, 36px); line-height: 1.15; color: var(--pg-ink); margin: 14px 0; }
.pg-blog-feature p { font-size: 15px; color: var(--pg-body); line-height: 1.6; margin-bottom: 22px; }

.pg-post-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; padding-bottom: 84px; }
.pg-post { text-decoration: none; display: block; }
.pg-post img { width: 100%; aspect-ratio: 16/9.5; object-fit: cover; border-radius: 3px; margin-bottom: 16px; }
.pg-post .pg-k { font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-gold-800); }
.pg-post h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 20px; line-height: 1.3; color: var(--pg-ink); margin: 8px 0; }
.pg-post:hover h3 { color: var(--pg-navy-600); }
.pg-post p { font-size: 13.5px; color: var(--pg-muted); line-height: 1.5; margin: 0; }
.pg-post .pg-by { font-size: 12px; color: var(--pg-muted); margin-top: 12px; }
.pg-post .pg-by b { color: var(--pg-navy-800); font-weight: 600; }
@media (max-width: 1080px) { .pg-blog-feature { grid-template-columns: 1fr; } .pg-blog-feature img { min-height: 240px; } .pg-blog-feature .pg-bf-txt { padding: 34px; } .pg-post-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .pg-post-grid { grid-template-columns: 1fr; } }

/* Filter bar for category and tag archives: an "all posts" return link
   plus the active-filter label, sitting above the grid. */
.pg-blog-filter { display: flex; align-items: center; gap: 12px; padding-bottom: 18px; margin-bottom: 34px; border-bottom: 1px solid var(--pg-hairline); }
.pg-blog-filter a { font-size: 13px; font-weight: 600; color: var(--pg-gold-800); border-bottom: 1px solid var(--pg-gold-600); padding-bottom: 1px; text-decoration: none; }
.pg-blog-filter a:hover { color: var(--pg-gold-700); }
.pg-blog-filter .pg-sep { color: var(--pg-navy-200); }
.pg-blog-filter .pg-count { font-size: 13px; color: var(--pg-muted); }

/* Article page: centred header, lead image, in-brief box, author card.
   The body prose reuses the shared .pg-prose treatment already proven on
   the event about section. */
.pg-article { padding: 58px 0 40px; }
.pg-article .pg-k { text-align: center; }
.pg-article .pg-k .pg-eyebrow { text-decoration: none; }
.pg-article h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(32px, 4.2vw, 48px); line-height: 1.12; letter-spacing: -0.012em; color: var(--pg-ink); text-align: center; margin: 16px 0 18px; }
.pg-article .pg-byline { text-align: center; font-size: 13px; color: var(--pg-muted); margin-bottom: 44px; }
.pg-article .pg-byline b { color: var(--pg-navy-800); font-weight: 600; }
.pg-article .pg-byline a { color: var(--pg-gold-800); text-decoration: none; }
.pg-lead-img { width: 100%; border-radius: 3px; margin-bottom: 40px; display: block; }
.pg-tldr { background: #fff; border: 1px solid var(--pg-hairline-soft); border-left: 2px solid var(--pg-gold-600); border-radius: 0 3px 3px 0; padding: 22px 26px; margin-bottom: 36px; }
.pg-tldr .pg-t { font-size: 11px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--pg-gold-800); margin-bottom: 8px; }
.pg-tldr p { font-size: 14.5px; line-height: 1.6; color: var(--pg-body); margin: 0; }
.pg-article-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 40px; }
.pg-article-tags .pg-tl { font-size: 13px; color: var(--pg-muted); margin-right: 4px; }
.pg-tagpill { font-size: 12px; font-weight: 600; color: var(--pg-navy-800); border: 1px solid var(--pg-hairline); border-radius: 100px; padding: 4px 12px; text-decoration: none; }
.pg-tagpill:hover { border-color: var(--pg-gold-600); color: var(--pg-gold-800); }
.pg-article-share { display: flex; align-items: center; gap: 12px; margin-top: 28px; }
.pg-article-share .pg-sl { font-size: 13px; color: var(--pg-muted); }
.pg-article-share a { width: 34px; height: 34px; border: 1px solid var(--pg-hairline); border-radius: 2px; display: inline-flex; align-items: center; justify-content: center; color: var(--pg-navy-600); transition: border-color .15s, color .15s; }
.pg-article-share a:hover { border-color: var(--pg-navy-900); color: var(--pg-navy-900); }
.pg-article-share svg { width: 16px; height: 16px; fill: currentColor; }
.pg-author-card { display: flex; gap: 18px; align-items: center; border-top: 1px solid var(--pg-hairline); margin-top: 48px; padding: 28px 0 0; }
.pg-author-card img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.pg-author-card .pg-an { font-weight: 600; color: var(--pg-ink); }
.pg-author-card .pg-an a { color: var(--pg-ink); text-decoration: none; }
.pg-author-card .pg-an a:hover { color: var(--pg-gold-800); }
.pg-author-card .pg-ar { font-size: 13px; color: var(--pg-muted); }

/* Related posts rail on the article page: the same three-up post cards
   as the index grid, under a quiet section rule. */
.pg-related { border-top: 1px solid var(--pg-hairline); margin-top: 56px; padding-top: 44px; }
.pg-related .pg-related-head { font-family: var(--pg-font-display); font-weight: 500; font-size: 22px; color: var(--pg-ink); margin: 0 0 26px; }
.pg-related-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px; }
@media (max-width: 640px) { .pg-related-grid { grid-template-columns: 1fr; } }

/* Guides listing: numbered how-to rows on a narrow column. */
.pg-guide-row { display: flex; align-items: baseline; gap: 26px; padding: 24px 4px; border-bottom: 1px solid var(--pg-hairline-soft); text-decoration: none; }
.pg-guide-row .pg-no { font-family: var(--pg-font-display); font-size: 15px; color: var(--pg-gold-700); font-variant-numeric: tabular-nums; width: 34px; flex-shrink: 0; }
.pg-guide-row h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 22px; line-height: 1.3; color: var(--pg-ink); flex: 1; margin: 0; }
.pg-guide-row:hover h3 { color: var(--pg-gold-700); }
.pg-guide-row .pg-gt { font-size: 12.5px; color: var(--pg-muted); white-space: nowrap; }
@media (max-width: 640px) { .pg-guide-row { flex-wrap: wrap; gap: 8px 26px; } .pg-guide-row .pg-gt { width: 100%; padding-left: 60px; } }

/* Legal pages: a quiet long-form document on the narrow column. The
   centred page head carries the eyebrow and title; below it a small
   updated line, a white contents box, then h2 sections and prose. */
.pg-legal { padding: 24px 0 96px; }
.pg-legal .pg-updated { text-align: center; font-size: 12.5px; color: var(--pg-muted); margin: -30px 0 44px; }
.pg-legal .pg-toc { background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 3px; padding: 22px 26px; margin-bottom: 40px; }
.pg-legal .pg-toc .pg-toc-t { font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-muted); margin-bottom: 12px; }
.pg-legal .pg-toc a { display: block; font-size: 14px; color: var(--pg-navy-800); padding: 4px 0; text-decoration: none; }
.pg-legal .pg-toc a:hover { color: var(--pg-gold-800); }
.pg-legal h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: 22px; line-height: 1.25; color: var(--pg-ink); margin: 34px 0 12px; scroll-margin-top: 96px; }
.pg-legal h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 17px; color: var(--pg-ink); margin: 22px 0 10px; }
.pg-legal p { margin-bottom: 16px; font-size: 15px; line-height: 1.7; color: var(--pg-body); }
.pg-legal ul, .pg-legal ol { margin: 0 0 16px; padding-left: 22px; }
.pg-legal li { font-size: 15px; line-height: 1.7; color: var(--pg-body); margin-bottom: 8px; }
.pg-legal ul li { list-style: none; position: relative; padding-left: 18px; }
.pg-legal ul li::before { content: ""; position: absolute; left: 0; top: 11px; width: 5px; height: 5px; border-radius: 50%; background: var(--pg-gold-600); }
.pg-legal ol { list-style: decimal; }
.pg-legal ol li { padding-left: 4px; }
.pg-legal a:not(.pg-toc a) { color: var(--pg-gold-800); text-decoration: underline; text-underline-offset: 2px; }
.pg-legal strong { color: var(--pg-ink); font-weight: 600; }
.pg-legal .pg-legal-note { background: #fff; border: 1px solid var(--pg-hairline-soft); border-left: 2px solid var(--pg-gold-600); border-radius: 0 3px 3px 0; padding: 18px 22px; margin: 8px 0 24px; }
.pg-legal .pg-legal-note p:last-child { margin-bottom: 0; }

/* Error pages: a single centred column in the editorial voice. The code
   is the Fraunces display face in gold; the headline carries an italic
   gold emphasis. One shell serves every status. */
.pg-err { text-align: center; padding: 110px 24px 130px; }
.pg-err .pg-err-code { font-family: var(--pg-font-display); font-size: 15px; letter-spacing: .3em; color: var(--pg-gold-700); }
.pg-err h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(40px, 6vw, 72px); line-height: 1.05; color: var(--pg-ink); margin: 16px 0 18px; }
.pg-err h1 em { font-style: italic; color: var(--pg-gold-700); }
.pg-err p { color: var(--pg-muted); max-width: 420px; margin: 0 auto 34px; font-size: 15.5px; line-height: 1.6; }
.pg-err .pg-err-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* Careers index: a narrow column of role rows. Each row carries the
   title and its location/type/team meta, a navy type pill, and a quiet
   view-role link. */
.pg-role-row { display: grid; grid-template-columns: 1fr auto auto; gap: 28px; align-items: center; padding: 24px 4px; border-bottom: 1px solid var(--pg-hairline-soft); text-decoration: none; }
.pg-role-row h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 22px; line-height: 1.3; color: var(--pg-ink); margin: 0; }
.pg-role-row:hover h3 { color: var(--pg-gold-700); }
.pg-role-row .pg-rr-meta { font-size: 13px; color: var(--pg-muted); margin-top: 3px; }
.pg-role-row .pg-rr-type { font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--pg-navy-600); background: var(--pg-navy-50); border: 1px solid var(--pg-navy-100); border-radius: 2px; padding: 5px 10px; white-space: nowrap; }
.pg-role-row .pg-rr-go { font-size: 13px; font-weight: 600; color: var(--pg-gold-800); border-bottom: 1px solid var(--pg-gold-600); padding-bottom: 1px; white-space: nowrap; }
@media (max-width: 640px) { .pg-role-row { grid-template-columns: 1fr; gap: 10px; } .pg-role-row .pg-rr-go { display: none; } }

/* Standalone breadcrumb line for the role detail (the detail-head scoped
   crumbs elsewhere do not apply here). */
.pg-crumbs-line { padding: 24px 0 0; font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--pg-muted); font-weight: 500; }
.pg-crumbs-line a { color: var(--pg-muted); text-decoration: none; }
.pg-crumbs-line a:hover { color: var(--pg-gold-800); }
.pg-crumbs-line span { margin: 0 8px; color: var(--pg-navy-200); }

/* Role detail: the title block and the two-column body with prose beside
   a sticky application panel. */
.pg-role-head { padding: 56px 0 12px; }
.pg-role-head h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(30px, 3.8vw, 44px); line-height: 1.08; letter-spacing: -0.012em; color: var(--pg-ink); margin: 0; }
.pg-role-head .pg-rh-meta { font-size: 14px; color: var(--pg-muted); margin-top: 10px; }
.pg-role-body { display: grid; grid-template-columns: 1fr 400px; gap: 56px; padding: 34px 0 96px; align-items: start; }
.pg-role-body .pg-prose ul { padding-left: 20px; margin-bottom: 20px; }
.pg-role-body .pg-prose li { margin-bottom: 8px; font-size: 15.5px; line-height: 1.7; color: var(--pg-body); }
.pg-role-body .pg-apply-panel { position: sticky; top: 150px; margin: 0; }
@media (max-width: 1080px) { .pg-role-body { grid-template-columns: 1fr; gap: 40px; } .pg-role-body .pg-apply-panel { position: static; } }

/* Careers flow utility screens (exam gate, interview, offer, KYC and
   their outcomes): a centred narrow column sharing the panel and prose
   language, with a status glyph the outcome pages use. */
.pg-flow { max-width: 640px; margin: 0 auto; padding: 72px 24px 96px; }
.pg-flow-narrow { max-width: 560px; }
.pg-flow-head { text-align: center; margin-bottom: 36px; }
.pg-flow-head .pg-eyebrow { display: block; margin-bottom: 12px; }
.pg-flow-head h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(28px, 3.4vw, 40px); line-height: 1.1; color: var(--pg-ink); margin: 0 0 14px; }
.pg-flow-head p { font-size: 15.5px; line-height: 1.65; color: var(--pg-muted); max-width: 460px; margin: 0 auto; }
.pg-flow-status { text-align: center; padding: 24px 24px 8px; }
.pg-flow-status .pg-fs-mark { width: 56px; height: 56px; margin: 0 auto 22px; display: flex; align-items: center; justify-content: center; border-radius: 50%; border: 1.5px solid var(--pg-gold-600); }
.pg-flow-status .pg-fs-mark svg { width: 26px; height: 26px; fill: none; stroke: var(--pg-gold-700); stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.pg-flow-status .pg-fs-mark.pg-fs-muted { border-color: var(--pg-hairline); }
.pg-flow-status .pg-fs-mark.pg-fs-muted svg { stroke: var(--pg-muted); }
.pg-flow-status h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(28px, 3.4vw, 40px); line-height: 1.1; color: var(--pg-ink); margin: 0 0 14px; }
.pg-flow-status p { font-size: 15.5px; line-height: 1.65; color: var(--pg-body); max-width: 460px; margin: 0 auto 12px; }
.pg-flow-status .pg-fs-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 26px; }

/* Confirmation actions */
.pg-confirm-hero { padding: 120px 0 44px; text-align: center; border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-confirm-hero .pg-ok { width: 52px; height: 52px; border-radius: 50%; border: 1.5px solid var(--pg-gold-600); color: var(--pg-gold-700); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 18px; }
.pg-confirm-hero h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(30px, 3.6vw, 46px); letter-spacing: -0.012em; color: var(--pg-ink); margin: 0 0 10px; }
.pg-confirm-hero h1 em { font-style: italic; color: var(--pg-gold-700); }
.pg-order-badge { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; color: var(--pg-navy-800); border: 1px solid var(--pg-hairline); border-radius: 2px; padding: 8px 14px; margin-top: 14px; font-variant-numeric: tabular-nums; }
.pg-confirm-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 26px; }

/* Summary head inset for the checkout card paddings */
.pg-sum-head-in { margin: -16px -16px 16px; }
@media (min-width: 640px) { .pg-sum-head-in { margin: -24px -24px 20px; } }

/* ---------------------------------------------------------------
   Event page ticket panel: the approved composition with per-type
   quantity steppers and the running total.
   --------------------------------------------------------------- */
.pg-tbox {
    position: sticky; top: 104px;
    background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 5px;
    box-shadow: 0 24px 60px -20px rgba(23, 42, 68, .25);
}
.pg-tbox-head {
    display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
    padding: 20px 24px; background: var(--pg-navy-900); border-radius: 5px 5px 0 0;
}
.pg-tbox-head .pg-t { font-size: 11px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--pg-gold-500); }
.pg-tbox-head .pg-d { font-size: 12px; color: var(--pg-navy-300); white-space: nowrap; }
.pg-tk-row { padding: 18px 24px; border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-tk-row.pg-soldout .pg-n, .pg-tk-row.pg-soldout .pg-p, .pg-tk-row.pg-soldout .pg-tk-desc { opacity: .5; }
.pg-tk-top { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.pg-tk-top .pg-n { font-size: 15px; font-weight: 600; color: var(--pg-ink); min-width: 0; }
.pg-tk-top .pg-p { font-size: 15px; font-weight: 700; color: var(--pg-navy-900); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pg-tk-desc { font-size: 12.5px; color: var(--pg-muted); line-height: 1.5; margin-top: 3px; }
.pg-tk-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; }
.pg-tk-note { font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--pg-gold-800); }
.pg-tk-note.pg-quiet { color: var(--pg-muted); font-weight: 500; }
.pg-tk-note.pg-urgent { color: #dc2626; font-weight: 700; }
.pg-tk-wait { font-size: 12.5px; font-weight: 600; color: var(--pg-navy-800); border-bottom: 1px solid var(--pg-gold-600); padding-bottom: 1px; background: none; border-top: 0; border-left: 0; border-right: 0; cursor: pointer; }
.pg-qty { display: inline-flex; align-items: center; border: 1px solid var(--pg-hairline); border-radius: 2px; background: #fff; }
.pg-qty button { width: 32px; height: 32px; border: 0; background: transparent; font-size: 16px; color: var(--pg-navy-900); cursor: pointer; line-height: 1; }
.pg-qty button:hover:not(:disabled) { background: var(--pg-navy-50); }
.pg-qty button:disabled { color: var(--pg-navy-200); cursor: default; }
.pg-qty .pg-v { width: 34px; text-align: center; font-size: 14px; font-weight: 600; color: var(--pg-ink); font-variant-numeric: tabular-nums; }
.pg-tk-total { position: relative; padding: 20px 24px 22px; border-top: 1px dashed var(--pg-hairline); }
.pg-tk-total::before, .pg-tk-total::after {
    content: ""; position: absolute; top: -8px; width: 16px; height: 16px;
    background: var(--pg-ivory); border-radius: 50%; border: 1px solid var(--pg-hairline-soft);
}
.pg-tk-total::before { left: -9px; }
.pg-tk-total::after { right: -9px; }
.pg-tk-line { display: flex; justify-content: space-between; font-size: 14px; color: var(--pg-body); padding: 3px 0; font-variant-numeric: tabular-nums; }
.pg-tk-line .pg-fee { color: var(--pg-muted); }
.pg-tk-line.pg-grand { font-size: 16px; font-weight: 700; color: var(--pg-ink); border-top: 0; margin: 8px 0 4px; padding-top: 6px; }
.pg-tk-secure { font-size: 11.5px; color: var(--pg-muted); text-align: center; margin-top: 12px; }
.pg-tk-policy { padding: 14px 24px 18px; font-size: 12px; color: var(--pg-muted); line-height: 1.6; border-top: 1px solid var(--pg-hairline-soft); }
.pg-tk-policy b { color: var(--pg-navy-800); font-weight: 600; }

/* Schedule rows with cover thumbnails. The date plate lives inside
   the thumb wrapper and straddles the cover's right edge, roughly
   half on the photograph and half on the page ground, per the
   approved homepage note. The row grid reserves breathing room for
   the protruding half so the title never collides with the plate. */
.pg-sched-row-img { grid-template-columns: 96px 1fr auto auto; column-gap: 88px; }
.pg-sched-thumb { position: relative; width: 96px; height: 96px; border-radius: 3px; background: var(--pg-navy-100); display: block; }
.pg-sched-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 3px; }
.pg-sched-datebleed {
    position: absolute; top: 50%; left: 100%; transform: translate(-50%, -50%);
    background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 2px;
    padding: 10px 14px 8px; text-align: center; z-index: 2;
    box-shadow: 0 10px 24px -12px rgba(23, 42, 68, .35);
}
.pg-sched-datebleed .pg-d { font-family: var(--pg-font-display); font-size: 30px; line-height: 1; color: var(--pg-ink); font-weight: 500; font-variant-numeric: tabular-nums; }
.pg-sched-datebleed .pg-m { font-size: 10px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--pg-gold-800); margin-top: 3px; }
.pg-sched-row-img:hover .pg-sched-datebleed { border-color: var(--pg-gold-600); }
@media (max-width: 640px) {
    .pg-sched-row-img { grid-template-columns: 72px 1fr; column-gap: 56px; }
    .pg-sched-thumb { width: 72px; height: 72px; }
    .pg-sched-datebleed { padding: 7px 10px 6px; }
    .pg-sched-datebleed .pg-d { font-size: 21px; }
    .pg-sched-datebleed .pg-m { font-size: 9px; letter-spacing: .14em; }
}

/* Countdown and summary head insets across the checkout card paddings */
.pg-sum-cd { margin: -16px -16px 0; }
.pg-sum-head-mid { margin: 0 -16px 16px; }
@media (min-width: 640px) {
    .pg-sum-cd { margin: -24px -24px 0; }
    .pg-sum-head-mid { margin: 0 -24px 20px; }
}

/* ---------------------------------------------------------------
   Event detail: the approved composition. Breadcrumb strip, framed
   cover carousel, editorial facts ledger, open prose sections, the
   host band, and the sticky Admit One panel in the right rail.
   --------------------------------------------------------------- */
.pg-crumb-strip {
    padding-top: 22px; font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase;
    color: var(--pg-muted); font-weight: 500;
}
.pg-crumb-strip a { color: var(--pg-muted); text-decoration: none; }
.pg-crumb-strip a:hover { color: var(--pg-gold-800); }
.pg-crumb-strip .pg-sep { margin: 0 8px; color: var(--pg-navy-200); }

.pg-detail { display: grid; grid-template-columns: minmax(0, 1fr) 384px; gap: 64px; padding-top: 28px; padding-bottom: 96px; align-items: start; }

/* Framed cover carousel. The gallery frame is a thin gold rule offset
   to the lower right; the stage keeps a calm fixed ratio and contains
   the artwork, so portrait flyers letterbox on a quiet ground instead
   of being cropped. */
.pg-carousel { position: relative; margin-bottom: 42px; }
.pg-carousel::before { content: ""; position: absolute; inset: 16px -16px -16px 16px; border: 1px solid var(--pg-gold-600); border-radius: 3px; pointer-events: none; }
.pg-carousel .pg-stage { position: relative; aspect-ratio: 16 / 9.2; border-radius: 3px; overflow: hidden; background: var(--pg-navy-100); }

/* Each multi-image slide is a full-stage layer for the cross-fade. The
   solo case has no wrapper, so the stage rules also target a direct
   image and its sibling backdrop. */
.pg-carousel .pg-slide { position: absolute; inset: 0; }
.pg-carousel .pg-stage > img,
.pg-carousel .pg-slide > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; z-index: 1; }
.pg-carousel .pg-stage > img.pg-fill,
.pg-carousel .pg-slide > img.pg-fill { object-fit: cover; }

/* Blurred backdrop: a zoomed copy of the same artwork fills the gutters
   behind a contained (portrait or narrow) image, so the sides carry the
   artwork's own colour rather than a flat band. It is scaled up and
   blurred, then dimmed slightly so the crisp foreground stays dominant.
   Switched off once the image is known to fill the stage. */
.pg-carousel .pg-stage-bg {
    position: absolute; inset: 0; z-index: 0;
    background-size: cover; background-position: center;
    transform: scale(1.18); filter: blur(26px) saturate(1.05) brightness(.82);
    opacity: 1; transition: opacity .3s ease;
}
.pg-carousel .pg-slide-fill .pg-stage-bg,
.pg-carousel .pg-stage.pg-slide-fill > .pg-stage-bg { opacity: 0; }
@media (prefers-reduced-motion: reduce) {
    .pg-carousel .pg-stage-bg { transition: none; }
}
.pg-cnav {
    position: absolute; top: 50%; transform: translateY(-50%); width: 42px; height: 42px;
    background: rgba(255, 253, 247, .94); border: 1px solid var(--pg-hairline); border-radius: 2px;
    cursor: pointer; font-size: 17px; color: var(--pg-navy-900); z-index: 4; line-height: 1;
}
.pg-cnav:hover { background: #fff; }
.pg-cnav.pg-prev { left: 14px; }
.pg-cnav.pg-next { right: 14px; }
.pg-ccount {
    position: absolute; bottom: 12px; right: 12px; z-index: 4; font-size: 11px; font-weight: 600;
    letter-spacing: .08em; background: rgba(23, 42, 68, .78); color: #fff; padding: 4px 10px;
    border-radius: 2px; font-variant-numeric: tabular-nums;
}
.pg-cthumbs { position: relative; z-index: 2; display: flex; gap: 10px; margin-top: 14px; }
.pg-cthumbs img, .pg-cthumbs button {
    width: 82px; height: 56px; object-fit: cover; border-radius: 2px; cursor: pointer;
    opacity: .55; border: 1px solid transparent; transition: opacity .2s, border-color .2s; padding: 0; background: var(--pg-navy-100);
}
.pg-cthumbs button img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 2px; opacity: 1; border: 0; }
.pg-cthumbs .pg-on { opacity: 1; border-color: var(--pg-gold-600); }
.pg-carousel-solo::before { inset: 16px -16px -16px 16px; }

.pg-detail-h1 {
    font-family: var(--pg-font-display); font-weight: 500;
    font-size: clamp(32px, 4vw, 46px); line-height: 1.08; letter-spacing: -0.012em;
    color: var(--pg-ink); margin: 14px 0 10px;
}
.pg-detail-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin: 22px 0 30px; }
.pg-detail-actions a, .pg-detail-actions button {
    font-size: 13px; font-weight: 600; color: var(--pg-navy-800);
    border-bottom: 1px solid var(--pg-hairline); padding: 0 0 2px; text-decoration: none;
    background: none; border-top: 0; border-left: 0; border-right: 0; cursor: pointer; line-height: 1.4;
}
.pg-detail-actions a:hover, .pg-detail-actions button:hover { border-bottom-color: var(--pg-gold-600); color: var(--pg-gold-800); }

/* Share popover: quiet editorial menu behind the Share text action. */
.pg-share-menu {
    position: absolute; top: calc(100% + 10px); left: 0; z-index: 30; min-width: 210px;
    background: #fff; border: 1px solid var(--pg-hairline); border-radius: 3px;
    box-shadow: 0 18px 44px -18px rgba(23, 42, 68, .3); padding: 6px 0;
}
.pg-share-menu a, .pg-share-menu button {
    display: block; width: 100%; text-align: left; padding: 9px 16px; font-size: 13.5px;
    color: var(--pg-ink); text-decoration: none; background: none; border: 0; cursor: pointer;
}
.pg-share-menu a:hover, .pg-share-menu button:hover { background: var(--pg-navy-50); color: var(--pg-navy-900); }
.pg-share-menu .pg-share-rule { border-top: 1px solid var(--pg-hairline-soft); margin: 6px 0; }

.pg-fact .pg-fv .pg-sub { display: block; font-size: 13px; color: var(--pg-muted); font-weight: 400; margin-top: 2px; }
.pg-fact .pg-fv a { color: var(--pg-gold-800); font-weight: 600; border-bottom: 1px solid var(--pg-gold-400); text-decoration: none; }

.pg-prose-head { font-family: var(--pg-font-display); font-weight: 500; font-size: 26px; letter-spacing: -0.012em; color: var(--pg-ink); margin: 0 0 16px; }
.pg-about { margin-top: 6px; }
.pg-about .pg-prose { max-width: 640px; color: var(--pg-body); font-size: 15px; line-height: 1.75; }
.pg-about .pg-prose p { margin: 0 0 16px; }
.pg-about .pg-prose ul, .pg-about .pg-prose ol { margin: 0 0 16px 20px; }
.pg-about .pg-prose a { color: var(--pg-gold-800); border-bottom: 1px solid var(--pg-gold-400); text-decoration: none; }
.pg-mapblock { margin-top: 42px; }
.pg-map-note { font-size: 11.5px; color: var(--pg-muted); margin: 0; }

.pg-host {
    display: flex; align-items: center; gap: 16px; margin-top: 42px; padding: 22px;
    background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 4px;
}
.pg-host-id { display: flex; align-items: center; gap: 16px; min-width: 0; text-align: left; background: none; border: 0; padding: 0; cursor: pointer; }
.pg-host img, .pg-host .pg-host-mono { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; flex: none; }
/* Resilient organiser avatar: the logo image sits over a monogram that
   only appears if the image fails to load. The wrapper carries the
   circle shape and the loading shimmer. */
.pg-host-avatar { position: relative; width: 52px; height: 52px; border-radius: 50%; overflow: hidden; flex: none; display: block; }
.pg-host-avatar img { position: relative; z-index: 2; width: 52px; height: 52px; object-fit: cover; border-radius: 50%; display: block; }
.pg-host-avatar-mono {
    position: absolute; inset: 0; z-index: 1; display: none;
    align-items: center; justify-content: center;
    background: var(--pg-navy-900); color: var(--pg-gold-500);
    font-family: var(--pg-font-display); font-size: 19px; font-weight: 500;
}
.pg-host-avatar.pg-host-avatar-fallback { background: var(--pg-navy-900); }
.pg-host-avatar.pg-host-avatar-fallback .pg-host-avatar-mono { display: flex; }
.pg-modal-head .pg-host-avatar, .pg-modal-head .pg-host-avatar img { width: 56px; height: 56px; }
.pg-host .pg-host-mono {
    display: flex; align-items: center; justify-content: center; background: var(--pg-navy-900);
    color: var(--pg-gold-500); font-family: var(--pg-font-display); font-size: 19px; font-weight: 500;
}
.pg-host .pg-hn { font-weight: 600; color: var(--pg-ink); font-size: 15px; display: flex; align-items: center; gap: 6px; }
.pg-host .pg-hn .pg-verified { flex: none; }
.pg-verified-badge { display: inline-block; vertical-align: -2px; flex: none; }
.pg-host-id:hover .pg-hn { color: var(--pg-navy-600); }
.pg-host .pg-hr { font-size: 12.5px; color: var(--pg-muted); margin-top: 2px; }
.pg-host .pg-follow { margin-left: auto; flex: none; }
@media (max-width: 640px) {
    .pg-host { flex-direction: column; align-items: stretch; gap: 16px; padding: 18px; }
    .pg-host-id { align-items: flex-start; gap: 13px; }
    .pg-host img, .pg-host .pg-host-mono, .pg-host-avatar, .pg-host-avatar img { width: 46px; height: 46px; }
    .pg-host .pg-hn { font-size: 14.5px; }
    .pg-host .pg-hr { font-size: 12px; line-height: 1.55; margin-top: 3px; }
    .pg-host .pg-follow { margin-left: 0; }
    .pg-host .pg-follow .pg-btn { width: 100%; }
}

/* Countdown strip: lives directly beneath the Admit One masthead and
   on the checkout summary. Tabular digits keep the tick steady. */
.pg-cd { background: #fff; border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-cd-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.pg-cd-cell { text-align: center; padding: 12px 4px 10px; border-right: 1px solid var(--pg-hairline-soft); }
.pg-cd-cell:last-child { border-right: 0; }
.pg-cd-num { font-size: 20px; font-weight: 700; color: var(--pg-ink); font-variant-numeric: tabular-nums; line-height: 1; }
.pg-cd-lbl { font-size: 9.5px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-gold-800); margin-top: 4px; }
.pg-cd-line { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 13px 16px; font-size: 12.5px; font-weight: 600; color: var(--pg-ink); }
.pg-cd-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--pg-gold-600); animation: pgCdPulse 1.6s ease-in-out infinite; }
@keyframes pgCdPulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .pg-cd-dot { animation: none; } }
.pg-cd-quiet { padding: 12px 16px; font-size: 12.5px; color: var(--pg-muted); text-align: center; }

/* Recurring events: the date list inside the panel. */
.pg-dates { padding: 14px 24px 4px; }
.pg-dates-label { font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-muted); margin-bottom: 8px; }
.pg-date-opt {
    display: flex; align-items: center; gap: 10px; padding: 10px 12px; margin-bottom: 8px;
    border: 1px solid var(--pg-hairline); border-radius: 2px; cursor: pointer; transition: border-color .15s, background .15s;
}
.pg-date-opt:hover { border-color: var(--pg-navy-300); }
.pg-date-opt.pg-picked { border-color: var(--pg-navy-900); background: var(--pg-navy-50); }
.pg-date-opt input { accent-color: var(--pg-navy-900); }
.pg-date-opt .pg-do-main { font-size: 13px; font-weight: 600; color: var(--pg-ink); }
.pg-date-opt .pg-do-sub { font-size: 11.5px; color: var(--pg-muted); }
.pg-date-opt .pg-do-flag { margin-left: auto; font-size: 10.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--pg-muted); white-space: nowrap; }
.pg-date-opt .pg-do-flag.pg-soldflag { color: #b91c1c; }
.pg-dates-scroll { max-height: 200px; overflow-y: auto; }

/* Panel empty and closed states. */
.pg-tk-state { text-align: center; padding: 30px 20px; }
.pg-tk-state .pg-lead { color: var(--pg-ink); font-weight: 600; font-size: 14px; margin: 0 0 4px; }
.pg-tk-state .pg-note { color: var(--pg-muted); font-size: 13px; margin: 0; }

/* Editorial FAQ rows. */
.pg-faq { margin-top: 42px; }
.pg-faq details { border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-faq details:first-of-type { border-top: 1px solid var(--pg-hairline); }
.pg-faq summary {
    display: flex; align-items: baseline; justify-content: space-between; gap: 16px;
    padding: 16px 2px; cursor: pointer; list-style: none; font-size: 15px; font-weight: 600; color: var(--pg-ink);
}
.pg-faq summary::-webkit-details-marker { display: none; }
.pg-faq summary .pg-faq-mark { font-family: var(--pg-font-display); font-size: 18px; color: var(--pg-gold-700); flex: none; transition: transform .2s; }
.pg-faq details[open] summary .pg-faq-mark { transform: rotate(45deg); }
.pg-faq .pg-faq-a { padding: 0 2px 18px; font-size: 14px; color: var(--pg-body); line-height: 1.7; white-space: pre-line; max-width: 640px; }

/* Editorial reviews. */
.pg-revs { margin-top: 42px; }
.pg-revs-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 14px; margin-bottom: 20px; }
.pg-rev-agg { display: flex; align-items: baseline; gap: 10px; }
.pg-rev-agg .pg-num { font-family: var(--pg-font-display); font-size: 34px; font-weight: 500; color: var(--pg-ink); line-height: 1; }
.pg-stars { color: var(--pg-gold-600); font-size: 14px; letter-spacing: 2px; }
.pg-stars .pg-off { color: var(--pg-navy-200); }
.pg-rev-agg .pg-ct { font-size: 12.5px; color: var(--pg-muted); }
.pg-rev-card {
    height: 100%; background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 3px;
    padding: 20px 22px; display: flex; flex-direction: column;
}
.pg-rev-card .pg-rev-kind { font-size: 10.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--pg-muted); }
.pg-rev-card .pg-rev-body { font-size: 14px; color: var(--pg-body); line-height: 1.7; margin: 10px 0 14px; }
.pg-rev-card .pg-rev-by { margin-top: auto; font-size: 12.5px; color: var(--pg-ink); font-weight: 600; }
.pg-rev-card .pg-rev-date { font-size: 11.5px; color: var(--pg-muted); font-weight: 400; }
.pg-rev-nav { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 18px; }
.pg-rev-nav .pg-rev-dot { width: 7px; height: 7px; border-radius: 50%; border: 1px solid var(--pg-navy-300); background: transparent; padding: 0; cursor: pointer; }
.pg-rev-nav .pg-rev-dot.pg-on { background: var(--pg-gold-600); border-color: var(--pg-gold-600); }
.pg-rev-arrows button {
    width: 34px; height: 34px; border: 1px solid var(--pg-hairline); background: #fff; border-radius: 2px;
    color: var(--pg-navy-900); cursor: pointer; font-size: 15px; line-height: 1;
}
.pg-rev-arrows button:hover:not(:disabled) { border-color: var(--pg-navy-900); }
.pg-rev-arrows button:disabled { color: var(--pg-navy-200); cursor: default; }
.pg-rev-more { color: var(--pg-gold-800); background: none; border: 0; border-bottom: 1px solid var(--pg-gold-400); padding: 0 0 1px; font-size: 12px; font-weight: 600; cursor: pointer; }

/* Featured people rows. */
.pg-people { margin-top: 42px; }
.pg-people-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 24px; }
@media (max-width: 640px) { .pg-people-grid { grid-template-columns: 1fr; } }
.pg-person { display: flex; gap: 14px; align-items: flex-start; padding: 14px 0; border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-person img, .pg-person .pg-person-mono { width: 52px; height: 52px; border-radius: 2px; object-fit: cover; flex: none; }
.pg-person .pg-person-mono {
    display: flex; align-items: center; justify-content: center; background: var(--pg-navy-50);
    color: var(--pg-navy-700); font-family: var(--pg-font-display); font-size: 18px; font-weight: 500;
}
.pg-person .pg-pn { font-weight: 600; font-size: 15px; color: var(--pg-ink); }
.pg-person .pg-pt { font-size: 12px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--pg-gold-800); margin-top: 2px; }
.pg-person .pg-pb { font-size: 13px; color: var(--pg-muted); line-height: 1.6; margin-top: 4px; }
.pg-person .pg-plinks { display: flex; gap: 12px; margin-top: 6px; }
.pg-person .pg-plinks a { font-size: 12px; font-weight: 600; color: var(--pg-navy-800); border-bottom: 1px solid var(--pg-hairline); text-decoration: none; }
.pg-person .pg-plinks a:hover { color: var(--pg-gold-800); border-bottom-color: var(--pg-gold-600); }

/* Virtual event note. */
.pg-virtual { margin-top: 42px; }
.pg-virtual-panel { border: 1px solid var(--pg-hairline-soft); border-left: 2px solid var(--pg-gold-600); border-radius: 3px; background: #fff; padding: 18px 20px; max-width: 640px; }
.pg-virtual-panel .pg-vk { font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-gold-800); }
.pg-virtual-panel .pg-vv { font-size: 15px; font-weight: 600; color: var(--pg-ink); margin-top: 4px; }
.pg-virtual-panel .pg-vn { font-size: 13px; color: var(--pg-muted); margin-top: 6px; line-height: 1.6; }

/* Keep exploring rail below the detail grid. */
.pg-morelike { padding-bottom: 96px !important; padding-top: 90px !important; }
.pg-cards-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
@media (max-width: 1100px) { .pg-cards-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .pg-cards-4 { grid-template-columns: 1fr; } }

/* Mobile purchase bar. */
/* Mobile fixed purchase bar, per the approved mockup: white band with a
   soft top shadow, the price in ink with a muted sublabel below it, and
   a navy button that takes the remaining width. */
.pg-mobilebar { background: #fff; border-top: 1px solid var(--pg-hairline); box-shadow: 0 -8px 30px rgba(23, 42, 68, .12); }
.pg-mobilebar-in { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 0; }
.pg-mobilebar .pg-mb-v { font-size: 16px; font-weight: 700; color: var(--pg-ink); font-variant-numeric: tabular-nums; }
.pg-mobilebar .pg-mb-k { font-size: 11px; font-weight: 500; color: var(--pg-muted); margin-top: 1px; letter-spacing: 0; text-transform: none; }
.pg-mobilebar .pg-btn { flex: 1; padding: 14px; font-size: 14px; }
.pg-mobilebar-shim { background: #fff; }

/* Preview ribbon for organisers. */
.pg-preview-bar { background: var(--pg-navy-900); border-bottom: 1px solid rgba(245, 158, 11, .45); }
.pg-preview-in { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 0; }
.pg-preview-in .pg-pv-t { color: #fff; font-size: 13px; font-weight: 600; }
.pg-preview-in .pg-pv-s { color: var(--pg-navy-300); font-size: 11.5px; }
.pg-preview-in .pg-pv-flag { font-size: 10px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-gold-500); border: 1px solid rgba(245, 158, 11, .4); border-radius: 2px; padding: 4px 10px; white-space: nowrap; }

/* Organiser modal, Programme surfaces. */
.pg-modal-panel { border-radius: 6px 6px 0 0; }
@media (min-width: 640px) { .pg-modal-panel { border-radius: 5px; } }
.pg-modal-head { background: var(--pg-navy-900); padding: 26px 24px 22px; }
.pg-modal-head .pg-mh-n { color: #fff; font-family: var(--pg-font-display); font-weight: 500; font-size: 20px; display: flex; align-items: center; gap: 8px; min-width: 0; }
.pg-modal-head .pg-mh-r { color: var(--pg-navy-300); font-size: 12px; margin-top: 3px; }
.pg-modal-head img, .pg-modal-head .pg-host-mono { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; flex: none; }
.pg-modal-head .pg-host-mono {
    display: flex; align-items: center; justify-content: center;
    background: var(--pg-navy-900); color: var(--pg-gold-500);
    font-family: var(--pg-font-display); font-size: 21px; font-weight: 500;
}
.pg-modal-stat { text-align: center; border: 1px solid var(--pg-hairline-soft); border-radius: 3px; padding: 12px 6px; }
.pg-modal-stat .pg-ms-n { font-family: var(--pg-font-display); font-size: 22px; font-weight: 500; color: var(--pg-ink); line-height: 1; }
.pg-modal-stat .pg-ms-l { font-size: 10px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--pg-muted); margin-top: 5px; }

/* The detail grid collapses to one column below the rail breakpoint;
   the panel sits in flow and the page bottom padding shrinks. */
@media (max-width: 1024px) {
    .pg-detail { grid-template-columns: 1fr; gap: 44px; padding-bottom: 64px; }
    .pg-morelike { padding-bottom: 64px; }
    .pg-tbox { position: static; }
    .pg-carousel::before { inset: 12px -8px -12px 8px; }
    .pg-morelike { padding-bottom: 64px; }
}

/* Venue line on the Keep exploring cards. */
.pg-card .pg-card-where { display: block; font-size: 12.5px; color: var(--pg-muted); margin-top: 3px; }

/* ---------------------------------------------------------------
   Checkout: the buy flow. Two column layout, editorial panels with
   an eyebrow heading, quiet form fields, attendee cards, the single
   or selectable gateway, and the punched order summary. Values match
   the approved mockup's checkout screen.
   --------------------------------------------------------------- */
.pg-co { padding: 36px 0 96px; }
.pg-co-layout { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 56px; align-items: start; }
.pg-co-main { min-width: 0; }
.pg-co h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(30px, 3.6vw, 42px); color: var(--pg-ink); margin: 0 0 8px; letter-spacing: -0.01em; }
.pg-co-sub { font-size: 14px; color: var(--pg-muted); margin: 0 0 30px; }
.pg-co-sub b { color: var(--pg-gold-800); font-weight: 600; font-variant-numeric: tabular-nums; }
.pg-co-back { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; color: var(--pg-body); text-decoration: none; margin-bottom: 22px; }
.pg-co-back:hover { color: var(--pg-navy-900); }
.pg-co-dateband { display: flex; align-items: center; justify-content: space-between; gap: 14px; background: var(--pg-navy-900); color: #fff; border-radius: 4px; padding: 14px 18px; margin-bottom: 22px; }
.pg-co-dateband .k { font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--pg-navy-300); font-weight: 600; }
.pg-co-dateband .v { font-family: var(--pg-font-display); font-size: 16px; margin-top: 2px; }
.pg-co-dateband a { font-size: 12px; font-weight: 600; color: var(--pg-gold-500); text-decoration: none; border-bottom: 1px solid rgba(245, 158, 11, .5); white-space: nowrap; }

/* Panels */
.pg-panel { background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 4px; padding: 28px; margin-bottom: 26px; }
.pg-panel-h { font-family: var(--pg-font-display); font-weight: 500; font-size: 21px; color: var(--pg-ink); margin: 0 0 20px; }
.pg-panel-h small { font-family: var(--pg-font-sans); font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--pg-muted); display: block; margin-bottom: 8px; }
.pg-panel-sub { font-size: 13px; color: var(--pg-muted); margin: -12px 0 18px; }

/* Form fields */
.pg-frm { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 18px; }
.pg-frm .pg-full { grid-column: 1 / -1; }
.pg-fld label { display: block; font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--pg-muted); margin-bottom: 7px; }
.pg-fld label .pg-req { color: var(--pg-gold-700); }
.pg-input, .pg-fld input, .pg-fld select, .pg-fld textarea {
    width: 100%; font-family: var(--pg-font-sans); font-size: 14.5px; color: var(--pg-ink);
    background: #fff; border: 1px solid var(--pg-hairline); border-radius: 2px; padding: 12px 14px; outline: 0;
    transition: border-color .15s;
}
.pg-input:focus, .pg-fld input:focus, .pg-fld select:focus, .pg-fld textarea:focus { border-color: var(--pg-navy-500); }
.pg-input.pg-input-err, .pg-fld .pg-input-err { border-color: #dc8a8a; background: #fdf7f7; }
.pg-fld-err { font-size: 12px; color: #b64545; margin-top: 7px; }
.pg-help { font-size: 12px; color: var(--pg-muted); margin-top: 7px; }
.pg-ok-line { font-size: 12.5px; color: #047857; margin-top: 8px; }

/* Segmented choice (currency) and pill options (radio, checkbox group) */
.pg-seg { display: flex; gap: 10px; }
.pg-seg button { flex: 1; padding: 11px 14px; font-size: 13px; font-weight: 600; border: 1px solid var(--pg-hairline); background: #fff; color: var(--pg-body); border-radius: 2px; cursor: pointer; transition: all .15s; }
.pg-seg button.pg-on { border-color: var(--pg-navy-900); color: var(--pg-navy-900); box-shadow: inset 0 0 0 1px var(--pg-navy-900); }
.pg-pill { display: inline-flex; align-items: center; gap: 9px; padding: 10px 16px; font-size: 13px; font-weight: 600; border: 1px solid var(--pg-hairline); background: #fff; color: var(--pg-body); border-radius: 2px; cursor: pointer; transition: all .15s; }
.pg-pill:hover { border-color: var(--pg-navy-400); }
.pg-pill.pg-on { border-color: var(--pg-navy-900); color: var(--pg-navy-900); box-shadow: inset 0 0 0 1px var(--pg-navy-900); }
.pg-pill .pg-dot { width: 14px; height: 14px; border-radius: 50%; border: 1.5px solid var(--pg-navy-300); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.pg-pill.pg-on .pg-dot { border-color: var(--pg-navy-900); }
.pg-pill .pg-dot i { width: 6px; height: 6px; border-radius: 50%; background: var(--pg-navy-900); }
.pg-pill .pg-sq { width: 14px; height: 14px; border-radius: 2px; border: 1.5px solid var(--pg-navy-300); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.pg-pill.pg-on .pg-sq { border-color: var(--pg-navy-900); background: var(--pg-navy-900); }

/* Editorial toggle switch */
.pg-switch { position: relative; display: inline-flex; width: 44px; height: 24px; border-radius: 999px; background: var(--pg-navy-100); border: 0; cursor: pointer; transition: background .18s; flex: none; }
.pg-switch.pg-on { background: var(--pg-navy-900); }
.pg-switch i { position: absolute; top: 2px; left: 2px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(23,42,68,.3); transition: transform .18s; }
.pg-switch.pg-on i { transform: translateX(20px); }

/* Ticket rows on checkout */
.pg-co-tk { border: 1px solid var(--pg-hairline-soft); border-radius: 3px; padding: 16px 18px; }
.pg-co-tk + .pg-co-tk { margin-top: 12px; }
.pg-co-tk.pg-soldout { opacity: .55; background: var(--pg-navy-50); }
.pg-co-tk .pg-tk-name { font-size: 14.5px; font-weight: 600; color: var(--pg-ink); }
.pg-co-tk .pg-tk-price { font-size: 14.5px; font-weight: 700; color: var(--pg-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pg-co-tk .pg-tk-desc { font-size: 13px; color: var(--pg-muted); margin-top: 5px; }
.pg-avail { font-size: 11.5px; font-weight: 600; color: var(--pg-gold-800); margin-top: 8px; }
.pg-avail.pg-urgent { color: #dc2626; font-weight: 700; }
.pg-qty { display: inline-flex; align-items: center; gap: 0; border: 1px solid var(--pg-hairline); border-radius: 2px; }
.pg-qty button { width: 38px; height: 38px; border: 0; background: #fff; color: var(--pg-navy-900); font-size: 17px; cursor: pointer; line-height: 1; }
.pg-qty button:disabled { color: var(--pg-navy-200); cursor: default; }
.pg-qty .pg-q { width: 40px; text-align: center; font-size: 14.5px; font-weight: 700; color: var(--pg-ink); font-variant-numeric: tabular-nums; }

/* Attendee cards */
.pg-att-card { border: 1px solid var(--pg-hairline-soft); border-radius: 3px; padding: 18px 20px 20px; margin-bottom: 14px; background: var(--pg-ivory); }
.pg-att-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 14px; gap: 12px; flex-wrap: wrap; }
.pg-att-title { font-size: 13px; font-weight: 600; color: var(--pg-ink); }
.pg-att-title .pg-unit { font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--pg-gold-800); margin-left: 8px; }
.pg-same { font-size: 12px; font-weight: 600; color: var(--pg-gold-800); border: 0; background: none; padding: 0; border-bottom: 1px solid var(--pg-gold-400); cursor: pointer; white-space: nowrap; }
.pg-same:disabled { opacity: .4; cursor: default; }
.pg-group-note { font-size: 12.5px; color: var(--pg-body); background: var(--pg-gold-100); border: 1px solid var(--pg-gold-200); border-radius: 3px; padding: 10px 14px; margin-bottom: 14px; }
.pg-tk-badge { display: inline-block; font-size: 10px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--pg-navy-600); background: var(--pg-navy-50); border: 1px solid var(--pg-navy-100); border-radius: 2px; padding: 3px 8px; margin-left: 8px; vertical-align: middle; }
.pg-fill-all { font-size: 12.5px; font-weight: 600; color: var(--pg-navy-800); border: 0; background: none; padding: 0; border-bottom: 1px solid var(--pg-gold-600); cursor: pointer; }
.pg-fill-all:disabled { opacity: .4; cursor: default; }
.pg-quiet-act { font-size: 12.5px; font-weight: 600; color: var(--pg-muted); border: 0; background: none; padding: 0; border-bottom: 1px solid var(--pg-hairline); cursor: pointer; }
.pg-quiet-act:hover { color: var(--pg-body); }

/* Discount */
.pg-disclink { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; color: var(--pg-navy-800); border: 0; background: none; padding: 0; border-bottom: 1px solid var(--pg-gold-600); cursor: pointer; }
.pg-disc-row { display: flex; gap: 10px; }
.pg-disc-row input { flex: 1; }
.pg-disc-ok { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 13.5px; color: #047857; background: #ecfdf5; border: 1px solid #a7f3d0; border-radius: 3px; padding: 11px 14px; margin-top: 12px; }
.pg-disc-ok .pg-rm { font-size: 12px; font-weight: 600; color: var(--pg-navy-800); border: 0; background: none; padding: 0; border-bottom: 1px solid var(--pg-hairline); cursor: pointer; }

/* Gateway */
.pg-gw-fixed { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; border: 1px solid var(--pg-navy-900); border-radius: 3px; padding: 18px 20px; }
.pg-gw-fixed .pg-gw-n { font-weight: 700; font-size: 15.5px; color: var(--pg-ink); }
.pg-gw-fixed .pg-gw-d { font-size: 12.5px; color: var(--pg-muted); margin-top: 3px; }
.pg-gw-fixed .pg-gw-auto { font-size: 10.5px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--pg-gold-800); white-space: nowrap; }
.pg-gw-note { font-size: 12px; color: var(--pg-muted); margin-top: 12px; line-height: 1.6; }
.pg-gw-option { position: relative; display: flex; align-items: baseline; justify-content: space-between; gap: 14px; border: 1px solid var(--pg-hairline); border-radius: 3px; padding: 18px 20px; cursor: pointer; transition: all .15s; }
.pg-gw-option:hover { border-color: var(--pg-navy-400); }
.pg-gw-option.pg-on { border-color: var(--pg-navy-900); box-shadow: inset 0 0 0 1px var(--pg-navy-900); }
.pg-gw-option .pg-gw-pick { font-size: 10.5px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--pg-gold-800); white-space: nowrap; opacity: 0; }
.pg-gw-option.pg-on .pg-gw-pick { opacity: 1; }

/* Notices */
.pg-hold-band { display: block; text-align: center; font-size: 12.5px; color: var(--pg-gold-800); font-weight: 600; background: var(--pg-gold-100); border: 1px solid var(--pg-gold-200); border-radius: 3px; padding: 10px 14px; margin-bottom: 22px; font-variant-numeric: tabular-nums; }
.pg-note-band { display: flex; align-items: flex-start; gap: 10px; font-size: 13px; color: var(--pg-navy-700); background: var(--pg-navy-50); border: 1px solid var(--pg-navy-100); border-radius: 3px; padding: 11px 14px; }
.pg-err-band { font-size: 13px; color: #b64545; background: #fdf7f7; border: 1px solid #eecccc; border-radius: 3px; padding: 11px 14px; }
/* When Pay is pressed with an unmet requirement, the relevant notice pulses
   its border so it is not missed. Applied by toggling pg-attn on the band. */
.pg-attn { animation: pg-attn-pulse 0.9s cubic-bezier(0.22, 1, 0.36, 1) 2; }
@keyframes pg-attn-pulse {
    0% { box-shadow: 0 0 0 0 rgba(180, 69, 69, 0); }
    30% { box-shadow: 0 0 0 4px rgba(180, 69, 69, 0.22); border-color: #d98a8a; }
    100% { box-shadow: 0 0 0 0 rgba(180, 69, 69, 0); }
}
.pg-note-band.pg-attn { animation-name: pg-attn-pulse-navy; }
@keyframes pg-attn-pulse-navy {
    0% { box-shadow: 0 0 0 0 rgba(23, 42, 68, 0); }
    30% { box-shadow: 0 0 0 4px rgba(23, 42, 68, 0.18); border-color: var(--pg-navy-600); }
    100% { box-shadow: 0 0 0 0 rgba(23, 42, 68, 0); }
}
@media (prefers-reduced-motion: reduce) { .pg-attn { animation: none; } }
/* Pay button while checkout requirements are still unmet: subdued but fully
   clickable, so pressing it surfaces and pulses the blocking notice rather
   than doing nothing. */
.pg-btn-navy.pg-btn-waiting { opacity: 0.82; }
.pg-terms-note { font-size: 12px; color: var(--pg-muted); text-align: center; margin-top: 14px; line-height: 1.7; }
.pg-terms-note a { color: var(--pg-gold-800); text-decoration: none; border-bottom: 1px solid var(--pg-gold-400); }

/* Pay action in the main checkout column, directly under the payment
   panel at every width, matching the approved mockup. */
.pg-co-payaction { margin-top: 26px; }

/* Order summary */
.pg-ordersum { position: sticky; top: 104px; min-width: 0; }
.pg-ordersum .pg-os-box { background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 5px; overflow: hidden; box-shadow: 0 24px 60px -20px rgba(23, 42, 68, .18); }
.pg-ordersum .pg-os-cover { width: 100%; aspect-ratio: 16 / 6.5; object-fit: cover; display: block; }
.pg-ordersum .pg-os-inner { padding: 22px 24px; }
.pg-ordersum h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 19px; line-height: 1.3; color: var(--pg-ink); margin: 0; }
.pg-ordersum .pg-os-meta { font-size: 12.5px; color: var(--pg-muted); margin-top: 4px; }
.pg-os-lines { border-top: 1px dashed var(--pg-hairline); margin-top: 16px; padding-top: 14px; position: relative; }
.pg-os-lines::before, .pg-os-lines::after { content: ""; position: absolute; top: -8px; width: 16px; height: 16px; background: var(--pg-ivory); border-radius: 50%; border: 1px solid var(--pg-hairline-soft); }
.pg-os-lines::before { left: -33px; }
.pg-os-lines::after { right: -33px; }
.pg-os-line { display: flex; justify-content: space-between; gap: 12px; font-size: 13.5px; color: var(--pg-body); margin-bottom: 7px; font-variant-numeric: tabular-nums; }
.pg-os-line .pg-fee { color: var(--pg-muted); }
.pg-os-line.pg-green { color: #047857; }
.pg-os-line.pg-grand { font-size: 15.5px; font-weight: 700; color: var(--pg-ink); margin-top: 10px; }
.pg-os-hold { text-align: center; font-size: 12px; color: var(--pg-gold-800); font-weight: 600; background: var(--pg-gold-100); border: 1px solid var(--pg-gold-200); border-radius: 3px; padding: 9px; margin-top: 16px; font-variant-numeric: tabular-nums; }
.pg-os-promo { font-size: 12px; color: var(--pg-gold-800); background: var(--pg-gold-100); border: 1px solid var(--pg-gold-200); border-radius: 3px; padding: 9px 12px; margin-bottom: 10px; }
.pg-os-empty { text-align: center; font-size: 13.5px; color: var(--pg-muted); padding: 26px 0 10px; }

/* Mobile order summary bar */
.pg-mobsum { display: none; background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 4px; margin-bottom: 18px; overflow: hidden; }
.pg-mobsum-bar { width: 100%; display: flex; align-items: baseline; justify-content: space-between; gap: 12px; background: none; border: 0; padding: 14px 18px; cursor: pointer; text-align: left; }
.pg-mobsum-bar .k { font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--pg-muted); font-weight: 600; }
.pg-mobsum-bar .v { font-size: 17px; font-weight: 700; color: var(--pg-ink); font-variant-numeric: tabular-nums; margin-top: 2px; }
.pg-mobsum-bar .pg-caret { font-size: 12px; color: var(--pg-muted); transition: transform .15s; }
.pg-mobsum-bar .pg-caret.pg-open { transform: rotate(180deg); }
.pg-mobsum-body { border-top: 1px dashed var(--pg-hairline); padding: 14px 18px 18px; }

/* ---------------------------------------------------------------
   Checkout: the seat map. A dark stage inside a light panel, the
   organiser's venue rendered on the deep navy gradient, with the
   zoom and pan toolbar, the section detail on the same stage, and
   the picked seats on a light footer. Matches the mockup's smap.
   --------------------------------------------------------------- */
.pg-smap { border: 1px solid var(--pg-hairline-soft); border-radius: 4px; overflow: hidden; background: #fff; margin-bottom: 26px; }
.pg-smap-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--pg-hairline-soft); gap: 14px; flex-wrap: wrap; }
.pg-smap-hold { text-align: right; }
.pg-smap-hold .k { font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--pg-muted); font-weight: 600; }
.pg-smap-hold .v { font-size: 14px; font-weight: 700; color: var(--pg-gold-700); font-variant-numeric: tabular-nums; }
.pg-smap-hold .v.pg-low { color: #b64545; }
.pg-smap-progress { display: flex; gap: 8px; flex-wrap: wrap; padding: 0 20px 14px; }
.pg-sp-chip { display: inline-flex; align-items: center; gap: 7px; font-size: 11.5px; font-weight: 600; color: var(--pg-body); border: 1px solid var(--pg-hairline); border-radius: 999px; padding: 6px 12px; }
.pg-sp-chip.pg-done { color: #047857; border-color: #a7f3d0; background: #ecfdf5; }
.pg-sp-chip .pg-dotc { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.pg-smap-stage { position: relative; background: linear-gradient(160deg, #0b1526 0%, #12203a 60%, #16263f 100%); }
.pg-smap-toolbar { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; }
.pg-smap-toolbar .pg-stage-label { font-size: 10px; letter-spacing: .24em; text-transform: uppercase; color: var(--pg-navy-300); font-weight: 600; }
.pg-smap-toolbar .pg-tools { display: flex; align-items: center; gap: 6px; }
.pg-smap-toolbar .pg-zpct { font-size: 10.5px; color: var(--pg-navy-300); font-variant-numeric: tabular-nums; margin-right: 4px; }
.pg-smap-toolbar button { width: 30px; height: 30px; border-radius: 3px; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.07); color: #dbe4ef; font-size: 14px; cursor: pointer; line-height: 1; display: inline-flex; align-items: center; justify-content: center; transition: background .15s; }
.pg-smap-toolbar button:hover { background: rgba(255,255,255,.16); }
.pg-smap-toolbar button.pg-on { background: rgba(245,158,11,.25); border-color: var(--pg-gold-600); color: var(--pg-gold-400); }
.pg-smap-legendbar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; padding: 12px 20px; background: #0e1930; border-top: 1px solid rgba(255,255,255,.07); }
.pg-smap-legendbar .pg-lg { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--pg-navy-200); }
.pg-smap-legendbar .pg-lg i { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.pg-smap-secrow { display: flex; flex-wrap: wrap; gap: 8px; padding: 14px 20px 4px; }
.pg-sec-btn { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; color: var(--pg-body); border: 1px solid var(--pg-hairline); background: #fff; border-radius: 999px; padding: 7px 13px; cursor: pointer; transition: all .15s; }
.pg-sec-btn:hover { border-color: var(--pg-navy-400); }
.pg-sec-btn.pg-on { border-color: var(--pg-navy-900); color: var(--pg-navy-900); box-shadow: inset 0 0 0 1px var(--pg-navy-900); }
.pg-sec-btn:disabled { opacity: .4; cursor: default; }
.pg-sec-btn i { width: 9px; height: 9px; border-radius: 2px; flex: none; }
.pg-smap-hint { text-align: center; font-size: 12px; color: var(--pg-muted); padding: 0 20px 16px; }
.pg-smap-detail { background: linear-gradient(160deg, #0b1526 0%, #12203a 60%, #16263f 100%); padding: 20px; }
.pg-smap-detail .pg-dhead { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.pg-smap-detail .pg-dname { font-size: 13.5px; font-weight: 700; color: #fff; display: flex; align-items: center; gap: 9px; min-width: 0; }
.pg-smap-detail .pg-dname i { width: 10px; height: 10px; border-radius: 2px; flex: none; }
.pg-smap-detail .pg-dprice { font-size: 11.5px; color: var(--pg-navy-300); margin-top: 3px; }
.pg-smap-detail .pg-backlink { font-size: 11.5px; font-weight: 600; color: var(--pg-gold-500); cursor: pointer; border: 0; background: none; padding: 0; border-bottom: 1px solid rgba(245,158,11,.5); white-space: nowrap; }
.pg-smap-detail .pg-dtickettype { font-size: 11.5px; color: var(--pg-navy-300); border-top: 1px solid rgba(255,255,255,.08); border-bottom: 1px solid rgba(255,255,255,.08); padding: 8px 0; margin-bottom: 12px; }
.pg-smap-detail .pg-dtickettype b { color: #fff; font-weight: 600; }
.pg-seatgrid { overflow-x: auto; max-height: 420px; overflow-y: auto; padding: 4px 0 8px; }
.pg-seatgrid .pg-rowlab { width: 20px; text-align: right; font-size: 9px; color: var(--pg-navy-400); font-variant-numeric: tabular-nums; flex: none; }
.pg-seat { width: 28px; height: 28px; border-radius: 3px; font-size: 9px; font-variant-numeric: tabular-nums; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.35); background: transparent; color: var(--pg-navy-200); cursor: pointer; transition: all .12s; }
.pg-seat:hover:not(:disabled) { border-color: #fff; color: #fff; }
.pg-seat.pg-mine { background: var(--pg-gold-600); border-color: var(--pg-gold-600); color: var(--pg-navy-900); font-weight: 700; }
.pg-seat.pg-heldother { background: repeating-linear-gradient(45deg, rgba(255,255,255,.14) 0 3px, transparent 3px 6px); border-color: rgba(255,255,255,.18); color: rgba(255,255,255,.4); cursor: not-allowed; }
.pg-seat.pg-sold { background: rgba(255,255,255,.16); border-color: transparent; color: rgba(255,255,255,.35); cursor: not-allowed; }
.pg-seat.pg-blocked { opacity: .18; border-color: rgba(255,255,255,.2); cursor: not-allowed; }
.pg-seat.pg-access { border-color: #7fb2f0; color: #a9cbf5; }
.pg-seat.pg-aislegap { margin-left: 12px; }
.pg-seat.pg-invisible { visibility: hidden; }
.pg-smap-dlegend { display: flex; flex-wrap: wrap; gap: 10px 18px; padding-top: 14px; margin-top: 4px; border-top: 1px solid rgba(255,255,255,.07); }
.pg-smap-dlegend .pg-lg { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--pg-navy-200); }
.pg-smap-dlegend .pg-lg i { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.pg-smap-picked { padding: 14px 20px 18px; border-top: 1px solid var(--pg-hairline-soft); }
.pg-smap-picked .pg-pk-title { font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--pg-muted); margin-bottom: 10px; display: flex; justify-content: space-between; align-items: baseline; }
.pg-pk-row { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--pg-body); padding: 7px 0; border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-pk-row:last-child { border-bottom: 0; }
.pg-pk-row i { width: 9px; height: 9px; border-radius: 2px; flex: none; }
.pg-pk-row .pg-pkp { margin-left: auto; font-weight: 600; color: var(--pg-ink); font-variant-numeric: tabular-nums; }
.pg-pk-row .pg-pkx { border: 0; background: none; color: var(--pg-muted); font-size: 15px; cursor: pointer; padding: 0 2px; line-height: 1; }
.pg-pk-row .pg-pkx:hover { color: #b64545; }
.pg-smap-loading { text-align: center; padding: 56px 20px; background: linear-gradient(160deg, #0b1526 0%, #12203a 60%, #16263f 100%); color: var(--pg-navy-300); font-size: 13px; }
.pg-spin { width: 26px; height: 26px; border: 2px solid var(--pg-gold-600); border-top-color: transparent; border-radius: 50%; margin: 0 auto 12px; animation: pg-rotate 0.8s linear infinite; }
@keyframes pg-rotate { to { transform: rotate(360deg); } }

/* ---------------------------------------------------------------
   Confirmation: the seal hero, the pass, and the closing actions.
   Matches the mockup's confirmation screen, with a pending state in
   the same voice for orders still confirming with the gateway.
   --------------------------------------------------------------- */
.pg-confirm-hero { text-align: center; padding: 64px 24px 34px; }
.pg-confirm-hero .pg-seal { width: 64px; height: 64px; margin: 0 auto 22px; border-radius: 50%; border: 1px solid var(--pg-gold-600); display: flex; align-items: center; justify-content: center; }
.pg-confirm-hero .pg-seal svg { width: 26px; height: 26px; stroke: var(--pg-gold-700); fill: none; stroke-width: 1.8; }
.pg-confirm-hero .pg-seal .pg-spin { margin: 0; border-color: var(--pg-gold-600); border-top-color: transparent; }
.pg-confirm-hero h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(32px, 4vw, 46px); color: var(--pg-ink); margin: 0 0 10px; letter-spacing: -0.01em; }
.pg-confirm-hero p { color: var(--pg-muted); font-size: 15px; margin: 0; line-height: 1.7; }
.pg-confirm-hero p b { color: var(--pg-ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.pg-confirm-note { max-width: 560px; margin: 10px auto 0; font-size: 13px; color: var(--pg-muted); }
.pg-pass { max-width: 520px; margin: 0 auto 26px; background: #fff; border-radius: 6px; box-shadow: 0 24px 60px -20px rgba(23, 42, 68, .22); border: 1px solid var(--pg-hairline-soft); }
.pg-pass .pg-pass-top { background: var(--pg-navy-900); border-radius: 6px 6px 0 0; padding: 18px 26px; display: flex; justify-content: space-between; align-items: baseline; }
.pg-pass .pg-pass-top .pg-t { font-size: 11px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--pg-gold-500); }
.pg-pass .pg-pass-top img { height: 20px; display: block; }
.pg-pass .pg-pass-mid { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; padding: 24px 26px; align-items: center; }
.pg-pass h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 22px; line-height: 1.25; color: var(--pg-ink); margin: 0 0 10px; }
.pg-pass .pg-kv { font-size: 13px; color: var(--pg-muted); margin-bottom: 4px; }
.pg-pass .pg-kv b { color: var(--pg-ink); font-weight: 600; }
.pg-pass .pg-qr { width: 118px; height: 118px; border: 1px solid var(--pg-hairline); border-radius: 3px; padding: 8px; background: #fff; }
.pg-pass .pg-qr img, .pg-pass .pg-qr svg { width: 100%; height: 100%; display: block; image-rendering: pixelated; }
.pg-pass .pg-pass-bottom { position: relative; border-top: 1px dashed var(--pg-hairline); padding: 16px 26px; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.pg-pass .pg-pass-bottom::before, .pg-pass .pg-pass-bottom::after { content: ""; position: absolute; top: -9px; width: 18px; height: 18px; background: var(--pg-ivory); border-radius: 50%; border: 1px solid var(--pg-hairline-soft); }
.pg-pass .pg-pass-bottom::before { left: -10px; }
.pg-pass .pg-pass-bottom::after { right: -10px; }
.pg-pass .pg-holder { font-size: 13px; font-weight: 600; color: var(--pg-ink); min-width: 0; }
.pg-pass .pg-code { font-size: 12.5px; letter-spacing: .14em; color: var(--pg-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pg-pass .pg-seatline { font-size: 12px; color: var(--pg-gold-800); font-weight: 600; margin-top: 6px; }
.pg-confirm-actions { display: flex; justify-content: center; gap: 14px; padding: 4px 0 26px; flex-wrap: wrap; }
.pg-confirm-next { max-width: 560px; margin: 0 auto; padding-bottom: 40px; font-size: 13.5px; color: var(--pg-muted); text-align: center; line-height: 1.8; }
.pg-confirm-next a { color: var(--pg-gold-800); font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--pg-gold-400); }
.pg-confirm-wrap { max-width: 760px; margin: 0 auto; padding: 0 24px 96px; }
.pg-confirm-panel { background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 4px; padding: 26px 28px; margin: 0 auto 26px; max-width: 560px; }
.pg-confirm-panel .pg-cp-title { font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--pg-muted); margin-bottom: 14px; }

/* Checkout and confirmation responsive */
@media (max-width: 1080px) {
    .pg-co-layout { grid-template-columns: 1fr; gap: 0; }
    .pg-ordersum { position: static; margin-top: 28px; }
    .pg-mobsum { display: block; }
}
@media (max-width: 640px) {
    .pg-co { padding: 24px 0 72px; }
    .pg-panel { padding: 20px 18px; }
    .pg-frm { grid-template-columns: 1fr; }
    .pg-co-dateband { flex-direction: column; align-items: flex-start; gap: 8px; }
    .pg-seatgrid { max-height: 340px; }
    .pg-pass .pg-pass-mid { grid-template-columns: 1fr; }
    .pg-pass .pg-qr { margin: 0 auto; }
    .pg-gw-fixed, .pg-gw-option { flex-direction: column; gap: 8px; }
    .pg-confirm-actions { flex-direction: column; align-items: stretch; padding-left: 24px; padding-right: 24px; }
    .pg-confirm-panel { padding: 22px 20px; }
    /* Order details: long values (order number, email, event) read poorly
       when squeezed opposite their label on a narrow column, so stack the
       label over the value. Money rows keep their side-by-side alignment. */
    .pg-od-row { flex-direction: column; align-items: flex-start; gap: 2px; margin-bottom: 12px; }
    .pg-od-row .pg-od-v { text-align: left; width: 100%; }
}

/* Visibility helper matching the checkout column collapse breakpoint. */
.pg-lt-1080 { display: none; }
@media (max-width: 1080px) { .pg-lt-1080 { display: block; } }

/* ============================================================
   Ticket order page and single ticket view, editorial system
   ============================================================ */
.pg-tk-wrap { max-width: 1000px; margin: 0 auto; padding: 0 24px 96px; }
.pg-tkv-wrap { max-width: 560px; margin: 0 auto; padding: 0 24px 96px; }

/* Header shared by both pages */
.pg-tk-head, .pg-tkv-head { padding: 56px 0 30px; text-align: left; }
.pg-tkv-head { text-align: center; }
.pg-tk-eyebrow { font-size: 11px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--pg-gold-800); font-variant-numeric: tabular-nums; }
.pg-tk-head h1, .pg-tkv-head h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(26px, 4vw, 36px); line-height: 1.15; color: var(--pg-ink); margin: 12px 0 8px; }
.pg-tk-host { font-size: 14px; color: var(--pg-muted); margin: 0; }

/* Header facts on the order page */
.pg-tk-facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; margin-top: 30px; padding-top: 26px; border-top: 1px solid var(--pg-hairline-soft); }
.pg-tk-fact { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.pg-tk-fl { font-size: 10.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--pg-muted); }
.pg-tk-fv { font-size: 14px; font-weight: 600; color: var(--pg-ink); line-height: 1.4; }
.pg-tk-sub { display: block; font-size: 12.5px; font-weight: 400; color: var(--pg-muted); margin-top: 2px; }

/* Section bar with the download all action */
.pg-tk-bar { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin: 8px 0 24px; flex-wrap: wrap; }
.pg-tk-h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: 22px; color: var(--pg-ink); margin: 0; }
.pg-tk-bar .pg-tk-note { font-size: 13.5px; color: var(--pg-muted); margin: 4px 0 0; text-transform: none; letter-spacing: 0; font-weight: 400; }
.pg-tk-preparing { display: inline-flex; align-items: center; gap: 9px; font-size: 13px; font-weight: 600; color: var(--pg-gold-800); background: var(--pg-gold-100); border: 1px solid var(--pg-gold-200); border-radius: 3px; padding: 10px 16px; }
.pg-tk-spin { width: 13px; height: 13px; border-radius: 50%; border: 2px solid rgba(180, 83, 9, .25); border-top-color: var(--pg-gold-800); animation: pg-tk-spin 0.8s linear infinite; }
@keyframes pg-tk-spin { to { transform: rotate(360deg); } }

/* Tickets grid */
.pg-tk-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px; }
.pg-tk-pass { max-width: none; margin: 0; }
.pg-tk-pass .pg-pass-mid { align-items: start; }

/* Status badges */
.pg-tk-status-row { margin-bottom: 10px; }
.pg-tk-badge { display: inline-flex; align-items: center; font-size: 10.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; border-radius: 100px; padding: 4px 11px; }
.pg-tk-badge-ok { background: rgba(4, 120, 87, .1); color: #047857; }
.pg-tk-badge-in { background: rgba(23, 42, 68, .07); color: var(--pg-navy-700); }
.pg-tk-badge-cx { background: rgba(180, 69, 69, .1); color: #b64545; }

/* Attendee block inside the pass */
.pg-tk-attendee { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--pg-hairline); display: flex; flex-direction: column; gap: 2px; }
.pg-tk-an { font-size: 13.5px; font-weight: 600; color: var(--pg-ink); }
.pg-tk-ae { font-size: 12.5px; color: var(--pg-muted); word-break: break-word; }

/* Virtual indicator inside a pass, replacing the QR square */
.pg-tk-virtual { width: 118px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; border: 1px dashed var(--pg-hairline); border-radius: 3px; padding: 16px 10px; gap: 4px; }
.pg-tk-vstate { font-size: 12.5px; font-weight: 700; color: var(--pg-ink); }
.pg-tk-vlive { color: #047857; }
.pg-tk-vsub { font-size: 10.5px; color: var(--pg-muted); line-height: 1.4; }

/* Pass footer actions on the order page */
.pg-tk-acts { display: inline-flex; gap: 8px; align-items: center; }
.pg-tk-act { font-size: 12px; font-weight: 600; color: var(--pg-navy-800); text-decoration: none; border: 1px solid var(--pg-hairline); border-radius: 3px; padding: 6px 14px; transition: border-color .15s, color .15s; }
.pg-tk-act:hover { border-color: var(--pg-navy-900); color: var(--pg-navy-900); }
.pg-tk-act-wait { color: var(--pg-muted); cursor: default; }
.pg-tk-act-wait:hover { border-color: var(--pg-hairline); color: var(--pg-muted); }

/* Back link */
.pg-tk-back { margin-top: 40px; text-align: center; }
.pg-tk-backlink { font-size: 13.5px; font-weight: 600; color: var(--pg-navy-800); text-decoration: none; border-bottom: 1px solid var(--pg-hairline); padding-bottom: 2px; transition: color .15s, border-color .15s; }
.pg-tk-backlink:hover { color: var(--pg-gold-800); border-bottom-color: var(--pg-gold-400); }

/* Single ticket view: the detailed pass */
.pg-tkv-pass { max-width: none; margin: 0 0 26px; }
.pg-tkv-status { padding: 20px 26px 0; }
.pg-tkv-details { display: grid; grid-template-columns: 1fr 1fr; gap: 20px 24px; padding: 18px 26px 24px; }
.pg-tkv-d { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pg-tkv-d .pg-tk-fv { font-size: 15px; }
.pg-tkv-qr-block { text-align: center; padding: 8px 26px 28px; border-top: 1px dashed var(--pg-hairline); }
.pg-tkv-qr-label { font-size: 10.5px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-muted); margin: 22px 0 16px; }
.pg-tkv-qr { display: inline-block; width: 208px; height: 208px; border: 1px solid var(--pg-hairline); border-radius: 4px; padding: 14px; background: #fff; }
.pg-tkv-qr img { width: 100%; height: 100%; display: block; image-rendering: pixelated; }
.pg-tkv-qr > svg { width: 100% !important; height: 100% !important; display: block; }
.pg-tkv-qr-pending { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-size: 12px; color: var(--pg-muted); text-align: center; line-height: 1.5; }
.pg-tkv-qr-hint { font-size: 12.5px; color: var(--pg-muted); margin: 16px 0 0; }
.pg-tkv-virtual { padding: 8px 26px 26px; border-top: 1px dashed var(--pg-hairline); }

/* Single ticket actions */
.pg-tkv-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.pg-tkv-secondary { margin-top: 14px; text-align: center; }
.pg-tkv-qr-download { font-size: 13px; font-weight: 600; color: var(--pg-navy-800); text-decoration: none; border: 1px solid var(--pg-hairline); border-radius: 3px; padding: 11px 20px; display: inline-block; transition: border-color .15s, color .15s; }
.pg-tkv-qr-download:hover { border-color: var(--pg-navy-900); color: var(--pg-navy-900); }

/* Responsive */
@media (max-width: 860px) {
    .pg-tk-facts { grid-template-columns: repeat(2, 1fr); gap: 18px; }
    .pg-tk-grid { grid-template-columns: 1fr; gap: 22px; }
}
@media (max-width: 560px) {
    .pg-tk-head, .pg-tkv-head { padding-top: 40px; }
    .pg-tk-bar { flex-direction: column; align-items: stretch; }
    .pg-tk-bar .pg-btn, .pg-tk-preparing { width: 100%; justify-content: center; text-align: center; }
    .pg-tkv-details { grid-template-columns: 1fr; gap: 16px; }
    .pg-tkv-actions { grid-template-columns: 1fr; }
    .pg-tkv-qr { width: 180px; height: 180px; }
}

/* ============================================================
   Authentication: editorial split screen on desktop, centered
   card on mobile. Shared shell plus the form primitives every
   auth view uses, and the register intent mapper.
   ============================================================ */
.pg-auth { display: grid; grid-template-columns: 1fr 1fr; min-height: 100vh; min-height: 100dvh; background: var(--pg-ivory); }
.pg-auth-wide { }

/* Brand panel */
.pg-auth-panel { position: relative; display: flex; flex-direction: column; justify-content: space-between; padding: 48px 56px; background: radial-gradient(120% 120% at 25% 20%, #1b2f4a 0%, #12203a 55%, #0d1a2f 100%); color: #f5efe0; overflow: hidden; }
.pg-auth-panel::after { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, transparent, rgba(245,158,11,.55), transparent); }
.pg-auth-panel-mid { max-width: 420px; margin: auto; }
.pg-auth-panel-eyebrow { font-size: 11px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: rgba(245,158,11,.85); margin-bottom: 20px; }
.pg-auth-panel-heading { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(28px, 3vw, 40px); line-height: 1.12; color: #fff; margin: 0 0 18px; }
.pg-auth-panel-body { font-size: 15px; line-height: 1.65; color: rgba(245,239,224,.72); margin: 0; }
.pg-auth-panel-foot { display: flex; align-items: center; gap: 9px; font-size: 12.5px; color: rgba(245,239,224,.6); }
.pg-auth-panel-dot { width: 7px; height: 7px; border-radius: 50%; background: #34d399; box-shadow: 0 0 0 3px rgba(52,211,153,.18); }

/* Form area */
.pg-auth-main { display: flex; align-items: center; justify-content: center; padding: 56px 40px; }
.pg-auth-card { width: 100%; max-width: 400px; }
.pg-auth-wide .pg-auth-card { max-width: 500px; }
.pg-auth-title { font-family: var(--pg-font-display); font-weight: 500; font-size: 29px; line-height: 1.15; color: var(--pg-ink); margin: 0 0 7px; }
.pg-auth-sub { font-size: 14px; color: var(--pg-muted); line-height: 1.55; margin: 0 0 28px; }

/* Form primitives shared by every auth view */
.pg-af { margin-bottom: 17px; }
.pg-af-label { display: block; font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--pg-navy-700); margin-bottom: 7px; }
.pg-af-label .pg-af-req { color: var(--pg-gold-700); }
.pg-af-input { width: 100%; font-family: var(--pg-font-sans); font-size: 15px; color: var(--pg-ink); background: #fff; border: 1px solid var(--pg-hairline); border-radius: 3px; padding: 12px 14px; transition: border-color .15s, box-shadow .15s; }
.pg-af-input::placeholder { color: var(--pg-navy-300); }
.pg-af-input:focus { outline: none; border-color: var(--pg-navy-600); box-shadow: 0 0 0 3px rgba(23,42,68,.08); }
.pg-af-input.pg-af-error { border-color: #d98a8a; }
.pg-af-input.pg-af-error:focus { box-shadow: 0 0 0 3px rgba(180,69,69,.12); }
.pg-af-hint { font-size: 12px; color: var(--pg-muted); margin-top: 6px; line-height: 1.5; }
.pg-af-err { font-size: 12.5px; color: #b64545; margin-top: 6px; }

/* Password field with reveal toggle */
.pg-af-pass { position: relative; }
.pg-af-pass .pg-af-input { padding-right: 44px; }
.pg-af-reveal { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border: none; background: none; color: var(--pg-navy-400); cursor: pointer; border-radius: 3px; transition: color .15s; }
.pg-af-reveal:hover { color: var(--pg-navy-700); }
.pg-af-reveal svg { width: 18px; height: 18px; }

/* Row of options: remember and forgot */
.pg-af-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 4px; }
.pg-af-check { display: inline-flex; align-items: center; gap: 9px; cursor: pointer; font-size: 13.5px; color: var(--pg-body); user-select: none; }
.pg-af-check input { width: 16px; height: 16px; accent-color: var(--pg-navy-800); cursor: pointer; }
.pg-af-link { font-size: 13.5px; font-weight: 500; color: var(--pg-navy-800); text-decoration: none; transition: color .15s; }
.pg-af-link:hover { color: var(--pg-gold-800); }

/* Primary and full-width buttons in auth */
.pg-auth .pg-btn { width: 100%; padding: 14px; font-size: 15px; margin-top: 8px; }
.pg-auth-actions { margin-top: 22px; }

/* Switch line and divider */
.pg-auth-switch { text-align: center; font-size: 13.5px; color: var(--pg-muted); margin-top: 24px; }
.pg-auth-switch a { color: var(--pg-gold-800); font-weight: 600; border-bottom: 1px solid var(--pg-gold-400); text-decoration: none; padding-bottom: 1px; }
.pg-auth-switch a:hover { border-bottom-color: var(--pg-gold-700); }
.pg-auth-divider { display: flex; align-items: center; gap: 16px; text-align: center; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-muted); margin: 30px 0; }
.pg-auth-divider::before, .pg-auth-divider::after { content: ""; flex: 1; height: 1px; background: var(--pg-hairline-soft); }

/* Status and alert bands inside auth */
.pg-auth-band { display: flex; align-items: flex-start; gap: 10px; font-size: 13px; line-height: 1.5; border-radius: 3px; padding: 12px 14px; margin-bottom: 20px; }
.pg-auth-band-ok { color: #047857; background: rgba(4,120,87,.08); border: 1px solid rgba(4,120,87,.2); }
.pg-auth-band-info { color: var(--pg-navy-700); background: var(--pg-navy-50); border: 1px solid var(--pg-navy-100); }
.pg-auth-band-warn { color: var(--pg-gold-800); background: var(--pg-gold-100); border: 1px solid var(--pg-gold-200); }
.pg-auth-band-err { color: #b64545; background: #fdf7f7; border: 1px solid #eecccc; }

/* Register intent mapper and two-step flow */
.pg-reg-step { display: none; }
.pg-reg-step.on { display: block; }
.pg-intent-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 22px; }
.pg-intent-card { position: relative; border: 1px solid var(--pg-hairline); border-radius: 3px; padding: 18px 18px 16px; cursor: pointer; transition: border-color .15s, box-shadow .15s, background .15s; text-align: left; background: #fff; }
.pg-intent-card:hover { border-color: var(--pg-navy-400); }
.pg-intent-card.sel { border-color: var(--pg-gold-600); box-shadow: 0 0 0 1px var(--pg-gold-600); background: var(--pg-gold-100); }
.pg-intent-card h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 17px; color: var(--pg-ink); margin: 0 0 4px; }
.pg-intent-card p { font-size: 12px; color: var(--pg-muted); line-height: 1.5; margin: 0; }
.pg-intent-tick { position: absolute; top: 12px; right: 12px; width: 18px; height: 18px; border-radius: 50%; border: 1px solid var(--pg-navy-300); background: #fff; transition: background .15s, border-color .15s; }
.pg-intent-card.sel .pg-intent-tick { background: var(--pg-gold-600); border-color: var(--pg-gold-700); }
.pg-intent-card.sel .pg-intent-tick::after { content: ""; position: absolute; left: 6px; top: 3px; width: 4px; height: 8px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.pg-reg-selcount { text-align: center; font-size: 12.5px; color: var(--pg-gold-800); font-weight: 600; margin-bottom: 20px; min-height: 18px; }
.pg-reg-chips { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin-bottom: 22px; }
.pg-reg-chip { font-size: 12px; font-weight: 600; color: var(--pg-navy-700); background: var(--pg-navy-50); border: 1px solid var(--pg-navy-100); border-radius: 100px; padding: 5px 13px; }
.pg-reg-back { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--pg-muted); cursor: pointer; background: none; border: none; padding: 0; margin-bottom: 18px; transition: color .15s; }
.pg-reg-back:hover { color: var(--pg-gold-800); }
.pg-reg-under { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 18px; flex-wrap: wrap; }
.pg-reg-under .pg-reg-back { margin-bottom: 0; }

/* Referral question block */
.pg-ref-q { border: 1px solid var(--pg-hairline-soft); border-radius: 3px; padding: 16px 18px; margin-bottom: 16px; background: var(--pg-ivory); }
.pg-ref-q .pg-ref-label { font-size: 13.5px; font-weight: 600; color: var(--pg-ink); margin-bottom: 10px; }
.pg-ref-opts { display: flex; gap: 10px; flex-wrap: wrap; }
.pg-ref-opt { font-size: 12.5px; font-weight: 600; color: var(--pg-body); border: 1px solid var(--pg-hairline); border-radius: 2px; padding: 7px 18px; cursor: pointer; background: #fff; transition: border-color .15s, box-shadow .15s; }
.pg-ref-opt.sel { border-color: var(--pg-navy-900); box-shadow: 0 0 0 1px var(--pg-navy-900); }
.pg-ref-input { margin-top: 14px; display: none; }
.pg-ref-input.show { display: block; }

/* Two-factor and code entry */
.pg-code-input { width: 100%; font-family: var(--pg-font-sans); font-size: 22px; letter-spacing: .5em; text-align: center; font-weight: 600; color: var(--pg-ink); background: #fff; border: 1px solid var(--pg-hairline); border-radius: 3px; padding: 14px; transition: border-color .15s, box-shadow .15s; }
.pg-code-input:focus { outline: none; border-color: var(--pg-navy-600); box-shadow: 0 0 0 3px rgba(23,42,68,.08); }
.pg-recovery-list { background: var(--pg-ivory); border: 1px solid var(--pg-hairline-soft); border-radius: 3px; padding: 18px 20px; margin: 18px 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 24px; }
.pg-recovery-code { font-family: var(--pg-font-sans); font-size: 14px; letter-spacing: .06em; color: var(--pg-navy-800); font-variant-numeric: tabular-nums; }
.pg-qr-setup { display: flex; justify-content: center; padding: 20px; background: #fff; border: 1px solid var(--pg-hairline); border-radius: 4px; margin: 0 auto 20px; width: max-content; }
.pg-qr-setup svg, .pg-qr-setup img { width: 180px; height: 180px; display: block; }

/* Small print and secondary text */
.pg-auth-fine { font-size: 12px; color: var(--pg-muted); line-height: 1.6; margin-top: 18px; text-align: center; }
.pg-auth-fine a { color: var(--pg-navy-800); text-decoration: underline; text-underline-offset: 2px; }

/* Responsive: collapse to a centered card on mobile */
@media (max-width: 900px) {
    .pg-auth { grid-template-columns: 1fr; }
    .pg-auth-panel { display: none; }
    .pg-auth-main { padding: 40px 24px 72px; align-items: flex-start; }
    .pg-intent-grid { grid-template-columns: 1fr; }
    .pg-recovery-list { grid-template-columns: 1fr; }
}

/* Post sign in destination picker */
.pg-dest-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--pg-hairline); border-radius: 4px; padding: 26px 24px; text-decoration: none; transition: border-color .15s, box-shadow .15s, transform .15s; }
.pg-dest-card:hover { border-color: var(--pg-gold-400); box-shadow: 0 16px 40px -24px rgba(23,42,68,.35); transform: translateY(-2px); }
.pg-dest-card h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: 19px; color: var(--pg-ink); margin: 0 0 8px; }
.pg-dest-card p { font-size: 13.5px; color: var(--pg-muted); line-height: 1.55; margin: 0 0 18px; flex: 1; }
.pg-dest-go { font-size: 13px; font-weight: 600; color: var(--pg-navy-800); border-bottom: 1px solid var(--pg-hairline); padding-bottom: 2px; align-self: flex-start; transition: color .15s, border-color .15s; }
.pg-dest-card:hover .pg-dest-go { color: var(--pg-gold-800); border-bottom-color: var(--pg-gold-400); }
@media (max-width: 720px) {
    .pg-on-white .pg-dest-card { }
    div:has(> .pg-dest-card) { grid-template-columns: 1fr !important; }
}

/* ============================================================
   Company pages: about, how it works, FAQs, support.
   Editorial narrative layouts sharing the page head, the
   numbered steps, the accordion, and the support surfaces.
   ============================================================ */
.pg-wrap { max-width: 1200px; margin: 0 auto; 
    /* padding: 0 24px;  */
}
.pg-wrap-narrow { max-width: 820px; margin: 0 auto; padding: 0 24px; }

/* Page head shared by all company pages */
.pg-page-head { padding: 64px 0 46px; text-align: center; }
.pg-page-head .pg-eyebrow { display: block; }
.pg-page-head h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(36px, 4.6vw, 56px); line-height: 1.06; color: var(--pg-ink); margin: 14px 0 0; }
.pg-page-head .pg-lede { font-size: 16.5px; color: var(--pg-muted); max-width: 560px; margin: 16px auto 0; line-height: 1.6; }
.pg-eyebrow { font-size: 11px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--pg-gold-800); }

/* Section head with the trailing hairline */
.pg-section-head { display: flex; align-items: baseline; gap: 24px; margin-bottom: 38px; }
.pg-section-head .pg-stack { flex-shrink: 1; min-width: 0; }
.pg-section-head .pg-eyebrow { display: block; margin-bottom: 10px; }
.pg-section-head h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(28px, 3.4vw, 40px); line-height: 1.1; color: var(--pg-ink); margin: 0; }
.pg-lead-rule { flex: 1; height: 1px; background: var(--pg-hairline-soft); position: relative; top: -6px; }

/* Numbered steps */
.pg-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid var(--pg-hairline-soft); border-radius: 4px; background: #fff; overflow: hidden; margin-bottom: 64px; }
.pg-steps-4 { grid-template-columns: repeat(4, 1fr); }
.pg-step { padding: 38px 34px; }
.pg-step + .pg-step { border-left: 1px solid var(--pg-hairline-soft); }
.pg-step .pg-no { font-family: var(--pg-font-display); font-size: 15px; color: var(--pg-gold-700); }
.pg-step h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 22px; color: var(--pg-ink); margin: 10px 0; }
.pg-step p { font-size: 14px; color: var(--pg-body); line-height: 1.6; margin: 0; }

/* Free / highlight panel with the gold left rule */
.pg-free-panel { background: #fff; border: 1px solid var(--pg-hairline-soft); border-left: 2px solid var(--pg-gold-600); border-radius: 0 4px 4px 0; padding: 26px 30px; margin-bottom: 48px; max-width: 720px; }
.pg-free-panel h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 22px; color: var(--pg-ink); margin: 0 0 8px; }
.pg-free-panel p { font-size: 14.5px; color: var(--pg-body); line-height: 1.6; margin: 0; }

/* Closing navy band */
.pg-band { background: var(--pg-navy-900); color: #fff; padding: 72px 0; }
.pg-band h2 { font-family: var(--pg-font-display); font-weight: 500; color: #fff; font-size: clamp(26px, 3.2vw, 40px); margin-bottom: 14px; }
.pg-band h2 em { font-style: italic; color: var(--pg-gold-400); }
.pg-band p { color: var(--pg-navy-200); max-width: 640px; margin: 0 auto 24px; line-height: 1.6; }
.pg-band .pg-eyebrow { color: var(--pg-gold-500); }

/* Fee carousel: a horizontal scroll-snap rail of flat cards with the
   paging arrows sitting at the top right of the section */
.pg-fee-carousel-wrap { position: relative; }
.pg-fee-rail { display: grid; grid-auto-flow: column; grid-auto-columns: 280px; gap: 22px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 4px 4px 10px; }
.pg-fee-rail::-webkit-scrollbar { display: none; }
.pg-fee-nav { position: absolute; top: -66px; right: 0; display: flex; gap: 8px; }
.pg-fee-nav button { width: 38px; height: 38px; border: 1px solid var(--pg-hairline); background: #fff; border-radius: 2px; cursor: pointer; font-size: 15px; color: var(--pg-navy-900); transition: border-color .15s; }
.pg-fee-nav button:hover { border-color: var(--pg-navy-900); }
.pg-fee-card { scroll-snap-align: start; background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 4px; padding: 26px; }
.pg-fee-card.you { border-color: var(--pg-gold-600); box-shadow: 0 12px 30px -14px rgba(245,158,11,.4); }
.pg-fee-card .pg-fc-country { font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-muted); }
.pg-fee-card.you .pg-fc-country { color: var(--pg-gold-800); }
.pg-fee-card .pg-fc-rate { font-family: var(--pg-font-display); font-weight: 500; font-size: 30px; color: var(--pg-ink); margin: 10px 0 4px; }
.pg-fee-card .pg-fc-sub { font-size: 12.5px; color: var(--pg-muted); margin: 0; }
.pg-fee-card .pg-fc-gw { font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--pg-navy-600); border-top: 1px solid var(--pg-hairline-soft); margin-top: 16px; padding-top: 12px; }

/* FAQ accordion */
.pg-faq-pills { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-bottom: 52px; }
.pg-qchip { font-size: 12.5px; font-weight: 600; color: var(--pg-navy-800); border: 1px solid var(--pg-hairline); background: #fff; border-radius: 100px; padding: 8px 16px; text-decoration: none; transition: border-color .15s, color .15s, background .15s; }
.pg-qchip:hover { border-color: var(--pg-gold-600); color: var(--pg-gold-800); }
.pg-qchip.hot { border-color: var(--pg-gold-400); background: var(--pg-gold-100); color: var(--pg-gold-800); }
.pg-faq-cat { margin-top: 44px; }
.pg-faq-cat:first-of-type { margin-top: 0; }
.pg-faq-cat h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: 24px; color: var(--pg-ink); margin: 0 0 6px; }
.pg-faq-cat .pg-cnt { font-size: 12.5px; color: var(--pg-muted); margin: 0 0 10px; }
.pg-faq details { border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-faq summary { list-style: none; cursor: pointer; display: flex; align-items: baseline; justify-content: space-between; gap: 20px; padding: 22px 4px; }
.pg-faq summary::-webkit-details-marker { display: none; }
.pg-faq summary h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 19px; line-height: 1.35; color: var(--pg-ink); margin: 0; }
.pg-faq summary .pg-x { font-family: var(--pg-font-display); font-size: 20px; color: var(--pg-gold-700); transition: transform .2s; flex-shrink: 0; }
.pg-faq details[open] summary .pg-x { transform: rotate(45deg); }
.pg-faq .pg-a { padding: 0 4px 24px; font-size: 15px; color: var(--pg-body); line-height: 1.65; max-width: 680px; }

/* Support surfaces */
.pg-support-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin-bottom: 60px; }
.pg-support-cell { background: #fff; border: 1px solid var(--pg-hairline-soft); border-top: 2px solid var(--pg-gold-600); border-radius: 0 0 4px 4px; padding: 28px; }
.pg-support-cell h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 20px; color: var(--pg-ink); margin: 0 0 8px; }
.pg-support-cell p { font-size: 13.5px; color: var(--pg-body); line-height: 1.55; margin: 0 0 16px; }
.pg-textlink { font-size: 13px; font-weight: 600; color: var(--pg-navy-900); border-bottom: 1px solid var(--pg-gold-600); padding-bottom: 2px; text-decoration: none; white-space: nowrap; transition: color .15s; }
.pg-textlink:hover { color: var(--pg-gold-800); }

/* Editorial form panel */
.pg-panel { background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 4px; padding: 28px; margin-bottom: 26px; }
.pg-panel h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: 21px; color: var(--pg-ink); margin: 0 0 20px; }
.pg-frm { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 18px; }
.pg-frm .pg-full { grid-column: 1 / -1; }
.pg-fld label { display: block; font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--pg-muted); margin-bottom: 7px; }
.pg-fld input, .pg-fld select, .pg-fld textarea { width: 100%; font-family: var(--pg-font-sans); font-size: 14.5px; color: var(--pg-ink); background: #fff; border: 1px solid var(--pg-hairline); border-radius: 2px; padding: 12px 14px; outline: 0; transition: border-color .15s; }
.pg-fld input:focus, .pg-fld select:focus, .pg-fld textarea:focus { border-color: var(--pg-navy-500); }
.pg-fld textarea { resize: vertical; }
.pg-fld .pg-af-err { text-transform: none; letter-spacing: 0; }
.pg-variant-note { font-size: 12px; color: var(--pg-muted); margin-top: 14px; border-top: 1px solid var(--pg-hairline-soft); padding-top: 12px; line-height: 1.5; }

/* In-place success feedback */
.pg-feedback-ok { text-align: center; padding: 44px 30px; }
.pg-feedback-ok .pg-seal { width: 58px; height: 58px; margin: 0 auto 20px; border-radius: 50%; border: 1px solid var(--pg-gold-600); display: flex; align-items: center; justify-content: center; }
.pg-feedback-ok .pg-seal svg { width: 24px; height: 24px; stroke: var(--pg-gold-700); fill: none; stroke-width: 1.8; }
.pg-feedback-ok h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: 26px; color: var(--pg-ink); margin: 0 0 10px; }
.pg-feedback-ok p { font-size: 14px; color: var(--pg-muted); line-height: 1.6; margin: 0 auto; max-width: 440px; }
.pg-feedback-ok .pg-ref { font-size: 12px; color: var(--pg-muted); margin-top: 14px; font-variant-numeric: tabular-nums; }

/* Socials row */
.pg-socials { display: flex; gap: 26px; justify-content: center; flex-wrap: wrap; padding-bottom: 20px; }
.pg-socials a { font-size: 13px; font-weight: 600; color: var(--pg-navy-800); border-bottom: 1px solid var(--pg-gold-600); padding-bottom: 2px; text-decoration: none; transition: color .15s; }
.pg-socials a:hover { color: var(--pg-gold-800); }

/* Responsive */
@media (max-width: 1080px) {
    .pg-steps { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px) {
    .pg-support-grid { grid-template-columns: 1fr; }
    .pg-section-head { flex-wrap: wrap; gap: 12px 16px; }
    .pg-lead-rule { display: none; }
    .pg-frm { grid-template-columns: 1fr; }
    .pg-page-head { padding: 44px 0 32px; }
}
@media (max-width: 640px) {
    .pg-steps { grid-template-columns: 1fr; }
}

/* About page: mission, platform grid, segments, founder, figures */
.pg-mission { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; padding-bottom: 72px; }
.pg-mission h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(26px, 3.2vw, 38px); line-height: 1.15; color: var(--pg-ink); margin: 12px 0 18px; }
.pg-mission p { font-size: 15px; line-height: 1.65; color: var(--pg-body); margin: 0 0 16px; }
.pg-mission .pg-pic { position: relative; }
.pg-mission .pg-pic::before { content: ""; position: absolute; inset: 16px -16px -16px 16px; border: 1px solid var(--pg-gold-600); border-radius: 3px; }
.pg-mission .pg-pic img { position: relative; width: 100%; display: block; border-radius: 3px; }
.pg-proof-rows { margin-top: 34px; border-top: 1px solid var(--pg-hairline); }
.pg-prow { display: grid; grid-template-columns: 220px 1fr; gap: 24px; padding: 16px 2px; border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-prow .pg-pk { font-family: var(--pg-font-display); font-weight: 500; font-size: 18px; color: var(--pg-ink); }
.pg-prow .pg-pv { font-size: 14px; color: var(--pg-body); line-height: 1.6; }

.pg-block { padding: 72px 0; }
.pg-block-white { background: #fff; border-top: 1px solid var(--pg-hairline-soft); border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-segments { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border: 1px solid var(--pg-hairline-soft); border-radius: 4px; background: #fff; overflow: hidden; }
.pg-segment { padding: 30px 28px; }
.pg-segment + .pg-segment { border-left: 1px solid var(--pg-hairline-soft); }
.pg-segment h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 21px; color: var(--pg-ink); margin: 0 0 8px; }
.pg-segment p { font-size: 13.5px; line-height: 1.6; color: var(--pg-body); margin: 0; }

/* Founder band */
.pg-founder-band { background: var(--pg-navy-900); color: #fff; padding: 84px 0; }
.pg-founder-grid { display: grid; grid-template-columns: 300px 1fr; gap: 64px; align-items: start; }
.pg-founder-plate { border: 1px solid rgba(251,191,36,.4); border-radius: 4px; padding: 44px 34px; text-align: center; }
.pg-founder-plate img { width: 100%; border-radius: 3px; display: block; margin-bottom: 22px; }
.pg-founder-plate .pg-fp-name { font-family: var(--pg-font-display); font-weight: 500; font-size: 34px; color: #fff; line-height: 1.1; }
.pg-founder-plate .pg-fp-title { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--pg-gold-500); margin-top: 12px; line-height: 1.7; }
.pg-founder-copy .pg-eyebrow { color: var(--pg-gold-500); }
.pg-founder-copy h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(26px, 3.2vw, 38px); line-height: 1.15; color: #fff; margin: 14px 0 18px; }
.pg-founder-copy p { font-size: 15px; line-height: 1.7; color: var(--pg-navy-200); margin: 0 0 16px; max-width: 600px; }
.pg-founder-copy .pg-founder-bio { color: var(--pg-navy-200); font-size: 15px; line-height: 1.7; max-width: 600px; }
.pg-founder-copy .pg-founder-bio p { color: var(--pg-navy-200); }
.pg-founder-copy .pg-textlink { color: #fff; border-bottom-color: var(--pg-gold-500); }
.pg-founder-copy .pg-textlink:hover { color: var(--pg-gold-200); }
.pg-founder-socials { display: flex; gap: 18px; margin-top: 20px; }
.pg-founder-socials a { font-size: 13px; font-weight: 600; color: rgba(245,239,224,.85); border-bottom: 1px solid var(--pg-gold-500); padding-bottom: 2px; text-decoration: none; }
.pg-founder-socials a:hover { color: #fff; }

/* Team grid */
.pg-team-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
.pg-team-card { text-align: center; }
.pg-team-card .pg-team-photo { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; margin: 0 auto 14px; border: 1px solid var(--pg-hairline); }
.pg-team-card h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 17px; color: var(--pg-ink); margin: 0 0 2px; }
.pg-team-card .pg-team-role { font-size: 12.5px; color: var(--pg-gold-800); font-weight: 600; margin: 0 0 8px; }
.pg-team-card .pg-team-bio { font-size: 13px; color: var(--pg-body); line-height: 1.55; margin: 0 0 10px; }
.pg-team-socials { display: flex; gap: 12px; justify-content: center; }
.pg-team-socials a { color: var(--pg-navy-400); transition: color .15s; }
.pg-team-socials a:hover { color: var(--pg-navy-800); }
.pg-team-socials svg { width: 18px; height: 18px; }

@media (max-width: 1080px) {
    .pg-mission { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
    .pg-founder-grid { grid-template-columns: 1fr; gap: 32px; }
    .pg-founder-plate { max-width: 300px; }
    .pg-segments { grid-template-columns: 1fr 1fr; }
    .pg-segment + .pg-segment { border-left: 0; }
    .pg-segment:nth-child(even) { border-left: 1px solid var(--pg-hairline-soft); }
    .pg-segment:nth-child(n+3) { border-top: 1px solid var(--pg-hairline-soft); }
    .pg-team-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
    .pg-mission .pg-pic::before { inset: 12px -8px -12px 8px; }
    .pg-prow { grid-template-columns: 1fr; gap: 4px; }
    .pg-segments { grid-template-columns: 1fr; }
    .pg-segment:nth-child(even) { border-left: 0; }
    .pg-segment + .pg-segment { border-top: 1px solid var(--pg-hairline-soft); }
    .pg-fee-nav { display: none; }
    .pg-team-grid { grid-template-columns: 1fr; }
}

/* ===================================================================
   Editorial directory, author profile, and guide-article surfaces.
   Composes with the existing tokens and shared vocabulary above.
   Shared atoms first (monogram, ledger, state card, breadcrumb line,
   selectable option row), then the per-surface blocks. Added in
   release 2.0.0.9.
   =================================================================== */

/* -- Shared atoms (reused by later editorial and form surfaces) -- */
.pg-crumbs-line { font-size: 12.5px; color: var(--pg-muted); margin-bottom: 18px; }
.pg-crumbs-line a { color: var(--pg-navy-700); text-decoration: none; }
.pg-crumbs-line a:hover { color: var(--pg-gold-800); }
.pg-crumbs-line span { color: var(--pg-muted); }

.pg-rule { display: block; width: 56px; height: 1px; background: var(--pg-navy-900); opacity: .28; margin: 18px auto 0; }
.pg-rule.pg-rule-left { margin-left: 0; }

.pg-note-line { font-size: 12.5px; color: var(--pg-muted); line-height: 1.6; }

.pg-monogram { width: 52px; height: 52px; border-radius: 50%; border: 1px solid var(--pg-hairline); background: var(--pg-navy-50); color: var(--pg-navy-700); font-family: var(--pg-font-display); font-size: 19px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pg-monogram.pg-monogram-lg { width: 84px; height: 84px; font-size: 30px; }

.pg-topic-chip { display: inline-block; font-size: 11.5px; font-weight: 600; letter-spacing: .06em; color: var(--pg-navy-700); border: 1px solid var(--pg-hairline); border-radius: 2px; padding: 5px 12px; background: #fff; }

.pg-ledger { border-top: 1px solid var(--pg-hairline); }
.pg-ledger-row { display: flex; align-items: center; gap: 22px; padding: 22px 4px; border-bottom: 1px solid var(--pg-hairline-soft); }

.pg-state-card { max-width: 560px; margin: 0 auto; background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 3px; padding: 40px 44px; }
.pg-state-card h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: 24px; color: var(--pg-ink); margin: 0 0 10px; }
.pg-state-card p { font-size: 14.5px; color: var(--pg-body); line-height: 1.65; margin: 0; }

.pg-icon-24 { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.pg-icon-20 { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

/* Selectable option row + radio dot. First used by the email
   preferences and curated-access payment surfaces; defined here so
   those surfaces compose rather than redeclare. */
.pg-radio { display: inline-block; width: 16px; height: 16px; border-radius: 50%; border: 1.5px solid var(--pg-navy-300); position: relative; flex-shrink: 0; }
.pg-optrow { display: flex; gap: 14px; align-items: flex-start; padding: 16px 2px; border-top: 1px solid var(--pg-hairline-soft); cursor: pointer; }
.pg-optrow.is-sel .pg-radio { border-color: var(--pg-navy-900); }
.pg-optrow.is-sel .pg-radio::after { content: ''; position: absolute; inset: 3px; border-radius: 50%; background: var(--pg-navy-900); }

/* -- Authors index -- */
.pg-au-row { display: flex; align-items: center; gap: 24px; padding: 26px 4px; border-bottom: 1px solid var(--pg-hairline-soft); text-decoration: none; }
.pg-au-row .pg-au-who { flex: 1; min-width: 0; }
.pg-au-row .pg-au-who h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: 20px; line-height: 1.25; color: var(--pg-ink); margin: 0; }
.pg-au-row .pg-au-role { font-size: 13px; color: var(--pg-muted); margin-top: 3px; }
.pg-au-row .pg-au-topics { display: flex; gap: 8px; flex-wrap: wrap; max-width: 340px; justify-content: flex-end; }
.pg-au-row .pg-au-cnt { font-size: 12.5px; color: var(--pg-muted); white-space: nowrap; width: 96px; text-align: right; flex-shrink: 0; }
.pg-au-row .pg-au-arr { color: var(--pg-navy-400); flex-shrink: 0; }
.pg-au-row:hover .pg-au-who h2 { color: var(--pg-gold-700); }
.pg-au-row:hover .pg-au-arr { color: var(--pg-gold-700); }

/* -- Author profile -- */
.pg-aup-head { display: flex; gap: 28px; align-items: flex-start; padding: 64px 0 40px; }
.pg-aup-head .pg-aup-id h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(30px, 3.6vw, 42px); line-height: 1.08; color: var(--pg-ink); margin: 0; }
.pg-aup-head .pg-aup-role { font-size: 14px; color: var(--pg-muted); margin-top: 6px; }
.pg-aup-head .pg-aup-bio { font-size: 15.5px; color: var(--pg-body); line-height: 1.7; margin-top: 16px; max-width: 640px; }
.pg-aup-meta { display: flex; gap: 34px; flex-wrap: wrap; padding: 20px 0; border-top: 1px solid var(--pg-hairline); border-bottom: 1px solid var(--pg-hairline-soft); margin-bottom: 8px; }
.pg-aup-meta .pg-k { font-size: 10.5px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--pg-muted); }
.pg-aup-meta .pg-v { font-size: 13.5px; color: var(--pg-ink); margin-top: 4px; }
.pg-aup-meta .pg-v a { color: var(--pg-navy-700); text-decoration: underline; text-underline-offset: 3px; }
.pg-aup-posts { padding: 30px 0 80px; }
.pg-aup-post { display: flex; align-items: baseline; gap: 24px; padding: 20px 4px; border-bottom: 1px solid var(--pg-hairline-soft); text-decoration: none; }
.pg-aup-post .pg-d { font-size: 12px; color: var(--pg-muted); width: 92px; flex-shrink: 0; font-variant-numeric: tabular-nums; }
.pg-aup-post h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 18px; line-height: 1.3; color: var(--pg-ink); flex: 1; margin: 0; }
.pg-aup-post .pg-excerpt { font-size: 13px; color: var(--pg-muted); line-height: 1.55; margin-top: 4px; }
.pg-aup-post .pg-c { font-size: 11.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--pg-gold-800); flex-shrink: 0; white-space: nowrap; }
.pg-aup-post:hover h3 { color: var(--pg-gold-700); }

/* -- Guide article -- */
.pg-ga-hero { padding: 64px 0 34px; }
.pg-ga-hero h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(32px, 4.2vw, 50px); line-height: 1.07; color: var(--pg-ink); max-width: 820px; margin: 0; }
.pg-ga-hero .pg-ga-lede { font-size: 17px; color: var(--pg-body); line-height: 1.65; max-width: 700px; margin: 16px 0 0; }
.pg-ga-hero .pg-ga-meta { display: flex; flex-wrap: wrap; gap: 26px; font-size: 12.5px; color: var(--pg-muted); margin-top: 22px; }
.pg-ga-hero .pg-ga-meta a { color: var(--pg-navy-700); text-decoration: none; }
.pg-ga-hero .pg-ga-meta a:hover { color: var(--pg-gold-800); }
.pg-ga-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 64px; padding-bottom: 60px; }
.pg-ga-steps { border-top: 1px solid var(--pg-hairline); }
.pg-ga-step { display: flex; gap: 26px; padding: 30px 4px; border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-ga-step .pg-ga-no { font-family: var(--pg-font-display); font-size: 22px; color: var(--pg-gold-700); font-variant-numeric: tabular-nums; width: 44px; flex-shrink: 0; line-height: 1.2; }
.pg-ga-step h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 20px; line-height: 1.3; color: var(--pg-ink); margin: 0 0 8px; }
.pg-ga-step .pg-ga-body { font-size: 15px; color: var(--pg-body); line-height: 1.7; }
.pg-ga-step .pg-ga-body p { margin: 0 0 12px; }
.pg-ga-step .pg-ga-body p:last-child { margin-bottom: 0; }
.pg-ga-step img { border-radius: 4px; margin-top: 16px; border: 1px solid var(--pg-hairline); max-width: 100%; height: auto; }
.pg-ga-aside { position: sticky; top: 80px; align-self: start; border: 1px solid var(--pg-hairline-soft); border-radius: 3px; background: #fff; padding: 26px 26px 8px; }
.pg-ga-aside h4 { font-family: var(--pg-font-sans); font-size: 11px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--pg-gold-800); margin: 0 0 16px; }
.pg-ga-aside .pg-ga-fact { padding: 12px 0; border-top: 1px solid var(--pg-hairline-soft); }
.pg-ga-aside .pg-ga-fact .pg-k { font-size: 10.5px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-muted); }
.pg-ga-aside .pg-ga-fact .pg-v { font-size: 13.5px; color: var(--pg-ink); margin-top: 4px; line-height: 1.55; }
.pg-ga-empty { padding: 30px; text-align: center; border: 1px solid var(--pg-hairline-soft); border-radius: 3px; background: #fff; font-size: 14px; color: var(--pg-muted); }

/* -- Responsive: editorial and guide surfaces -- */
@media (max-width: 900px) {
    .pg-ga-layout { grid-template-columns: 1fr; gap: 34px; }
    .pg-ga-aside { position: static; }
    .pg-au-row .pg-au-topics { display: none; }
}
@media (max-width: 640px) {
    .pg-aup-head { flex-direction: column; gap: 18px; }
    .pg-state-card { padding: 30px 24px; }
    .pg-au-row { flex-wrap: wrap; }
    .pg-au-row .pg-au-cnt { width: auto; text-align: left; }
    .pg-aup-post { flex-wrap: wrap; }
    .pg-aup-post .pg-d { width: auto; }
    .pg-aup-meta { gap: 22px; }
}

/* ===================================================================
   Review capture surfaces: attendee review, organiser feedback.
   Composes with the shared tokens and vocabulary above. Star marks
   are unified on gold across every rating group. The recommendation
   chips are driven by the radio state in pure CSS, so they work
   without JavaScript. Added in release 2.0.0.9.
   =================================================================== */

.pg-rv-head { padding: 58px 0 30px; text-align: center; }
.pg-rv-head h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(30px, 3.8vw, 44px); line-height: 1.08; color: var(--pg-ink); margin: 0; }
.pg-rv-head h1 em { font-style: italic; color: var(--pg-gold-700); }
.pg-rv-head .pg-rv-ctx { font-size: 13.5px; color: var(--pg-muted); margin-top: 12px; }

.pg-rv-card { max-width: 720px; margin: 0 auto 64px; background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 3px; }
.pg-rv-sec { padding: 30px 38px; border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-rv-sec:last-child { border-bottom: 0; }
.pg-rv-sec h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: 19px; color: var(--pg-ink); margin: 0 0 4px; }
.pg-rv-sec .pg-rv-hint { font-size: 12.5px; color: var(--pg-muted); margin-bottom: 16px; }
.pg-rv-sec .pg-rv-req { color: var(--pg-gold-800); }
.pg-rv-sec textarea { width: 100%; font-family: var(--pg-font-sans); font-size: 14.5px; color: var(--pg-ink); border: 1px solid var(--pg-hairline); border-radius: 2px; padding: 12px 14px; min-height: 84px; resize: vertical; outline: 0; background: #fff; }
.pg-rv-sec textarea:focus { border-color: var(--pg-navy-400); }
.pg-rv-sec .pg-rv-cap { font-size: 11px; color: var(--pg-muted); text-align: right; margin-top: 6px; }
.pg-rv-sec .pg-rv-err { font-size: 12.5px; color: #b64545; margin-top: 6px; }

/* Star row: Alpine drives the state, these classes carry the look.
   Default is a navy outline; the active class fills gold. */
.pg-rv-stars { display: flex; align-items: center; gap: 4px; margin-bottom: 16px; flex-wrap: wrap; }
.pg-rv-star { background: none; border: 0; padding: 2px; margin: 0; cursor: pointer; line-height: 0; }
.pg-rv-star svg { width: 30px; height: 30px; fill: none; stroke: var(--pg-navy-200); stroke-width: 1.4; transition: fill .15s, stroke .15s, transform .15s; }
.pg-rv-star:hover svg { transform: scale(1.08); }
.pg-rv-star svg.pg-rv-star-on { fill: var(--pg-gold-500); stroke: var(--pg-gold-600); }
.pg-rv-stars .pg-rv-lbl { font-size: 12.5px; color: var(--pg-muted); margin-left: 8px; }

.pg-rv-foot { padding: 26px 38px 34px; }
.pg-rv-foot h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: 16px; color: var(--pg-ink); margin: 0 0 4px; }
.pg-rv-note { font-size: 12px; color: var(--pg-muted); text-align: center; margin-top: 14px; line-height: 1.6; }

/* Recommendation chips: pure-CSS selected state off the radio input. */
.pg-rv-rec { display: flex; gap: 12px; margin: 14px 0 24px; flex-wrap: wrap; }
.pg-optchip { position: relative; display: flex; flex: 1; min-width: 90px; }
.pg-optchip input { position: absolute; opacity: 0; width: 0; height: 0; }
.pg-optchip span { flex: 1; text-align: center; border: 1px solid var(--pg-hairline); border-radius: 2px; padding: 13px 10px; font-size: 13px; font-weight: 600; color: var(--pg-navy-800); background: #fff; cursor: pointer; transition: border-color .15s, background .15s, color .15s; }
.pg-optchip:hover span { border-color: var(--pg-navy-300); }
.pg-optchip input:checked + span { border-color: var(--pg-navy-900); background: var(--pg-navy-900); color: #fff; }
.pg-optchip input:focus-visible + span { outline: 2px solid var(--pg-gold-600); outline-offset: 2px; }

/* Organiser context card shown above the organiser feedback form. */
.pg-rv-ctxcard { max-width: 720px; margin: 0 auto 22px; background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 3px; padding: 20px 24px; display: flex; align-items: center; gap: 16px; }
.pg-rv-ctxcard .pg-rv-ctxname { font-family: var(--pg-font-display); font-weight: 500; font-size: 18px; color: var(--pg-ink); }
.pg-rv-ctxcard .pg-rv-ctxrole { font-size: 12.5px; color: var(--pg-muted); margin-top: 2px; }

/* Info banner (session info) in the editorial voice. */
.pg-rv-banner { max-width: 720px; margin: 0 auto 22px; font-size: 13.5px; color: var(--pg-navy-800); background: var(--pg-gold-100); border: 1px solid var(--pg-gold-200); border-radius: 3px; padding: 12px 16px; }

.pg-rv-disabled { opacity: .5; cursor: not-allowed; }

@media (max-width: 640px) {
    .pg-rv-sec { padding: 24px 22px; }
    .pg-rv-foot { padding: 22px 22px 28px; }
    .pg-rv-ctxcard { padding: 16px 18px; }
    .pg-rv-rec { gap: 8px; }
    .pg-optchip { min-width: 72px; }
}

/* ===================================================================
   Blog listing cards: clickable card with a linked author byline.
   The title anchor stretches over the whole card so the card stays
   clickable to the article, while the author name is a separate link
   raised above the stretch so it routes to the author profile.
   Added in release 2.0.0.9.
   =================================================================== */
.pg-post { position: relative; }
.pg-post h3 a.pg-post-titlelink { color: inherit; text-decoration: none; }
.pg-post-titlelink::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: 3px; }
.pg-post .pg-by .pg-by-author { position: relative; z-index: 2; color: var(--pg-navy-800); font-weight: 600; text-decoration: none; }
.pg-post .pg-by .pg-by-author:hover { color: var(--pg-gold-800); text-decoration: underline; text-underline-offset: 2px; }

/* ===================================================================
   Email preference and account-deletion surfaces.
   Composes with the shared tokens and vocabulary above. The
   preference options are real radio inputs whose selected state is
   drawn in pure CSS, so they work without JavaScript. Added in
   release 2.0.0.9.
   =================================================================== */

/* -- Unsubscribe: manage-preferences card -- */
.pg-un-card { max-width: 600px; margin: 0 auto 70px; background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 3px; padding: 38px 42px; }
.pg-un-card h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: 22px; color: var(--pg-ink); margin: 0 0 6px; }
.pg-un-card .pg-un-sub { font-size: 13.5px; color: var(--pg-muted); margin: 0 0 22px; line-height: 1.6; }
.pg-un-card .pg-un-sub b { color: var(--pg-ink); font-weight: 600; }

.pg-un-opt { display: flex; gap: 14px; align-items: flex-start; padding: 16px 2px; border-top: 1px solid var(--pg-hairline-soft); cursor: pointer; position: relative; }
.pg-un-opt input { position: absolute; opacity: 0; width: 0; height: 0; }
.pg-un-opt .pg-un-radio { width: 16px; height: 16px; border-radius: 50%; border: 1.5px solid var(--pg-navy-300); margin-top: 2px; flex-shrink: 0; position: relative; transition: border-color .15s; }
.pg-un-opt input:checked + .pg-un-radio { border-color: var(--pg-navy-900); }
.pg-un-opt input:checked + .pg-un-radio::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: var(--pg-navy-900); }
.pg-un-opt input:focus-visible + .pg-un-radio { outline: 2px solid var(--pg-gold-600); outline-offset: 2px; }
.pg-un-opt .pg-un-body b { display: block; font-family: var(--pg-font-sans); font-weight: 600; font-size: 15px; color: var(--pg-ink); }
.pg-un-opt .pg-un-body em { display: block; font-style: normal; font-size: 12.5px; color: var(--pg-muted); margin-top: 2px; line-height: 1.55; }

.pg-un-card .pg-un-reason { margin-top: 20px; }
.pg-un-card .pg-un-reason label { display: block; font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--pg-muted); margin-bottom: 7px; }
.pg-un-card textarea { width: 100%; font-family: var(--pg-font-sans); font-size: 14.5px; color: var(--pg-ink); background: #fff; border: 1px solid var(--pg-hairline); border-radius: 2px; padding: 12px 14px; min-height: 84px; resize: vertical; outline: 0; }
.pg-un-card textarea:focus { border-color: var(--pg-navy-400); }
.pg-un-keep { font-size: 12px; color: var(--pg-muted); text-align: center; margin-top: 16px; line-height: 1.6; }

.pg-un-note { border: 1px solid var(--pg-hairline-soft); border-radius: 3px; padding: 16px 20px; margin: 0 auto 6px; max-width: 420px; text-align: left; }
.pg-un-note .pg-un-note-k { font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--pg-muted); }
.pg-un-note ul { list-style: none; margin: 8px 0 0; padding: 0; }
.pg-un-note li { font-size: 13.5px; color: var(--pg-body); padding: 3px 0; }

/* -- Delete account: editorial legal document -- */
.pg-da-updated { font-size: 12.5px; color: var(--pg-muted); margin-top: 12px; }
.pg-da-doc { padding-bottom: 90px; }
.pg-da-doc .pg-da-lead { font-size: 16.5px; color: var(--pg-body); line-height: 1.7; margin: 0 0 8px; }
.pg-da-doc h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: 24px; color: var(--pg-ink); margin: 42px 0 14px; }
.pg-da-doc p { font-size: 15px; color: var(--pg-body); line-height: 1.7; }
.pg-da-doc a { color: var(--pg-navy-700); text-decoration: underline; text-underline-offset: 3px; }
.pg-da-doc a:hover { color: var(--pg-gold-800); }

.pg-da-paths { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; margin: 22px 0 8px; }
.pg-da-path { border: 1px solid var(--pg-hairline-soft); border-radius: 3px; background: #fff; padding: 24px 26px; }
.pg-da-path h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 16.5px; color: var(--pg-ink); margin: 0 0 8px; }
.pg-da-path p { font-size: 14px; color: var(--pg-body); line-height: 1.65; margin: 0; }
.pg-da-path .pg-da-mail { display: inline-block; margin-top: 14px; font-weight: 600; }

.pg-da-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; margin-top: 22px; }
.pg-da-col { border: 1px solid var(--pg-hairline-soft); border-radius: 3px; background: #fff; padding: 24px 26px; }
.pg-da-col h3 { font-family: var(--pg-font-sans); font-weight: 600; font-size: 15px; color: var(--pg-ink); padding-bottom: 10px; margin: 0 0 4px; border-bottom: 1px solid var(--pg-hairline); }
.pg-da-col ul { list-style: none; margin: 0; padding: 0; }
.pg-da-col li { font-size: 14px; color: var(--pg-body); line-height: 1.6; padding: 9px 0; border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-da-col li:last-child { border-bottom: 0; }
.pg-da-col p { font-size: 14px; color: var(--pg-body); line-height: 1.65; margin: 10px 0 0; }

@media (max-width: 700px) {
    .pg-da-paths, .pg-da-cols { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .pg-un-card { padding: 28px 22px; }
}

/* ===================================================================
   Full-height pages. The public shell pins the footer to the bottom
   of the viewport so short pages (a single confirmation line, an
   error state) still fill the screen rather than leaving the footer
   floating with empty space beneath it. The fixed navigation is out
   of flow, so only the main content and footer participate here.
   Added in release 2.0.0.9.
   =================================================================== */
body.public-page { min-height: 100vh; display: flex; flex-direction: column; }
body.public-page > .page-reveal { flex: 1 0 auto; }
body.public-page > .pg-shell-footer { flex-shrink: 0; }

/* ===================================================================
   Curated Access: public landing, guest registration, and the
   registration status pages. Composes with the shared tokens and
   vocabulary above; fonts are the self-hosted Fraunces and Inter set
   already loaded for the Programme surfaces, so these pages no longer
   pull a webfont from a third-party host. Added in release 2.0.0.9.
   =================================================================== */

/* -- Landing: hero -- */
.pg-ca-hero { padding: 70px 0 6px; text-align: center; }
.pg-ca-hero h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(34px, 4.6vw, 54px); line-height: 1.06; color: var(--pg-ink); max-width: 760px; margin: 0 auto; }
.pg-ca-hero .pg-ca-sub { font-size: 16.5px; color: var(--pg-body); line-height: 1.65; max-width: 600px; margin: 18px auto 26px; }
.pg-ca-hero .pg-ca-actions { display: flex; gap: 16px; justify-content: center; align-items: center; flex-wrap: wrap; }
.pg-ca-hero .pg-ca-textcta { font-size: 14px; color: var(--pg-navy-700); text-decoration: none; }
.pg-ca-hero .pg-ca-textcta:hover { color: var(--pg-gold-800); }

/* -- Landing: how it works -- */
.pg-ca-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 38px; padding: 44px 0 20px; }
.pg-ca-step { border-top: 1px solid var(--pg-hairline); padding-top: 18px; }
.pg-ca-step .pg-ca-no { font-family: var(--pg-font-display); font-size: 22px; color: var(--pg-gold-700); font-variant-numeric: tabular-nums; }
.pg-ca-step h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 17px; line-height: 1.3; color: var(--pg-ink); margin: 8px 0 7px; }
.pg-ca-step p { font-size: 13.5px; color: var(--pg-muted); line-height: 1.6; }
.pg-ca-close { max-width: 640px; padding-top: 6px; }
.pg-ca-close h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(20px, 2.4vw, 26px); color: var(--pg-ink); margin: 14px 0 0; }
.pg-ca-close p { font-size: 15px; color: var(--pg-body); line-height: 1.7; margin: 12px 0 0; }

/* -- Landing: packs -- */
.pg-ca-packs { border-top: 1px solid var(--pg-hairline); }
.pg-ca-pack { display: flex; align-items: center; gap: 24px; padding: 24px 4px; border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-ca-pack .pg-ca-nm { flex: 1; min-width: 0; }
.pg-ca-pack .pg-ca-tier { font-size: 10.5px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--pg-muted); }
.pg-ca-pack .pg-ca-nm h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 20px; line-height: 1.2; color: var(--pg-ink); margin: 3px 0 0; }
.pg-ca-pack .pg-ca-nm p { font-size: 12.5px; color: var(--pg-muted); margin-top: 3px; }
.pg-ca-pack .pg-ca-pr { text-align: right; flex-shrink: 0; }
.pg-ca-pack .pg-ca-amt { font-family: var(--pg-font-display); font-size: 21px; font-variant-numeric: tabular-nums; color: var(--pg-ink); }
.pg-ca-pack .pg-ca-once { font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--pg-muted); margin-left: 4px; }
.pg-ca-pack .pg-ca-alt { font-size: 11px; color: var(--pg-muted); margin-top: 2px; }
.pg-ca-pack .pg-ca-go { flex-shrink: 0; }
.pg-ca-pack.is-featured { border-left: 2px solid var(--pg-gold-600); padding-left: 18px; background: linear-gradient(0deg, rgba(251, 191, 36, .05), rgba(251, 191, 36, .05)); position: relative; }
.pg-ca-pack .pg-ca-hot { display: inline-block; font-size: 10px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-gold-800); margin-left: 10px; vertical-align: middle; }
.pg-ca-packs-note { font-size: 12.5px; color: var(--pg-muted); line-height: 1.6; margin: 16px 0 0; }
.pg-ca-empty { border: 1px solid var(--pg-hairline-soft); border-radius: 3px; padding: 40px; text-align: center; font-size: 14px; color: var(--pg-muted); background: #fff; }

/* -- Landing: trust trio -- */
.pg-ca-trio { display: grid; grid-template-columns: repeat(3, 1fr); gap: 44px; padding: 54px 0 20px; }
.pg-ca-trio .pg-ca-t svg { width: 26px; height: 26px; fill: none; stroke: var(--pg-navy-600); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.pg-ca-trio .pg-ca-t h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: 17px; color: var(--pg-ink); margin: 12px 0 7px; }
.pg-ca-trio .pg-ca-t p { font-size: 13.5px; color: var(--pg-muted); line-height: 1.6; }
.pg-ca-foot { padding: 24px 0 0; border-top: 1px solid var(--pg-hairline); margin-top: 40px; }
.pg-ca-foot p { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--pg-muted); }

/* -- Registration: event masthead -- */
.pg-ca-evmast { text-align: center; padding: 60px 0 30px; }
.pg-ca-evmast .pg-ca-org { font-size: 11px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--pg-muted); }
.pg-ca-evmast h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(30px, 4vw, 46px); line-height: 1.08; color: var(--pg-ink); margin: 10px 0 0; }
.pg-ca-evmast .pg-ca-dt { font-size: 13.5px; color: var(--pg-body); margin-top: 12px; }
.pg-ca-evmast .pg-ca-intro { font-size: 14px; color: var(--pg-body); line-height: 1.7; max-width: 560px; margin: 18px auto 0; padding-top: 16px; border-top: 1px solid var(--pg-hairline-soft); text-align: left; }

/* -- Registration: form -- */
.pg-ca-form { max-width: 560px; margin: 0 auto 40px; background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 3px; }
.pg-ca-form-head { padding: 24px 30px; border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-ca-form-head h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: 20px; color: var(--pg-ink); margin: 0; }
.pg-ca-form-head p { font-size: 13px; color: var(--pg-muted); margin: 4px 0 0; }
.pg-ca-form-body { padding: 26px 30px 30px; }
.pg-ca-field { margin-bottom: 18px; }
.pg-ca-field > label { display: block; font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--pg-muted); margin-bottom: 7px; }
.pg-ca-field .pg-ca-reqmark { color: var(--pg-gold-800); }
.pg-ca-field .pg-ca-optmark { color: var(--pg-muted); font-weight: 400; text-transform: none; letter-spacing: 0; }
.pg-ca-field input, .pg-ca-field textarea, .pg-ca-field select { width: 100%; font-family: var(--pg-font-sans); font-size: 14.5px; color: var(--pg-ink); background: #fff; border: 1px solid var(--pg-hairline); border-radius: 2px; padding: 11px 13px; outline: 0; }
.pg-ca-field input:focus, .pg-ca-field textarea:focus, .pg-ca-field select:focus { border-color: var(--pg-navy-400); }
.pg-ca-field input.pg-ca-invalid, .pg-ca-field textarea.pg-ca-invalid, .pg-ca-field select.pg-ca-invalid { border-color: #c98b8b; }
.pg-ca-field .pg-ca-err { font-size: 12px; color: #b64545; margin-top: 6px; }
.pg-ca-field .pg-ca-help { font-size: 12px; color: var(--pg-muted); margin-top: 6px; }
.pg-ca-check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--pg-body); line-height: 1.55; }
.pg-ca-check input { margin-top: 3px; flex-shrink: 0; }
.pg-ca-check.pg-ca-required { padding-top: 16px; margin-top: 8px; border-top: 1px solid var(--pg-hairline-soft); }
.pg-ca-submit { padding-top: 6px; }
.pg-ca-subnote { font-size: 12px; color: var(--pg-muted); text-align: center; margin: 12px 0 0; }

/* -- Status pages: icon + receipt ledger -- */
.pg-ca-statusicon { width: 56px; height: 56px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; margin: 0 auto 20px; border: 1px solid var(--pg-hairline); background: var(--pg-navy-50); color: var(--pg-navy-700); }
.pg-ca-statusicon svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.pg-ca-statusicon.is-ok { background: var(--pg-gold-100); border-color: var(--pg-gold-200); color: var(--pg-gold-700); }
.pg-ca-statusicon.is-fail { background: #fbeaea; border-color: #f0cccc; color: #b64545; }
.pg-ca-statusicon.is-pending svg { animation: pg-ca-spin 1s linear infinite; }
@keyframes pg-ca-spin { to { transform: rotate(360deg); } }
.pg-ca-noteline { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--pg-muted); background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 3px; padding: 8px 14px; margin-top: 8px; }
.pg-ca-noteline svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.pg-ca-receipt { max-width: 520px; margin: 30px auto 0; background: #fff; border: 1px solid var(--pg-hairline-soft); border-radius: 3px; text-align: left; }
.pg-ca-receipt dl { margin: 0; padding: 8px 26px; }
.pg-ca-receipt .pg-ca-rrow { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--pg-hairline-soft); }
.pg-ca-receipt .pg-ca-rrow:last-child { border-bottom: 0; }
.pg-ca-receipt dt { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--pg-muted); }
.pg-ca-receipt dd { font-size: 14px; font-weight: 600; color: var(--pg-ink); margin: 0; text-align: right; }
.pg-ca-pill { display: inline-block; font-size: 11px; font-weight: 600; padding: 3px 10px; border-radius: 2px; background: var(--pg-gold-100); color: var(--pg-gold-800); border: 1px solid var(--pg-gold-200); }
.pg-ca-watchline { font-size: 12.5px; color: var(--pg-muted); line-height: 1.6; text-align: center; margin: 18px auto 0; max-width: 420px; }

/* -- Responsive -- */
@media (max-width: 900px) {
    .pg-ca-steps { grid-template-columns: repeat(2, 1fr); gap: 30px; }
    .pg-ca-trio { grid-template-columns: 1fr; gap: 30px; }
}
@media (max-width: 640px) {
    .pg-ca-steps { grid-template-columns: 1fr; }
    .pg-ca-pack { flex-wrap: wrap; }
    .pg-ca-pack .pg-ca-pr { text-align: left; }
    .pg-ca-form-body, .pg-ca-form-head { padding-left: 22px; padding-right: 22px; }
    .pg-ca-receipt dl { padding-left: 22px; padding-right: 22px; }
}

/* ===================================================================
   Curated Access: direct buyer form. The one checkout step in the
   funnel, so it composes on the registration-form vocabulary above
   with a pack summary head, numbered field groups, and a currency
   ledger whose selected state is drawn in pure CSS off the radio
   input. Added in release 2.0.0.9.
   =================================================================== */

.pg-ca-sumhead { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding-bottom: 20px; margin-bottom: 30px; border-bottom: 1px solid var(--pg-hairline); }
.pg-ca-sumhead .pg-ca-sumk { font-size: 10.5px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--pg-muted); }
.pg-ca-sumhead h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: 22px; color: var(--pg-ink); margin: 4px 0 0; }
.pg-ca-sumhead .pg-ca-sumq { font-size: 13px; color: var(--pg-muted); margin-top: 3px; }
.pg-ca-sumhead .pg-ca-sumpr { text-align: right; flex-shrink: 0; }
.pg-ca-sumhead .pg-ca-sumamt { font-family: var(--pg-font-display); font-size: 22px; font-variant-numeric: tabular-nums; color: var(--pg-ink); }
.pg-ca-sumhead .pg-ca-sumalt { font-size: 11.5px; color: var(--pg-muted); margin-top: 2px; }
.pg-ca-sumhead .pg-ca-sumchg { display: inline-block; margin-top: 8px; font-size: 12.5px; }

.pg-ca-grp { border-top: 1px solid var(--pg-hairline-soft); padding-top: 22px; margin-top: 26px; }
.pg-ca-grp:first-of-type { border-top: 0; padding-top: 0; margin-top: 0; }
.pg-ca-grphead { display: flex; align-items: baseline; gap: 12px; margin-bottom: 6px; }
.pg-ca-grphead .pg-ca-grpno { font-family: var(--pg-font-display); font-size: 17px; color: var(--pg-gold-700); font-variant-numeric: tabular-nums; }
.pg-ca-grphead h2 { font-family: var(--pg-font-display); font-weight: 500; font-size: 18px; color: var(--pg-ink); margin: 0; }
.pg-ca-grpsub { font-size: 13px; color: var(--pg-muted); line-height: 1.6; margin: 0 0 18px; }

.pg-ca-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 18px; }

.pg-ca-flash { border: 1px solid var(--pg-gold-200); background: var(--pg-gold-100); border-radius: 3px; padding: 14px 18px; font-size: 13.5px; color: var(--pg-navy-800); line-height: 1.6; margin-bottom: 20px; }
.pg-ca-flash b { color: var(--pg-ink); }
.pg-ca-flash.pg-ca-flash-error { border-color: #f0cccc; background: #fbeaea; color: #8f3b3b; }

.pg-ca-gwledger { border-top: 1px solid var(--pg-hairline); }
.pg-ca-gw { display: flex; gap: 14px; align-items: flex-start; padding: 16px 2px; border-bottom: 1px solid var(--pg-hairline-soft); cursor: pointer; position: relative; }
.pg-ca-gw input { position: absolute; opacity: 0; width: 0; height: 0; }
.pg-ca-gw .pg-ca-gwradio { width: 16px; height: 16px; border-radius: 50%; border: 1.5px solid var(--pg-navy-300); margin-top: 3px; flex-shrink: 0; position: relative; transition: border-color .15s; }
.pg-ca-gw input:checked + .pg-ca-gwradio { border-color: var(--pg-navy-900); }
.pg-ca-gw input:checked + .pg-ca-gwradio::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: var(--pg-navy-900); }
.pg-ca-gw input:focus-visible + .pg-ca-gwradio { outline: 2px solid var(--pg-gold-600); outline-offset: 2px; }
.pg-ca-gw .pg-ca-gwbody h3 { font-family: var(--pg-font-sans); font-weight: 600; font-size: 15px; color: var(--pg-ink); margin: 0; }
.pg-ca-gw .pg-ca-gwbody p { font-size: 12.5px; color: var(--pg-muted); margin: 2px 0 0; line-height: 1.55; }
.pg-ca-gw .pg-ca-gwamt { margin-left: auto; font-family: var(--pg-font-display); font-size: 17px; font-variant-numeric: tabular-nums; color: var(--pg-ink); flex-shrink: 0; }

.pg-ca-single { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; border: 1px solid var(--pg-hairline); border-radius: 2px; background: #fff; padding: 13px 16px; }
.pg-ca-single .pg-ca-singlek { font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-muted); }
.pg-ca-single .pg-ca-singleamt { font-family: var(--pg-font-display); font-size: 19px; font-variant-numeric: tabular-nums; color: var(--pg-ink); }

.pg-ca-spinlabel { display: inline-flex; align-items: center; gap: 8px; }
.pg-ca-spinlabel svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; animation: pg-ca-spin 1s linear infinite; }
.pg-btn.pg-ca-busy { opacity: .7; cursor: wait; }

.pg-ca-secline { display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-muted); margin-top: 14px; }
.pg-ca-secline svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

@media (max-width: 640px) {
    .pg-ca-grid2 { grid-template-columns: 1fr; }
    .pg-ca-sumhead { flex-direction: column; }
    .pg-ca-sumhead .pg-ca-sumpr { text-align: left; }
}

/* Curated Access inline Stripe card panel. Mirrors the editorial modal
   used by ticket checkout: an ivory card centred over a navy scrim. */
.pg-ca-stripe-card {
    position: relative;
    width: 100%;
    max-width: 440px;
    background: #fff;
    border: 1px solid var(--pg-hairline-soft);
    border-radius: 4px;
    padding: 28px;
    box-shadow: 0 24px 60px -20px rgba(23, 42, 68, .35);
}
.pg-ca-stripe-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 18px;
    font-family: var(--pg-font-display);
    font-weight: 500;
    font-size: 20px;
    color: var(--pg-ink);
}

/* ===================================================================
   Coming-soon notice for unpublished events. Cover artwork leads,
   the wordmark and site chrome come from the shared layout, and the
   body centres beneath it: eyebrow, title, organiser and date meta,
   then the organiser message or the default fallback copy. Added in
   release 2.0.0.9.
   =================================================================== */

.pg-cs-wrap { max-width: 880px; margin: 0 auto; padding: 56px 24px 90px; }
.pg-cs-cover { border: 1px solid var(--pg-hairline); border-radius: 3px; overflow: hidden; background: #fff; }
.pg-cs-cover img { width: 100%; height: auto; display: block; aspect-ratio: 21 / 9; object-fit: cover; }
.pg-cs-body { text-align: center; padding: 36px 20px 0; }
.pg-cs-body h1 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(30px, 4vw, 46px); line-height: 1.08; color: var(--pg-ink); max-width: 680px; margin: 14px auto 0; letter-spacing: -0.012em; }
.pg-cs-meta { display: flex; gap: 10px; align-items: center; justify-content: center; font-size: 13.5px; color: var(--pg-body); margin-top: 16px; flex-wrap: wrap; }
.pg-cs-meta i { width: 3px; height: 3px; border-radius: 50%; background: var(--pg-navy-300); }
.pg-cs-msg { font-size: 15px; color: var(--pg-body); line-height: 1.7; max-width: 560px; margin: 20px auto 0; }
.pg-cs-note { font-size: 12px; color: var(--pg-muted); margin-top: 4px; }

/* ===================================================================
   Event summary block inside a state card, used by the ticket
   not-yet-available page: an uppercase key line, the event title in
   the display face, and a muted date line. Added in release 2.0.0.9.
   =================================================================== */

.pg-state-ev { border: 1px solid var(--pg-hairline-soft); border-radius: 3px; padding: 16px 20px; margin: 22px 0; text-align: left; }
.pg-state-ev .pg-state-ev-k { font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-muted); margin: 0; }
.pg-state-ev .pg-state-ev-t { font-family: var(--pg-font-display); font-weight: 500; font-size: 17px; color: var(--pg-ink); margin: 5px 0 0; }
.pg-state-ev .pg-state-ev-d { font-size: 12.5px; color: var(--pg-muted); margin: 3px 0 0; }
.pg-state-note { font-size: 12.5px; color: var(--pg-muted); line-height: 1.6; margin-top: 16px; }

/* ===================================================================
   Small tag line above an error headline, used by the invitation
   invalid pages: a hairline capsule in the muted voice. Added in
   release 2.0.0.9.
   =================================================================== */

.pg-err-tag { display: inline-block; font-size: 10px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-muted); border: 1px solid var(--pg-hairline); border-radius: 2px; padding: 4px 10px; margin-bottom: 10px; }

/* ===================================================================
   Events index controls on the editorial system: the live search
   results panel under the discovery search bar, the upcoming and
   past listing tabs, the filter bar, the loading and empty states,
   and the pager. These replace the residual utility classes the
   listing carried from the previous design. Added in release
   2.0.0.9.
   =================================================================== */

.pg-sres-panel { background: #fff; border: 1px solid var(--pg-hairline); border-radius: 3px; box-shadow: 0 18px 40px -18px rgba(23, 42, 68, .25); overflow: hidden; }
.pg-sres-list { padding: 6px; max-height: 384px; overflow-y: auto; }
.pg-sres-item { display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: 2px; transition: background .15s; }
.pg-sres-item:hover { background: var(--pg-gold-100); }
.pg-sres-thumb { width: 48px; height: 48px; border-radius: 2px; overflow: hidden; flex-shrink: 0; background: var(--pg-navy-100); }
.pg-sres-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pg-sres-main { flex: 1; min-width: 0; }
.pg-sres-title { font-size: 14px; font-weight: 600; color: var(--pg-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0; transition: color .15s; }
.pg-sres-item:hover .pg-sres-title { color: var(--pg-gold-800); }
.pg-sres-meta { font-size: 12px; color: var(--pg-muted); margin: 2px 0 0; }
.pg-sres-meta i { display: inline-block; width: 3px; height: 3px; border-radius: 50%; background: var(--pg-navy-300); vertical-align: middle; margin: 0 6px 2px; }
.pg-sres-price { font-size: 12.5px; font-weight: 700; color: var(--pg-navy-900); font-variant-numeric: tabular-nums; flex-shrink: 0; }
.pg-sres-foot { border-top: 1px solid var(--pg-hairline-soft); padding: 8px; }
.pg-sres-all { display: block; width: 100%; text-align: center; padding: 9px 0; font-family: var(--pg-font-sans); font-size: 13px; font-weight: 600; color: var(--pg-gold-800); background: transparent; border: 0; border-radius: 2px; cursor: pointer; transition: background .15s; }
.pg-sres-all:hover { background: var(--pg-gold-100); }

.pg-spin { width: 18px; height: 18px; color: var(--pg-gold-600); animation: pg-spin-rotate 1s linear infinite; }
.pg-spin-lg { width: 32px; height: 32px; }
@keyframes pg-spin-rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

.pg-tabbar { display: flex; align-items: center; gap: 10px; margin-bottom: 32px; }
.pg-tab { display: inline-flex; align-items: center; gap: 8px; padding: 11px 18px; font-family: var(--pg-font-sans); font-size: 13px; font-weight: 600; color: var(--pg-body); background: #fff; border: 1px solid var(--pg-hairline); border-radius: 2px; cursor: pointer; transition: all .15s; }
.pg-tab:hover { border-color: var(--pg-navy-900); color: var(--pg-navy-900); }
.pg-tab.pg-on { border-color: var(--pg-navy-900); color: var(--pg-navy-900); box-shadow: inset 0 0 0 1px var(--pg-navy-900); }
.pg-tab-count { font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--pg-muted); background: var(--pg-navy-50); border-radius: 2px; padding: 2px 7px; transition: all .15s; }
.pg-tab.pg-on .pg-tab-count { color: var(--pg-gold-800); background: var(--pg-gold-100); }

.pg-filterbar { display: flex; align-items: stretch; background: #fff; border: 1px solid var(--pg-hairline); border-radius: 3px; }
.pg-filterbar .pg-fcell { display: flex; flex-direction: column; justify-content: center; padding: 10px 18px; flex: 1; min-width: 0; }
.pg-filterbar .pg-fcell + .pg-fcell { border-left: 1px solid var(--pg-hairline-soft); }
.pg-filterbar label { font-size: 10px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--pg-muted); margin-bottom: 2px; }
.pg-filterbar select, .pg-filterbar input { border: 0; outline: 0; background: transparent; font-family: var(--pg-font-sans); font-size: 14px; font-weight: 500; color: var(--pg-ink); appearance: none; cursor: pointer; padding: 0; width: 100%; }
.pg-filterbar input[type="date"] { cursor: text; }
.pg-filterbar select { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%237d89a0' stroke-width='1.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 2px center; padding-right: 18px; }
.pg-fclear { display: inline-flex; align-items: center; align-self: center; gap: 6px; margin-left: 14px; font-size: 13px; font-weight: 600; color: var(--pg-navy-900); border-bottom: 1px solid var(--pg-gold-600); padding-bottom: 2px; white-space: nowrap; }
.pg-fclear:hover { color: var(--pg-gold-800); }

.pg-loadwrap { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 80px 0; }
.pg-loadnote { font-size: 13.5px; font-weight: 500; color: var(--pg-muted); }

.pg-empty { text-align: center; padding: 72px 24px 80px; }
.pg-empty h3 { font-family: var(--pg-font-display); font-weight: 500; font-size: clamp(24px, 3vw, 32px); line-height: 1.15; color: var(--pg-ink); margin: 10px 0 12px; }
.pg-empty h3 em { font-style: italic; color: var(--pg-gold-700); }
.pg-empty p { font-size: 14.5px; color: var(--pg-muted); max-width: 420px; margin: 0 auto 28px; line-height: 1.65; }

.pg-pager { display: flex; align-items: center; justify-content: center; gap: 28px; padding: 44px 0 8px; font-size: 13.5px; }
.pg-pager .pg-pager-status { color: var(--pg-muted); font-variant-numeric: tabular-nums; }
.pg-pager a { font-weight: 600; color: var(--pg-navy-900); border-bottom: 1px solid var(--pg-gold-600); padding-bottom: 2px; }
.pg-pager a:hover { color: var(--pg-gold-800); }
.pg-pager .pg-pager-off { font-weight: 600; color: var(--pg-navy-300); border-bottom: 1px solid var(--pg-hairline); padding-bottom: 2px; }

@media (max-width: 900px) {
    .pg-filterbar { flex-wrap: wrap; }
    .pg-filterbar .pg-fcell { flex: 1 1 45%; }
    .pg-filterbar .pg-fcell + .pg-fcell { border-left: 0; border-top: 1px solid var(--pg-hairline-soft); }
}

@media (max-width: 640px) {
    .pg-cs-wrap { padding: 36px 18px 64px; }
    .pg-cs-body { padding-top: 26px; }
    .pg-filterbar .pg-fcell { flex: 1 1 100%; }
    .pg-tabbar { flex-wrap: wrap; }
    .pg-pager { gap: 16px; flex-wrap: wrap; }
}

/* Heading italics for the state card and the centred page head,
   matching the gold italic voice the other surfaces already use.
   Added in release 2.0.0.9. */
.pg-state-card h2 em { font-style: italic; color: var(--pg-gold-700); }
.pg-page-head h1 em { font-style: italic; color: var(--pg-gold-700); }

/* Structural marker for the Curated Access content subtree. The
   design test suite extracts the element carrying this class to run
   its assertions scoped to the page content, away from the layout
   chrome, so the class must stay on the outer wrapper of the landing
   and buyer form even though it needs no visual rules of its own.
   Added in release 2.0.0.9. */
.pg-ca-shell { display: block; }

/* ------------------------------------------------------------------
   Image loading skeleton. Every content image carries a shimmering
   placeholder while it loads, and keeps a calm shimmer block if the
   file never arrives, so a missing cover can never show the browser's
   broken image glyph. A small script in the shared layout adds and
   removes the classes; the visuals live here for both breakpoints.
   ------------------------------------------------------------------ */
img.tb-skel {
    background-color: #e9ecf1;
    background-image: linear-gradient(100deg, rgba(233, 236, 241, 0) 36%, rgba(255, 255, 255, .85) 50%, rgba(233, 236, 241, 0) 64%);
    background-size: 200% 100%;
    background-repeat: no-repeat;
    animation: tb-skel-shimmer 1.4s ease-in-out infinite;
    color: transparent;
}
img.tb-skel-fail {
    animation-duration: 2.4s;
    object-fit: cover;
}
@keyframes tb-skel-shimmer {
    0% { background-position: 180% 0; }
    100% { background-position: -80% 0; }
}
@media (prefers-reduced-motion: reduce) {
    img.tb-skel { animation: none; }
}
