/* APHA Section Library. Owns section-level classes only. Shortcode classes (.apha-buy, .apha-tiers, .apha-progress) belong to apha-raffle-helpers and must not be styled from here. */ .apha-chips{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 4px;} .apha-chip{display:inline-block;font-family:Figtree,sans-serif;font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;line-height:1;color:#E8E0CF;border:1px solid rgba(232,224,207,0.28);border-radius:999px;padding:8px 14px;white-space:nowrap;} .apha-chip--price{background:#BA8900;border-color:#BA8900;color:#0F1420;font-weight:800;} @media (max-width:480px){.apha-chip{font-size:11px;letter-spacing:0.8px;padding:6px 10px;}} .apha-defs{list-style:none;margin:0;padding:0;} .apha-defs li{margin:0;padding:14px 0;border-bottom:1px solid #D9CFB3;line-height:1.6;} .apha-defs li:last-child{border-bottom:none;padding-bottom:0;} .apha-defs li strong{color:#1A1F2E;font-weight:800;} .apha-defs--dark li{border-bottom-color:#3A3F4D;} .apha-defs--dark li strong{color:#FAF6EC;} .apha-defs--num{counter-reset:apha-def;} .apha-defs--num li{counter-increment:apha-def;position:relative;padding-left:44px;} .apha-defs--num li::before{content:counter(apha-def);position:absolute;left:0;top:12px;width:28px;height:28px;border-radius:999px;background:rgba(186,137,0,0.12);border:1px solid rgba(186,137,0,0.45);color:#BA8900;font-family:Figtree,sans-serif;font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center;} /* position:sticky dies under any clipping ancestor. This is defensive only. */ .apha-split,.apha-split > .e-con-inner{overflow:visible;} .apha-split .apha-railcol{align-self:flex-start;} /* Sticky purchase rail. It has to be `top`. A bottom anchor only drags an element UP into view from below; it cannot hold one that is scrolling away upward, which is exactly what a rail parked at the head of a long article does. No max-height and no inner overflow: capping the card put "Purchase Tickets" inside a nested scroll region nobody finds. The offset is deliberately small (the header is not fixed, so nothing needs clearing) which buys enough room for the CTA to clear a 768px laptop. Only the fine print below it, the permit line and the drawing note, can fall under the fold on the shortest screens. */ @media (min-width:1025px){ .apha-split .apha-railcol{position:sticky;top:24px;bottom:auto;} .apha-split .apha-railcol--static{position:static;} } @media (max-width:1024px){.apha-split .apha-railcol{order:-1;}} /* Hero card buttons are hidden on desktop because on a raffle page the sticky purchase rail is already in view there, and a second "buy" button above it just competes with itself. A hero card WITHOUT a rail below it (the banquet page) has nothing in view to compete with, and hiding its only call to action on the widest screens is simply a missing button — hence the modifier. */ @media (min-width:1025px){.apha-hero__cta:not(.apha-hero__cta--always){display:none !important;}} /* A contact form stretched across a 1140px band gives you a very wide, very shallow textarea and fields nobody's eye can track from label to input. Cap it and centre it; on phones the cap is above the viewport so it is inert. */ .apha-formcard{max-width:820px;margin-left:auto;margin-right:auto;width:100%;} /* background-attachment:fixed is ignored on iOS and most touch browsers, which then scale the image to the viewport and crop it hard. Opt those back out. */ @media (hover:none) and (pointer:coarse){ .apha-parallax{background-attachment:scroll !important;} } /* ============================================================ * Cutout carousel (.apha-cw) * * Built for transparent PNG product cutouts. Three effects depend on the alpha * channel and all three only read on a dark ground: the gold glow behind the * stage, a drop-shadow filter that traces the product silhouette (a rectangular * JPEG would cast a visible box instead), and a separate elliptical ground * shadow. Swap in an opaque image and the whole thing falls apart. * ============================================================ */ .apha-cw{--cw-gold:#BA8900;--cw-cream:#FAF6EC;--cw-mute:#9A9683; position:relative;font-family:Figtree,sans-serif; /* Contains the glow. A fixed 760px circle centred on a 390px phone hangs ~370px off each edge and drags the whole page into horizontal scroll. */ overflow:hidden;} .apha-cw__glow{position:absolute;left:50%;top:38%;width:min(760px,100%);aspect-ratio:1; transform:translate(-50%,-50%);pointer-events:none; background:radial-gradient(circle,rgba(186,137,0,0.22) 0%,rgba(186,137,0,0) 68%);} /* Arrows flank the image viewport and are centred by flex. The original pinned them with top:calc(50% - 34px), a number tuned to one caption's height, so any caption that wrapped to another line pushed them off centre. */ .apha-cw__row{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;} .apha-cw__viewport{position:relative;flex:1 1 auto;max-width:1080px; height:clamp(240px,38vw,400px);} .apha-cw__slide{position:absolute;inset:0;margin:0;display:flex;align-items:center;justify-content:center; opacity:0;visibility:hidden;transform:scale(.965); transition:opacity .55s ease,transform .55s ease,visibility 0s linear .55s;} .apha-cw__slide.is-active{opacity:1;visibility:visible;transform:scale(1); transition:opacity .55s ease,transform .55s ease,visibility 0s linear 0s;} .apha-cw__slide img{max-height:100%;max-width:100%;width:auto;height:auto;object-fit:contain; filter:drop-shadow(0 26px 38px rgba(0,0,0,.62));} .apha-cw__shadow{position:absolute;left:50%;bottom:6%;width:52%;height:26px;transform:translateX(-50%); background:radial-gradient(ellipse,rgba(0,0,0,.55) 0%,rgba(0,0,0,0) 70%);pointer-events:none;} .apha-cw__nav{flex:0 0 auto;width:46px;height:46px;display:inline-flex;align-items:center;justify-content:center; border:1px solid rgba(186,137,0,.55);border-radius:50%;background:transparent;color:var(--cw-gold); cursor:pointer;padding:0;transition:background .2s ease,border-color .2s ease;} .apha-cw__nav:hover{background:rgba(186,137,0,.14);border-color:var(--cw-gold);} .apha-cw__nav:focus-visible{outline:2px solid var(--cw-gold);outline-offset:3px;} .apha-cw__nav svg{width:20px;height:20px;} /* Captions crossfade in their own stacked box, so their height never moves the image or the arrows. min-height reserves room for the tallest of them. */ .apha-cw__caps{position:relative;min-height:112px;margin-top:22px;} .apha-cw__cap{position:absolute;inset:0;text-align:center;opacity:0;visibility:hidden; transition:opacity .55s ease,visibility 0s linear .55s;} .apha-cw__cap.is-active{opacity:1;visibility:visible;transition:opacity .55s ease,visibility 0s linear 0s;} .apha-cw__eyebrow{margin:0 0 6px;font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--cw-gold);} .apha-cw__title{margin:0 0 6px;font-family:Cardo,serif;font-size:26px;line-height:1.2;color:var(--cw-cream);} .apha-cw__sub{margin:0;font-size:15px;line-height:1.55;color:var(--cw-mute);max-width:620px;margin-inline:auto;} .apha-cw__dots{display:flex;justify-content:center;gap:10px;margin-top:20px;padding:0;list-style:none;} .apha-cw__dot{width:9px;height:9px;padding:0;border:0;border-radius:50%;background:rgba(250,246,236,.28);cursor:pointer; transition:background .2s ease,transform .2s ease;} .apha-cw__dot.is-on{background:var(--cw-gold);transform:scale(1.25);} .apha-cw__dot:focus-visible{outline:2px solid var(--cw-gold);outline-offset:3px;} .apha-cw__live{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden; clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;} @media (max-width:600px){ .apha-cw__nav{width:40px;height:40px;} .apha-cw__title{font-size:22px;} .apha-cw__caps{min-height:132px;} } @media (prefers-reduced-motion:reduce){ .apha-cw__slide,.apha-cw__slide.is-active,.apha-cw__cap,.apha-cw__cap.is-active{ transform:none;transition-duration:.01s;} } /* The theme and the Elementor kit both style bare