:root {
  --ink: #111318;
  --ink-soft: #252a32;
  --paper: #fafaf7;
  --white: #ffffff;
  --magenta: #e72b8b;
  --magenta-dark: #bd176b;
  --lime: #c7d92d;
  --cyan: #22b8c7;
  --muted: #6e7480;
  --line: #e4e4df;
  --success: #14805e;
  --danger: #bd3245;
  --background: var(--paper);
  --foreground: var(--ink);
  --card: var(--white);
  --card-foreground: var(--ink);
  --popover: var(--white);
  --popover-foreground: var(--ink);
  --primary: var(--ink);
  --primary-foreground: var(--white);
  --secondary: #f1f1ec;
  --secondary-foreground: var(--ink);
  --muted-foreground: var(--muted);
  --accent: #f1f1ec;
  --accent-foreground: var(--ink);
  --destructive: var(--danger);
  --border: var(--line);
  --input: #d7d9dd;
  --ring: var(--cyan);
  --radius: 1rem;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--paper); }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "Inter", "Segoe UI", Arial, sans-serif; min-width: 320px; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible { outline: 3px solid color-mix(in srgb, var(--cyan) 55%, transparent); outline-offset: 3px; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: "Sora", "Inter", "Segoe UI", sans-serif; letter-spacing: -0.04em; }

.home-shell { overflow-x: clip; }
.site-header { position: relative; z-index: 20; width: min(1180px, calc(100% - 32px)); height: 82px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.logo-button { padding: 0; border: 0; background: transparent; cursor: pointer; }
.brand-lockup { display: inline-flex; align-items: center; gap: 11px; text-align: left; }
.brand-logo { width: 58px; height: 58px; object-fit: cover; border-radius: 15px; background: white; }
.brand-logo.compact { width: 42px; height: 42px; border-radius: 11px; }
.brand-copy { display: grid; line-height: 1.08; }
.brand-copy strong { font-size: 14px; letter-spacing: -0.02em; }
.brand-copy small { margin-top: 4px; font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .16em; }
.desktop-nav { display: flex; align-items: center; gap: 30px; margin-left: auto; }
.desktop-nav a { color: var(--ink-soft); text-decoration: none; font-size: 14px; font-weight: 650; }
.header-actions { display: flex; align-items: center; gap: 8px; }
.header-actions svg { width: 18px; }
.brand-button { min-height: 50px; padding: 0 22px; border-radius: 15px; color: white; background: var(--ink); font-weight: 750; box-shadow: 0 12px 30px rgba(17, 19, 24, .14); }
.brand-button:hover { background: var(--magenta); }
.brand-button.small { min-height: 43px; border-radius: 13px; padding: 0 18px; }
.secondary-button { min-height: 52px; border-radius: 15px; padding: 0 20px; background: rgba(255,255,255,.75); border-color: rgba(17,19,24,.14); font-weight: 700; }

.hero { position: relative; min-height: 700px; padding: 88px max(24px, calc((100vw - 1180px) / 2)) 100px; display: grid; grid-template-columns: 1.04fr .82fr; align-items: center; gap: 72px; background: linear-gradient(150deg, #fff 0%, #f8f9f3 55%, #eef5f3 100%); border-radius: 0 0 56px 56px; overflow: hidden; }
.hero-content { position: relative; z-index: 2; }
.event-badge { padding: 8px 12px; border: 1px solid rgba(17,19,24,.08); border-radius: 999px; background: white; color: var(--ink); box-shadow: 0 8px 24px rgba(17,19,24,.06); }
.event-badge svg { width: 15px; color: var(--magenta); }
.hero-kicker { margin: 28px 0 10px; color: var(--magenta); text-transform: uppercase; letter-spacing: .24em; font-size: 13px; font-weight: 800; }
.hero h1 { max-width: 700px; margin-bottom: 22px; font-size: clamp(48px, 5.2vw, 78px); line-height: .98; font-weight: 760; }
.hero h1 em { position: relative; color: var(--magenta); font-style: normal; }
.hero-description { max-width: 590px; margin-bottom: 26px; color: #565d68; font-size: 18px; line-height: 1.7; }
.hero-facts { display: flex; flex-wrap: wrap; gap: 12px 22px; margin-bottom: 30px; }
.hero-facts span, .trust-row span { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; }
.hero-facts svg { width: 18px; color: var(--cyan); }
.hero-actions { display: flex; gap: 10px; align-items: center; }
.hero-button { min-width: 214px; }
.hero-button svg, .session-button svg, .full-button svg, .mobile-buy-bar svg { width: 18px; }
.trust-row { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 24px; color: var(--muted); }
.trust-row span { font-size: 12px; }
.trust-row svg { width: 15px; }
.hero-ticket { position: relative; z-index: 2; min-height: 470px; padding: 30px; border-radius: 30px; background: var(--ink); color: white; box-shadow: 0 40px 90px rgba(17, 19, 24, .26); transform: rotate(2deg); overflow: hidden; }
.hero-ticket::before { content: ""; position: absolute; width: 280px; height: 280px; right: -120px; top: 50px; border: 54px solid var(--magenta); border-radius: 50%; opacity: .9; }
.hero-ticket::after { content: ""; position: absolute; width: 180px; height: 180px; right: -50px; bottom: -80px; border: 34px solid var(--lime); border-radius: 50%; }
.ticket-topline { position: relative; z-index: 1; display: flex; justify-content: space-between; color: rgba(255,255,255,.6); font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.ticket-mark { position: relative; z-index: 1; margin-top: 60px; }
.ticket-mark span { display: block; color: var(--lime); font-size: 18px; font-weight: 700; }
.ticket-mark strong { display: block; margin-top: 4px; font-size: clamp(38px, 4vw, 56px); line-height: .9; letter-spacing: -.06em; }
.ticket-session-line { position: relative; z-index: 1; display: grid; gap: 8px; margin-top: 48px; }
.ticket-session-line span { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 650; }
.ticket-session-line svg { width: 16px; color: var(--cyan); }
.ticket-price { position: relative; z-index: 1; display: flex; align-items: end; justify-content: space-between; margin-top: 32px; }
.ticket-price small { color: rgba(255,255,255,.55); }
.ticket-price strong { font-size: 28px; }
.ticket-perforation { position: relative; z-index: 1; margin: 28px -30px 18px; border-top: 1px dashed rgba(255,255,255,.26); }
.hero-ticket > p { position: relative; z-index: 1; color: rgba(255,255,255,.58); font-size: 12px; }
.hero-ribbon { position: absolute; border-radius: 999px; border-style: solid; transform: rotate(-26deg); }
.ribbon-one { width: 720px; height: 250px; right: -130px; top: 120px; border-width: 28px; border-color: var(--cyan); opacity: .12; }
.ribbon-two { width: 650px; height: 180px; left: -360px; bottom: 60px; border-width: 24px; border-color: var(--magenta); opacity: .12; transform: rotate(20deg); }
.ribbon-three { width: 420px; height: 130px; right: 80px; bottom: -80px; border-width: 20px; border-color: var(--lime); opacity: .18; transform: rotate(-10deg); }

.section { width: min(1120px, calc(100% - 40px)); margin: 0 auto; padding: 116px 0; }
.section-heading { display: grid; grid-template-columns: .9fr 1.4fr; align-items: end; gap: 30px; margin-bottom: 46px; }
.section-heading h2 { margin: 0; font-size: clamp(38px, 5vw, 64px); line-height: 1; }
.section-heading p { margin: 0; color: var(--muted); line-height: 1.7; }
.eyebrow { color: var(--magenta); font-size: 12px; font-weight: 850; letter-spacing: .2em; text-transform: uppercase; }
.session-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 18px; }
.session-card { min-height: 400px; display: grid; grid-template-columns: 120px 1fr; border-radius: 28px; background: white; border: 1px solid var(--line); overflow: hidden; box-shadow: 0 18px 45px rgba(17,19,24,.055); }
.session-number { display: flex; align-items: end; justify-content: center; padding: 28px 10px; color: var(--ink); font-size: 42px; font-weight: 850; writing-mode: vertical-rl; transform: rotate(180deg); }
.session-color-1 { background: var(--lime); }
.session-color-2 { background: var(--cyan); }
.session-color-3 { background: var(--magenta); }
.session-card-content { padding: 30px; display: flex; flex-direction: column; }
.available-badge { width: fit-content; color: var(--success); border-color: rgba(20,128,94,.25); }
.session-card h3 { margin: 26px 0 8px; font-size: 25px; }
.session-time { display: flex; align-items: baseline; gap: 10px; }
.session-time strong { font-size: 44px; letter-spacing: -.05em; }
.session-time span { color: var(--muted); }
.session-meta { display: grid; gap: 8px; margin: 22px 0 28px; color: var(--muted); font-size: 13px; }
.session-meta span { display: flex; align-items: center; gap: 8px; }
.session-meta svg { width: 16px; }
.session-button { width: 100%; min-height: 50px; margin-top: auto; border-radius: 14px; background: var(--ink); color: white; font-weight: 750; }
.seat-note { display: flex; gap: 14px; margin-top: 22px; padding: 20px 22px; background: #eef8f8; border: 1px solid rgba(34,184,199,.2); border-radius: 18px; }
.seat-note > svg { width: 22px; flex: 0 0 auto; color: #118b98; }
.seat-note strong { display: block; margin-bottom: 4px; }
.seat-note p { margin: 0; color: var(--muted); font-size: 13px; }

.courtesy-section { width: min(1180px, calc(100% - 32px)); margin: 20px auto; min-height: 520px; display: grid; grid-template-columns: .9fr 1.1fr; border-radius: 42px; overflow: hidden; color: white; background: var(--ink); }
.courtesy-art { position: relative; min-height: 420px; background: radial-gradient(circle at 50% 45%, rgba(231,43,139,.35), transparent 54%); }
.gift-orbit { position: absolute; width: 160px; height: 160px; left: 50%; top: 50%; display: grid; place-items: center; border-radius: 50%; color: var(--ink); background: var(--lime); transform: translate(-50%, -50%); box-shadow: 0 0 0 30px rgba(199,217,45,.08), 0 0 0 72px rgba(231,43,139,.09); }
.gift-orbit svg { width: 72px; height: 72px; stroke-width: 1.5; }
.courtesy-art::before, .courtesy-art::after { content: ""; position: absolute; left: 50%; top: 50%; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; transform: translate(-50%,-50%); }
.courtesy-art::before { width: 330px; height: 330px; }
.courtesy-art::after { width: 440px; height: 440px; }
.orbit-dot { position: absolute; width: 17px; height: 17px; border-radius: 50%; background: var(--cyan); }
.dot-one { left: 20%; top: 28%; }.dot-two { right: 18%; top: 58%; background: var(--magenta); }.dot-three { left: 35%; bottom: 13%; background: var(--lime); }
.courtesy-copy { padding: 78px 72px 70px 24px; align-self: center; }
.eyebrow.light { color: var(--lime); }
.courtesy-copy h2 { max-width: 560px; margin: 16px 0 22px; font-size: clamp(42px, 5vw, 68px); line-height: .98; }
.courtesy-copy > p { max-width: 600px; color: rgba(255,255,255,.7); font-size: 17px; line-height: 1.7; }
.courtesy-example { width: fit-content; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 30px 0 16px; padding: 15px 18px; border: 1px solid rgba(255,255,255,.14); border-radius: 15px; background: rgba(255,255,255,.08); }
.courtesy-example span, .courtesy-example strong { font-size: 13px; }
.courtesy-example strong { color: var(--lime); font-size: 18px; }
.math-sign { color: rgba(255,255,255,.4); }
.courtesy-copy > small { display: block; max-width: 540px; color: rgba(255,255,255,.48); line-height: 1.5; }

.compact-heading { grid-template-columns: .7fr 1.3fr; }
.benefits-section { padding-bottom: 80px; }
.benefit-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.benefit-grid article { padding: 30px; border-radius: 24px; background: white; border: 1px solid var(--line); }
.benefit-grid article > span { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 15px; background: #f1f8d4; color: #718000; }
.benefit-grid article:nth-child(2) > span { background: #e9f8fa; color: #078493; }
.benefit-grid article:nth-child(3) > span { background: #fce9f4; color: var(--magenta-dark); }
.benefit-grid svg { width: 23px; }
.benefit-grid h3 { margin: 24px 0 10px; font-size: 20px; }
.benefit-grid p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.faq-section { max-width: 850px; padding-top: 70px; }
.faq-section .section-heading { display: block; text-align: center; }
.faq-section h2 { margin-top: 12px; }
.faq-list { border-top: 1px solid var(--line); }
.faq-list button { padding: 22px 4px; font-size: 16px; text-decoration: none !important; }
.faq-list [data-slot="accordion-content"] > div { padding-right: 38px; color: var(--muted); font-size: 14px; line-height: 1.7; }
.footer { width: min(1180px, calc(100% - 32px)); margin: 30px auto 18px; padding: 48px; display: grid; grid-template-columns: 1fr auto; gap: 34px; border-radius: 32px; background: var(--ink); color: white; }
.footer .brand-logo { background: white; }
.footer .brand-copy strong { color: white; }.footer .brand-copy small { color: rgba(255,255,255,.5); }
.footer-brand > p { max-width: 330px; margin: 20px 0 0; color: rgba(255,255,255,.55); font-size: 13px; }
.footer-links { display: grid; align-content: center; gap: 12px; }
.footer-links a { display: flex; align-items: center; gap: 9px; color: white; text-decoration: none; font-size: 13px; }
.footer-links svg { width: 18px; color: var(--cyan); }
.copyright { grid-column: 1/-1; margin: 0; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.4); font-size: 11px; }
.mobile-buy-bar { display: none; }

.app-surface { min-height: 100svh; padding-bottom: max(30px, env(safe-area-inset-bottom)); background: #f3f4ef; }
.app-header { position: sticky; z-index: 30; top: 0; height: 68px; padding: 0 max(16px, calc((100vw - 1080px) / 2)); display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; background: rgba(250,250,247,.92); backdrop-filter: blur(18px); border-bottom: 1px solid rgba(17,19,24,.07); }
.app-header > span { text-align: center; font-size: 14px; font-weight: 800; }
.app-header button { border-radius: 13px; }
.header-spacer { width: 44px; }
.checkout-progress { width: min(840px, calc(100% - 32px)); margin: 30px auto 0; }
.progress-label { display: flex; justify-content: space-between; margin-bottom: 10px; font-size: 12px; }
.progress-label span { color: var(--muted); }.progress-label strong { font-weight: 800; }
.checkout-progress [data-slot="progress"] { height: 5px; background: #d9ddd7; }.checkout-progress [data-slot="progress-indicator"] { background: var(--magenta); }
.checkout-main { width: min(1080px, calc(100% - 32px)); margin: 34px auto; }
.checkout-card { width: min(700px, 100%); margin: 0 auto; padding: 38px; border: 1px solid var(--line); border-radius: 28px; background: white; box-shadow: 0 18px 50px rgba(17,19,24,.06); }
.step-icon { width: 54px; height: 54px; display: grid; place-items: center; margin-bottom: 24px; border-radius: 17px; }
.step-icon svg { width: 25px; }
.step-icon.cyan { background: #e5f7f9; color: #087d89; }.step-icon.magenta { background: #fce8f3; color: var(--magenta-dark); }.step-icon.lime { background: #f1f7d6; color: #667300; }
.checkout-card h1 { margin-bottom: 10px; font-size: clamp(30px, 4vw, 42px); line-height: 1.04; }
.checkout-card > p { color: var(--muted); line-height: 1.6; }
.checkout-session-list { margin: 28px 0; }
.checkout-session { min-height: 88px; padding: 16px; display: grid; grid-template-columns: 20px 1fr auto; align-items: center; gap: 14px; border: 1.5px solid var(--line); border-radius: 18px; cursor: pointer; transition: .2s ease; }
.checkout-session.selected { border-color: var(--cyan); background: #f0fafb; box-shadow: 0 0 0 3px rgba(34,184,199,.1); }
.checkout-session > span { display: grid; gap: 4px; }.checkout-session > span strong { font-size: 15px; }.checkout-session > span small { color: var(--muted); font-size: 11px; }
.checkout-session > b { display: grid; text-align: right; font-size: 20px; }.checkout-session > b small { color: var(--muted); font-size: 10px; font-weight: 500; }
.checkout-session [data-slot="radio-group-item"], .courtesy-options [data-slot="radio-group-item"] { border-color: #b9bdc3; color: var(--magenta); }
.quantity-box { padding: 18px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border: 1px solid var(--line); border-radius: 18px; background: #fafaf7; }
.category-quantity { margin-top: 12px; }
.quantity-box > div:first-child { display: grid; gap: 4px; }.quantity-box small { color: var(--muted); font-size: 11px; }
.quantity-control { display: flex; align-items: center; gap: 12px; }.quantity-control button { width: 42px; height: 42px; border-radius: 13px; }.quantity-control strong { min-width: 28px; text-align: center; font-size: 22px; }
.mini-total { display: flex; justify-content: space-between; padding: 20px 2px; }.mini-total span { color: var(--muted); }.mini-total strong { font-size: 20px; }
.info-callout, .data-difference { display: flex; gap: 10px; padding: 13px 15px; margin-bottom: 22px; border-radius: 13px; background: #edf8f9; color: #336168; }
.benefit-feedback { display: flex; align-items: flex-start; gap: 10px; padding: 14px 15px; border: 1px solid transparent; border-radius: 13px; background: #edf8f9; color: #336168; }
.benefit-feedback > span:last-child { display: grid; gap: 4px; }.benefit-feedback strong { font-size: 13px; }.benefit-feedback small { font-size: 11px; line-height: 1.45; }
.benefit-check { display: none; place-items: center; flex: none; width: 24px; height: 24px; border-radius: 50%; background: #158052; color: #fff; font-size: 15px; font-weight: 800; }
.benefit-feedback[data-estado="aplicado"] { border-color: #a9ddbf; background: #e7f6ed; color: #146347; }.benefit-feedback[data-estado="aplicado"] .benefit-check { display: grid; }
.benefit-feedback[data-estado="erro"] { border-color: #f0c9d1; background: #fae9ec; color: #8e2b3a; }
#continuarPagamento:disabled { opacity: .55; cursor: not-allowed; transform: none; }
.info-callout svg, .data-difference svg { width: 18px; flex: 0 0 auto; }.info-callout p, .data-difference p { margin: 0; font-size: 12px; line-height: 1.5; }
.full-button { width: 100%; min-height: 54px; margin-top: 8px; border-radius: 16px; }
.courtesy-options { margin: 28px 0 22px; }
.courtesy-options label { min-height: 76px; padding: 15px; display: flex; align-items: center; gap: 13px; border: 1.5px solid var(--line); border-radius: 17px; cursor: pointer; }
.courtesy-options label.selected { border-color: var(--magenta); background: #fff6fb; }
.courtesy-options label > span { display: grid; gap: 3px; }.courtesy-options label small { color: var(--muted); font-size: 11px; }
.courtesy-validation { margin-bottom: 22px; padding: 18px; border-radius: 18px; background: #f6f6f2; }
.courtesy-validation > label, .lookup-card > label { display: block; margin-bottom: 8px; font-size: 12px; font-weight: 750; }
.inline-field { display: flex; gap: 8px; }.inline-field input { height: 49px; border-radius: 13px; background: white; font-size: 16px; }.inline-field button { min-height: 49px; border-radius: 13px; }
.status-message { display: flex; gap: 9px; margin-top: 12px; padding: 12px; border-radius: 12px; font-size: 11px; line-height: 1.5; }.status-message svg { width: 18px; flex: 0 0 auto; }.status-message span { display: grid; }.status-message.success { color: #146347; background: #e4f4ec; }.status-message.error { color: #8e2b3a; background: #fae9ec; }
.summary-lines { display: grid; gap: 14px; margin-top: 22px; }.summary-lines.compact { padding: 18px 0; border-top: 1px solid var(--line); }
.summary-lines > div { display: flex; justify-content: space-between; gap: 20px; color: var(--muted); font-size: 13px; }.summary-lines .discount { color: var(--success); }.summary-lines .summary-total { padding-top: 16px; border-top: 1px solid var(--line); color: var(--ink); font-size: 19px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 28px 0; }.form-grid label { display: grid; gap: 8px; }.form-grid label > span { font-size: 12px; font-weight: 750; }.form-grid .full { grid-column: 1/-1; }.form-grid input { height: 50px; border-radius: 13px; background: #fafaf7; font-size: 16px; }
.data-difference { margin-top: -8px; background: #fff5fa; color: #74415c; }
.review-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 20px; align-items: start; }.review-layout .checkout-card { width: 100%; }
.payment-tabs { margin-top: 25px; }.payment-tabs [data-slot="tabs-list"] { width: 100%; height: 54px; padding: 5px; border-radius: 15px; background: #f1f2ed; }.payment-tabs [data-slot="tabs-trigger"] { min-height: 43px; border-radius: 11px; font-weight: 700; }.payment-tabs [data-slot="tabs-trigger"][data-state="active"] { box-shadow: 0 4px 14px rgba(17,19,24,.08); }
.payment-content { padding-top: 22px; }.payment-method-intro { display: flex; align-items: center; gap: 14px; padding: 18px; border-radius: 17px; background: #f3fafb; }.pix-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; color: #087d89; background: white; }.payment-method-intro p { margin: 4px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.secure-note { display: flex; align-items: center; gap: 8px; margin: 15px 2px 0; color: var(--muted); font-size: 11px; }.secure-note svg { width: 15px; }
.card-grid { margin-top: 0; }.pay-button { margin-top: 25px; }.free-order-box { display: flex; gap: 15px; padding: 20px; margin: 24px 0 14px; border: 1px solid rgba(199,217,45,.45); border-radius: 18px; background: #f6f9e7; }.free-order-box > svg { color: #708000; }.free-order-box p { margin: 4px 0 0; color: var(--muted); font-size: 12px; }
.order-summary { position: sticky; top: 95px; padding: 24px; border: 1px solid var(--line); border-radius: 24px; background: white; }.order-event { display: flex; align-items: center; gap: 12px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }.order-event > div { display: grid; gap: 4px; }.order-event small { color: var(--muted); font-size: 10px; }.order-event strong { font-size: 13px; }.buyer-summary { display: grid; gap: 4px; margin: 20px 0 12px; padding: 15px; border-radius: 13px; background: #f7f7f3; }.buyer-summary span { color: var(--muted); font-size: 10px; }.buyer-summary strong { font-size: 13px; }.buyer-summary small { color: var(--muted); font-size: 10px; overflow-wrap: anywhere; }

.dark-surface { color: white; background: var(--ink); }.dark-surface .app-header { background: rgba(17,19,24,.9); border-color: rgba(255,255,255,.08); }.status-main { min-height: calc(100svh - 68px); padding: 34px 16px; display: grid; place-items: center; }
.pix-panel, .success-panel { width: min(490px, 100%); padding: 34px; text-align: center; border-radius: 28px; background: white; color: var(--ink); box-shadow: 0 30px 80px rgba(0,0,0,.2); }.pending-badge { color: #735c00; background: #fff3c7; }.pix-panel h1, .success-panel h1 { margin: 22px 0 10px; font-size: 34px; }.pix-panel > p, .success-panel > p { color: var(--muted); line-height: 1.6; }
.qr-mock { position: relative; width: 210px; height: 210px; margin: 26px auto; border: 14px solid white; border-radius: 14px; background: repeating-conic-gradient(var(--ink) 0 25%, white 0 50%) 0 / 18px 18px; box-shadow: 0 0 0 1px var(--line); }.qr-mock span { position: absolute; width: 48px; height: 48px; border: 10px solid var(--ink); background: white; }.qr-mock span:nth-child(1) { left: 8px; top: 8px; }.qr-mock span:nth-child(2) { right: 8px; top: 8px; }.qr-mock span:nth-child(3) { left: 8px; bottom: 8px; }
.pix-code { display: flex; align-items: center; gap: 5px; padding: 6px 6px 6px 13px; margin-bottom: 14px; border-radius: 13px; background: #f2f3ee; }.pix-code span { flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-align: left; font-family: monospace; font-size: 10px; }.pix-panel > small { display: block; margin-top: 14px; color: var(--muted); line-height: 1.4; }
.success-surface { background: radial-gradient(circle at 50% 30%, #e9f7f1, #f3f4ef 58%); }.success-icon { width: 82px; height: 82px; display: grid; place-items: center; margin: -73px auto 20px; border: 8px solid #f3f4ef; border-radius: 50%; background: var(--success); color: white; }.success-icon svg { width: 42px; height: 42px; }.success-badge { color: #146347; background: #dff3e9; }.success-ticket { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 25px 0; overflow: hidden; border: 1px solid var(--line); border-radius: 17px; background: var(--line); }.success-ticket > div { padding: 16px; display: grid; gap: 5px; background: #fafaf7; }.success-ticket small { color: var(--muted); font-size: 10px; }.success-ticket strong { font-size: 13px; }

.tickets-surface { background: linear-gradient(180deg, #f8f7f3, #eef5f3); }.tickets-main { width: min(860px, calc(100% - 32px)); margin: 34px auto; }.lookup-card { padding: 32px; border-radius: 26px; background: var(--ink); color: white; }.lookup-card h1 { margin-bottom: 9px; font-size: 36px; }.lookup-card > p { color: rgba(255,255,255,.58); }.lookup-card .step-icon { background: rgba(231,43,139,.17); color: #ff70b7; }.lookup-card .inline-field { max-width: 560px; }.lookup-card input { border: 0; color: var(--ink); }.lookup-card .brand-button { color: var(--ink); background: var(--lime); box-shadow: none; }
.ticket-skeleton { display: grid; gap: 12px; margin-top: 24px; }.ticket-skeleton span { height: 110px; border-radius: 20px; background: linear-gradient(90deg, #e8e9e3, white, #e8e9e3); background-size: 200% 100%; animation: shimmer 1.3s infinite; }.ticket-skeleton span:first-child { height: 72px; }
@keyframes shimmer { to { background-position: -200% 0; } }
.empty-state { margin-top: 24px; padding: 48px 20px; text-align: center; border: 1px solid var(--line); border-radius: 25px; background: white; }.empty-state > span { width: 58px; height: 58px; display: grid; place-items: center; margin: 0 auto 18px; border-radius: 18px; color: var(--muted); background: #f0f1ec; }.empty-state h2 { margin-bottom: 8px; }.empty-state p { color: var(--muted); }
.found-order { margin-top: 24px; }.order-found-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }.order-found-header > div { display: grid; gap: 4px; }.order-found-header span { color: var(--muted); font-size: 11px; }.order-found-header strong { font-size: 18px; }.order-info-row { display: flex; flex-wrap: wrap; gap: 8px 18px; padding: 16px; margin-bottom: 14px; border-radius: 16px; background: white; color: var(--muted); font-size: 11px; }.order-info-row span { display: flex; align-items: center; gap: 6px; }.order-info-row svg { width: 14px; }
.ticket-list { display: grid; gap: 14px; }.digital-ticket { position: relative; display: grid; grid-template-columns: 1fr auto; border: 1px solid var(--line); border-radius: 22px; background: white; overflow: hidden; box-shadow: 0 12px 30px rgba(17,19,24,.04); }.digital-ticket-color { position: absolute; left: 0; top: 0; bottom: 0; width: 6px; background: linear-gradient(var(--magenta), var(--cyan), var(--lime)); }.digital-ticket-main { padding: 22px 22px 18px 28px; }.digital-ticket-title { display: flex; align-items: center; gap: 12px; }.digital-ticket-title > div { display: grid; gap: 3px; }.digital-ticket-title small { color: var(--muted); font-size: 10px; }.digital-ticket-title strong { font-size: 14px; }.digital-ticket-code { display: grid; gap: 3px; margin: 20px 0 12px; }.digital-ticket-code span { color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .13em; }.digital-ticket-code strong { font-size: 18px; letter-spacing: .04em; }.digital-ticket-tags { display: flex; flex-wrap: wrap; gap: 6px; }.courtesy-badge { color: #6c7800; background: #eff5c9; }.paid-badge { color: #087d89; background: #e5f7f9; }.digital-ticket-main > p { margin: 12px 0 0; color: var(--muted); font-size: 10px; }.digital-ticket-actions { min-width: 170px; padding: 17px; display: flex; flex-direction: column; justify-content: center; border-left: 1px dashed #d7d9d4; }.digital-ticket-actions button { justify-content: flex-start; }.digital-ticket-actions svg { width: 16px; }

.ticket-detail-surface { background: var(--ink); color: white; }.ticket-detail-surface .app-header { background: rgba(17,19,24,.92); border-color: rgba(255,255,255,.1); }.ticket-detail-main { width: min(500px, calc(100% - 32px)); margin: 34px auto; }.large-ticket { overflow: hidden; border-radius: 28px; background: white; color: var(--ink); box-shadow: 0 30px 70px rgba(0,0,0,.25); }.large-ticket-header { padding: 22px; display: flex; align-items: center; justify-content: space-between; }.large-ticket-art { position: relative; min-height: 245px; padding: 48px 28px; color: white; background: var(--ink); overflow: hidden; }.large-ticket-art::after { content: ""; position: absolute; width: 230px; height: 230px; right: -70px; top: -80px; border: 38px solid var(--magenta); border-radius: 50%; }.large-ticket-art > span, .large-ticket-art > strong { position: relative; z-index: 1; display: block; }.large-ticket-art > span { color: var(--lime); font-weight: 700; }.large-ticket-art > strong { margin-top: 5px; font-size: 43px; line-height: .88; letter-spacing: -.05em; }.barcode { position: absolute; z-index: 1; right: 24px; bottom: 24px; width: 115px; height: 36px; background: repeating-linear-gradient(90deg, white 0 2px, transparent 2px 5px, white 5px 6px, transparent 6px 10px); opacity: .75; }.large-ticket-code { padding: 24px 24px 20px; display: grid; gap: 6px; border-bottom: 1px dashed #d2d4cf; }.large-ticket-code small, .large-ticket-grid small { color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .1em; }.large-ticket-code strong { font-size: 21px; letter-spacing: .04em; }.large-ticket-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; padding: 24px; }.large-ticket-grid > div { display: grid; gap: 6px; }.large-ticket-grid strong { font-size: 13px; }.ticket-warning { display: flex; align-items: center; gap: 9px; margin: 0 24px 24px; padding: 12px; border-radius: 12px; color: #34656b; background: #eaf7f8; }.ticket-warning svg { width: 17px; }.ticket-warning p { margin: 0; font-size: 11px; }.ticket-detail-main > .full-button { background: var(--lime); color: var(--ink); box-shadow: none; }

.offline-banner { position: fixed; z-index: 100; left: 50%; top: 10px; width: min(440px, calc(100% - 24px)); padding: 11px 14px; display: flex; align-items: center; justify-content: center; gap: 8px; border-radius: 13px; color: white; background: #772b38; transform: translateX(-50%); box-shadow: 0 12px 30px rgba(0,0,0,.2); font-size: 11px; }.offline-banner svg { width: 16px; }
.install-card { position: fixed; z-index: 90; right: 18px; bottom: 18px; width: min(390px, calc(100% - 24px)); padding: 12px; display: grid; grid-template-columns: 44px 1fr auto 36px; align-items: center; gap: 9px; border: 1px solid var(--line); border-radius: 17px; background: white; box-shadow: 0 20px 60px rgba(17,19,24,.2); }.install-card > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; color: var(--magenta-dark); background: #fce8f3; }.install-card > div { display: grid; gap: 2px; }.install-card strong { font-size: 12px; }.install-card p { margin: 0; color: var(--muted); font-size: 10px; }.install-card button { border-radius: 10px; }

@media (max-width: 850px) {
  .site-header { height: 72px; width: calc(100% - 24px); }.brand-copy, .desktop-nav, .desktop-buy { display: none; }.brand-logo { width: 50px; height: 50px; border-radius: 13px; }.tickets-link { padding: 0 8px; }.tickets-link svg { width: 20px; }.tickets-link { font-size: 12px; }
  .hero { min-height: auto; padding: 56px 20px 72px; display: block; border-radius: 0 0 32px 32px; }.hero h1 { font-size: clamp(43px, 12vw, 64px); }.hero-description { font-size: 16px; }.hero-ticket { max-width: 520px; min-height: 430px; margin: 58px auto 0; transform: rotate(1deg); }.hero-actions { align-items: stretch; flex-direction: column; }.hero-actions button { width: 100%; }.trust-row { justify-content: center; }
  .section { width: calc(100% - 28px); padding: 80px 0; }.section-heading, .compact-heading { display: block; }.section-heading .eyebrow { display: block; margin-bottom: 14px; }.section-heading h2 { font-size: 43px; }.section-heading p { margin-top: 18px; }.session-grid { grid-template-columns: 1fr; }.session-card { min-height: 350px; }.courtesy-section { width: calc(100% - 24px); grid-template-columns: 1fr; border-radius: 30px; }.courtesy-art { min-height: 330px; }.courtesy-art::after { width: 340px; height: 340px; }.courtesy-copy { padding: 12px 28px 42px; }.courtesy-copy h2 { font-size: 43px; }.benefit-grid { grid-template-columns: 1fr; }.footer { width: calc(100% - 24px); margin-bottom: 90px; padding: 30px; grid-template-columns: 1fr; }.copyright { grid-column: 1; }
  .mobile-buy-bar { position: fixed; z-index: 40; left: 0; right: 0; bottom: 0; min-height: 76px; padding: 10px 14px calc(10px + env(safe-area-inset-bottom)); display: flex; align-items: center; justify-content: space-between; gap: 12px; background: rgba(255,255,255,.94); border-top: 1px solid var(--line); backdrop-filter: blur(18px); }.mobile-buy-bar > div { display: grid; }.mobile-buy-bar small { color: var(--muted); font-size: 10px; }.mobile-buy-bar strong { font-size: 17px; }.mobile-buy-bar button { min-height: 50px; }
  .review-layout { grid-template-columns: 1fr; }.order-summary { position: static; order: -1; }.digital-ticket { grid-template-columns: 1fr; }.digital-ticket-actions { min-width: 0; flex-direction: row; justify-content: flex-start; border-left: 0; border-top: 1px dashed #d7d9d4; }.install-card { left: 12px; right: 12px; bottom: 88px; width: auto; }
}

@media (max-width: 520px) {
  .hero-kicker { margin-top: 24px; }.hero h1 { font-size: 45px; }.hero-facts { display: grid; }.hero-ticket { min-height: 410px; padding: 24px; }.ticket-mark strong { font-size: 42px; }.ticket-perforation { margin-left: -24px; margin-right: -24px; }
  .section-heading h2 { font-size: 37px; }.session-card { grid-template-columns: 66px 1fr; }.session-number { font-size: 30px; }.session-card-content { padding: 22px 18px; }.session-time strong { font-size: 37px; }.seat-note { align-items: flex-start; }
  .courtesy-art { min-height: 280px; }.gift-orbit { width: 125px; height: 125px; }.gift-orbit svg { width: 54px; height: 54px; }.courtesy-art::before { width: 245px; height: 245px; }.courtesy-art::after { width: 310px; height: 310px; }.courtesy-copy h2 { font-size: 38px; }
  .checkout-progress { margin-top: 22px; }.checkout-main { width: calc(100% - 20px); margin-top: 22px; }.checkout-card { padding: 24px 18px; border-radius: 23px; }.checkout-card h1 { font-size: 31px; }.checkout-session { grid-template-columns: 18px 1fr auto; padding: 13px; gap: 9px; }.checkout-session > b { font-size: 17px; }.quantity-box { padding: 15px; }.quantity-control { gap: 8px; }.form-grid { grid-template-columns: 1fr; }.form-grid .full { grid-column: 1; }.card-grid { grid-template-columns: 1fr 1fr; }.card-grid .full { grid-column: 1/-1; }.inline-field { align-items: stretch; }.courtesy-validation .inline-field, .lookup-card .inline-field { flex-direction: column; }
  .pix-panel, .success-panel { padding: 28px 18px; }.pix-panel h1, .success-panel h1 { font-size: 30px; }.qr-mock { width: 190px; height: 190px; }
  .tickets-main { width: calc(100% - 20px); margin-top: 20px; }.lookup-card { padding: 25px 18px; }.lookup-card h1 { font-size: 31px; }.order-found-header { align-items: flex-start; }.order-info-row { display: grid; }.digital-ticket-actions button { padding-left: 8px; padding-right: 8px; font-size: 12px; }.large-ticket-grid { gap: 17px; padding: 20px; }.large-ticket-art > strong { font-size: 37px; }.barcode { width: 85px; }.success-icon { margin-top: -67px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}