@charset "UTF-8";
/* ==========================================================================
   Bali Group Luxury Travel — design system
   --------------------------------------------------------------------------
   "Private Estate Folio": near-monochrome jade-black and ivory, champagne
   gold held back to accent scale only, hairline rules doing the work that
   card shadows usually do, and an asymmetric editorial grid with the chapter
   numerals living in the left gutter.

   Layout language follows labuanbajoliveaboard.com — full-bleed hero with a
   scroll cue, eyebrow kickers over every heading, numbered editorial rows,
   a categorised FAQ with pill navigation, generous vertical rhythm. The
   expression is deliberately tighter: 2–3px radii instead of 8–16px, no
   shadows at all, and one accent colour used sparingly.

   Order of business:
     1. Tokens
     2. Reset & base
     3. Typography
     4. Bands, containers, rules, reveal
     5. Buttons & chips
     6. Header, utility bar, nav, drawer
     7. Hero & page head
     8. Sections (answer, chapters, cards, tiers, steps, stats, compare,
        FAQ, directory, related, contact, checklist, CTA, trust)
     9. Home-only (finder, interest grid)
    10. Guides (blog), prose, search, 404
    11. Footer, network desk, floating controls
    12. Print
   ========================================================================== */

/* ── 1. Tokens ─────────────────────────────────────────────────────────── */

:root {
    color-scheme: light;

    /* Ground */
    --ink:          #0f1a16;
    --ink-2:        #16241e;
    --ink-3:        #1e3129;
    --jade:         #23473a;
    --ivory:        #faf8f3;
    --ivory-2:      #f3efe6;
    --paper:        #ffffff;

    /* Accent — champagne. Never a large fill; rules, numerals, hairlines. */
    --gold:         #c0a068;
    --gold-h:       #d4b881;
    --gold-d:       #a1854f;
    --gold-soft:    #e8dcc2;

    /* Text */
    --text:         #141d19;
    --text-soft:    #454f4a;
    --muted:        #7d867f;
    --on-ink:       #f2efe8;
    --on-ink-soft:  rgba(242, 239, 232, .72);
    --on-ink-mute:  rgba(242, 239, 232, .52);

    /* Lines */
    --border:       rgba(20, 29, 25, .12);
    --border-soft:  rgba(20, 29, 25, .07);
    --border-firm:  rgba(20, 29, 25, .20);
    --border-gold:  rgba(192, 160, 104, .34);
    --border-ink:   rgba(242, 239, 232, .14);

    /* Type */
    --font-display: "Playfair Display", "Iowan Old Style", Georgia, serif;
    --font-body:    "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;

    --fs-h1:    clamp(2.35rem, 1.35rem + 3.4vw, 4.15rem);
    --fs-h2:    clamp(1.72rem, 1.18rem + 1.7vw, 2.6rem);
    --fs-h3:    clamp(1.12rem, 1rem + .4vw, 1.32rem);
    --fs-lede:  clamp(1.04rem, .98rem + .34vw, 1.25rem);
    --fs-body:  1rem;
    --fs-sm:    .875rem;
    --fs-xs:    .78rem;

    /* Space */
    --gutter:   clamp(18px, 4vw, 40px);
    --wrap:     1220px;
    --wrap-tight: 900px;
    --band-y:   clamp(68px, 8.5vw, 132px);
    --band-y-sm: clamp(46px, 5.5vw, 76px);

    /* Shape — near-square is the point */
    --r-xs:     2px;
    --r-sm:     3px;
    --r:        4px;
    --r-pill:   999px;

    --ease:     cubic-bezier(.22, .78, .28, 1);
    --header-h: 74px;
}

/* ── 2. Reset & base ──────────────────────────────────────────────────── */

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

html {
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
}

body {
    margin: 0;
    background: var(--ivory);
    color: var(--text);
    font-family: var(--font-body);
    font-size: var(--fs-body);
    font-weight: 400;
    line-height: 1.68;
    letter-spacing: .002em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(192, 160, 104, .22);
}

img,
picture,
video,
svg { max-width: 100%; height: auto; display: block; }

a { color: inherit; text-decoration: none; }

button { font: inherit; color: inherit; }

/* One focus treatment, everywhere, and never removed without a replacement. */
:focus-visible {
    outline: 2px solid var(--gold-d);
    outline-offset: 3px;
    border-radius: var(--r-xs);
}

.bgl-band--ink :focus-visible,
.bgl-footer :focus-visible,
#bgl-drawer :focus-visible { outline-color: var(--gold-h); }

::selection {
    background: var(--gold-soft);
    color: var(--ink);
}

.skip-link {
    position: absolute;
    left: 50%;
    top: -60px;
    transform: translateX(-50%);
    z-index: 999;
    background: var(--ink);
    color: var(--on-ink);
    padding: 10px 20px;
    border-radius: 0 0 var(--r) var(--r);
    font-size: var(--fs-sm);
    font-weight: 500;
    transition: top .16s var(--ease);
}

.skip-link:focus { top: 0; }

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

/* Anchored headings must clear the sticky header. */
[id] { scroll-margin-top: calc(var(--header-h) + 28px); }

/* ── 3. Typography ────────────────────────────────────────────────────── */

.bgl-h1,
.bgl-h2,
.bgl-h3 {
    font-family: var(--font-display);
    font-weight: 500;
    color: var(--text);
    letter-spacing: -.012em;
    text-wrap: balance;
    margin: 0;
}

.bgl-h1 {
    font-size: var(--fs-h1);
    line-height: 1.04;
    letter-spacing: -.022em;
}

.bgl-h2 {
    font-size: var(--fs-h2);
    line-height: 1.14;
}

.bgl-h3 {
    font-size: var(--fs-h3);
    line-height: 1.32;
    letter-spacing: -.006em;
}

.bgl-h1 em,
.bgl-h2 em {
    font-style: italic;
    color: var(--gold-d);
    font-weight: 400;
}

.bgl-band--ink .bgl-h1,
.bgl-band--ink .bgl-h2,
.bgl-band--ink .bgl-h3,
.bgl-hero .bgl-h1,
.bgl-hero .bgl-h2,
.bgl-hero .bgl-h3 { color: var(--on-ink); }

.bgl-band--ink .bgl-h1 em,
.bgl-band--ink .bgl-h2 em,
.bgl-hero .bgl-h1 em,
.bgl-hero .bgl-h2 em { color: var(--gold-h); }

/* Eyebrow: the small caps kicker that opens every section. */
.bgl-eyebrow {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 16px;
    font-size: var(--fs-xs);
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--gold-d);
}

.bgl-eyebrow::before {
    content: "";
    width: 26px;
    height: 1px;
    flex: 0 0 26px;
    background: var(--gold);
}

.bgl-band--ink .bgl-eyebrow,
.bgl-hero .bgl-eyebrow { color: var(--gold-h); }

.bgl-band--ink .bgl-eyebrow::before,
.bgl-hero .bgl-eyebrow::before { background: var(--gold-h); }

.bgl-eyebrow--plain { letter-spacing: .12em; }
.bgl-eyebrow--plain::before { display: none; }

.bgl-eyebrow--center { justify-content: center; }

.bgl-lede {
    font-size: var(--fs-lede);
    line-height: 1.62;
    color: var(--text-soft);
    margin: 0;
    max-width: 62ch;
    text-wrap: pretty;
}

.bgl-intro {
    font-size: 1.02rem;
    line-height: 1.72;
    color: var(--text-soft);
    margin: 18px 0 0;
    max-width: 68ch;
    text-wrap: pretty;
}

.bgl-band--ink .bgl-lede,
.bgl-band--ink .bgl-intro,
.bgl-hero .bgl-lede,
.bgl-hero .bgl-intro { color: var(--on-ink-soft); }

.bgl-byline {
    margin: 18px 0 0;
    font-size: var(--fs-xs);
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--muted);
    font-weight: 500;
}

.bgl-heading-block { max-width: 70ch; }
.bgl-heading-block--center { max-width: 66ch; margin-inline: auto; text-align: center; }
.bgl-heading-block--center .bgl-eyebrow { justify-content: center; }
.bgl-heading-block--center .bgl-intro { margin-inline: auto; }
.bgl-heading-block .bgl-h2 { margin-bottom: 0; }

/* ── 4. Bands, containers, rules, reveal ──────────────────────────────── */

.bgl-container {
    width: 100%;
    max-width: var(--wrap);
    margin-inline: auto;
    padding-inline: var(--gutter);
    padding-left: max(var(--gutter), env(safe-area-inset-left));
    padding-right: max(var(--gutter), env(safe-area-inset-right));
}

.bgl-container--tight { max-width: var(--wrap-tight); }

.bgl-band {
    position: relative;
    padding-block: var(--band-y);
}

.bgl-band--paper  { background: var(--ivory); }
.bgl-band--ivory  { background: var(--ivory-2); }
.bgl-band--white  { background: var(--paper); }

.bgl-band--ink {
    background: var(--ink);
    color: var(--on-ink);
}

/* Grain: 1.5% of a still noise field, so the ink bands read as paper stock
   rather than flat fill. No repaint cost — it is a single inline SVG. */
.bgl-band--ink::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .5;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E");
}

.bgl-band > .bgl-container { position: relative; z-index: 1; }

/* Hairline that draws itself left-to-right when the section reveals.
   The signature motif; used to open a band and to separate stanzas. */
.bgl-rule {
    height: 1px;
    background: var(--border-gold);
    transform-origin: left center;
}

.bgl-js .bgl-rule {
    transform: scaleX(0);
    transition: transform .9s var(--ease);
}

.bgl-rule.is-in { transform: scaleX(1); }

.bgl-rule--short { width: 58px; }
.bgl-band--ink .bgl-rule { background: rgba(192, 160, 104, .5); }

.bgl-js .bgl-reveal {
    opacity: 0;
    transform: translateY(12px);
    transition: opacity .5s ease-out, transform .55s var(--ease);
    will-change: opacity, transform;
}

.bgl-js .bgl-reveal.is-in {
    opacity: 1;
    transform: none;
}

@media (prefers-reduced-motion: reduce) {
    .bgl-reveal,
    .bgl-rule {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}

.bgl-crumb {
    margin: 0 0 clamp(20px, 3vw, 34px);
    font-size: var(--fs-xs);
    letter-spacing: .04em;
    color: var(--muted);
}

.bgl-crumb ol {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.bgl-crumb a { color: var(--muted); border-bottom: 1px solid transparent; }
.bgl-crumb a:hover { color: var(--gold-d); border-bottom-color: var(--border-gold); }
.bgl-crumb [aria-current="page"] { color: var(--text-soft); }
.bgl-band--ink .bgl-crumb,
.bgl-band--ink .bgl-crumb a { color: var(--on-ink-mute); }
.bgl-band--ink .bgl-crumb [aria-current="page"] { color: var(--on-ink-soft); }

/* ── 5. Buttons & chips ───────────────────────────────────────────────── */

.bgl-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 14px 26px;
    border: 1px solid transparent;
    border-radius: var(--r-sm);
    font-size: var(--fs-sm);
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    cursor: pointer;
    text-align: center;
    transition: background-color .2s var(--ease), color .2s var(--ease),
                border-color .2s var(--ease), transform .2s var(--ease);
}

.bgl-btn i { font-size: 1.05em; }
.bgl-btn:hover { transform: translateY(-1px); }
.bgl-btn:active { transform: translateY(0); }

.bgl-btn--gold {
    background: var(--gold);
    color: var(--ink);
    border-color: var(--gold);
}

.bgl-btn--gold:hover {
    background: var(--gold-h);
    border-color: var(--gold-h);
}

.bgl-btn--ink {
    background: var(--ink);
    color: var(--on-ink);
    border-color: var(--ink);
}

.bgl-btn--ink:hover { background: var(--ink-3); border-color: var(--ink-3); }

.bgl-btn--outline {
    background: transparent;
    border-color: var(--border-firm);
    color: var(--text);
}

.bgl-btn--outline:hover {
    border-color: var(--gold-d);
    color: var(--gold-d);
}

.bgl-btn--on-ink {
    border-color: var(--border-ink);
    color: var(--on-ink);
}

.bgl-btn--on-ink:hover {
    border-color: var(--gold-h);
    color: var(--gold-h);
    background: rgba(192, 160, 104, .08);
}

.bgl-btn--ghost {
    padding: 8px 0;
    border: 0;
    border-bottom: 1px solid var(--border-gold);
    border-radius: 0;
    color: var(--gold-d);
    background: none;
}

.bgl-btn--ghost:hover {
    border-bottom-color: var(--gold-d);
    color: var(--ink);
    transform: none;
}

.bgl-btn--sm {
    padding: 10px 18px;
    font-size: var(--fs-xs);
}

.bgl-cta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: clamp(26px, 3.4vw, 40px);
}

.bgl-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    border: 1px solid var(--border);
    border-radius: var(--r-pill);
    background: var(--paper);
    font-size: var(--fs-xs);
    font-weight: 500;
    letter-spacing: .04em;
    color: var(--text-soft);
    transition: border-color .2s var(--ease), color .2s var(--ease),
                background-color .2s var(--ease);
}

.bgl-chip:hover {
    border-color: var(--gold);
    color: var(--ink);
}

.bgl-chip i { color: var(--gold-d); }

/* ── 6. Header, utility bar, nav, drawer ──────────────────────────────── */

.bgl-util {
    background: var(--ink);
    color: var(--on-ink-soft);
    font-size: var(--fs-xs);
    letter-spacing: .03em;
    border-bottom: 1px solid var(--border-ink);
}

.bgl-util__inner {
    max-width: var(--wrap);
    margin-inline: auto;
    padding: 9px var(--gutter);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 22px;
}

.bgl-util__group {
    display: flex;
    align-items: center;
    gap: 8px 20px;
    flex-wrap: wrap;
    min-width: 0;
}

.bgl-util span,
.bgl-util a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

.bgl-util i { color: var(--gold); font-size: .95rem; }
.bgl-util a { transition: color .18s var(--ease); }
.bgl-util a:hover { color: var(--gold-h); }

#bgl-header {
    position: sticky;
    top: 0;
    z-index: 60;
    background: rgba(250, 248, 243, .92);
    backdrop-filter: saturate(150%) blur(10px);
    border-bottom: 1px solid var(--border-soft);
    transition: box-shadow .25s var(--ease), background-color .25s var(--ease);
}

body.bgl-scrolled #bgl-header {
    background: rgba(250, 248, 243, .97);
    box-shadow: 0 1px 0 var(--border);
}

.bgl-header__inner {
    max-width: var(--wrap);
    margin-inline: auto;
    padding: 0 var(--gutter);
    min-height: var(--header-h);
    display: flex;
    align-items: center;
    gap: clamp(10px, 3vw, 36px);
}

.bgl-header__inner > a:first-child { flex: 0 0 auto; }
.bgl-nav-primary { min-width: 0; }

.bgl-header__actions {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
}

/* Below the desktop nav breakpoint the drawer carries the same CTA, so the
   bar only needs the icon. The accessible name lives on the link. */
@media (max-width: 719px) {
    .bgl-header__actions .bgl-btn { padding-inline: 13px; }
    .bgl-header__actions .bgl-btn .bgl-btn__label { display: none; }
}

@media (max-width: 400px) {
    .bgl-wordmark__text { font-size: .94rem; }
    .bgl-wordmark__monogram { width: 30px; height: 30px; flex-basis: 30px; font-size: .74rem; }
}

/* Wordmark */
.bgl-wordmark {
    display: inline-flex;
    align-items: center;
    gap: 11px;
}

.bgl-wordmark__monogram {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border: 1px solid var(--border-gold);
    border-radius: var(--r-xs);
    font-family: var(--font-display);
    font-size: .82rem;
    font-weight: 600;
    letter-spacing: .02em;
    color: var(--gold-d);
}

.bgl-wordmark__text {
    display: flex;
    flex-direction: column;
    font-family: var(--font-display);
    font-size: 1.04rem;
    font-weight: 600;
    line-height: 1.08;
    letter-spacing: -.01em;
    color: var(--text);
}

.bgl-wordmark__text em {
    font-style: normal;
    font-family: var(--font-body);
    font-size: .58rem;
    font-weight: 500;
    letter-spacing: .3em;
    text-transform: uppercase;
    color: var(--muted);
    margin-top: 3px;
}

.bgl-wordmark--lg .bgl-wordmark__monogram { width: 42px; height: 42px; flex-basis: 42px; font-size: 1rem; }
.bgl-wordmark--lg .bgl-wordmark__text { font-size: 1.24rem; }

.bgl-wordmark--light .bgl-wordmark__text { color: var(--on-ink); }
.bgl-wordmark--light .bgl-wordmark__text em { color: var(--on-ink-mute); }
.bgl-wordmark--light .bgl-wordmark__monogram { color: var(--gold-h); border-color: rgba(192, 160, 104, .45); }

.bgl-logo-img { width: auto; height: 42px; }
/* Footer and mobile panel sit on ink: flatten the logo to pure white unless a
   dedicated dark-background logo was uploaded. */
.bgl-logo-img--invert { filter: brightness(0) invert(1); }

/* Desktop nav */
.bgl-nav-primary { display: none; }

.bgl-nav {
    display: flex;
    align-items: center;
    gap: clamp(8px, 1.3vw, 22px);
    margin: 0;
    padding: 0;
    list-style: none;
}

.bgl-nav > li,
.bgl-nav__item { position: relative; }

.bgl-nav > li > a,
.bgl-nav__item > a {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 10px 2px;
    font-size: var(--fs-sm);
    font-weight: 500;
    letter-spacing: .02em;
    color: var(--text-soft);
    white-space: nowrap;
    border-bottom: 1px solid transparent;
    transition: color .18s var(--ease), border-color .18s var(--ease);
}

.bgl-nav__item > a i { font-size: .82rem; opacity: .6; }

/* wp_nav_menu has no place to put an icon, so the dropdown cue is drawn. */
.bgl-nav > .menu-item-has-children > a::after {
    content: "";
    width: 6px;
    height: 6px;
    margin-left: 2px;
    border-right: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
    transform: translateY(-2px) rotate(45deg);
    opacity: .55;
}

.bgl-nav > li > a:hover,
.bgl-nav > li:focus-within > a,
.bgl-nav > li:hover > a,
.bgl-nav__item > a:hover,
.bgl-nav__item:focus-within > a,
.bgl-nav > .current-menu-item > a,
.bgl-nav > .current_page_item > a,
.bgl-nav > .current-menu-ancestor > a {
    color: var(--ink);
    border-bottom-color: var(--gold);
}

/* A child page should not underline every ancestor in the submenu as well. */
.bgl-nav .sub-menu .current-menu-item > a { color: var(--ink); background: var(--ivory-2); }

.bgl-nav__drop,
.bgl-nav .sub-menu {
    position: absolute;
    top: 100%;
    left: -18px;
    z-index: 5;
    min-width: 272px;
    max-width: min(340px, calc(100vw - 2 * var(--gutter)));
    margin: 0;
    padding: 10px;
    list-style: none;
    background: var(--paper);
    border: 1px solid var(--border);
    border-radius: var(--r);
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity .18s var(--ease), transform .18s var(--ease), visibility .18s;
}

/* An item near the right edge opens its panel leftward instead of pushing it
   off screen. The class is set in assets/js/app.js, which measures. */
.bgl-nav > li.bgl-nav--flip > .bgl-nav__drop,
.bgl-nav > li.bgl-nav--flip > .sub-menu {
    left: auto;
    right: -18px;
}

/* The item's own box stops at the link, leaving a dead gap above the panel
   where a diagonal mouse path would close the menu. This bridges it. */
.bgl-nav > li.menu-item-has-children::after,
.bgl-nav__item--has-children::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 14px;
}

.bgl-nav__item:hover > .bgl-nav__drop,
.bgl-nav__item:focus-within > .bgl-nav__drop,
.bgl-nav li:hover > .sub-menu,
.bgl-nav li:focus-within > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: none;
}

.bgl-nav__drop a,
.bgl-nav .sub-menu a {
    display: block;
    padding: 10px 14px;
    border-radius: var(--r-xs);
    font-size: var(--fs-sm);
    line-height: 1.45;
    color: var(--text-soft);
    white-space: normal;
    text-wrap: pretty;
    transition: background-color .16s var(--ease), color .16s var(--ease);
}

.bgl-nav__drop a:hover,
.bgl-nav .sub-menu a:hover {
    background: var(--ivory-2);
    color: var(--ink);
}

.bgl-burger {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid var(--border);
    border-radius: var(--r-sm);
    background: transparent;
    cursor: pointer;
    font-size: 1.24rem;
    transition: border-color .18s var(--ease), background-color .18s var(--ease);
}

.bgl-burger:hover { border-color: var(--gold); background: var(--paper); }

@media (min-width: 1060px) {
    .bgl-nav-primary { display: block; }
    .bgl-burger { display: none; }
}

/* Drawer */
#bgl-drawer {
    position: fixed;
    inset: 0;
    z-index: 90;
    visibility: hidden;
    pointer-events: none;
    overflow: hidden;
}

#bgl-drawer.is-open {
    visibility: visible;
    pointer-events: auto;
}

.bgl-drawer__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 26, 22, .52);
    opacity: 0;
    transition: opacity .3s var(--ease);
}

#bgl-drawer.is-open .bgl-drawer__backdrop { opacity: 1; }

.bgl-drawer__panel {
    position: absolute;
    inset-block: 0;
    right: 0;
    width: min(400px, 92vw);
    background: var(--ink);
    color: var(--on-ink);
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 22px 22px calc(26px + env(safe-area-inset-bottom));
    transform: translateX(100%);
    transition: transform .34s var(--ease);
}

#bgl-drawer.is-open .bgl-drawer__panel { transform: none; }

@media (prefers-reduced-motion: reduce) {
    .bgl-drawer__panel,
    .bgl-drawer__backdrop { transition: none; }
}

.bgl-drawer__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--border-ink);
}

.bgl-drawer__close {
    display: inline-grid;
    place-items: center;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border: 1px solid var(--border-ink);
    border-radius: var(--r-sm);
    background: transparent;
    color: var(--on-ink);
    cursor: pointer;
    font-size: 1.2rem;
    transition: border-color .18s var(--ease), color .18s var(--ease);
}

.bgl-drawer__close:hover { border-color: var(--gold-h); color: var(--gold-h); }

.bgl-mnav {
    padding: 18px 0;
    display: flex;
    flex-direction: column;
}

/* wp_nav_menu output inside the drawer: one item per row, never a flex row. */
.bgl-mnav__list {
    display: block;
    margin: 0;
    padding: 0;
    list-style: none;
}

.bgl-mnav__list > li { border-bottom: 1px solid var(--border-ink); }
.bgl-mnav__list > li:last-child { border-bottom: 0; }

.bgl-mnav__list .sub-menu {
    display: block;
    margin: 0;
    padding: 0 0 8px 14px;
    list-style: none;
    border-left: 1px solid var(--border-ink);
    border-bottom: 0;
}

.bgl-mnav__list .sub-menu li { border-bottom: 0; }
.bgl-mnav__list .sub-menu a { font-size: .9rem; padding: 8px 0; }

.bgl-mnav ul {
    margin: 0;
    padding: 4px 0 10px 14px;
    list-style: none;
    border-left: 1px solid var(--border-ink);
}

.bgl-mnav a,
.bgl-mnav__link {
    display: block;
    padding: 11px 0;
    font-size: .96rem;
    color: var(--on-ink-soft);
    transition: color .16s var(--ease);
}

.bgl-mnav a:hover { color: var(--gold-h); }

.bgl-mnav__group > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 13px 0;
    font-size: .96rem;
    font-weight: 500;
    color: var(--on-ink);
    cursor: pointer;
    list-style: none;
    border-bottom: 1px solid var(--border-ink);
}

.bgl-mnav__group > summary::-webkit-details-marker { display: none; }
.bgl-mnav__group > summary i { color: var(--gold); transition: transform .22s var(--ease); }
.bgl-mnav__group[open] > summary i { transform: rotate(45deg); }

.bgl-drawer__foot { margin-top: auto; padding-top: 18px; }
.bgl-drawer__foot .bgl-btn { width: 100%; }

/* Scroll progress hairline, top of viewport. */
.bgl-progress {
    position: fixed;
    top: 0;
    left: 0;
    height: 2px;
    width: 0;
    z-index: 100;
    background: var(--gold);
    pointer-events: none;
    transition: width .1s linear;
}

@media (prefers-reduced-motion: reduce) {
    .bgl-progress { transition: none; }
}

/* ── 7. Hero & page head ──────────────────────────────────────────────── */

.bgl-hero {
    position: relative;
    background: var(--ink);
    color: var(--on-ink);
    overflow: hidden;
    padding-block: clamp(62px, 8vw, 104px) clamp(48px, 6vw, 84px);
}

.bgl-hero__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.bgl-hero__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 42%;
}

.bgl-hero__scrim {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(105deg, rgba(15, 26, 22, .97) 0%, rgba(15, 26, 22, .90) 44%, rgba(15, 26, 22, .66) 100%),
        linear-gradient(to top, rgba(15, 26, 22, .92) 0%, rgba(15, 26, 22, .30) 62%);
}

.bgl-hero > .bgl-container { position: relative; z-index: 2; }

.bgl-hero__grid {
    display: grid;
    gap: clamp(34px, 5vw, 64px);
}

.bgl-hero__title { margin: 0 0 22px; max-width: 20ch; }
.bgl-hero__lede { max-width: 54ch; }

.bgl-hero__facts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    margin-top: clamp(34px, 4.6vw, 54px);
    background: var(--border-ink);
    border: 1px solid var(--border-ink);
    border-radius: var(--r-sm);
    overflow: hidden;
}

.bgl-hero__fact {
    padding: 18px 20px;
    background: rgba(15, 26, 22, .52);
    backdrop-filter: blur(2px);
}

.bgl-hero__fact-value {
    font-family: var(--font-display);
    text-wrap: balance;
    font-size: clamp(1.2rem, 1rem + .58vw, 1.54rem);
    font-weight: 500;
    line-height: 1.1;
    color: var(--gold-h);
    font-variant-numeric: tabular-nums;
}

.bgl-hero__fact-label {
    display: block;
    margin-top: 6px;
    font-size: var(--fs-xs);
    line-height: 1.45;
    color: var(--on-ink-mute);
    text-wrap: pretty;
}

/* The "folio card" that replaces stock photography on inner pages. */
.bgl-folio {
    position: relative;
    align-self: start;
    padding: clamp(26px, 3.4vw, 40px);
    border: 1px solid var(--border-ink);
    border-radius: var(--r);
    background: rgba(22, 36, 30, .58);
}

.bgl-folio__seal {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border: 1px solid var(--border-gold);
    border-radius: 50%;
    color: var(--gold-h);
    font-size: 1.3rem;
    margin-bottom: 20px;
}

.bgl-folio__title {
    font-family: var(--font-display);
    font-size: 1.28rem;
    font-weight: 500;
    line-height: 1.26;
    margin: 0 0 18px;
    color: var(--on-ink);
}

.bgl-folio__title em { font-style: italic; color: var(--gold-h); }

.bgl-folio dl { margin: 18px 0 0; }

.bgl-folio__row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 16px;
    padding: 11px 0;
    border-top: 1px solid var(--border-ink);
    font-size: var(--fs-sm);
}

.bgl-folio__row dt { color: var(--on-ink-mute); margin: 0; }

.bgl-folio__row dd {
    margin: 0;
    text-align: right;
    color: var(--on-ink);
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}

.bgl-folio__stamp {
    margin-top: 22px;
    padding-top: 16px;
    border-top: 1px solid var(--border-ink);
    font-size: var(--fs-xs);
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--on-ink-mute);
}

/* Scroll cue */
.bgl-hero__cue {
    display: none;
    margin-top: clamp(38px, 5vw, 62px);
    align-items: center;
    gap: 12px;
    font-size: var(--fs-xs);
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--on-ink-mute);
}

.bgl-hero__cue-line {
    display: block;
    width: 1px;
    height: 46px;
    background: linear-gradient(to bottom, var(--gold) 0%, rgba(192, 160, 104, 0) 100%);
    animation: bgl-cue 2.4s var(--ease) infinite;
    transform-origin: top center;
}

@keyframes bgl-cue {
    0%, 100% { transform: scaleY(.45); opacity: .45; }
    50%      { transform: scaleY(1);   opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .bgl-hero__cue-line { animation: none; transform: none; }
}

@media (min-width: 900px) {
    .bgl-hero__grid { grid-template-columns: minmax(0, 1.28fr) minmax(0, .82fr); align-items: center; }
    .bgl-hero__facts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .bgl-hero__cue { display: flex; }
}

/* Inner-page head: centred, hairline-framed, no photography needed. */
.bgl-phead {
    background: var(--ink);
    color: var(--on-ink);
    position: relative;
    overflow: hidden;
    padding-block: clamp(50px, 6.4vw, 92px) clamp(44px, 5.4vw, 78px);
}

.bgl-phead::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .5;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E");
}

.bgl-phead > .bgl-container { position: relative; z-index: 1; }

.bgl-phead__inner { max-width: 78ch; }
.bgl-phead .bgl-h1 { color: var(--on-ink); margin-bottom: 20px; }
.bgl-phead .bgl-h1 em { color: var(--gold-h); }
.bgl-phead .bgl-lede { color: var(--on-ink-soft); }
.bgl-phead .bgl-crumb,
.bgl-phead .bgl-crumb a { color: var(--on-ink-mute); }
.bgl-phead .bgl-byline { color: var(--on-ink-mute); }

.bgl-phead__facts {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 28px;
    margin-top: clamp(26px, 3.2vw, 38px);
    padding-top: 22px;
    border-top: 1px solid var(--border-ink);
}

.bgl-phead__fact {
    display: flex;
    align-items: baseline;
    gap: 9px;
    font-size: var(--fs-sm);
    color: var(--on-ink-mute);
}

.bgl-phead__fact strong {
    font-family: var(--font-display);
    font-size: 1.04rem;
    font-weight: 500;
    color: var(--gold-h);
    font-variant-numeric: tabular-nums;
}

/* ── 8. Sections ──────────────────────────────────────────────────────── */

/* 8.1 Answer — the "In short:" block the source site leads every page with.
   A single champagne rule on the inline-start edge; nothing else. */
.bgl-answer {
    display: grid;
    gap: clamp(28px, 4vw, 52px);
}

.bgl-answer__body {
    border-inline-start: 2px solid var(--gold);
    padding-inline-start: clamp(20px, 2.6vw, 34px);
}

.bgl-answer__text {
    font-family: var(--font-display);
    font-size: clamp(1.14rem, 1rem + .68vw, 1.56rem);
    font-weight: 400;
    line-height: 1.46;
    color: var(--text);
    margin: 0;
    text-wrap: pretty;
}

.bgl-answer__text b,
.bgl-answer__text strong {
    font-weight: 600;
    font-style: italic;
    color: var(--gold-d);
}

.bgl-band--ink .bgl-answer__text { color: var(--on-ink); }

.bgl-answer__points {
    display: grid;
    gap: 1px;
    align-self: start;
    background: var(--border-soft);
    border: 1px solid var(--border-soft);
    border-radius: var(--r-sm);
    overflow: hidden;
}

.bgl-answer__point {
    display: flex;
    gap: 12px;
    padding: 15px 18px;
    background: var(--paper);
    font-size: var(--fs-sm);
    line-height: 1.55;
    color: var(--text-soft);
}

.bgl-answer__point i { color: var(--gold-d); font-size: .7rem; margin-top: .45em; flex: 0 0 auto; }

.bgl-band--ink .bgl-answer__point { background: var(--ink-2); color: var(--on-ink-soft); }
.bgl-band--ink .bgl-answer__points { background: var(--border-ink); border-color: var(--border-ink); }

.bgl-answer--solo { max-width: 74ch; }

@media (min-width: 900px) {
    .bgl-answer { grid-template-columns: minmax(0, 1.18fr) minmax(0, .82fr); align-items: start; }
    .bgl-answer--solo { grid-template-columns: minmax(0, 1fr); }
}

/* 8.2 Chapters — the long-form workhorse. Numerals in the left gutter, a
   sticky contents rail on desktop, one hairline between stanzas. */
.bgl-chapters { display: grid; gap: clamp(36px, 4.5vw, 60px); }

.bgl-chapters__rail { display: none; }

.bgl-chapters__rail-inner {
    position: sticky;
    top: calc(var(--header-h) + 34px);
}

.bgl-chapters__rail-title {
    font-size: var(--fs-xs);
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--muted);
    margin: 0 0 16px;
}

.bgl-chapters__rail ol {
    margin: 0;
    padding: 0;
    list-style: none;
    border-inline-start: 1px solid var(--border);
    counter-reset: bgl-toc;
}

.bgl-chapters__rail li { counter-increment: bgl-toc; }

.bgl-chapters__rail a {
    display: flex;
    gap: 10px;
    padding: 9px 0 9px 15px;
    margin-inline-start: -1px;
    border-inline-start: 1px solid transparent;
    font-size: var(--fs-sm);
    line-height: 1.4;
    color: var(--muted);
    transition: color .2s var(--ease), border-color .2s var(--ease);
}

.bgl-chapters__rail a::before {
    content: counter(bgl-toc, decimal-leading-zero);
    font-family: var(--font-display);
    font-size: .74rem;
    color: var(--gold-d);
    opacity: .7;
    flex: 0 0 auto;
    font-variant-numeric: tabular-nums;
}

.bgl-chapters__rail a:hover,
.bgl-chapters__rail a.is-active {
    color: var(--ink);
    border-inline-start-color: var(--gold);
}

.bgl-chapters__rail a.is-active::before { opacity: 1; }

.bgl-chapter {
    padding-top: clamp(30px, 3.6vw, 46px);
    border-top: 1px solid var(--border-soft);
}

.bgl-chapter:first-child { padding-top: 0; border-top: 0; }

.bgl-chapter__head {
    display: flex;
    align-items: baseline;
    gap: clamp(14px, 2vw, 24px);
    margin-bottom: 16px;
}

.bgl-chapter__num {
    font-family: var(--font-display);
    font-style: italic;
    font-size: clamp(1.1rem, .95rem + .5vw, 1.4rem);
    font-weight: 400;
    line-height: 1;
    color: var(--gold);
    flex: 0 0 auto;
    padding-top: .12em;
    font-variant-numeric: tabular-nums;
}

.bgl-chapter__body { max-width: 72ch; }

.bgl-chapter__body p {
    margin: 0 0 1.05em;
    color: var(--text-soft);
    line-height: 1.78;
    text-wrap: pretty;
}

.bgl-chapter__body p:last-child { margin-bottom: 0; }

/* First chapter opens with a drop cap — one typographic flourish, once. */
.bgl-chapter--lead .bgl-chapter__body > p:first-of-type::first-letter {
    float: inline-start;
    font-family: var(--font-display);
    font-size: 3.5em;
    line-height: .82;
    font-weight: 500;
    color: var(--ink);
    margin: .06em .1em 0 0;
}

.bgl-chapter__list {
    margin: 20px 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 10px;
}

.bgl-chapter__list li {
    display: flex;
    gap: 11px;
    font-size: var(--fs-sm);
    line-height: 1.6;
    color: var(--text-soft);
}

.bgl-chapter__list i { color: var(--gold-d); font-size: .95rem; margin-top: .22em; flex: 0 0 auto; }

@media (min-width: 1040px) {
    .bgl-chapters { grid-template-columns: minmax(0, 252px) minmax(0, 1fr); gap: clamp(40px, 5vw, 76px); }
    .bgl-chapters__rail { display: block; }
}

/* 8.3 Cards — hairline grid, no shadow, numeral in the corner. */
.bgl-cards {
    display: grid;
    gap: 1px;
    margin-top: clamp(34px, 4.4vw, 52px);
    background: var(--border-soft);
    border: 1px solid var(--border-soft);
    border-radius: var(--r);
    overflow: hidden;
    counter-reset: bgl-card;
}

.bgl-card {
    counter-increment: bgl-card;
    position: relative;
    padding: clamp(24px, 2.8vw, 34px);
    background: var(--paper);
    transition: background-color .25s var(--ease);
}

.bgl-card:hover { background: var(--ivory); }

.bgl-card__index {
    font-family: var(--font-display);
    font-style: italic;
    font-size: .92rem;
    color: var(--gold);
    letter-spacing: .04em;
    font-variant-numeric: tabular-nums;
}

.bgl-card__index::before { content: counter(bgl-card, decimal-leading-zero); }

.bgl-card__icon {
    margin: 16px 0 14px;
    font-size: 1.5rem;
    color: var(--gold-d);
    line-height: 1;
}

.bgl-card__title {
    font-family: var(--font-display);
    font-size: 1.14rem;
    font-weight: 500;
    line-height: 1.3;
    margin: 0 0 10px;
    color: var(--text);
    text-wrap: balance;
}

.bgl-card__text {
    margin: 0;
    font-size: var(--fs-sm);
    line-height: 1.68;
    color: var(--text-soft);
    text-wrap: pretty;
}

.bgl-band--ink .bgl-cards { background: var(--border-ink); border-color: var(--border-ink); }
.bgl-band--ink .bgl-card { background: var(--ink-2); }
.bgl-band--ink .bgl-card:hover { background: var(--ink-3); }
.bgl-band--ink .bgl-card__title { color: var(--on-ink); }
.bgl-band--ink .bgl-card__text { color: var(--on-ink-soft); }

@media (min-width: 640px)  { .bgl-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .bgl-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .bgl-cards--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .bgl-cards--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* 8.4 Tiers — the price ledger. */
.bgl-tiers {
    margin-top: clamp(34px, 4.4vw, 52px);
    border: 1px solid var(--border);
    border-radius: var(--r);
    overflow: hidden;
}

.bgl-tier {
    display: grid;
    gap: 6px 26px;
    padding: clamp(20px, 2.4vw, 28px) clamp(20px, 2.6vw, 32px);
    background: var(--paper);
    border-top: 1px solid var(--border-soft);
    transition: background-color .22s var(--ease);
}

.bgl-tier:first-child { border-top: 0; }
.bgl-tier:hover { background: var(--ivory); }

.bgl-tier__name {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 9px;
    font-family: var(--font-display);
    font-size: 1.1rem;
    font-weight: 500;
    color: var(--text);
    min-width: 0;
}

.bgl-tier__tag {
    padding: 3px 9px;
    border: 1px solid var(--border-gold);
    border-radius: var(--r-pill);
    font-family: var(--font-body);
    font-size: .66rem;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--gold-d);
}

.bgl-tier__price {
    font-family: var(--font-display);
    font-size: 1.16rem;
    font-weight: 500;
    color: var(--ink);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.bgl-tier__price small {
    display: block;
    font-family: var(--font-body);
    font-size: var(--fs-xs);
    font-weight: 400;
    letter-spacing: .04em;
    color: var(--muted);
    margin-top: 3px;
    white-space: normal;
}

.bgl-tier__text {
    grid-column: 1 / -1;
    margin: 0;
    font-size: var(--fs-sm);
    line-height: 1.66;
    color: var(--text-soft);
    max-width: 78ch;
    text-wrap: pretty;
}

.bgl-tier__link { grid-column: 1 / -1; }

.bgl-tiers__note,
.bgl-steps__note,
.bgl-compare__note {
    margin: 20px 0 0;
    font-size: var(--fs-xs);
    line-height: 1.66;
    color: var(--muted);
    max-width: 80ch;
    text-wrap: pretty;
}

@media (min-width: 760px) {
    .bgl-tier { grid-template-columns: minmax(0, 1.4fr) auto; align-items: baseline; }
    .bgl-tier__price { text-align: right; }
}

/* 8.5 Steps — vertical timeline on a champagne rail. */
.bgl-steps {
    margin-top: clamp(34px, 4.4vw, 52px);
    padding-inline-start: 34px;
    border-inline-start: 1px solid var(--border);
    counter-reset: bgl-step;
}

.bgl-step {
    counter-increment: bgl-step;
    position: relative;
    padding-bottom: clamp(28px, 3.4vw, 42px);
}

.bgl-step:last-child { padding-bottom: 0; }

.bgl-step::before {
    content: counter(bgl-step, decimal-leading-zero);
    position: absolute;
    inset-inline-start: -34px;
    top: 0;
    transform: translateX(-50%);
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--border-gold);
    border-radius: 50%;
    background: var(--ivory);
    font-family: var(--font-display);
    font-size: .76rem;
    color: var(--gold-d);
    font-variant-numeric: tabular-nums;
}

.bgl-band--ivory .bgl-step::before { background: var(--ivory-2); }
.bgl-band--ink   .bgl-step::before { background: var(--ink); color: var(--gold-h); }

.bgl-step__when {
    display: inline-block;
    margin-bottom: 8px;
    font-size: var(--fs-xs);
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--gold-d);
}

.bgl-step__title {
    font-family: var(--font-display);
    font-size: 1.18rem;
    font-weight: 500;
    line-height: 1.3;
    margin: 0 0 9px;
    color: var(--text);
}

.bgl-step__text {
    margin: 0;
    font-size: var(--fs-sm);
    line-height: 1.7;
    color: var(--text-soft);
    max-width: 68ch;
    text-wrap: pretty;
}

.bgl-band--ink .bgl-step__title { color: var(--on-ink); }
.bgl-band--ink .bgl-step__text { color: var(--on-ink-soft); }

/* 8.6 Stats — one figure per row, manuscript style. */
.bgl-stats { margin-top: clamp(30px, 4vw, 48px); }

.bgl-stat {
    display: grid;
    gap: 4px 30px;
    padding: clamp(18px, 2.2vw, 26px) 0;
    border-top: 1px solid var(--border-soft);
}

.bgl-stat:last-child { border-bottom: 1px solid var(--border-soft); }

.bgl-stat__value {
    font-family: var(--font-display);
    font-size: clamp(1.7rem, 1.2rem + 1.7vw, 2.75rem);
    font-weight: 500;
    line-height: 1;
    color: var(--ink);
    letter-spacing: -.018em;
    font-variant-numeric: tabular-nums;
}

.bgl-stat__label {
    font-size: var(--fs-sm);
    line-height: 1.6;
    color: var(--text-soft);
    max-width: 58ch;
    text-wrap: pretty;
}

.bgl-band--ink .bgl-stat__value { color: var(--gold-h); }
.bgl-band--ink .bgl-stat__label { color: var(--on-ink-soft); }
.bgl-band--ink .bgl-stat { border-color: var(--border-ink); }
.bgl-band--ink .bgl-stat:last-child { border-bottom-color: var(--border-ink); }

@media (min-width: 720px) {
    .bgl-stat { grid-template-columns: minmax(0, 260px) minmax(0, 1fr); align-items: baseline; }
}

/* 8.7 Compare */
.bgl-compare {
    margin-top: clamp(34px, 4.4vw, 52px);
    overflow-x: auto;
    overscroll-behavior-x: contain;
    border: 1px solid var(--border);
    border-radius: var(--r);
    background: var(--paper);
}

.bgl-compare table {
    width: 100%;
    min-width: 620px;
    border-collapse: collapse;
    font-size: var(--fs-sm);
}

.bgl-compare th,
.bgl-compare td {
    padding: 15px 20px;
    text-align: left;
    border-bottom: 1px solid var(--border-soft);
    vertical-align: top;
    line-height: 1.6;
}

.bgl-compare thead th {
    background: var(--ivory-2);
    font-family: var(--font-body);
    font-size: var(--fs-xs);
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--text);
    white-space: nowrap;
}

.bgl-compare tbody tr:last-child th,
.bgl-compare tbody tr:last-child td { border-bottom: 0; }

.bgl-compare tbody th {
    font-weight: 500;
    color: var(--text);
    width: 30%;
}

.bgl-compare td { color: var(--text-soft); }
.bgl-compare .bgl-compare--good { color: var(--ink); font-weight: 500; }

/* 8.8 FAQ — flat accordion */
.bgl-faq {
    margin-top: clamp(30px, 4vw, 46px);
    border-top: 1px solid var(--border-soft);
}

.bgl-faq__item { border-bottom: 1px solid var(--border-soft); }

.bgl-faq__q {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding: 19px 0;
    cursor: pointer;
    list-style: none;
    font-family: var(--font-display);
    font-size: 1.06rem;
    font-weight: 500;
    line-height: 1.42;
    color: var(--text);
    transition: color .18s var(--ease);
}

.bgl-faq__q::-webkit-details-marker { display: none; }
.bgl-faq__q:hover { color: var(--gold-d); }

.bgl-faq__q i {
    flex: 0 0 auto;
    margin-top: .18em;
    font-size: .98rem;
    color: var(--gold-d);
    transition: transform .24s var(--ease);
}

.bgl-faq__item[open] .bgl-faq__q i { transform: rotate(45deg); }

.bgl-faq__a {
    padding: 0 clamp(0px, 4vw, 44px) 22px 0;
    margin: 0;
    font-size: var(--fs-sm);
    line-height: 1.75;
    color: var(--text-soft);
    max-width: 84ch;
    text-wrap: pretty;
}

.bgl-band--ink .bgl-faq,
.bgl-band--ink .bgl-faq__item { border-color: var(--border-ink); }
.bgl-band--ink .bgl-faq__q { color: var(--on-ink); }
.bgl-band--ink .bgl-faq__a { color: var(--on-ink-soft); }

/* 8.9 FAQ hub — pill category nav + one panel per category */
.bgl-faqc { margin-top: clamp(30px, 4vw, 46px); }

.bgl-faqc__nav {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    padding-bottom: clamp(24px, 3vw, 36px);
    margin-bottom: clamp(8px, 1.6vw, 18px);
    border-bottom: 1px solid var(--border-soft);
}

.bgl-faqc__pill {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 10px 17px;
    border: 1px solid var(--border);
    border-radius: var(--r-pill);
    background: var(--paper);
    font-size: var(--fs-xs);
    font-weight: 500;
    letter-spacing: .03em;
    color: var(--text-soft);
    transition: border-color .2s var(--ease), color .2s var(--ease),
                background-color .2s var(--ease);
}

.bgl-faqc__pill i { color: var(--gold-d); font-size: .98rem; }

.bgl-faqc__pill:hover {
    border-color: var(--gold);
    color: var(--ink);
}

.bgl-faqc__pill.is-active {
    background: var(--ink);
    border-color: var(--ink);
    color: var(--on-ink);
}

.bgl-faqc__pill.is-active i { color: var(--gold-h); }

.bgl-faqc__count {
    padding: 1px 8px;
    border-radius: var(--r-pill);
    background: var(--ivory-2);
    font-size: .68rem;
    font-weight: 600;
    color: var(--muted);
    font-variant-numeric: tabular-nums;
}

.bgl-faqc__pill.is-active .bgl-faqc__count {
    background: rgba(192, 160, 104, .22);
    color: var(--gold-h);
}

.bgl-faqc__group { padding-top: clamp(30px, 3.6vw, 44px); }

.bgl-faqc__group-head {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 4px;
}

.bgl-faqc__group-head i { color: var(--gold-d); font-size: 1.16rem; }

.bgl-faqc__group-head h3 {
    font-family: var(--font-display);
    font-size: 1.34rem;
    font-weight: 500;
    margin: 0;
    color: var(--text);
}

/* 8.10 Directory & related */
.bgl-dir {
    display: grid;
    gap: 1px;
    margin-top: clamp(30px, 4vw, 46px);
    background: var(--border-soft);
    border: 1px solid var(--border-soft);
    border-radius: var(--r);
    overflow: hidden;
}

.bgl-dir__item {
    display: flex;
    gap: 16px;
    padding: clamp(20px, 2.4vw, 28px);
    background: var(--paper);
    transition: background-color .22s var(--ease);
}

.bgl-dir__item:hover { background: var(--ivory); }

.bgl-dir__icon {
    flex: 0 0 auto;
    font-size: 1.24rem;
    color: var(--gold-d);
    line-height: 1.2;
}

.bgl-dir__title {
    display: block;
    font-family: var(--font-display);
    font-size: 1.04rem;
    font-weight: 500;
    line-height: 1.34;
    color: var(--text);
    margin-bottom: 6px;
    text-wrap: balance;
}

.bgl-dir__text {
    display: block;
    font-size: var(--fs-sm);
    line-height: 1.62;
    color: var(--text-soft);
    text-wrap: pretty;
}

.bgl-dir__item:hover .bgl-dir__title { color: var(--gold-d); }

.bgl-band--ink .bgl-dir { background: var(--border-ink); border-color: var(--border-ink); }
.bgl-band--ink .bgl-dir__item { background: var(--ink-2); }
.bgl-band--ink .bgl-dir__item:hover { background: var(--ink-3); }
.bgl-band--ink .bgl-dir__title { color: var(--on-ink); }
.bgl-band--ink .bgl-dir__text { color: var(--on-ink-soft); }

@media (min-width: 640px)  { .bgl-dir { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1040px) { .bgl-dir { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.bgl-rel {
    display: grid;
    gap: clamp(18px, 2.2vw, 26px);
    margin-top: clamp(30px, 4vw, 46px);
}

.bgl-rel__item {
    padding-top: 20px;
    border-top: 1px solid var(--border);
    transition: border-color .22s var(--ease);
}

.bgl-rel__item:hover { border-top-color: var(--gold); }

.bgl-rel__item i { font-size: 1.2rem; color: var(--gold-d); }

.bgl-rel__title {
    display: block;
    font-family: var(--font-display);
    font-size: 1.04rem;
    font-weight: 500;
    line-height: 1.32;
    margin: 12px 0 7px;
    color: var(--text);
    text-wrap: balance;
}

.bgl-rel__text {
    display: block;
    font-size: var(--fs-sm);
    line-height: 1.6;
    color: var(--text-soft);
    text-wrap: pretty;
}

.bgl-rel__item:hover .bgl-rel__title { color: var(--gold-d); }

@media (min-width: 620px)  { .bgl-rel { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .bgl-rel { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* 8.11 Contact */
.bgl-contact {
    display: grid;
    gap: clamp(32px, 4vw, 56px);
    margin-top: clamp(32px, 4.2vw, 50px);
}

.bgl-contact__methods {
    display: grid;
    gap: 1px;
    align-content: start;
    background: var(--border-soft);
    border: 1px solid var(--border-soft);
    border-radius: var(--r);
    overflow: hidden;
}

.bgl-contact__method {
    display: flex;
    gap: 16px;
    padding: clamp(20px, 2.4vw, 26px);
    background: var(--paper);
}

.bgl-contact__method > i {
    flex: 0 0 auto;
    font-size: 1.3rem;
    color: var(--gold-d);
    line-height: 1.2;
}

.bgl-contact__method-title {
    font-family: var(--font-display);
    font-size: 1.06rem;
    font-weight: 500;
    color: var(--text);
    margin-bottom: 5px;
}

.bgl-contact__method-text {
    font-size: var(--fs-sm);
    line-height: 1.64;
    color: var(--text-soft);
    text-wrap: pretty;
}

.bgl-contact__method-action {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 11px;
    font-size: var(--fs-xs);
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--gold-d);
    border-bottom: 1px solid var(--border-gold);
    padding-bottom: 3px;
    transition: color .18s var(--ease), border-color .18s var(--ease);
}

.bgl-contact__method-action:hover { color: var(--ink); border-bottom-color: var(--gold-d); }

.bgl-contact__panel {
    align-self: start;
    padding: clamp(24px, 3vw, 34px);
    border: 1px solid var(--border);
    border-radius: var(--r);
    background: var(--paper);
}

.bgl-contact__panel h3 {
    font-family: var(--font-display);
    font-size: 1.2rem;
    font-weight: 500;
    margin: 0 0 18px;
    color: var(--text);
}

.bgl-contact__hours { margin: 0; }

.bgl-contact__hours-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 18px;
    padding: 11px 0;
    border-top: 1px solid var(--border-soft);
    font-size: var(--fs-sm);
}

.bgl-contact__hours-row:first-child { border-top: 0; padding-top: 0; }
.bgl-contact__hours-row dt { margin: 0; color: var(--text-soft); }

.bgl-contact__hours-row dd {
    margin: 0;
    text-align: right;
    color: var(--text);
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}

.bgl-contact__address {
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid var(--border-soft);
    font-size: var(--fs-sm);
    line-height: 1.7;
    color: var(--text-soft);
}

.bgl-contact__address a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 9px;
    color: var(--gold-d);
    border-bottom: 1px solid var(--border-gold);
    padding-bottom: 2px;
}

.bgl-contact__address a:hover { color: var(--ink); }

@media (min-width: 900px) {
    .bgl-contact { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); }
}

/* Enquiry form */
.bgl-form { display: grid; gap: 16px; }

.bgl-field { display: grid; gap: 7px; }

.bgl-field label {
    font-size: var(--fs-xs);
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--text-soft);
}

.bgl-field input,
.bgl-field select,
.bgl-field textarea {
    width: 100%;
    padding: 13px 15px;
    border: 1px solid var(--border);
    border-radius: var(--r-sm);
    background: var(--paper);
    color: var(--text);
    font-family: inherit;
    font-size: var(--fs-sm);
    line-height: 1.5;
    transition: border-color .18s var(--ease), background-color .18s var(--ease);
}

.bgl-field textarea { min-height: 118px; resize: vertical; }

.bgl-field input:hover,
.bgl-field select:hover,
.bgl-field textarea:hover { border-color: var(--border-firm); }

.bgl-field input:focus-visible,
.bgl-field select:focus-visible,
.bgl-field textarea:focus-visible { border-color: var(--gold); }

.bgl-field input::placeholder,
.bgl-field textarea::placeholder { color: var(--muted); }

.bgl-form__note {
    margin: 0;
    font-size: var(--fs-xs);
    line-height: 1.6;
    color: var(--muted);
    text-wrap: pretty;
}

.bgl-form__actions { display: flex; flex-wrap: wrap; gap: 11px; }

/* 8.12 Checklist — "include these details in your enquiry" */
.bgl-check {
    display: grid;
    gap: clamp(26px, 3.4vw, 44px);
}

.bgl-check__list {
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: bgl-check;
    align-self: start;
}

.bgl-check__list li {
    counter-increment: bgl-check;
    display: flex;
    gap: 15px;
    padding: 14px 0;
    border-top: 1px solid var(--border-soft);
    font-size: .97rem;
    line-height: 1.6;
    color: var(--text-soft);
}

.bgl-check__list li:last-child { border-bottom: 1px solid var(--border-soft); }

.bgl-check__list li::before {
    content: counter(bgl-check, decimal-leading-zero);
    flex: 0 0 auto;
    font-family: var(--font-display);
    font-style: italic;
    font-size: .88rem;
    color: var(--gold);
    padding-top: .2em;
    font-variant-numeric: tabular-nums;
}

@media (min-width: 900px) {
    .bgl-check { grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); }
}

/* 8.13 Support — intro left, points right */
.bgl-support { display: grid; gap: clamp(30px, 4vw, 54px); }

.bgl-support__list { display: grid; gap: clamp(18px, 2.2vw, 24px); align-content: start; }

.bgl-support__item {
    display: flex;
    gap: 16px;
    padding-top: 18px;
    border-top: 1px solid var(--border-soft);
}

.bgl-support__item:first-child { padding-top: 0; border-top: 0; }
.bgl-support__item > i { flex: 0 0 auto; font-size: 1.24rem; color: var(--gold-d); line-height: 1.3; }
.bgl-support__note { margin: 22px 0 0; font-size: var(--fs-xs); line-height: 1.66; color: var(--muted); }

@media (min-width: 900px) {
    .bgl-support { grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); }
}

/* 8.14 Closing CTA */
.bgl-cta { background: var(--ink); color: var(--on-ink); position: relative; overflow: hidden; }

.bgl-cta::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .5;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E");
}

.bgl-cta > .bgl-container { position: relative; z-index: 1; }

.bgl-cta__inner {
    display: grid;
    gap: clamp(26px, 3.4vw, 48px);
    align-items: center;
}

.bgl-cta .bgl-h2 { color: var(--on-ink); margin-bottom: 16px; }
.bgl-cta .bgl-h2 em { color: var(--gold-h); }
.bgl-cta .bgl-lede { color: var(--on-ink-soft); }
.bgl-cta .bgl-eyebrow { color: var(--gold-h); }
.bgl-cta .bgl-eyebrow::before { background: var(--gold-h); }
.bgl-cta__actions { display: flex; flex-wrap: wrap; gap: 12px; }

@media (min-width: 880px) {
    .bgl-cta__inner { grid-template-columns: minmax(0, 1.25fr) auto; }
    .bgl-cta__actions { justify-content: flex-end; }
}

/* 8.15 Trust strip — the source site's summary card, restated as a rule */
.bgl-trust {
    padding-block: clamp(30px, 3.6vw, 44px);
    background: var(--ivory-2);
    border-top: 1px solid var(--border-soft);
    border-bottom: 1px solid var(--border-soft);
}

.bgl-trust__inner {
    display: grid;
    gap: 18px 34px;
    align-items: center;
}

.bgl-trust h2 {
    font-family: var(--font-display);
    font-size: 1.1rem;
    font-weight: 500;
    margin: 0;
    color: var(--text);
}

.bgl-trust__row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 26px;
}

.bgl-trust__row span {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-size: var(--fs-sm);
    color: var(--text-soft);
}

.bgl-trust__row span::before {
    content: "";
    width: 5px;
    height: 5px;
    flex: 0 0 5px;
    border-radius: 50%;
    background: var(--gold);
}

@media (min-width: 900px) {
    .bgl-trust__inner { grid-template-columns: minmax(0, auto) minmax(0, 1fr); }
    .bgl-trust__row { justify-content: flex-end; }
}


/* ── Showcase: editorial photo rows ───────────────────────────────────── */

.bgl-showcase {
    display: grid;
    gap: clamp(46px, 6vw, 86px);
    margin-top: clamp(34px, 4.4vw, 52px);
}

.bgl-showcase__row {
    display: grid;
    gap: clamp(22px, 3vw, 46px);
    align-items: center;
}

.bgl-showcase__figure {
    margin: 0;
    min-width: 0;
}

.bgl-showcase__figure img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    border: 1px solid var(--border-soft);
    border-radius: var(--r);
    background: var(--ivory-2);
}

.bgl-showcase__figure figcaption {
    margin-top: 10px;
    padding-left: 12px;
    border-left: 1px solid var(--border-gold);
    font-size: var(--fs-xs);
    line-height: 1.5;
    color: var(--muted);
    text-wrap: pretty;
}

.bgl-showcase__body { min-width: 0; }

.bgl-showcase__title {
    margin: 0 0 .6em;
    font-family: var(--font-display);
    font-size: var(--fs-h3);
    font-weight: 600;
    line-height: 1.28;
    color: var(--ink);
    text-wrap: balance;
}

.bgl-showcase__body p {
    margin: 0 0 .85em;
    color: var(--text-soft);
    text-wrap: pretty;
}

.bgl-showcase__body p:last-child { margin-bottom: 0; }

/* The photograph leads on wide screens, and the side alternates so the page
   reads as a folio rather than as a repeated two-column block. */
@media (min-width: 900px) {
    .bgl-showcase__row { grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); }
    .bgl-showcase__row:nth-child(even) > .bgl-showcase__figure { order: 2; }
}

/* ── Gallery: photo grid on the same hairline as the card grid ────────── */

.bgl-gallery {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    margin-top: clamp(34px, 4.4vw, 52px);
    background: var(--border-soft);
    border: 1px solid var(--border-soft);
    border-radius: var(--r);
    overflow: hidden;
}

.bgl-gallery__item {
    position: relative;
    margin: 0;
    min-width: 0;
    background: var(--paper);
}

.bgl-gallery__item img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    transition: transform .5s var(--ease);
}

.bgl-gallery__item:hover img { transform: scale(1.03); }

.bgl-gallery__item figcaption {
    padding: 12px 16px 14px;
    font-size: var(--fs-xs);
    line-height: 1.5;
    color: var(--muted);
    text-wrap: pretty;
}

/* A leading tile earns its width only when the remainder would otherwise
   leave one orphan on the last row. */
@media (min-width: 620px) {
    .bgl-gallery--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .bgl-gallery--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (min-width: 900px) {
    .bgl-gallery--lead > .bgl-gallery__item:first-child { grid-column: span 2; }
    .bgl-gallery--lead > .bgl-gallery__item:first-child img { aspect-ratio: 2 / 1; }
}

@media (prefers-reduced-motion: reduce) {
    .bgl-gallery__item img { transition: none; }
    .bgl-gallery__item:hover img { transform: none; }
}

/* ── 9. Home-only ─────────────────────────────────────────────────────── */

/* Trip finder: six interests, one panel of result copy. */
.bgl-finder { display: grid; gap: clamp(28px, 3.6vw, 48px); }

.bgl-finder__opts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 1px;
    background: var(--border-soft);
    border: 1px solid var(--border-soft);
    border-radius: var(--r);
    overflow: hidden;
}

.bgl-finder__opt {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 18px 20px;
    background: var(--paper);
    border: 0;
    cursor: pointer;
    text-align: left;
    font-size: var(--fs-sm);
    font-weight: 500;
    color: var(--text-soft);
    transition: background-color .2s var(--ease), color .2s var(--ease);
}

.bgl-finder__opt i { color: var(--gold-d); font-size: 1.14rem; transition: color .2s var(--ease); }
.bgl-finder__opt:hover { background: var(--ivory); color: var(--ink); }

.bgl-finder__opt[aria-selected="true"] {
    background: var(--ink);
    color: var(--on-ink);
}

.bgl-finder__opt[aria-selected="true"] i { color: var(--gold-h); }

.bgl-finder__result {
    align-self: start;
    padding: clamp(24px, 3vw, 34px);
    border: 1px solid var(--border);
    border-radius: var(--r);
    background: var(--paper);
}

.bgl-finder__result h3 {
    font-family: var(--font-display);
    font-size: 1.24rem;
    font-weight: 500;
    margin: 0 0 10px;
    color: var(--text);
    text-wrap: balance;
}

.bgl-finder__result p {
    margin: 0;
    font-size: var(--fs-sm);
    line-height: 1.7;
    color: var(--text-soft);
    text-wrap: pretty;
}

.bgl-finder__result .bgl-cta-row { margin-top: 22px; }

@media (min-width: 900px) {
    .bgl-finder { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); align-items: start; }
}

/* ── 10. Guides, prose, search, 404 ───────────────────────────────────── */

.bgl-prose { max-width: 74ch; }

.bgl-prose > * + * { margin-top: 1.1em; }

.bgl-prose h2,
.bgl-prose h3 {
    font-family: var(--font-display);
    font-weight: 500;
    line-height: 1.24;
    color: var(--text);
    margin-top: 1.9em;
    text-wrap: balance;
}

.bgl-prose h2 { font-size: var(--fs-h2); }
.bgl-prose h3 { font-size: var(--fs-h3); }
.bgl-prose p { color: var(--text-soft); line-height: 1.8; text-wrap: pretty; }
.bgl-prose ul,
.bgl-prose ol { padding-inline-start: 22px; color: var(--text-soft); }
.bgl-prose li + li { margin-top: .5em; }
.bgl-prose a { color: var(--gold-d); border-bottom: 1px solid var(--border-gold); }
.bgl-prose a:hover { color: var(--ink); border-bottom-color: var(--gold-d); }
.bgl-prose img { border-radius: var(--r); }

.bgl-prose blockquote {
    margin: 1.8em 0;
    padding-inline-start: clamp(18px, 2.4vw, 30px);
    border-inline-start: 2px solid var(--gold);
    font-family: var(--font-display);
    font-size: 1.16rem;
    font-style: italic;
    line-height: 1.5;
    color: var(--text);
}

.bgl-posts {
    display: grid;
    gap: clamp(24px, 3vw, 38px);
    margin-top: clamp(30px, 4vw, 46px);
}

.bgl-post-card {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--border-soft);
    border-radius: var(--r);
    background: var(--paper);
    overflow: hidden;
    transition: border-color .22s var(--ease);
}

.bgl-post-card:hover { border-color: var(--gold); }

.bgl-post-card__media { aspect-ratio: 3 / 2; overflow: hidden; background: var(--ivory-2); }

.bgl-post-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s var(--ease);
}

.bgl-post-card:hover .bgl-post-card__media img { transform: scale(1.03); }

@media (prefers-reduced-motion: reduce) {
    .bgl-post-card__media img,
    .bgl-post-card:hover .bgl-post-card__media img { transition: none; transform: none; }
}

.bgl-post-card__body { padding: clamp(20px, 2.4vw, 26px); display: flex; flex-direction: column; flex: 1; }

.bgl-post-card__meta {
    font-size: var(--fs-xs);
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--muted);
}

.bgl-post-card__title {
    font-family: var(--font-display);
    font-size: 1.14rem;
    font-weight: 500;
    line-height: 1.32;
    margin: 11px 0 9px;
    color: var(--text);
    text-wrap: balance;
}

.bgl-post-card__excerpt {
    margin: 0;
    font-size: var(--fs-sm);
    line-height: 1.66;
    color: var(--text-soft);
    text-wrap: pretty;
}

.bgl-post-card__more { margin-top: 18px; }

@media (min-width: 680px)  { .bgl-posts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1040px) { .bgl-posts { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.bgl-empty {
    padding: clamp(34px, 4.4vw, 56px);
    border: 1px dashed var(--border-firm);
    border-radius: var(--r);
    text-align: center;
    color: var(--text-soft);
    max-width: 60ch;
    margin-inline: auto;
    text-wrap: pretty;
}

.bgl-pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: clamp(30px, 4vw, 46px);
}

.bgl-pagination .page-numbers {
    display: inline-grid;
    place-items: center;
    min-width: 42px;
    height: 42px;
    padding: 0 12px;
    border: 1px solid var(--border);
    border-radius: var(--r-sm);
    font-size: var(--fs-sm);
    color: var(--text-soft);
    transition: border-color .18s var(--ease), color .18s var(--ease);
}

.bgl-pagination .page-numbers:hover { border-color: var(--gold); color: var(--ink); }

.bgl-pagination .page-numbers.current {
    background: var(--ink);
    border-color: var(--ink);
    color: var(--on-ink);
}

.bgl-search {
    display: flex;
    gap: 9px;
    max-width: 480px;
    margin-top: 22px;
}

.bgl-search input {
    flex: 1;
    min-width: 0;
    padding: 13px 15px;
    border: 1px solid var(--border);
    border-radius: var(--r-sm);
    background: var(--paper);
    font-family: inherit;
    font-size: var(--fs-sm);
    color: var(--text);
    transition: border-color .18s var(--ease);
}

.bgl-search input:focus-visible { border-color: var(--gold); }

.bgl-404 { text-align: center; max-width: 62ch; margin-inline: auto; }
.bgl-404 .bgl-eyebrow { justify-content: center; }
.bgl-404 .bgl-lede { margin-inline: auto; }
.bgl-404 .bgl-cta-row { justify-content: center; }

/* ── 11. Footer, network desk, floating controls ──────────────────────── */

.bgl-desk {
    padding-block: clamp(28px, 3.4vw, 42px);
    background: var(--ink-2);
    color: var(--on-ink-soft);
    border-top: 1px solid var(--border-ink);
}

.bgl-desk__kicker {
    margin: 0 0 16px;
    font-size: var(--fs-xs);
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--gold-h);
}

.bgl-desk__rail {
    display: flex;
    flex-wrap: wrap;
    gap: 9px 22px;
    align-items: center;
}

.bgl-desk__rail a {
    font-size: var(--fs-sm);
    color: var(--on-ink-mute);
    border-bottom: 1px solid transparent;
    transition: color .18s var(--ease), border-color .18s var(--ease);
}

.bgl-desk__rail a:hover { color: var(--gold-h); border-bottom-color: var(--gold); }
.bgl-desk__rail-main { color: var(--on-ink) !important; font-weight: 500; }

.bgl-desk__meta {
    margin: 18px 0 0;
    font-size: var(--fs-xs);
    color: var(--on-ink-mute);
}

.bgl-desk__meta a { color: var(--gold-h); border-bottom: 1px solid var(--border-gold); }

.bgl-footer {
    background: var(--ink);
    color: var(--on-ink-soft);
    padding-block: clamp(46px, 5.4vw, 76px) 0;
    position: relative;
}

.bgl-footer__grid {
    display: grid;
    gap: clamp(30px, 3.6vw, 48px);
}

.bgl-footer__brand p {
    margin: 20px 0 0;
    font-size: var(--fs-sm);
    line-height: 1.72;
    color: var(--on-ink-mute);
    max-width: 44ch;
    text-wrap: pretty;
}

.bgl-footer__badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-top: 20px;
    padding: 8px 15px;
    border: 1px solid var(--border-gold);
    border-radius: var(--r-pill);
    font-size: var(--fs-xs);
    letter-spacing: .04em;
    color: var(--gold-h);
}

.bgl-footer h2 {
    font-family: var(--font-body);
    font-size: var(--fs-xs);
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--on-ink);
    margin: 0 0 18px;
}

.bgl-footer__links {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 10px;
}

.bgl-footer__links a {
    font-size: var(--fs-sm);
    color: var(--on-ink-mute);
    border-bottom: 1px solid transparent;
    transition: color .18s var(--ease), border-color .18s var(--ease);
}

.bgl-footer__links a:hover { color: var(--gold-h); border-bottom-color: var(--gold); }

.bgl-footer__contact { display: grid; gap: 16px; }

.bgl-footer__contact-item { display: flex; gap: 13px; font-size: var(--fs-sm); line-height: 1.6; }
.bgl-footer__contact-item i { flex: 0 0 auto; color: var(--gold); font-size: 1.06rem; margin-top: .18em; }

.bgl-footer__contact-item strong {
    display: block;
    font-weight: 600;
    font-size: var(--fs-xs);
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--on-ink);
    margin-bottom: 3px;
}

.bgl-footer__contact-item a { color: var(--on-ink-mute); }
.bgl-footer__contact-item a:hover { color: var(--gold-h); }

.bgl-footer__bottom {
    margin-top: clamp(38px, 4.4vw, 60px);
    padding-block: 22px calc(22px + env(safe-area-inset-bottom));
    border-top: 1px solid var(--border-ink);
    display: flex;
    flex-wrap: wrap;
    gap: 12px 26px;
    align-items: center;
    justify-content: space-between;
}

.bgl-footer__bottom p {
    margin: 0;
    font-size: var(--fs-xs);
    line-height: 1.66;
    color: var(--on-ink-mute);
    max-width: 82ch;
    text-wrap: pretty;
}

@media (min-width: 720px) {
    .bgl-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1040px) {
    .bgl-footer__grid { grid-template-columns: 1.5fr 1fr 1fr 1.1fr; }
}

/* Floating controls */
.bgl-fab {
    position: fixed;
    right: max(18px, env(safe-area-inset-right));
    bottom: max(18px, env(safe-area-inset-bottom));
    z-index: 70;
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background: #1faa54;
    color: #fff;
    font-size: 1.6rem;
    box-shadow: 0 6px 22px rgba(15, 26, 22, .26);
    transition: transform .2s var(--ease), background-color .2s var(--ease);
}

.bgl-fab:hover { transform: translateY(-2px); background: #189347; }

#bgl-top {
    position: fixed;
    right: max(18px, env(safe-area-inset-right));
    bottom: calc(max(18px, env(safe-area-inset-bottom)) + 66px);
    z-index: 70;
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 1px solid var(--border-firm);
    border-radius: 50%;
    background: var(--paper);
    color: var(--text);
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity .24s var(--ease), transform .24s var(--ease),
                visibility .24s, border-color .2s var(--ease);
}

#bgl-top.is-visible { opacity: 1; visibility: visible; transform: none; }
#bgl-top:hover { border-color: var(--gold); color: var(--gold-d); }

@media (prefers-reduced-motion: reduce) {
    .bgl-btn:hover,
    .bgl-fab:hover,
    #bgl-top { transform: none; }
}

/* ── 12. Print ────────────────────────────────────────────────────────── */

@media print {
    .bgl-util,
    #bgl-header,
    #bgl-drawer,
    .bgl-fab,
    #bgl-top,
    .bgl-progress,
    .bgl-hero__cue,
    .bgl-cta,
    .bgl-desk { display: none !important; }

    body { background: #fff; color: #000; }
    .bgl-band { padding-block: 18pt; }
    .bgl-reveal { opacity: 1 !important; transform: none !important; }
    .bgl-faq__item > .bgl-faq__a { display: block !important; }
    a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 8pt; color: #555; }
}
