/* =========================================================================
   The Branding Rooms — site styles
   Layout: Bootstrap 5 grid (assets/css/bootstrap.min.css) — this file adds
   the design system: colours, type, components and section backgrounds.
========================================================================= */

:root {
  --tbr-ink: #1A1615;
  --tbr-text: #4B4441;
  --tbr-mute: #7D7470;
  --tbr-brand: #A8331B;
  --tbr-brand-dark: #8C2914;
  --tbr-wine: #8E1B1C;
  --tbr-wine-dark: #751517;
  --tbr-forest: #313F27;
  --tbr-gold: #D09E5B;
  --tbr-gold-dark: #BC8A48;
  --tbr-blush: #FCEADA;
  --tbr-blush-soft: #FCE7D5;
  --tbr-accent: #C05C45;
  --tbr-line: #EBDCCB;
  --tbr-night: #121212;
  --tbr-bg-a: #FFFFFF;          /* alternating section colour A */
  --tbr-bg-b: #F6EFE6;          /* alternating section colour B */

  --ff-display: "Playfair Display", Georgia, serif;
  --ff-label: Montserrat, Arial, sans-serif;
  --ff-body: "DM Sans", Arial, sans-serif;

  --bs-body-font-family: var(--ff-body);
  --bs-body-font-size: 14px;
  --bs-body-line-height: 1.6;
  --bs-body-color: var(--tbr-text);
  --bs-body-bg: var(--tbr-bg-b);
  --bs-gutter-x: 1.5rem;
}

/* Container: matches the approved design width */
@media (min-width: 1400px) { .container { max-width: 1200px; } }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { font-family: var(--ff-body); font-size: 14px; line-height: 1.6; color: var(--tbr-text); background: var(--tbr-bg-b);
       -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
[id] { scroll-margin-top: 80px; }
::selection { background: #F3C9B6; color: var(--tbr-ink); }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; }
h1, h2, h3, h4, p, ul, figure, blockquote { margin: 0; }
ul { padding: 0; list-style: none; }
.text-ink { color: var(--tbr-ink) !important; }
.text-brand { color: var(--tbr-brand) !important; }
.text-mute { color: var(--tbr-mute) !important; }
.fw-600 { font-weight: 600; }
.skip-link { position: absolute; left: -9999px; top: 8px; z-index: 100; background: #fff; padding: 8px 12px; border-radius: 4px; }
.skip-link:focus { left: 8px; }

/* ---------- Section backgrounds (alternate, full width) ---------- */
.section { padding: 56px 0; }
.section--a { background: var(--tbr-bg-a); }
.section--b { background: var(--tbr-bg-b); }
@media (max-width: 767.98px) { .section { padding: 44px 0; } }

/* ---------- Type ---------- */
.eyebrow { font-family: var(--ff-label); font-weight: 700; font-size: 11px; letter-spacing: .26em; text-transform: uppercase;
           line-height: 1.6; color: var(--tbr-ink); }
.eyebrow-dash::after { content: ""; display: block; width: 18px; height: 2px; margin-top: 8px; background: #E9B49F; }
.eyebrow-dash.text-center::after { margin-left: auto; margin-right: auto; }
.section-title { font-family: var(--ff-display); font-weight: 600; font-size: 24px; letter-spacing: .03em; text-transform: uppercase; color: var(--tbr-ink); }
.body-text { font-size: 14px; line-height: 1.6; color: var(--tbr-text); }

/* ---------- Logo ---------- */
.logo { display: inline-block; font-family: var(--ff-display); font-weight: 900; font-size: 22px; line-height: .82; letter-spacing: -.005em;
        text-transform: uppercase; color: var(--tbr-ink); }
.logo span { display: block; }
.logo .logo-red { color: var(--tbr-brand); }
.logo .logo-tag { font-family: var(--ff-label); font-weight: 600; font-size: 4.6px; letter-spacing: .19em; line-height: 1; margin-top: 4px;
                  white-space: nowrap; color: var(--tbr-text); }
.logo--footer { color: #fff; }
.logo--footer .logo-red { color: #D4532F; }
.logo--footer .logo-tag { color: rgba(255,255,255,.7); }

/* ---------- Buttons ---------- */
.btn-brand { display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: var(--tbr-brand); color: #fff;
             font-family: var(--ff-label); font-weight: 600; border: 0; border-radius: 3px; transition: background-color .2s; cursor: pointer; }
.btn-brand:hover { background: var(--tbr-brand-dark); color: #fff; }
.btn-brand:focus-visible { outline: 2px solid var(--tbr-brand); outline-offset: 2px; }
.btn-brand:disabled { opacity: .6; }
.btn-brand--sm { font-size: 12px; height: 38px; padding: 0 16px; }
.btn-brand--lg { font-size: 14px; height: 44px; padding: 0 28px; box-shadow: 0 4px 10px rgba(168,51,27,.22); }
.btn-brand--block { width: 100%; height: 46px; font-size: 14px; }

/* ---------- Header ---------- */
.site-header { position: sticky; top: 0; z-index: 40; background: rgba(255,255,255,.96); backdrop-filter: blur(6px);
               border-bottom: 1px solid var(--tbr-line); transition: box-shadow .2s; }
.site-header.is-scrolled { box-shadow: 0 4px 18px rgba(0,0,0,.06); }
.site-header .bar { height: 72px; gap: 8px; }
.main-nav { gap: 28px; font-family: var(--ff-label); font-size: 12.5px; font-weight: 500; }
.main-nav a { color: var(--tbr-text); transition: color .15s; white-space: nowrap; }
.main-nav a:hover { color: var(--tbr-brand); }
.menu-btn { background: none; border: 0; padding: 8px; margin-right: -8px; color: var(--tbr-ink); }
.menu-btn svg { width: 26px; height: 26px; }
.mobile-menu { border-top: 1px solid var(--tbr-line); background: #fff; }
.mobile-menu a { display: block; padding: 11px 0; font-family: var(--ff-label); font-size: 14px; font-weight: 500; color: var(--tbr-text);
                 border-bottom: 1px solid #F3EAE0; }
.mobile-menu a:last-child { border-bottom: 0; }

/* ---------- Hero ---------- */
.hero { position: relative; overflow: hidden; padding: 0; }
.hero .hero-copy { padding: 48px 0; }
.hero h1 { font-family: var(--ff-display); font-weight: 900; text-transform: uppercase; color: var(--tbr-ink);
           font-size: 58px; line-height: .81; letter-spacing: .012em; margin-top: 22px; }
.hero .edition { font-family: var(--ff-label); font-weight: 600; text-transform: uppercase; font-size: 12px; letter-spacing: .3em;
                 color: var(--tbr-ink); margin-top: 12px; }
.hero h2 { font-family: var(--ff-display); font-weight: 600; font-size: 26px; line-height: 1.2; color: var(--tbr-ink); margin-top: 20px; }
.hero .from-line { font-family: var(--ff-display); font-weight: 700; font-size: 14.5px; color: var(--tbr-ink); margin-top: 4px; }
.hero .intro { margin-top: 12px; max-width: 420px; }
.hero-meta { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 14px 26px; }
.hero-meta li { display: flex; align-items: center; gap: 9px; line-height: 1.35; }
.hero-meta svg, .seats svg { width: 26px; height: 26px; color: var(--tbr-brand); flex-shrink: 0; }
.seats { display: flex; align-items: center; gap: 10px; line-height: 1.35; color: var(--tbr-mute); }
.seats svg { color: var(--tbr-accent); }
.hero-media { position: relative; width: 100%; aspect-ratio: 1147 / 912; overflow: hidden; }
.hero-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-tagline { position: absolute; left: 66%; top: 17%; z-index: 2; font-family: var(--ff-label); font-weight: 600; font-size: 11px;
                letter-spacing: .32em; line-height: 2; color: #2B2523; text-transform: uppercase; }
.hero-tagline .gap { display: block; height: 14px; }
.hero-tagline .tag-dash { display: block; width: 22px; height: 2px; background: #E2906F; margin-top: 12px; }
.hero-leaf { position: absolute; left: 0; top: 0; bottom: 0; width: 96px; pointer-events: none; mix-blend-mode: multiply;
             -webkit-mask-image: linear-gradient(90deg, #000 55%, transparent 100%); mask-image: linear-gradient(90deg, #000 55%, transparent 100%); }
.hero-leaf img { width: 100%; height: 100%; object-fit: cover; object-position: top center; }
@media (min-width: 992px) {
  .hero .hero-copy { padding: 44px 24px 44px 0; }
  .hero-media { aspect-ratio: auto; height: 100%; min-height: 480px; }
}
@media (max-width: 575.98px) {
  .hero h1 { font-size: 44px; }
  .hero h2 { font-size: 23px; }
  .hero-tagline { font-size: 8.5px; letter-spacing: .26em; top: 12%; }
}
@media (max-width: 359.98px) { .hero h1 { font-size: 38px; } }

/* ---------- Four-room journey ---------- */
.journey .intro { margin-top: 6px; }
.journey .plant { position: relative; height: 100%; min-height: 260px; mix-blend-mode: multiply;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 18%, #000 82%, transparent 100%), linear-gradient(180deg, transparent 0, #000 28%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent 0, #000 18%, #000 82%, transparent 100%), linear-gradient(180deg, transparent 0, #000 28%);
  mask-composite: intersect; }
.journey .plant img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }

.arch { display: flex; flex-direction: column; height: 100%; }
.arch-frame { position: relative; flex: 1; padding: 9px 9px 0; border-radius: 999px 999px 0 0;
              background: linear-gradient(105deg, #E8D3B8 0%, #F6E7D3 38%, #F8EBDA 60%, #E2C7A6 100%);
              box-shadow: inset 0 3px 6px rgba(120,80,40,.18); }
.arch-inner { position: relative; height: 100%; border-radius: 999px 999px 0 0; overflow: hidden; background-size: cover; background-position: center;
              box-shadow: inset 6px 8px 18px rgba(0,0,0,.28), inset -2px 0 10px rgba(0,0,0,.18);
              display: flex; flex-direction: column; align-items: center; text-align: center; color: #fff; padding: 30px 14px 28px; min-height: 290px; }
.arch-ledge { height: 9px; margin: 0 -2px; background: linear-gradient(180deg, #F3E4D1 0%, #E4CDB1 100%); box-shadow: 0 4px 8px rgba(110,72,36,.22); }
.arch-num { font-family: var(--ff-display); font-size: 14px; letter-spacing: .04em; }
.arch-icon { margin-top: 12px; width: 46px; height: 46px; border: 1.4px solid rgba(255,255,255,.85); border-radius: 999px;
             display: flex; align-items: center; justify-content: center; }
.arch-icon svg { width: 24px; height: 24px; }
.arch-dash { width: 18px; height: 2px; background: #E0915A; margin-top: 10px; }
.arch-title { margin-top: 10px; font-family: var(--ff-label); font-weight: 600; font-size: 18px; letter-spacing: .01em; color: #fff; }
.arch-text { margin-top: 6px; font-size: 14px; line-height: 1.45; color: rgba(255,255,255,.92); max-width: 160px; }
@media (max-width: 575.98px) {
  .arch-inner { padding: 24px 10px 22px; min-height: 260px; }
  .arch-title { font-size: 16px; }
  .arch-text { font-size: 14px; }
}

/* ---------- Icon lists (who / leave with) ---------- */
.icon-circle { margin: 0 auto; display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 999px;
               background: var(--tbr-blush-soft); color: var(--tbr-accent); }
.icon-circle svg { width: 25px; height: 25px; }
.icon-item p { margin-top: 10px; font-size: 14px; line-height: 1.45; color: var(--tbr-text); }
@media (min-width: 768px) {
  .divided > [class*="col"] + [class*="col"] { border-left: 1px solid var(--tbr-line); }
}

.callout { background: var(--tbr-blush); padding: 26px 28px; height: 100%; display: flex; flex-direction: column; justify-content: center; }
.callout .lead-q { font-family: var(--ff-display); font-weight: 600; font-size: 22px; line-height: 1.25; color: var(--tbr-ink); }

.notebook { display: block; width: 100%; aspect-ratio: 1200 / 442; object-fit: cover; border-radius: 2px; }

/* ---------- Curator ---------- */
.curator-photo { width: 100%; max-width: 280px; aspect-ratio: 640 / 600; object-fit: cover; object-position: center top; border-radius: 6px;
                 box-shadow: 0 6px 18px rgba(60,40,20,.12); }
.curator-name { font-family: var(--ff-display); font-weight: 600; font-size: 26px; color: var(--tbr-ink); margin-top: 2px; }
.quote { background: var(--tbr-blush); padding: 22px 30px 22px; }
.quote .quote-mark { display: block; font-family: var(--ff-display); font-weight: 700; font-size: 34px; line-height: 1; color: var(--tbr-brand); }
.quote blockquote { font-family: var(--ff-display); font-size: 18px; line-height: 1.35; color: var(--tbr-ink); margin-top: 2px; }
.quote figcaption { margin-top: 10px; font-size: 14px; color: var(--tbr-text); }

/* ---------- Details / register / sponsor ---------- */
.event-list li { display: flex; gap: 16px; align-items: flex-start; }
.event-list li + li { margin-top: 16px; }
.event-list svg { width: 26px; height: 26px; color: var(--tbr-brand); flex-shrink: 0; }
@media (min-width: 992px) { .event-col { border-right: 1px solid var(--tbr-line); } }

.card-register { background: var(--tbr-wine); color: #fff; padding: 26px 26px 18px; height: 100%; }
.card-register .eyebrow, .card-sponsor .eyebrow { color: #fff; }
.mini-field { width: 100%; background: #fff; border-radius: 2px; padding: 9px 12px; font-size: 14px; color: var(--tbr-ink);
              border: 1px solid transparent; outline: none; }
.mini-field::placeholder { color: #8A817C; }
.mini-field:focus { border-color: var(--tbr-gold); }
.btn-gold { width: 100%; height: 42px; border: 0; border-radius: 3px; background: var(--tbr-gold); color: var(--tbr-wine-dark);
            font-family: var(--ff-label); font-weight: 600; font-size: 13.5px; transition: background-color .2s; }
.btn-gold:hover { background: var(--tbr-gold-dark); }
.secure-note { font-size: 13px; color: rgba(255,255,255,.85); }
.secure-note svg { width: 14px; height: 14px; }

.card-sponsor { background: var(--tbr-forest); color: #fff; padding: 26px 28px; height: 100%; cursor: pointer; transition: filter .2s; }
.card-sponsor:hover { filter: brightness(1.08); }
.card-sponsor h3 { font-family: var(--ff-display); font-weight: 400; font-size: 30px; line-height: 1.05; margin-top: 10px; color: #fff; }
.card-sponsor p { color: rgba(255,255,255,.88); }
.btn-cream { width: 100%; border: 0; border-radius: 3px; background: #FBF2E3; color: var(--tbr-forest); font-family: var(--ff-label);
             font-weight: 600; font-size: 13.5px; padding: 11px 12px; line-height: 1.3; transition: background-color .2s; }
.btn-cream:hover { background: #fff; }

/* ---------- FAQ ---------- */
.faq-item { background: #fff; border: 1px solid var(--tbr-line); }
.faq-item + .faq-item { margin-top: 12px; }
.faq-item summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px;
                    padding: 16px 20px; font-size: 14px; font-weight: 500; color: var(--tbr-ink); }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item .plus { color: var(--tbr-brand); font-size: 20px; line-height: 1; transition: transform .2s; }
.faq-item[open] .plus { transform: rotate(45deg); }
.faq-item p { padding: 0 20px 16px; }

/* ---------- Footer ---------- */
.site-footer { background: var(--tbr-night); color: rgba(255,255,255,.85); font-size: 14px; }
.site-footer .top { padding: 34px 0 26px; }
.site-footer .bottom { padding: 18px 0 24px; border-top: 1px solid rgba(255,255,255,.14); color: rgba(255,255,255,.65); }
.footer-divider { width: 1px; height: 48px; background: rgba(255,255,255,.25); }
.project-of { font-family: var(--ff-label); font-size: 9px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #D4532F; }
.project-name { font-family: var(--ff-display); font-size: 21px; line-height: 1.2; color: #fff; }
.project-name sup { font-size: 9px; }
.footer-nav { gap: 8px 24px; font-family: var(--ff-label); font-size: 13px; }
.footer-nav a { color: rgba(255,255,255,.85); }
.footer-nav a:hover { color: #fff; }
.social { gap: 14px; }
.social a { color: #fff; transition: opacity .15s; }
.social a:hover { opacity: .75; }
.social svg { width: 20px; height: 20px; }
.site-footer .bottom a { color: rgba(255,255,255,.85); }
.site-footer .bottom a:hover { color: #fff; }

/* ---------- Modals ---------- */
.modal-tbr { position: fixed; inset: 0; z-index: 60; display: flex; align-items: center; justify-content: center; padding: 16px;
             visibility: hidden; opacity: 0; transition: opacity .25s ease, visibility .25s; }
.modal-tbr.open { visibility: visible; opacity: 1; }
.modal-backdrop-tbr { position: absolute; inset: 0; background: rgba(26,22,21,.62); backdrop-filter: blur(2px); }
.modal-panel { position: relative; width: 100%; max-width: 440px; max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px);
               overflow-y: auto; background: #FBF6F0; border-radius: 18px; box-shadow: 0 30px 80px rgba(0,0,0,.35);
               transform: translateY(24px) scale(.98); transition: transform .3s cubic-bezier(.2,.8,.2,1); overscroll-behavior: contain; }
.modal-tbr.open .modal-panel { transform: none; }
.modal-head { position: relative; background: var(--tbr-brand); color: #fff; padding: 24px 24px 26px; border-radius: 18px 18px 0 0; }
.modal-head h2 { font-family: var(--ff-display); font-weight: 400; font-size: 21px; letter-spacing: .02em; padding-right: 36px; }
.modal-head p { margin-top: 8px; font-size: 14px; color: #F7D9C9; }
.modal-close { position: absolute; top: 18px; right: 18px; background: none; border: 0; color: #fff; padding: 4px; }
.modal-close svg { width: 24px; height: 24px; }
.modal-body-tbr { padding: 24px; }
.modal-body-tbr > * + * { margin-top: 16px; }
body.modal-lock { overflow: hidden; }

.field { display: block; width: 100%; background: #fff; border: 1px solid #DCCFC2; border-radius: 4px; padding: 10px 12px; font-size: 14px;
         color: var(--tbr-ink); outline: none; transition: border-color .15s, box-shadow .15s; }
.field:focus { border-color: var(--tbr-brand); box-shadow: 0 0 0 3px rgba(168,51,27,.14); }
.field.is-invalid { border-color: #C0392B; }
.field.placeholder-shown { color: var(--tbr-mute); }
.field-label { display: block; font-size: 14px; font-weight: 600; color: var(--tbr-ink); margin-bottom: 6px; }
.field-hint { margin-top: 6px; font-size: 13px; color: var(--tbr-mute); }
.sum-row { display: flex; justify-content: space-between; font-size: 14px; color: var(--tbr-ink); }
.sum-row + .sum-row { margin-top: 8px; }
.sum-total { border-top: 1px solid #DCCFC2; padding-top: 12px; margin-top: 12px; display: flex; justify-content: space-between; align-items: center; }
.sum-total .label { font-weight: 700; letter-spacing: .02em; color: var(--tbr-ink); }
.sum-total .amount { font-size: 19px; font-weight: 700; color: var(--tbr-brand); }
.qr-wrap { display: flex; flex-direction: column; align-items: center; }
.qr-card { background: #EEF2F8; padding: 12px; border-radius: 6px; width: 184px; }
.qr-box { background: #fff; padding: 8px; border-radius: 4px; }
.qr-box svg, .qr-box img { width: 100%; height: auto; display: block; }
.qr-placeholder { aspect-ratio: 1; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 12px; color: var(--tbr-mute); padding: 8px; }
.qr-caption { font-size: 11px; text-align: center; color: var(--tbr-text); margin-top: 6px; }
.qr-title { margin-top: 12px; font-size: 13px; font-weight: 700; letter-spacing: .03em; color: var(--tbr-ink); }
.upi-link { margin-top: 8px; font-size: 14px; font-weight: 600; color: var(--tbr-brand); text-decoration: underline; text-underline-offset: 2px; }
@media (min-width: 768px) { .upi-link { display: none !important; } }
.form-error { font-size: 14px; color: var(--tbr-brand); }
.success-panel { padding: 48px 24px; text-align: center; }
.success-icon { width: 56px; height: 56px; margin: 0 auto; border-radius: 999px; background: var(--tbr-blush); color: var(--tbr-brand);
                display: flex; align-items: center; justify-content: center; }
.success-icon svg { width: 28px; height: 28px; }
.success-panel h3 { margin-top: 16px; font-family: var(--ff-display); font-size: 24px; color: var(--tbr-ink); }
.status-banner { position: fixed; bottom: 16px; left: 16px; right: 16px; z-index: 50; margin: 0 auto; max-width: 440px; border-radius: 8px;
                 background: var(--tbr-ink); color: #fff; font-size: 14px; padding: 16px 20px; box-shadow: 0 12px 30px rgba(0,0,0,.25); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .modal-tbr, .modal-panel { transition: none; }
}

/* ---------- Update 3: Prospectus CTA, QR image, ® mark ---------- */
.btn-prospectus { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 16px; border: 0; border-radius: 3px;
                  background: #F1DBC3; color: #A8331B; font-family: var(--ff-label); font-weight: 600; font-size: 12.5px; white-space: nowrap;
                  transition: background-color .2s; }
.btn-prospectus svg { width: 17px; height: 17px; color: #A8331B; }
.btn-prospectus:hover, .btn-prospectus:focus-visible { background: #EACDAE; color: #A8331B; }
.btn-prospectus:focus-visible { outline: 2px solid #A8331B; outline-offset: 2px; }
@media (min-width: 1200px) and (max-width: 1299.98px) { .main-nav { gap: 20px; } }

.qr-image { width: 230px; max-width: 100%; }
.qr-image img { display: block; width: 100%; height: auto; border-radius: 10px; }

sup.reg { font-size: .6em; top: -.6em; }
.curator-name { font-weight: 700; font-size: 30px; }
.qr-generated { background: #fff; padding: 14px; border-radius: 10px; border: 1px solid var(--tbr-line); }
.qr-generated svg { display: block; width: 100%; height: auto; }

/* ---------- Header buttons on tablet / phone ---------- */
.header-actions { gap: 16px; }
@media (max-width: 767.98px) {
  .site-header .bar { height: 64px; }
  .header-actions { gap: 6px; }
  .site-header .logo { font-size: 17px; }
  .site-header .logo .logo-tag { font-size: 3.6px; margin-top: 3px; }
  .btn-prospectus, .site-header .btn-brand--sm { height: 34px; padding: 0 10px; font-size: 11px; }
  .btn-prospectus { gap: 5px; }
  .btn-prospectus svg { width: 14px; height: 14px; }
  .menu-btn { padding: 6px; margin-right: -6px; }
  .menu-btn svg { width: 24px; height: 24px; }
}
@media (max-width: 374.98px) {
  .header-actions { gap: 4px; }
  .site-header .logo { font-size: 14px; }
  .btn-prospectus, .site-header .btn-brand--sm { padding: 0 6px; font-size: 10px; height: 32px; }
  .btn-prospectus svg { width: 12px; height: 12px; }
  .menu-btn svg { width: 22px; height: 22px; }
}

/* ---------- Cashfree payment step ---------- */
.pay-note { display: flex; gap: 14px; align-items: flex-start; background: #fff; border: 1px solid var(--tbr-line); border-radius: 8px; padding: 14px 16px; }
.pay-lock { flex-shrink: 0; width: 38px; height: 38px; border-radius: 999px; background: var(--tbr-blush); color: var(--tbr-brand);
            display: flex; align-items: center; justify-content: center; }
.pay-lock svg { width: 20px; height: 20px; }
.pay-title { font-size: 14px; font-weight: 700; color: var(--tbr-ink); }
.pay-sub { font-size: 13px; line-height: 1.45; color: var(--tbr-text); margin-top: 2px; }
.ok-ref { font-size: 12.5px; color: var(--tbr-mute); word-break: break-all; }

/* ---------- Footer legal links ---------- */
.legal-nav { gap: 6px 22px; white-space: nowrap; font-family: var(--ff-label); font-size: 13px; }
.legal-nav a { color: rgba(255,255,255,.85); }
.legal-nav a:hover, .legal-nav a[aria-current="page"] { color: #fff; text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Legal / info pages ---------- */
.page-hero { padding: 56px 0 44px; }
.page-hero h1 { font-family: var(--ff-display); font-weight: 700; font-size: 40px; line-height: 1.15; color: var(--tbr-ink); margin-top: 10px; }
.page-hero .lead-text { margin-top: 12px; max-width: 640px; font-size: 15px; }
.page-hero .updated { margin-top: 14px; font-size: 13px; color: var(--tbr-mute); }
.crumbs { font-family: var(--ff-label); font-size: 12px; color: var(--tbr-mute); }
.crumbs a { color: var(--tbr-brand); }
.crumbs a:hover { text-decoration: underline; }
@media (max-width: 575.98px) { .page-hero { padding: 40px 0 32px; } .page-hero h1 { font-size: 32px; } }

.legal { font-size: 14.5px; line-height: 1.75; color: var(--tbr-text); }
.legal h2 { font-family: var(--ff-display); font-weight: 600; font-size: 22px; color: var(--tbr-ink); margin: 36px 0 10px; }
.legal h2:first-child { margin-top: 0; }
.legal h2 .num { color: var(--tbr-brand); margin-right: 8px; }
.legal p + p { margin-top: 10px; }
.legal ul { list-style: none; padding: 0; margin: 10px 0 0; }
.legal ul li { position: relative; padding-left: 20px; }
.legal ul li + li { margin-top: 6px; }
.legal ul li::before { content: ""; position: absolute; left: 2px; top: .72em; width: 7px; height: 7px; border-radius: 50%; background: #E9B49F; }
.legal a { color: var(--tbr-brand); text-decoration: underline; text-underline-offset: 2px; }
.legal strong { color: var(--tbr-ink); }
.legal-box { background: var(--tbr-blush); border-left: 4px solid var(--tbr-brand); padding: 16px 20px; margin-top: 14px; }
.legal-box p { margin: 0; }

.toc { position: sticky; top: 96px; background: #fff; border: 1px solid var(--tbr-line); padding: 20px 22px; }
.toc p { font-family: var(--ff-label); font-weight: 700; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--tbr-ink); }
.toc ol { margin: 12px 0 0; padding-left: 18px; font-size: 13.5px; line-height: 1.5; }
.toc li + li { margin-top: 6px; }
.toc a { color: var(--tbr-text); }
.toc a:hover { color: var(--tbr-brand); }

/* ---------- Contact page ---------- */
.contact-card { background: #fff; border: 1px solid var(--tbr-line); padding: 26px 26px 24px; height: 100%; }
.contact-card .ic { width: 46px; height: 46px; border-radius: 999px; background: var(--tbr-blush-soft); color: var(--tbr-accent);
                    display: flex; align-items: center; justify-content: center; }
.contact-card .ic svg { width: 22px; height: 22px; }
.contact-card h2 { font-family: var(--ff-display); font-weight: 600; font-size: 20px; color: var(--tbr-ink); margin-top: 16px; }
.contact-card p { margin-top: 8px; }
.contact-card a { color: var(--tbr-brand); font-weight: 600; word-break: break-word; }
.contact-card a:hover { text-decoration: underline; }
.contact-org { background: var(--tbr-forest); color: rgba(255,255,255,.88); padding: 28px; }
.contact-org .eyebrow { color: #fff; }
.contact-org h2 { font-family: var(--ff-display); font-size: 28px; color: #fff; margin-top: 8px; }
.contact-org dl { margin: 16px 0 0; display: grid; grid-template-columns: 140px 1fr; gap: 10px 16px; font-size: 14px; }
.contact-org dt { font-weight: 600; color: #fff; }
.contact-org dd { margin: 0; }
.contact-org a { color: #FBF2E3; text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 575.98px) { .contact-org dl { grid-template-columns: 1fr; gap: 2px; } .contact-org dd { margin-bottom: 10px; } }

/* ---------- Thank-you page ---------- */
.ty-hero { padding: 64px 0 56px; }
.ty-icon { display: inline-flex; align-items: center; justify-content: center; width: 76px; height: 76px; border-radius: 999px;
           background: var(--tbr-brand); color: #fff; box-shadow: 0 10px 26px rgba(168,51,27,.28); font-family: var(--ff-display); font-weight: 900; font-size: 38px; }
.ty-icon svg { width: 38px; height: 38px; }
.ty-icon.is-warn { background: var(--tbr-gold); box-shadow: none; }
.ty-title { font-family: var(--ff-display); font-weight: 700; font-size: 42px; line-height: 1.15; color: var(--tbr-ink); margin-top: 12px; }
.ty-lead { margin: 16px auto 0; max-width: 620px; font-size: 16px; line-height: 1.6; }
.ty-card { margin: 30px auto 0; max-width: 620px; background: #fff; border: 1px solid var(--tbr-line); padding: 22px 24px; text-align: left; }
.ty-card dl { margin: 0; display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1fr) minmax(0, 1.5fr); gap: 16px; }
.ty-card dt { font-family: var(--ff-label); font-size: 10.5px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--tbr-mute); }
.ty-card dd { margin: 6px 0 0; font-size: 15px; font-weight: 700; color: var(--tbr-ink); word-break: break-all; }
.ty-note { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--tbr-line); font-size: 13px; color: var(--tbr-mute); }
.ty-btn { height: 44px; padding: 0 22px; font-size: 14px; }
@media (max-width: 575.98px) {
  .ty-hero { padding: 44px 0 40px; }
  .ty-title { font-size: 31px; }
  .ty-card dl { grid-template-columns: 1fr; gap: 12px; }
}