/* Home page: flyer-inspired design (ribbon banners, doodles, polaroid photos). */
.home { --ink: #1d2a1c; --navy: #1f3a5f; overflow: hidden; }
.home section { position: relative; }
.home .doodle { position: absolute; pointer-events: none; }
.home .hand { font-family: "Caveat", cursive; font-weight: 700; }

/* Shared bits */
.kicker { margin: 0 0 6px; font: 700 .95rem "Josefin Sans", "Nunito", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--red); }
.h-head { text-align: center; max-width: 820px; margin: 0 auto 40px; }
.h-head h2 { font-size: clamp(2.2rem, 5vw, 3.3rem); color: var(--green-800); margin: 0 0 12px; }
.h-head__sub { margin: 0; font-size: 1.25rem; color: var(--ink-soft); }
.big-hand { font-size: 1.6em; color: var(--red); line-height: 1; }
.btn-outline { border: 2.5px solid var(--green-800); color: var(--green-800); background: transparent; }
.btn-outline:hover { background: var(--green-800); color: #fff; }
.btn-gold { background: var(--gold-light); color: var(--ink); box-shadow: 0 5px 0 #b9851c; }
.btn svg { flex: none; }
.tag { display: inline-block; white-space: nowrap; background: var(--ink); color: #fff; font: 600 1rem "Josefin Sans", "Nunito", sans-serif; letter-spacing: .04em; padding: 5px 12px; border-radius: 8px; }
.tag--light { background: rgba(255, 255, 255, .2); color: #fff; }

/* Ribbon banner (like the San Elijo poster) */
.ribbon { --rb: var(--red); --rb-dark: #7a2219; position: relative; display: inline-block; margin: 0 38px 18px; isolation: isolate; }
.ribbon span { display: block; position: relative; background: var(--rb); color: #fff; padding: .14em .7em .2em; font: 600 clamp(1.25rem, 2.4vw, 1.6rem)/1.2 "Josefin Sans", "Nunito", sans-serif; letter-spacing: .06em; text-transform: uppercase; box-shadow: 0 6px 14px -6px rgba(0, 0, 0, .4); }
.ribbon span::before { content: ""; position: absolute; inset: 5px; border-top: 2px solid rgba(255, 255, 255, .45); border-bottom: 2px solid rgba(255, 255, 255, .45); pointer-events: none; }
.ribbon::before, .ribbon::after { content: ""; position: absolute; top: 24%; width: 46px; height: 100%; background: var(--rb-dark); z-index: -1; }
.ribbon::before { left: -32px; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 34% 50%); }
.ribbon::after { right: -32px; clip-path: polygon(0 0, 100% 0, 66% 50%, 100% 100%, 0 100%); }
.ribbon--dark { --rb: #17291f; --rb-dark: #0b150f; }
.ribbon--big { margin-bottom: 30px; }
.ribbon--big span { font-size: clamp(2rem, 4.2vw, 3.4rem); padding: .06em .55em .12em; white-space: nowrap; }
.ribbon--big::before, .ribbon--big::after { width: 64px; }
.ribbon--big::before { left: -46px; }
.ribbon--big::after { right: -46px; }

/* Polaroid photos */
.polaroid { position: relative; margin: 0; background: #fff; padding: 12px 12px 54px; border-radius: 6px; box-shadow: 0 18px 40px -16px rgba(20, 54, 38, .5); transform: rotate(2deg); }
.polaroid img { width: 100%; height: auto; display: block; border-radius: 3px; aspect-ratio: 4 / 3; object-fit: cover; }
.polaroid figcaption { position: absolute; left: 0; right: 0; bottom: 10px; text-align: center; font-size: 1.55rem; color: var(--ink); line-height: 1.1; padding: 0 10px; }
.polaroid--tilt { transform: rotate(-2.5deg); }

/* 1. Hero */
.h-hero { background: radial-gradient(circle at 20% 20%, #fff8e6 0, transparent 50%), radial-gradient(#e9dcbc 1.2px, transparent 1.3px) 0 0 / 22px 22px, var(--cream); padding: 70px 0 90px; }
.h-hero__text { min-width: 0; }
.h-hero__grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 56px; align-items: center; position: relative; z-index: 1; }
.pill { display: inline-block; margin: 0 0 22px; padding: 7px 18px; border-radius: 999px; background: var(--green-800); color: var(--gold-light); font-weight: 800; font-size: 1rem; }
.h-hero .ribbon--big { margin-left: 46px; transform: rotate(-2deg); }
.h-hero__title { font-size: clamp(1.9rem, 4vw, 3rem); color: var(--green-900); margin: 10px 0 28px; line-height: 1.12; }
.h-hero__title em { font-style: normal; color: var(--red); background: linear-gradient(transparent 68%, rgba(242, 205, 107, .7) 68%); }
.polaroid--hero { max-width: 520px; justify-self: center; }
.polaroid__badge { position: absolute; width: 104px !important; height: 104px !important; left: -38px; bottom: -32px; aspect-ratio: auto !important; filter: drop-shadow(0 10px 16px rgba(0, 0, 0, .35)); transform: rotate(-8deg); }
.photo-note { position: absolute; left: 24px; top: -66px; margin: 0; display: flex; flex-direction: column; color: var(--navy); font-size: 1.6rem; line-height: 1; transform: rotate(-8deg); }
.photo-note .note-arrow { width: 64px; height: 50px; margin-left: 46px; }
@media (max-width: 1240px) { .photo-note { left: -10px; top: -62px; } }
.h-hero__branch-l { width: 240px; height: 138px; left: -70px; top: -34px; transform: rotate(-10deg); }
.h-hero__branch-r { width: 240px; height: 140px; right: -50px; bottom: -10px; transform: scaleX(-1) rotate(-14deg); }
.note { position: absolute; margin: 0; color: var(--navy); font-size: 1.6rem; line-height: 1.05; z-index: 2; }
.note--tl { left: 3%; top: 150px; transform: rotate(-8deg); display: flex; flex-direction: column; }
.note-arrow { width: 70px; height: 54px; margin-left: 30px; color: var(--navy); }
.note--tr { right: 3%; top: 26px; text-align: center; transform: rotate(7deg); }
.note-heart { width: 24px; height: 22px; color: var(--red); vertical-align: middle; }
@media (max-width: 1240px) { .note { display: none !important; } }

/* 2. Event poster */
.h-event { background: repeating-conic-gradient(from 0deg at 80% 40%, rgba(242, 205, 107, .06) 0 7deg, transparent 7deg 20deg), linear-gradient(160deg, var(--green-800), var(--green-900)); padding: 80px 0; }
.h-event__grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 50px; align-items: center; }
.poster { position: relative; background: #fffdf6; border-radius: 10px; padding: 42px 40px 36px; text-align: center; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .6); transform: rotate(-1deg); }
.poster::before { content: ""; position: absolute; inset: 12px; border: 2px dashed rgba(29, 42, 28, .25); border-radius: 6px; pointer-events: none; }
.poster__orange { width: 96px; height: 88px; right: -26px; top: -30px; transform: rotate(14deg); }
.poster__title { margin: 4px 0 0; line-height: .95; }
.poster__title .hand { font-size: clamp(3.4rem, 8vw, 5.6rem); color: var(--red); text-shadow: 2px 2px 0 rgba(242, 205, 107, .6); }
.poster__sub { margin: 6px 0 22px; font: 600 1.15rem "Josefin Sans", "Nunito", sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--green-800); }
.sched { list-style: none; margin: 0; padding: 0; text-align: left; }
.sched li { display: grid; grid-template-columns: 56px 1fr auto; gap: 16px; align-items: center; padding: 12px 0; border-top: 2px solid rgba(29, 42, 28, .12); }
.sched li:last-child { border-bottom: 2px solid rgba(29, 42, 28, .12); }
.sched__icon { width: 54px; height: 54px; border-radius: 50%; background: var(--ink); color: #fff; display: grid; place-items: center; }
.sched__icon svg { width: 28px; height: 28px; }
.sched__what strong { display: block; font: 700 1.2rem "Josefin Sans", "Nunito", sans-serif; letter-spacing: .02em; color: var(--ink); text-transform: uppercase; }
.sched__what small { display: block; font-size: 1rem; color: var(--ink-soft); font-style: italic; }
.poster__addr { margin: 16px 0 0; font-weight: 700; color: var(--ink-soft); }
.poster__btns { justify-content: center; margin-top: 18px; }
.h-event__photo { position: relative; margin: 0; transform: rotate(3deg); background: #fff; padding: 12px 12px 56px; border-radius: 6px; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .6); }
.h-event__photo img { width: 100%; height: auto; display: block; border-radius: 3px; }
.h-event__photo figcaption { position: absolute; left: 0; right: 0; bottom: 10px; text-align: center; font-family: "Caveat", cursive; font-weight: 700; font-size: 1.7rem; color: var(--ink); }
.h-event__photo figcaption svg { width: 24px; height: 22px; color: var(--red); vertical-align: middle; }
.h-event__photo::before { content: ""; position: absolute; top: -14px; left: 50%; width: 110px; height: 30px; transform: translateX(-50%) rotate(-3deg); background: rgba(242, 205, 107, .75); box-shadow: 0 2px 4px rgba(0, 0, 0, .15); }

/* 3. Already here */
.h-here { background: var(--cream); padding: 80px 0; text-align: center; }
.h-here__line { margin: 0 0 10px; font-size: clamp(1.8rem, 4.4vw, 3rem); color: var(--green-900); line-height: 1.2; }
.hl { padding: 0 .18em; border-radius: 6px; display: inline-block; transform: rotate(-1deg); }
.hl--gold { background: rgba(242, 205, 107, .75); }
.hl--red { background: rgba(179, 55, 43, .9); color: #fff; }
.hl--green { background: var(--green-800); color: var(--gold-light); }
.h-here__star1 { width: 46px; height: 46px; left: 8%; top: 40px; color: var(--gold); }
.h-here__star2 { width: 34px; height: 34px; right: 10%; bottom: 46px; color: var(--red); }

/* 4. Why */
.h-why { background: #fffaf0; padding: 80px 0; }
.h-why__grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 60px; align-items: center; }
.h-why h2 { font-size: clamp(2rem, 4.4vw, 3rem); color: var(--green-800); margin: 0 0 16px; }
.h-why p { font-size: 1.2rem; color: var(--ink-soft); }
.h-why__note { font-size: 2rem !important; color: var(--red) !important; margin: 10px 0 0; }
.h-why__note svg { width: 28px; height: 26px; vertical-align: middle; }

/* 5. Three expressions */
.h-three { background: var(--cream); padding: 80px 0; }
.h-three__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.xcard { position: relative; border-radius: 22px; padding: 34px 28px 30px; color: #fff; box-shadow: var(--shadow); overflow: hidden; }
.xcard::after { content: ""; position: absolute; right: -40px; bottom: -40px; width: 160px; height: 160px; border-radius: 50%; background: rgba(255, 255, 255, .08); }
.xcard--red { background: linear-gradient(155deg, #c4473a, var(--red-dark)); }
.xcard--gold { background: linear-gradient(155deg, #b07a16, #7d5410); }
.xcard--green { background: linear-gradient(155deg, var(--green-600), var(--green-900)); }
.xcard__num { position: absolute; top: 18px; right: 22px; font: 600 3.4rem/1 "Josefin Sans", "Nunito", sans-serif; color: rgba(255, 255, 255, .22); }
.xcard__icon { width: 58px; height: 58px; border-radius: 50%; background: rgba(255, 255, 255, .16); display: grid; place-items: center; margin-bottom: 14px; }
.xcard__icon svg { width: 30px; height: 30px; color: var(--gold-light); }
.xcard__label { margin: 0; font: 700 .95rem "Josefin Sans", "Nunito", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-light); }
.xcard h3 { margin: 4px 0 10px; font-size: 2rem; color: #fff; }
.xcard p { margin: 0 0 16px; color: #fbf1d8; font-size: 1.08rem; }

/* 6. Banner */
.h-banner { background: var(--red); color: #fff; padding: 40px 0; text-align: center; }
.h-banner p { margin: 0 auto; font: 600 clamp(1.5rem, 3.6vw, 2.5rem)/1.2 "Josefin Sans", "Nunito", sans-serif; letter-spacing: .04em; text-transform: uppercase; }
.h-banner span { color: var(--gold-light); }
.h-banner__burst { width: 56px; height: 56px; left: 4%; top: 50%; margin-top: -28px; color: var(--gold-light); }
.h-banner__burst--r { left: auto; right: 4%; }

/* 7. Help */
.h-help { background: #fffaf0; padding: 80px 0; }
.h-help__avo { width: 80px; height: 106px; left: 3%; top: 60px; transform: rotate(-14deg); }
.h-help__orange { width: 90px; height: 82px; right: 4%; bottom: 70px; transform: rotate(10deg); }
.helps { list-style: none; margin: 0 auto; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 0; max-width: 1000px; }
.helps li { flex: 1 1 180px; max-width: 200px; border-left: 2px solid rgba(217, 164, 60, .5); }
.helps li:first-child { border-left: 0; }
.helps a { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 10px 12px; text-decoration: none; color: var(--green-900); font: 700 1.6rem/1.05 "Caveat", cursive; text-align: center; border-radius: 16px; }
.helps a:hover { background: var(--cream-2); }
.helps__icon { width: 84px; height: 84px; border-radius: 50%; display: grid; place-items: center; color: #fff; border: 4px solid #fff; box-shadow: 0 8px 18px -8px rgba(0, 0, 0, .45); }
.helps__icon svg { width: 40px; height: 40px; }
.helps__icon--navy { background: var(--navy); }
.helps__icon--green { background: var(--green-600); }
.helps__icon--red { background: var(--red); }
.helps__icon--gold { background: var(--gold); }
.h-help__roles { max-width: 720px; margin: 30px auto 0; text-align: center; font-size: 1.15rem; color: var(--ink-soft); }
.h-help__btns { justify-content: center; margin-top: 26px; }

/* 8. TERI */
.h-teri { background: var(--cream); padding: 80px 0 90px; }
.h-teri__branch { width: 280px; height: 160px; right: -40px; top: 10px; transform: rotate(8deg); }
.gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; max-width: 1040px; margin: 0 auto; }
.polaroid--g1 { transform: rotate(-3deg); }
.polaroid--g2 { transform: rotate(2deg) translateY(16px); }
.polaroid--g3 { transform: rotate(-1.5deg); }
.orchard { position: relative; aspect-ratio: 4 / 3; border-radius: 3px; background: radial-gradient(#ead9b2 1.2px, transparent 1.3px) 0 0 / 18px 18px, #fff6e0; overflow: hidden; }
.orchard svg { position: absolute; }
.orchard__branch { width: 90%; height: 55%; left: 0; top: 4%; }
.orchard__avo { width: 26%; height: 46%; left: 14%; bottom: 6%; transform: rotate(-12deg); }
.orchard__orange { width: 30%; height: 36%; right: 12%; bottom: 10%; transform: rotate(8deg); }
.orchard__star { width: 9%; height: 12%; left: 50%; bottom: 40%; color: var(--gold); }

/* 9. Seat */
.h-seat { color: #fff; padding: 90px 0; background: var(--green-900); }
.h-seat__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .28; }
.h-seat::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20, 54, 38, .95), rgba(20, 54, 38, .6)); z-index: 0; }
.h-seat__inner { position: relative; z-index: 1; display: grid; grid-template-columns: auto 1fr; gap: 40px; align-items: center; }
.h-seat__inner img { width: 150px; height: 150px; filter: drop-shadow(0 12px 20px rgba(0, 0, 0, .5)); }
.h-seat h2 { margin: 0 0 10px; font-size: clamp(2.2rem, 5vw, 3.2rem); color: #fff; }
.h-seat p { margin: 0 0 24px; font-size: 1.25rem; color: #f3ead2; max-width: 60ch; }

/* Phones and tablets */
@media (max-width: 900px) {
  .h-hero { padding: 40px 0 70px; text-align: center; }
  .h-hero__grid, .h-event__grid, .h-why__grid { grid-template-columns: minmax(0, 1fr); gap: 44px; }
  .h-hero .btns { justify-content: center; }
  .h-hero .ribbon--big { margin-left: 46px; margin-right: 46px; }
  .polaroid--hero { max-width: 440px; margin-top: 50px; }
  .polaroid__badge { left: -14px; }
  .h-hero__branch-l { width: 170px; height: 98px; left: -50px; top: -20px; }
  .h-hero__branch-r { display: none; }
  .h-event__photo { max-width: 380px; margin: 0 auto; }
  .h-three__grid, .gallery { grid-template-columns: 1fr; max-width: 520px; margin-left: auto; margin-right: auto; }
  .polaroid--g2 { transform: rotate(2deg); }
  .h-seat__inner { grid-template-columns: 1fr; text-align: center; }
  .h-seat__inner img { margin: 0 auto; width: 120px; height: 120px; }
  .h-seat .btns { justify-content: center; }
  .h-banner__burst { display: none; }
  .helps li { flex-basis: 50%; max-width: 50%; border-left: 0; }
}
@media (max-width: 560px) {
  .poster { padding: 32px 18px 28px; transform: none; }
  .sched li { grid-template-columns: 46px 1fr; gap: 12px; }
  .sched li .tag { grid-column: 2; justify-self: start; }
  .sched__icon { width: 44px; height: 44px; }
  .sched__icon svg { width: 22px; height: 22px; }
  .ribbon { margin-left: 30px; margin-right: 30px; }
  .ribbon--big span { font-size: clamp(1.5rem, 7.4vw, 2rem); }
  .pill { font-size: .92rem; }
  .h-hero .ribbon--big { margin-left: 40px; margin-right: 40px; }
  .ribbon--big::before { left: -34px; width: 48px; }
  .ribbon--big::after { right: -34px; width: 48px; }
  .polaroid__badge { width: 80px !important; height: 80px !important; left: -8px; bottom: -26px; }
  .photo-note { font-size: 1.35rem; left: 0; top: -58px; }
  .h-help__avo, .h-help__orange, .h-teri__branch { display: none; }
}
@media (prefers-reduced-motion: reduce) { .polaroid, .poster, .h-event__photo, .hl, .ribbon { transform: none !important; } }

/* Big welcome banner (San Elijo poster style) */
.mega { max-width: 620px; text-align: center; margin: 0 0 18px; }
.mega__emblem { display: block; width: 170px; height: 68px; margin: 0 auto -4px; }
.mega__tab { display: flex; align-items: center; gap: 14px; margin: 0 auto 2px; max-width: 420px; }
.mega__tab::before, .mega__tab::after { content: ""; flex: 1; height: 4px; background: var(--ink); border-radius: 2px; }
.mega__tab span { background: var(--green-800); color: var(--gold-light); font: 700 1.25rem "Josefin Sans", "Nunito", sans-serif; letter-spacing: .32em; text-transform: uppercase; padding: 3px 10px 3px 16px; border: 3px solid var(--ink); }
.mega__ribbon { display: block; width: 100%; height: auto; filter: drop-shadow(0 10px 14px rgba(20, 54, 38, .28)); }
.mega__sub { margin: 4px 0 0; font: 700 clamp(1rem, 2vw, 1.3rem)/1.25 "Josefin Sans", "Nunito", sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--red); }
@media (max-width: 900px) { .mega { margin-left: auto; margin-right: auto; } }
@media (max-width: 560px) { .mega__emblem { width: 130px; height: 52px; } .mega__tab span { font-size: 1rem; } .mega__sub { font-size: .92rem; } }

/* Marquee + open doors hero */
.h-hero__stack { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; text-align: center; }
.entry { width: min(860px, 100%); height: auto; display: block; margin: 0 auto 6px; filter: drop-shadow(0 18px 24px rgba(20, 54, 38, .22)); }
.entry .bulbs circle:nth-child(4n+1) { animation: twinkle 2.4s ease-in-out infinite; }
.entry .bulbs circle:nth-child(4n+3) { animation: twinkle 2.4s ease-in-out 1.2s infinite; }
@keyframes twinkle { 50% { opacity: .45; } }
.h-hero__text { max-width: 860px; }
.h-hero__title { margin-left: auto; margin-right: auto; max-width: 24ch; }
.h-hero .btns { justify-content: center; }
.mega__sub { margin: 6px 0 4px; font: 600 clamp(1rem, 2vw, 1.25rem)/1.35 "Josefin Sans", "Nunito", sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--red); }
.h-hero { padding: 40px 0 80px; }
.note--tl { top: 300px; }
.note--tr { top: 280px; }
@media (prefers-reduced-motion: reduce) { .entry .bulbs circle { animation: none !important; } }
@media (max-width: 560px) { .mega__sub { font-size: .9rem; letter-spacing: .08em; } .h-hero { padding-top: 24px; } }

/* ===== Hero v3: big TERI photo + slideshow ===== */
.hero2 { position: relative; min-height: min(86vh, 760px); display: flex; align-items: center; padding: 70px 0 90px; color: #fff; overflow: hidden; }
.hero2__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 40% 30%; }
.hero2__shade { position: absolute; inset: 0; background: linear-gradient(95deg, rgba(14, 38, 26, .9) 0%, rgba(14, 38, 26, .74) 42%, rgba(14, 38, 26, .2) 75%, rgba(14, 38, 26, .05) 100%), linear-gradient(0deg, rgba(14, 38, 26, .55), transparent 40%); }
.hero2__grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 56px; align-items: center; }
.hero2__kicker { margin: 0 0 16px; display: block; max-width: 560px; font: 600 clamp(.9rem, 1.4vw, 1.02rem)/1.5 "Josefin Sans", "Nunito", sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-light); }
.hero2__kicker::before { display: none; }
.marquee-sign { position: relative; display: inline-block; max-width: 100%; padding: 16px 30px 26px; background: rgba(23, 41, 31, .88); border: 3px solid var(--gold); border-radius: 18px; box-shadow: 0 0 0 6px rgba(23, 41, 31, .6), 0 20px 40px -14px rgba(0, 0, 0, .6); }
.marquee-sign__text { display: block; font: 500 clamp(1.9rem, 3.6vw, 3.3rem)/1 "Josefin Sans", "Century Gothic", sans-serif; letter-spacing: .1em; text-transform: uppercase; color: #fdf3dc; text-shadow: 0 0 1px #fff, 0 0 14px rgba(242, 205, 107, .55); -webkit-text-stroke: 1px rgba(217, 164, 60, .8); white-space: nowrap; }
.marquee-sign__bulbs { position: absolute; left: 18px; right: 18px; bottom: 8px; height: 10px; background: radial-gradient(circle, #fff6cf 0 2.6px, #f2cd6b 3.4px, rgba(242, 205, 107, 0) 6px) 0 50% / 22px 10px repeat-x; animation: chase 1.6s steps(2) infinite; }
@keyframes chase { 50% { background-position: 11px 50%; } }
.hero2__sub { margin: 20px 0 8px; font: 600 clamp(1rem, 1.8vw, 1.2rem)/1.4 "Josefin Sans", "Nunito", sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-light); max-width: 36ch; }
.hero2__title { font-size: clamp(1.8rem, 3.4vw, 2.7rem); line-height: 1.15; margin: 0 0 28px; color: #fff; text-shadow: 0 2px 12px rgba(0, 0, 0, .45); max-width: 22ch; }
.hero2__title em { font-style: normal; color: var(--gold-light); }
.btn-light { background: rgba(255, 255, 255, .14); color: #fff; border: 2px solid rgba(255, 255, 255, .75); backdrop-filter: blur(4px); }
.btn-light:hover { background: #fff; color: var(--green-900); }
.hero2__note { right: 3%; bottom: 22px; top: auto !important; color: #fff; font-size: 1.7rem; transform: rotate(-4deg); text-shadow: 0 2px 8px rgba(0, 0, 0, .6); }
.hero2__note .note-heart { color: #ff8a7a; }

.slides { position: relative; justify-self: end; width: min(350px, 100%); }
.slides__frame { position: relative; background: #fff; padding: 12px; border-radius: 10px; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .7); transform: rotate(1.5deg); aspect-ratio: 4 / 4.6; }
.slide { position: absolute; inset: 12px; margin: 0; opacity: 0; transition: opacity .8s ease; }
.slide.is-active { opacity: 1; }
.slide img { width: 100%; height: 100%; object-fit: cover; border-radius: 4px; display: block; }
.slide figcaption { position: absolute; left: 12px; bottom: 12px; background: rgba(23, 41, 31, .82); color: #fff; font: 700 1.5rem/1 "Caveat", cursive; padding: 6px 14px 8px; border-radius: 999px; }
.slides__btn { position: absolute; top: 50%; translate: 0 -50%; z-index: 2; width: 46px; height: 46px; border-radius: 50%; border: 3px solid #fff; background: rgba(23, 41, 31, .85); color: #fff; display: grid; place-items: center; cursor: pointer; box-shadow: 0 6px 14px rgba(0, 0, 0, .35); }
.slides__btn:hover { background: var(--red); }
.slides__btn--prev { left: -14px; }
.slides__btn--next { right: -14px; }
.slides__dots { display: flex; justify-content: center; gap: 10px; margin-top: 18px; }
.slides__dots button { width: 14px; height: 14px; border-radius: 999px; border: 2px solid #fff; background: transparent; padding: 0; cursor: pointer; transition: width .25s; }
.slides__dots button[aria-current="true"] { width: 34px; background: var(--red); border-color: var(--red); }
.slides__pause { display: block; margin: 10px auto 0; background: none; border: 0; color: rgba(255, 255, 255, .85); font: 700 .9rem "Nunito", sans-serif; text-decoration: underline; cursor: pointer; }
.slides__orange { width: 82px; height: 76px; left: -30px; top: -34px; z-index: 3; transform: rotate(-12deg); }

@media (max-width: 900px) {
  .hero2 { min-height: 0; padding: 40px 0 70px; text-align: center; }
  .hero2__grid { grid-template-columns: minmax(0, 1fr); gap: 46px; }
  .hero2__shade { background: linear-gradient(180deg, rgba(14, 38, 26, .82), rgba(14, 38, 26, .7) 60%, rgba(14, 38, 26, .85)); }
  .hero2__kicker::before { display: none; }
  .hero2__sub, .hero2__title { margin-left: auto; margin-right: auto; }
  .hero2 .btns { justify-content: center; }
  .slides { justify-self: center; }
  .hero2__note { display: none; }
}
@media (max-width: 520px) {
  .marquee-sign { padding: 12px 16px 22px; }
  .marquee-sign__text { font-size: clamp(1.6rem, 8.6vw, 2.3rem); letter-spacing: .06em; }
  .slides__btn--prev { left: -6px; } .slides__btn--next { right: -6px; }
}
@media (prefers-reduced-motion: reduce) { .marquee-sign__bulbs { animation: none; } .slide { transition: none; } }

.good-news { margin: 24px 0 0; max-width: 22ch; font: 700 clamp(1.9rem, 3.6vw, 2.9rem)/1.15 "Fraunces", Georgia, serif; color: #fff; text-shadow: 0 2px 10px rgba(0, 0, 0, .5); }
.good-news__label { display: block; margin-bottom: 6px; font: 700 clamp(1.7rem, 3vw, 2.3rem)/1 "Caveat", cursive; color: var(--gold-light); }
.good-news strong { color: var(--gold-light); background: linear-gradient(transparent 70%, rgba(179, 55, 43, .85) 70%); padding: 0 .1em; }
.hero2__title { font-size: clamp(1.4rem, 2.4vw, 1.9rem); font-weight: 600; color: #f3ead2; margin-top: 14px; }
@media (max-width: 900px) {
  .hero2__kicker { margin-left: auto; margin-right: auto; letter-spacing: .08em; }
  .good-news { margin-left: auto; margin-right: auto; }
  .slides { width: min(320px, 100%); }
}
@media (max-width: 600px) { .hero2__kicker br { display: none; } .hero2__kicker { font-size: .85rem; max-width: 32ch; } }

/* White info block under the hero */
.info { background: linear-gradient(180deg, var(--green-900) 0 70px, var(--cream) 70px); padding: 0 0 70px; }
.info__card { position: relative; max-width: 900px; margin: -10px auto 0; background: #fff; border-radius: 24px; padding: 54px 56px 46px; box-shadow: 0 24px 50px -24px rgba(20, 54, 38, .45); border-top: 8px solid var(--gold); font-size: 1.22rem; line-height: 1.7; color: var(--ink-soft); z-index: 2; }
.info__card p { margin: 0 0 18px; }
.info__card strong { color: var(--green-800); }
.info__icon { position: absolute; top: -34px; left: 50%; translate: -50% 0; width: 64px; height: 64px; border-radius: 50%; background: var(--red); border: 5px solid #fff; display: grid; place-items: center; box-shadow: 0 8px 18px -8px rgba(0, 0, 0, .5); }
.info__icon svg { width: 28px; height: 28px; color: #fff; }
.info__mission { margin: 24px 0 0 !important; padding-top: 22px; border-top: 2px dashed rgba(217, 164, 60, .6); color: var(--green-900); font-weight: 700; }
.info__mission span { background: linear-gradient(transparent 62%, rgba(242, 205, 107, .6) 62%); }
.info__orange { width: 78px; height: 72px; right: -24px; bottom: -26px; transform: rotate(12deg); }
@media (max-width: 600px) { .info__card { padding: 46px 22px 34px; font-size: 1.1rem; } .info__orange { right: -6px; width: 60px; height: 56px; } }

/* ===== Gorgeous marquee sign ===== */
.marquee-sign { position: relative; display: inline-block; max-width: 100%; padding: 24px 30px; background: linear-gradient(180deg, #24382b, #101e16); border: 0; border-radius: 22px; box-shadow: 0 0 0 2px #d9a43c, 0 0 0 7px #17291f, 0 0 0 9px #b9851c, 0 26px 50px -18px rgba(0, 0, 0, .75), 0 0 60px -10px rgba(242, 205, 107, .35); }
.ms-inner { position: relative; display: flex; align-items: center; gap: 14px; padding: 14px 26px 16px; border-radius: 12px; border: 2px solid rgba(242, 205, 107, .85); outline: 1px solid rgba(242, 205, 107, .35); outline-offset: 4px; background: radial-gradient(ellipse at 50% 0%, rgba(242, 205, 107, .16), transparent 70%), #13241a; }
.ms-text { display: block; white-space: nowrap; font: 500 clamp(1.7rem, 2.9vw, 2.8rem)/1.05 "Josefin Sans", "Century Gothic", sans-serif; letter-spacing: .12em; text-transform: uppercase;
  background: linear-gradient(100deg, #b9851c 0%, #f2cd6b 22%, #fff6d6 34%, #f2cd6b 46%, #c8952a 64%, #ffe9a8 80%, #d9a43c 100%) 0 0 / 220% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 0 6px rgba(242, 205, 107, .55)) drop-shadow(0 2px 0 rgba(0, 0, 0, .55));
  animation: shimmer 6s ease-in-out infinite; }
.ms-bang { margin-left: .04em; }
@keyframes shimmer { 0%, 100% { background-position: 0 0; } 50% { background-position: 100% 0; } }
/* Art Deco fans */
.ms-fan { flex: none; width: 26px; height: 40px; background:
  linear-gradient(#f2cd6b, #f2cd6b) 50% 100% / 2px 100% no-repeat,
  conic-gradient(from -40deg at 50% 100%, transparent 0 0, rgba(242, 205, 107, .9) 0 2deg, transparent 2deg 20deg, rgba(242, 205, 107, .9) 20deg 22deg, transparent 22deg 40deg, rgba(242, 205, 107, .9) 40deg 42deg, transparent 42deg 60deg, rgba(242, 205, 107, .9) 60deg 62deg, transparent 62deg 78deg, rgba(242, 205, 107, .9) 78deg 80deg, transparent 80deg); opacity: .9; }
.ms-fan::after { content: ""; display: block; width: 8px; height: 8px; margin: 32px auto 0; transform: translateY(-4px) rotate(45deg); background: #f2cd6b; }
/* Chasing bulbs on all four sides */
.ms-bulbs { position: absolute; --b: radial-gradient(circle, #fffbe8 0 2.4px, #ffe08a 3.2px, rgba(255, 224, 138, .45) 4.5px, rgba(255, 224, 138, 0) 7px); }
.ms-bulbs--top, .ms-bulbs--bottom { left: 16px; right: 16px; height: 12px; background: var(--b) 0 50% / 20px 12px repeat-x; animation: chase-x 1.4s steps(2) infinite; }
.ms-bulbs--top { top: 5px; }
.ms-bulbs--bottom { bottom: 5px; animation-direction: reverse; }
.ms-bulbs--left, .ms-bulbs--right { top: 22px; bottom: 22px; width: 12px; background: var(--b) 50% 0 / 12px 20px repeat-y; animation: chase-y 1.4s steps(2) infinite; }
.ms-bulbs--left { left: 5px; animation-direction: reverse; }
.ms-bulbs--right { right: 5px; }
@keyframes chase-x { 50% { background-position: 10px 50%; } }
@keyframes chase-y { 50% { background-position: 50% 10px; } }
.marquee-sign__text, .marquee-sign__bulbs { display: none; }
@media (max-width: 520px) {
  .marquee-sign { padding: 20px 24px; }
  .ms-inner { padding: 10px 12px 12px; gap: 8px; }
  .ms-text { font-size: clamp(1.35rem, 6.6vw, 1.9rem); letter-spacing: .08em; }
  .ms-fan { width: 16px; height: 26px; }
  .ms-fan::after { width: 6px; height: 6px; margin-top: 20px; }
}
@media (prefers-reduced-motion: reduce) { .ms-text, .ms-bulbs { animation: none !important; } }

/* ===== Celebrate Jesus: vintage Christmas playbill ===== */
.xmas { position: relative; overflow: hidden; padding: 100px 0 90px;
  background:
    radial-gradient(ellipse 60% 50% at 30% 45%, rgba(242, 205, 107, .22), transparent 70%),
    repeating-conic-gradient(from 0deg at 30% 45%, rgba(255, 246, 214, .05) 0 6deg, transparent 6deg 18deg),
    linear-gradient(170deg, #1f4d36, #10281b); }
.xmas::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(#fff 1px, transparent 1.5px) 0 0 / 46px 46px, radial-gradient(rgba(255, 255, 255, .7) 1px, transparent 1.5px) 23px 23px / 46px 46px; opacity: .12; }
.xmas__lights { position: absolute; top: 0; left: 0; width: 100%; height: 70px; z-index: 2; }
.xmas__bulbs { position: absolute; top: 0; left: 0; right: 0; height: 70px; z-index: 3; }
.xmas__bulbs i { position: absolute; width: 14px; height: 20px; margin-left: -7px; border-radius: 50% 50% 46% 46% / 60% 60% 40% 40%; background: var(--c); box-shadow: 0 0 10px 3px var(--g); animation: glow 2.2s ease-in-out infinite; }
.xmas__bulbs i::before { content: ""; position: absolute; top: -6px; left: 3px; width: 8px; height: 7px; border-radius: 2px; background: #3a3a2a; }
@keyframes glow { 50% { opacity: .55; box-shadow: 0 0 4px 1px var(--g); } }
.xmas__deco { position: absolute; z-index: 1; pointer-events: none; }
.xmas__deco--tl { width: 150px; height: 150px; left: -40px; top: 70px; transform: rotate(-12deg); }
.xmas__holly-tl { width: 150px; height: 86px; left: 70px; top: 150px; transform: rotate(18deg); }
.xmas__deco--br { width: 170px; height: 170px; right: -50px; bottom: -40px; transform: rotate(14deg); }
.xmas__holly-br { width: 160px; height: 92px; right: 90px; bottom: 20px; transform: rotate(-12deg); }
.xmas__orn1 { width: 46px; height: 62px; left: 26%; top: 54px; transform: rotate(-6deg); z-index: 3; }
.xmas__orn2 { width: 36px; height: 48px; right: 22%; top: 40px; transform: rotate(8deg); z-index: 3; }

.xmas__grid { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: 56px; align-items: center; }

/* The playbill card: arched top, scooped vintage corners, double gold frame */
.playbill { --cut: 26px; position: relative; padding: 14px; background: #fff8e8;
  border-radius: 220px 220px 28px 28px / 90px 90px 28px 28px;
  -webkit-mask: radial-gradient(circle var(--cut) at 0 100%, #0000 98%, #000) bottom left / 51% 51% no-repeat, radial-gradient(circle var(--cut) at 100% 100%, #0000 98%, #000) bottom right / 51% 51% no-repeat, linear-gradient(#000, #000) top / 100% 50% no-repeat;
          mask: radial-gradient(circle var(--cut) at 0 100%, #0000 98%, #000) bottom left / 51% 51% no-repeat, radial-gradient(circle var(--cut) at 100% 100%, #0000 98%, #000) bottom right / 51% 51% no-repeat, linear-gradient(#000, #000) top / 100% 50% no-repeat;
  filter: drop-shadow(0 30px 40px rgba(0, 0, 0, .45)); }
.playbill__inner { position: relative; text-align: center; padding: 26px 40px 40px;
  border: 3px solid var(--gold); outline: 1.5px solid var(--gold); outline-offset: -10px;
  border-radius: 208px 208px 20px 20px / 80px 80px 20px 20px;
  background: radial-gradient(ellipse at 50% 0%, #fffdf5, #fff6e0 60%, #fbecc8); }
.playbill__inner::before { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: radial-gradient(rgba(179, 55, 43, .07) 1px, transparent 1.4px) 0 0 / 14px 14px; }
.playbill__ribbon { display: block; width: min(540px, 100%); height: auto; margin: -8px auto 2px; }
.playbill__kicker { margin: 6px 0 0; display: inline-flex; align-items: center; gap: 10px; font: 600 .95rem "Josefin Sans", "Nunito", sans-serif; letter-spacing: .26em; text-transform: uppercase; color: var(--green-600); }
.playbill__kicker svg { width: 14px; height: 14px; color: var(--gold); }
.playbill__title { margin: 2px 0 0; line-height: .9; }
.playbill__celebrate { display: block; font: 600 clamp(2.2rem, 5vw, 3.8rem)/1 "Josefin Sans", "Century Gothic", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--green-800); text-shadow: 2px 2px 0 rgba(242, 205, 107, .9); }
.playbill__jesus { display: block; font: 700 clamp(4rem, 10vw, 7.4rem)/.95 "Caveat", cursive; color: #c8302a; text-shadow: 3px 3px 0 #f2cd6b, 6px 6px 0 rgba(94, 24, 16, .18); transform: rotate(-3deg); }
.playbill__flourish { display: block; width: 260px; max-width: 80%; height: 20px; margin: 10px auto 8px; }
.playbill__sub { margin: 0 auto 26px; max-width: 30ch; font: 600 clamp(1.15rem, 2vw, 1.4rem)/1.35 "Fraunces", Georgia, serif; color: var(--green-900); }
.playbill__program-label { display: flex; align-items: center; gap: 14px; margin: 0 0 8px; }
.playbill__program-label::before, .playbill__program-label::after { content: ""; flex: 1; height: 2px; background: repeating-linear-gradient(90deg, var(--gold) 0 6px, transparent 6px 11px); }
.playbill__program-label span { font: 600 .9rem "Josefin Sans", sans-serif; letter-spacing: .28em; text-transform: uppercase; color: var(--red); }
.program { list-style: none; margin: 0 0 26px; padding: 0; text-align: left; }
.program li { display: flex; align-items: center; gap: 16px; padding: 12px 6px; border-bottom: 1.5px dashed rgba(217, 164, 60, .55); }
.program strong { display: block; font: 700 1.3rem/1.15 "Fraunces", Georgia, serif; color: #b3372b; }
.program em { display: block; font-size: 1.02rem; color: var(--ink-soft); }
.medal { flex: none; width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center; color: #fff; box-shadow: 0 0 0 3px #fff8e8, 0 0 0 6px var(--gold), 0 6px 12px -4px rgba(0, 0, 0, .4); }
.medal svg { width: 28px; height: 28px; }
.medal--red { background: radial-gradient(circle at 35% 30%, #e2463b, #8e2a20); }
.medal--green { background: radial-gradient(circle at 35% 30%, #3f8a5a, #143626); }
.medal--green svg { color: var(--gold-light); }

/* Vintage ticket */
.ticket { --n: 14px; display: grid; grid-template-columns: 1fr auto; margin: 0 auto; max-width: 560px; filter: drop-shadow(0 10px 14px rgba(20, 54, 38, .35)); transform: rotate(-1deg); }
.ticket__main, .ticket__stub { -webkit-mask: radial-gradient(circle var(--n) at var(--x) 0, #0000 98%, #000) top / 100% 51% no-repeat, radial-gradient(circle var(--n) at var(--x) 100%, #0000 98%, #000) bottom / 100% 51% no-repeat; mask: radial-gradient(circle var(--n) at var(--x) 0, #0000 98%, #000) top / 100% 51% no-repeat, radial-gradient(circle var(--n) at var(--x) 100%, #0000 98%, #000) bottom / 100% 51% no-repeat; }
.ticket__main { --x: 100%; background: linear-gradient(135deg, #1f4d36, #143626); color: #fff; padding: 20px 22px; border-radius: 16px 0 0 16px; text-align: center; }
.ticket__stub { --x: 0; background: linear-gradient(135deg, #c8302a, #8e2a20); color: #fff; padding: 16px 20px; border-radius: 0 16px 16px 0; display: flex; flex-direction: column; align-items: center; justify-content: center; border-left: 3px dashed rgba(255, 246, 214, .7); }
.ticket__date { margin: 0; font: 700 clamp(1.25rem, 2.4vw, 1.6rem)/1.15 "Fraunces", Georgia, serif; }
.ticket__time { margin: 4px 0 8px; font: 600 1.35rem "Josefin Sans", sans-serif; letter-spacing: .14em; color: var(--gold-light); }
.ticket__place { margin: 0; font-size: 1rem; color: #f3ead2; line-height: 1.45; }
.ticket__place strong { color: #fff; }
.ticket__admit { font: 600 .8rem "Josefin Sans", sans-serif; letter-spacing: .3em; text-transform: uppercase; }
.ticket__all { font: 700 2.2rem/1 "Caveat", cursive; color: var(--gold-light); }
.ticket__free { margin-top: 4px; font: 700 .85rem "Nunito", sans-serif; background: #fff6dc; color: #8e2a20; padding: 2px 10px; border-radius: 999px; }
.playbill__then { margin: 18px 0 0; font: 700 1.6rem "Caveat", cursive; color: var(--green-800); }
.playbill__btns { justify-content: center; margin-top: 16px; }
.btn-green { background: var(--green-800); color: #fff; box-shadow: 0 5px 0 var(--green-900); }

/* Photo with holly */
.xmas__photo { position: relative; margin: 0; background: #fff; padding: 12px 12px 58px; border-radius: 8px; transform: rotate(3deg); box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .65); }
.xmas__photo img { display: block; width: 100%; height: auto; border-radius: 4px; }
.xmas__photo figcaption { position: absolute; left: 0; right: 0; bottom: 12px; text-align: center; font-size: 1.8rem; color: var(--ink); }
.xmas__photo figcaption svg { width: 24px; height: 22px; color: var(--red); vertical-align: middle; }
.xmas__photo-holly { position: absolute; width: 130px; height: 74px; left: -44px; top: -34px; transform: rotate(-20deg); }

@media (max-width: 900px) {
  .xmas { padding: 90px 0 70px; }
  .xmas__grid { grid-template-columns: minmax(0, 1fr); gap: 50px; }
  .xmas__photo { max-width: 360px; margin: 0 auto; }
  .xmas__holly-tl, .xmas__orn1 { display: none; }
}
@media (max-width: 560px) {
  .playbill { padding: 10px; --cut: 18px; border-radius: 160px 160px 22px 22px / 60px 60px 22px 22px; }
  .playbill__inner { padding: 20px 16px 30px; border-radius: 150px 150px 16px 16px / 54px 54px 16px 16px; }
  .playbill__kicker { letter-spacing: .14em; font-size: .8rem; }
  .program li { gap: 12px; }
  .medal { width: 46px; height: 46px; } .medal svg { width: 22px; height: 22px; }
  .program strong { font-size: 1.12rem; }
  .ticket { grid-template-columns: 1fr; transform: none; }
  .ticket__main { --x: 50%; border-radius: 16px 16px 0 0; -webkit-mask: radial-gradient(circle var(--n) at 0 100%, #0000 98%, #000) left / 51% 100% no-repeat, radial-gradient(circle var(--n) at 100% 100%, #0000 98%, #000) right / 51% 100% no-repeat; mask: radial-gradient(circle var(--n) at 0 100%, #0000 98%, #000) left / 51% 100% no-repeat, radial-gradient(circle var(--n) at 100% 100%, #0000 98%, #000) right / 51% 100% no-repeat; }
  .ticket__stub { border-radius: 0 0 16px 16px; border-left: 0; border-top: 3px dashed rgba(255, 246, 214, .7); flex-direction: row; gap: 10px; -webkit-mask: radial-gradient(circle var(--n) at 0 0, #0000 98%, #000) left / 51% 100% no-repeat, radial-gradient(circle var(--n) at 100% 0, #0000 98%, #000) right / 51% 100% no-repeat; mask: radial-gradient(circle var(--n) at 0 0, #0000 98%, #000) left / 51% 100% no-repeat, radial-gradient(circle var(--n) at 100% 0, #0000 98%, #000) right / 51% 100% no-repeat; }
  .ticket__all { font-size: 1.8rem; }
  .xmas__deco--tl { width: 100px; height: 100px; left: -36px; top: 60px; }
  .xmas__deco--br, .xmas__holly-br { display: none; }
}
@media (prefers-reduced-motion: reduce) { .xmas__bulbs i { animation: none; } }

/* ===== Flyer + program card (option 1) ===== */
.xmas { background:
    radial-gradient(ellipse 55% 60% at 32% 52%, rgba(255, 226, 150, .38), transparent 70%),
    repeating-conic-gradient(from 0deg at 32% 50%, rgba(255, 246, 214, .06) 0 6deg, transparent 6deg 18deg),
    linear-gradient(170deg, #1f4d36, #10281b); }
.flyer-grid { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 60px; align-items: center; }
.flyer { position: relative; margin: 10px 0 0; transform: rotate(-3.5deg); }
.flyer__glow { position: absolute; inset: -9%; border-radius: 50%; background: radial-gradient(closest-side, rgba(255, 233, 168, .75), rgba(255, 233, 168, .25) 55%, transparent); filter: blur(8px); z-index: -1; }
.flyer__img { display: block; width: 100%; height: auto; border-radius: 14px; border: 10px solid #fff8e8; box-shadow: 0 0 0 2px #d9a43c, 0 34px 60px -18px rgba(0, 0, 0, .7), 0 0 50px rgba(255, 226, 150, .35); }
.flyer__tape { position: absolute; top: -18px; left: 50%; width: 150px; height: 36px; translate: -50% 0; rotate: 2deg; background: repeating-linear-gradient(45deg, rgba(200, 48, 42, .85) 0 12px, rgba(255, 246, 220, .9) 12px 24px); box-shadow: 0 3px 6px rgba(0, 0, 0, .25); opacity: .92; }
.flyer__holly { position: absolute; width: 150px; height: 86px; right: -40px; top: -40px; transform: rotate(24deg); }
.flyer__poin { position: absolute; }
.flyer__poin--a { width: 130px; height: 130px; left: -56px; bottom: 40px; transform: rotate(-14deg); }
.flyer__poin--b { width: 96px; height: 96px; right: -40px; bottom: -34px; transform: rotate(20deg); }
.flyer__spark { position: absolute; color: #ffe9a8; filter: drop-shadow(0 0 6px rgba(255, 233, 168, .9)); animation: sparkle 3s ease-in-out infinite; }
.flyer__spark--1 { width: 28px; height: 28px; left: -30px; top: 18%; }
.flyer__spark--2 { width: 20px; height: 20px; right: -26px; top: 42%; animation-delay: 1s; }
.flyer__spark--3 { width: 24px; height: 24px; left: 46%; bottom: -34px; animation-delay: 2s; }
@keyframes sparkle { 0%, 100% { transform: scale(.6) rotate(0); opacity: .5; } 50% { transform: scale(1.1) rotate(25deg); opacity: 1; } }

.program-card { position: relative; text-align: center; padding: 36px 30px 32px; background: radial-gradient(ellipse at 50% 0%, #fffdf5, #fff6e0 60%, #fbecc8); border-radius: 30px; border: 3px solid var(--gold); outline: 1.5px solid var(--gold); outline-offset: -11px; box-shadow: 0 30px 50px -20px rgba(0, 0, 0, .6); transform: rotate(1.5deg); }
.program-card__ribbon { display: inline-block; position: relative; margin: -60px 0 10px; }
.program-card__ribbon span { display: block; background: #c8302a; color: #fff6dc; padding: 8px 24px; border-radius: 6px; font: 600 .95rem "Josefin Sans", sans-serif; letter-spacing: .22em; text-transform: uppercase; box-shadow: inset 0 0 0 2px rgba(242, 205, 107, .8), 0 6px 12px -4px rgba(0, 0, 0, .4); }
.program-card__title { margin: 0; line-height: .9; }
.program-card__title span { display: block; font: 600 clamp(1.8rem, 3.2vw, 2.6rem)/1 "Josefin Sans", sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--green-800); }
.program-card__title em { display: block; font: 700 clamp(3.4rem, 6vw, 5rem)/.95 "Caveat", cursive; font-style: normal; color: #c8302a; text-shadow: 3px 3px 0 #f2cd6b; transform: rotate(-3deg); }
.program-card .program { margin-bottom: 20px; }
.program-card .program li { padding: 9px 4px; }
.program-card .program strong { font-size: 1.15rem; }
.program-card .medal { width: 48px; height: 48px; }
.program-card .medal svg { width: 22px; height: 22px; }
.program-card .ticket { transform: rotate(-1.5deg); }
.program-card .ticket__main { padding: 16px 16px; }
.program-card .playbill__btns .btn { padding: 12px 18px; font-size: 1rem; }

@media (max-width: 900px) {
  .flyer-grid { grid-template-columns: minmax(0, 1fr); gap: 70px; }
  .flyer { max-width: 520px; margin: 0 auto; transform: rotate(-2deg); }
  .program-card { max-width: 520px; margin: 0 auto; transform: none; }
}
@media (max-width: 560px) {
  .flyer__poin--a { width: 90px; height: 90px; left: -24px; }
  .flyer__holly { right: -10px; width: 110px; height: 64px; }
  .flyer__img { border-width: 7px; }
  .program-card { padding: 34px 16px 26px; }
  .program-card .ticket { transform: none; }
}
@media (prefers-reduced-motion: reduce) { .flyer__spark { animation: none; } }

/* ===== "Hey Friend!" white info box beside the flyer ===== */
.flyer-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: start; }
.flyer { margin-top: 40px; }
.friend-note { position: relative; background: #fff; border-radius: 24px; border-top: 8px solid var(--gold); padding: 46px 38px 34px; box-shadow: 0 30px 50px -20px rgba(0, 0, 0, .6); color: var(--ink-soft); font-size: 1.08rem; line-height: 1.65; transform: rotate(1deg); }
.friend-note .info__icon svg { color: #fff; width: 26px; height: 26px; }
.friend-note__hey { margin: 0; font: 700 2.4rem/1 "Caveat", cursive; color: var(--red); transform: rotate(-3deg); display: inline-block; }
.friend-note__title { margin: 4px 0 16px; font: 700 clamp(1.7rem, 2.8vw, 2.2rem)/1.15 "Fraunces", Georgia, serif; color: var(--green-800); }
.friend-note p { margin: 0 0 14px; }
.friend-note strong { color: var(--green-900); }
.friend-note__when { margin: 18px 0 6px; padding: 18px 20px 6px; border-radius: 16px; background: var(--cream); border: 2px dashed rgba(217, 164, 60, .7); }
.friend-note__when p { font-size: 1.02rem; }
.friend-note__sign { margin: 16px 0 0 !important; font: 700 2rem/1.1 "Caveat", cursive; color: var(--red); }
.friend-note__sign svg { width: 26px; height: 24px; vertical-align: middle; color: var(--red); }
.friend-note__btns { margin-top: 16px; }
.friend-note__btns .btn { padding: 12px 18px; font-size: 1rem; }
@media (max-width: 900px) {
  .flyer-grid { grid-template-columns: minmax(0, 1fr); gap: 70px; }
  .flyer { margin-top: 0; }
  .friend-note { max-width: 620px; margin: 0 auto; transform: none; }
}
@media (max-width: 560px) { .friend-note { padding: 44px 20px 28px; font-size: 1.04rem; } .friend-note__btns { justify-content: center; } }

/* ===== Three pieces: flyer | note / when-and-where ===== */
.flyer-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "flyer note" "flyer when"; column-gap: 56px; row-gap: 40px; align-items: start; }
.flyer { grid-area: flyer; position: sticky; top: 110px; }
.friend-note { grid-area: note; }
.when-box { grid-area: when; }
.friend-note__you { margin: 20px 0 4px; padding: 20px 22px 12px; border-radius: 18px; background: linear-gradient(135deg, #fff4f1, #fff8e8); border: 2.5px solid rgba(200, 48, 42, .35); }
.friend-note__you-label { margin: 0 0 10px !important; font: 700 1.7rem/1.1 "Caveat", cursive; color: var(--red); }
.friend-note__you ul { list-style: none; margin: 0; padding: 0; }
.friend-note__you li { display: flex; gap: 12px; align-items: flex-start; margin: 0 0 12px; font-size: 1.22rem; line-height: 1.45; color: var(--green-900); }
.friend-note__you li svg { flex: none; width: 24px; height: 22px; margin-top: 3px; color: var(--red); }
.friend-note__you strong { color: #b3372b; }

.when-box { position: relative; display: grid; grid-template-columns: auto 1fr; gap: 24px; align-items: start; background: #fff; border-radius: 24px; padding: 30px 30px 28px; box-shadow: 0 30px 50px -20px rgba(0, 0, 0, .6); border: 3px solid var(--gold); outline: 1.5px dashed var(--gold); outline-offset: -12px; transform: rotate(-1deg); }
.when-box::before, .when-box::after { content: ""; position: absolute; top: 50%; width: 28px; height: 28px; margin-top: -14px; border-radius: 50%; background: #17331f; box-shadow: inset 0 0 0 3px var(--gold); }
.when-box::before { left: -16px; } .when-box::after { right: -16px; }
.when-box__cal { width: 96px; text-align: center; border-radius: 14px; overflow: hidden; background: #fff; box-shadow: 0 0 0 3px var(--green-800), 0 10px 16px -8px rgba(0, 0, 0, .45); transform: rotate(-4deg); }
.when-box__month { display: block; background: #c8302a; color: #fff; font: 600 1rem/1 "Josefin Sans", sans-serif; letter-spacing: .26em; text-transform: uppercase; padding: 8px 0 7px; }
.when-box__day { display: block; font: 700 3.4rem/1 "Fraunces", Georgia, serif; color: var(--green-900); padding-top: 6px; }
.when-box__dow { display: block; font: 700 1.2rem/1 "Caveat", cursive; color: var(--red); padding: 2px 0 8px; }
.when-box__title { margin: 2px 0 10px; font: 600 1.15rem "Josefin Sans", sans-serif; letter-spacing: .24em; text-transform: uppercase; color: var(--red); }
.when-list { list-style: none; margin: 0; padding: 0; }
.when-list li { display: flex; gap: 12px; align-items: flex-start; padding: 10px 0; border-bottom: 1.5px dashed rgba(217, 164, 60, .55); color: var(--ink-soft); font-size: 1rem; line-height: 1.45; }
.when-list li:last-child { border-bottom: 0; }
.when-list strong { display: block; font: 700 1.14rem/1.25 "Fraunces", Georgia, serif; color: var(--green-900); }
.when-list__icon { flex: none; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--green-800); color: var(--gold-light); }
.when-list__icon svg { width: 20px; height: 20px; }
.when-list__soon .when-list__icon { background: var(--gold); color: #fff; }
.when-box__btns { margin-top: 14px; }
.when-box__btns .btn { padding: 12px 18px; font-size: 1rem; }

@media (max-width: 900px) {
  .flyer-grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "flyer" "note" "when"; row-gap: 56px; }
  .flyer { position: relative; top: 0; }
  .when-box { max-width: 620px; margin: 0 auto; transform: none; }
}
@media (max-width: 560px) {
  .when-box { grid-template-columns: 1fr; padding: 26px 18px 24px; }
  .when-box__cal { margin: -50px auto 0; }
  .when-box__title { text-align: center; }
  .when-box__btns { justify-content: center; }
  .friend-note__you { padding: 18px 16px 8px; }
  .friend-note__you li { font-size: 1.12rem; }
}

/* ===== Flyer + vintage taped note, same size ===== */
.flyer-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "flyer note" "btns ."; column-gap: 64px; row-gap: 30px; align-items: stretch; }
.flyer { grid-area: flyer; position: relative; top: 0; margin: 0; align-self: center; }
.flyer__btns { grid-area: btns; justify-content: center; margin: 0; }
.friend-note--vintage { grid-area: note; display: flex; flex-direction: column; justify-content: center; margin: 0; padding: 48px 44px 40px; border: 0; border-radius: 4px; transform: rotate(2deg); color: #4a3f2e;
  background:
    radial-gradient(ellipse at 20% 10%, rgba(255, 255, 255, .7), transparent 50%),
    radial-gradient(ellipse at 85% 90%, rgba(196, 150, 80, .22), transparent 55%),
    repeating-linear-gradient(0deg, transparent 0 33px, rgba(120, 160, 190, .16) 33px 34px),
    linear-gradient(135deg, #fbf3dd, #f3e4bf);
  box-shadow: inset 0 0 40px rgba(160, 110, 40, .22), 0 26px 40px -18px rgba(0, 0, 0, .65);
  clip-path: polygon(0 1.5%, 6% 0, 14% 1%, 22% 0, 31% .8%, 40% 0, 50% 1%, 60% 0, 69% .9%, 78% 0, 87% 1%, 95% 0, 100% 1.2%, 99.4% 12%, 100% 25%, 99.3% 38%, 100% 50%, 99.4% 63%, 100% 76%, 99.3% 88%, 100% 98.5%, 94% 100%, 85% 99.2%, 76% 100%, 66% 99%, 56% 100%, 46% 99.2%, 36% 100%, 26% 99%, 16% 100%, 7% 99.2%, 0 100%, .6% 87%, 0 74%, .7% 61%, 0 48%, .6% 35%, 0 22%, .7% 10%); }
.friend-note--vintage::before { content: ""; position: absolute; top: 0; bottom: 0; left: 30px; width: 2px; background: rgba(200, 48, 42, .28); }
.friend-note--vintage .friend-note__hey { font-size: 2.8rem; }
.friend-note--vintage .friend-note__title { color: #2b3a24; }
.friend-note--vintage p { font-size: 1.12rem; line-height: 1.7; }
.friend-note--vintage strong { color: #1f4d36; }
.friend-note--vintage .friend-note__sign { font-size: 2.3rem; margin-top: 10px !important; text-align: right; transform: rotate(-3deg); }
/* tape lives outside the clipped note, so draw it on the grid cell */
.note-tape { position: absolute; z-index: 3; width: 120px; height: 32px; background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .25) 0 3px, transparent 3px 7px), rgba(242, 205, 107, .72); box-shadow: 0 2px 4px rgba(0, 0, 0, .18); }
.friend-note--vintage { clip-path: none; -webkit-mask: none; }
.friend-note--vintage { overflow: visible; }
.note-tape--l { top: -14px; left: -26px; transform: rotate(-32deg); }
.note-tape--r { top: -14px; right: -26px; transform: rotate(32deg); background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .25) 0 3px, transparent 3px 7px), rgba(200, 48, 42, .55); }
.friend-note--vintage { border-radius: 2px 6px 3px 8px / 6px 3px 8px 2px; }
@media (max-width: 900px) {
  .flyer-grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "flyer" "btns" "note"; row-gap: 40px; }
  .friend-note--vintage { max-width: 560px; margin: 20px auto 0; transform: rotate(1deg); }
}
@media (max-width: 560px) { .friend-note--vintage { padding: 42px 22px 30px 40px; } .friend-note--vintage::before { left: 22px; } .note-tape { width: 92px; height: 26px; } .note-tape--l { left: -12px; } .note-tape--r { right: -12px; } }
@media (min-width: 901px) {
  .flyer-grid { align-items: center; }
  .friend-note--vintage { aspect-ratio: 1100 / 1375; padding: 34px 34px 28px 50px; justify-content: space-between; }
  .friend-note--vintage p { font-size: 1rem; line-height: 1.58; margin-bottom: 10px; }
  .friend-note--vintage .friend-note__hey { font-size: 2.4rem; }
  .friend-note--vintage .friend-note__title { font-size: clamp(1.4rem, 2.2vw, 1.85rem); margin-bottom: 10px; }
  .friend-note--vintage .friend-note__sign { font-size: 2rem; }
  .flyer__img { border-width: 0; }
}
@media (min-width: 901px) and (max-width: 1100px) { .friend-note--vintage p { font-size: .92rem; line-height: 1.5; } }
.flyer-grid { grid-template-areas: "flyer note"; }
@media (max-width: 900px) { .flyer-grid { grid-template-areas: "flyer" "note"; } }

/* ===== Did you know... statistics ===== */
.dyk { position: relative; overflow: hidden; padding: 90px 0 90px;
  background: radial-gradient(ellipse 70% 50% at 50% 0%, #fff6dc, transparent 70%), radial-gradient(#e9dcbc 1.2px, transparent 1.3px) 0 0 / 22px 22px, var(--cream); }
.dyk__head { text-align: center; margin-bottom: 44px; }
.dyk__title { margin: 0; font: 700 clamp(3.4rem, 8vw, 6rem)/1 "Caveat", cursive; color: var(--green-800); transform: rotate(-2deg); text-shadow: 3px 3px 0 rgba(242, 205, 107, .8); }
.dyk__dots { color: var(--red); }
.dyk__squiggle { display: block; width: 200px; height: 20px; margin: 6px auto 0; color: var(--gold); }
.dyk__star { color: var(--gold); }
.dyk__star--1 { width: 54px; height: 54px; left: 8%; top: 70px; transform: rotate(-12deg); }
.dyk__star--2 { width: 38px; height: 38px; right: 9%; top: 130px; color: var(--red); }
.dyk__burst { width: 60px; height: 60px; right: 6%; bottom: 150px; color: var(--gold); }
.dyk__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-areas: "a v v" "b c c"; gap: 26px; }
.stat { position: relative; border-radius: 24px; padding: 30px 28px 24px; background: #fff; box-shadow: 0 20px 40px -22px rgba(20, 54, 38, .55); border-top: 8px solid var(--c, var(--gold)); }
.stat--a { grid-area: a; --c: var(--green-600); transform: rotate(-1.2deg); }
.stat--b { grid-area: b; --c: var(--red); transform: rotate(1deg); }
.stat--c { grid-area: c; --c: var(--gold); }
.stat__num { margin: 0; font: 700 clamp(3rem, 6vw, 4.6rem)/1 "Fraunces", Georgia, serif; color: var(--c); letter-spacing: -.02em; }
.stat__num small { font-size: .42em; letter-spacing: 0; color: var(--green-900); }
.stat__word { font: 700 .42em "Josefin Sans", sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--green-900); vertical-align: middle; }
.stat__text { margin: 10px 0 14px; font-size: 1.15rem; line-height: 1.5; color: var(--ink-soft); }
.stat__text strong { color: var(--green-900); }
.stat__src { margin: 0; padding-top: 10px; border-top: 1.5px dashed rgba(217, 164, 60, .6); font-size: .82rem; font-style: italic; color: #8a8468; }
.stat__src::before { content: "Source: "; font-style: normal; font-weight: 700; }
/* the 98% vs 47% centerpiece */
.stat--versus { grid-area: v; display: grid; grid-template-columns: 1fr auto 1fr; gap: 0; padding: 0; overflow: hidden; border-top: 0; background: none; box-shadow: 0 26px 46px -22px rgba(20, 54, 38, .65); }
.versus__side { padding: 30px 28px 24px; }
.versus__side--gold { background: linear-gradient(150deg, #1f4d36, #143626); }
.versus__side--red { background: linear-gradient(150deg, #c4473a, #7a2219); }
.versus__side .stat__num { color: var(--gold-light); }
.versus__side--red .stat__num { color: #fff6dc; }
.versus__side .stat__text { color: #f3ead2; }
.versus__side .stat__text strong { color: #fff; }
.versus__side .stat__src { color: rgba(255, 246, 220, .75); border-top-color: rgba(255, 246, 220, .35); }
.versus__mid { position: relative; width: 0; display: grid; place-items: center; }
.versus__mid span { position: absolute; z-index: 1; width: 70px; height: 70px; border-radius: 50%; display: grid; place-items: center; background: var(--gold-light); color: var(--green-900); font: 700 1.7rem/1 "Caveat", cursive; box-shadow: 0 0 0 5px #fff, 0 8px 16px rgba(0, 0, 0, .35); transform: rotate(-8deg); }
.dyk__here { margin: 60px auto 0; text-align: center; }
.dyk__cta { margin-top: 34px; text-align: center; }
.dyk__cta-line { margin: 0 0 16px; font-size: 2rem; color: var(--red); }
.dyk__cta .btns { justify-content: center; }
@media (max-width: 900px) {
  .dyk__grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "a" "v" "b" "c"; }
  .stat--versus { grid-template-columns: 1fr; }
  .versus__mid { width: auto; height: 0; }
  .stat--a, .stat--b { transform: none; }
}
@media (max-width: 560px) { .dyk { padding: 70px 0; } .stat, .versus__side { padding: 26px 20px 20px; } .dyk__cta-line { font-size: 1.6rem; } .dyk__star--1 { left: 2%; top: 30px; } }
.versus__side--gold { padding-right: 52px; }
.versus__side--red { padding-left: 52px; }
@media (max-width: 900px) {
  .versus__side--gold { padding-right: 20px; padding-bottom: 46px; }
  .versus__side--red { padding-left: 20px; padding-top: 46px; }
}
.dyk .stat--versus { padding: 0 !important; }

/* ===== Barnwood photo wall ===== */
.barn { position: relative; padding: 90px 0 100px; overflow: hidden;
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .18), transparent 12%, transparent 88%, rgba(0, 0, 0, .22)),
    repeating-linear-gradient(90deg, transparent 0 158px, rgba(30, 18, 8, .55) 158px 161px, rgba(255, 230, 190, .12) 161px 162px),
    repeating-linear-gradient(90deg, transparent 0 7px, rgba(60, 38, 18, .07) 7px 8px, transparent 8px 19px, rgba(255, 240, 210, .05) 19px 20px),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .025) 0 2px, transparent 2px 5px),
    radial-gradient(ellipse 30% 8% at 22% 30%, rgba(40, 24, 10, .35), transparent 70%),
    radial-gradient(ellipse 25% 6% at 70% 62%, rgba(40, 24, 10, .3), transparent 70%),
    radial-gradient(ellipse 20% 5% at 45% 85%, rgba(40, 24, 10, .28), transparent 70%),
    linear-gradient(90deg, #8a6a4a 0%, #9c7b58 9%, #7e5f42 18%, #a3825f 27%, #8c6c4c 36%, #9a7956 45%, #806146 54%, #a07f5c 63%, #87684a 72%, #9d7c59 81%, #836447 90%, #98775a 100%); }
.barn::after { content: ""; position: absolute; inset: 0; pointer-events: none; box-shadow: inset 0 0 120px rgba(30, 18, 8, .55); }
.barn .wrap { position: relative; z-index: 1; }
.barn__note { position: relative; max-width: 760px; margin: 0 auto 50px; padding: 40px 44px 30px; text-align: center; transform: rotate(-1deg);
  background: radial-gradient(ellipse at 20% 10%, rgba(255, 255, 255, .7), transparent 50%), linear-gradient(135deg, #fbf3dd, #f1e2bb);
  box-shadow: inset 0 0 36px rgba(160, 110, 40, .2), 0 22px 36px -16px rgba(0, 0, 0, .65); border-radius: 3px 8px 4px 10px / 8px 3px 10px 4px; }
.barn__note h2 { font-size: clamp(2rem, 4.4vw, 3rem); color: var(--green-800); margin: 4px 0 14px; }
.barn__note p { font-size: 1.15rem; color: #4a3f2e; }
.barn__note .h-why__note { margin-top: 6px; }
.barn__tack { position: absolute; top: 12px; left: 50%; width: 22px; height: 22px; margin-left: -11px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #ff8a7a, #c8302a 55%, #7a1a12); box-shadow: 0 4px 6px rgba(0, 0, 0, .45); }

.collage { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 30px 22px; padding: 10px 0 20px; }
.snap { position: relative; margin: 0; background: #fff; padding: 10px 10px 44px; border-radius: 3px; box-shadow: 0 16px 26px -12px rgba(0, 0, 0, .7); transition: transform .25s ease, box-shadow .25s ease; }
.snap img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 2px; filter: saturate(1.05) contrast(1.02); }
.snap figcaption { position: absolute; left: 6px; right: 6px; bottom: 8px; text-align: center; font-size: 1.3rem; line-height: 1.05; color: var(--ink); }
.snap:hover { transform: rotate(0) scale(1.06) !important; z-index: 5; box-shadow: 0 26px 40px -14px rgba(0, 0, 0, .8); }
.snap--1 { transform: rotate(-5deg) translateY(8px); }
.snap--2 { transform: rotate(3deg) translateY(-6px); }
.snap--3 { transform: rotate(-2deg) translateY(14px); }
.snap--4 { transform: rotate(4deg); }
.snap--5 { transform: rotate(-3deg) translateY(-8px); }
.snap--6 { transform: rotate(2deg) translateY(-4px); }
.snap--7 { transform: rotate(-4deg) translateY(10px); }
.snap--8 { transform: rotate(3deg) translateY(-10px); }
.snap--9 { transform: rotate(-2deg) translateY(6px); }
.snap--10 { transform: rotate(5deg) translateY(-2px); }
/* tape & pushpins */
.snap__tape { position: absolute; top: -14px; left: 50%; width: 86px; height: 26px; margin-left: -43px; transform: rotate(-4deg); background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .3) 0 3px, transparent 3px 7px), rgba(242, 205, 107, .78); box-shadow: 0 2px 3px rgba(0, 0, 0, .25); z-index: 2; }
.snap__tape-red { background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .3) 0 3px, transparent 3px 7px), rgba(200, 48, 42, .6); transform: rotate(5deg); }
.snap__pin { position: absolute; top: -8px; left: 50%; width: 20px; height: 20px; margin-left: -10px; border-radius: 50%; z-index: 2; box-shadow: 0 5px 6px rgba(0, 0, 0, .45); background: radial-gradient(circle at 35% 30%, #ff8a7a, #c8302a 55%, #7a1a12); }
.snap__pin-gold { background: radial-gradient(circle at 35% 30%, #fff1b8, #d9a43c 55%, #7a5410); }
.snap__pin-green { background: radial-gradient(circle at 35% 30%, #9be0a8, #2f6b47 55%, #143626); }
/* "That's me!" notes */
.thats-me { position: absolute; z-index: 4; display: flex; align-items: center; gap: 2px; white-space: nowrap; font-size: 1.7rem; color: #fff6dc; text-shadow: 0 2px 6px rgba(0, 0, 0, .75); pointer-events: none; }
.thats-me svg { width: 54px; height: 42px; color: #fff6dc; filter: drop-shadow(0 2px 3px rgba(0, 0, 0, .6)); }
.thats-me--r { top: -46px; right: -34px; transform: rotate(8deg); flex-direction: row-reverse; }
.thats-me--r svg { transform: scaleX(-1) rotate(10deg); }
.thats-me--l { top: -48px; left: -30px; transform: rotate(-8deg); }

@media (max-width: 1100px) { .collage { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 900px) { .collage { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 18px; } .barn__note { padding: 36px 24px 24px; } }
@media (max-width: 560px) {
  .barn { padding: 60px 0 70px; }
  .collage { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 16px; }
  .snap figcaption { font-size: 1.1rem; }
  .thats-me { font-size: 1.35rem; }
  .thats-me--r { right: -6px; } .thats-me--l { left: -6px; }
}
@media (prefers-reduced-motion: reduce) { .snap { transition: none; } }
.collage .snap img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; }
.collage .snap { align-self: start; }
.snap--8 .thats-me--r { top: -50px; right: -40px; }
.snap figcaption { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* collage: centered rows so 9 photos sit nicely */
.collage { display: flex; flex-wrap: wrap; justify-content: center; gap: 34px 24px; }
.collage .snap { flex: 0 0 calc((100% - 4 * 24px) / 5); }
.snap--8 .thats-me--r { top: -46px; right: -34px; }
@media (max-width: 1100px) { .collage .snap { flex-basis: calc((100% - 3 * 24px) / 4); } }
@media (max-width: 900px) { .collage .snap { flex-basis: calc((100% - 2 * 24px) / 3); } }
@media (max-width: 560px) { .collage { gap: 40px 16px; } .collage .snap { flex-basis: calc((100% - 16px) / 2); } }

/* ===== TERI: vintage postcard ===== */
.teri { position: relative; overflow: hidden; padding: 90px 0 100px; background: radial-gradient(ellipse 60% 60% at 50% 40%, #fff8e6, transparent 70%), radial-gradient(#e9dcbc 1.2px, transparent 1.3px) 0 0 / 22px 22px, var(--cream); }
.teri__branch { width: 280px; height: 160px; }
.teri__branch--l { left: -60px; top: 20px; transform: rotate(-8deg); }
.teri__branch--r { right: -60px; bottom: 10px; transform: scaleX(-1) rotate(-10deg); }
.teri__avo { width: 70px; height: 92px; right: 7%; top: 50px; transform: rotate(16deg); }
.postcard { position: relative; display: grid; grid-template-columns: 1.05fr 1fr; max-width: 1060px; margin: 0 auto; background: #fbf3dd; border-radius: 10px; transform: rotate(-1.2deg);
  box-shadow: inset 0 0 50px rgba(160, 110, 40, .2), 0 30px 50px -22px rgba(20, 54, 38, .6), 0 0 0 10px #fff8e8, 0 0 0 12px rgba(217, 164, 60, .6); }
.postcard::before { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: radial-gradient(ellipse at 15% 10%, rgba(255, 255, 255, .6), transparent 45%), radial-gradient(ellipse at 90% 95%, rgba(196, 150, 80, .2), transparent 50%); }
.postcard__front { position: relative; padding: 28px 26px 26px; border-right: 2px dashed rgba(120, 90, 50, .35); text-align: center; }
.postcard__greet { margin: 0; font: 700 2rem/1 "Caveat", cursive; color: var(--red); transform: rotate(-3deg); }
.postcard__place { margin: 4px 0 16px; font: 600 clamp(1.5rem, 2.6vw, 2.1rem)/1.1 "Josefin Sans", sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--green-800); text-shadow: 2px 2px 0 rgba(242, 205, 107, .8); }
.postcard__photos { display: grid; grid-template-columns: 1.2fr 1fr; grid-template-rows: 1fr 1fr; gap: 12px; }
.pc-photo { margin: 0; background: #fff; padding: 6px; box-shadow: 0 8px 14px -6px rgba(0, 0, 0, .45); }
.pc-photo img { display: block; width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 3; }
.pc-photo--1 { grid-row: span 2; transform: rotate(-2deg); }
.pc-photo--1 img { aspect-ratio: auto; height: 100%; }
.pc-photo--2 { transform: rotate(2.5deg); }
.pc-photo--3 { display: none; }
.pc-photo--4 { transform: rotate(-1.5deg); }
.postcard__town { margin: 14px 0 0; font: 700 1.5rem "Caveat", cursive; color: var(--green-800); }
.postcard__back { position: relative; padding: 40px 40px 34px; color: #4a3f2e; font-size: 1.1rem; line-height: 1.65;
  background: repeating-linear-gradient(0deg, transparent 0 35px, rgba(120, 160, 190, .18) 35px 36px) 0 120px / 100% 100% no-repeat; }
.postcard__stamp { position: absolute; top: 18px; right: 20px; width: 74px; height: 89px; transform: rotate(6deg); filter: drop-shadow(0 3px 4px rgba(0, 0, 0, .25)); }
.postcard__stamp svg { width: 100%; height: 100%; }
.postcard__postmark { position: absolute; top: 40px; right: 70px; width: 86px; height: 86px; border-radius: 50%; border: 2.5px solid rgba(200, 48, 42, .55); display: grid; place-items: center; transform: rotate(-16deg); text-align: center; font: 600 .78rem/1.1 "Josefin Sans", sans-serif; letter-spacing: .12em; text-transform: uppercase; color: rgba(200, 48, 42, .7); }
.postcard__postmark::after { content: ""; position: absolute; left: -46px; right: -46px; top: 50%; height: 14px; margin-top: -7px; background: repeating-linear-gradient(0deg, rgba(200, 48, 42, .45) 0 2px, transparent 2px 5px); z-index: -1; }
.postcard__title { margin: 0 110px 16px 0; font: 700 clamp(1.5rem, 2.6vw, 2.1rem)/1.2 "Fraunces", Georgia, serif; color: var(--green-800); }
.postcard__back p { margin: 0 0 14px; }
.postcard__back strong { color: var(--green-900); }
.postcard__thanks { font-size: 1.9rem !important; line-height: 1.15; color: var(--red); margin-top: 6px !important; }
.postcard__thanks svg { width: 26px; height: 24px; vertical-align: middle; color: var(--red); }
.postcard__link { display: inline-flex; align-items: center; gap: 8px; margin-top: 4px; font-weight: 800; color: var(--green-800); text-decoration: none; border-bottom: 2px solid var(--gold); padding-bottom: 2px; }
.postcard__link:hover { color: var(--red); border-color: var(--red); }
@media (max-width: 900px) {
  .postcard { grid-template-columns: minmax(0, 1fr); transform: none; }
  .postcard__front { border-right: 0; border-bottom: 2px dashed rgba(120, 90, 50, .35); }
  .teri__branch--r, .teri__avo { display: none; }
}
@media (max-width: 560px) {
  .postcard__back { padding: 34px 20px 28px; }
  .postcard__title { margin-right: 70px; }
  .postcard__stamp { width: 58px; height: 70px; right: 12px; }
  .postcard__postmark { display: none; }
  .teri__branch--l { width: 170px; height: 98px; left: -60px; top: 0; }
}
.postcard__postmark { top: 92px; right: 36px; }
.postcard__title { margin-right: 140px; }
@media (max-width: 560px) { .postcard__title { margin-right: 70px; } }
/* avocados swapped for oranges */
.h-help__avo { width: 84px; height: 78px; transform: rotate(-14deg); }
.teri__avo { width: 78px; height: 72px; transform: rotate(16deg); }
/* wider, bigger "One Vision. Three Expressions." ribbon */
.ribbon--wide { margin-left: 60px; margin-right: 60px; }
.ribbon--wide span { font-size: clamp(1.5rem, 3.6vw, 2.6rem); padding: .32em 1.6em .38em; letter-spacing: .1em; }
.ribbon--wide::before, .ribbon--wide::after { width: 72px; top: 26%; }
.ribbon--wide::before { left: -52px; }
.ribbon--wide::after { right: -52px; }
@media (max-width: 560px) {
  .ribbon--wide { margin-left: 34px; margin-right: 34px; }
  .ribbon--wide span { font-size: 1.15rem; padding: .4em .8em .45em; letter-spacing: .06em; }
  .ribbon--wide::before, .ribbon--wide::after { width: 44px; }
  .ribbon--wide::before { left: -30px; } .ribbon--wide::after { right: -30px; }
}
.h-three .h-head { max-width: none; }
@media (min-width: 761px) { .ribbon--wide span { white-space: nowrap; } }
@media (min-width: 761px) and (max-width: 1000px) { .ribbon--wide span { font-size: 1.6rem; padding-left: 1em; padding-right: 1em; } }

/* ===== "Different abilities. Same Jesus. Same family." with a little more love ===== */
.promise { position: relative; overflow: hidden; padding: 64px 0 60px; text-align: center; color: #fff;
  background:
    radial-gradient(ellipse 45% 90% at 50% 50%, rgba(255, 140, 110, .45), transparent 70%),
    repeating-linear-gradient(90deg, rgba(0, 0, 0, .07) 0 2px, transparent 2px 9px),
    linear-gradient(180deg, #a92f24, #c8302a 45%, #8e2a20); }
.promise::before, .promise::after { content: ""; position: absolute; left: 0; right: 0; height: 6px; background: linear-gradient(90deg, #b9851c, #f2cd6b 30%, #fff1b8 50%, #f2cd6b 70%, #b9851c); }
.promise::before { top: 26px; } .promise::after { bottom: 26px; }
.promise__bulbs { position: absolute; left: 0; right: 0; height: 14px; --b: radial-gradient(circle, #fffbe8 0 2.6px, #ffe08a 3.4px, rgba(255, 224, 138, .45) 5px, rgba(255, 224, 138, 0) 7.5px);
  background: var(--b) 0 50% / 24px 14px repeat-x; animation: chase-x 1.4s steps(2) infinite; }
.promise__bulbs--top { top: 6px; }
.promise__bulbs--bottom { bottom: 6px; animation-direction: reverse; }
.promise__inner { position: relative; z-index: 1; }
.promise__line { margin: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px 22px; }
.promise__part { font: 600 clamp(1.7rem, 4.2vw, 3.2rem)/1.15 "Josefin Sans", "Nunito", sans-serif; letter-spacing: .08em; text-transform: uppercase; text-shadow: 0 3px 0 rgba(94, 24, 16, .55), 0 0 22px rgba(255, 200, 160, .35); white-space: nowrap; }
.promise__part--gold { color: transparent; background: linear-gradient(100deg, #e8b04a 0%, #f2cd6b 25%, #fff6d6 38%, #f2cd6b 52%, #d9a43c 75%, #ffe9a8 100%) 0 0 / 220% 100%; -webkit-background-clip: text; background-clip: text; filter: drop-shadow(0 3px 0 rgba(94, 24, 16, .55)) drop-shadow(0 0 10px rgba(242, 205, 107, .6)); animation: shimmer 6s ease-in-out infinite; text-shadow: none; }
.promise__dot { display: inline-grid; place-items: center; width: 34px; height: 34px; }
.promise__dot svg { width: 24px; height: 24px; color: var(--gold-light); filter: drop-shadow(0 0 6px rgba(242, 205, 107, .8)); animation: beat 2.4s ease-in-out infinite; }
.promise__dot:nth-of-type(2) svg { animation-delay: 1.2s; }
@keyframes beat { 0%, 100% { transform: scale(1); } 15% { transform: scale(1.25); } 30% { transform: scale(1); } 45% { transform: scale(1.15); } }
.promise__flourish { display: block; width: 260px; height: 22px; margin: 14px auto 0; }
.promise__spark { position: absolute; color: #fff1b8; filter: drop-shadow(0 0 6px rgba(255, 241, 184, .9)); animation: sparkle 3s ease-in-out infinite; }
.promise__spark--1 { width: 26px; height: 26px; left: 9%; top: 40px; }
.promise__spark--2 { width: 18px; height: 18px; left: 16%; bottom: 46px; animation-delay: .8s; }
.promise__spark--3 { width: 24px; height: 24px; right: 10%; top: 46px; animation-delay: 1.6s; }
.promise__spark--4 { width: 16px; height: 16px; right: 17%; bottom: 44px; animation-delay: 2.2s; }
.promise__heart { position: absolute; width: 70px; height: 64px; color: rgba(255, 246, 220, .35); top: 50%; margin-top: -32px; }
.promise__heart--l { left: 3%; transform: rotate(-14deg); }
.promise__heart--r { right: 3%; transform: rotate(14deg); }
@media (max-width: 900px) { .promise__heart { display: none; } }
@media (max-width: 560px) {
  .promise { padding: 56px 0 52px; }
  .promise__line { flex-direction: column; gap: 4px; }
  .promise__part { font-size: 1.7rem; }
  .promise__dot { width: 24px; height: 24px; } .promise__dot svg { width: 18px; height: 18px; }
}
@media (prefers-reduced-motion: reduce) { .promise__bulbs, .promise__part--gold, .promise__dot svg, .promise__spark { animation: none !important; } }
.promise__line { flex-direction: column; gap: 2px; }
.promise__part { font-size: clamp(1.6rem, 3.4vw, 2.5rem); }
.promise__part--gold { font-size: clamp(2.2rem, 5.6vw, 4.2rem); letter-spacing: .1em; padding: 2px 0; }
.promise__dot { height: 26px; }
@media (max-width: 560px) { .promise__spark--1, .promise__spark--3 { top: auto; bottom: 120px; } .promise__spark--1 { left: 5%; } .promise__spark--3 { right: 5%; } }

/* ===== Come and See: next steps ===== */
.come { position: relative; overflow: hidden; padding: 80px 0 90px; color: #fff; text-align: center; background: var(--green-900); }
.come__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .28; }
.come::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20, 54, 38, .9), rgba(20, 54, 38, .75) 50%, rgba(20, 54, 38, .95)); }
.come__inner { position: relative; z-index: 1; }
.come__logo { display: block; width: 120px; height: 120px; margin: 0 auto 10px; filter: drop-shadow(0 12px 20px rgba(0, 0, 0, .5)); }
.come__title { margin: 0; font: 700 clamp(3rem, 7vw, 4.8rem)/1 "Caveat", cursive; color: var(--gold-light); text-shadow: 0 3px 0 rgba(0, 0, 0, .35); }
.come__lead { max-width: 640px; margin: 12px auto 36px; font-size: 1.25rem; line-height: 1.6; color: #f3ead2; }
.come__lead strong { color: #fff; }
.next { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; max-width: 980px; margin: 0 auto; }
.next__card { position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 30px 22px 26px; border-radius: 22px; background: #fff8e8; color: var(--ink-soft); text-decoration: none; box-shadow: 0 20px 34px -18px rgba(0, 0, 0, .7); border-top: 6px solid var(--gold); transition: transform .2s ease, box-shadow .2s ease; }
.next__card:hover, .next__card:focus-visible { transform: translateY(-6px) rotate(-1deg); box-shadow: 0 28px 40px -18px rgba(0, 0, 0, .8); }
.next__icon { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; color: #fff; box-shadow: 0 0 0 4px #fff8e8, 0 0 0 7px var(--gold); }
.next__icon svg { width: 30px; height: 30px; }
.next__icon--green { background: var(--green-600); } .next__icon--gold { background: var(--gold); } .next__icon--red { background: var(--red); }
.next__title { margin-top: 8px; font: 700 1.5rem/1.15 "Fraunces", Georgia, serif; color: var(--green-800); }
.next__text { font-size: 1.02rem; line-height: 1.45; }
.next__go { margin-top: 4px; font: 700 1.4rem/1 "Nunito", sans-serif; color: var(--red); }
@media (max-width: 760px) { .next { grid-template-columns: minmax(0, 1fr); max-width: 440px; } }
@media (prefers-reduced-motion: reduce) { .next__card { transition: none; } }
.come__see { margin: 6px 0 0; font-size: 2.2rem; color: var(--gold-light); }
.come__see svg { width: 30px; height: 28px; vertical-align: middle; color: #ff9a8a; }

/* Hero: natural photo with a soft shadow behind the words */
.hero2__shade { background: linear-gradient(95deg, rgba(20,22,26,.72) 0%, rgba(20,22,26,.5) 38%, rgba(20,22,26,0) 62%) !important; }
.hero2__kicker, .hero2__title { text-shadow: 0 2px 10px rgba(0,0,0,.6); }
@media (max-width: 900px) { .hero2__shade { background: linear-gradient(180deg, rgba(20,22,26,.6), rgba(20,22,26,.45) 60%, rgba(20,22,26,.6)) !important; } }
/* Bigger slideshow photos */
.slides { width: min(470px, 100%); }
.slides__frame { aspect-ratio: 4 / 4.3; }
@media (max-width: 900px) { .slides { width: min(380px, 100%); } }