/* Wedding (Americana diner) section styles */

/* Hero */
.hero {
  position: relative;
  min-height: min(100svh, 45rem);
  padding-block: clamp(1.35rem, 4vw, 2.75rem) clamp(3.5rem, 8vw, 6rem);
  background:
    radial-gradient(circle at 50% 32%, rgba(255, 252, 242, .7), transparent 19rem),
    radial-gradient(circle at 18% 18%, rgba(255, 255, 255, .66), transparent 11rem),
    radial-gradient(circle at 82% 28%, rgba(243, 201, 105, .28), transparent 12rem),
    linear-gradient(180deg, rgba(207, 232, 246, .95), rgba(180, 207, 229, .95) 52%, rgba(127, 176, 216, .96));
  text-align: center;
  overflow: hidden;
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 18% 9%, rgba(255, 255, 255, .65) 0 .18rem, transparent .2rem),
    radial-gradient(circle at 84% 17%, rgba(255, 255, 255, .7) 0 .14rem, transparent .16rem),
    radial-gradient(circle at 72% 42%, rgba(255, 255, 255, .55) 0 .12rem, transparent .14rem),
    radial-gradient(circle at 31% 62%, rgba(255, 255, 255, .46) 0 .1rem, transparent .12rem),
    linear-gradient(110deg, transparent 0 34%, rgba(255, 255, 255, .2) 44%, transparent 56% 100%),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, .12) 0 1.1rem, rgba(127, 176, 216, .14) 1.1rem 2.2rem);
  background-size: auto, auto, auto, auto, 220% 100%, auto;
  animation: heroLightSweep 12s linear infinite;
  pointer-events: none;
}

.hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 2.4rem;
  background:
    radial-gradient(circle at 1rem 0, transparent 0 .78rem, rgba(255, 248, 231, .9) .8rem .95rem, transparent .98rem) 0 0 / 2rem 1.35rem repeat-x,
    linear-gradient(rgba(255, 248, 231, .92), rgba(255, 248, 231, .92));
  opacity: .85;
  pointer-events: none;
}

.hero .container {
  position: relative;
  z-index: 1;
}

.hero-card {
  width: min(100%, 40rem);
  margin-inline: auto;
  animation: heroRise .8s ease-out both;
}

.hero-mark {
  position: relative;
  width: min(35rem, 96vw);
  aspect-ratio: 560 / 390;
  margin-inline: auto;
  filter: drop-shadow(0 22px 32px rgba(49, 82, 115, .2));
  animation: heroFloat 6s ease-in-out infinite;
}

.hero-mark__art {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.hero-mark__clouds {
  fill: rgba(255, 252, 242, .78);
  filter: drop-shadow(0 2px 0 rgba(98, 134, 160, .18));
  transform-origin: center;
  animation: heroCloudDrift 9s ease-in-out infinite;
}

.hero-mark__bouquet {
  position: relative;
  fill: var(--sage);
  stroke: #6f8f77;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 3.5;
}

.hero-mark__bouquet ellipse {
  fill: #a6b995;
  stroke: #6f8f77;
  stroke-width: 1.5;
}

.hero-mark__rose {
  fill: #d94b3d;
  stroke: #9d302d;
  stroke-width: 2;
}

.hero-mark__rose--deep {
  fill: #b93630;
}

.hero-mark__bud {
  fill: #d94b3d;
  stroke: #9d302d;
  stroke-width: 1.5;
}

.hero-mark__heart-edge {
  fill: #eee4cf;
  stroke: #d5cbb9;
  stroke-width: 30;
}

.hero-mark__heart-ruffle {
  fill: none;
  stroke: #f8efd9;
  stroke-dasharray: 0 13;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 18;
  filter: drop-shadow(0 1px 0 rgba(255, 255, 255, .72));
}

.hero-mark__heart-fill {
  fill: #c94135;
  stroke: #f5ead4;
  stroke-width: 2;
  animation: heroHeartGlow 5.5s ease-in-out infinite;
}

.hero-mark__heart-lace-dots {
  fill: none;
  stroke: rgba(164, 154, 137, .5);
  stroke-dasharray: 0 14;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 4;
}

.hero-mark__heart-grain {
  fill: url(#hero-heart-speckles);
  opacity: .28;
}

.hero-mark__sparkles {
  fill: #f9efe2;
  filter: drop-shadow(0 1px 0 rgba(128, 52, 47, .24));
}

.hero-mark__sparkles path:nth-child(even) {
  fill: #b93630;
}

.hero-mark__sparkles path {
  transform-origin: center;
  animation: heroTwinkle 3.2s ease-in-out infinite;
}

.hero-mark__sparkles path:nth-child(2) {
  animation-delay: .45s;
}

.hero-mark__sparkles path:nth-child(3) {
  animation-delay: .9s;
}

.hero-mark__sparkles path:nth-child(4) {
  animation-delay: 1.35s;
}

.hero-mark__sparkles path:nth-child(5) {
  animation-delay: 1.8s;
}

.hero__names {
  position: absolute;
  z-index: 3;
  top: 35%;
  left: 50%;
  width: 66%;
  transform: translate(-50%, -50%) rotate(-3deg);
  margin: 0;
  color: #fff8e8;
  font-family: var(--f-script);
  font-size: clamp(2.2rem, 8.8vw, 4.7rem);
  font-weight: 400;
  line-height: .9;
  text-shadow:
    0 2px 0 rgba(111, 35, 33, .88),
    0 0 16px rgba(54, 14, 12, .18);
  white-space: nowrap;
}

.hero__names span {
  display: block;
}

.hero__names span + span {
  margin-top: .03em;
}

.hero__names em {
  display: inline-block;
  margin-right: .13em;
  font-size: .82em;
  font-style: normal;
}

.date-ribbon {
  position: absolute;
  z-index: 4;
  top: 61.5%;
  left: 19%;
  right: 19%;
  display: grid;
  min-height: clamp(2rem, 6vw, 2.8rem);
  place-items: center;
  padding-inline: clamp(.65rem, 2vw, 1rem);
  color: #263d55;
  background: linear-gradient(180deg, #fbf3df, #ded1b8);
  border: 1px solid rgba(93, 77, 61, .45);
  box-shadow:
    0 3px 7px rgba(42, 52, 63, .18),
    inset 0 1px 0 rgba(255, 255, 255, .8);
  font-family: var(--f-body);
  font-size: clamp(.95rem, 2.8vw, 1.25rem);
  font-weight: 700;
  line-height: 1;
  transform: rotate(-2deg);
  animation: ribbonPop .75s cubic-bezier(.2, 1.2, .2, 1) .18s both;
}

.date-ribbon::before,
.date-ribbon::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: .42rem;
  width: clamp(3rem, 9vw, 4.4rem);
  height: clamp(1.35rem, 4vw, 1.8rem);
  background: linear-gradient(180deg, #f5ecd6, #d6c7ac);
  border: 1px solid rgba(93, 77, 61, .4);
  box-shadow: 0 2px 5px rgba(42, 52, 63, .14);
}

.date-ribbon::before {
  left: clamp(-2.35rem, -6vw, -1.5rem);
  clip-path: polygon(0 0, 100% 0, 84% 100%, 0 100%, 16% 50%);
}

.date-ribbon::after {
  right: clamp(-2.35rem, -6vw, -1.5rem);
  clip-path: polygon(0 0, 100% 0, 84% 50%, 100% 100%, 0 100%, 16% 0);
}

.date-ribbon span {
  position: relative;
  z-index: 1;
}

.hero__raffle-info {
  position: absolute;
  z-index: 5;
  right: 16%;
  bottom: .2rem;
  left: 16%;
  display: grid;
  gap: .04rem;
  padding: .3rem .55rem .34rem;
  color: var(--red-deep);
  background:
    radial-gradient(circle at 0 50%, transparent 0 .38rem, rgba(255, 248, 232, .98) .4rem),
    radial-gradient(circle at 100% 50%, transparent 0 .38rem, rgba(255, 248, 232, .98) .4rem),
    linear-gradient(180deg, rgba(255, 248, 232, .98), rgba(233, 214, 178, .98));
  border: 1px solid rgba(93, 77, 61, .38);
  border-radius: 7px;
  box-shadow:
    0 9px 17px rgba(42, 52, 63, .18),
    inset 0 1px 0 rgba(255, 255, 255, .75);
  font-family: var(--f-ui);
  font-weight: 850;
  line-height: 1.04;
  text-align: center;
  transform: rotate(1.3deg);
}

.hero__raffle-info strong {
  font-family: var(--f-body);
  font-size: clamp(.72rem, 1.7vw, 1rem);
  line-height: .95;
}

.hero__raffle-info span {
  min-width: 0;
  color: #263d55;
  font-size: clamp(.48rem, 1.05vw, .72rem);
  overflow-wrap: anywhere;
}

.hero__raffle-info .hero__ticket-price {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  align-items: baseline;
  justify-content: center;
  gap: .18rem;
  margin: .05rem auto;
  padding: .1rem .4rem .12rem;
  color: #fff8e8;
  background:
    linear-gradient(180deg, #c94940, #a72f2a);
  border: 1px solid rgba(93, 32, 28, .42);
  border-radius: 6px;
  box-shadow:
    0 2px 0 rgba(93, 32, 28, .42),
    inset 0 1px 0 rgba(255, 255, 255, .28);
  line-height: .88;
  text-transform: uppercase;
  transform: rotate(-1.5deg);
}

.hero__raffle-info .hero__ticket-price b {
  font-family: var(--f-marquee);
  font-size: clamp(.95rem, 2.2vw, 1.45rem);
  font-weight: 400;
}

.hero__raffle-info .hero__ticket-price em {
  color: #fff4cc;
  font-family: var(--f-ui);
  font-size: clamp(.42rem, .82vw, .58rem);
  font-style: normal;
  font-weight: 950;
  letter-spacing: 0;
}

.hero__welcome {
  margin: -.35rem auto 0;
  color: #263d55;
  font-family: var(--f-body);
  font-size: clamp(1.15rem, 3.8vw, 1.45rem);
  font-weight: 700;
  letter-spacing: 0;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .6);
}

.hero__tagline {
  max-width: 35rem;
  margin: .45rem auto 0;
  color: rgba(44, 62, 92, .82);
  font-family: var(--f-ui);
  font-size: clamp(.98rem, 2.4vw, 1.08rem);
  font-weight: 700;
}

.hero__cta {
  display: inline-flex;
  flex-wrap: wrap;
  gap: .95rem 1.1rem;
  justify-content: center;
  margin-top: 1.1rem;
}

.btn-diner {
  position: relative;
  display: inline-grid;
  min-width: min(10.6rem, calc(50vw - 1.4rem));
  min-height: 2.75rem;
  place-items: center;
  padding: .55rem 1.45rem;
  color: var(--red-deep);
  background:
    radial-gradient(circle at 0 50%, transparent 0 .42rem, var(--paper) .44rem),
    radial-gradient(circle at 100% 50%, transparent 0 .42rem, var(--paper) .44rem),
    linear-gradient(180deg, #fff5df, #eadcc2);
  border: 1px solid rgba(103, 86, 70, .5);
  border-radius: .75rem;
  box-shadow:
    0 3px 0 rgba(44, 62, 92, .22),
    inset 0 0 0 3px rgba(255, 255, 255, .5);
  font-family: var(--f-body);
  font-size: clamp(1rem, 3.2vw, 1.15rem);
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition: transform .15s ease, filter .15s ease;
}

.btn-diner::before {
  content: "";
  position: absolute;
  inset: .28rem;
  border: 1px solid rgba(128, 105, 82, .36);
  border-radius: .55rem;
  pointer-events: none;
}

.btn-diner:hover {
  filter: brightness(1.04);
  transform: translateY(-2px) rotate(-.35deg);
}

.btn-diner:active {
  box-shadow:
    0 1px 0 rgba(44, 62, 92, .24),
    inset 0 0 0 3px rgba(255, 255, 255, .5);
  transform: translateY(1px);
}

.hero__cloud {
  position: absolute;
  inset: auto 0 0;
  height: 5rem;
  background:
    radial-gradient(ellipse at 8% 100%, rgba(255, 255, 255, .86) 0 33%, transparent 35%),
    radial-gradient(ellipse at 28% 100%, rgba(255, 255, 255, .88) 0 29%, transparent 31%),
    radial-gradient(ellipse at 55% 100%, rgba(255, 255, 255, .82) 0 28%, transparent 30%),
    radial-gradient(ellipse at 82% 100%, rgba(255, 255, 255, .88) 0 34%, transparent 36%);
  animation: cloudShelf 8s ease-in-out infinite;
  pointer-events: none;
}

/* Countdown */
.countdown {
  display: flex;
  flex-wrap: wrap;
  gap: .8rem;
  justify-content: center;
  margin-top: clamp(2.25rem, 5vw, 3.25rem);
}

.countdown__unit {
  min-width: 4.35rem;
  padding: .65rem .85rem;
  background:
    linear-gradient(180deg, rgba(255, 252, 242, .96), rgba(238, 223, 192, .92));
  border: 1px solid rgba(44, 62, 92, .45);
  border-radius: var(--radius-sm);
  box-shadow:
    0 10px 24px -18px rgba(44, 62, 92, .5),
    inset 0 1px 0 rgba(255, 255, 255, .9);
  animation: counterSettle .7s ease both;
}

.countdown__unit:nth-child(2) {
  animation-delay: .06s;
}

.countdown__unit:nth-child(3) {
  animation-delay: .12s;
}

.countdown__unit:nth-child(4) {
  animation-delay: .18s;
}

.countdown__n {
  color: var(--red-deep);
  font-family: var(--f-marquee);
  font-size: var(--step-1);
  line-height: 1;
}

.countdown__label {
  margin-top: .25rem;
  color: var(--ink-soft);
  font-family: var(--f-ui);
  font-size: .72rem;
  letter-spacing: 0;
  line-height: 1;
  text-transform: uppercase;
}

.intro-section {
  position: relative;
  overflow: hidden;
  padding-block: clamp(3rem, 8vw, 5rem);
  background:
    radial-gradient(circle at 20% 0, rgba(255, 252, 242, .64), transparent 16rem),
    radial-gradient(circle at 80% 80%, rgba(243, 201, 105, .24), transparent 17rem),
    linear-gradient(180deg, rgba(180, 207, 229, .92), rgba(127, 176, 216, .95));
  text-align: center;
}

.intro-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.18), rgba(255,255,255,0) 18%, rgba(0,0,0,.04) 82%, rgba(255,255,255,.1)),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, .18) 0 1.15rem, rgba(83, 143, 188, .16) 1.15rem 2.3rem);
  opacity: .72;
  pointer-events: none;
}

.intro-section::after {
  content: "";
  position: absolute;
  inset: auto 0 -1px;
  height: clamp(3.5rem, 7vw, 5.8rem);
  background:
    linear-gradient(180deg, transparent, rgba(15, 19, 32, .18) 48%, rgba(15, 19, 32, .68)),
    radial-gradient(circle at 1.2rem 100%, rgba(255, 248, 231, .98) 0 .78rem, transparent .82rem) 0 100% / 2.4rem 1.35rem repeat-x,
    linear-gradient(180deg, transparent 56%, var(--felt) 57%);
  pointer-events: none;
}

.intro-section .container {
  position: relative;
  z-index: 1;
}

.intro-section__date {
  margin: 0;
  color: var(--red-deep);
  font-family: var(--f-script);
  font-size: clamp(1.8rem, 6vw, 3rem);
  line-height: 1.1;
}

.intro-section__copy {
  max-width: 38rem;
  margin: 1rem auto 0;
  color: var(--ink-soft);
  font-family: var(--f-body);
  font-size: var(--step-0);
}

.awning-stripes .checkerboard {
  height: 34px;
  background:
    linear-gradient(90deg, transparent, rgba(255, 255, 255, .32), transparent),
    repeating-linear-gradient(90deg, #fff8e8 0 1.6rem, var(--sky-dark) 1.6rem 3.2rem);
  border-block: 1px solid rgba(44, 62, 92, .22);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .7) inset,
    0 10px 24px -20px rgba(44, 62, 92, .8);
}

@keyframes heroLightSweep {
  from {
    background-position: 0 0, 0 0, 0 0, 0 0, 130% 0, 0 0;
  }

  to {
    background-position: 0 0, 0 0, 0 0, 0 0, -130% 0, 0 0;
  }
}

@keyframes heroRise {
  from {
    opacity: 0;
    translate: 0 .75rem;
  }

  to {
    opacity: 1;
    translate: 0 0;
  }
}

@keyframes heroFloat {
  0%,
  100% {
    translate: 0 0;
  }

  50% {
    translate: 0 -.35rem;
  }
}

@keyframes heroCloudDrift {
  0%,
  100% {
    transform: translateX(0);
  }

  50% {
    transform: translateX(.45rem);
  }
}

@keyframes heroHeartGlow {
  0%,
  100% {
    filter: drop-shadow(0 0 0 rgba(255, 248, 231, 0));
  }

  50% {
    filter: drop-shadow(0 0 10px rgba(255, 248, 231, .42));
  }
}

@keyframes heroTwinkle {
  0%,
  100% {
    opacity: .68;
    transform: scale(.92);
  }

  50% {
    opacity: 1;
    transform: scale(1.08);
  }
}

@keyframes ribbonPop {
  from {
    opacity: 0;
    transform: translateY(.65rem) rotate(-5deg) scale(.96);
  }

  to {
    opacity: 1;
    transform: translateY(0) rotate(-2deg) scale(1);
  }
}

@keyframes cloudShelf {
  0%,
  100% {
    translate: 0 0;
  }

  50% {
    translate: 0 .18rem;
  }
}

@keyframes counterSettle {
  from {
    opacity: 0;
    translate: 0 .55rem;
  }

  to {
    opacity: 1;
    translate: 0 0;
  }
}

@keyframes jackpotLift {
  0%,
  100% {
    transform: translateY(0) scale(1);
    box-shadow:
      0 16px 32px -24px rgba(44, 62, 92, .8),
      inset 0 0 0 3px rgba(255, 255, 255, .55);
  }

  50% {
    transform: translateY(-.08rem) scale(1.012);
    box-shadow:
      0 20px 40px -24px rgba(44, 62, 92, .92),
      0 0 28px rgba(255, 248, 232, .42),
      inset 0 0 0 3px rgba(255, 255, 255, .62);
  }
}

@keyframes jackpotShine {
  0%,
  32% {
    transform: translateX(-58%) rotate(7deg);
    opacity: 0;
  }

  45% {
    opacity: .9;
  }

  64%,
  100% {
    transform: translateX(58%) rotate(7deg);
    opacity: 0;
  }
}

@keyframes jackpotAmountGlow {
  0%,
  100% {
    transform: scale(1);
    text-shadow:
      0 2px 0 rgba(255, 255, 255, .78),
      0 0 16px rgba(168, 55, 48, .16);
  }

  50% {
    transform: scale(1.045);
    text-shadow:
      0 2px 0 rgba(255, 255, 255, .86),
      0 0 18px rgba(168, 55, 48, .34),
      0 0 28px rgba(255, 248, 232, .65);
  }
}

@keyframes jackpotUnderline {
  0%,
  100% {
    opacity: .38;
    transform: scaleX(.72);
  }

  50% {
    opacity: .88;
    transform: scaleX(1);
  }
}

@keyframes jackpotSpark {
  0%,
  100% {
    opacity: .28;
    transform: scale(.78);
  }

  45% {
    opacity: 1;
    transform: scale(1.25);
  }
}

@keyframes jackpotTicketWiggle {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-.12rem);
  }
}

/* Details */
.details-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-block: clamp(3rem, 8vw, 5.5rem);
  background:
    radial-gradient(circle at 12% 18%, rgba(226, 195, 105, .2), transparent 14rem),
    radial-gradient(circle at 86% 78%, rgba(209, 75, 63, .18), transparent 16rem),
    linear-gradient(135deg, rgba(30, 74, 58, .98), rgba(15, 19, 32, .98)),
    var(--felt);
  color: var(--bone);
}

.details-section::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    repeating-linear-gradient(45deg, rgba(255, 255, 255, .035) 0 8px, transparent 8px 16px),
    linear-gradient(100deg, transparent 0 38%, rgba(255, 248, 231, .08) 48%, transparent 58% 100%);
  background-size: auto, 220% 100%;
  animation: detailsShimmer 9s linear infinite;
  pointer-events: none;
}

.details-board {
  position: relative;
  padding: clamp(1rem, 4vw, 2rem);
  background: rgba(9, 12, 20, .42);
  border: 1px solid rgba(226, 195, 105, .46);
  border-radius: 8px;
  box-shadow: 0 24px 55px -32px rgba(0, 0, 0, .72);
}

.details-board::before,
.details-board::after {
  content: "";
  position: absolute;
  left: clamp(1rem, 4vw, 2rem);
  right: clamp(1rem, 4vw, 2rem);
  height: 3px;
  background:
    linear-gradient(90deg, transparent, var(--gold-hi), transparent),
    repeating-linear-gradient(90deg, var(--gold-hi) 0 10px, transparent 10px 18px);
  opacity: .74;
}

.details-board::before {
  top: .8rem;
}

.details-board::after {
  bottom: .8rem;
}

.details-board__header {
  max-width: 44rem;
  margin-inline: auto;
  padding-block: clamp(1rem, 3vw, 1.8rem);
  text-align: center;
}

.details-kicker,
.details-ticket__label,
.details-cta p {
  font-family: var(--f-ui);
}

.details-kicker {
  margin: 0 0 .5rem;
  color: var(--gold-hi);
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.details-board__header h2 {
  color: #fff8e8;
  font-family: var(--f-marquee);
  font-size: clamp(2rem, 6vw, 4.2rem);
  font-weight: 400;
  text-shadow: 0 3px 0 rgba(0, 0, 0, .28);
}

.details-board__header p:last-child {
  max-width: 34rem;
  margin: 0 auto;
  color: rgba(237, 227, 208, .9);
  font-family: var(--f-ui);
}

.details-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.details-ticket {
  position: relative;
  min-height: 12rem;
  padding: 1.1rem;
  overflow: hidden;
  color: var(--midnight);
  background:
    radial-gradient(circle at 0 50%, transparent 0 .62rem, #fffaf0 .64rem),
    radial-gradient(circle at 100% 50%, transparent 0 .62rem, #fffaf0 .64rem),
    linear-gradient(180deg, #fff8e8, #eadcc2);
  border: 1px solid rgba(226, 195, 105, .62);
  border-radius: 8px;
  box-shadow:
    0 13px 28px -20px rgba(0, 0, 0, .8),
    inset 0 0 0 3px rgba(255, 255, 255, .45);
  animation: detailsDealIn .56s ease both;
  transform-origin: 50% 100%;
  transition: transform .18s ease, box-shadow .18s ease;
}

.details-ticket:nth-child(2) {
  animation-delay: .08s;
}

.details-ticket:nth-child(3) {
  animation-delay: .16s;
}

.details-ticket:nth-child(4) {
  animation-delay: .24s;
}

.details-ticket::before {
  content: "";
  position: absolute;
  inset: .35rem;
  border: 1px dashed rgba(168, 55, 48, .34);
  border-radius: 6px;
  pointer-events: none;
}

.details-ticket::after {
  content: "";
  position: absolute;
  right: -.95rem;
  bottom: -.95rem;
  width: 3.9rem;
  aspect-ratio: 1;
  background:
    radial-gradient(circle, transparent 0 36%, var(--red-deep) 37% 49%, var(--gold-hi) 50% 60%, var(--red-deep) 61% 72%, transparent 73%),
    repeating-conic-gradient(from 18deg, rgba(255, 248, 231, .92) 0 10deg, transparent 10deg 20deg);
  border-radius: 50%;
  opacity: .34;
}

.details-ticket:hover {
  box-shadow:
    0 18px 36px -22px rgba(0, 0, 0, .82),
    inset 0 0 0 3px rgba(255, 255, 255, .48);
  transform: translateY(-3px) rotate(-.5deg);
}

.details-ticket__label {
  position: relative;
  margin: 0 0 .45rem;
  color: var(--red-deep);
  font-size: .76rem;
  font-weight: 700;
  text-transform: uppercase;
}

.details-ticket h3 {
  position: relative;
  margin: 0;
  color: var(--felt);
  font-family: var(--f-body);
  font-size: clamp(1.25rem, 2vw, 1.55rem);
}

.details-ticket p:last-child {
  position: relative;
  margin: .65rem 0 0;
  color: var(--ink-soft);
  font-family: var(--f-ui);
}

.details-cta {
  display: flex;
  flex-wrap: wrap;
  gap: .8rem 1rem;
  align-items: center;
  justify-content: center;
  margin-top: clamp(1.25rem, 3vw, 2rem);
  padding-top: clamp(1rem, 3vw, 1.4rem);
  border-top: 1px solid rgba(226, 195, 105, .28);
}

.details-cta p {
  margin: 0;
  color: rgba(237, 227, 208, .9);
  font-weight: 700;
}

.btn-diner--felt {
  flex: 0 0 auto;
  min-width: 11rem;
  color: #fff8e8;
  background:
    radial-gradient(circle at 0 50%, transparent 0 .42rem, var(--red-deep) .44rem),
    radial-gradient(circle at 100% 50%, transparent 0 .42rem, var(--red-deep) .44rem),
    linear-gradient(180deg, #d14b3f, #9e302b);
  border-color: rgba(255, 248, 231, .32);
  box-shadow:
    0 3px 0 rgba(0, 0, 0, .35),
    inset 0 0 0 3px rgba(255, 255, 255, .16);
}

@keyframes detailsDealIn {
  from {
    opacity: 0;
    transform: translateY(1rem) rotate(2deg);
  }

  to {
    opacity: 1;
    transform: translateY(0) rotate(0);
  }
}

@keyframes detailsShimmer {
  from {
    background-position: 0 0, 120% 0;
  }

  to {
    background-position: 0 0, -120% 0;
  }
}

@media (max-width: 38rem) {
  .hero {
    min-height: auto;
    padding-block-start: 1rem;
  }

  .hero-card {
    width: 100%;
  }

  .hero-mark {
    width: min(33rem, 101vw);
    margin-left: 50%;
    transform: translateX(-50%);
  }

  .hero__names {
    top: 34.5%;
    width: 68%;
    font-size: clamp(2.2rem, 10vw, 3.5rem);
  }

  .date-ribbon {
    left: 18%;
    right: 18%;
  }

  .hero__cta {
    width: min(100%, 24rem);
    gap: .85rem;
  }

  .btn-diner {
    flex: 1 1 9.4rem;
  }
}

@media (max-width: 58rem) {
  .details-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 38rem) {
  .details-grid {
    grid-template-columns: 1fr;
  }

  .details-ticket {
    min-height: 10.5rem;
  }

  .details-cta {
    align-items: stretch;
    flex-direction: column;
  }

  .details-cta .btn-diner {
    flex: 0 0 auto;
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero::before,
  .hero-card,
  .hero-mark,
  .hero-mark__clouds,
  .hero-mark__heart-fill,
  .hero-mark__sparkles path,
  .date-ribbon,
  .hero__cloud,
  .countdown__unit,
  .details-section::before,
  .details-ticket,
  .raffle-wedding-total,
  .raffle-wedding-total::before,
  .raffle-wedding-total .raffle-total__amount,
  .raffle-wedding-total .raffle-total__amount::after,
  .jackpot-card__spark,
  .jackpot-card__ticket {
    animation: none;
  }

  .hero-mark__clouds,
  .hero-mark__sparkles path,
  .details-ticket,
  .details-ticket:hover,
  .raffle-wedding-total,
  .raffle-wedding-total .raffle-total__amount,
  .jackpot-card__spark,
  .jackpot-card__ticket {
    transform: none;
  }
}

/* Wedding raffle */
.stag-page {
  min-height: 100vh;
  background:
    linear-gradient(135deg, rgba(30, 74, 58, .95), rgba(15, 19, 32, .98)),
    var(--felt);
  color: var(--bone);
}

.raffle-hero {
  padding-block: clamp(2rem, 6vw, 5rem) clamp(1.5rem, 4vw, 3rem);
}

.raffle-hero__grid,
.raffle-main__grid {
  display: grid;
  gap: clamp(1rem, 3vw, 2rem);
  grid-template-columns: minmax(0, 1.1fr) minmax(18rem, .9fr);
  align-items: stretch;
}

.raffle-main__grid {
  align-items: start;
}

.raffle-copy {
  display: grid;
  align-content: center;
  min-height: 18rem;
}

.raffle-kicker {
  margin: 0 0 .7rem;
  color: var(--gold-hi);
  font-family: var(--f-ui);
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.raffle-copy h1 {
  max-width: 11ch;
  color: #fff8e8;
  font-family: var(--f-marquee);
  font-size: clamp(2.2rem, 7vw, 5rem);
  font-weight: 400;
  text-shadow: 0 3px 0 rgba(0, 0, 0, .28);
}

.raffle-copy__lede {
  max-width: 36rem;
  margin: .9rem 0 0;
  color: rgba(237, 227, 208, .88);
  font-family: var(--f-ui);
  font-size: clamp(1rem, 2vw, 1.2rem);
}

.raffle-schedule {
  display: grid;
  gap: .6rem;
  max-width: 38rem;
  margin: 1.2rem 0 0;
  font-family: var(--f-ui);
}

.raffle-schedule div {
  display: grid;
  grid-template-columns: minmax(8.5rem, .55fr) 1fr;
  gap: .75rem;
  padding: .65rem .8rem;
  background: rgba(9, 12, 20, .34);
  border: 1px solid rgba(226, 195, 105, .28);
  border-radius: 8px;
}

.raffle-schedule dt {
  color: var(--gold-hi);
  font-weight: 700;
}

.raffle-schedule dd {
  margin: 0;
  color: #fff8e8;
}

.raffle-total,
.raffle-form,
.raffle-baskets,
.basket-card {
  border: 1px solid rgba(226, 195, 105, .46);
  border-radius: 8px;
  box-shadow: 0 16px 40px -24px rgba(0, 0, 0, .65);
}

.raffle-total {
  display: grid;
  align-content: center;
  min-height: 18rem;
  padding: clamp(1.25rem, 4vw, 2rem);
  background:
    repeating-linear-gradient(45deg, rgba(255, 255, 255, .035) 0 8px, transparent 8px 16px),
    rgba(9, 12, 20, .6);
}

.raffle-total__label,
.raffle-form__price {
  font-family: var(--f-ui);
}

.raffle-total__label {
  margin: 0;
  color: var(--gold-hi);
  font-weight: 700;
}

.raffle-total__amount {
  margin: .2rem 0 .4rem;
  color: #fff8e8;
  font-family: var(--f-marquee);
  font-size: clamp(2.8rem, 8vw, 5.25rem);
  line-height: 1;
}

.raffle-main {
  padding-block: 0 clamp(3rem, 8vw, 5rem);
}

.raffle-form,
.raffle-baskets {
  padding: clamp(1rem, 3vw, 1.5rem);
  background: rgba(237, 227, 208, .96);
  color: var(--midnight);
}

.raffle-form h2,
.raffle-baskets h2 {
  color: var(--red-deep);
  font-family: var(--f-script);
  font-size: var(--step-2);
  font-weight: 400;
}

.raffle-form label {
  display: grid;
  gap: .3rem;
  margin-top: .85rem;
  font-family: var(--f-ui);
  font-weight: 700;
}

.raffle-hp {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.raffle-field {
  width: 100%;
  min-height: 2.85rem;
  padding: .65rem .75rem;
  color: var(--ink);
  background: #fffaf0;
  border: 1px solid rgba(15, 19, 32, .24);
  border-radius: 8px;
  font: inherit;
}

.raffle-field:focus {
  outline: 3px solid rgba(201, 164, 73, .38);
  outline-offset: 2px;
}

.ticket-stepper {
  display: grid;
  grid-template-columns: 2.65rem minmax(0, 1fr) 2.65rem;
  gap: .35rem;
  align-items: center;
}

.ticket-stepper .raffle-field {
  text-align: center;
  font-weight: 800;
  -moz-appearance: textfield;
}

.ticket-stepper .raffle-field::-webkit-outer-spin-button,
.ticket-stepper .raffle-field::-webkit-inner-spin-button {
  margin: 0;
  -webkit-appearance: none;
}

.ticket-stepper__button {
  width: 100%;
  min-height: 2.85rem;
  color: #fffaf0;
  background: var(--red-deep);
  border: 0;
  border-radius: 8px;
  box-shadow: 0 3px 0 rgba(56, 18, 16, .45);
  font-family: var(--f-ui);
  font-size: 1.35rem;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
}

.ticket-stepper__button:hover {
  filter: brightness(1.05);
}

.ticket-stepper__button:focus-visible {
  outline: 3px solid rgba(201, 164, 73, .5);
  outline-offset: 2px;
}

.raffle-form .errorlist {
  margin: .3rem 0 0;
  padding-left: 1.1rem;
  color: var(--red-deep);
  font-family: var(--f-ui);
  font-size: .92rem;
}

.raffle-form__price {
  margin: 1rem 0 .75rem;
  color: var(--ink-soft);
}

.raffle-form__total {
  margin: 0 0 .9rem;
  color: var(--midnight);
  font-family: var(--f-ui);
  font-weight: 700;
}

.raffle-submit {
  width: 100%;
  min-height: 3rem;
  color: #fffaf0;
  background: var(--red-deep);
  border: 0;
  border-radius: 8px;
  box-shadow: 0 3px 0 rgba(56, 18, 16, .45);
  font-family: var(--f-ui);
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
}

.raffle-submit:hover {
  filter: brightness(1.05);
}

.raffle-messages {
  margin: 0 0 1rem;
  padding: .75rem;
  background: rgba(30, 74, 58, .1);
  border: 1px solid rgba(30, 74, 58, .25);
  border-radius: 8px;
  font-family: var(--f-ui);
}

.raffle-messages p {
  margin: 0;
}

.basket-list {
  display: grid;
  gap: 1rem;
  margin-top: 1rem;
}

.basket-help {
  margin: -.2rem 0 1rem;
  color: var(--ink-soft);
  font-family: var(--f-ui);
}

.basket-card {
  overflow: hidden;
  background: #fffaf0;
  box-shadow: none;
}

.basket-card__media,
.basket-card__placeholder {
  width: 100%;
  aspect-ratio: 16 / 9;
  background: rgba(30, 74, 58, .12);
}

.basket-card__media {
  position: relative;
  overflow: hidden;
}

.basket-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.basket-card__placeholder {
  display: grid;
  place-items: center;
  height: 100%;
  background:
    linear-gradient(45deg, rgba(30, 74, 58, .12) 25%, transparent 25%) 0 0 / 18px 18px,
    linear-gradient(-45deg, rgba(30, 74, 58, .12) 25%, transparent 25%) 0 9px / 18px 18px,
    #efe4cf;
}

.basket-card__body {
  padding: .85rem;
}

.basket-card__label {
  margin: 0 0 .25rem;
  color: var(--red-deep);
  font-family: var(--f-ui);
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
}

.basket-card__label--claimed {
  color: var(--felt);
}

.basket-card h3 {
  margin: 0;
  font-family: var(--f-body);
  font-size: 1.15rem;
}

.basket-card__value {
  margin: .25rem 0 .55rem;
  color: var(--ink-soft);
  font-family: var(--f-ui);
  font-size: .95rem;
  font-weight: 700;
}

.basket-card ul {
  margin: 0;
  padding-left: 1.2rem;
  color: var(--ink);
  font-family: var(--f-ui);
}

.basket-card li + li {
  margin-top: .15rem;
}

@media (max-width: 48rem) {
  .raffle-hero__grid,
  .raffle-main__grid {
    grid-template-columns: 1fr;
  }

  .raffle-copy,
  .raffle-total {
    min-height: auto;
  }

  .raffle-schedule div {
    grid-template-columns: 1fr;
    gap: .2rem;
  }
}

/* Wedding-themed raffle landing */
.raffle-wedding-page {
  --page-max: min(92vw, 88rem);
  display: flex;
  min-height: 100svh;
  min-height: 100dvh;
  flex-direction: column;
  background:
    linear-gradient(90deg, rgba(255,255,255,.18), rgba(255,255,255,0) 18%, rgba(0,0,0,.04) 82%, rgba(255,255,255,.1)),
    repeating-linear-gradient(90deg, rgba(183, 214, 232, .94) 0 1.05rem, rgba(118, 174, 207, .82) 1.05rem 2.1rem);
  color: var(--ink);
}

.raffle-wedding-hero {
  position: relative;
  overflow: hidden;
  padding-block: clamp(1rem, 3vw, 2rem) clamp(2.75rem, 7vw, 5rem);
  background:
    radial-gradient(circle at 50% 24%, rgba(255, 252, 242, .72), transparent 19rem),
    radial-gradient(circle at 18% 18%, rgba(255, 255, 255, .66), transparent 11rem),
    radial-gradient(circle at 82% 28%, rgba(243, 201, 105, .28), transparent 12rem),
    linear-gradient(180deg, rgba(207, 232, 246, .95), rgba(180, 207, 229, .95) 52%, rgba(127, 176, 216, .96));
  text-align: center;
}

.raffle-wedding-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 18% 9%, rgba(255, 255, 255, .65) 0 .18rem, transparent .2rem),
    radial-gradient(circle at 84% 17%, rgba(255, 255, 255, .7) 0 .14rem, transparent .16rem),
    radial-gradient(circle at 72% 42%, rgba(255, 255, 255, .55) 0 .12rem, transparent .14rem),
    linear-gradient(110deg, transparent 0 34%, rgba(255, 255, 255, .2) 44%, transparent 56% 100%);
  background-size: auto, auto, auto, 220% 100%;
  animation: heroLightSweep 12s linear infinite;
  pointer-events: none;
}

.raffle-wedding-hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 3.3rem;
  background:
    radial-gradient(circle at 1.2rem 0, transparent 0 .76rem, rgba(255, 248, 231, .96) .8rem .98rem, transparent 1rem) 0 0 / 2.4rem 1.35rem repeat-x,
    linear-gradient(rgba(255, 248, 231, .96), rgba(255, 248, 231, .96));
  pointer-events: none;
}

.raffle-wedding-hero .container {
  position: relative;
  z-index: 1;
}

.raffle-wedding-mark {
  width: min(34rem, 96vw);
  margin-inline: auto;
  transform: none;
}

.raffle-wedding-copy {
  max-width: 42rem;
  margin: -.45rem auto 0;
}

.raffle-wedding-copy .raffle-kicker {
  color: var(--red-deep);
}

.raffle-wedding-copy h2 {
  margin: 0;
  color: #fff8e8;
  font-family: var(--f-marquee);
  font-size: clamp(2.35rem, 8vw, 5.4rem);
  font-weight: 400;
  line-height: .92;
  text-shadow:
    0 3px 0 rgba(168, 55, 48, .82),
    0 0 18px rgba(44, 62, 92, .22);
}

.raffle-wedding-copy .raffle-copy__lede {
  max-width: 36rem;
  margin: .8rem auto 0;
  color: rgba(44, 62, 92, .84);
  font-weight: 700;
}

.raffle-wedding-total {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: min(100%, 28rem);
  min-height: auto;
  margin: clamp(1.2rem, 3vw, 1.8rem) auto;
  padding: clamp(1rem, 3vw, 1.45rem);
  color: var(--ink);
  background:
    radial-gradient(circle at 0 50%, transparent 0 .68rem, #fff8e8 .7rem),
    radial-gradient(circle at 100% 50%, transparent 0 .68rem, #fff8e8 .7rem),
    linear-gradient(180deg, #fff8e8, #eadcc2);
  border-color: rgba(168, 55, 48, .35);
  box-shadow:
    0 16px 32px -24px rgba(44, 62, 92, .8),
    inset 0 0 0 3px rgba(255, 255, 255, .55);
  animation: jackpotLift 5.8s ease-in-out infinite;
}

.raffle-wedding-total::before,
.raffle-wedding-total::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.raffle-wedding-total::before {
  z-index: 0;
  inset: -70% -42%;
  background:
    linear-gradient(112deg, transparent 34%, rgba(255, 255, 255, .75) 45%, rgba(255, 248, 232, .28) 50%, transparent 62%);
  transform: translateX(-54%) rotate(7deg);
  animation: jackpotShine 4.8s ease-in-out infinite;
}

.raffle-wedding-total::after {
  z-index: 0;
  inset: .38rem;
  border: 1px dashed rgba(168, 55, 48, .28);
  border-radius: 6px;
  box-shadow:
    inset 0 0 20px rgba(255, 255, 255, .45),
    0 0 18px rgba(255, 248, 232, .38);
}

.raffle-wedding-total .raffle-total__label {
  position: relative;
  z-index: 1;
  display: inline-block;
  margin-inline: auto;
  padding: .12rem .65rem;
  color: var(--red-deep);
  background: rgba(255, 255, 255, .42);
  border: 1px solid rgba(168, 55, 48, .18);
  border-radius: 999px;
  box-shadow: 0 6px 16px -14px rgba(44, 62, 92, .8);
}

.raffle-wedding-total .raffle-total__amount {
  position: relative;
  z-index: 1;
  display: inline-block;
  color: var(--red-deep);
  text-shadow:
    0 2px 0 rgba(255, 255, 255, .78),
    0 0 18px rgba(168, 55, 48, .18);
  animation: jackpotAmountGlow 2.9s ease-in-out infinite;
}

.raffle-wedding-total .raffle-total__amount::after {
  content: "";
  position: absolute;
  inset: auto .12em -.12em;
  height: .13em;
  background: linear-gradient(90deg, transparent, rgba(255, 248, 232, .82), transparent);
  border-radius: 999px;
  filter: blur(.5px);
  animation: jackpotUnderline 2.9s ease-in-out infinite;
}

.raffle-total__caption {
  position: relative;
  z-index: 1;
  margin: .12rem 0 0;
  color: rgba(44, 62, 92, .86);
  font-family: var(--f-ui);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.jackpot-card__spark {
  position: absolute;
  z-index: 0;
  width: .38rem;
  height: .38rem;
  background: #fff8e8;
  border-radius: 999px;
  box-shadow:
    0 0 0 .18rem rgba(255, 248, 232, .2),
    0 0 16px rgba(255, 248, 232, .82);
  animation: jackpotSpark 2.6s ease-in-out infinite;
}

.jackpot-card__spark--one {
  top: .65rem;
  left: 1.2rem;
}

.jackpot-card__spark--two {
  right: 1.1rem;
  bottom: .72rem;
  animation-delay: .75s;
}

.jackpot-card__spark--three {
  top: 45%;
  right: 2.1rem;
  width: .3rem;
  height: .3rem;
  animation-delay: 1.35s;
}

.jackpot-card__ticket {
  position: absolute;
  z-index: 0;
  width: 2.9rem;
  height: 1.25rem;
  background:
    radial-gradient(circle at 0 50%, transparent 0 .22rem, #f6e8c9 .24rem),
    radial-gradient(circle at 100% 50%, transparent 0 .22rem, #f6e8c9 .24rem),
    linear-gradient(180deg, #fff8e8, #efdcb6);
  border: 1px solid rgba(168, 55, 48, .22);
  border-radius: 5px;
  box-shadow: 0 8px 14px -14px rgba(44, 62, 92, .75);
  opacity: .86;
  animation: jackpotTicketWiggle 4.4s ease-in-out infinite;
}

.jackpot-card__ticket::before {
  content: "";
  position: absolute;
  inset: .32rem .55rem;
  border-block: 1px solid rgba(168, 55, 48, .28);
}

.jackpot-card__ticket--left {
  left: .72rem;
  bottom: .62rem;
  rotate: -10deg;
}

.jackpot-card__ticket--right {
  top: .58rem;
  right: .76rem;
  rotate: 9deg;
  animation-delay: .9s;
}

.raffle-wedding-schedule {
  max-width: 54rem;
  margin: 0 auto;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.raffle-wedding-schedule div {
  grid-template-columns: 1fr;
  gap: .2rem;
  background:
    linear-gradient(180deg, rgba(255, 248, 232, .94), rgba(238, 223, 192, .94));
  border-color: rgba(44, 62, 92, .22);
  box-shadow: 0 10px 24px -20px rgba(44, 62, 92, .6);
}

.raffle-wedding-schedule dt {
  color: var(--red-deep);
}

.raffle-wedding-schedule dd {
  color: var(--ink);
}

.raffle-wedding-page .raffle-main {
  padding-block: clamp(2rem, 6vw, 4rem);
  background:
    radial-gradient(circle at 12% 18%, rgba(255, 252, 242, .54), transparent 15rem),
    radial-gradient(circle at 85% 86%, rgba(243, 201, 105, .2), transparent 17rem),
    linear-gradient(180deg, rgba(180, 207, 229, .95), rgba(127, 176, 216, .96));
}

.raffle-wedding-page .raffle-form,
.raffle-wedding-page .raffle-baskets {
  background: rgba(255, 248, 232, .96);
  border-color: rgba(168, 55, 48, .28);
}

.raffle-wedding-page .raffle-form h2,
.raffle-wedding-page .raffle-baskets h2 {
  color: var(--red-deep);
}

.raffle-wedding-page .basket-card {
  border-color: rgba(168, 55, 48, .2);
}

@media (max-width: 48rem) {
  .raffle-wedding-schedule {
    grid-template-columns: 1fr;
  }
}

/* Compact one-screen raffle layout */
.raffle-wedding-page .raffle-wedding-hero {
  flex: 1 1 auto;
  display: grid;
  align-items: center;
  min-height: auto;
  padding-block: clamp(.45rem, 1.4svh, 1rem) clamp(.7rem, 1.7svh, 1.25rem);
}

.raffle-wedding-page .raffle-wedding-hero .container {
  display: grid;
  gap: clamp(.5rem, 1.2svh, .9rem) 1rem;
  grid-template-areas:
    ". mark total"
    ". mark schedule";
  grid-template-columns: minmax(0, 1fr) minmax(18.5rem, 21.5rem) minmax(22rem, 1fr);
  align-items: center;
}

.raffle-wedding-page .raffle-wedding-mark {
  grid-area: mark;
  justify-self: center;
  width: clamp(18.5rem, 25vw, 21.5rem);
}

.raffle-wedding-page .raffle-wedding-mark .hero-mark__art {
  transform: none;
}

.raffle-wedding-page .raffle-wedding-mark .hero__names {
  font-size: clamp(2.25rem, 3.3vw, 3.05rem);
}

.raffle-wedding-page .raffle-wedding-mark .date-ribbon {
  min-height: 1.12rem;
  padding-inline: .42rem;
  font-size: .62rem;
}

.raffle-wedding-page .raffle-wedding-mark .date-ribbon::before,
.raffle-wedding-page .raffle-wedding-mark .date-ribbon::after {
  top: .18rem;
  width: 1.35rem;
  height: .62rem;
}

.raffle-wedding-page .raffle-wedding-mark .date-ribbon::before {
  left: -.8rem;
}

.raffle-wedding-page .raffle-wedding-mark .date-ribbon::after {
  right: -.8rem;
}

.raffle-wedding-page .raffle-wedding-total {
  grid-area: total;
  width: min(100%, 20rem);
  margin: 0;
  padding: .65rem .75rem .75rem;
}

.raffle-wedding-page .raffle-total__amount {
  margin: .05rem 0 0;
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: .95;
}

.raffle-wedding-page .raffle-total__caption {
  font-size: .62rem;
  line-height: 1.1;
}

.raffle-wedding-page .raffle-wedding-schedule {
  grid-area: schedule;
  max-width: 100%;
  gap: .4rem;
  margin: 0;
}

.raffle-wedding-page .raffle-wedding-schedule div {
  padding: .45rem .55rem;
}

.raffle-wedding-page .raffle-wedding-schedule dt,
.raffle-wedding-page .raffle-wedding-schedule dd {
  font-size: .85rem;
  line-height: 1.25;
}

.raffle-wedding-page .checkerboard {
  flex: 0 0 auto;
  height: 16px;
}

.raffle-wedding-page .raffle-main {
  flex: 0 0 auto;
  min-height: auto;
  display: grid;
  align-items: start;
  padding-block: .55rem .65rem;
}

.raffle-wedding-page .raffle-main > .container {
  width: 100%;
}

.raffle-wedding-page .raffle-main__grid {
  height: auto;
  align-items: start;
  gap: .9rem;
  grid-template-columns: minmax(18rem, .78fr) minmax(32rem, 1.22fr);
}

.raffle-wedding-page .raffle-main__grid--request-only {
  grid-template-columns: minmax(20rem, 34rem);
  justify-content: center;
}

.raffle-wedding-page .raffle-form,
.raffle-wedding-page .raffle-baskets {
  height: auto;
  padding: .6rem .85rem;
}

.raffle-wedding-page .raffle-form {
  display: grid;
  gap: .34rem .65rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
}

.raffle-wedding-page .raffle-form h2,
.raffle-wedding-page .raffle-form .raffle-messages,
.raffle-wedding-page .raffle-form .errorlist,
.raffle-wedding-page .raffle-form__price,
.raffle-wedding-page .raffle-form__total,
.raffle-wedding-page .purchase-direct,
.raffle-wedding-page .request-form-note,
.raffle-wedding-page .raffle-submit,
.raffle-wedding-page .request-next {
  grid-column: 1 / -1;
}

.raffle-wedding-page .raffle-form h2,
.raffle-wedding-page .raffle-baskets h2 {
  margin-bottom: .1rem;
  font-size: clamp(1.45rem, 2.6vw, 1.8rem);
}

.raffle-wedding-page .raffle-form label {
  gap: .18rem;
  margin-top: 0;
  font-size: 1rem;
}

.raffle-wedding-page .raffle-field {
  min-height: 2.04rem;
  padding: .32rem .48rem;
  font-size: 1.02rem;
}

.raffle-wedding-page .raffle-form__price {
  margin: .15rem 0 0;
  font-size: 1rem;
}

.raffle-wedding-page .raffle-form__total {
  margin: 0;
  font-size: 1rem;
}

.raffle-wedding-page .raffle-submit {
  min-height: 2.25rem;
  font-size: 1rem;
}

.raffle-wedding-page .purchase-direct {
  display: grid;
  grid-template-areas:
    "eyebrow price"
    "title price"
    "email email"
    "message message";
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .14rem;
  padding: .42rem .58rem;
  align-items: center;
  color: var(--ink);
  background: linear-gradient(180deg, rgba(255, 248, 232, .98), rgba(255, 239, 201, .9));
  border: 2px solid rgba(168, 55, 48, .42);
  border-radius: 8px;
  box-shadow: 0 5px 14px rgba(168, 55, 48, .14);
}

.raffle-wedding-page .purchase-direct__eyebrow,
.raffle-wedding-page .purchase-direct__price {
  margin: 0;
  color: var(--red-deep);
  font-family: var(--f-ui);
  font-size: .7rem;
  font-weight: 900;
  letter-spacing: .04em;
  line-height: 1;
  text-transform: uppercase;
}

.raffle-wedding-page .purchase-direct__eyebrow {
  grid-area: eyebrow;
}

.raffle-wedding-page .purchase-direct h2 {
  grid-area: title;
  margin: 0;
  color: var(--red);
  font-size: clamp(1.55rem, 2.7vw, 1.9rem);
  line-height: .95;
}

.raffle-wedding-page .purchase-direct__email {
  grid-area: email;
  margin: 0;
  font-family: var(--f-ui);
  font-size: 1.05rem;
  font-weight: 800;
  line-height: 1.12;
}

.raffle-wedding-page .purchase-direct__email strong {
  color: var(--red-deep);
  font-size: 1.1rem;
  overflow-wrap: anywhere;
}

.raffle-wedding-page .purchase-direct__price {
  grid-area: price;
  display: grid;
  min-width: 5.6rem;
  min-height: 3.05rem;
  place-items: center;
  padding: .24rem .38rem .3rem;
  color: #fff8e8;
  background:
    radial-gradient(circle at 12% 18%, rgba(255, 248, 232, .22), transparent 1rem),
    linear-gradient(180deg, #c94940, #a72f2a);
  border: 2px solid rgba(255, 248, 232, .8);
  border-radius: 8px;
  box-shadow:
    0 3px 0 rgba(93, 32, 28, .5),
    0 7px 14px -12px rgba(44, 62, 92, .75);
  line-height: .9;
  text-align: center;
  transform: rotate(2deg);
}

.raffle-wedding-page .purchase-direct__price strong {
  color: #fff8e8;
  font-family: var(--f-marquee);
  font-size: clamp(1.55rem, 3vw, 2.15rem);
  font-weight: 400;
  letter-spacing: 0;
}

.raffle-wedding-page .purchase-direct__price span {
  color: #fff4cc;
  font-size: .68rem;
  font-weight: 950;
}

.raffle-wedding-page .purchase-direct__message {
  grid-area: message;
  margin: 0;
  font-family: var(--f-ui);
  font-size: .86rem;
  font-weight: 750;
  line-height: 1.22;
}

.raffle-wedding-page .request-form-note {
  margin: .05rem 0 .08rem;
  color: rgba(35, 64, 92, .84);
  font-family: var(--f-ui);
  font-size: .9rem;
  font-weight: 700;
  line-height: 1.22;
}

.raffle-wedding-page .raffle-form__price strong {
  color: var(--red-deep);
  font-family: var(--f-marquee);
  font-size: 1.24rem;
  font-weight: 400;
  line-height: .9;
}

.raffle-wedding-page .request-next {
  margin-top: .08rem;
  padding: .48rem .55rem;
  color: var(--ink);
  background: rgba(255, 255, 255, .44);
  border: 1px solid rgba(168, 55, 48, .18);
  border-radius: 7px;
  font-family: var(--f-ui);
  font-size: .78rem;
  line-height: 1.22;
}

.raffle-wedding-page .request-next p {
  margin: 0 0 .35rem;
}

.raffle-wedding-page .etransfer-email {
  color: var(--red-deep);
  font-weight: 900;
  overflow-wrap: anywhere;
}

.raffle-wedding-page .etransfer-steps {
  display: grid;
  gap: .35rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
}

.raffle-wedding-page .etransfer-steps div {
  min-width: 0;
  padding-left: .65rem;
  border-left: 2px solid rgba(168, 55, 48, .34);
}

.raffle-wedding-page .etransfer-steps dt {
  margin: 0 0 .08rem;
  color: var(--red);
  font-size: .64rem;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.raffle-wedding-page .etransfer-steps dd {
  margin: 0;
  font-weight: 800;
}

.raffle-wedding-page .request-next ol {
  display: grid;
  gap: .35rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
}

.raffle-wedding-page .request-next li {
  padding-left: .65rem;
  border-left: 2px solid rgba(168, 55, 48, .34);
}

.raffle-wedding-page .basket-help {
  margin: 0 0 .45rem;
  font-size: .82rem;
  line-height: 1.25;
}

.raffle-wedding-page .raffle-baskets {
  display: flex;
  flex-direction: column;
}

.raffle-wedding-page .basket-photo-slot {
  position: relative;
  flex: 1 1 auto;
  min-height: clamp(8rem, 24svh, 24rem);
  margin: 0 0 .55rem;
  overflow: hidden;
  border: 1px dashed rgba(168, 55, 48, .34);
  border-radius: 7px;
  background:
    linear-gradient(135deg, rgba(255, 248, 231, .62), rgba(238, 223, 192, .44)),
    repeating-linear-gradient(45deg, rgba(168, 55, 48, .07) 0 .5rem, transparent .5rem 1rem),
    radial-gradient(circle at 28% 24%, rgba(255, 255, 255, .72), transparent 9rem),
    rgba(245, 233, 205, .62);
  box-shadow:
    inset 0 0 0 4px rgba(255, 248, 231, .42),
    inset 0 12px 28px rgba(49, 82, 115, .08);
}

.raffle-wedding-page .basket-photo-slot::before,
.raffle-wedding-page .basket-photo-slot::after {
  content: "";
  position: absolute;
  width: 2rem;
  height: 2rem;
  border-color: rgba(168, 55, 48, .4);
  pointer-events: none;
}

.raffle-wedding-page .basket-photo-slot::before {
  top: .7rem;
  left: .7rem;
  border-top: 2px solid rgba(168, 55, 48, .44);
  border-left: 2px solid rgba(168, 55, 48, .44);
}

.raffle-wedding-page .basket-photo-slot::after {
  right: .7rem;
  bottom: .7rem;
  border-right: 2px solid rgba(168, 55, 48, .44);
  border-bottom: 2px solid rgba(168, 55, 48, .44);
}

.raffle-wedding-page .basket-list {
  flex: 0 0 auto;
  gap: .55rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 0;
}

.raffle-wedding-page .basket-card__media,
.raffle-wedding-page .basket-card__placeholder {
  display: none;
}

.raffle-wedding-page .basket-card__body {
  padding: .6rem;
}

.raffle-wedding-page .basket-card__label {
  margin-bottom: .15rem;
  font-size: .68rem;
}

.raffle-wedding-page .basket-card h3 {
  font-size: .98rem;
}

.raffle-wedding-page .basket-card__value,
.raffle-wedding-page .basket-card ul {
  font-size: .82rem;
}

.raffle-wedding-page .basket-card__value {
  margin: .15rem 0 .35rem;
}

/* Desktop one-screen: centered 2-col hero (overrides compact 3-col grid above) */
@media (min-width: 48.01rem) {
  .raffle-wedding-page {
    --page-max: min(94vw, 72rem);
  }

  .raffle-wedding-page .raffle-wedding-hero {
    flex: 1 1 auto;
    display: grid;
    align-items: center;
    min-height: 0;
    padding-block: clamp(.45rem, 1.4svh, 1rem) clamp(.5rem, 1.2svh, .85rem);
  }

  .raffle-wedding-page .raffle-wedding-hero .container {
    display: grid;
    width: 100%;
    gap: clamp(.4rem, 1svh, .7rem) clamp(.75rem, 2vw, 1.5rem);
    grid-template-areas:
      "mark total"
      "schedule schedule";
    grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
    align-items: center;
    max-width: var(--page-max);
    margin-inline: auto;
  }

  .raffle-wedding-page .raffle-wedding-mark {
    grid-area: mark;
    justify-self: center;
    align-self: center;
    width: min(100%, clamp(20rem, 36vmin, 30rem));
  }

  .raffle-wedding-page .raffle-wedding-mark .hero__names {
    font-size: clamp(2.4rem, 5vmin, 3.8rem);
  }

  .raffle-wedding-page .raffle-wedding-mark .date-ribbon {
    min-height: clamp(1.35rem, 2.8vmin, 2rem);
    padding-inline: clamp(.5rem, 1.2vmin, .85rem);
    font-size: clamp(.85rem, 1.6vmin, 1.15rem);
  }

  .raffle-wedding-page .raffle-wedding-mark .date-ribbon::before,
  .raffle-wedding-page .raffle-wedding-mark .date-ribbon::after {
    top: clamp(.28rem, .6vmin, .42rem);
    width: clamp(2rem, 4vmin, 3rem);
    height: clamp(.85rem, 1.8vmin, 1.25rem);
  }

  .raffle-wedding-page .raffle-wedding-mark .date-ribbon::before {
    left: clamp(-1.6rem, -3.5vmin, -1.1rem);
  }

  .raffle-wedding-page .raffle-wedding-mark .date-ribbon::after {
    right: clamp(-1.6rem, -3.5vmin, -1.1rem);
  }

  .raffle-wedding-page .hero__raffle-info strong {
    font-size: clamp(.78rem, 1.5vmin, 1rem);
  }

  .raffle-wedding-page .hero__raffle-info > span {
    font-size: clamp(.58rem, 1.1vmin, .72rem);
  }

  .raffle-wedding-page .hero__raffle-info .hero__ticket-price b {
    font-size: clamp(1rem, 2.2vmin, 1.45rem);
  }

  .raffle-wedding-page .hero__raffle-info .hero__ticket-price em {
    font-size: clamp(.48rem, .9vmin, .58rem);
  }

  .raffle-wedding-page .raffle-wedding-total {
    grid-area: total;
    justify-self: stretch;
    align-self: center;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: clamp(.55rem, 1.2svh, .85rem) clamp(.7rem, 1.5vw, 1rem);
  }

  .raffle-wedding-page .raffle-total__amount {
    margin: .05rem 0 0;
    font-size: clamp(2.2rem, 5vmin, 3.5rem);
    line-height: .95;
  }

  .raffle-wedding-page .raffle-total__caption {
    font-size: clamp(.68rem, 1.2vmin, .82rem);
    line-height: 1.15;
  }

  .raffle-wedding-page .raffle-wedding-schedule {
    grid-area: schedule;
    width: 100%;
    max-width: none;
    gap: clamp(.35rem, .8svh, .55rem);
    margin: 0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .raffle-wedding-page .raffle-wedding-schedule div {
    padding: clamp(.4rem, .9svh, .55rem) clamp(.45rem, 1vw, .75rem);
  }

  .raffle-wedding-page .raffle-wedding-schedule dt,
  .raffle-wedding-page .raffle-wedding-schedule dd {
    font-size: clamp(.78rem, 1.4vmin, .95rem);
    line-height: 1.22;
  }

  .raffle-wedding-page .checkerboard {
    flex: 0 0 auto;
    height: clamp(12px, 1.5svh, 16px);
  }

  .raffle-wedding-page .raffle-main {
    flex: 0 0 auto;
    display: block;
    min-height: auto;
    padding-block: clamp(.4rem, 1svh, .65rem) clamp(.5rem, 1.1svh, .75rem);
  }

  .raffle-wedding-page .raffle-main > .container {
    display: block;
    width: 100%;
    max-width: var(--page-max);
    margin-inline: auto;
  }

  .raffle-wedding-page .raffle-main__grid,
  .raffle-wedding-page .raffle-main__grid--request-only {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(0, 1fr);
    justify-content: stretch;
  }

  .raffle-wedding-page .raffle-form,
  .raffle-wedding-page .raffle-baskets {
    width: 100%;
    height: auto;
    padding: clamp(.55rem, 1.2svh, .85rem) clamp(.85rem, 2vw, 1.25rem);
  }

  .raffle-wedding-page .raffle-form {
    display: grid;
    gap: clamp(.4rem, .9svh, .6rem) clamp(.75rem, 1.8vw, 1.25rem);
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-content: start;
    align-items: start;
  }

  .raffle-wedding-page .purchase-direct {
    grid-column: 1 / 3;
    align-self: start;
    height: auto;
    display: grid;
    gap: .35rem;
    padding: clamp(.55rem, 1.1svh, .75rem) clamp(.65rem, 1.4vw, .9rem);
  }

  .raffle-wedding-page .raffle-form > h2,
  .raffle-wedding-page .raffle-form > .raffle-messages,
  .raffle-wedding-page .raffle-form > .errorlist,
  .raffle-wedding-page .raffle-form > .request-form-note,
  .raffle-wedding-page .raffle-form > .raffle-form__price,
  .raffle-wedding-page .raffle-form > .raffle-form__total,
  .raffle-wedding-page .raffle-form > .raffle-submit,
  .raffle-wedding-page .raffle-form > .request-next {
    grid-column: 3 / 5;
  }

  .raffle-wedding-page .raffle-form label:has(#id_full_name) {
    grid-column: 3;
  }

  .raffle-wedding-page .raffle-form label:has(#id_email) {
    grid-column: 4;
  }

  .raffle-wedding-page .raffle-form label:has(#id_phone) {
    grid-column: 3;
  }

  .raffle-wedding-page .raffle-form label.ticket-quantity-label {
    grid-column: 4;
  }

  .raffle-wedding-page .raffle-hp {
    grid-column: 3 / 5;
  }

  .raffle-wedding-page .raffle-form h2,
  .raffle-wedding-page .raffle-baskets h2 {
    font-size: clamp(1.55rem, 2.8vmin, 1.9rem);
  }

  .raffle-wedding-page .raffle-form label {
    font-size: clamp(.92rem, 1.5vmin, 1rem);
  }

  .raffle-wedding-page .raffle-field {
    min-height: 2.35rem;
    padding: .4rem .55rem;
    font-size: 1rem;
  }

  .raffle-wedding-page .raffle-submit {
    min-height: 2.5rem;
    font-size: 1rem;
  }

  .raffle-wedding-page .purchase-direct h2 {
    font-size: clamp(1.55rem, 2.8vmin, 1.9rem);
  }

  .raffle-wedding-page .purchase-direct__price strong {
    font-size: clamp(1.55rem, 3vmin, 2.15rem);
  }

  .raffle-wedding-page .request-form-note {
    font-size: clamp(.88rem, 1.4vmin, .95rem);
  }
}

/* Wide desktop: hero mark + jackpot + schedule on one row */
@media (min-width: 64rem) {
  .raffle-wedding-page .raffle-wedding-hero .container {
    grid-template-areas: "mark total schedule";
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .75fr) minmax(0, 1.15fr);
    align-items: center;
  }

  .raffle-wedding-page .raffle-wedding-schedule {
    align-self: center;
  }
}

@media (max-width: 48rem) {
  .raffle-wedding-page .raffle-wedding-hero {
    flex: 1 1 auto;
    min-height: auto;
    padding-block: clamp(.5rem, 1.35svh, .9rem) clamp(.55rem, 1.45svh, .95rem);
  }

  .raffle-wedding-page .raffle-wedding-hero .container {
    display: grid;
    gap: clamp(.32rem, .8svh, .55rem) .55rem;
    grid-template-areas:
      "mark mark"
      "total total"
      "schedule schedule";
    grid-template-columns: 1fr 1fr;
    align-items: center;
  }

  .raffle-wedding-page .raffle-wedding-mark {
    width: clamp(12.4rem, 25svh, 15rem);
  }

  .raffle-wedding-page .raffle-wedding-mark .hero__names {
    font-size: clamp(1.66rem, 3.6svh, 2.05rem);
  }

  .raffle-wedding-page .raffle-wedding-mark .date-ribbon {
    min-height: .84rem;
    padding-inline: .28rem;
    font-size: .5rem;
  }

  .raffle-wedding-page .raffle-wedding-mark .date-ribbon::before,
  .raffle-wedding-page .raffle-wedding-mark .date-ribbon::after {
    top: .1rem;
    width: .8rem;
    height: .38rem;
  }

  .raffle-wedding-page .raffle-wedding-mark .date-ribbon::before {
    left: -.46rem;
  }

  .raffle-wedding-page .raffle-wedding-mark .date-ribbon::after {
    right: -.46rem;
  }

  .raffle-wedding-page .hero__raffle-info {
    right: 12%;
    bottom: -.08rem;
    left: 12%;
    gap: .02rem;
    padding: .18rem .28rem .2rem;
    border-radius: 5px;
  }

  .raffle-wedding-page .hero__raffle-info strong {
    font-size: .6rem;
  }

  .raffle-wedding-page .hero__raffle-info > span {
    font-size: .46rem;
  }

  .raffle-wedding-page .hero__raffle-info .hero__ticket-price {
    gap: .12rem;
    margin: .03rem auto;
    padding: .08rem .28rem .1rem;
  }

  .raffle-wedding-page .hero__raffle-info .hero__ticket-price b {
    font-size: .95rem;
  }

  .raffle-wedding-page .hero__raffle-info .hero__ticket-price em {
    font-size: .38rem;
  }

  .raffle-wedding-page .raffle-wedding-total {
    grid-area: total;
    margin: 0;
    padding: .42rem .5rem .5rem;
  }

  .raffle-wedding-page .raffle-total__label {
    font-size: .82rem;
  }

  .raffle-wedding-page .raffle-total__amount {
    margin-bottom: .18rem;
    font-size: 1.95rem;
    line-height: .9;
  }

  .raffle-wedding-page .raffle-total__caption {
    display: none;
  }

  .raffle-wedding-page .jackpot-card__spark {
    width: .25rem;
    height: .25rem;
  }

  .raffle-wedding-page .jackpot-card__spark--one {
    top: .34rem;
    left: .52rem;
  }

  .raffle-wedding-page .jackpot-card__spark--two {
    right: .5rem;
    bottom: .34rem;
  }

  .raffle-wedding-page .jackpot-card__spark--three {
    right: .82rem;
  }

  .raffle-wedding-page .jackpot-card__ticket {
    width: 1.6rem;
    height: .75rem;
  }

  .raffle-wedding-page .jackpot-card__ticket--left {
    left: .35rem;
    bottom: .28rem;
  }

  .raffle-wedding-page .jackpot-card__ticket--right {
    top: .3rem;
    right: .35rem;
  }

  .raffle-wedding-page .raffle-total__button {
    min-height: 1.85rem;
    padding: .28rem .45rem;
    font-size: .86rem;
  }

  .raffle-wedding-page .raffle-wedding-schedule {
    grid-area: schedule;
    gap: .25rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: .1rem;
  }

  .raffle-wedding-page .raffle-wedding-schedule div {
    min-height: 2.55rem;
    padding: .32rem .2rem;
  }

  .raffle-wedding-page .raffle-wedding-schedule dt,
  .raffle-wedding-page .raffle-wedding-schedule dd {
    font-size: .65rem;
    line-height: 1.18;
  }

  .raffle-wedding-page .raffle-main {
    flex: 0 0 auto;
    min-height: auto;
    padding-block: .45rem .55rem;
  }

  .raffle-wedding-page .raffle-main__grid {
    min-height: auto;
    height: auto;
    align-items: start;
    gap: .55rem;
    grid-template-columns: 1fr;
    padding-inline: .5rem;
  }

  .raffle-wedding-page .raffle-main__grid--request-only {
    grid-template-columns: minmax(0, 1fr);
    justify-content: center;
  }

  .raffle-wedding-page .raffle-form,
  .raffle-wedding-page .raffle-baskets {
    min-height: auto;
    height: auto;
    padding: .6rem .68rem;
  }

  .raffle-wedding-page .raffle-form {
    align-content: start;
    gap: .52rem .5rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .raffle-wedding-page .raffle-form h2,
  .raffle-wedding-page .raffle-baskets h2 {
    margin-bottom: 0;
    font-size: 1.42rem;
    line-height: 1.05;
  }

  .raffle-wedding-page .raffle-form label {
    gap: .16rem;
    font-size: .92rem;
  }

  .raffle-wedding-page .raffle-field {
    min-height: 2rem;
    padding: .3rem .38rem;
    font-size: .98rem;
  }

  .raffle-wedding-page .ticket-stepper {
    grid-template-columns: 2rem minmax(0, 1fr) 2rem;
    gap: .25rem;
  }

  .raffle-wedding-page .ticket-stepper__button {
    min-height: 2rem;
    border-radius: 6px;
    font-size: 1.16rem;
  }

  .raffle-wedding-page .raffle-form__price,
  .raffle-wedding-page .raffle-form__total {
    font-size: .94rem;
    line-height: 1.18;
  }

  .raffle-wedding-page .raffle-form__price {
    margin-top: .05rem;
  }

  .raffle-wedding-page .raffle-submit {
    min-height: 2.35rem;
    padding: .42rem .58rem;
    font-size: 1rem;
  }

  .raffle-wedding-page .purchase-direct {
    grid-template-areas:
      "eyebrow price"
      "title price"
      "email email"
      "message message";
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .16rem;
    padding: .45rem .5rem;
    border-radius: 7px;
  }

  .raffle-wedding-page .purchase-direct__eyebrow {
    font-size: .66rem;
  }

  .raffle-wedding-page .purchase-direct__price {
    min-width: 4.75rem;
    min-height: 2.65rem;
    padding: .18rem .28rem .22rem;
  }

  .raffle-wedding-page .purchase-direct__price strong {
    font-size: 1.48rem;
  }

  .raffle-wedding-page .purchase-direct__price span {
    font-size: .58rem;
  }

  .raffle-wedding-page .purchase-direct h2 {
    font-size: 1.42rem;
  }

  .raffle-wedding-page .purchase-direct__email {
    font-size: .88rem;
    line-height: 1.12;
  }

  .raffle-wedding-page .purchase-direct__email strong {
    font-size: .96rem;
  }

  .raffle-wedding-page .purchase-direct__message {
    font-size: .78rem;
    line-height: 1.16;
  }

  .raffle-wedding-page .request-form-note {
    margin: .03rem 0 0;
    font-size: .82rem;
    line-height: 1.18;
  }

  .raffle-wedding-page .raffle-form .errorlist {
    margin-top: .22rem;
    padding-left: .95rem;
    font-size: .82rem;
    line-height: 1.14;
  }

  .raffle-wedding-page .request-next {
    padding: .28rem .38rem;
    font-size: .62rem;
    line-height: 1.13;
  }

  .raffle-wedding-page .request-next p {
    margin: 0;
  }

  .raffle-wedding-page .etransfer-steps {
    gap: .12rem;
    grid-template-columns: 1fr;
    margin-top: .12rem;
  }

  .raffle-wedding-page .etransfer-steps div {
    padding-left: .45rem;
  }

  .raffle-wedding-page .etransfer-steps dt,
  .raffle-wedding-page .etransfer-steps dd {
    display: inline;
  }

  .raffle-wedding-page .etransfer-steps dt {
    margin-right: .22rem;
    font-size: .52rem;
  }

  .raffle-wedding-page .request-next ol {
    display: none;
  }

  .raffle-wedding-page .basket-help {
    display: none;
  }

  .raffle-wedding-page .basket-photo-slot {
    min-height: clamp(2.1rem, 7svh, 3.1rem);
    margin: .28rem 0 .35rem;
  }

  .raffle-wedding-page .basket-photo-slot::before,
  .raffle-wedding-page .basket-photo-slot::after {
    width: 1.1rem;
    height: 1.1rem;
  }

  .raffle-wedding-page .basket-list {
    gap: .25rem;
    grid-template-columns: 1fr;
    margin-top: 0;
  }

  .raffle-wedding-page .basket-card {
    display: block;
  }

  .raffle-wedding-page .basket-card__body {
    padding: .35rem .45rem;
  }

  .raffle-wedding-page .basket-card__label {
    margin-bottom: .05rem;
    font-size: .52rem;
  }

  .raffle-wedding-page .basket-card h3 {
    font-size: .86rem;
    line-height: 1.05;
  }

  .raffle-wedding-page .basket-card__value,
  .raffle-wedding-page .basket-card ul {
    display: none;
  }
}

@media (max-width: 23.75rem) and (max-height: 47rem) {
  .raffle-wedding-page .raffle-wedding-hero {
    padding-block: .22rem .35rem;
  }

  .raffle-wedding-page .raffle-wedding-hero .container {
    gap: .18rem .4rem;
  }

  .raffle-wedding-page .raffle-wedding-mark {
    width: 10.8rem;
  }

  .raffle-wedding-page .raffle-wedding-mark .hero__names {
    font-size: 1.45rem;
  }

  .raffle-wedding-page .raffle-wedding-mark .date-ribbon {
    min-height: .72rem;
    font-size: .42rem;
  }

  .raffle-wedding-page .hero__raffle-info {
    right: 10%;
    left: 10%;
    padding: .14rem .2rem .16rem;
  }

  .raffle-wedding-page .hero__raffle-info strong {
    font-size: .54rem;
  }

  .raffle-wedding-page .hero__raffle-info > span {
    font-size: .4rem;
  }

  .raffle-wedding-page .hero__raffle-info .hero__ticket-price b {
    font-size: .82rem;
  }

  .raffle-wedding-page .hero__raffle-info .hero__ticket-price em {
    font-size: .34rem;
  }

  .raffle-wedding-page .raffle-wedding-total {
    padding: .3rem .36rem .36rem;
  }

  .raffle-wedding-page .raffle-total__amount {
    margin-bottom: .08rem;
    font-size: 1.72rem;
  }

  .raffle-wedding-page .raffle-wedding-schedule {
    gap: .18rem;
    margin-top: 0;
  }

  .raffle-wedding-page .raffle-wedding-schedule div {
    min-height: 2.24rem;
    padding: .2rem .12rem;
  }

  .raffle-wedding-page .raffle-wedding-schedule dt,
  .raffle-wedding-page .raffle-wedding-schedule dd {
    font-size: .58rem;
    line-height: 1.14;
  }

  .raffle-wedding-page .checkerboard {
    height: 14px;
  }

  .raffle-wedding-page .raffle-main {
    padding-block: .3rem .34rem;
  }

  .raffle-wedding-page .raffle-main__grid {
    gap: .38rem;
    padding-inline: .36rem;
  }

  .raffle-wedding-page .raffle-form,
  .raffle-wedding-page .raffle-baskets {
    padding: .42rem .52rem;
  }

  .raffle-wedding-page .raffle-form {
    gap: .34rem .36rem;
  }

  .raffle-wedding-page .purchase-direct {
    gap: .08rem;
    padding: .32rem .36rem;
  }

  .raffle-wedding-page .purchase-direct__eyebrow {
    font-size: .56rem;
  }

  .raffle-wedding-page .purchase-direct h2 {
    font-size: 1.24rem;
  }

  .raffle-wedding-page .purchase-direct__email {
    font-size: .78rem;
  }

  .raffle-wedding-page .purchase-direct__message {
    font-size: .68rem;
  }

  .raffle-wedding-page .purchase-direct__price {
    min-width: 4.35rem;
    min-height: 2.28rem;
    padding: .14rem .22rem .18rem;
  }

  .raffle-wedding-page .purchase-direct__price strong {
    font-size: 1.26rem;
  }

  .raffle-wedding-page .purchase-direct__price span {
    font-size: .5rem;
  }

  .raffle-wedding-page .raffle-form h2,
  .raffle-wedding-page .raffle-baskets h2 {
    font-size: 1.28rem;
  }

  .raffle-wedding-page .request-form-note {
    font-size: .74rem;
  }

  .raffle-wedding-page .raffle-form label {
    font-size: .84rem;
  }

  .raffle-wedding-page .raffle-field {
    min-height: 1.78rem;
    padding: .22rem .3rem;
    font-size: .92rem;
  }

  .raffle-wedding-page .ticket-stepper {
    grid-template-columns: 1.78rem minmax(0, 1fr) 1.78rem;
    gap: .2rem;
  }

  .raffle-wedding-page .ticket-stepper__button {
    min-height: 1.78rem;
    font-size: 1rem;
  }

  .raffle-wedding-page .raffle-form__price,
  .raffle-wedding-page .raffle-form__total {
    font-size: .86rem;
  }

  .raffle-wedding-page .raffle-form__price strong {
    font-size: 1.08rem;
  }

  .raffle-wedding-page .raffle-submit {
    min-height: 2.05rem;
    padding: .32rem .46rem;
  }
}

@media (min-width: 48.01rem) and (max-height: 48rem) {
  .raffle-wedding-page .raffle-wedding-hero {
    padding-block: clamp(.2rem, .7svh, .4rem) clamp(.3rem, .9svh, .5rem);
  }

  .raffle-wedding-page .raffle-wedding-hero .container {
    gap: clamp(.2rem, .55svh, .35rem) clamp(.55rem, 1.2vw, .85rem);
    grid-template-areas:
      "mark total"
      "schedule schedule";
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  }

  .raffle-wedding-page .raffle-wedding-mark {
    width: min(100%, clamp(18rem, 32vmin, 26rem));
  }

  .raffle-wedding-page .raffle-wedding-mark .hero__names {
    font-size: clamp(2.1rem, 4.5vmin, 3rem);
  }

  .raffle-wedding-page .raffle-wedding-mark .date-ribbon {
    min-height: clamp(1.1rem, 2.4vmin, 1.5rem);
    font-size: clamp(.75rem, 1.4vmin, .95rem);
  }

  .raffle-wedding-page .hero__raffle-info {
    padding: .2rem .42rem .24rem;
  }

  .raffle-wedding-page .raffle-wedding-total {
    padding: .45rem .65rem .55rem;
  }

  .raffle-wedding-page .raffle-total__amount {
    font-size: clamp(1.85rem, 3.5vw, 2.65rem);
  }

  .raffle-wedding-page .raffle-wedding-schedule {
    gap: .32rem;
  }

  .raffle-wedding-page .raffle-wedding-schedule div {
    padding: .35rem .45rem;
  }

  .raffle-wedding-page .raffle-wedding-schedule dt,
  .raffle-wedding-page .raffle-wedding-schedule dd {
    font-size: .8rem;
    line-height: 1.18;
  }

  .raffle-wedding-page .raffle-main {
    padding-block: .35rem .4rem;
  }

  .raffle-wedding-page .raffle-form,
  .raffle-wedding-page .raffle-baskets {
    padding: .45rem .75rem;
  }

  .raffle-wedding-page .raffle-form {
    gap: .24rem .58rem;
  }

  .raffle-wedding-page .purchase-direct {
    gap: .1rem;
    padding: .32rem .48rem;
  }

  .raffle-wedding-page .purchase-direct h2 {
    font-size: clamp(1.35rem, 2.3vw, 1.7rem);
  }

  .raffle-wedding-page .purchase-direct__email {
    font-size: .98rem;
  }

  .raffle-wedding-page .purchase-direct__message {
    font-size: .8rem;
  }

  .raffle-wedding-page .purchase-direct__price {
    min-height: 2.62rem;
    padding: .18rem .32rem .22rem;
  }

  .raffle-wedding-page .purchase-direct__price strong {
    font-size: clamp(1.38rem, 2.6vw, 1.9rem);
  }

  .raffle-wedding-page .purchase-direct__price span {
    font-size: .6rem;
  }

  .raffle-wedding-page .request-form-note {
    font-size: .84rem;
  }

  .raffle-wedding-page .raffle-field {
    min-height: 1.9rem;
    padding-block: .24rem;
  }

  .raffle-wedding-page .ticket-stepper {
    grid-template-columns: 2.25rem minmax(0, 1fr) 2.25rem;
    gap: .28rem;
  }

  .raffle-wedding-page .ticket-stepper__button {
    min-height: 2.25rem;
    font-size: 1.18rem;
  }

  .raffle-wedding-page .raffle-form__price strong {
    font-size: 1.12rem;
  }

  .raffle-wedding-page .raffle-submit {
    min-height: 2.12rem;
  }
}

/* Seller intake */
.seller-entry-page {
  min-height: 100svh;
  color: var(--ink);
}

.seller-entry {
  display: grid;
  min-height: 100svh;
  place-items: center;
  padding: clamp(.75rem, 2vw, 1.5rem);
}

.seller-entry__card {
  width: min(100%, 36rem);
  padding: clamp(.85rem, 2.5vw, 1.25rem);
  background: rgba(255, 248, 231, .94);
  border: 1px solid rgba(168, 55, 48, .28);
  border-radius: 8px;
  box-shadow: 0 18px 42px rgba(49, 82, 115, .22);
  display: grid;
  gap: .65rem .75rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.seller-entry__card h1,
.seller-entry__card .seller-guide,
.seller-entry__card .raffle-messages,
.seller-entry__card .errorlist,
.seller-entry__wide,
.seller-entry__card .raffle-form__price,
.seller-entry__card .raffle-form__total,
.seller-entry__card .raffle-submit {
  grid-column: 1 / -1;
}

.seller-entry__card h1 {
  margin: 0;
  color: var(--red-deep);
  font-family: var(--f-script);
  font-size: clamp(1.85rem, 6vw, 2.8rem);
  font-weight: 400;
}

.seller-guide {
  display: grid;
  gap: .45rem;
  padding: .55rem .65rem;
  background: rgba(255, 255, 255, .46);
  border: 1px solid rgba(168, 55, 48, .18);
  border-radius: 8px;
  font-family: var(--f-ui);
  font-size: .82rem;
  line-height: 1.22;
}

.seller-guide p {
  margin: 0;
}

.seller-guide ol {
  display: grid;
  gap: .45rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
}

.seller-guide li {
  min-height: 1.7rem;
  padding: .32rem .42rem;
  background: rgba(245, 233, 205, .72);
  border: 1px solid rgba(15, 19, 32, .12);
  border-radius: 7px;
  color: var(--ink);
  font-weight: 700;
}

.seller-entry__card label {
  display: grid;
  gap: .22rem;
  color: var(--midnight);
  font-family: var(--f-ui);
  font-size: .92rem;
  font-weight: 700;
}

.seller-entry__card .raffle-field {
  min-height: 2.25rem;
  padding: .42rem .55rem;
}

.seller-entry__card .ticket-stepper {
  grid-template-columns: 2.35rem minmax(0, 1fr) 2.35rem;
  gap: .28rem;
}

.seller-entry__card .ticket-stepper__button {
  min-height: 2.25rem;
}

.seller-entry__hint {
  color: rgba(35, 67, 97, .82);
  font-family: var(--f-ui);
  font-size: .76rem;
  font-weight: 600;
  line-height: 1.15;
}

.seller-entry__card textarea.raffle-field {
  min-height: 4.2rem;
  resize: vertical;
}

.seller-entry__card .raffle-form__price,
.seller-entry__card .raffle-form__total {
  margin: 0;
}

.seller-entry__card .raffle-submit {
  min-height: 2.55rem;
}

@media (max-width: 42rem) {
  .seller-entry {
    min-height: auto;
    place-items: start center;
    padding: .45rem;
  }

  .seller-entry__card {
    gap: .38rem .45rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: .65rem;
  }

  .seller-entry__card h1 {
    font-size: 1.85rem;
  }

  .seller-guide {
    gap: .25rem;
    padding: .38rem .45rem;
    font-size: .64rem;
    line-height: 1.14;
  }

  .seller-guide ol {
    gap: .25rem;
  }

  .seller-guide li {
    min-height: 1.35rem;
    padding: .22rem .24rem;
  }

  .seller-entry__card label {
    gap: .14rem;
    font-size: .76rem;
  }

  .seller-entry__card .raffle-field {
    min-height: 1.9rem;
    padding: .28rem .38rem;
    font-size: .82rem;
  }

  .seller-entry__card .ticket-stepper {
    grid-template-columns: 2rem minmax(0, 1fr) 2rem;
    gap: .2rem;
  }

  .seller-entry__card .ticket-stepper__button {
    min-height: 1.9rem;
    border-radius: 6px;
    font-size: 1rem;
  }

  .seller-entry__hint {
    font-size: .65rem;
  }

  .seller-entry__card textarea.raffle-field {
    min-height: 2.7rem;
  }

  .seller-entry__card .raffle-form__price,
  .seller-entry__card .raffle-form__total {
    font-size: .86rem;
    line-height: 1.1;
  }

  .seller-entry__card .raffle-submit {
    min-height: 2.2rem;
  }
}

/* Raffle control */
.control-page {
  display: grid;
  min-height: 100vh;
  place-items: start center;
  padding: clamp(1rem, 4vw, 3rem);
}

.control-panel {
  width: min(100%, 38rem);
  padding: clamp(1rem, 3vw, 1.5rem);
  color: var(--midnight);
  background: rgba(237, 227, 208, .96);
  border: 1px solid rgba(226, 195, 105, .46);
  border-radius: 8px;
}

.control-panel h1,
.control-panel h2 {
  color: var(--red-deep);
  font-family: var(--f-script);
  font-weight: 400;
}

.control-field {
  display: grid;
  gap: .35rem;
  font-family: var(--f-ui);
  font-weight: 700;
}

.control-baskets {
  margin-block: 1.5rem;
}

.control-basket {
  display: grid;
  gap: .6rem;
  padding-block: .85rem;
  border-top: 1px solid rgba(15, 19, 32, .12);
}

.control-check {
  display: flex;
  gap: .55rem;
  align-items: center;
  font-family: var(--f-ui);
  font-weight: 700;
}

.control-check input {
  width: 1.2rem;
  height: 1.2rem;
}

.control-link {
  display: block;
  margin-top: 1rem;
  font-family: var(--f-ui);
  text-align: center;
}

/* ============================================================
   Raffle redesign — v8 consolidated one-screen layout
   Scoped to .raffle-wedding-page; appended last so it wins ties.
   Replaces the layered v5/v6/v7 overrides with a single coherent
   block. Honors the hard rule: one screen, no scroll, at every
   size (graceful scroll only on sub-700px-tall phones, never clip).

   Hierarchy: JACKPOT AMOUNT > heart logo > ticket price > CTAs.
   De-cluttered card chrome (one border, one shadow). Pacifico for
   names/tagline, Alfa Slab for the jackpot number, Nunito for UI.
   ============================================================ */

/* ---------- Page shell: one-screen column ---------- */
.raffle-wedding-page {
  --raffle-card-bg: linear-gradient(160deg, #fffdf7, #fbf3e2);
  --raffle-card-border: 1px solid #e2cfac;
  --raffle-card-shadow: 0 10px 24px -14px rgba(44, 62, 92, .45);
  --raffle-red: #c63d3b;
  --raffle-red-deep: #9a2a28;
  --raffle-ink: #2a3b54;
  --raffle-ink-soft: #566b85;

  min-height: 100svh;
  display: flex;
  flex-direction: column;
  gap: clamp(.35rem, 1.1svh, .8rem);
  padding: clamp(.5rem, 1.6svh, 1.1rem) clamp(.7rem, 2vw, 1.9rem);
  overflow-x: hidden;
  background:
    radial-gradient(circle at 20% 0%, rgba(255, 255, 255, .65), transparent 30%),
    radial-gradient(circle at 80% 8%, rgba(255, 255, 255, .45), transparent 32%),
    linear-gradient(180deg, #dcefff 0%, #b8dbf2 58%, #c8e6f8 100%);
  color: var(--raffle-ink);
  font-family: "Nunito", system-ui, sans-serif;
}

/* ---------- Hero: compact heart lockup ---------- */
.raffle-wedding-page .raffle-wedding-hero {
  flex: 0 0 auto;
  display: block;
  min-height: 0;
  padding: 0;
  background: none;
  overflow: visible;
}
.raffle-wedding-page .raffle-wedding-hero::before,
.raffle-wedding-page .raffle-wedding-hero::after { content: none; }
.raffle-wedding-page .raffle-wedding-hero .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(.1rem, .5svh, .4rem);
}
.raffle-wedding-page .raffle-wedding-mark {
  container-type: inline-size;
  width: clamp(7.5rem, 16svh, 11rem);
  margin: 0 auto;
}
.raffle-wedding-page .raffle-wedding-mark .hero-mark__art { transform: none; }
.raffle-wedding-page .raffle-wedding-mark .hero__names { font-size: 14cqw; }
.raffle-wedding-page .raffle-wedding-mark .hero__names span + span { margin-top: .02em; }
.raffle-wedding-page .raffle-wedding-mark .date-ribbon {
  left: 12%;
  right: 12%;
  min-height: 0;
  margin-top: .4em;
  padding: .32em .45em;
  font-size: clamp(.58rem, 7.2cqw, .95rem);
  letter-spacing: 0;
  white-space: nowrap;
}
.raffle-wedding-page .raffle-wedding-mark .date-ribbon span {
  display: block;
  max-width: 100%;
}
.raffle-wedding-page .raffle-wedding-mark .date-ribbon::before,
.raffle-wedding-page .raffle-wedding-mark .date-ribbon::after { display: none; }
.raffle-wedding-page .hero-note {
  margin: 0;
  max-width: 52rem;
  color: var(--raffle-red);
  font-family: var(--f-script);
  font-size: clamp(.9rem, 2.1svh, 1.4rem);
  line-height: 1.1;
  text-align: center;
}

/* ---------- Section shells ---------- */
.raffle-wedding-page .raffle-info,
.raffle-wedding-page .raffle-main {
  min-height: 0;
  padding: 0;
  background: none;
}
.raffle-wedding-page .raffle-info { flex: 0 0 auto; display: flex; }
.raffle-wedding-page .raffle-main { flex: 1 1 auto; display: flex; flex-direction: column; }
.raffle-wedding-page .raffle-info > .container {
  width: 100%;
  max-width: none;
  height: 100%;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: clamp(.3rem, 1svh, .6rem);
}
.raffle-wedding-page .raffle-main > .container.content-grid {
  width: 100%;
  max-width: none;
  height: 100%;
  margin: 0;
  flex: 1 1 auto;
  min-height: 0;
}

/* ---------- Info strip: 4-up on desktop, 2x2 on portrait/phone ---------- */
.raffle-wedding-page .info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(.35rem, 1svh, .75rem);
  flex: 1 1 auto;
  min-height: 0;
  align-items: stretch;
}
.raffle-wedding-page .info-card {
  display: flex;
  align-items: center;
  gap: clamp(.4rem, 1vw, .85rem);
  margin: 0;
  min-height: 0;
  padding: clamp(.5rem, 1.4svh, 1.1rem) clamp(.55rem, 1.1vw, 1.1rem);
  font-family: "Nunito", system-ui, sans-serif;
  background: var(--raffle-card-bg);
  border: var(--raffle-card-border);
  border-radius: clamp(10px, 1.3svh, 14px);
  box-shadow: var(--raffle-card-shadow);
}
.raffle-wedding-page .info-card__icon {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: clamp(1.85rem, 4.2svh, 2.9rem);
  height: clamp(1.85rem, 4.2svh, 2.9rem);
  border-radius: 50%;
  background: #fff8ec;
  border: 1px solid #e2cfac;
  color: var(--raffle-red);
}
.raffle-wedding-page .info-card__icon svg {
  width: 52%;
  height: 52%;
  fill: currentColor;
}
.raffle-wedding-page .info-card__body { min-width: 0; }
.raffle-wedding-page .info-card h3 {
  margin: 0 0 .12em;
  color: var(--raffle-red);
  font-size: clamp(.74rem, 1.5svh, 1.02rem);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: .01em;
}
.raffle-wedding-page .info-card p {
  margin: 0;
  color: var(--raffle-ink);
  font-size: clamp(.68rem, 1.3svh, .92rem);
  font-weight: 700;
  line-height: 1.2;
}
.raffle-wedding-page .info-card__price strong {
  color: var(--raffle-red);
  font-size: 1.25em;
  font-weight: 900;
}

/* Ticket-stripe divider — portrait only, gone on landscape + phone */
.raffle-wedding-page .raffle-divider {
  flex: 0 0 auto;
  height: clamp(.45rem, 1.1svh, .85rem);
  margin: 0;
  border-radius: 4px;
  background: repeating-linear-gradient(90deg, var(--sky-dark) 0 1.05rem, #eaf4fc 1.05rem 2.1rem);
  box-shadow: inset 0 0 0 1px rgba(18, 59, 99, .1);
}

/* ---------- Featured jackpot card (the dominant element) ---------- */
.raffle-wedding-page .jackpot-feature {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  grid-column: 1 / -1;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: clamp(.2rem, .7svh, .55rem);
  padding: clamp(.7rem, 2svh, 1.5rem) clamp(.8rem, 1.6vw, 1.4rem);
  color: var(--raffle-ink);
  background: radial-gradient(120% 130% at 50% -15%, #fffdf6 0%, #fff1d4 48%, #f5dfa6 100%);
  border: 1.5px solid rgba(168, 55, 48, .4);
  box-shadow:
    0 16px 32px -20px rgba(44, 62, 92, .6),
    inset 0 0 0 2px rgba(255, 255, 255, .55);
  animation: jackpotFeatureGlow 3.4s ease-in-out infinite;
}
.raffle-wedding-page .jackpot-feature::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: -70% -45%;
  pointer-events: none;
  background: linear-gradient(112deg, transparent 36%, rgba(255, 255, 255, .82) 47%, rgba(255, 248, 232, .32) 52%, transparent 64%);
  transform: translateX(-58%) rotate(7deg);
  animation: jackpotShine 4.8s ease-in-out infinite;
}
.raffle-wedding-page .jackpot-feature > * { position: relative; z-index: 1; }
.raffle-wedding-page .jackpot-feature__headline {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(.3rem, .8vw, .55rem);
}
.raffle-wedding-page .jackpot-feature__icon {
  display: grid;
  place-items: center;
  width: clamp(1.5rem, 3.4svh, 2.2rem);
  height: clamp(1.5rem, 3.4svh, 2.2rem);
  border-radius: 50%;
  color: var(--raffle-red);
  background: #fff8ec;
  border: 1px solid rgba(168, 55, 48, .3);
}
.raffle-wedding-page .jackpot-feature__icon svg { width: 56%; height: 56%; fill: currentColor; }
.raffle-wedding-page .jackpot-feature h3 {
  margin: 0;
  color: var(--raffle-red);
  font-size: clamp(.72rem, 1.6svh, 1.05rem);
  font-weight: 900;
  letter-spacing: .05em;
  text-transform: uppercase;
  line-height: 1;
}
/* THE largest text on the page — the headline number */
.raffle-wedding-page .jackpot-feature .jackpot-feature__amount {
  margin: 0;
  color: var(--raffle-red-deep);
  font-family: var(--f-marquee);
  font-size: clamp(2.6rem, 8.5svh, 5.6rem);
  font-weight: 400;
  line-height: .88;
  letter-spacing: -.02em;
  text-shadow:
    0 2px 0 rgba(255, 255, 255, .8),
    0 0 18px rgba(168, 55, 48, .2);
  animation: jackpotAmountGlow 2.9s ease-in-out infinite;
}
.raffle-wedding-page .jackpot-feature .jackpot-feature__sub {
  margin: 0;
  color: var(--raffle-ink-soft);
  font-size: clamp(.55rem, 1.05svh, .74rem);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.raffle-wedding-page .jackpot-feature__ticket-price { display: none; }
.raffle-wedding-page .jackpot-feature__spark {
  position: absolute;
  z-index: 0;
  width: .42rem;
  height: .42rem;
  border-radius: 999px;
  background: #fff6df;
  box-shadow:
    0 0 0 .16rem rgba(255, 226, 160, .22),
    0 0 14px rgba(255, 214, 130, .9);
  animation: jackpotSpark 2.6s ease-in-out infinite;
}
.raffle-wedding-page .jackpot-feature__spark--one { top: 12%; left: 9%; }
.raffle-wedding-page .jackpot-feature__spark--two { top: 22%; right: 11%; animation-delay: .8s; }
.raffle-wedding-page .jackpot-feature__spark--three { bottom: 30%; right: 16%; width: .3rem; height: .3rem; animation-delay: 1.5s; }

@keyframes jackpotFeatureGlow {
  0%, 100% {
    box-shadow:
      0 16px 32px -20px rgba(44, 62, 92, .6),
      0 0 0 rgba(255, 214, 130, 0),
      inset 0 0 0 2px rgba(255, 255, 255, .55);
  }
  50% {
    box-shadow:
      0 20px 40px -20px rgba(44, 62, 92, .72),
      0 0 30px rgba(255, 214, 130, .5),
      inset 0 0 0 2px rgba(255, 255, 255, .65);
  }
}

/* ---------- Content grid: purchase + form ---------- */
.raffle-wedding-page .content-grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(.5rem, 1.2vw, 1.1rem);
  align-items: stretch;
}
.raffle-wedding-page .panel {
  position: relative;
  margin: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: clamp(.65rem, 1.8svh, 1.4rem) clamp(.85rem, 1.8vw, 1.7rem);
  font-family: "Nunito", system-ui, sans-serif;
  color: var(--raffle-ink);
  background: var(--raffle-card-bg);
  border: var(--raffle-card-border);
  border-radius: clamp(12px, 1.9svh, 20px);
  box-shadow: var(--raffle-card-shadow);
  overflow: hidden;
}
.raffle-wedding-page .panel__title {
  margin: 0 0 clamp(.25rem, .9svh, .75rem);
  color: var(--raffle-red);
  font-family: var(--f-script);
  font-weight: 400;
  font-size: clamp(1.5rem, 4.2svh, 2.6rem);
  line-height: 1;
  text-align: center;
}

/* Purchase panel — compact strip is hidden on desktop, full block shown */
.raffle-wedding-page .purchase-panel__compact { display: none; }
.raffle-wedding-page .purchase-panel__full {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(.3rem, 1svh, .65rem);
  text-align: center;
  flex: 1 1 auto;
}
.raffle-wedding-page .purchase-panel__ribbon {
  margin: 0;
  padding: clamp(.2rem, .6svh, .42rem) clamp(1rem, 2vw, 2rem);
  background: linear-gradient(180deg, var(--raffle-red), var(--raffle-red-deep));
  color: #fff;
  font-size: clamp(.6rem, 1.2svh, .78rem);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .06em;
  border-radius: 3px;
}
.raffle-wedding-page .price-badge {
  flex: 0 0 auto;
  width: min(13rem, 100%);
  margin: 0 auto;
  overflow: hidden;
  border: 2px solid var(--raffle-red-deep);
  border-radius: 12px;
  background: linear-gradient(180deg, var(--raffle-red), var(--raffle-red-deep));
}
.raffle-wedding-page .price-badge strong {
  display: block;
  padding: clamp(.2rem, .55svh, .45rem) .6rem clamp(.05rem, .2svh, .18rem);
  color: #fff;
  font-size: clamp(1.7rem, 4.4svh, 2.8rem);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -.02em;
}
.raffle-wedding-page .price-badge span {
  display: block;
  padding: clamp(.14rem, .4svh, .32rem);
  background: #17476f;
  color: #fff;
  font-size: clamp(.68rem, 1.3svh, 1rem);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.raffle-wedding-page .heart-divider {
  display: flex;
  align-items: center;
  gap: .6rem;
  width: 100%;
  margin: clamp(.1rem, .4svh, .35rem) 0;
  color: var(--raffle-red);
}
.raffle-wedding-page .heart-divider span {
  flex: 1;
  height: 0;
  border-top: 2px dashed #d7be98;
}
.raffle-wedding-page .heart-divider b { font-size: 1rem; line-height: 1; }
.raffle-wedding-page .etransfer {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(.5rem, 1.2vw, .9rem);
  width: 100%;
  text-align: left;
  align-items: center;
}
.raffle-wedding-page .etransfer__icon {
  display: grid;
  place-items: center;
  width: clamp(2rem, 4.5svh, 2.8rem);
  height: clamp(2rem, 4.5svh, 2.8rem);
  border-radius: 50%;
  background: #fff8ec;
  border: 1px solid #e2cfac;
  color: var(--raffle-ink);
}
.raffle-wedding-page .etransfer__icon svg { width: 1.3rem; height: 1.3rem; }
.raffle-wedding-page .etransfer__label {
  margin: 0;
  font-size: clamp(.8rem, 1.5svh, 1.02rem);
  font-weight: 900;
}
.raffle-wedding-page .etransfer__email {
  margin: .04em 0 .2em;
  color: var(--raffle-red);
  font-size: clamp(.95rem, 1.9svh, 1.5rem);
  font-weight: 900;
  line-height: 1.05;
  overflow-wrap: anywhere;
}
.raffle-wedding-page .etransfer__note {
  margin: 0;
  font-size: clamp(.7rem, 1.4svh, .92rem);
  font-weight: 700;
  line-height: 1.3;
}

/* ---------- Runner-up basket photo slot ---------- */
.raffle-wedding-page .basket-photo-panel {
  justify-content: center;
  gap: clamp(.35rem, 1svh, .75rem);
}
.raffle-wedding-page .basket-photo-frame {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  height: clamp(12rem, 31svh, 22rem);
  min-height: 0;
  overflow: hidden;
  border: 2px dashed rgba(168, 55, 48, .34);
  border-radius: clamp(10px, 1.4svh, 16px);
  background:
    radial-gradient(circle at 22% 18%, rgba(255, 255, 255, .75), transparent 28%),
    linear-gradient(135deg, #fff8e8 0%, #f3dfb7 52%, #dfeef8 100%);
}
.raffle-wedding-page .basket-photo-placeholder {
  position: relative;
  display: flex;
  align-items: end;
  justify-content: center;
  gap: clamp(.6rem, 2vw, 1.6rem);
  width: min(92%, 38rem);
  height: 78%;
  padding-bottom: clamp(.5rem, 1.5svh, .9rem);
}
.raffle-wedding-page .basket-photo-placeholder::before {
  content: "";
  position: absolute;
  left: 2%;
  right: 2%;
  bottom: 0;
  height: 18%;
  border-radius: 50%;
  background: rgba(42, 59, 84, .12);
  filter: blur(2px);
}
.raffle-wedding-page .basket-photo-placeholder__basket {
  position: relative;
  width: clamp(4.8rem, 10vw, 8.8rem);
  height: clamp(4.4rem, 9vw, 7.8rem);
  border-radius: 18% 18% 12% 12%;
  background:
    repeating-linear-gradient(90deg, rgba(255, 255, 255, .16) 0 .38rem, transparent .38rem .76rem),
    linear-gradient(180deg, #c96d3e, #93502f);
  border: 2px solid rgba(96, 54, 33, .42);
  box-shadow: 0 14px 22px -18px rgba(42, 59, 84, .7);
}
.raffle-wedding-page .basket-photo-placeholder__basket::before {
  content: "";
  position: absolute;
  left: 18%;
  right: 18%;
  top: -34%;
  height: 62%;
  border: clamp(.35rem, .9vw, .65rem) solid #845238;
  border-bottom: 0;
  border-radius: 999px 999px 0 0;
}
.raffle-wedding-page .basket-photo-placeholder__basket span {
  position: absolute;
  bottom: 68%;
  width: 30%;
  aspect-ratio: 1;
  border-radius: 50% 50% 45% 45%;
  background: #b93630;
  border: 1px solid rgba(93, 22, 19, .28);
}
.raffle-wedding-page .basket-photo-placeholder__basket span:nth-child(1) { left: 8%; background: #17476f; }
.raffle-wedding-page .basket-photo-placeholder__basket span:nth-child(2) { left: 35%; background: #f6d58a; }
.raffle-wedding-page .basket-photo-placeholder__basket span:nth-child(3) { right: 8%; }
.raffle-wedding-page .basket-photo-placeholder__basket--two {
  z-index: 1;
  width: clamp(5.6rem, 11vw, 9.6rem);
  height: clamp(5rem, 9.8vw, 8.4rem);
}
.raffle-wedding-page .basket-photo-panel__caption {
  margin: 0;
  color: var(--raffle-ink);
  font-size: clamp(.78rem, 1.45svh, 1rem);
  font-weight: 900;
  line-height: 1.15;
  text-align: center;
}

/* ---------- Request form ---------- */
.raffle-wedding-page .form-panel { display: flex; flex-direction: column; }
.raffle-wedding-page .form-panel__intro {
  margin: 0 0 clamp(.3rem, 1svh, .75rem);
  text-align: center;
  font-size: clamp(.72rem, 1.4svh, .95rem);
  font-weight: 800;
  line-height: 1.15;
}
.raffle-wedding-page .form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(.35rem, 1svh, .85rem) clamp(.5rem, 1.2vw, 1.1rem);
}
.raffle-wedding-page .form-panel label {
  display: block;
  margin: 0;
  color: #061d33;
  font-size: clamp(.66rem, 1.2svh, .88rem);
  font-weight: 900;
}
.raffle-wedding-page .form-panel label > span {
  display: block;
  margin-bottom: clamp(.1rem, .4svh, .35rem);
}
.raffle-wedding-page .form-panel .raffle-field {
  width: 100%;
  height: clamp(2.1rem, 4.8svh, 2.9rem);
  margin: 0;
  padding: 0 clamp(.5rem, 1vw, .95rem);
  border: 1px solid #cabd9f;
  border-radius: 10px;
  background: rgba(255, 255, 255, .82);
  color: var(--raffle-ink);
  font: inherit;
  font-size: clamp(.85rem, 1.5svh, 1.02rem);
  font-weight: 700;
}
.raffle-wedding-page .form-panel .raffle-field:focus {
  outline: none;
  border-color: var(--raffle-red);
  box-shadow: 0 0 0 3px rgba(181, 53, 50, .12);
}
.raffle-wedding-page .form-panel .ticket-quantity-label { grid-column: 1 / -1; }
.raffle-wedding-page .form-panel .ticket-stepper {
  display: grid;
  grid-template-columns: clamp(2.6rem, 7vw, 3.3rem) 1fr clamp(2.6rem, 7vw, 3.3rem);
  gap: clamp(.3rem, .8vw, .55rem);
}
.raffle-wedding-page .form-panel .ticket-stepper .raffle-field { text-align: center; }
.raffle-wedding-page .form-panel .ticket-stepper__button {
  width: 100%;
  min-height: 44px;
  height: clamp(2.1rem, 4.8svh, 2.9rem);
  border: 0;
  border-radius: 9px;
  background: linear-gradient(180deg, var(--raffle-red), var(--raffle-red-deep));
  color: #fff;
  font-size: clamp(1.1rem, 2.4svh, 1.55rem);
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 4px 0 rgba(98, 25, 22, .32);
}
.raffle-wedding-page .form-panel .ticket-stepper__button:active {
  transform: translateY(2px);
  box-shadow: 0 2px 0 rgba(98, 25, 22, .32);
}
.raffle-wedding-page .price-summary {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(.5rem, 1.2vw, .9rem);
  align-items: center;
  margin: clamp(.4rem, 1.2svh, .9rem) 0 clamp(.4rem, 1svh, .85rem);
  padding-top: clamp(.4rem, 1svh, .85rem);
  border-top: 2px dashed #d7be98;
}
.raffle-wedding-page .price-summary__icon {
  display: grid;
  place-items: center;
  width: clamp(2rem, 4.5svh, 2.8rem);
  height: clamp(2rem, 4.5svh, 2.8rem);
  border-radius: 50%;
  background: #fff8ec;
  border: 1px solid #e2cfac;
  color: var(--raffle-red);
}
.raffle-wedding-page .price-summary__icon svg { width: 1.3rem; height: 1.3rem; }
.raffle-wedding-page .price-summary .raffle-form__price,
.raffle-wedding-page .price-summary .raffle-form__total {
  margin: 0;
  color: var(--raffle-ink);
  font-size: clamp(.8rem, 1.5svh, 1.05rem);
  font-weight: 800;
  line-height: 1.25;
}
.raffle-wedding-page .price-summary strong { color: var(--raffle-red); font-weight: 900; }
.raffle-wedding-page .form-panel .raffle-submit {
  width: 100%;
  min-height: 44px;
  margin: auto 0 0;
  border: 0;
  border-radius: 10px;
  background: linear-gradient(180deg, var(--raffle-red), var(--raffle-red-deep));
  color: #fff;
  font-family: "Nunito", system-ui, sans-serif;
  font-size: clamp(.85rem, 1.7svh, 1.08rem);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .03em;
  cursor: pointer;
  box-shadow: 0 5px 0 rgba(93, 22, 19, .32);
}
.raffle-wedding-page .form-panel .raffle-submit::before { content: "\2665  "; }
.raffle-wedding-page .form-panel .raffle-submit:hover { filter: brightness(1.03); }
.raffle-wedding-page .form-panel .raffle-submit:active {
  transform: translateY(2px);
  box-shadow: 0 3px 0 rgba(93, 22, 19, .32);
}

/* Honeypot, messages, errors */
.raffle-wedding-page .raffle-hp {
  position: absolute !important;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
.raffle-wedding-page .raffle-messages {
  margin: 0 0 .6rem;
  padding: .5rem .8rem;
  border-radius: 10px;
  background: rgba(168, 184, 155, .25);
  border: 1px solid rgba(30, 74, 58, .25);
  font-weight: 800;
  text-align: center;
  font-size: clamp(.7rem, 1.4svh, .92rem);
}
.raffle-wedding-page .form-panel .errorlist {
  margin: .2rem 0 0;
  padding-left: 1.1rem;
  color: var(--raffle-red-deep);
  font-size: clamp(.6rem, 1.2svh, .82rem);
  font-weight: 800;
  list-style: none;
}

/* ---------- Footer lane ---------- */
.raffle-wedding-page .raffle-footer {
  flex: 0 0 auto;
  width: 100%;
  margin: 0;
  padding: clamp(.15rem, .5svh, .32rem) 0;
  text-align: center;
  color: #2d6fa8;
  font-family: "Nunito", system-ui, sans-serif;
  font-size: clamp(.6rem, 1.2svh, .88rem);
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
  position: relative;
  z-index: 20;
}

/* ============================================================
   BREAKPOINT 1 — Desktop landscape (>=60rem, wide aspect):
   Hero row on top, single 4-up info strip, purchase+form below,
   footer lane. One screen, no scroll.
   ============================================================ */
@media (min-width: 60rem) and (min-aspect-ratio: 11/10) {
  .raffle-wedding-page {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    grid-template-areas:
      "hero"
      "info"
      "main"
      "footer";
    gap: clamp(.5rem, 1.4svh, 1rem);
    align-items: stretch;
  }
  .raffle-wedding-page .raffle-wedding-hero {
    grid-area: hero;
    flex-direction: row;
  }
  .raffle-wedding-page .raffle-wedding-hero .container {
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: clamp(1rem, 3vw, 2.4rem);
  }
  .raffle-wedding-page .raffle-wedding-mark { width: clamp(9.5rem, 22svh, 16rem); }
  .raffle-wedding-page .hero-note {
    text-align: left;
    max-width: 32rem;
    font-size: clamp(1.1rem, 2.9svh, 1.8rem);
  }
  /* Info: single 4-up horizontal strip */
  .raffle-wedding-page .raffle-info { grid-area: info; min-height: 0; overflow: hidden; }
  .raffle-wedding-page .info-grid {
    grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr));
    gap: clamp(.45rem, 1vw, .85rem);
  }
  /* jackpot-feature spans its own column, not the whole row, on landscape */
  .raffle-wedding-page .jackpot-feature { grid-column: auto; }
  .raffle-wedding-page .raffle-divider { display: none; }
  .raffle-wedding-page .raffle-main { grid-area: main; min-height: 0; overflow: hidden; }
  .raffle-wedding-page .raffle-footer { grid-area: footer; flex: 0 0 auto; z-index: 1; }
  .raffle-wedding-page .raffle-main > .container.content-grid {
    display: grid;
    grid-template-columns: minmax(18rem, .72fr) minmax(28rem, 1.28fr);
    height: 100%;
    min-height: 0;
  }
  /* Keep panels breathing within the one-screen row */
  .raffle-wedding-page .panel {
    padding: clamp(.5rem, 1.4svh, 1.05rem) clamp(.75rem, 1.6vw, 1.4rem);
  }
  .raffle-wedding-page .panel__title {
    font-size: clamp(1.4rem, 3.6svh, 2.3rem);
    margin-bottom: clamp(.15rem, .55svh, .42rem);
  }
  .raffle-wedding-page .form-grid { gap: clamp(.25rem, .65svh, .5rem) clamp(.5rem, 1.1vw, .9rem); }
  .raffle-wedding-page .form-panel__intro { display: none; }
  .raffle-wedding-page .form-panel .raffle-field,
  .raffle-wedding-page .form-panel .ticket-stepper__button {
    height: clamp(1.9rem, 4.2svh, 2.4rem);
  }
  .raffle-wedding-page .form-panel .ticket-stepper {
    max-width: 24rem;
    grid-template-columns: clamp(2.6rem, 4.2svh, 3rem) minmax(8rem, 1fr) clamp(2.6rem, 4.2svh, 3rem);
  }
  .raffle-wedding-page .price-summary {
    margin: clamp(.2rem, .65svh, .5rem) 0;
    padding-top: clamp(.2rem, .65svh, .5rem);
  }
  .raffle-wedding-page .form-panel .raffle-submit {
    margin-top: clamp(.12rem, .45svh, .32rem);
    min-height: clamp(2rem, 4.2svh, 2.6rem);
  }
}

/* Short landscape (laptops ~768-860px tall): tighten so it still fits */
@media (min-width: 60rem) and (min-aspect-ratio: 11/10) and (max-height: 860px) {
  .raffle-wedding-page { gap: clamp(.35rem, 1svh, .65rem); }
  .raffle-wedding-page .raffle-wedding-mark { width: clamp(8rem, 18svh, 12.5rem); }
  .raffle-wedding-page .panel {
    padding: clamp(.45rem, 1.3svh, .95rem) clamp(.7rem, 1.5vw, 1.25rem);
  }
  .raffle-wedding-page .jackpot-feature .jackpot-feature__amount {
    font-size: clamp(2.2rem, 6.5svh, 4rem);
  }
}

/* ============================================================
   BREAKPOINT 2 — Phones (<=30rem):
   Hide the full purchase block; show the compact price+email strip
   so the form panel can widen and its controls clear 44px + readable
   text floors. Still one screen.
   ============================================================ */
@media (max-width: 30rem) {
  .raffle-wedding-page {
    gap: clamp(.12rem, .5svh, .3rem);
    padding: clamp(.2rem, .75svh, .45rem) clamp(.48rem, 2.8vw, .82rem);
  }
  .raffle-wedding-page .raffle-footer { display: none; }
  .raffle-wedding-page .content-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-content: start;
    gap: clamp(.24rem, .62svh, .4rem);
    align-items: stretch;
  }
  .raffle-wedding-page .raffle-wedding-hero .container { gap: 0; }
  .raffle-wedding-page .hero-note { display: none; }
  .raffle-wedding-page .raffle-wedding-mark { width: clamp(11rem, 23svh, 13.25rem); }
  .raffle-wedding-page .raffle-divider { display: none; }
  .raffle-wedding-page .raffle-info { flex: 0 0 auto; }

  /* Info: jackpot full-width on top, two readable schedule cards below. */
  .raffle-wedding-page .info-grid { gap: clamp(.2rem, .55svh, .38rem); grid-template-columns: 1fr 1fr; }
  .raffle-wedding-page .jackpot-feature { grid-column: 1 / -1; }
  .raffle-wedding-page .jackpot-feature__headline { gap: .25rem; }
  .raffle-wedding-page .jackpot-feature__headline h3 { font-size: clamp(.52rem, .95svh, .64rem); }
  .raffle-wedding-page .jackpot-feature__icon { width: 1.15rem; height: 1.15rem; }
  .raffle-wedding-page .jackpot-feature .jackpot-feature__amount {
    font-size: clamp(1.6rem, 5svh, 2.3rem);
  }
  .raffle-wedding-page .jackpot-feature__ticket-price {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    gap: .16rem;
    margin: -.05rem 0 0;
    padding: .08rem .42rem;
    color: var(--raffle-red-deep);
    background: rgba(255, 255, 255, .68);
    border: 1px solid rgba(168, 55, 48, .24);
    border-radius: 999px;
    font-size: clamp(.5rem, .86svh, .62rem);
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
  }
  .raffle-wedding-page .jackpot-feature__ticket-price strong {
    font-size: 1.28em;
    color: var(--raffle-red);
  }
  .raffle-wedding-page .jackpot-feature .jackpot-feature__sub { font-size: clamp(.44rem, .78svh, .55rem); }
  .raffle-wedding-page .jackpot-feature__spark { display: none; }

  /* Only the jackpot and schedule cards exist now. The rules that used to sit
     here sized a 4-up strip of cards (.info-card--price, and
     .info-card:not(.jackpot-feature) h3/p at ~9px) that v17-v18 deleted; the
     :not() variants also outranked the current selectors on specificity. */
  .raffle-wedding-page .info-card { padding: clamp(.24rem, .62svh, .4rem) clamp(.32rem, 1.7vw, .5rem); gap: .18rem; }

  /* Purchase: compact strip (price + email inline) — readable, short */
  .raffle-wedding-page .purchase-panel {
    min-height: 0;
    padding: clamp(.26rem, .7svh, .42rem) clamp(.45rem, 2vw, .65rem);
  }
  .raffle-wedding-page .purchase-panel__full { display: none; }
  .raffle-wedding-page .purchase-panel__compact {
    display: grid;
    grid-template-columns: auto 0 minmax(0, 1fr);
    grid-template-areas:
      "price divider email"
      "note note note";
    align-items: center;
    justify-content: space-between;
    gap: clamp(.35rem, 2vw, .6rem);
    text-align: left;
    flex: 0 0 auto;
    min-height: clamp(3.45rem, 7.2svh, 4.1rem);
    padding: 0;
  }
  .raffle-wedding-page .purchase-panel__compact-price {
    grid-area: price;
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: .2rem;
    flex: 0 0 auto;
    padding: clamp(.18rem, .5svh, .3rem) clamp(.58rem, 3vw, .85rem);
    background: linear-gradient(180deg, var(--raffle-red), var(--raffle-red-deep));
    color: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 0 rgba(93, 22, 19, .35);
  }
  .raffle-wedding-page .purchase-panel__compact-price strong {
    font-size: clamp(1.2rem, 3.1svh, 1.6rem);
    font-weight: 900;
    line-height: 1;
  }
  .raffle-wedding-page .purchase-panel__compact-price span {
    font-size: clamp(.6rem, 1.1svh, .72rem);
    font-weight: 800;
    text-transform: uppercase;
  }
  .raffle-wedding-page .purchase-panel__compact-divider {
    grid-area: divider;
    align-self: stretch;
    width: 0;
    height: auto;
    border-top: 0;
    border-left: 2px dashed #d7be98;
  }
  .raffle-wedding-page .purchase-panel__compact-email {
    grid-area: email;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .28rem;
    min-width: 0;
    max-width: 100%;
    color: var(--raffle-red);
    font-weight: 900;
    font-size: clamp(.68rem, 1.12svh, .82rem);
    line-height: 1.1;
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  .raffle-wedding-page .purchase-panel__compact-email svg { display: none; }
  .raffle-wedding-page .purchase-panel__compact-note {
    grid-area: note;
    color: #15304f;
    font-size: clamp(.55rem, .98svh, .66rem);
    font-weight: 800;
    line-height: 1.15;
    text-align: center;
  }

  .raffle-wedding-page .basket-photo-panel {
    min-height: 0;
    padding: clamp(.34rem, .9svh, .55rem) clamp(.45rem, 2vw, .65rem);
    gap: clamp(.16rem, .45svh, .3rem);
  }
  .raffle-wedding-page .basket-photo-panel .panel__title {
    margin: 0;
    font-size: clamp(1.2rem, 3.4svh, 1.7rem);
  }
  .raffle-wedding-page .basket-photo-frame {
    height: clamp(6.7rem, 17.5svh, 8.6rem);
    border-radius: 10px;
  }
  .raffle-wedding-page .basket-photo-placeholder {
    gap: clamp(.26rem, 1.8vw, .5rem);
    width: 94%;
    height: 74%;
  }
  .raffle-wedding-page .basket-photo-placeholder__basket {
    width: clamp(3rem, 20vw, 4.2rem);
    height: clamp(2.8rem, 18vw, 3.8rem);
  }
  .raffle-wedding-page .basket-photo-panel__caption {
    font-size: clamp(.54rem, .92svh, .68rem);
  }

  /* Form: wider panel, readable labels, 44px+ touch targets */
  .raffle-wedding-page .form-panel {
    min-height: 0;
    overflow: hidden;
  }
  .raffle-wedding-page .form-panel .panel__title {
    font-size: clamp(1.75rem, 5.2svh, 2.55rem);
    margin-bottom: clamp(.18rem, .55svh, .38rem);
  }
  .raffle-wedding-page .form-panel__intro { display: none; }
  .raffle-wedding-page .form-panel label > span {
    font-size: clamp(.62rem, 1.1svh, .74rem);
    margin-bottom: .1rem;
  }
  .raffle-wedding-page .form-grid { gap: clamp(.22rem, .6svh, .38rem) clamp(.3rem, 1vw, .45rem); }
  .raffle-wedding-page .form-panel .ticket-quantity-label { grid-column: auto; }
  .raffle-wedding-page .form-panel .raffle-field,
  .raffle-wedding-page .form-panel .ticket-stepper__button {
    height: clamp(1.7rem, 3.8svh, 2.1rem);
    min-height: 44px;
    font-size: clamp(.7rem, 1.3svh, .82rem);
  }
  .raffle-wedding-page .form-panel .ticket-stepper {
    grid-template-columns: clamp(2.2rem, 6vw, 2.6rem) 1fr clamp(2.2rem, 6vw, 2.6rem);
    gap: clamp(.22rem, .6vw, .32rem);
  }
  .raffle-wedding-page .price-summary {
    grid-template-columns: auto 1fr;
    text-align: left;
    gap: clamp(.25rem, .7vw, .4rem);
    margin: clamp(.15rem, .45svh, .3rem) 0 0;
    padding-top: clamp(.15rem, .45svh, .3rem);
  }
  .raffle-wedding-page .price-summary__icon {
    width: clamp(1.4rem, 3.2svh, 1.9rem);
    height: clamp(1.4rem, 3.2svh, 1.9rem);
  }
  .raffle-wedding-page .price-summary__icon svg { width: 1rem; height: 1rem; }
  .raffle-wedding-page .raffle-form__price { display: none; }
  .raffle-wedding-page .raffle-form__total {
    margin: 0;
    font-size: clamp(.66rem, 1.2svh, .8rem);
  }
  .raffle-wedding-page .form-panel .raffle-submit {
    margin-top: clamp(.12rem, .38svh, .25rem);
    min-height: 44px;
    padding: .25rem .4rem;
    font-size: clamp(.66rem, 1.3svh, .8rem);
    letter-spacing: .04em;
  }
}

/* ============================================================
   BREAKPOINT 2.5 — Portrait tablet (48rem–60rem, e.g. 768×1024):
   the awkward middle. Too wide to stack purchase+form vertically
   (wasteful) but portrait, so it falls outside the landscape grid.
   Give the content grid 2 columns here (width allows it) and tighten
   the jackpot card so the page approaches one-screen.
   ============================================================ */
@media (min-width: 48rem) and (max-width: 59.99rem), (min-width: 48rem) and (max-aspect-ratio: 11/10) {
  .raffle-wedding-page .content-grid {
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  }
  .raffle-wedding-page .jackpot-feature {
    padding: clamp(.55rem, 1.6svh, 1.1rem) clamp(.7rem, 1.5vw, 1.2rem);
  }
  .raffle-wedding-page .jackpot-feature .jackpot-feature__amount {
    font-size: clamp(2.2rem, 7svh, 4rem);
  }
  .raffle-wedding-page .info-card {
    padding: clamp(.45rem, 1.2svh, .9rem) clamp(.5rem, 1vw, .95rem);
  }
}

/* ============================================================
   BREAKPOINT 3 — One-screen enforcement.
   Desktop landscape + phones lock to 100svh (no scroll).
   Portrait/tablet in between scrolls gracefully (never clips).
   ============================================================ */
@media (min-height: 700px) {
  /* Portrait, phone, tablet — scroll gracefully, no clipping */
  @media (max-width: 60rem), (max-aspect-ratio: 11/10) {
    .raffle-wedding-page {
      position: relative;
      min-height: 100svh;
      max-height: none;
      overflow-x: hidden;
      overflow-y: auto;
      padding-bottom: clamp(2rem, 5.5svh, 3rem);
    }
    .raffle-wedding-page .raffle-wedding-hero,
    .raffle-wedding-page .raffle-info,
    .raffle-wedding-page .raffle-main {
      flex-shrink: 0;
      min-height: 0;
      overflow: visible;
    }
    .raffle-wedding-page .raffle-footer {
      position: absolute;
      left: clamp(.7rem, 2vw, 1.9rem);
      right: clamp(.7rem, 2vw, 1.9rem);
      bottom: clamp(.2rem, .7svh, .5rem);
      width: auto;
      margin: 0;
      flex: none;
    }
  }

  /* Desktop landscape — strict one-screen */
  @media (min-width: 60rem) and (min-aspect-ratio: 11/10) {
    .raffle-wedding-page {
      max-height: 100svh;
      overflow: hidden;
      padding-bottom: clamp(.5rem, 1.6svh, 1.1rem);
    }
    .raffle-wedding-page .raffle-wedding-hero,
    .raffle-wedding-page .raffle-info {
      flex-shrink: 1;
      min-height: 0;
    }
    .raffle-wedding-page .raffle-info { overflow: hidden; }
    .raffle-wedding-page .raffle-main {
      flex: 1 1 auto;
      min-height: 0;
      overflow: hidden;
    }
    .raffle-wedding-page .raffle-footer {
      position: static;
      left: auto;
      right: auto;
      bottom: auto;
      width: 100%;
      flex: 0 0 auto;
    }
  }
}

/* Phones: strict one-screen, middle sections flex-shrink */
@media (max-width: 30rem) and (min-height: 700px) {
  .raffle-wedding-page {
    max-height: 100svh;
    max-height: 100dvh;
    overflow-x: hidden;
    overflow-y: hidden;
    padding-bottom: 0;
  }
  .raffle-wedding-page .raffle-wedding-hero { flex-shrink: 0; }
  .raffle-wedding-page .raffle-info {
    flex: 0 1 auto;
    min-height: 0;
    overflow: visible;
  }
  .raffle-wedding-page .raffle-main {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
  }
  .raffle-wedding-page .raffle-main > .container.content-grid {
    height: 100%;
    min-height: 0;
  }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .raffle-wedding-page .jackpot-feature,
  .raffle-wedding-page .jackpot-feature::before,
  .raffle-wedding-page .jackpot-feature .jackpot-feature__amount,
  .raffle-wedding-page .jackpot-feature__spark {
    animation: none !important;
  }
  .raffle-wedding-page .jackpot-feature::before { display: none; }
}

/* ============================================================
   V13 — ATTENTION PASS: ambient hearts, entrance choreography,
   micro-interactions. Everything here is transform/opacity or
   fixed-position decoration: ZERO layout impact, so the one-screen
   fit rule is untouched at every breakpoint.
   ============================================================ */

/* ---------- Ambient floating hearts (behind all content) ---------- */
.raffle-wedding-page .floating-hearts {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}
.raffle-wedding-page .floating-hearts span {
  position: absolute;
  bottom: -8vh;
  color: var(--raffle-red, #c0392b);
  line-height: 1;
  opacity: 0;
  animation: heartRise 16s linear infinite;
}
@keyframes heartRise {
  0% { transform: translate3d(0, 0, 0) rotate(-10deg) scale(.9); opacity: 0; }
  10% { opacity: var(--h-op, .16); }
  85% { opacity: var(--h-op, .16); }
  100% { transform: translate3d(3vw, -112vh, 0) rotate(12deg) scale(1.06); opacity: 0; }
}
.raffle-wedding-page .floating-hearts span:nth-child(1)  { left: 4%;  font-size: 1.6rem; --h-op: .14; animation-delay: -2s; }
.raffle-wedding-page .floating-hearts span:nth-child(2)  { left: 13%; font-size: 2.6rem; --h-op: .11; animation-duration: 21s; animation-delay: -9s; }
.raffle-wedding-page .floating-hearts span:nth-child(3)  { left: 24%; font-size: 1.2rem; --h-op: .18; animation-duration: 14s; animation-delay: -5s; color: var(--sky-dark, #4a7fae); }
.raffle-wedding-page .floating-hearts span:nth-child(4)  { left: 34%; font-size: 2rem;   --h-op: .12; animation-duration: 19s; animation-delay: -13s; }
.raffle-wedding-page .floating-hearts span:nth-child(5)  { left: 46%; font-size: 1.4rem; --h-op: .16; animation-duration: 15s; animation-delay: -7s; color: var(--sky-dark, #4a7fae); }
.raffle-wedding-page .floating-hearts span:nth-child(6)  { left: 57%; font-size: 2.9rem; --h-op: .10; animation-duration: 23s; animation-delay: -16s; }
.raffle-wedding-page .floating-hearts span:nth-child(7)  { left: 67%; font-size: 1.3rem; --h-op: .18; animation-duration: 13s; animation-delay: -3s; }
.raffle-wedding-page .floating-hearts span:nth-child(8)  { left: 76%; font-size: 1.9rem; --h-op: .13; animation-duration: 18s; animation-delay: -11s; color: var(--sky-dark, #4a7fae); }
.raffle-wedding-page .floating-hearts span:nth-child(9)  { left: 86%; font-size: 1.5rem; --h-op: .15; animation-duration: 16s; animation-delay: -6s; }
.raffle-wedding-page .floating-hearts span:nth-child(10) { left: 94%; font-size: 2.3rem; --h-op: .11; animation-duration: 20s; animation-delay: -14s; }

/* ---------- Entrance choreography (backwards fill: hidden during
   delay, released after end so hover transitions still work) ---------- */
@keyframes cardEnter {
  from { opacity: 0; transform: translateY(14px) scale(.97); }
  to { opacity: 1; transform: none; }
}
.raffle-wedding-page .info-grid > .info-card:not(.jackpot-feature) {
  animation: cardEnter .6s cubic-bezier(.22, 1, .36, 1) .3s backwards;
}
.raffle-wedding-page .info-grid > .info-card:nth-child(3) { animation-delay: .42s; }
.raffle-wedding-page .info-grid > .info-card:nth-child(4) { animation-delay: .54s; }
.raffle-wedding-page .jackpot-feature {
  animation:
    cardEnter .6s cubic-bezier(.22, 1, .36, 1) .15s backwards,
    jackpotFeatureGlow 3.4s ease-in-out infinite;
}
.raffle-wedding-page .content-grid > .panel {
  animation: cardEnter .6s cubic-bezier(.22, 1, .36, 1) .55s backwards;
}
.raffle-wedding-page .content-grid > .panel + .panel { animation-delay: .68s; }
.raffle-wedding-page .hero-note,
.raffle-wedding-page .raffle-footer {
  animation: cardEnter .7s ease-out .75s backwards;
}

/* ---------- Micro-interactions (mouse/trackpad only, no sticky
   touch hover) ---------- */
@media (hover: hover) and (pointer: fine) {
  .raffle-wedding-page .info-grid > .info-card:not(.jackpot-feature),
  .raffle-wedding-page .content-grid > .panel {
    transition: transform .25s ease, box-shadow .25s ease;
  }
  .raffle-wedding-page .info-grid > .info-card:not(.jackpot-feature):hover,
  .raffle-wedding-page .content-grid > .panel:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 28px -18px rgba(44, 62, 92, .6);
  }
  .raffle-wedding-page .info-card__icon,
  .raffle-wedding-page .etransfer__icon { transition: transform .25s ease; }
  .raffle-wedding-page .info-card:hover .info-card__icon,
  .raffle-wedding-page .etransfer:hover .etransfer__icon { transform: scale(1.12) rotate(-4deg); }
}

/* ---------- Attention accents ---------- */
.raffle-wedding-page .price-badge { position: relative; }
.raffle-wedding-page .price-badge::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(115deg, transparent 32%, rgba(255, 255, 255, .38) 48%, transparent 62%);
  transform: translateX(-130%);
  animation: badgeSheen 4.6s ease-in-out 1.4s infinite;
  pointer-events: none;
}
@keyframes badgeSheen {
  0% { transform: translateX(-130%); }
  30%, 100% { transform: translateX(130%); }
}
@keyframes emailPulse {
  0%, 100% { text-shadow: 0 0 0 rgba(210, 74, 67, 0); }
  50% { text-shadow: 0 0 14px rgba(210, 74, 67, .4); }
}
.raffle-wedding-page .etransfer__email strong,
.raffle-wedding-page .purchase-panel__compact-email strong {
  animation: emailPulse 3.6s ease-in-out infinite;
}

/* Ticket-stripe divider slowly marches (period = 2.1rem stripe repeat) */
.raffle-wedding-page .raffle-divider { animation: ticketMarch 8s linear infinite; }
@keyframes ticketMarch { to { background-position: 2.1rem 0; } }

/* Runner-up baskets bob gently */
@keyframes basketBob {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-4px) rotate(-1.2deg); }
}
.raffle-wedding-page .basket-photo-placeholder__basket {
  transform-origin: bottom center;
  animation: basketBob 4.4s ease-in-out infinite;
}
.raffle-wedding-page .basket-photo-placeholder__basket--two { animation-delay: .8s; }
.raffle-wedding-page .basket-photo-placeholder__basket--three { animation-delay: 1.6s; }

/* V13 reduced motion: static page, hearts gone */
@media (prefers-reduced-motion: reduce) {
  .raffle-wedding-page .floating-hearts { display: none; }
  .raffle-wedding-page .info-grid > .info-card,
  .raffle-wedding-page .content-grid > .panel,
  .raffle-wedding-page .hero-note,
  .raffle-wedding-page .raffle-footer,
  .raffle-wedding-page .price-badge::after,
  .raffle-wedding-page .etransfer__email strong,
  .raffle-wedding-page .purchase-panel__compact-email strong,
  .raffle-wedding-page .raffle-divider,
  .raffle-wedding-page .basket-photo-placeholder__basket {
    animation: none !important;
  }
  .raffle-wedding-page .price-badge::after { display: none; }
}

/* ============================================================
   V14 — CRAZY MODE: confetti rain, twinkle stars, drifting glow
   blobs, heartbeat logo + jackpot, icon wobbles, ribbon swing.
   Same contract as v13: fixed-position decoration and
   transform/opacity only — zero layout impact, one-screen intact.
   ============================================================ */

/* ---------- Six more hearts (children 11–16, bolder) ---------- */
.raffle-wedding-page .floating-hearts span:nth-child(11) { left: 9%;  font-size: 1.9rem; --h-op: .2;  animation-duration: 15s; animation-delay: -1s; }
.raffle-wedding-page .floating-hearts span:nth-child(12) { left: 19%; font-size: 1.3rem; --h-op: .24; animation-duration: 12s; animation-delay: -8s; color: var(--sky-dark, #4a7fae); }
.raffle-wedding-page .floating-hearts span:nth-child(13) { left: 40%; font-size: 2.4rem; --h-op: .16; animation-duration: 17s; animation-delay: -4s; }
.raffle-wedding-page .floating-hearts span:nth-child(14) { left: 52%; font-size: 1.1rem; --h-op: .26; animation-duration: 11s; animation-delay: -10s; }
.raffle-wedding-page .floating-hearts span:nth-child(15) { left: 71%; font-size: 1.7rem; --h-op: .2;  animation-duration: 14s; animation-delay: -2s; color: var(--sky-dark, #4a7fae); }
.raffle-wedding-page .floating-hearts span:nth-child(16) { left: 90%; font-size: 1.4rem; --h-op: .22; animation-duration: 13s; animation-delay: -6s; }

/* ---------- Drifting glow blobs (dreamy moving light) ---------- */
.raffle-wedding-page .floating-hearts::before,
.raffle-wedding-page .floating-hearts::after {
  content: "";
  position: absolute;
  width: 55vmax;
  height: 55vmax;
  border-radius: 50%;
  animation: blobDrift 26s ease-in-out infinite alternate;
}
.raffle-wedding-page .floating-hearts::before {
  left: -12vmax;
  top: -14vmax;
  background: radial-gradient(circle, rgba(255, 214, 130, .2), transparent 62%);
}
.raffle-wedding-page .floating-hearts::after {
  right: -14vmax;
  bottom: -16vmax;
  background: radial-gradient(circle, rgba(210, 74, 67, .12), transparent 62%);
  animation-duration: 31s;
  animation-delay: -12s;
}
@keyframes blobDrift {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to { transform: translate3d(24vw, 10vh, 0) scale(1.25); }
}

/* ---------- Confetti rain + twinkle stars ---------- */
.raffle-wedding-page .floating-confetti {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}
.raffle-wedding-page .floating-confetti span {
  position: absolute;
  top: -6vh;
  width: .5rem;
  height: .85rem;
  border-radius: 2px;
  opacity: 0;
  animation: confettiFall 9s linear infinite;
}
@keyframes confettiFall {
  0% { transform: translate3d(0, 0, 0) rotateZ(0) rotateX(0); opacity: 0; }
  6% { opacity: var(--c-op, .45); }
  88% { opacity: var(--c-op, .45); }
  100% { transform: translate3d(var(--c-sway, -6vw), 114vh, 0) rotateZ(560deg) rotateX(740deg); opacity: 0; }
}
.raffle-wedding-page .floating-confetti span:nth-child(1)  { left: 3%;  background: #d24a43; --c-op: .5;  animation-duration: 8s;  animation-delay: -2s; }
.raffle-wedding-page .floating-confetti span:nth-child(2)  { left: 11%; background: #e9b44c; --c-op: .45; --c-sway: 5vw; animation-duration: 11s; animation-delay: -7s; }
.raffle-wedding-page .floating-confetti span:nth-child(3)  { left: 18%; background: #1f4e79; --c-op: .4;  animation-duration: 9.5s; animation-delay: -4s; width: .4rem; height: .4rem; border-radius: 50%; }
.raffle-wedding-page .floating-confetti span:nth-child(4)  { left: 27%; background: #7fb0d8; --c-op: .5;  --c-sway: 4vw; animation-duration: 12s; animation-delay: -9s; }
.raffle-wedding-page .floating-confetti span:nth-child(5)  { left: 35%; background: #f5ead4; --c-op: .55; animation-duration: 7.5s; animation-delay: -1s; }
.raffle-wedding-page .floating-confetti span:nth-child(6)  { left: 43%; background: #d24a43; --c-op: .4;  --c-sway: 6vw; animation-duration: 13s; animation-delay: -11s; width: .45rem; height: .45rem; border-radius: 50%; }
.raffle-wedding-page .floating-confetti span:nth-child(7)  { left: 51%; background: #e9b44c; --c-op: .5;  animation-duration: 8.5s; animation-delay: -5s; }
.raffle-wedding-page .floating-confetti span:nth-child(8)  { left: 59%; background: #1f4e79; --c-op: .45; --c-sway: 5vw; animation-duration: 10.5s; animation-delay: -3s; }
.raffle-wedding-page .floating-confetti span:nth-child(9)  { left: 67%; background: #d24a43; --c-op: .5;  animation-duration: 9s; animation-delay: -8s; width: .4rem; height: .4rem; border-radius: 50%; }
.raffle-wedding-page .floating-confetti span:nth-child(10) { left: 75%; background: #7fb0d8; --c-op: .45; --c-sway: 4vw; animation-duration: 12.5s; animation-delay: -6s; }
.raffle-wedding-page .floating-confetti span:nth-child(11) { left: 83%; background: #f5ead4; --c-op: .55; animation-duration: 8s; animation-delay: -2.5s; }
.raffle-wedding-page .floating-confetti span:nth-child(12) { left: 89%; background: #e9b44c; --c-op: .4;  --c-sway: 6vw; animation-duration: 11.5s; animation-delay: -10s; width: .45rem; height: .45rem; border-radius: 50%; }
.raffle-wedding-page .floating-confetti span:nth-child(13) { left: 95%; background: #d24a43; --c-op: .5;  animation-duration: 9.5s; animation-delay: -4.5s; }
.raffle-wedding-page .floating-confetti span:nth-child(14) { left: 30%; background: #1f4e79; --c-op: .4;  --c-sway: 5vw; animation-duration: 13.5s; animation-delay: -12s; }
.raffle-wedding-page .floating-confetti .st {
  top: auto;
  width: auto;
  height: auto;
  background: none;
  border-radius: 0;
  color: #e9b44c;
  line-height: 1;
  opacity: .2;
  animation: starTwinkle 2.8s ease-in-out infinite;
}
@keyframes starTwinkle {
  0%, 100% { transform: scale(.55) rotate(0deg); opacity: .12; }
  50% { transform: scale(1.2) rotate(24deg); opacity: .7; }
}
.raffle-wedding-page .floating-confetti .st:nth-of-type(15) { left: 6%;  top: 12%; font-size: 1.7rem; }
.raffle-wedding-page .floating-confetti .st:nth-of-type(16) { left: 92%; top: 8%;  font-size: 1.3rem; animation-delay: .9s; }
.raffle-wedding-page .floating-confetti .st:nth-of-type(17) { left: 88%; top: 55%; font-size: 2rem;   animation-delay: 1.6s; color: #f5ead4; }
.raffle-wedding-page .floating-confetti .st:nth-of-type(18) { left: 4%;  top: 62%; font-size: 1.2rem; animation-delay: 2.2s; }

/* ---------- Heartbeat: the heart art thumps inside the floating
   wrapper (heroFloat stays on .hero-mark, beat on the inner SVG) ---------- */
@keyframes markHeartbeat {
  0%, 26%, 100% { transform: scale(1); }
  8% { transform: scale(1.04); }
  14% { transform: scale(1.005); }
  20% { transform: scale(1.03); }
}
.raffle-wedding-page .hero-mark__art {
  transform-origin: center 55%;
  animation: markHeartbeat 3.2s ease-in-out 1.4s infinite;
}

/* Date ribbon swings gently after its entrance pop */
@keyframes ribbonSwing {
  0%, 100% { transform: rotate(-2deg); }
  50% { transform: rotate(1.4deg); }
}
.raffle-wedding-page .raffle-wedding-mark .date-ribbon {
  animation:
    ribbonPop .75s cubic-bezier(.2, 1.2, .2, 1) .18s both,
    ribbonSwing 5.5s ease-in-out 2.2s infinite;
}

/* Jackpot amount pumps in time with its glow */
@keyframes amountBeat {
  0%, 24%, 100% { transform: scale(1); }
  8% { transform: scale(1.05); }
  16% { transform: scale(1.015); }
}
.raffle-wedding-page .jackpot-feature .jackpot-feature__amount {
  transform-origin: center;
  animation:
    jackpotAmountGlow 2.9s ease-in-out infinite,
    amountBeat 3.4s ease-in-out 1s infinite;
}

/* Icons wake up and wobble every few seconds (staggered) */
@keyframes iconWobble {
  0%, 68%, 100% { transform: rotate(0deg); }
  74% { transform: rotate(-11deg); }
  80% { transform: rotate(9deg); }
  86% { transform: rotate(-6deg); }
  92% { transform: rotate(3deg); }
}
.raffle-wedding-page .info-card__icon svg,
.raffle-wedding-page .jackpot-feature__icon svg,
.raffle-wedding-page .etransfer__icon svg {
  transform-origin: center;
  animation: iconWobble 5s ease-in-out infinite;
}
.raffle-wedding-page .info-card--basket .info-card__icon svg { animation-delay: .7s; }
.raffle-wedding-page .info-card--draw .info-card__icon svg { animation-delay: 1.4s; }
.raffle-wedding-page .etransfer__icon svg { animation-delay: 2.8s; }

/* FASTEST OPTION ribbon pulses for attention */
@keyframes ribbonPulse {
  0%, 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(210, 74, 67, .45); }
  50% { transform: scale(1.06); box-shadow: 0 0 0 .45rem rgba(210, 74, 67, 0); }
}
.raffle-wedding-page .purchase-panel__ribbon { animation: ribbonPulse 2.4s ease-in-out infinite; }

/* Footer hearts beat too */
@keyframes footerBeat {
  0%, 24%, 100% { transform: scale(1); }
  8% { transform: scale(1.03); }
  16% { transform: scale(1.008); }
}
.raffle-wedding-page .raffle-footer {
  transform-origin: center;
  animation:
    cardEnter .7s ease-out .75s backwards,
    footerBeat 3.2s ease-in-out 2s infinite;
}

/* Faster ticket-stripe march */
.raffle-wedding-page .raffle-divider { animation: ticketMarch 4.5s linear infinite; }

/* V14 reduced motion: everything above goes still */
@media (prefers-reduced-motion: reduce) {
  .raffle-wedding-page .floating-confetti { display: none; }
  .raffle-wedding-page .floating-hearts::before,
  .raffle-wedding-page .floating-hearts::after { display: none; }
  .raffle-wedding-page .hero-mark__art,
  .raffle-wedding-page .raffle-wedding-mark .date-ribbon,
  .raffle-wedding-page .jackpot-feature .jackpot-feature__amount,
  .raffle-wedding-page .info-card__icon svg,
  .raffle-wedding-page .jackpot-feature__icon svg,
  .raffle-wedding-page .etransfer__icon svg,
  .raffle-wedding-page .purchase-panel__ribbon,
  .raffle-wedding-page .raffle-footer {
    animation: none !important;
  }
}

/* ============================================================
   V15 — "how it works" steps + reference-code CTA
   Replaces the old prose notes in the purchase panel. Every size is
   clamp()+svh like the rest of this file so the one-screen rule holds:
   the block must not add net height over the notes it replaced.
   ============================================================ */
/* the body is taller now, so the envelope must top-align with "E-transfer to"
   instead of floating mid-block against step 2 */
.raffle-wedding-page .purchase-panel__full .etransfer { align-items: start; }

.raffle-wedding-page .etransfer__steps {
  margin: clamp(.15rem, .5svh, .35rem) 0 0;
  padding: 0;
  list-style: none;
  counter-reset: etstep;
  display: grid;
  gap: clamp(.1rem, .35svh, .28rem);
}
.raffle-wedding-page .etransfer__steps li {
  counter-increment: etstep;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: baseline;
  gap: clamp(.3rem, .8vw, .5rem);
  font-size: clamp(.7rem, 1.4svh, .92rem);
  font-weight: 700;
  line-height: 1.25;
  /* the panel centres its children; steps must read as a left-aligned list */
  text-align: left;
}
.raffle-wedding-page .etransfer__steps li::before {
  content: counter(etstep);
  display: grid;
  place-items: center;
  width: clamp(1rem, 2.1svh, 1.35rem);
  height: clamp(1rem, 2.1svh, 1.35rem);
  border-radius: 50%;
  background: var(--raffle-red);
  color: #fff8ec;
  font-size: clamp(.6rem, 1.2svh, .78rem);
  font-weight: 900;
  line-height: 1;
  transform: translateY(.1em);
}
.raffle-wedding-page .etransfer__cta {
  display: inline-block;
  margin: clamp(.2rem, .6svh, .45rem) 0 0;
  padding: clamp(.28rem, .9svh, .5rem) clamp(.7rem, 2vw, 1.1rem);
  border-radius: 999px;
  background: var(--raffle-red);
  color: #fff8ec;
  font-size: clamp(.72rem, 1.45svh, .95rem);
  font-weight: 900;
  text-decoration: none;
  border: 2px solid transparent;
}
.raffle-wedding-page .etransfer__cta:hover,
.raffle-wedding-page .etransfer__cta:focus-visible {
  background: #fff8ec;
  color: var(--raffle-red);
  border-color: var(--raffle-red);
}
.raffle-wedding-page .etransfer__note--fallback {
  margin-top: clamp(.15rem, .45svh, .3rem);
  font-size: clamp(.62rem, 1.15svh, .78rem);
  font-weight: 600;
  opacity: .8;
}

/* Tablet column is narrow enough that the fallback note costs more height than
   it earns; the 3 steps already say it. Desktop keeps it. */
@media (max-width: 900px) {
  .raffle-wedding-page .etransfer__note--fallback { display: none; }
}

/* ============================================================
   V16 — ticket form inline on the landing page, one panel at all widths.
   The compact/full split is gone from the markup: the form must exist exactly
   once in the DOM (duplicate name=/id= inputs otherwise), so the phone now
   renders the same panel, just tighter.
   ============================================================ */
/* ============================================================
   V17 — draw cards merged, seed-state jackpot, copyable code
   ============================================================ */

/* Two cards now (jackpot + schedule), not four. */
.raffle-wedding-page .info-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); }

.raffle-wedding-page .info-card--schedule {
  display: grid;
  align-content: center;
  padding: clamp(.4rem, 1.2svh, .8rem) clamp(.5rem, 2vw, 1rem);
}
.raffle-wedding-page .schedule-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: clamp(.3rem, .9svh, .6rem);
}
.raffle-wedding-page .schedule-list li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: clamp(.4rem, 1.4vw, .75rem);
  text-align: left;
}
/* Hairline between the two rows so they read as separate facts, not a run-on. */
.raffle-wedding-page .schedule-list li + li {
  padding-top: clamp(.3rem, .9svh, .6rem);
  border-top: 2px dashed #e2cfac;
}

/* Seed state: no pot yet. Sized down from the money figure so it does not
   shout, and the count-up JS is skipped entirely (no [data-jackpot-amount]). */
.raffle-wedding-page .jackpot-feature__amount--seed {
  font-size: clamp(1.4rem, 4.2svh, 2.6rem);
  line-height: 1.05;
}

/* Copyable reference code — a button that still looks like the dashed chip. */
.raffle-wedding-page button.ticket-result__code {
  display: grid;
  justify-items: center;
  gap: .1em;
  width: 100%;
  cursor: pointer;
  font-family: inherit;
}
.raffle-wedding-page button.ticket-result__code small {
  font-size: clamp(.5rem, .95svh, .64rem);
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  opacity: .7;
}
.raffle-wedding-page button.ticket-result__code:hover,
.raffle-wedding-page button.ticket-result__code:focus-visible {
  background: #fff8ec;
  border-style: solid;
}

/* Runner-up basket placeholder panel removed — the grid has one child now, so
   stop it stretching the purchase panel across a 1920px viewport. */
.raffle-wedding-page .raffle-main > .container.content-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 34rem);
  justify-content: center;
}

.raffle-wedding-page .ticket-flow { width: 100%; }

.raffle-wedding-page .ticket-form {
  display: grid;
  gap: clamp(.15rem, .45svh, .35rem);
  width: 100%;
  text-align: left;
}
.raffle-wedding-page .ticket-form__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(.2rem, .7svh, .5rem) clamp(.4rem, 1.4vw, .7rem);
}
.raffle-wedding-page .ticket-form__field {
  display: grid;
  gap: .12em;
  min-width: 0;
}
.raffle-wedding-page .ticket-form__field > span {
  font-size: clamp(.6rem, 1.1svh, .74rem);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #15304f;
}
.raffle-wedding-page .ticket-form .raffle-field {
  width: 100%;
  min-width: 0;
  padding: clamp(.26rem, .8svh, .45rem) clamp(.4rem, 1.4vw, .6rem);
  border: 2px solid #e2cfac;
  border-radius: .5rem;
  background: #fffdf7;
  font: inherit;
  font-size: clamp(.75rem, 1.5svh, .95rem);
  font-weight: 700;
  color: var(--raffle-ink);
}
.raffle-wedding-page .ticket-form .raffle-field:focus-visible {
  outline: 2px solid var(--raffle-red);
  outline-offset: 1px;
}
.raffle-wedding-page .ticket-form .ticket-stepper {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: stretch;
  gap: clamp(.18rem, .6vw, .3rem);
}
.raffle-wedding-page .ticket-form .ticket-stepper__button {
  width: clamp(1.6rem, 3.6svh, 2.2rem);
  border: 2px solid var(--raffle-red);
  border-radius: .5rem;
  background: var(--raffle-red);
  color: #fff8ec;
  font-size: clamp(.85rem, 1.8svh, 1.1rem);
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
}
.raffle-wedding-page .ticket-form .ticket-stepper input { text-align: center; }
.raffle-wedding-page .ticket-form__submit {
  width: 100%;
  margin-top: clamp(.1rem, .35svh, .25rem);
  padding: clamp(.36rem, 1.1svh, .62rem) 1rem;
  border: 2px solid transparent;
  border-radius: 999px;
  background: var(--raffle-red);
  color: #fff8ec;
  font-size: clamp(.78rem, 1.6svh, 1rem);
  font-weight: 900;
  cursor: pointer;
}
.raffle-wedding-page .ticket-form__submit:hover,
.raffle-wedding-page .ticket-form__submit:focus-visible {
  background: #fff8ec;
  color: var(--raffle-red);
  border-color: var(--raffle-red);
}
.raffle-wedding-page .ticket-form__hint {
  margin: 0;
  font-size: clamp(.58rem, 1.05svh, .74rem);
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  opacity: .85;
}
.raffle-wedding-page .ticket-form .errorlist {
  margin: .1em 0 0;
  padding: 0;
  list-style: none;
  color: var(--raffle-red);
  font-size: clamp(.55rem, 1svh, .7rem);
  font-weight: 800;
}

/* Result state — same slot, no navigation */
.raffle-wedding-page .ticket-result {
  display: grid;
  gap: clamp(.15rem, .5svh, .35rem);
  width: 100%;
  text-align: center;
}
.raffle-wedding-page .ticket-result__label {
  margin: 0;
  font-size: clamp(.6rem, 1.1svh, .74rem);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: #15304f;
}
.raffle-wedding-page .ticket-result__code {
  margin: 0;
  padding: clamp(.18rem, .6svh, .35rem) clamp(.5rem, 2vw, .9rem);
  border: 2px dashed var(--raffle-red);
  border-radius: .6rem;
  background: #fffdf7;
  color: var(--raffle-red);
  font-size: clamp(1.15rem, 3svh, 1.9rem);
  font-weight: 900;
  letter-spacing: .06em;
  line-height: 1.1;
}
.raffle-wedding-page .ticket-result__line {
  margin: 0;
  font-size: clamp(.68rem, 1.35svh, .88rem);
  font-weight: 700;
  line-height: 1.25;
}
.raffle-wedding-page .ticket-result__email {
  margin: 0;
  color: var(--raffle-red);
  font-size: clamp(.85rem, 1.8svh, 1.15rem);
  font-weight: 900;
  line-height: 1.1;
  overflow-wrap: anywhere;
}
.raffle-wedding-page .ticket-result__hint {
  margin: 0;
  font-size: clamp(.58rem, 1.05svh, .74rem);
  font-weight: 700;
  opacity: .85;
}

/* Phone: the panel used to be replaced by the compact strip. It renders now. */
@media (max-width: 30rem) {
  .raffle-wedding-page .purchase-panel__compact { display: none; }
  .raffle-wedding-page .purchase-panel__full { display: flex; }
  .raffle-wedding-page .ticket-form__grid { grid-template-columns: 1fr 1fr; }
  .raffle-wedding-page .ticket-form__submit { min-height: 44px; }
  .raffle-wedding-page .ticket-form .ticket-stepper__button { min-height: 40px; }

  /* One card per row now that the three draw/price cards are one. The old
     phone rules assumed a multi-card row and left the schedule card short. */
  .raffle-wedding-page .info-grid { grid-template-columns: minmax(0, 1fr); }

  /* The form needs the vertical budget more than these do. The jackpot card
     already states "$5.00 PER TICKET" a few hundred px above, so the badge was
     saying it twice; the ribbon is decoration now that the form IS the path. */
  .raffle-wedding-page .purchase-panel__full .price-badge,
  .raffle-wedding-page .purchase-panel__ribbon { display: none; }
  .raffle-wedding-page .purchase-panel__full .panel__title {
    margin: 0;
    font-size: clamp(1.3rem, 3.6svh, 1.8rem);
  }
}

/* ---- V15 phone: same steps + CTA in the compact strip ----
   The phone layout had ~200px of unused space below the basket card, so the
   flow explanation earns its place here too. Extends the existing compact grid
   ("price divider email" / "note note note") with two more full-width rows. */
@media (max-width: 30rem) {
  .raffle-wedding-page .purchase-panel__compact {
    grid-template-areas:
      "price divider email"
      "note note note"
      "steps steps steps"
      "cta cta cta"
      "fallback fallback fallback";
  }
  .raffle-wedding-page .purchase-panel__compact-steps {
    grid-area: steps;
    justify-self: center;
    margin: clamp(.1rem, .4svh, .25rem) 0 0;
  }
  .raffle-wedding-page .purchase-panel__compact-steps li {
    font-size: clamp(.62rem, 1.15svh, .78rem);
  }
  .raffle-wedding-page .purchase-panel__compact-cta {
    grid-area: cta;
    justify-self: center;
    /* 44px touch floor, same rule the stepper/submit follow */
    min-height: 44px;
    display: grid;
    place-items: center;
  }
  .raffle-wedding-page .purchase-panel__compact-fallback {
    grid-area: fallback;
    color: #15304f;
    font-size: clamp(.5rem, .9svh, .62rem);
    font-weight: 700;
    line-height: 1.15;
    text-align: center;
    opacity: .8;
  }
}

/* ============================================================
   V18 — one app column at every width.

   The page was a desktop dashboard (4-up info strip, side-by-side panels)
   that got progressively squeezed into a phone strip, which is why v8-v17
   were mostly breakpoint reconciliation. This collapses it to ONE layout:
   a centred app column, identical on desktop and phone. Desktop simply has
   more background around it. Theme, palette and type are untouched.

   Prefixed `body.` so these beat the earlier min-width media blocks on
   specificity rather than depending on source order alone.
   ============================================================ */

body.raffle-wedding-page {
  --app-col: 26rem;
  --app-gap: clamp(.4rem, 1.1svh, .7rem);
  --app-radius: 1.15rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--app-gap);
  min-height: 100svh;
  padding: clamp(.5rem, 1.6svh, 1rem) clamp(.6rem, 3vw, 1rem);
}

/* Every band becomes a row of the same column. */
body.raffle-wedding-page .raffle-hero,
body.raffle-wedding-page .raffle-info,
body.raffle-wedding-page .raffle-main {
  display: block;
  width: 100%;
  padding: 0;
  margin: 0;
  min-height: 0;
  /* line 3457 gives .raffle-main `flex: 1 1 auto` for the old full-height
     layout. As a flex child of the app column that made it swallow every
     leftover pixel, showing up as dead space below the form. */
  flex: 0 0 auto;
}
body.raffle-wedding-page .raffle-hero .container,
body.raffle-wedding-page .raffle-info .container,
body.raffle-wedding-page .raffle-main .container {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--app-gap);
  width: 100%;
  max-width: var(--app-col);
  margin-inline: auto;
  padding: 0;
  /* the old full-height panel layout left min-heights here, which showed up as
     ~230px of dead space under the form once the cards became content-sized */
  min-height: 0;
}

/* Header: mark over names, like an app's title block. */
body.raffle-wedding-page .raffle-wedding-hero .container {
  flex-direction: column;
  align-items: center;
  gap: 0;
}
body.raffle-wedding-page .raffle-wedding-mark {
  width: clamp(8rem, 19svh, 11.5rem);
  margin-inline: auto;
}
/* The tagline is the one thing with no job in an app layout. */
body.raffle-wedding-page .hero-note { display: none; }

/* Cards: one stack, one radius, one elevation. */
body.raffle-wedding-page .info-grid {
  display: flex;
  flex-direction: column;
  gap: var(--app-gap);
  width: 100%;
}
body.raffle-wedding-page .info-card,
body.raffle-wedding-page .panel {
  width: 100%;
  min-height: 0;
  border-radius: var(--app-radius);
  box-shadow: 0 2px 10px rgba(49, 82, 115, .13);
}
body.raffle-wedding-page .raffle-main > .container.content-grid {
  display: flex !important;
  flex-direction: column;
  grid-template-columns: none;
  max-width: var(--app-col);
  /* this selector outranks the generic .raffle-main .container above, so the
     centring AND the min-height reset have to be repeated here -- otherwise the
     panel hangs off to the left and drags ~230px of dead space under itself */
  margin-inline: auto;
  min-height: 0;
  height: auto;
}
body.raffle-wedding-page .purchase-panel__full {
  display: flex;
  width: 100%;
  gap: clamp(.25rem, .8svh, .5rem);
}

/* Chrome that only made sense in the dashboard version. */
body.raffle-wedding-page .raffle-divider,
body.raffle-wedding-page .purchase-panel__ribbon,
body.raffle-wedding-page .purchase-panel__compact { display: none; }

/* The price badge duplicated the jackpot card at every width, not just phone. */
body.raffle-wedding-page .purchase-panel__full .price-badge { display: none; }
body.raffle-wedding-page .purchase-panel__full .panel__title {
  margin: 0;
  font-size: clamp(1.35rem, 3.8svh, 1.9rem);
}

/* Jackpot reads as the app's headline number. */
body.raffle-wedding-page .jackpot-feature__amount {
  font-size: clamp(2.2rem, 7svh, 3.6rem);
  line-height: 1;
}
/* Shown at every width now, not just phone. Must NOT be a flex container --
   that collapses the space between "$5.00" and "per ticket". */
body.raffle-wedding-page .jackpot-feature__ticket-price {
  display: block;
  margin: .1em 0 0;
}

/* Phone rules from the old 4-up strip hid these to save width. The column is
   the same at every size now, so the icon+text rows should be too. */
body.raffle-wedding-page .info-card--schedule .schedule-list .info-card__icon {
  display: grid;
  place-items: center;
}

body.raffle-wedding-page .raffle-footer {
  margin: 0;
  text-align: center;
}

/* V19 — sales-closed state, same slot as the form. */
body.raffle-wedding-page .ticket-closed {
  display: grid;
  gap: clamp(.2rem, .6svh, .4rem);
  width: 100%;
  text-align: center;
  padding: clamp(.4rem, 1.2svh, .8rem) 0;
}
body.raffle-wedding-page .ticket-closed__label {
  margin: 0;
  color: var(--raffle-red);
  font-size: clamp(1rem, 2.4svh, 1.4rem);
  font-weight: 900;
}
body.raffle-wedding-page .ticket-closed__line {
  margin: 0;
  font-size: clamp(.68rem, 1.35svh, .88rem);
  font-weight: 700;
  line-height: 1.3;
}

/* ============================================================
   V22 — spend the reclaimed space on type size.

   Removing the duplicated date, "before the 50/50", "Growing with confirmed
   tickets" and the redundant year freed roughly half the card text. That
   budget goes into legibility rather than whitespace — this page is read at
   arm's length on a phone, at a party.
   ============================================================ */

/* Schedule: date once as a heading, times as the row labels. */
body.raffle-wedding-page .schedule__date {
  margin: 0 0 clamp(.15rem, .5svh, .35rem);
  color: var(--raffle-red);
  font-size: clamp(.72rem, 1.4svh, .92rem);
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
  text-align: center;
}
/* `.info-card--schedule` stays in these selectors even though the
   `:not(.jackpot-feature)` rules that forced it are now pruned: the entrance and
   hover rules near .info-grid still use that pattern, and :not() counts its
   argument's specificity, so a plain `.schedule-list li h3` can lose again. */
body.raffle-wedding-page .info-card--schedule .schedule-list li h3 {
  margin: 0;
  font-size: clamp(.95rem, 2.1svh, 1.3rem);
  font-weight: 900;
  line-height: 1.05;
}
body.raffle-wedding-page .info-card--schedule .schedule-list li p {
  margin: 0;
  font-size: clamp(.8rem, 1.65svh, 1.05rem);
  font-weight: 700;
  line-height: 1.15;
}
/* Same reason: the old block hid icons and centred text for the strip layout. */
body.raffle-wedding-page .info-card--schedule .schedule-list li {
  text-align: left;
}

/* Jackpot: the number is the headline, so give it the freed room. */
body.raffle-wedding-page .jackpot-feature__amount {
  font-size: clamp(2.6rem, 8.2svh, 4.4rem);
}
body.raffle-wedding-page .jackpot-feature__amount--seed {
  font-size: clamp(1.7rem, 5svh, 3rem);
}
body.raffle-wedding-page .jackpot-feature__ticket-price {
  font-size: clamp(.95rem, 2svh, 1.25rem);
}

/* Form: labels and inputs both up a step. */
body.raffle-wedding-page .ticket-form__field > span {
  font-size: clamp(.68rem, 1.3svh, .85rem);
}
/* 1rem floor is not cosmetic: iOS Safari auto-zooms the page when a focused
   input is under 16px, which throws the one-screen layout out on every tap. */
body.raffle-wedding-page .ticket-form .raffle-field {
  font-size: clamp(1rem, 1.8svh, 1.12rem);
  padding: clamp(.34rem, 1svh, .58rem) clamp(.45rem, 1.6vw, .7rem);
}
body.raffle-wedding-page .ticket-form__submit {
  font-size: clamp(.92rem, 1.95svh, 1.2rem);
  padding: clamp(.46rem, 1.35svh, .78rem) 1rem;
}
body.raffle-wedding-page .ticket-form__hint {
  font-size: clamp(.7rem, 1.35svh, .9rem);
}
body.raffle-wedding-page .purchase-panel__full .panel__title {
  font-size: clamp(1.55rem, 4.3svh, 2.2rem);
}

/* Result: the code is the one thing they must read correctly. */
body.raffle-wedding-page .ticket-result__code {
  font-size: clamp(1.4rem, 3.6svh, 2.3rem);
}
body.raffle-wedding-page .ticket-result__line {
  font-size: clamp(.8rem, 1.6svh, 1.05rem);
}
body.raffle-wedding-page .ticket-result__email {
  font-size: clamp(1rem, 2.1svh, 1.35rem);
}

/* ============================================================
   V23 — key-dates table. Rows are icon | label | when, with `when` pushed to
   the right edge, so the row uses its full width instead of leaving the right
   half blank. The sales deadline now lives here with the other dates.
   ============================================================ */
body.raffle-wedding-page .info-card--schedule .schedule-list li.schedule-list__row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: clamp(.4rem, 1.6vw, .8rem);
  text-align: left;
}
body.raffle-wedding-page .info-card--schedule .schedule-list__row h3 {
  margin: 0;
  font-size: clamp(.85rem, 1.75svh, 1.12rem);
  font-weight: 900;
  line-height: 1.1;
}
body.raffle-wedding-page .info-card--schedule .schedule-list__row p {
  margin: 0;
  justify-self: end;
  text-align: right;
  white-space: nowrap;
  color: var(--raffle-ink);
  font-size: clamp(.8rem, 1.6svh, 1.05rem);
  font-weight: 800;
  line-height: 1.1;
}
/* The deadline is the row that costs money if missed — mark it, don't bury it. */
body.raffle-wedding-page .schedule-list__row--deadline h3,
body.raffle-wedding-page .schedule-list__row--deadline p {
  color: var(--raffle-red);
}

/* The e-transfer instruction is the last thing read before leaving the page to
   open a banking app, so it stops being fine print. */
body.raffle-wedding-page .ticket-form__hint {
  font-size: clamp(.82rem, 1.6svh, 1.02rem);
  font-weight: 800;
  opacity: 1;
  line-height: 1.3;
}
