/* PickLantern identity. Team and outcome colors remain owned by the tickets. */
.site-brand { letter-spacing: -.8px; }
.site-brand .brand-light { color: var(--pp-color-accent); }
.plan-complete { border-color: var(--pp-color-brand-rule); }
.plan-complete .plan-head { background: var(--pp-color-brand-wash); color: var(--pp-color-text); }
.plan-complete .plan-head h2, .plan-complete .plan-price { color: var(--pp-color-accent); }
.landing .site-header { margin-bottom: 0; }
.skip-predictions { position: absolute; left: var(--pp-space-4); top: var(--pp-space-4); z-index: 10; padding: var(--pp-space-3) var(--pp-space-4); background: var(--pp-color-accent); color: var(--pp-color-on-accent); border-radius: var(--pp-radius); translate: 0 -200%; }
.skip-predictions:focus { translate: none; }
.lantern-hero {
  --hero-type: clamp(80px, 8.6vw, 132px);
  position: relative; isolation: isolate; overflow: hidden;
  width: calc(100% - var(--pp-page-gutter) * 2); max-width: var(--pp-content-max);
  margin: 0 auto; min-height: 660px; display: grid; grid-template-columns: 1.08fr 1fr;
  align-items: center; padding-block: var(--pp-space-12) var(--pp-space-16);
}
.lantern-copy { position: relative; z-index: 1; padding-bottom: var(--pp-space-6); }
.lantern-copy h1 { margin: 0; font: var(--pp-weight-display) var(--hero-type)/.98 var(--pp-font-display); letter-spacing: -.02em; text-transform: uppercase; }
.lantern-copy h1 span { display: block; }
.lantern-copy h1 .lit-word { color: var(--pp-color-accent); }
.lantern-copy p { max-width: 370px; margin: var(--pp-space-6) 0 var(--pp-space-8); color: var(--pp-color-text-secondary); font-size: 18px; line-height: 1.6; }
.lantern-cta { gap: var(--pp-space-8); border: none; }
.lantern-cta svg { width: 20px; height: 20px; }
/* Light moves across the surface; the label and click target stay still. */
.lantern-shimmer { position: relative; isolation: isolate; overflow: hidden; }
.lantern-shimmer::before {
  content: ''; position: absolute; z-index: -1; pointer-events: none;
  top: -70%; bottom: -70%; left: -50%; width: var(--pp-lantern-beam-width);
  background: linear-gradient(90deg, transparent, var(--pp-color-lantern-beam), transparent);
  filter: blur(var(--pp-lantern-beam-blur)); opacity: 0;
  transform: translateX(0) skewX(var(--pp-lantern-beam-tilt));
}
@media (prefers-reduced-motion: no-preference) {
  .lantern-shimmer:focus-visible::before { animation: lantern-sweep-active var(--pp-duration-lantern-sweep) var(--pp-ease-lantern) both; }
  @keyframes lantern-sweep-active {
    0% { opacity: 0; transform: translateX(0) skewX(var(--pp-lantern-beam-tilt)); }
    18%, 65% { opacity: var(--pp-lantern-beam-opacity); }
    100% { opacity: 0; transform: translateX(var(--pp-lantern-beam-travel)) skewX(var(--pp-lantern-beam-tilt)); }
  }
}
@media (prefers-reduced-motion: no-preference) and (hover: hover) {
  .lantern-shimmer:hover::before { animation: lantern-sweep-active var(--pp-duration-lantern-sweep) var(--pp-ease-lantern) both; }
}
.lantern-art { position: relative; width: 118%; margin-left: -8%; pointer-events: none; }
.lantern-art::before { content: ''; position: absolute; inset: 12% -5%; background: radial-gradient(ellipse, var(--pp-color-brand-glow), transparent 65%); z-index: -1; }
.lantern-art img { width: 100%; height: auto; display: block; }
.landing .ticket-main { padding-top: var(--pp-space-10); scroll-margin-top: var(--pp-space-6); border-top: var(--pp-border) solid var(--pp-color-rule); }
@media (prefers-reduced-motion: no-preference) {
  html:has(.lantern-hero) { scroll-behavior: smooth; }
  .lantern-art { animation: lantern-focus 1200ms var(--pp-ease-out) both; }
  .lantern-copy { animation: lantern-copy-in 650ms var(--pp-ease-out) both; }
  .lantern-copy .lit-word { animation: lantern-light 1000ms ease-out both; }
  @keyframes lantern-focus { from { opacity: 0; transform: scale(.96); filter: blur(5px); } to { opacity: 1; transform: none; filter: none; } }
  @keyframes lantern-copy-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
  @keyframes lantern-light { from { color: var(--pp-color-text); } to { color: var(--pp-color-accent); } }
}
@media (max-width: 1000px) and (min-width: 761px) {
  .lantern-hero { --hero-type: clamp(76px, 10vw, 100px); min-height: 600px; grid-template-columns: 1.2fr 1fr; }
  .lantern-art { width: 145%; margin-left: -20%; }
}
@media (max-width: 760px) {
  .lantern-hero { --hero-type: clamp(70px, 17.5vw, 108px); display: block; min-height: 650px; padding-top: 240px; padding-bottom: var(--pp-space-10); text-align: center; }
  .lantern-copy { padding: 0; }
  .lantern-copy h1 span:first-child { white-space: nowrap; }
  .lantern-copy p { max-width: 310px; font-size: var(--pp-text-body); margin: var(--pp-space-5) auto var(--pp-space-6); }
  .lantern-art { position: absolute; width: 320px; top: -40px; left: 50%; margin-left: -160px; }
  .lantern-art::before { inset: 0 -30%; }
  .lantern-art img { height: 300px; object-fit: contain; }
  .lantern-cta { min-width: 210px; }
  .site-brand { letter-spacing: -.65px; gap: 6px; }
  .site-nav { gap: 12px; }
  .flow-header-link { max-width: 105px; text-align: right; line-height: 1.4; }
}
@media (max-width: 360px) {
  .site-brand { font-size: 18px; }
  .site-brand img { width: 22px; height: 22px; }
  .site-nav { gap: 8px; }
  .site-nav .nav-upgrade { padding-inline: 9px; }
  .lantern-hero { --hero-type: 67px; }
}

/* The About page uses the same lantern and warm amber as the homepage. */
.about-page .about-visual img { filter: none; opacity: 1; }

/* Flat controls respond through color and light; their geometry stays still. */
body :is(.primary-action, .site-nav .nav-upgrade, .ticket-action, .plan-action, .account-page button, .flow-panel button, .flow-primary-link, .flow-secondary-link, .account-continue, .account-back, .day-switch button, .sport-toggle) {
  --button-fill: var(--pp-color-surface);
  --button-hover: var(--pp-color-surface-raised);
  --button-pressed: var(--pp-color-canvas);
  --button-border: var(--pp-color-rule);
  --button-border-hover: var(--pp-color-accent);
  border-color: var(--button-border);
  border-radius: var(--pp-radius-action);
  background: var(--button-fill);
  color: var(--pp-color-text);
  box-shadow: none;
}
body :is(.primary-action, .nav-upgrade:not(.nav-plan), .ticket-action:not(.secondary), .account-primary, .flow-primary-link, .plan-complete .plan-action) {
  --button-fill: var(--pp-color-accent);
  --button-hover: var(--pp-color-accent-hover);
  --button-pressed: var(--pp-color-accent-pressed);
  --button-border: transparent;
  --button-border-hover: transparent;
  color: var(--pp-color-on-accent);
}
body .day-switch button[aria-pressed=true] {
  --button-fill: var(--pp-color-text);
  --button-hover: var(--pp-color-text);
  --button-pressed: var(--pp-color-text-secondary);
  --button-border: transparent;
  --button-border-hover: transparent;
  color: var(--pp-color-canvas);
}
body .sport-toggle { padding-inline: var(--pp-space-3); }
body :is(.primary-action, .site-nav .nav-upgrade, .ticket-action, .plan-action, .account-page button, .flow-panel button, .flow-primary-link, .flow-secondary-link, .account-continue, .account-back, .day-switch button, .sport-toggle):focus-visible {
  outline: var(--pp-border-strong) solid var(--pp-color-focus);
  outline-offset: var(--pp-space-1);
  background-color: var(--button-hover);
}
@media (hover: hover) {
  body :is(.primary-action, .site-nav .nav-upgrade, .ticket-action, .plan-action, .account-page button, .flow-panel button, .flow-primary-link, .flow-secondary-link, .account-continue, .account-back, .day-switch button, .sport-toggle):hover:not(:disabled):not([aria-disabled=true]) {
    background-color: var(--button-hover);
    border-color: var(--button-border-hover);
  }
}
body :is(.primary-action, .site-nav .nav-upgrade, .ticket-action, .plan-action, .account-page button, .flow-panel button, .flow-primary-link, .flow-secondary-link, .account-continue, .account-back, .day-switch button, .sport-toggle):active:not(:disabled):not([aria-disabled=true]) {
  background-color: var(--button-pressed);
}
body :is(.primary-action, .site-nav .nav-upgrade, .ticket-action, .plan-action, .account-page button, .flow-panel button, .flow-primary-link, .flow-secondary-link, .account-continue, .account-back, .day-switch button, .sport-toggle):is(:disabled, [aria-disabled=true]) {
  opacity: var(--pp-button-disabled-opacity);
  background-color: var(--button-fill);
  border-color: var(--button-border);
  cursor: default;
}
@media (prefers-reduced-motion: no-preference) {
  body :is(.primary-action, .site-nav .nav-upgrade, .ticket-action, .plan-action, .account-page button, .flow-panel button, .flow-primary-link, .flow-secondary-link, .account-continue, .account-back, .day-switch button, .sport-toggle) { transition: background-color var(--pp-duration-fast) var(--pp-ease-out), border-color var(--pp-duration-fast) var(--pp-ease-out); }
}
@media (prefers-reduced-motion: reduce) {
  body :is(.primary-action, .site-nav .nav-upgrade, .ticket-action, .plan-action, .account-page button, .flow-panel button, .flow-primary-link, .flow-secondary-link, .account-continue, .account-back, .day-switch button, .sport-toggle) { transition: none; }
}