@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600&family=Instrument+Serif:ital@0;1&display=swap");

:root {
  --ink: #0c1715;
  --paper: #f7f8f3;
  --blue: #2e8de0;
  --green: #31d46a;
  --mint: #c8f4dc;
  --line: rgba(12, 23, 21, .16);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "DM Sans", sans-serif; }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }

.ticket-header {
  height: 104px;
  padding: 0 4.5vw;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
}
.ticket-brand { display: flex; align-items: center; gap: 13px; font: 16px/1.04 "Instrument Serif", serif; text-transform: uppercase; letter-spacing: .055em; }
.ticket-brand-disc { width: 47px; aspect-ratio: 1; display: block; overflow: hidden; border-radius: 50%; background: #fff; }
.ticket-brand-disc img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.56); }
.back-link { display: flex; align-items: center; gap: 12px; font-size: 13px; }
.back-link span { font-size: 20px; transition: transform .25s ease; }
.back-link:hover span { transform: translateX(-4px); }

main { padding: 0 4.5vw 110px; }
.ticket-intro { min-height: 420px; padding: 92px 0 70px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(260px, .75fr); align-items: end; gap: 4vw; border-bottom: 1px solid var(--line); }
.eyebrow, .section-number { margin: 0 0 24px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .15em; }
.ticket-intro .eyebrow { grid-column: 1 / -1; align-self: start; }
.ticket-intro h1 { margin: 0; font: clamp(68px, 9vw, 142px)/.78 "Instrument Serif", serif; letter-spacing: -.045em; }
.ticket-intro h1 em { font-weight: 400; color: var(--blue); }
.intro-copy { max-width: 460px; margin: 0 0 8px; font-size: clamp(16px, 1.4vw, 20px); line-height: 1.55; }
.mobile-ticket-nav { display: none; }

.booking-layout { padding-top: 80px; display: grid; grid-template-columns: minmax(620px, 1fr) 310px; align-items: start; gap: clamp(24px, 4vw, 64px); }
.plan-card { min-width: 0; }
.plan-heading { margin-bottom: 28px; display: flex; justify-content: space-between; align-items: end; gap: 30px; }
.plan-heading .section-number { margin-bottom: 10px; color: rgba(12,23,21,.56); }
.plan-heading h2 { margin: 0; font: clamp(34px, 4vw, 56px)/1 "Instrument Serif", serif; }
.legend { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 19px; font-size: 13px; font-weight: 500; }
.legend span { display: inline-flex; align-items: center; gap: 7px; }
.legend-seat { width: 15px; height: 15px; display: inline-block; border-radius: 50% 50% 4px 4px; }
.legend-seat.category-one { background: #2e8de0; border: 1px solid #1769ae; }
.legend-seat.category-two { background: #f2b84b; border: 1px solid #b97a08; }
.legend-seat.category-three { background: #31b96b; border: 1px solid #167c43; }
.legend-seat.selected { background: #ffe45c; border: 1px solid #7d6910; box-shadow: 0 0 0 2px rgba(255,228,92,.3); }
.legend-seat.held { background: #c3c8c6; border: 1px dashed #747b79; }
.legend-seat.reserved { background: #a4aaa8; border: 1px solid #747b79; }

.church-plan { position: relative; height: min(78vh, 900px); min-height: 620px; overflow: hidden; border: 1px solid var(--line); border-radius: 42px; background: rgba(255,255,255,.7); box-shadow: 0 30px 80px rgba(12,23,21,.06); cursor: grab; touch-action: none; user-select: none; }
.church-plan.is-dragging { cursor: grabbing; }
body.map-expanded { overflow: hidden; }
.church-plan.is-expanded { position: fixed; z-index: 1000; inset: 0; width: 100vw; height: 100dvh; min-height: 0; border: 0; border-radius: 0; background: var(--paper); }
.church-plan.is-expanded .map-controls { top: 20px; right: 20px; }
body.map-expanded .selection-card { position: fixed; z-index: 1002; top: 20px; right: 20px; width: 310px; max-height: calc(100dvh - 40px); margin: 0; overflow-y: auto; scrollbar-width: none; box-shadow: 0 28px 80px rgba(12,23,21,.28); }
body.map-expanded .selection-card::-webkit-scrollbar { display: none; }
body.map-expanded .church-plan.is-expanded .map-controls { right: 350px; }
.seat-map { width: 100%; height: 100%; display: block; user-select: none; }
.church-outline { fill: rgba(255,255,255,.34); stroke: rgba(46,141,224,.2); stroke-width: 1.5; }
.vector-stage { fill: var(--ink); stroke: rgba(12,23,21,.3); stroke-width: 1.5; }
.vector-stage-title { fill: #fff; font: 28px "Instrument Serif", serif; text-anchor: middle; }
.vector-stage-subtitle { fill: rgba(255,255,255,.62); font: 9px "DM Sans", sans-serif; text-anchor: middle; text-transform: uppercase; letter-spacing: 1.5px; }
.vector-area-label, .vector-entry-label, .vector-row-label { fill: rgba(12,23,21,.5); font-family: "DM Sans", sans-serif; text-anchor: middle; text-transform: uppercase; }
.vector-area-label { font-size: 11px; font-weight: 600; letter-spacing: 1.5px; }
.vector-entry-label { fill: rgba(12,23,21,.76); font-size: 10px; font-weight: 600; letter-spacing: 1px; }
.vector-row-label { font-size: 9px; }
.vector-aisle { stroke: rgba(12,23,21,.13); stroke-width: 1; stroke-dasharray: 4 8; }
.vector-entry-line { stroke: rgba(12,23,21,.25); stroke-width: 2; }
.vector-entry-marker { fill: rgba(247,248,243,.96); stroke: rgba(12,23,21,.3); stroke-width: 1.5; stroke-dasharray: 5 3; }
.vector-bench { fill: rgba(255,255,255,.6); stroke: rgba(12,23,21,.2); stroke-width: 1; }
.vector-seat { cursor: pointer; outline: none; }
.vector-seat .seat-shape { stroke-width: 1.4; transition: fill .18s ease, stroke .18s ease, transform .18s ease; transform-box: fill-box; transform-origin: center; }
.vector-seat .seat-number { fill: #555f5c; stroke: rgba(255,255,255,.72); stroke-width: .8px; paint-order: stroke fill; font: 800 7px "DM Sans", sans-serif; text-anchor: middle; dominant-baseline: middle; pointer-events: none; }
.vector-seat .seat-foot { fill: none; stroke: rgba(12,23,21,.34); stroke-width: 2.5; stroke-linecap: round; }
.vector-seat.category-one .seat-shape { fill: #2e8de0; stroke: #1769ae; }
.vector-seat.category-two .seat-shape { fill: #f2b84b; stroke: #b97a08; }
.vector-seat.category-three .seat-shape { fill: #31b96b; stroke: #167c43; }
.vector-seat:hover .seat-shape { transform: translateY(-2px); stroke: var(--ink); stroke-width: 2; }
.vector-seat:focus-visible .seat-shape { stroke: var(--ink); stroke-width: 3; }
.vector-seat[aria-pressed="true"] .seat-shape { fill: #ffe45c; stroke: #7d6910; stroke-width: 2; }
.vector-seat.is-reserved, .vector-seat.is-held { cursor: not-allowed; }
.vector-seat.is-reserved .seat-shape { fill: #a4aaa8; stroke: #747b79; opacity: .8; }
.vector-seat.is-held .seat-shape { fill: #c3c8c6; stroke: #747b79; stroke-dasharray: 3 2; opacity: .86; }
.vector-seat.is-reserved:hover .seat-shape, .vector-seat.is-held:hover .seat-shape { transform: none; stroke-width: 1.4; }
.apse { position: absolute; z-index: 0; top: 25px; left: 656px; width: 800px; height: 150px; transform: translateX(-50%); border: 1px solid rgba(46,141,224,.15); border-radius: 50% 50% 16px 16px; background: radial-gradient(circle at 50% 30%, rgba(49,212,106,.16), transparent 65%); }
.map-controls { position: absolute; z-index: 10; top: 18px; right: 18px; padding: 5px; display: flex; gap: 4px; border: 1px solid rgba(12,23,21,.13); border-radius: 999px; background: rgba(247,248,243,.92); box-shadow: 0 8px 24px rgba(12,23,21,.12); backdrop-filter: blur(10px); }
.map-controls button { min-width: 38px; height: 38px; padding: 0 12px; border: 0; border-radius: 999px; background: transparent; cursor: pointer; font-size: 18px; }
.map-controls button[data-map-fit] { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; }
.map-controls button:hover { background: rgba(12,23,21,.08); }
.map-controls button:focus-visible { outline: 2px solid var(--blue); outline-offset: 1px; }
.stage { position: relative; z-index: 1; width: 440px; min-height: 82px; margin: 0 0 58px 378px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px solid rgba(12,23,21,.22); border-radius: 50% 50% 12px 12px; background: var(--ink); color: #fff; box-shadow: 0 15px 40px rgba(12,23,21,.16); }
.stage::after { content: ""; position: absolute; left: 8%; right: 8%; bottom: -9px; height: 8px; border: 1px solid rgba(12,23,21,.2); border-top: 0; border-radius: 0 0 8px 8px; }
.stage-mark { position: absolute; left: 25px; font: 32px "Instrument Serif", serif; color: var(--green); }
.stage strong { font: 27px "Instrument Serif", serif; font-weight: 400; }
.stage small { margin-top: 4px; opacity: .6; font-size: 9px; text-transform: uppercase; letter-spacing: .15em; }
.seating-labels { width: 980px; display: grid; grid-template-columns: 1fr 72px 1fr; margin: 0 0 18px 108px; color: rgba(12,23,21,.48); font-size: 9px; text-align: center; text-transform: uppercase; letter-spacing: .12em; }
.seating { position: relative; z-index: 1; width: 1196px; display: grid; grid-template-columns: 92px 980px 92px; align-items: start; gap: 16px; }
.main-seating { min-width: 0; display: flex; flex-direction: column; gap: 11px; }
.category-zone { position: relative; padding: 0; display: flex; flex-direction: column; gap: 11px; border: 0; border-radius: 0; background: none; box-shadow: none; backdrop-filter: none; }
.category-zone-one, .category-zone-three { border: 0; background: none; box-shadow: none; }
.category-zone-two { margin-top: 45px; border: 0; background: none; box-shadow: none; }
.category-zone-label { display: none; }
.category-zone-label span { font-size: 9px; font-weight: 500; opacity: .58; }
.seat-row { display: grid; grid-template-columns: 24px minmax(205px, 1fr) minmax(205px, 1fr) minmax(72px, .36fr) minmax(205px, 1fr) minmax(205px, 1fr) 24px; align-items: center; gap: 10px; }
.row-label { color: rgba(12,23,21,.45); font-size: 9px; text-align: center; }
.seat-row .row-label:last-child { grid-column: 7; }
.aisle { grid-column: 4; height: 100%; position: relative; }
.aisle::after { content: ""; position: absolute; left: 50%; top: -6px; bottom: -6px; width: 1px; background: linear-gradient(to bottom, transparent, rgba(12,23,21,.13), transparent); }
.bench { position: relative; min-width: 205px; padding: 5px 7px 8px; display: grid; grid-template-columns: repeat(6, 25px); justify-content: space-between; align-items: center; gap: 5px; border: 1px solid rgba(12,23,21,.22); border-radius: 8px 8px 4px 4px; background: rgba(255,255,255,.48); box-shadow: 0 3px 0 rgba(12,23,21,.1); }
.bench::after { content: ""; position: absolute; left: 5px; right: 5px; bottom: 3px; height: 2px; border-radius: 2px; background: rgba(12,23,21,.16); }
.category-zone-one .bench { border-color: rgba(23,105,174,.48); background: rgba(255,255,255,.48); }
.category-zone-two .bench { border-color: rgba(185,122,8,.48); background: rgba(255,255,255,.5); }
button.seat {
  position: relative;
  width: 25px;
  max-width: 25px;
  aspect-ratio: 1;
  justify-self: center;
  border: 1px solid rgba(12,23,21,.22);
  border-radius: 50% 50% 7px 7px;
  background: #fff;
  color: var(--ink);
  cursor: pointer;
  font: 800 7px "DM Sans", sans-serif;
  line-height: 1;
  padding: 0;
  text-shadow: 0 1px 0 rgba(255,255,255,.72);
  transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
button.seat::after { content: ""; position: absolute; left: 16%; right: 16%; bottom: -4px; height: 4px; border-radius: 0 0 3px 3px; background: rgba(12,23,21,.18); }
button.seat:hover { z-index: 2; transform: translateY(-3px); border-color: var(--blue); box-shadow: 0 7px 15px rgba(46,141,224,.15); }
button.seat:focus-visible { outline: 3px solid rgba(46,141,224,.3); outline-offset: 2px; }
button.seat[aria-pressed="true"] { background: var(--green); border-color: #159d46; box-shadow: 0 7px 15px rgba(49,212,106,.22); }
button.seat.category-one { background: #2e8de0; border-color: #1769ae; }
button.seat.category-two { background: #f2b84b; border-color: #b97a08; }
button.seat.category-three { background: #31b96b; border-color: #167c43; }
button.seat.category-one[aria-pressed="true"],
button.seat.category-two[aria-pressed="true"],
button.seat.category-three[aria-pressed="true"] { background: #ffe45c; border-color: #7d6910; box-shadow: 0 0 0 3px rgba(255,228,92,.38); }
button.seat, button.seat[aria-pressed="true"], button.seat.is-reserved, button.seat.is-held { color: #555f5c; }
button.seat.is-reserved, button.seat.is-reserved:hover, button.seat.is-reserved:disabled { background: #a4aaa8; border-color: #747b79; box-shadow: none; cursor: not-allowed; transform: none; opacity: .78; }
button.seat.is-held, button.seat.is-held:hover, button.seat.is-held:disabled { background: #c3c8c6; border: 1px dashed #747b79; box-shadow: none; cursor: not-allowed; transform: none; opacity: .82; }
.side-column { min-width: 0; padding-top: 0; display: flex; flex-direction: column; gap: 9px; }
.side-seating { position: relative; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 38px; align-items: center; align-content: start; gap: 11px 4px; border: 0; border-radius: 0; background: none; box-shadow: none; }
.side-seating-front, .side-seating-rear { height: max-content; }
.side-seating-label { display: none; }
.side-seating .seat { justify-self: center; }
.side-entrance { position: relative; z-index: 3; height: 38px; margin-top: 3px; padding: 0 4px; display: flex; align-items: center; justify-content: center; gap: 5px; border-block: 1px solid rgba(12,23,21,.2); background: rgba(247,248,243,.94); color: rgba(12,23,21,.66); font-size: 7px; font-weight: 600; line-height: 1; white-space: nowrap; text-align: center; text-transform: uppercase; letter-spacing: .04em; }
.side-entrance::before { content: none; }
.church-entrance { width: 140px; margin: 38px auto 0; padding-top: 12px; border-top: 3px double rgba(12,23,21,.22); color: rgba(12,23,21,.45); font-size: 9px; text-align: center; text-transform: uppercase; letter-spacing: .15em; }

.selection-card { position: sticky; top: 24px; margin-top: 75px; padding: 30px; border: 1px solid var(--line); border-radius: 20px; background: var(--ink); color: #fff; }
.basket-heading { margin-bottom: 28px; display: flex; align-items: center; justify-content: space-between; }
.selection-card .section-number { margin: 0; opacity: .55; }
.clear-selection { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; background: transparent; color: #fff; cursor: pointer; transition: border-color .2s ease, background .2s ease, transform .2s ease; }
.clear-selection:hover:not(:disabled) { border-color: #ff8e76; background: rgba(255,95,61,.15); transform: scale(1.05); }
.clear-selection:disabled { cursor: not-allowed; opacity: .25; }
.selection-count { display: flex; align-items: end; gap: 12px; padding-bottom: 25px; border-bottom: 1px solid rgba(255,255,255,.18); }
.selection-count strong { font: 72px/.72 "Instrument Serif", serif; color: var(--green); }
.selection-count span { max-width: 100px; font-size: 12px; line-height: 1.25; }
.selection-timer { padding: 17px 0; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255,255,255,.18); }
.selection-timer[hidden] { display: none; }
.selection-timer span { max-width: 130px; color: rgba(255,255,255,.58); font-size: 10px; line-height: 1.3; text-transform: uppercase; letter-spacing: .08em; }
.selection-timer strong { font: 30px "Instrument Serif", serif; font-weight: 400; color: var(--green); font-variant-numeric: tabular-nums; transition: color .25s ease; }
.selection-timer.is-warning strong { color: #ffe45c; }
.selection-timer.is-danger strong { color: #ff6d52; }
.selection-timer.is-critical strong { animation: timerAlert .8s ease-in-out infinite alternate; }
@keyframes timerAlert {
  from { opacity: 1; transform: scale(1); }
  to { opacity: .3; transform: scale(1.06); }
}
.availability { padding: 20px 0; display: grid; gap: 9px; border-bottom: 1px solid rgba(255,255,255,.18); }
.availability > p { margin: 0 0 4px; color: rgba(255,255,255,.5); font-size: 9px; text-transform: uppercase; letter-spacing: .13em; }
.availability > div { display: flex; align-items: center; justify-content: space-between; font-size: 11px; }
.availability > div span { display: flex; align-items: center; gap: 8px; }
.availability > div strong { font: 20px "Instrument Serif", serif; font-weight: 400; }
.availability .reserved-summary { margin-bottom: 10px; padding: 0 0 15px; border-bottom: 1px solid rgba(255,255,255,.12); }
.availability .reserved-summary strong { color: #c5cac8; font-size: 28px; }
.availability-dot { width: 9px; height: 9px; border-radius: 50%; }
.availability-dot.category-one { background: #2e8de0; }
.availability-dot.category-two { background: #f2b84b; }
.availability-dot.category-three { background: #31b96b; }
.availability-dot.reserved { background: #a4aaa8; }
.selection-list { min-height: 130px; padding: 24px 0; font-size: 12px; line-height: 1.6; }
.selection-list p { margin: 0; opacity: .55; }
.selection-list { display: flex; flex-direction: column; gap: 18px; }
.basket-category { padding-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,.12); }
.basket-category:last-child { padding-bottom: 0; border-bottom: 0; }
.basket-category-heading { margin-bottom: 9px; display: flex; align-items: baseline; justify-content: space-between; }
.basket-category-heading strong { font-size: 11px; text-transform: uppercase; letter-spacing: .09em; }
.basket-category-heading span { color: var(--green); font-size: 11px; }
.selection-list ul { max-height: 130px; margin: 0; padding: 0; overflow: auto; display: flex; flex-wrap: wrap; gap: 7px; list-style: none; }
.selection-list li { padding: 6px 8px; border: 1px solid rgba(255,255,255,.18); border-radius: 7px; }
.selection-list li span { display: block; margin-top: 1px; color: var(--green); font-size: 9px; }
.selection-total { margin-bottom: 20px; padding-top: 18px; display: flex; align-items: baseline; justify-content: space-between; border-top: 1px solid rgba(255,255,255,.18); }
.selection-total span { font-size: 11px; text-transform: uppercase; letter-spacing: .12em; opacity: .55; }
.selection-total strong { font: 30px "Instrument Serif", serif; font-weight: 400; }
.buyer-form { margin-bottom: 18px; padding: 18px; border: 1px solid rgba(255,255,255,.18); border-radius: 15px; background: rgba(255,255,255,.06); }
.buyer-form[hidden] { display: none; }
.buyer-form > p { margin: 0 0 14px; font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; }
.buyer-form label { display: grid; gap: 6px; margin-bottom: 11px; color: rgba(255,255,255,.68); font-size: 9px; font-weight: 600; text-transform: uppercase; letter-spacing: .07em; }
.buyer-name-row { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.buyer-form input[type="text"], .buyer-form input[type="email"] { min-width: 0; width: 100%; padding: 11px 12px; border: 1px solid rgba(255,255,255,.2); border-radius: 9px; background: rgba(255,255,255,.08); color: #fff; font: 13px "DM Sans", sans-serif; text-transform: none; letter-spacing: 0; outline: none; }
.buyer-form input:focus { border-color: var(--green); box-shadow: 0 0 0 2px rgba(49,212,106,.18); }
.buyer-form .promo-field { margin-bottom: 5px; }
.promo-apply { align-self: start; margin: 4px 0 8px; padding: 9px 14px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--ink); cursor: pointer; font: inherit; }
.promo-apply:disabled { opacity: .6; cursor: wait; }
.buyer-form .promo-field > span { display: inline; margin-left: 4px; font-weight: 400; opacity: .7; text-transform: none; letter-spacing: 0; }
.buyer-form .promo-help { margin: 0 0 15px; color: #78827f; font-size: 11px; font-weight: 400; line-height: 1.4; text-transform: none; letter-spacing: 0; }
.buyer-form .privacy-consent { grid-template-columns: auto 1fr; align-items: start; gap: 9px; margin: 4px 0 14px; font-weight: 400; line-height: 1.4; text-transform: none; letter-spacing: 0; }
.privacy-consent input { margin: 2px 0 0; accent-color: var(--green); }
.helloasso-notice { margin: 8px 0 18px; padding: 18px; border: 1px solid rgba(46,141,224,.25); border-radius: 16px; background: #eef7fd; }
.helloasso-notice[hidden] { display: none; }
.helloasso-notice > p { margin: 0 0 14px; color: var(--ink); font-size: 13px; line-height: 1.65; }
.buyer-form .helloasso-notice .privacy-consent { margin-bottom: 0; }
.privacy-consent a { color: #176aa9; text-decoration: underline; text-underline-offset: 2px; }
.confirm-booking { width: 100%; padding: 13px 15px; display: flex; justify-content: space-between; border: 0; border-radius: 999px; background: var(--green); color: var(--ink); cursor: pointer; font-weight: 600; }
.confirm-booking:disabled { cursor: wait; opacity: .55; }
.continue-button { width: 100%; padding: 16px 18px; display: flex; align-items: center; justify-content: space-between; border: 0; border-radius: 999px; background: var(--green); color: var(--ink); cursor: pointer; font-weight: 600; }
.continue-button:disabled { cursor: not-allowed; opacity: .3; }
.booking-message { min-height: 18px; margin: 15px 4px 0; color: var(--green); font-size: 11px; line-height: 1.45; }
.booking-message.is-error { color: #ffad9b; }
.booking-confirmation { position: relative; margin-top: 16px; padding: clamp(28px,4vw,48px); overflow: hidden; border-radius: 28px; background: linear-gradient(145deg,#eafff0 0%,#dff9e8 55%,#f8fff9 100%); border: 1px solid rgba(49,212,106,.42); box-shadow: 0 24px 70px rgba(12,23,21,.1); }
.booking-confirmation::before { content: "✓"; width: 54px; height: 54px; margin-bottom: 22px; display: grid; place-items: center; border-radius: 50%; background: var(--green); color: var(--ink); font: 700 27px "DM Sans",sans-serif; box-shadow: 0 10px 30px rgba(49,212,106,.28); }
.booking-confirmation::after { content: ""; position: absolute; width: 180px; height: 180px; right: -70px; top: -75px; border-radius: 50%; border: 38px solid rgba(49,212,106,.1); pointer-events: none; }
.booking-confirmation[hidden] { display: none; }
.booking-confirmation > strong { position: relative; z-index: 1; display: block; color: var(--ink); font: clamp(34px,4vw,48px)/.95 "Instrument Serif",serif; font-weight: 400; }
.booking-confirmation p { position: relative; z-index: 1; max-width: 620px; margin: 14px 0 25px; color: #52705d; font-size: 14px; line-height: 1.6; }
.booking-confirmation [data-ticket-links] { position: relative; z-index: 1; display: grid; gap: 12px; }
.booking-confirmation a { min-height: 62px; padding: 17px 22px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid var(--ink); border-radius: 999px; background: var(--ink); color: #fff; font-size: 14px; font-weight: 600; box-shadow: 0 12px 28px rgba(12,23,21,.13); transition: transform .2s ease,background .2s ease,box-shadow .2s ease; }
.booking-confirmation a span:last-child { width: 30px; height: 30px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 50%; background: var(--green); color: var(--ink); font-size: 18px; }
.booking-confirmation a:hover { border-color: var(--ink); background: #192724; transform: translateY(-2px); box-shadow: 0 16px 34px rgba(12,23,21,.18); }
.demo-note { margin: 18px 4px 0; color: rgba(255,255,255,.48); font-size: 10px; line-height: 1.5; }

.booking-details { margin: 90px 0 0; padding: clamp(28px,5vw,68px); display: grid; grid-template-columns: minmax(260px,.8fr) minmax(360px,1.2fr); gap: clamp(35px,7vw,100px); border: 1px solid var(--line); border-radius: 34px; background: #fff; }
.booking-details[hidden] { display: none; }
.booking-details-heading .section-number { margin-bottom: 18px; color: rgba(12,23,21,.5); }
.booking-details-heading h2,.lost-ticket h2 { margin: 0; font: clamp(42px,5vw,68px)/.9 "Instrument Serif",serif; }
.booking-details-heading h2 em,.lost-ticket h2 em { color: var(--blue); font-weight: 400; }
.booking-details-heading > p:last-child { max-width: 380px; margin-top: 25px; color: #66716e; line-height: 1.55; }
.booking-details .buyer-form { margin: 0; padding: clamp(22px,3vw,36px); align-self: start; border-color: var(--line); background: var(--paper); }
.booking-details .buyer-form label { color: #66716e; font-size: 10px; }
.booking-details .buyer-form input[type="text"],.booking-details .buyer-form input[type="email"] { padding: 14px 15px; border-color: var(--line); background: #fff; color: var(--ink); font-size: 15px; }
.booking-details .privacy-consent { color: #66716e; }
.booking-details .booking-confirmation { grid-column: 1 / -1; width: 100%; margin: 0; align-self: start; }
.booking-details .booking-confirmation p { color: #52705d; }
.booking-details .booking-confirmation a { color: #fff; }

.lost-ticket { margin: 45px 0 0; padding: clamp(30px,5vw,65px); display: grid; grid-template-columns: minmax(260px,1fr) minmax(330px,.8fr); align-items: center; gap: clamp(35px,7vw,100px); border-radius: 34px; background: var(--ink); color: #fff; }
.lost-ticket .section-number { margin-bottom: 18px; color: rgba(255,255,255,.48); }
.lost-ticket h2 em { color: var(--green); }
.lost-ticket > div > p:last-child { max-width: 500px; color: rgba(255,255,255,.62); line-height: 1.6; }
.lost-ticket form { padding: clamp(20px,3vw,34px); border: 1px solid rgba(255,255,255,.16); border-radius: 20px; background: rgba(255,255,255,.06); }
.lost-ticket label { display: grid; gap: 8px; color: rgba(255,255,255,.65); font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; }
.lost-ticket input { width: 100%; padding: 15px; border: 1px solid rgba(255,255,255,.2); border-radius: 10px; background: rgba(255,255,255,.08); color: #fff; font: 15px "DM Sans",sans-serif; outline: none; }
.lost-ticket input:focus { border-color: var(--green); box-shadow: 0 0 0 2px rgba(49,212,106,.15); }
.lost-ticket button { width: 100%; margin-top: 14px; padding: 15px 17px; display: flex; justify-content: space-between; border: 0; border-radius: 999px; background: var(--green); color: var(--ink); cursor: pointer; font-weight: 600; }
.lost-ticket button:disabled { cursor: wait; opacity: .55; }
.lost-ticket [data-lost-ticket-message] { min-height: 18px; margin: 13px 3px 0; color: var(--green); font-size: 11px; line-height: 1.45; }

footer { min-height: 190px; padding: 44px 4.5vw; display: grid; grid-template-columns: auto minmax(150px,.6fr) minmax(420px,1.4fr) auto; align-items: center; gap: 28px; border-top: 1px solid var(--line); }
footer img { width: 58px; height: 58px; border-radius: 50%; object-fit: cover; transform: none; }
footer p { margin: 0; font: 18px/1.1 "Instrument Serif", serif; text-transform: uppercase; letter-spacing: .04em; }
footer p span { font: 10px "DM Sans", sans-serif; opacity: .5; }
footer small { opacity: .5; font-size: 10px; }
.ticket-footer-contacts { display: grid; grid-template-columns: 1fr 1fr; gap: 9px 20px; }
.ticket-footer-contacts a { font-size: 8px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.ticket-footer-contacts a span { display: block; margin-top: 3px; color: rgba(12,23,21,.5); font-size: 9px; font-weight: 400; text-transform: none; letter-spacing: 0; overflow-wrap: anywhere; }

@media (max-width: 980px) {
  .ticket-intro { grid-template-columns: 1fr; }
  .ticket-intro .eyebrow { grid-column: auto; }
  .booking-layout { grid-template-columns: 1fr; }
  .selection-card { position: static; margin-top: 0; }
  .booking-details,.lost-ticket { grid-template-columns: 1fr; }
  .booking-details .booking-confirmation { grid-column: auto; }
}

@media (max-width: 650px) {
  .ticket-header { height: 68px; padding: 0 14px; }
  .ticket-brand { font-size: 13px; }
  .ticket-brand-disc { width: 39px; }
  .back-link { font-size: 0; }
  .back-link span { font-size: 24px; }
  main { padding: 0 10px 30px; }
  .ticket-intro { min-height: 0; padding: 28px 4px 22px; display: block; }
  .ticket-intro .eyebrow { margin-bottom: 12px; }.ticket-intro h1 { font-size: 48px; line-height: .82; }.ticket-intro h1 br { display: none; }.ticket-intro .intro-copy { display: none; }
  .mobile-ticket-nav { position: sticky; z-index: 50; top: 0; margin: 0 -10px; padding: 8px 10px; display: grid; grid-template-columns: 1fr 1fr; gap: 5px; border-bottom: 1px solid var(--line); background: rgba(247,248,243,.96); backdrop-filter: blur(12px); }
  .mobile-ticket-nav button { padding: 11px; border: 0; border-radius: 999px; background: transparent; font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .07em; }.mobile-ticket-nav button[aria-pressed="true"] { background: var(--ink); color: #fff; }.mobile-ticket-nav strong { min-width: 19px; height: 19px; margin-left: 5px; display: inline-grid; place-items: center; border-radius: 50%; background: var(--green); color: var(--ink); font-size: 9px; }
  .booking-layout { padding-top: 14px; display: block; }
  body:not(.ticket-basket-view) .selection-card { display: none; } body.ticket-basket-view .plan-card { display: none; }
  .plan-heading { padding: 0 8px; align-items: start; flex-direction: column; }
  .legend { justify-content: flex-start; }
  .legend { gap: 13px; font-size: 12px; }
  .church-plan { height: calc(100dvh - 235px); min-height: 430px; border-radius: 20px; }
  .plan-canvas { width: 1312px; padding: 102px 58px 38px; }
  .stage { width: 440px; min-height: 82px; margin: 0 0 58px 378px; }
  .apse { left: 656px; width: 800px; }
  .stage-mark { left: 15px; }
  .seat-row { grid-template-columns: 24px minmax(205px, 1fr) minmax(205px, 1fr) minmax(72px, .36fr) minmax(205px, 1fr) minmax(205px, 1fr) 24px; gap: 10px; }
  .bench { min-width: 205px; padding: 5px 7px 8px; grid-template-columns: repeat(6, 25px); gap: 5px; border-radius: 8px 8px 4px 4px; }
  .seat { width: 25px; max-width: 25px; }
  .seating { width: 1196px; min-width: 1196px; grid-template-columns: 92px 980px 92px; gap: 16px; }
  .main-seating { gap: 11px; }
  .category-zone-two { margin-top: 45px; }
  .category-zone { padding: 0; gap: 11px; border-radius: 0; }
  .side-seating { padding: 0; grid-auto-rows: 38px; gap: 11px 4px; border-radius: 0; }
  .side-column { padding-top: 0; }
  .side-entrance { margin-top: 3px; }
  .seat, .side-seating .seat { width: 25px; max-width: 25px; }
  .seating-labels { width: 980px; min-width: 980px; grid-template-columns: 1fr 72px 1fr; margin: 0 0 18px 108px; }
  .map-controls { top: 10px; right: 10px; }
  .church-plan.is-expanded { height: 100dvh; min-height: 0; border-radius: 0; }
  body.map-expanded .selection-card { top: auto; right: 10px; bottom: 10px; left: 10px; width: auto; max-height: 40dvh; padding: 20px; border-radius: 18px; }
  body.map-expanded .church-plan.is-expanded .map-controls { top: 10px; right: 10px; }
  .selection-card { margin: 0; padding: 22px; border-radius: 19px; }.selection-list { min-height: 80px; }.basket-heading { margin-bottom: 20px; }.selection-count strong { font-size: 58px; }
  .booking-details,.lost-ticket { margin-top: 25px; padding: 26px 20px; border-radius: 22px; }
  .buyer-name-row { grid-template-columns: 1fr; gap: 0; }
  footer { grid-template-columns: auto 1fr; padding: 35px 20px; }
  .ticket-footer-contacts { grid-column: 1 / -1; }
  footer small { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
  .selection-timer.is-critical strong { animation: none !important; }
}
.child-tariff-note{font-size:12px;line-height:1.6;color:#476858;margin:18px 0}.selection-list .basket-seat-tariff{display:flex;flex-direction:column;gap:6px;margin:10px 0;min-width:0}.basket-seat-tariff select{width:100%;max-width:100%;padding:8px;border:1px solid #ccdcd2;border-radius:6px;background:#fff;color:#173b39;font:inherit;font-size:12px}.basket-seat-tariff select:focus-visible{outline:2px solid #2e8de0;outline-offset:2px}