/* Registration pages — builds on base.css with the blue site (Option D) tokens. */
:root {
  --bg: #F6F7FB; --fg: #14183A; --muted: #4C5070; --line: #DFE2EE; --surface: #FFFFFF;
  --accent: #FFCC03; --accent-ink: #1E1B1C; --accent-text: #2E3EA8; --accent-strong: #14183A; --err: #B42318; --ok: #146C43;
  --card: #FFFFFF; --card-fg: #14183A; --card-muted: #5A5E7A; --card-line: #D6D9E6; --field: #F2F3F8; --field-soft: #EEF0F8;
  --top-accent: #FFCC03; --top-bg: rgba(11,15,42,.94); --top-fg: #F6F4EC; --top-line: rgba(246,244,236,.16);
  --night: radial-gradient(120% 120% at 90% 0%, #24318A, #18215C 40%, #0B0F2A 80%);
  --radius: 20px;
  --font-display: "Montserrat", "Mukta", system-ui, sans-serif; --font-body: "Mukta", "Montserrat", system-ui, sans-serif; --font-mono: "JetBrains Mono", ui-monospace, monospace;
}

/* ---- Landing page additions (stage 1) ---- */
.pb-closed { font-weight: 700; padding: 10px 0; }
.pb-go .pb-go-t + .pb-go-t { display: none; }
.reg-notice { background: #FFF4C2; color: #1E1B1C; border-bottom: 1px solid #F2B705; position: relative; z-index: 39; }
.reg-notice-in { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; padding-block: 12px; font-weight: 600; }
.reg-notice-in p { flex: 1 1 280px; margin: 0; }
.reg-notice .btn { min-height: 40px; font-size: 14.5px; }

/* ---- Inner page shell ---- */
.page-inner { background: var(--bg); color: var(--fg); font-family: var(--font-body); }
.page-inner .top { position: sticky; }
.inner { min-height: 60vh; padding-bottom: 40px; }
.inner-foot { padding-block: 28px 110px; color: var(--muted); font-size: 14px; display: grid; gap: 6px; }
.inner-foot a { color: inherit; }
@media (min-width: 960px) { .inner-foot { padding-bottom: 40px; } }

.reg-hero { background: var(--night); color: #F6F4EC; padding-block: 26px 74px; position: relative; overflow: hidden; }
.reg-hero::after { content: ""; position: absolute; right: -90px; top: 30%; width: 380px; height: 100px; border: 1.5px solid rgba(255,204,3,.45); border-radius: 50%; transform: rotate(-14deg); pointer-events: none; }
.reg-hero h1 { font-family: var(--font-display); font-size: clamp(26px, 5vw, 40px); font-weight: 800; margin: 14px 0 6px; line-height: 1.1; }
.reg-hero p { color: #C9CCE4; margin: 0; }
.reg-hero .reg-steps { padding-right: 0; color: #F6F4EC; max-width: 640px; }
.reg-hero .rs { opacity: .6; }
.reg-hero .rs.on { opacity: 1; }
.reg-hero .rs:not(.on) i { background: transparent; border: 1.5px solid rgba(246,244,236,.5); color: #F6F4EC; }
.reg-hero .rs-line { background: rgba(246,244,236,.25); }

.card, .reg-main, .sum-card { background: var(--card); color: var(--card-fg); border-radius: var(--radius); box-shadow: 0 18px 40px -30px rgba(20,24,58,.55); border: 1px solid var(--card-line); }
.card { padding: 22px 18px; }
.reg-narrow { max-width: 720px; margin-top: -48px; position: relative; z-index: 1; display: grid; gap: 16px; }
@media (min-width: 720px) { .card { padding: 28px; } }

/* ---- Form layout ---- */
.reg-layout { display: grid; gap: 18px; margin-top: -48px; position: relative; z-index: 1; align-items: start; }
@media (min-width: 1000px) { .reg-layout { grid-template-columns: minmax(0, 1fr) 360px; gap: 24px; } .reg-side { position: sticky; top: 84px; } }
.reg-main { padding: 18px 16px 22px; display: grid; gap: 4px; min-width: 0; }
@media (min-width: 720px) { .reg-main { padding: 26px 28px 30px; } }
.reg-sec { display: grid; gap: 14px; padding-block: 18px; border-top: 1px solid var(--card-line); }
.reg-sec:first-of-type { border-top: 0; }
.reg-sec-h { display: grid; gap: 2px; }
.reg-sec-h h2 { font-family: var(--font-display); font-size: 19px; font-weight: 800; margin: 0; }
.reg-sec-h p { margin: 0; color: var(--card-muted); font-size: 14px; }
.en-note { display: inline-flex; gap: 6px; align-items: center; font-weight: 600; color: var(--accent-text) !important; }

.member-note { margin-bottom: 4px; }
.member-note.exp { background: #FFF4C2; }
.member-note .link-btn { margin-left: auto; }
.member-note.plain { background: none; padding: 0; justify-content: flex-end; }

.fld select, .fld input[type="date"] { width: 100%; min-height: 50px; border-radius: 12px; border: 1.5px solid var(--card-line); background: var(--field); color: var(--card-fg); font: 500 16px var(--font-body); padding: 0 12px; }
.fld select:focus, .fld input[type="date"]:focus { outline: none; border-color: var(--accent-strong); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 30%, transparent); }
.fld.has-err input, .fld.has-err select, .seg.has-err span, .check-card.has-err { border-color: var(--err); }
.fld .opt { font-weight: 500; color: var(--card-muted); font-size: 13px; }
.fld-hint { margin: 0; font-size: 12.5px; color: var(--card-muted); }
.fld-err { margin: 0; }
@media (min-width: 520px) { .fld-row-name { grid-template-columns: 110px 1fr 1fr; } }
.fld-gender[hidden] { display: none; }
.seg label { min-width: 90px; }

.cc-in { display: flex; align-items: stretch; border-radius: 12px; border: 1.5px solid var(--card-line); background: var(--field); overflow: hidden; }
.cc-in span { display: grid; place-items: center; padding: 0 4px 0 12px; font-weight: 700; color: var(--card-muted); }
.cc-in input { border: 0 !important; background: transparent !important; box-shadow: none !important; min-height: 47px; padding-left: 6px; }
.cc-in:focus-within { border-color: var(--accent-strong); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 30%, transparent); }
.has-err .cc-in { border-color: var(--err); }

.guest { gap: 12px; padding: 14px; }
.guest-h b { font-family: var(--font-display); }
#addGuest[hidden] { display: none; }

.check-card { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border: 1.5px solid var(--card-line); border-radius: 14px; background: var(--field); cursor: pointer; }
.check-card input { width: 22px; height: 22px; margin: 2px 0 0; accent-color: #14183A; flex: none; }
.check-card span { display: grid; gap: 3px; }
.check-card small { color: var(--card-muted); font-size: 13.5px; }
.check-card small.fld-err { color: var(--err); }
.reg-renew .check-card { background: #FFF8D6; border-color: #F2B705; }

.coupon-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: end; }
.coupon-row .btn { min-height: 50px; }
.coupon-msg { margin: 0; font-weight: 600; font-size: 14px; min-height: 1em; }
.coupon-msg.ok { color: var(--ok); }
.coupon-msg.bad { color: var(--err); }

.doc { display: grid; gap: 10px; }
.doc h3 { font-size: 16px; font-weight: 800; margin: 0; }
.doc-tabs { display: inline-flex; gap: 4px; background: var(--field); border-radius: 999px; padding: 4px; justify-self: start; }
.doc-tabs button { border: 0; background: transparent; border-radius: 999px; padding: 6px 14px; font: 700 14px var(--font-body); cursor: pointer; color: var(--card-fg); }
.doc-tabs button[aria-selected="true"] { background: #14183A; color: #FFCC03; }
.doc-body { max-height: 220px; overflow: auto; padding: 14px 16px; border-radius: 12px; border: 1px solid var(--card-line); background: #FBFBFE; font-size: 15px; line-height: 1.6; }
.doc-body[lang="mr"] { font-size: 16px; }
.doc-body:focus-visible { outline: 3px solid var(--accent); }
.guest-consent { display: flex; gap: 8px; align-items: flex-start; background: #EEF0FF; border-radius: 12px; padding: 12px 14px; margin: 0; font-weight: 600; font-size: 14.5px; }
.guest-consent .ico { flex: none; width: 20px; height: 20px; margin-top: 1px; color: #2E3EA8; }
.guest-consent[hidden] { display: none; }

.form-alert { border: 1.5px solid var(--err); background: #FEF3F2; color: var(--err); border-radius: 14px; padding: 12px 16px; margin-bottom: 8px; }
.form-alert ul { margin: 6px 0 0; padding-left: 18px; font-size: 14px; }
.form-alert a { color: inherit; }
.form-alert:focus { outline: none; }

/* ---- Summary ---- */
.sum-card { padding: 18px 16px; display: grid; gap: 12px; }
.sum-card h2 { font-family: var(--font-display); font-size: 18px; font-weight: 800; margin: 0; }
#summary.is-loading { opacity: .55; transition: opacity .15s; }
.sum-person { display: grid; gap: 2px; padding-bottom: 6px; border-bottom: 1px dashed var(--card-line); }
.sum-person:last-of-type { border-bottom: 0; }
.sum-ph { font-weight: 700; }
.sum-disc { color: var(--ok); }
.sum-saved { color: var(--ok); font-weight: 700; font-size: 14px; }
.btn-pay .ico { width: 20px; height: 20px; }

/* Phone pay bar */
.paybar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px)); background: #0B0F2A; color: #F6F4EC; box-shadow: 0 -10px 30px -10px rgba(0,0,0,.5); transition: transform .2s; }
.paybar small { display: block; font-size: 12px; color: #B8BCD9; }
.paybar b { font-family: var(--font-display); font-size: 22px; }
.paybar .btn { min-height: 46px; }
.paybar.off { transform: translateY(110%); }
@media (min-width: 1000px) { .paybar { display: none; } }

/* ---- Payment / status ---- */
.pay-box { display: grid; gap: 14px; }
.pay-box h2 { font-family: var(--font-display); font-size: 22px; font-weight: 800; margin: 0; }
.kv { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; font-size: 15px; margin: 0; }
.kv dt { color: var(--card-muted); }
.kv dd { margin: 0; font-weight: 600; }
.notice { border-radius: 12px; padding: 12px 14px; font-weight: 600; }
.notice.err { background: #FEF3F2; color: var(--err); }
.notice.warn { background: #FFF4C2; }
.notice.ok { background: #E8F5EE; color: var(--ok); }
.notice.info { background: #EEF0FF; }
.btn-row { display: flex; flex-wrap: wrap; gap: 10px; }
.fake-pay { border: 2px dashed #B42318; border-radius: 14px; padding: 14px; display: grid; gap: 10px; }

.details summary { cursor: pointer; font-weight: 800; font-family: var(--font-display); }
.details[open] summary { margin-bottom: 10px; }
.tbl { width: 100%; border-collapse: collapse; font-size: 14px; }
.tbl th, .tbl td { text-align: left; padding: 8px 6px; border-bottom: 1px solid var(--card-line); vertical-align: top; }
.tbl th { font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--card-muted); }
.tbl td.num, .tbl th.num { text-align: right; font-variant-numeric: tabular-nums; }
.tbl-wrap { overflow-x: auto; }

.otp-in { font: 700 26px var(--font-mono) !important; letter-spacing: .4em; text-align: center; }

/* Keep everything inside the phone viewport: fieldsets default to min-content width */
.reg-layout { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1000px) { .reg-layout { grid-template-columns: minmax(0, 1fr) 360px; } }
.reg-main, .reg-sec, .fld, .fld-row, .guests, .guest, fieldset.seg { min-width: 0; max-width: 100%; }
fieldset.seg { min-inline-size: 0; }
.seg .fld-err { width: 100%; }
.check-card input[type="checkbox"] { appearance: auto; -webkit-appearance: checkbox; background: #fff; position: static; opacity: 1; pointer-events: auto; }
.reg-hero h1 { overflow-wrap: anywhere; }
.page-inner { overflow-x: hidden; }

/* Membership: renewal offer and sign-up suggestion */
.renew-card { background: #FFF8D6; border-color: #F2B705; margin-bottom: 6px; }
.join-card { border: 1.5px dashed #9AA3D9; background: #F4F5FF; border-radius: 14px; padding: 12px 14px; display: grid; gap: 8px; margin-bottom: 6px; }
.join-card p { margin: 0; font-size: 15px; }
.join-card .btn { min-height: 42px; font-size: 15px; }
.join-card .btn-row { align-items: center; }

/* The site is color-scheme: dark; the white cards need light native controls (checkboxes, date pickers). */
.reg-main, .sum-card, .card { color-scheme: light; }

/* ---- Manifesto & terms: full text, no inner scroll, comfortable reading ---- */
.reg-consent { gap: 18px; }
.doc { display: grid; gap: 12px; padding: 18px 18px 20px; border: 1px solid var(--card-line); border-radius: 16px; background: #FBFBFE; }
@media (min-width: 720px) { .doc { padding: 22px 26px 24px; } }
.doc-h { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.doc-h h3 { font-family: var(--font-display); font-size: 17px; font-weight: 800; margin: 0; }
.doc-tabs { justify-self: auto; }
.doc-body { max-height: none; overflow: visible; padding: 0; border: 0; background: none; font-size: 16px; line-height: 1.75; color: var(--card-fg); max-width: 68ch; }
.doc-body p { margin: 0 0 .8em; }
.doc-body p:last-child { margin-bottom: 0; }
.doc-body[lang="mr"] { font-size: 17px; line-height: 1.9; }
.doc-manifesto { border-left: 4px solid var(--accent); }
.doc-manifesto .doc-body { font-size: 16.5px; }
.doc-list { margin: 0; padding: 0; list-style: none; counter-reset: term; display: grid; gap: 10px; }
.doc-list li { counter-increment: term; display: grid; grid-template-columns: 30px 1fr; gap: 10px; align-items: start; line-height: 1.6; font-size: 15.5px; }
.doc-list li::before { content: counter(term); display: grid; place-items: center; width: 26px; height: 26px; margin-top: 1px; border-radius: 50%; background: #14183A; color: #FFCC03; font: 700 12.5px var(--font-mono); }
.consent-card { background: #FFF8D6; border-color: #F2B705; padding: 16px; }
.consent-card b { font-size: 15.5px; line-height: 1.5; }
.consent-card .guest-consent-note { color: #2E3EA8; font-weight: 600; }
.doc-manifesto .doc-body p { margin-bottom: .65em; }

/* Payment messages under the Pay button, and the local test gateway window */
#payMsg { margin: 0; font-size: 14px; }
.fake-gw { border: 0; border-radius: 18px; padding: 0; width: min(420px, 94vw); box-shadow: 0 30px 80px -20px rgba(0,0,0,.6); color-scheme: light; }
.fake-gw::backdrop { background: rgba(8,10,28,.7); }
.fake-gw-in { padding: 22px; display: grid; gap: 10px; text-align: center; font-family: var(--font-body); color: #14183A; }
.fake-gw-tag { margin: 0; font: 700 11.5px var(--font-mono); letter-spacing: .1em; color: #B42318; }
.fake-gw h2 { margin: 0; font-family: var(--font-display); font-size: 26px; }
.fake-gw p { margin: 0; color: #5A5E7A; }
.fake-gw-btns { display: grid; gap: 8px; margin-top: 6px; }
.fake-gw-msg { color: #B42318 !important; font-weight: 600; min-height: 1.2em; }

/* Steps as an ordered list */
ol.reg-steps { list-style: none; margin: 0; padding: 0; }
.reg-steps li.rs-line { list-style: none; }

/* =========================================================================
   Thank-you page
   ========================================================================= */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ty-hero { padding: 20px 0 56px; }
.ty-hero > .wrap { max-width: 1000px; } /* same width as the content below (.ty-wrap), so the left edges line up */
.ty-hero h1 { font-size: clamp(22px, 4vw, 34px); margin-top: 12px; }
.ty-hero p { font-size: 15px; }
@media (max-width: 599px) { .ty-hero .reg-steps { display: none; } .ty-hero h1 { margin-top: 0; } }
.ty-wrap { display: grid; gap: 12px; margin-top: -36px; position: relative; z-index: 1; max-width: 1000px; }

/* Registration card: portrait by default (phones and the shared image), horizontal on wide screens */
.reg-card { width: 100%; max-width: 420px; justify-self: center; border-radius: 22px; padding: 22px 20px; color: #F6F4EC;
  background: radial-gradient(120% 90% at 85% 0%, #24318A 0%, #18215C 35%, #0B0F2A 75%); position: relative; overflow: hidden;
  display: flex; flex-direction: column; gap: 12px; box-shadow: 0 30px 60px -30px rgba(11,15,42,.8); font-family: var(--font-body); }
.reg-card::before { content: ""; position: absolute; right: -60px; top: -40px; width: 200px; height: 200px; border-radius: 50%; background: radial-gradient(circle at 40% 35%, #FFE680, #FFCC03 45%, #E89B00 100%); opacity: .9; }
.reg-card::after { content: ""; position: absolute; right: -120px; top: 34px; width: 340px; height: 84px; border: 1.5px solid rgba(255,204,3,.6); border-radius: 50%; transform: rotate(-18deg); }
.rc-head, .rc-grid, .rc-foot { position: relative; z-index: 1; }
.rc-head { display: grid; gap: 14px; }
.rc-top { display: flex; align-items: center; gap: 10px; }
.rc-top .sfa-mark { width: 50px; height: 50px; }
.rc-top b { font-family: var(--font-display); font-size: 20px; line-height: 1.05; display: block; }
.rc-top b em { color: #FFCC03; font-style: italic; }
.rc-going { font: 700 11.5px var(--font-mono); letter-spacing: .12em; text-transform: uppercase; color: #FFCC03; margin: 0 0 2px; }
.rc-name { font-family: var(--font-display); font-size: 22px; font-weight: 800; line-height: 1.15; margin: 0; }
.rc-name small { font-size: 14px; font-weight: 600; color: #B8BCD9; }
.rc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.rc-grid > div { background: rgba(255,255,255,.07); border: 1px solid rgba(246,244,236,.18); border-radius: 12px; padding: 9px 11px; min-width: 0; }
.rc-grid > div.wide { grid-column: 1 / -1; }
.rc-grid small { display: block; font: 700 10.5px var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: #B8BCD9; }
.rc-grid b { font-size: 16px; font-weight: 700; overflow-wrap: anywhere; }
.rc-grid .big b { font-family: var(--font-display); font-size: clamp(17px, 5vw, 21px); color: #FFCC03; white-space: nowrap; overflow-wrap: normal; }
.rc-addr { display: block; font-size: 12.5px; color: #C9CCE4; line-height: 1.45; margin-top: 2px; }
.rc-map { display: inline-block; margin-top: 4px; font-size: 13px; font-weight: 700; color: #FFCC03; text-decoration: underline; text-underline-offset: 3px; }
.rc-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 11.5px; color: #B8BCD9; }
.rc-foot img { height: 28px; width: auto; background: #fff; border-radius: 6px; padding: 2px 6px; }

@media (min-width: 860px) {
  .ty-wrap > .reg-card { max-width: none; display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.4fr); grid-template-rows: 1fr auto; column-gap: 26px; row-gap: 12px; padding: 26px 28px; }
  .ty-wrap > .reg-card .rc-head { align-content: space-between; }
  .ty-wrap > .reg-card .rc-name { font-size: 26px; }
  .ty-wrap > .reg-card .rc-grid { grid-row: 1 / 3; grid-column: 2; align-content: start; }
  .ty-wrap > .reg-card .rc-foot { grid-column: 1; align-self: end; flex-direction: column; align-items: flex-start; }
  .ty-wrap > .reg-card::before { right: auto; left: 33%; top: -90px; width: 170px; height: 170px; }
  .ty-wrap > .reg-card::after { right: auto; left: 22%; top: 10px; }
}
/* Off-screen holder for the portrait copy that becomes the image (a link in an image is not clickable) */
.card-capture { position: absolute; left: -10000px; top: 0; width: 420px; }
.card-capture .reg-card { max-width: 420px; }
.card-capture .rc-map { display: none; }

/* Small actions under the card */
.ty-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; }
.ty-bar-share { display: inline-flex; gap: 8px; }
.pill { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 14px; border-radius: 999px; border: 1.5px solid var(--card-line); background: #fff; color: var(--card-fg); font: 700 13.5px var(--font-body); cursor: pointer; }
.pill .ico { width: 16px; height: 16px; }
.pill:hover { border-color: var(--card-fg); }
.pill-wa { background: #25D366; border-color: #25D366; color: #06331A; }
@media (max-width: 859px) { .ty-bar { justify-content: center; } }
.share-msg { font-size: 13px; color: var(--card-muted); text-align: center; margin: -4px 0 0; }
.share-msg:empty { display: none; }
.ty-details { padding: 14px 16px; color-scheme: light; }
.ty-details[hidden] { display: none; }
.small-note { font-size: 13px; color: var(--card-muted); margin: 10px 0 0; }

/* "More below" cue: phones only, where books and donation start below the fold */
.more-below { margin: 2px 0 0; text-align: center; font-size: 14px; color: var(--card-muted); }
.more-below a { color: var(--accent-text); font-weight: 700; text-decoration: none; }
@media (min-width: 860px) { .more-below { display: none; } }

/* Books and donation: side by side on wide screens (donation left); books first on phones */
.ty-extras { display: grid; gap: 14px; align-items: stretch; margin-top: 6px; }
@media (min-width: 860px) { .ty-extras { grid-template-columns: 1fr 1fr; } }
@media (max-width: 859px) { .ty-extras .books { order: -1; } }
.ty-extras > section { scroll-margin-top: 80px; }

.donate { padding: 18px 20px; display: grid; gap: 10px; align-content: start; }
.donate h2 { font-family: var(--font-display); font-size: 19px; font-weight: 800; margin: 0; }
.donate p { margin: 0; color: var(--card-muted); line-height: 1.55; font-size: 14.5px; }
.donate-form { display: grid; gap: 10px; }
.donate-form[hidden] { display: none; }
.amt-chips { border: 0; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; min-width: 0; }
.amt-chips label { cursor: pointer; }
.amt-chips label { position: relative; }
.amt-chips input { position: absolute; left: 0; top: 0; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.amt-chips span { display: grid; place-items: center; min-height: 40px; border-radius: 10px; border: 1.5px solid var(--card-line); background: #fff; font: 700 14.5px var(--font-body); font-variant-numeric: tabular-nums; }
.amt-chips input:checked + span { background: #14183A; color: #FFCC03; border-color: #14183A; }
.amt-chips input:focus-visible + span { outline: 3px solid var(--accent); outline-offset: 2px; }
.amt-other[hidden] { display: none; }
#donateBtn { justify-self: start; min-height: 42px; font-size: 15px; padding: 0 22px; }
.donate-note { font-size: 12.5px !important; }
.donate-msg { margin: 0; font-weight: 600; font-size: 14px; }
.donate-msg.err { color: var(--err); }
.donate-msg.warn { color: #7A5600; }
.donate-thanks { display: grid; gap: 6px; }
.donate-thanks h2 { color: var(--ok); }
.donate-thanks[hidden] { display: none; }

.books { display: grid; gap: 12px; align-content: start; border-radius: var(--radius); padding: 18px 20px; color: #F6F4EC; background: radial-gradient(120% 120% at 100% 0%, #24318A, #0B0F2A 70%); }
.books-eyebrow { margin: 0; font: 700 11px var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: #FFCC03; }
.books h2 { font-family: var(--font-display); font-size: 19px; font-weight: 800; margin: 3px 0 4px; }
.books-txt p:not(.books-eyebrow) { margin: 0; color: #C9CCE4; font-size: 14px; }
.books-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.books-list a { display: grid; gap: 4px; justify-items: center; text-align: center; color: inherit; text-decoration: none; }
.book-frame { display: grid; place-items: center; width: 100%; aspect-ratio: 3 / 4; background: rgba(255,255,255,.06); border-radius: 10px; padding: 8px; }
.book-frame img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 8px 10px rgba(0,0,0,.45)); transition: transform .2s; }
.books-list a:hover img { transform: translateY(-3px); }
.books-list b { font-size: 15.5px; font-weight: 700; line-height: 1.25; margin-top: 2px; }
.books-list small { font-size: 11.5px; color: #B8BCD9; }
.books-btn { justify-self: start; background: #FFCC03; color: #1E1B1C; min-height: 40px; font-size: 15px; }

/* Thank-you fixes: sun clear of the details, equal book frames, compact phone view */
@media (min-width: 860px) {
  .ty-wrap > .reg-card::before { left: -70px; right: auto; top: auto; bottom: -90px; width: 200px; height: 200px; opacity: .85; }
  .ty-wrap > .reg-card::after { left: -150px; right: auto; top: auto; bottom: 10px; }
}
.book-frame { position: relative; display: block; padding: 0; }
.book-frame img { position: absolute; inset: 8px; width: calc(100% - 16px); height: calc(100% - 16px); }
.lbl-short { display: none; }
@media (max-width: 559px) {
  .lbl-long { display: none; }
  .lbl-short { display: inline; }
  .ty-bar { flex-wrap: nowrap; justify-content: center; }
  .ty-wrap > .reg-card .rc-foot { display: none; }
  .ty-wrap > .reg-card { padding: 18px 16px; gap: 10px; }
  .ty-hero { padding-bottom: 50px; }
}
.card-capture .reg-card { aspect-ratio: 4 / 5; }
.card-capture .rc-grid { margin-top: auto; }
@media (min-width: 860px) { .ty-wrap > .reg-card::before, .ty-wrap > .reg-card::after { display: none; } }
.nowrap { white-space: nowrap; }

/* Membership offers (renew when expired / due soon, become a member): clearly highlighted */
.member-offer { display: grid; gap: 8px; margin: 2px 0 8px; padding: 14px 16px 16px; border-radius: 14px;
  background: linear-gradient(135deg, #FFF3BF 0%, #FFE58A 100%); border: 1.5px solid #E6B400; border-left: 6px solid #C99700;
  box-shadow: 0 10px 24px -18px rgba(150,110,0,.9); color: #1E1B1C; }
.member-offer .mo-head { display: flex; align-items: center; gap: 8px; }
.member-offer .mo-head .ico { width: 22px; height: 22px; color: #B27F00; flex: none; }
.member-offer h3 { margin: 0; font-family: var(--font-display); font-size: 17px; font-weight: 800; line-height: 1.3; color: #14183A; }
.member-offer p { margin: 0; font-size: 14.5px; line-height: 1.55; color: #3B3320; }
.mo-check { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border-radius: 12px; background: #fff; border: 2px solid #14183A; cursor: pointer; }
.mo-check input { width: 22px; height: 22px; margin: 2px 0 0; accent-color: #14183A; flex: none; }
.mo-check span { display: grid; gap: 2px; }
.mo-check b { font-size: 15.5px; }
.mo-check small { color: #5A5E7A; font-size: 13px; }
.member-offer .btn-row { align-items: center; }
.member-offer .btn-primary { min-height: 44px; font-size: 15px; background: #14183A; color: #FFCC03; }
.member-offer .link-btn { color: #14183A; opacity: .9; font-weight: 600; }

.ty-renewed { margin-top: 8px !important; display: inline-block; background: #FFCC03; color: #1E1B1C !important; font-weight: 700; padding: 6px 12px; border-radius: 999px; font-size: 14px !important; }

/* A guest's Brights membership inside the guest card */
.guest-member:empty { display: none; }
.mo-guest { padding: 12px 14px; margin: 0; }
.mo-guest h4 { margin: 0; font-size: 15px; font-weight: 800; color: #14183A; line-height: 1.3; }
.mo-guest p { font-size: 13.5px; }
.guest-member-ok { margin: 0; padding: 8px 12px; border-radius: 10px; background: #FFF3BF; border-left: 5px solid #C99700; font-weight: 700; font-size: 14px; color: #14183A; }

/* Accommodation availability message (top of the form) */
.accom-note { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 16px; padding: 12px 14px; border-radius: 14px; border: 1.5px solid #E2B33C; background: #FFF6DA; color: #4A3500; font-weight: 600; line-height: 1.45; }
.accom-note .ico { width: 22px; height: 22px; flex: none; margin-top: 1px; }
.accom-note.info { border-color: #B8C4E6; background: #EEF2FC; color: #1F2A55; font-weight: 500; }
.accom-note[hidden] { display: none; }

/* Searchable City / District lists */
.fld.has-combo { position: relative; }
.combo-list { position: absolute; left: 0; right: 0; z-index: 40; margin: 0; padding: 4px; list-style: none; max-height: 264px; overflow-y: auto; background: #fff; color: #14183A; border: 1.5px solid var(--card-line, #D9DCEA); border-radius: 12px; box-shadow: 0 14px 30px -12px rgba(11, 15, 42, .35); }
.combo-list[hidden] { display: none; }
.combo-list li { display: flex; justify-content: space-between; gap: 10px; padding: 9px 10px; border-radius: 8px; cursor: pointer; font-size: 15px; }
.combo-list li small { color: #6B7092; font-size: 13px; white-space: nowrap; }
.combo-list li:hover, .combo-list li[aria-selected="true"] { background: #EEF0F8; }

/* Hidden fields stay hidden even where the layout sets display */
.reg-main .fld[hidden], .reg-main fieldset.seg[hidden] { display: none !important; }

/* In place of the accommodation question when it is not offered */
.accom-inline .accom-inline-l { display: block; font-weight: 700; font-size: 14px; margin-bottom: 6px; }
.accom-inline p { margin: 0; padding: 12px 14px; border-radius: 12px; border: 1.5px solid #E2B33C; background: #FFF6DA; color: #4A3500; font-weight: 600; font-size: 14.5px; line-height: 1.4; }
.reg-main .accom-inline[hidden] { display: none !important; }

/* Thank-you card while the registration number is still to come (manual capture) */
.reg-card .rc-grid .big b.rc-later { font-size: 14px !important; line-height: 1.3; letter-spacing: 0; white-space: normal; overflow-wrap: anywhere; font-family: inherit; }

/* Fields in a row keep their own height; messages go below the row (see register.js) */
.reg-main .fld-row { align-items: start; }
.row-errs { display: grid; gap: 3px; margin-top: -6px; }
.row-errs .fld-err { margin: 0; font-size: 13.5px; line-height: 1.4; }
.row-errs .fld-err b { font-weight: 700; }
.guests-err { margin: 0; }

/* Full-screen layer while the payment window opens / the payment is being confirmed */
.pay-layer { position: fixed; inset: 0; z-index: 9000; display: grid; place-items: center; padding: 24px; background: rgba(11, 15, 42, .72); backdrop-filter: blur(2px); }
.pay-layer[hidden] { display: none; }
.pay-layer-in { display: flex; align-items: center; gap: 14px; max-width: 360px; padding: 18px 22px; border-radius: 16px; background: #fff; color: #14183A; font-weight: 600; box-shadow: 0 20px 50px -20px rgba(0, 0, 0, .6); }
.pay-layer-in p { margin: 0; line-height: 1.4; }
.pay-layer .spin { flex: none; width: 22px; height: 22px; border-width: 3px; border-color: #D9DCEA; border-top-color: #14183A; }

/* Accommodation question with longer answers ("Yes, I would like help …"): one answer per line */
.seg.seg-stack label { flex: 1 1 100%; }
.seg.seg-stack span { justify-content: flex-start; text-align: left; padding: 10px 14px; min-height: 46px; }
.accom-intro { margin: 0; font-size: 14px; color: var(--card-muted); line-height: 1.5; }
.reg-main .accom-intro[hidden] { display: none; }
.ty-accom { margin: 8px 0 0; padding: 8px 12px; border-radius: 10px; background: rgba(255, 204, 3, .14); border: 1px solid rgba(255, 204, 3, .45); color: #FFE9A6; font-weight: 600; font-size: 14.5px; max-width: 760px; }

/* Optional donation field on the registration form (looks like the other choice fields) */
.seg.seg-donate label { flex: 1 1 140px; }
.reg-main [data-donate-other][hidden] { display: none; }
.reg-donate h2 .opt { font: 500 14px var(--font-body); color: var(--card-muted); }
.reg-card .rc-thanks { margin: 6px 0 0; font-size: 13.5px; font-weight: 600; color: #FFCC03; }
.ty-donated { margin: 8px 0 0; padding: 8px 12px; border-radius: 10px; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .25); color: #F6F4EC; font-weight: 600; font-size: 14.5px; max-width: 760px; }

/* Thank-you page without the donation box (donation on the form): the books banner uses the full width */
.ty-extras > .books:only-child { grid-column: 1 / -1; }
.ty-extras > .books:only-child .books-list { max-width: 560px; }
/* Books on their own (full width): centred, so there is no empty space on the right */
.ty-extras > .books:only-child { justify-items: center; text-align: center; }
.ty-extras > .books:only-child .books-list { width: 100%; margin-inline: auto; }
.ty-extras > .books:only-child .books-btn { justify-self: center; }
@media (max-width: 859px) { .books-btn { justify-self: center; } }

/* One accommodation question below the guests: bold question, explanation, two answers side by side */
.seg.seg-accom legend { font-weight: 800; font-size: 16px; color: var(--card-fg); margin-bottom: 4px; }
.seg.seg-accom .accom-intro { flex: 1 1 100%; margin: 0 0 6px; font-size: 14px; line-height: 1.5; color: var(--card-muted); }
.seg.seg-accom label { flex: 1 1 220px; }
.seg.seg-accom span { min-height: 52px; padding: 8px 12px; }
.reg-main .seg.seg-accom[hidden] { display: none !important; }
.reg-donate [data-donate-clear][hidden] { display: none; }

/* Terms with section headings and bullet points ("## 1. Heading", "- point") */
.doc-h { margin: 14px 0 6px; font-size: 15.5px; line-height: 1.45; color: var(--card-fg, #14183A); }
.doc-body > .doc-h:first-child { margin-top: 0; }
.doc-bullets { margin: 0 0 4px; padding-left: 22px; display: grid; gap: 6px; }
.doc-bullets li { line-height: 1.6; font-size: 15.5px; }
.doc-bullets li::marker { color: #2E3EA8; }

/* Meal answers: small price line under the answer ("+ ₹1,000", "Registration fee only") */
.seg span:has(.seg-hint) { flex-direction: column; gap: 1px; line-height: 1.2; }
.seg-hint { display: block; font-size: 12px; font-weight: 500; line-height: 1.2; opacity: .8; white-space: nowrap; }
.seg-hint:empty { display: none; }

/* ---------- Entry and meal cards: download list on the thank-you page ---------- */
.ty-cards { display: grid; gap: 8px; }
.ty-cards h2 { margin: 0; font-size: 19px; }
.ty-card-list { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 8px; }
.ty-card-list li { display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border: 1px solid var(--card-line); border-radius: 12px; background: #FBFBFE; }
.ty-card-list li > span { display: grid; gap: 1px; min-width: 0; flex: 1 1 auto; }
.ty-card-list li > span b { overflow-wrap: anywhere; }
.ty-card-list .pill { flex: none; white-space: nowrap; }
.ty-card-list small { font-size: 13px; color: var(--card-muted, #5A5E7A); }
.ty-card-list .pill { text-decoration: none; }

/* Pay bar on phones: never wider than the screen, button never pushed against the edge
   (larger system font sizes, landscape with a notch, long amounts) */
.paybar { box-sizing: border-box; width: 100%; max-width: 100vw; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.paybar > div { min-width: 0; overflow: hidden; }
.paybar b { white-space: nowrap; }
.paybar .btn { flex: none; }

/* Meal question: what is included (tea / coffee for everyone, what the meals are) */
.meal-info { list-style: none; margin: 10px 0 0; padding: 10px 14px; display: grid; gap: 8px; border-radius: 12px; background: #FFF8DC; border: 1px solid #F2D27A; color: #3A2E00; font-size: 14px; line-height: 1.5; }
.meal-info li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 8px; align-items: start; }
.mi-ico { font-size: 16px; line-height: 1.35; text-align: center; }
.meal-info b { color: #14183A; }


/* Very narrow phones (≤ 340 px): Details / WhatsApp / Download buttons share the width instead of
   pushing the page wider than the screen */
@media (max-width: 340px) {
  .ty-bar { flex-wrap: wrap !important; gap: 6px; }
  .ty-bar .pill { padding-left: 10px; padding-right: 10px; }
}

/* IUCAA fee waiver: application page (/iucaa-waiver) */
.waiver-intro { margin: 0; font-size: 15.5px; line-height: 1.55; }
.waiver-form .en-note { margin: 0; }
.waiver-type label { min-width: 150px; }
.waiver-done h2 { line-height: 1.25; }
.waiver-done p { margin: 0; line-height: 1.55; }
.waiver-done .btn { justify-self: start; }

/* Thank-you page: WhatsApp and Download next to each entry and meal card (QR) */
.ty-card-list li > .ty-card-btns { display: inline-flex; flex: none; gap: 6px; min-width: auto; }
.ty-card-btns .pill { gap: 6px; }
@media (max-width: 400px) {
  .ty-card-btns .pill { padding-left: 11px; padding-right: 11px; }
  .ty-card-btns .lbl { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}

/* Pricing box: "Early bird" label next to the price */
.sum-price { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.sum-early { display: inline-block; padding: 2px 8px; border-radius: 999px; background: #FFF4C2; color: #7A5600; font: 700 11.5px/1.4 var(--font-body); letter-spacing: .02em; text-transform: uppercase; }