/* ============================================================
   HORIZONS 2026 — SPLASH DEV TOOLS CSS (parser-safe build)
   No CSS custom properties — Splash's validator rejects them.
   Palette reference:
     Cherry #EE164F · Orange #FAA32B · Wine #60032A
     Wine-deep #3D001A · Cream #FDF6EB · Sand #F7E7CE · Ink #1C0510
     Gradient: linear-gradient(120deg,#FAA32B,#EE164F 55%,#B0093C)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Domine:wght@400;500;600;700&family=Space+Mono:ital,wght@0,400;0,700&display=swap');

/* ---------- GLOBAL RESET ----------
   Zero Splash's default block padding (removes leftover iframe/block gutters).
   Kept blanket per the working layout. */
.grp{padding:0;}

/* ---------- SECTION DIVIDERS (hairline rules, like the nav) ----------
   Apply to a section block:
     hz-rule        -> hairline top + bottom (cream — for DARK sections)
     hz-rule-top    -> top only
     hz-rule-bottom -> bottom only
     hz-rule-dark   -> ink hairline variant (for LIGHT sections: agenda/FAQ)
   Matches the nav's 1px translucent stroke. */
.hz-rule{border-top:1px solid rgba(253,246,235,.12)!important;border-bottom:1px solid rgba(253,246,235,.12)!important}
.hz-rule-top{border-top:1px solid rgba(253,246,235,.12)!important}
.hz-rule-bottom{border-bottom:1px solid rgba(253,246,235,.12)!important}
.hz-rule-dark{border-top:1px solid rgba(28,5,16,.14)!important;border-bottom:1px solid rgba(28,5,16,.14)!important}
.hz-rule-dark.hz-rule-top, .hz-rule-dark .hz-rule-top{border-bottom:0!important}

/* SCROLLER / overview gap. The awkward gap is the SCROLLER block's own top
   padding — #g-855285701 (the hz-bleed ticker band) ships with padding-top:4rem
   (padding-bottom is already 0). Trim it to pull the scroller — and the
   overview's hz-rule border-top that sits right below it — up tight.
   /!\ AUTO-ID — re-grab from dev tools if the block is rebuilt.
   KNOB: lower toward 0 for tighter, raise back toward 4rem for looser. If the
   scroller ever tucks UNDER the nav, you've gone too low — nudge it back up. */
#g-855285701{padding-top:1.5rem!important}

/* ---------- GLOBAL ATMOSPHERE ---------- */
body::after{
  content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;pointer-events:none;
  opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
::selection{background:#FAA32B;color:#60032A}

/* Paint the page BASE wine. iOS fills the status-bar / Dynamic Island strip
   from the page background (we can't set viewport-fit=cover from the CSS box,
   so we can't paint a fixed element up there) — making the base wine lets
   that strip read as a continuous extension of the nav fill, so the colour
   runs to the very top while the nav itself stays put below the island.
   Every section has its own solid background, so this only shows in the
   safe-area strip and any overscroll. */
html, body{background-color:#3D001A!important}

.splash-footer,#splash-footer{display:none!important}

/* ---------- TYPE SYSTEM ---------- */
.hz-display, .hz-display *{
  font-family:'Archivo Black',sans-serif!important;
  text-transform:uppercase!important;
  line-height:.85!important;letter-spacing:.01em!important;
}
.hz-display-xl, .hz-display-xl *{font-size:clamp(54px,11vw,150px)!important}
.hz-display-lg, .hz-display-lg *{font-size:clamp(38px,6.5vw,96px)!important}
.hz-display-md, .hz-display-md *{font-size:clamp(30px,4.5vw,64px)!important}

.hz-slab, .hz-slab *{font-family:'Domine',serif!important}
.hz-slab-light, .hz-slab-light *{font-family:'Domine',serif!important;font-weight:400!important;line-height:1.3!important}

/* LEDE / big statement paragraph (the overview "Technology in one immersive
   day…" block). Splash applies ONE font size that doesn't shrink on phones,
   so on mobile it blows up to ~55px+ per word. clamp() makes it fluid — we
   can't use media queries in Splash, so this is how we go responsive. Tag the
   overview paragraph block hz-lede. KNOBS: min(phone) / vw(scale) / max(desktop). */
.hz-lede, .hz-lede *{
  font-size:clamp(23px,3.4vw,40px)!important;
  line-height:1.3!important;
}
/* OVERVIEW block, targeted by its real ID (the hz-lede class never reached the
   bare <p> Splash buries inside #element-custom-block -> #sfid -> .body.grp.p0).
   Two IDs stacked = high enough specificity to beat Splash's own font sizing.
   /!\ AUTO-ID (block #3876936261) — if you rebuild/duplicate this block the
   number changes; re-grab it from dev tools and swap below. KNOBS: same as
   hz-lede; raise the 44px max if desktop looks smaller than before. */
#element-custom-block-3876936261 #sfid-3876936261 p,
#element-custom-block-3876936261 #sfid-3876936261 .hz-grad-word{
  font-size:clamp(24px,3.6vw,44px)!important;
  line-height:1.25!important;
}

.hz-mono, .hz-mono *{
  font-family:'Space Mono',monospace!important;font-size:12px!important;
  letter-spacing:.3em!important;text-transform:uppercase!important;
}

.hz-stroke, .hz-stroke *{
  color:transparent!important;
  -webkit-text-stroke:2px #FDF6EB;
}
.hz-stroke-dark, .hz-stroke-dark *{
  color:transparent!important;
  -webkit-text-stroke:2px #3D001A;
}

.hz-grad-text, .hz-grad-text *{
  background:linear-gradient(120deg,#FAA32B,#EE164F 55%,#B0093C);
  -webkit-background-clip:text;background-clip:text;
  color:transparent!important;
}

/* gradient-fill individual words: wrap phrase in <span class="hz-grad-word">…</span>
   NOTE: previously used background-attachment:fixed to make multiple words read
   as ONE continuous sweep — but iOS Safari ignores fixed attachment, so on
   mobile the gradient mapped to viewport position (words drifted orange->cherry
   as you scrolled). Now each WRAPPED LINE carries its own full gradient via
   box-decoration-break:clone — consistent on every device. */
.hz-grad-word{
  background-image:linear-gradient(120deg,#FAA32B,#EE164F 55%,#B0093C)!important;
  -webkit-box-decoration-break:clone!important;box-decoration-break:clone!important;
  background-attachment:scroll!important;background-size:100% 100%!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;color:transparent!important;
  font-style:normal!important;
}

.hz-room-no, .hz-room-no *{
  font-family:'Space Mono',monospace!important;font-size:11px!important;
  letter-spacing:.3em!important;text-transform:uppercase!important;
  color:#FAA32B!important;
}
.hz-room-no{
  display:inline-block;border:1px solid #FAA32B;
  border-radius:30px;padding:7px 16px;
}
.hz-room-no--cherry, .hz-room-no--cherry *{color:#EE164F!important}
.hz-room-no--cherry{border-color:#EE164F}

/* ---------- SECTION SKINS ---------- */
.hz-bg-deep{background:#3D001A!important;color:#FDF6EB}
.hz-bg-wine{background:#60032A!important;color:#FDF6EB}
.hz-bg-cream{background:#FDF6EB!important;color:#1C0510}
.hz-bg-sand{background:#F7E7CE!important;color:#1C0510}
.hz-bg-grad{background:linear-gradient(120deg,#FAA32B,#EE164F 55%,#B0093C)!important;color:#3D001A}
.hz-bg-ink{background:#1C0510!important;color:#FDF6EB}

/* ---------- VENUE TEXT PANEL ----------
   Tag the LEFT text block hz-venue-panel to turn it into a rounded card that
   pairs with the map's framed card. Lighter wine than a #3D001A section, a thin
   accent, and comfy padding so the copy doesn't sit flat on the section.
   Tint options (swap the background line):
     • lighter wine (default) : #60032A
     • deep ink panel         : #2A0512
     • warm gradient wash      : linear-gradient(160deg,#63042C,#3D001A)
   The left accent bar is the sunset gradient; delete the ::before rule to drop it. */
.hz-venue-panel{
  background:#60032A!important;
  border:1px solid rgba(253,246,235,.14)!important;
  border-radius:16px!important;
  padding:clamp(24px,3.5vw,44px)!important;
  position:relative!important;overflow:hidden!important;
}
.hz-venue-panel::before{
  content:""!important;position:absolute!important;left:0;top:0;bottom:0;width:5px;
  background:linear-gradient(180deg,#FAA32B,#EE164F 55%,#B0093C)!important;
}

/* ---------- LINKS (e.g. contact email) ----------
   Cream neutral, sunset-orange on hover. Targets mailto links by href so no
   tagging is needed and it won't touch nav / Register links. To scope to a
   single block instead, tag that block hz-contact and use .hz-contact a. */
a[href^="mailto:"]{
  color:#FDF6EB!important;
  text-decoration:underline!important;
  text-underline-offset:3px!important;
  text-decoration-thickness:1px!important;
  transition:color .2s ease!important;
}
a[href^="mailto:"]:hover,
a[href^="mailto:"]:focus{color:#FAA32B!important}

/* kill any block/element background (e.g. white nav-link pill) */
.hz-transparent, .hz-transparent *{background:transparent!important;background-color:transparent!important}

/* full-bleed: span the viewport even inside Splash's centered .grp container.
   Apply hz-bleed to the iframe's block AND its parent block if a gutter remains. */
.hz-bleed{
  width:100vw!important;max-width:100vw!important;
  margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;
  padding:0!important;
}
.hz-bleed.grp{padding:0!important}
.hz-bleed iframe{width:100%!important;display:block!important;border:0!important}

/* ---------- FIXED HERO (video pins to the viewport; page scrolls over it) ----------
   Tag the HERO iframe's block ............ hz-fixed
   Tag the FIRST block AFTER the hero ..... hz-after-fixed
   The hero pins at z-index 0; everything after scrolls up over it. Every
   section after the hero needs a SOLID background (ticker/agenda already
   are) so the pinned hero can't show through the gaps.
   NOTE: depends on your block nesting — if a gutter or overlap remains,
   also add hz-fixed to the hero block's immediate parent. */
.hz-fixed{
  position:fixed!important;top:0;left:0;
  width:100vw!important;height:100vh!important;
  z-index:0!important;overflow:hidden!important;margin:0!important;
}
.hz-fixed iframe{height:100vh!important}
/* no margin-top: Splash keeps the hero's height reserved even when fixed,
   so this class only needs to lift the following content above the pinned
   hero. If a LATER section ever disappears behind the hero, add this class
   (or just position:relative;z-index:2) to it too. */
.hz-after-fixed{position:relative!important;z-index:2!important}

/* ---------- HERO ---------- */
.hz-hero{
  position:relative;overflow:hidden;
  background:radial-gradient(125% 92% at 50% 120%, #B0093C 0%, #60032A 42%, #3D001A 76%)!important;
  color:#FDF6EB;
  min-height:92vh;display:flex;flex-direction:column;justify-content:center;
}
/* rough HORIZON sun — peeks up from the bottom with a hand-drawn edge.
   KNOB: background-size height (52vh) = how far the dome peeks up the fold. */
.hz-hero::before{
  content:"";position:absolute;left:0;right:0;bottom:0;height:64vh;z-index:0;pointer-events:none;
  background:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA3MSAzNyc+PHBhdGggZD0nTTQyLjkyMjIgMC45MjkyMzRDNDAuNDE1NCAwLjM2MDEwMiAzNy44MTQxIDAuMDYyMjE4NCAzNS4xMzQxIDAuMDYyMjA2MUMzMi40NTEzIDAuMDYyMjMwMiAzMC42MjU0IC0wLjIwMDU1NyAyOC4xMzcgMC4zNTM5NTRMMjQuOTE2MyAwLjkyOTc5NEM5LjQ0NDk1IDQuMzg3NzQgMC40NTg2OTYgMTguMDY0MyAtMC4wMDA5OTMwNTQgMzQuODcxMlYzNC44NzUxQy0wLjAyMDAxNjIgMzUuNjk3NyAwLjY1NzMzOSAzNi4zNTQzIDEuNDgwMjIgMzYuMzU0M0g2Ny45ODI1QzY5LjE5NjkgMzYuMzU0MyA3MC4xNzk5IDM1LjM3NzggNzAuMTUxNyAzNC4xNjM4TDcwLjE1MTIgMzQuMTU5OVYzMS4zMjJDNjguMDIzOCAxNS4yMTg3IDU4LjI1MTIgNC4zNTc0OCA0Mi45MjI0IDAuOTI5ODY5QzQyLjkyMjMgMC45Mjk4MzcgNDIuOTIyMiAwLjkyOTY1NiA0Mi45MjIzIDAuOTI5NTUxQzQyLjkyMjQgMC45Mjk0NDYgNDIuOTIyNCAwLjkyOTI2NyA0Mi45MjIyIDAuOTI5MjM0WicgZmlsbD0ndXJsKCNnKScvPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0nZycgeDE9JzM1LjA3ODcnIHkxPSczNi4zNTQzJyB4Mj0nMzUuMDc4NycgeTI9JzAnIGdyYWRpZW50VW5pdHM9J3VzZXJTcGFjZU9uVXNlJz48c3RvcCBzdG9wLWNvbG9yPScjRkZBMzJCJy8+PHN0b3Agb2Zmc2V0PScwLjc1JyBzdG9wLWNvbG9yPScjRUUxNjRGJy8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PC9zdmc+") no-repeat center bottom;
  background-size:auto 52vh;
  filter:drop-shadow(0 -6px 70px rgba(238,22,79,.45));
  transform:translateY(36%);
  animation:hz-sunrise 1.7s cubic-bezier(.16,1,.3,1) .2s forwards, hz-glow 9s ease-in-out 1.9s infinite;
}
/* hand-drawn pulse ripple rising from the horizon line */
.hz-hero::after{
  content:"";position:absolute;left:50%;bottom:0;width:130vmin;height:62vmin;z-index:0;pointer-events:none;
  transform:translateX(-50%) scale(.62);transform-origin:50% 100%;
  background:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyMDAgOTInPjxkZWZzPjxmaWx0ZXIgaWQ9J3InIHg9Jy0xNSUnIHk9Jy0yNSUnIHdpZHRoPScxMzAlJyBoZWlnaHQ9JzE1MCUnPjxmZVR1cmJ1bGVuY2UgdHlwZT0nZnJhY3RhbE5vaXNlJyBiYXNlRnJlcXVlbmN5PScwLjAyMicgbnVtT2N0YXZlcz0nMicgc2VlZD0nNCcgcmVzdWx0PSduJy8+PGZlRGlzcGxhY2VtZW50TWFwIGluPSdTb3VyY2VHcmFwaGljJyBpbjI9J24nIHNjYWxlPSc2Jy8+PC9maWx0ZXI+PC9kZWZzPjxwYXRoIGQ9J004LDg4IEM0NCwyNCA3MiwxMCAxMDAsMTAgQzEyOCwxMCAxNTYsMjQgMTkyLDg4JyBmaWxsPSdub25lJyBzdHJva2U9JyNGREY2RUInIHN0cm9rZS13aWR0aD0nMi4yJyBzdHJva2UtbGluZWNhcD0ncm91bmQnIGZpbHRlcj0ndXJsKCNyKScvPjwvc3ZnPg==") no-repeat center bottom;
  background-size:contain;opacity:0;
  animation:hz-pulse 6s ease-out infinite 1.6s;
}
.hz-hero > *{position:relative;z-index:2}
@keyframes hz-sunrise{
  to{transform:translateY(0)}
}
@keyframes hz-pulse{
  0%{transform:translateX(-50%) scale(.62);opacity:.5}
  100%{transform:translateX(-50%) scale(1.5);opacity:0}
}
/* ambient: sunset gently shifts warmer and back, glow breathes */
@keyframes hz-glow{
  0%,100%{filter:drop-shadow(0 -6px 70px rgba(238,22,79,.45)) hue-rotate(0deg) saturate(1) brightness(1)}
  50%{filter:drop-shadow(0 -8px 96px rgba(250,163,43,.5)) hue-rotate(-9deg) saturate(1.08) brightness(1.05)}
}

.hz-hero-title{overflow:hidden}
.hz-hero-title, .hz-hero-title *{
  font-family:'Archivo Black',sans-serif!important;text-transform:uppercase!important;
  font-size:clamp(44px,9vw,128px)!important;line-height:.9!important;overflow-wrap:break-word!important;
  color:#FDF6EB!important;text-align:center!important;
}
.hz-hero-title *{
  display:inline-block;
  animation:hz-riseup 1s cubic-bezier(.16,1,.3,1) .5s both;
}
@keyframes hz-riseup{
  from{transform:translateY(110%) rotate(4deg);opacity:0}
  to{transform:translateY(0) rotate(0deg);opacity:1}
}

.hz-chips *{
  font-family:'Space Mono',monospace!important;font-size:12px!important;
  letter-spacing:.18em!important;text-transform:uppercase!important;
}
.hz-chip{
  display:inline-block;border:1px solid rgba(253,246,235,.35);
  border-radius:40px;padding:9px 18px;margin:4px;
}

/* ---------- HERO EVENT INFO (stacked Date / Time / Venue) ----------
   Container -> hz-eventinfo
   Each of the 3 chunks -> hz-meta + a stagger class (hz-d1 / hz-d2 / hz-d3)
     Date  : hz-meta hz-d1
     Time  : hz-meta hz-d2
     Venue : hz-meta hz-d3
   Gotham Bold, uppercase, kerned, sunset dot above each, staggered fade-up. */
.hz-eventinfo{
  display:flex!important;flex-direction:column!important;align-items:center!important;
  gap:18px!important;text-align:center!important;
}
.hz-meta, .hz-meta *{
  font-family:'Gotham Bold','Gotham','Helvetica Neue',Arial,sans-serif!important;
  font-weight:700!important;text-transform:uppercase!important;letter-spacing:.08em!important;
  font-size:clamp(13px,1.5vw,17px)!important;line-height:1.25!important;color:#FDF6EB!important;
}
.hz-meta{
  position:relative!important;padding-top:20px!important;text-align:center!important;
  opacity:0;transform:translateY(18px);
  animation:hz-metaup .85s cubic-bezier(.16,1,.3,1) forwards;
}
/* sunset gradient dot above each line */
.hz-meta::before{
  content:""!important;position:absolute!important;top:0;left:50%;transform:translateX(-50%);
  width:9px;height:9px;border-radius:50%;
  background:linear-gradient(120deg,#FAA32B,#EE164F 60%,#B0093C);
}
/* staggered entrance (separate classes survive Splash's per-block nesting) */
.hz-d1{animation-delay:.7s!important}
.hz-d2{animation-delay:.88s!important}
.hz-d3{animation-delay:1.06s!important}
@keyframes hz-metaup{to{opacity:1;transform:translateY(0)}}

/* ---------- TICKER ---------- */
.hz-ticker{
  background:#FDF6EB!important;color:#60032A;
  overflow:hidden!important;
  transform:rotate(-1.6deg) scale(1.04);
  border-top:3px solid #60032A;border-bottom:3px solid #60032A;
  padding:0!important;position:relative;z-index:5;
}
.hz-ticker *{
  font-family:'Archivo Black',sans-serif!important;text-transform:uppercase!important;
  font-size:clamp(22px,3.2vw,38px)!important;letter-spacing:.03em!important;
  white-space:nowrap!important;
}
.hz-ticker > div, .hz-ticker p{
  display:inline-block;
  padding:14px 0;
  animation:hz-tick 26s linear infinite;
}
@keyframes hz-tick{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}

/* ---------- AGENDA CARDS ---------- */
.hz-card{
  background:#FDF6EB!important;color:#1C0510;
  border:2px solid #1C0510!important;border-radius:26px!important;
  box-shadow:10px 10px 0 #1C0510!important;
  padding:34px 30px!important;
  transition:transform .3s cubic-bezier(.16,1,.3,1)!important;
}
.hz-card:hover{transform:translateY(-10px) rotate(-.6deg)}
.hz-card--break{
  background:linear-gradient(120deg,#FAA32B,#EE164F 55%,#B0093C)!important;color:#FDF6EB!important;
  border-color:#60032A!important;
  box-shadow:10px 10px 0 #60032A!important;
}
.hz-card-time, .hz-card-time *{
  font-family:'Space Mono',monospace!important;font-weight:700!important;
  font-size:15px!important;letter-spacing:.06em!important;
}

.hz-row{
  border-bottom:1px solid rgba(28,5,16,.18);
  transition:padding-left .25s,background .25s;
  padding:18px 6px!important;
}
.hz-row:hover{padding-left:20px!important;background:rgba(238,22,79,.05)}

/* ---------- SPEAKER PLINTHS ---------- */
.hz-plinth{transition:transform .45s cubic-bezier(.16,1,.3,1)}
.hz-plinth:hover{transform:translateY(-14px)}
.hz-plinth-img, .hz-plinth-img img{
  border-radius:160px 160px 22px 22px!important;
  overflow:hidden!important;
  filter:grayscale(1) contrast(1.05);
}
.hz-plinth-img{position:relative;background:linear-gradient(180deg,#2A0A18,#400A22)}
.hz-plinth-img::before{
  content:"";position:absolute;bottom:0;left:50%;
  width:86%;height:0;padding-bottom:43%;
  transform:translateX(-50%);
  border-radius:50% 50% 0 0 / 100% 100% 0 0;
  background:linear-gradient(120deg,#FAA32B,#EE164F 55%,#B0093C);
  z-index:0;
}
.hz-plinth-img img{position:relative;z-index:1;mix-blend-mode:luminosity}
/* speaker stagger (desktop look; clear these on mobile in Splash if needed) */
.hz-plinth--1{margin-bottom:9vh!important}
.hz-plinth--3{margin-bottom:14vh!important}
.hz-plinth--4{margin-bottom:4vh!important}
.hz-plinth-role, .hz-plinth-role *{
  font-family:'Space Mono',monospace!important;font-size:10.5px!important;
  letter-spacing:.22em!important;text-transform:uppercase!important;
  color:#FAA32B!important;
}

.hz-ghost{position:relative;overflow:hidden}
.hz-ghost::before{
  content:"HORIZONS";position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%);
  font-family:'Archivo Black',sans-serif;font-size:30vw;white-space:nowrap;
  color:transparent;-webkit-text-stroke:1px rgba(253,246,235,.07);
  pointer-events:none;z-index:0;
}
.hz-ghost > *{position:relative;z-index:1}

/* ---------- FAQ (card treatment — matches the agenda) ----------
   Structure in Splash (Properties -> Custom Classes):
     • Each Q+A item wrapper block .... hz-faq-card   (the card)
     • Question text block ............ hz-faq-q       (Archivo, all-caps)
     • Answer text block .............. hz-faq-a       (Domine)
   hz-faq-card both STYLES the card AND zeroes Splash's match-height
   min-height (so you can stop fighting the "Match children height"
   toggle — !important beats Splash's inline value whether it's on or off).
   If a PARENT column still shows an inline min-height in dev tools,
   add the utility class  hz-faq-fit  to that parent (no visual change). */
.hz-faq-card, .hz-faq-card.hz-faq-card{
  min-height:0!important;height:auto!important;     /* hug content; beats inline match-height */
  background:#FDF6EB!important;                      /* lighter tan than the sand section */
  border-radius:16px!important;
  padding:26px 30px!important;
  margin-bottom:18px!important;                      /* uniform gap between cards — make the
                                                        card own its spacing so it can't vary
                                                        block-to-block. Remove any manual blank
                                                        spacer blocks between FAQs in Splash so
                                                        this is the SINGLE source of the gap. */
  transition:transform .175s cubic-bezier(.16,1,.3,1)!important;
}
.hz-faq-card:hover{transform:translateY(-4px)}
/* utility: drop on any stubborn match-height parent to zero its min-height */
.hz-faq-fit, .hz-faq-fit.hz-faq-fit{min-height:0!important;height:auto!important}

.hz-faq-q, .hz-faq-q *{
  font-family:'Archivo Black',sans-serif!important;font-weight:400!important;
  text-transform:uppercase!important;letter-spacing:.01em!important;
  font-size:clamp(1.1rem,1.7vw,1.5rem)!important;line-height:1.05!important;
  color:#1C0510!important;
}
.hz-faq-q{
  border-top:0!important;                            /* card replaces the old hairline */
  padding:0 42px 12px 0!important;                   /* right pad clears the sun marker */
  position:relative;cursor:default;
}
/* decorative half-sun marker, aligned to the question's first line */
.hz-faq-q::after{
  content:"";position:absolute;right:0;top:3px;
  width:26px;height:13px;border-radius:26px 26px 0 0;
  background:linear-gradient(120deg,#FAA32B,#EE164F 55%,#B0093C);
  pointer-events:none;
}
/* answer block — doubled class + descendant targeting to outrank Splash ID rules */
.hz-faq-a, .hz-faq-a.hz-faq-a,
.hz-faq-a *, .hz-faq-a.grp *, .hz-faq-a .list-item, .hz-faq-a p, .hz-faq-a span, .hz-faq-a div{
  font-family:'Domine',serif!important;font-weight:400!important;
  font-size:clamp(14px,1.25vw,16px)!important;line-height:1.55!important;
  color:#4a3540!important;background:transparent!important;
}
.hz-faq-a{padding:0!important;max-width:68ch!important}

/* ---------- BUTTONS ---------- */
.hz-btn, .hz-btn *{
  font-family:'Space Mono',monospace!important;font-weight:700!important;
  font-size:14px!important;letter-spacing:.12em!important;text-transform:uppercase!important;
}
.hz-btn{
  background:linear-gradient(120deg,#FAA32B,#EE164F 55%,#B0093C)!important;color:#fff!important;
  border:none!important;border-radius:60px!important;
  padding:20px 42px!important;
  box-shadow:0 12px 34px rgba(238,22,79,.4)!important;
  transition:transform .25s,box-shadow .25s!important;
}
.hz-btn:hover{
  transform:translateY(-4px) scale(1.02);
  box-shadow:0 20px 48px rgba(238,22,79,.55)!important;
}
.hz-btn--dark{
  background:#3D001A!important;
  box-shadow:0 12px 34px rgba(61,0,26,.45)!important;
}

/* ---------- FINALE ---------- */
.hz-finale{
  background:linear-gradient(120deg,#FAA32B,#EE164F 55%,#B0093C)!important;color:#3D001A;
  position:relative;overflow:hidden;
  padding-bottom:30vh!important;
}
.hz-finale::after{
  content:"";position:absolute;bottom:-1px;left:50%;
  width:120vmin;height:0;padding-bottom:60vmin;
  transform:translateX(-50%);
  border-radius:50% 50% 0 0 / 100% 100% 0 0;
  background:#3D001A;
}

/* ============================================================
   HORIZONS — NAV RESTYLE (layout-safe)
   Styles the nav PIECES only — does NOT touch the bar's layout or
   positioning, so it can't collapse or mis-stick the Splash nav.

   Apply via Properties -> Custom Classes:
     • Nav container / row ............ hz-nav        (the only tag needed)
     • Brand / logo text .............. hz-nav-brand  (if separately taggable)
     • Brand suffix (optional) ........ hz-nav-by
   The links are a single Splash "children" selection with NO Custom Class
   field, so they are styled WITHOUT custom classes: link styling targets
   Splash's own .nav-item-link, and Register is targeted by its #rsvp href.
   Just tag the container hz-nav and the links + Register button style
   themselves. Links: Event · Highlights · Agenda · FAQs · Venue · Register
   ============================================================ */

/* ---------- NAV VERTICAL CENTERING (Splash AUTO-ID fix) ----------
   The nav DOESN'T center its row: the outer bar (#g-454995803) is ~98px tall
   with display:block, and the inner row (#g-252182976) is inline-block + float,
   so logo (~36px) and links (~66px) sit at the TOP, not centered. Flexing both
   the outer bar AND the inner row puts logo + links + the 54px Register button
   on one shared centerline.

   /!\ THESE ARE SPLASH AUTO-GENERATED IDs. They are stable for THIS nav, but if
   you rebuild / duplicate / re-add the nav block, Splash mints new g-IDs and
   this stops working — re-grab the four IDs from dev tools and swap them here.
   (Everything else in this file is class-based and ID-independent; only this
   block is tied to live IDs.) */
#g-454995803{display:flex!important;align-items:center!important}                       /* outer bar: center the row in its 98px height */
#g-252182976{display:flex!important;align-items:center!important;width:100%!important}   /* inner row: logo & links share one centerline, keep full width */
#g-248888857{float:none!important}                                                      /* logo: drop float (flex handles layout) */
#g-44297453{float:none!important;margin-left:auto!important;padding-top:0!important}     /* links group: drop float, push right, kill the manual top offset */
/* If the links DON'T move right after floats are gone, delete margin-left:auto
   above and instead give the inner row spacing:
       #g-252182976{justify-content:space-between!important}
   If display:flex doesn't take at all (specificity tie with Splash), prefix
   the outer rule with body:  body #g-454995803{display:flex!important;...} */

/* nav items sit on ONE centerline: Splash floats each .nav-item, so they
   top-align inside the row — and the taller 54px Register button then makes
   the shorter text links ride high. Drop the float and middle-align them.
   Class-based (no g-ID), so this survives even if the IDs above change. */
.hz-nav .nav-item{
  float:none!important;display:inline-block!important;vertical-align:middle!important;
}

/* bar stays transparent (kills Splash's own nav fill). The scroll-fill is
   painted on ::before so we never have to un-!important the background. */
.hz-nav{
  background:transparent!important;
  border-bottom:0!important;
  isolation:isolate;            /* contains the ::before scrim behind the links */
}
/* ---------- NAV FILL ON SCROLL (no JS) ----------
   Transparent at the very top (clean over the hero), then a wine fill fades
   in over the first ~160px of scroll so the cream links stay legible over
   content. Uses a scroll-driven animation — works in Chromium + recent
   Safari; where unsupported (older browsers / Firefox) it simply stays
   transparent, i.e. exactly today's behaviour, so it degrades safely.
   NOTE: assumes the page scrolls the document. If the fill never appears,
   your layout scrolls an inner container — change scroll(root) to scroll(). */
.hz-nav::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:rgba(61,0,26,.92);opacity:0;
  animation:hz-nav-scrim linear both;
  animation-timeline:scroll(root);
  animation-range:0 160px;
}
@keyframes hz-nav-scrim{to{opacity:1}}

.hz-nav-brand, .hz-nav-brand *{
  font-family:'Archivo Black',sans-serif!important;
  text-transform:uppercase!important;letter-spacing:.06em!important;
  font-size:19px!important;line-height:1!important;color:#FDF6EB!important;
}
.hz-nav-by, .hz-nav-by *{
  font-family:'Space Mono',monospace!important;
  font-size:10px!important;letter-spacing:.28em!important;text-transform:uppercase!important;
  color:#FAA32B!important;
}

/* ---------- NAV LINKS (no per-link custom class — Splash groups them) ----------
   Splash exposes the links only as one "children" selection with no Custom
   Class field, so we target Splash's OWN per-link class (.nav-item-link),
   scoped under .hz-nav (which IS on the container). The underline sits on
   each <a>, so it can never span the whole bar. If a menu link turns out
   not to carry .nav-item-link, tell me and I'll broaden to .hz-nav a. */
.hz-nav .nav-item-link, .hz-nav .nav-item-link *{
  font-family:'Gotham Bold','Gotham','Helvetica Neue',Arial,sans-serif!important;
  font-weight:700!important;
  font-size:13px!important;letter-spacing:.08em!important;text-transform:uppercase!important;
  color:#FDF6EB!important;text-decoration:none!important;
}
.hz-nav .nav-item-link{
  position:relative!important;padding:14px 2px 14px!important;opacity:.85;
  background:transparent!important;background-color:transparent!important;
  transition:opacity .2s!important;
}
.hz-nav .nav-item-link:hover, .hz-nav .nav-item-link:focus{
  opacity:1;background:transparent!important;background-color:transparent!important;
}
.hz-nav .nav-item-link::after{
  content:"";position:absolute;left:0;bottom:0;height:2px;width:0;
  background:linear-gradient(90deg,#FAA32B,#EE164F);transition:width .25s cubic-bezier(.16,1,.3,1);
}
.hz-nav .nav-item-link:hover::after{width:100%}
/* keep the bar transparent in every state */
.hz-nav, .hz-nav:hover, .hz-nav:focus-within{background:transparent!important}

/* ---------- REGISTER -> gradient pill button (targeted by its #rsvp href) ----------
   Sunset gradient, ALL CAPS to match the other nav links. Set the link's
   LABEL ("Register") in Splash; CSS only styles + uppercases it. */
.hz-nav [href*="rsvp"], .hz-nav [href*="rsvp"] *,
.hz-nav a.nav-item-link[href*="rsvp"], .hz-nav a.nav-item-link[href*="rsvp"] *{
  color:#FDF6EB!important;text-transform:uppercase!important;
  letter-spacing:.08em!important;font-size:14px!important;
}
.hz-nav [href*="rsvp"],
.hz-nav a.nav-item-link[href*="rsvp"]{
  /* Splash forces padding:0 on nav anchors via an ID-level !important rule
     (#g-... .nav-item a) that no class selector can outrank. So we DON'T use
     padding — we give the button a fixed height + min-width and center the
     label with flex. Splash doesn't touch those, so there's no fight. */
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  vertical-align:middle!important;
  height:54px!important;min-width:210px!important;line-height:1!important;
  background:linear-gradient(120deg,#FAA32B,#EE164F 55%,#B0093C)!important;
  border:none!important;border-radius:7px!important;opacity:1!important;
  box-shadow:0 6px 20px rgba(238,22,79,.32)!important;
  transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s ease!important;
}
.hz-nav [href*="rsvp"]:hover,
.hz-nav a.nav-item-link[href*="rsvp"]:hover{
  transform:translateY(-2px)!important;
  box-shadow:0 12px 32px rgba(238,22,79,.5)!important;
}
.hz-nav [href*="rsvp"]::after,
.hz-nav a.nav-item-link[href*="rsvp"]::after{display:none!important}   /* no underline on the button */

/* ---------- HAMBURGER (mobile menu icon) -> cream ----------
   It's an icon FONT: <div class="nav-hamburger icon-f-menu"> with the glyph
   drawn in ::before content. So we colour it with `color` (which tints the
   glyph) — NOT background, which painted a solid white box. background:
   transparent here also clears that earlier white box. #FDF6EB matches the
   nav text; swap to #fff for pure white. */
.hz-nav .nav-hamburger, .hz-nav .nav-hamburger::before,
.nav-hamburger, .nav-hamburger::before, .nav-hamburger.icon-f-menu::before{
  color:#FDF6EB!important;background:transparent!important;background-color:transparent!important;
}

/* ---------- FLOATING HERO REGISTER BUTTON ----------
   Splash renders this "button" as a wrapper STACK: the tagged container +
   inner .element/.grp wrappers + an empty .nav-jump anchor + the real link,
   several of which paint their own white background. So we make the tagged
   CONTAINER itself the cappuccino pill, blank out every descendant's box, hide
   the empty jump anchor, and stretch the inner link so the whole pill is
   clickable. Fixed -margin float => same on mobile + desktop.
   /!\ hz-float-cta goes on the button's CONTAINER block.
   KNOBS: margin-top (float height) + the two background colours. */
.hz-float-cta{
  position:relative!important;z-index:20!important;margin-top:-44px!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  min-width:212px!important;min-height:52px!important;line-height:1!important;overflow:hidden!important;
  background:#F7E7CE!important;color:#3D001A!important;border:none!important;border-radius:9px!important;
  box-shadow:0 12px 34px rgba(28,5,16,.32)!important;cursor:pointer!important;
  font-family:'Archivo Black',sans-serif!important;text-transform:uppercase!important;
  letter-spacing:.05em!important;font-size:14px!important;
  transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s ease,background-color .2s ease!important;
}
.hz-float-cta *{
  background:transparent!important;background-color:transparent!important;
  box-shadow:none!important;border:none!important;color:#3D001A!important;
  font-size:14px!important;margin:0!important;padding:0!important;
}
.hz-float-cta a.nav-jump{display:none!important}
.hz-float-cta a:not(.nav-jump){
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  height:100%!important;min-height:52px!important;padding:0 34px!important;
  text-decoration:none!important;cursor:pointer!important;
}
.hz-float-cta:hover, .hz-float-cta:focus-within{
  transform:translateY(-4px)!important;background:#FDF6EB!important;
  box-shadow:0 20px 46px rgba(28,5,16,.42)!important;
}