/* =========================================================
   VAIL KIDS RANCH — BOLD & GRAPHIC theme
   Same brand palette + content. Oversized type, full-bleed
   color blocks, sticker-style hard shadows, shaped photo frames.
   Tokens at :root — swap to rebrand.
   ========================================================= */

/*
@font-face { font-family:"Genuine Sans"; src:url("../fonts/GenuineSans.woff2") format("woff2"); font-weight:400 800; font-display:swap; }
@font-face { font-family:"OTR Souvenir"; src:url("../fonts/Souvenir.woff2") format("woff2"); font-display:swap; }
@font-face { font-family:"OTR Souvenir Wonky"; src:url("../fonts/SouvenirWonky.woff2") format("woff2"); font-display:swap; }
*/

:root {
  --yellow:  #F5F072;
  --teal:    #1A7A6E;
  --teal-dk: #11574e;
  --brown:   #3D2012;
  --sky:     #7DCFEA;
  --rust:    #C1440E;
  --cream:   #F2F0E6;

  --ink:     #2a1709;   /* near-black brown for outlines/type */

  --display: "Genuine Sans", "Outfit", system-ui, sans-serif;
  --body:    "OTR Souvenir", "Fraunces", Georgia, serif;
  --accent:  "OTR Souvenir Wonky", "Fraunces", Georgia, serif;

  --container: 1240px;
  --gutter: 26px;
  --section-y: clamp(64px, 9vw, 120px);
  --radius: 26px;
  --bw: 3px;                       /* outline weight */
  --hard: 7px 7px 0 var(--ink);    /* sticker hard shadow */
  --hard-lg: 12px 12px 0 var(--ink);
  --ease: cubic-bezier(.22,.61,.36,1);
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--cream); color:var(--ink); font-family:var(--body); font-size:18px; line-height:1.7; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
img { display:block; max-width:100%; }
a { color:var(--teal); text-decoration:none; }
ul { list-style:none; }
:focus-visible { outline:3px solid var(--ink); outline-offset:3px; border-radius:6px; }

/* ---------- layout ---------- */
.container { width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter); }
.section { padding-block:var(--section-y); }
.grid { display:grid; gap:34px; }
.grid--2 { grid-template-columns:repeat(2,1fr); }
.grid--3 { grid-template-columns:repeat(3,1fr); }
.center { text-align:center; }

/* color-block bands (the backbone of the bold look) */
.band--cream  { background:var(--cream); }
.band--yellow { background:var(--yellow); }
.band--teal   { background:var(--teal);  color:#fff; }
.band--sky    { background:var(--sky); }
.band--brown  { background:var(--brown); color:var(--cream); }
.band--teal h1,.band--teal h2,.band--teal h3,.band--teal h4,.band--brown h1,.band--brown h2,.band--brown h3,.band--brown h4 { color:#fff; }
.band--teal .muted,.band--brown .muted { color:#e9ddd2; }
.band--teal a,.band--brown a { color:var(--yellow); }
.band--teal .eyebrow { color:var(--yellow); }
.band--yellow .eyebrow,.band--sky .eyebrow { color:var(--rust); }

/* ---------- type ---------- */
h1,h2,h3,h4 { font-family:var(--display); font-weight:800; line-height:.96; color:var(--ink); letter-spacing:-.02em; text-transform:uppercase; }
.eyebrow { display:inline-block; font-family:var(--display); font-weight:800; font-size:.8rem; letter-spacing:.16em; text-transform:uppercase; color:var(--rust);
  background:#fff; border:var(--bw) solid var(--ink); border-radius:50px; padding:7px 16px; margin-bottom:22px; box-shadow:3px 3px 0 var(--ink); }
.h-xl { font-size:clamp(3rem, 9vw, 7rem); }
.h-lg { font-size:clamp(2.3rem, 5.5vw, 4.4rem); }
.h-md { font-size:clamp(1.5rem, 2.8vw, 2.2rem); }
.lead { font-size:1.3rem; line-height:1.5; }
p { font-family:var(--body); }
.muted { color:#5c4536; }
.section__head { max-width:760px; margin:0 auto 56px; text-align:center; }
.wonky { font-family:var(--accent); font-style:italic; text-transform:none; }

/* ---------- buttons ---------- */
.btn { display:inline-flex; align-items:center; gap:.5em; justify-content:center; font-family:var(--display); font-weight:800;
  font-size:.98rem; letter-spacing:.02em; text-transform:uppercase; padding:16px 30px; border-radius:50px; cursor:pointer;
  border:var(--bw) solid var(--ink); box-shadow:var(--hard); transition:transform .14s var(--ease), box-shadow .14s var(--ease), background .2s; }
.btn:hover { transform:translate(-2px,-2px); box-shadow:9px 9px 0 var(--ink); }
.btn:active { transform:translate(3px,3px); box-shadow:2px 2px 0 var(--ink); }
.btn--sm { padding:11px 20px; font-size:.86rem; box-shadow:4px 4px 0 var(--ink); }
.btn--yellow { background:var(--yellow); color:var(--ink); }
.btn--teal { background:var(--teal); color:#fff; }
.btn--rust { background:var(--rust); color:#fff; }
.btn--white { background:#fff; color:var(--ink); }
.btn-row { display:flex; gap:16px; flex-wrap:wrap; }

/* ---------- topbar + nav ---------- */
.topbar { background:var(--ink); color:#fff; text-align:center; font-family:var(--display); font-weight:600; font-size:.84rem; letter-spacing:.03em; padding:9px 16px; }
.topbar a { color:var(--yellow); font-weight:800; text-decoration:underline; }

.nav { position:sticky; top:0; z-index:1000; background:var(--cream); border-bottom:var(--bw) solid var(--ink); }
.nav__inner { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-block:12px; }
.nav__logo img { height:64px; width:auto; }
.nav__links { display:flex; align-items:center; gap:26px; }
.nav__links a { font-family:var(--display); font-weight:700; font-size:.98rem; text-transform:uppercase; letter-spacing:.02em; color:var(--ink); transition:color .2s; }
.nav__links a:hover, .nav__links a.is-active { color:var(--rust); }
.nav__toggle { display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:6px; }
.nav__toggle span { width:28px; height:3px; background:var(--ink); border-radius:3px; transition:.3s var(--ease); }
.nav__toggle.is-open span:nth-child(1){ transform:translateY(8px) rotate(45deg); }
.nav__toggle.is-open span:nth-child(2){ opacity:0; }
.nav__toggle.is-open span:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }

/* ---------- hero ---------- */
.hero__media { position:relative; min-height:clamp(460px,76vh,720px); display:flex; align-items:flex-end; background-size:cover; background-position:center; border-bottom:var(--bw) solid var(--ink); }
.hero__media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(42,23,9,.15) 0%, rgba(42,23,9,.66) 100%); }
.hero__inner { position:relative; z-index:2; color:#fff; padding-block:clamp(34px,6vw,70px); max-width:900px; }
.hero__inner .eyebrow { color:var(--rust); }
.hero h1 { color:#fff; margin-bottom:18px; text-shadow:4px 4px 0 rgba(42,23,9,.45); }
.hero__sub { font-size:1.35rem; line-height:1.45; color:#fff; max-width:640px; margin-bottom:30px; }

/* compact page hero = solid color block (default teal; override with band--*) */
.pagehero { text-align:center; padding-block:clamp(64px,9vw,120px); border-bottom:var(--bw) solid var(--ink); background:var(--teal); color:#fff; }
.pagehero h1 { color:#fff; text-shadow:4px 4px 0 rgba(42,23,9,.35); }
.pagehero p { font-size:1.25rem; max-width:660px; margin:0 auto; color:#eafaf6; }

/* callout = yellow color block by default */
.callout { background:var(--yellow); border-block:var(--bw) solid var(--ink); }
.callout h2, .callout p { color:var(--ink); }

/* ---------- split media+text ---------- */
.split { align-items:center; gap:60px; }
.split__media img, .framed { border:var(--bw) solid var(--ink); border-radius:var(--radius); box-shadow:var(--hard-lg); width:100%; object-fit:cover; background:#fff; }
.tilt { transform:rotate(-2deg); }
.tilt-r { transform:rotate(2deg); }
.ticklist { display:grid; gap:13px; margin:24px 0 30px; }
.ticklist li { position:relative; padding-left:38px; font-size:1.06rem; }
.ticklist li::before { content:""; position:absolute; left:0; top:.35em; width:22px; height:22px; border-radius:50%; background:var(--yellow); border:var(--bw) solid var(--ink); }

/* ---------- callout ---------- */
.callout__inner { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:40px; padding-block:clamp(46px,6vw,76px); }
.callout__mark { display:grid; place-items:center; }
.callout p { max-width:560px; }
@media (max-width:860px){ .callout__inner{ grid-template-columns:1fr; text-align:center; gap:22px; justify-items:center; } .callout p{ margin-inline:auto; } }

/* ---------- icon badges ---------- */
.ic { width:32px; height:32px; stroke:currentColor; stroke-width:2.2; fill:none; stroke-linecap:round; stroke-linejoin:round; display:block; }
.iconbox { width:74px; height:74px; border-radius:22px; display:grid; place-items:center; border:var(--bw) solid var(--ink); background:var(--yellow); color:var(--ink); box-shadow:var(--hard); }

/* ---------- cards ---------- */
.cards { gap:30px; }
.card { background:#fff; border:var(--bw) solid var(--ink); border-radius:var(--radius); padding:36px 30px; box-shadow:var(--hard); display:block;
  transition:transform .14s var(--ease), box-shadow .14s var(--ease); }
.card:hover { transform:translate(-3px,-3px); box-shadow:var(--hard-lg); }
.card:active { transform:translate(2px,2px); box-shadow:3px 3px 0 var(--ink); }
.card__icon { margin-bottom:20px; }
.card h3 { margin-bottom:10px; }
.card .muted { color:#5c4536; }

/* fun-fact tiles */
.facts { gap:24px; }
.fact { background:#fff; border:var(--bw) solid var(--ink); border-radius:var(--radius); padding:26px 28px; display:flex; gap:18px; align-items:flex-start; box-shadow:var(--hard); }
.fact__ic { flex:0 0 auto; width:58px; height:58px; border-radius:16px; display:grid; place-items:center; border:var(--bw) solid var(--ink); background:var(--sky); color:var(--ink); }
.fact__ic .ic { width:28px; height:28px; }
.fact h4 { font-family:var(--display); font-size:1.05rem; letter-spacing:.04em; color:var(--rust); margin-bottom:4px; }
.fact p { margin:0; }

/* ---------- instagram strip ---------- */
.ig { display:grid; grid-template-columns:repeat(6,1fr); gap:12px; }
.ig a { aspect-ratio:1; overflow:hidden; border:var(--bw) solid var(--ink); border-radius:16px; box-shadow:4px 4px 0 var(--ink); transition:transform .14s var(--ease); }
.ig a:hover { transform:translate(-2px,-2px); }
.ig img { width:100%; height:100%; object-fit:cover; }
@media (max-width:760px){ .ig{ grid-template-columns:repeat(3,1fr); } }

/* ---------- pricing table ---------- */
.ptable { width:100%; border-collapse:separate; border-spacing:0; background:#fff; border:var(--bw) solid var(--ink); border-radius:var(--radius); overflow:hidden; box-shadow:var(--hard); }
.ptable th, .ptable td { padding:17px 22px; text-align:left; border-bottom:2px solid var(--cream); font-family:var(--body); }
.ptable th { font-family:var(--display); background:var(--ink); color:#fff; font-size:.92rem; letter-spacing:.06em; text-transform:uppercase; }
.ptable td:nth-child(2){ font-family:var(--display); font-weight:800; color:var(--rust); white-space:nowrap; }
.ptable tr:last-child td { border-bottom:0; }
.fill { color:var(--rust); font-style:italic; font-family:var(--body); }

/* notice block */
.notice { border:var(--bw) dashed var(--rust); border-radius:18px; padding:20px 24px; background:#fff; box-shadow:5px 5px 0 rgba(193,68,14,.25); }
.notice strong { color:var(--rust); font-family:var(--display); }

/* ---------- pavilion ---------- */
.pavilion { background:#fff; border:var(--bw) solid var(--ink); border-radius:var(--radius); overflow:hidden; display:flex; flex-direction:column; box-shadow:var(--hard); }
.pavilion__media { aspect-ratio:16/10; border-bottom:var(--bw) solid var(--ink); }
.pavilion__media img { width:100%; height:100%; object-fit:cover; }
.pavilion__body { padding:30px; display:flex; flex-direction:column; gap:15px; flex:1; }
.pavilion dl { display:grid; grid-template-columns:auto 1fr; gap:9px 16px; }
.pavilion dt { font-family:var(--display); font-weight:700; color:var(--teal); font-size:.92rem; text-transform:uppercase; letter-spacing:.02em; }
.pavilion dd { font-family:var(--body); }

/* testimonial */
.quote { text-align:center; max-width:820px; margin:0 auto; }
.quote p { font-family:var(--accent); font-style:italic; font-size:clamp(1.6rem,3.2vw,2.4rem); line-height:1.35; }
.quote cite { display:block; margin-top:18px; font-family:var(--display); font-style:normal; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--rust); font-size:.95rem; }

/* ---------- accordion ---------- */
.faqgroup { margin-bottom:46px; }
.faqgroup > h3 { color:var(--rust); margin-bottom:18px; font-size:1.5rem; }
.acc { border:var(--bw) solid var(--ink); border-radius:18px; background:#fff; margin-bottom:14px; overflow:hidden; box-shadow:5px 5px 0 var(--ink); }
.acc__q { width:100%; text-align:left; background:none; border:0; cursor:pointer; padding:19px 22px; font-family:var(--display); font-weight:700; font-size:1.06rem; text-transform:uppercase; letter-spacing:.01em; color:var(--ink); display:flex; justify-content:space-between; gap:16px; align-items:center; }
.acc__q::after { content:"+"; font-size:1.7rem; color:var(--rust); transition:transform .3s var(--ease); }
.acc.is-open .acc__q::after { transform:rotate(45deg); }
.acc.is-open .acc__q { color:var(--rust); }
.acc__a { max-height:0; overflow:hidden; transition:max-height .35s var(--ease); }
.acc__a-inner { padding:0 22px 20px; font-family:var(--body); }

/* ---------- footer ---------- */
.footer { background:var(--ink); color:#efe7df; border-top:var(--bw) solid var(--ink); }
.footer__top { display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:44px; padding-block:60px; }
.footer h4 { color:var(--yellow); font-size:1.05rem; letter-spacing:.06em; margin-bottom:16px; }
.footer a { color:#efe7df; }
.footer a:hover { color:var(--yellow); }
.footer__brand img { height:78px; background:var(--cream); border:var(--bw) solid #000; border-radius:14px; padding:8px; margin-bottom:16px; box-shadow:5px 5px 0 rgba(0,0,0,.4); }
.footer__links { display:grid; gap:11px; font-family:var(--body); }
.footer__social { display:flex; gap:11px; margin-top:10px; }
.footer__social a { width:44px; height:44px; display:grid; place-items:center; border:2px solid #6a4a35; border-radius:50%; font-family:var(--display); font-weight:800; font-size:.82rem; transition:.18s var(--ease); }
.footer__social a:hover { background:var(--yellow); color:var(--ink); border-color:var(--yellow); transform:translate(-2px,-2px); }
.footer__base { border-top:1px solid #5a3826; padding-block:22px; text-align:center; font-size:.88rem; color:#c8b6a8; font-family:var(--display); letter-spacing:.02em; }

/* ---------- reveal ---------- */
[data-reveal]{ opacity:0; transform:translateY(26px); transition:opacity .6s var(--ease), transform .6s var(--ease); }
[data-reveal].is-visible{ opacity:1; transform:none; }

/* ---------- responsive ---------- */
@media (max-width:880px){
  .grid--3{ grid-template-columns:1fr; }
  .split{ grid-template-columns:1fr; gap:38px; }
  .facts{ grid-template-columns:1fr; }
  .footer__top{ grid-template-columns:1fr; gap:32px; }
  .tilt,.tilt-r{ transform:none; }
}
@media (max-width:760px){
  .nav__links{ position:fixed; inset:0 0 0 auto; width:min(84%,340px); height:100dvh; flex-direction:column; align-items:flex-start; justify-content:center; gap:26px; background:var(--cream); border-left:var(--bw) solid var(--ink); padding:0 40px; transform:translateX(100%); transition:transform .32s var(--ease); }
  .nav__links.is-open{ transform:translateX(0); }
  .nav__toggle{ display:flex; z-index:1001; }
  .grid--2{ grid-template-columns:1fr; }
  :root{ --hard:5px 5px 0 var(--ink); --hard-lg:8px 8px 0 var(--ink); }
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms!important; transition-duration:.001ms!important; }
  [data-reveal]{ opacity:1; transform:none; }
  .tilt,.tilt-r{ transform:none; }
}

/* =========================================================
   TORN-PAPER SECTION EDGES
   Each band "tears" up into the section above it. The ragged
   strip is the band's own color, masked to an irregular edge.
   ========================================================= */
:root{
  --torn: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201200%2032'%20preserveAspectRatio='none'%3E%3Cpath%20d='M0%2032%20L0%2018%20L38%207%20L74%2021%20L118%205%20L165%2023%20L208%2010%20L255%2025%20L298%208%20L347%2020%20L398%204%20L447%2022%20L500%2012%20L558%2025%20L607%206%20L658%2019%20L709%205%20L760%2023%20L808%2011%20L860%2024%20L908%207%20L959%2018%20L1008%205%20L1058%2022%20L1108%209%20L1158%2023%20L1200%2013%20L1200%2032%20Z'%20fill='black'/%3E%3C/svg%3E");
}
.section{ --edge:var(--cream); }
.band--cream{ --edge:var(--cream); }
.band--yellow{ --edge:var(--yellow); }
.band--teal{ --edge:var(--teal); }
.band--sky{ --edge:var(--sky); }
.band--brown{ --edge:var(--brown); }
section.callout{ --edge:var(--yellow); }
.footer{ --edge:var(--ink); }

.section, section.callout, .footer{ position:relative; }
.section::before, section.callout::before, .footer::before{
  content:""; position:absolute; left:-1px; right:-1px; bottom:100%;
  height:clamp(20px,2.6vw,34px); background:var(--edge);
  -webkit-mask:var(--torn) bottom center/100% 100% no-repeat;
  mask:var(--torn) bottom center/100% 100% no-repeat;
  z-index:3; pointer-events:none;
}
/* footer already had a hard top border — let the torn edge be the seam instead */
.footer{ border-top:0; }

/* =========================================================
   CENTERED LOGO NAV (links split left/right) + CENTERED HERO
   ========================================================= */
.nav__inner{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:18px; }
.nav__menu{ display:contents; }
.nav__group{ display:flex; align-items:center; gap:26px; }
.nav__group--left{ grid-column:1; justify-self:end; }
.nav__logo{ grid-column:2; justify-self:center; }
.nav__group--right{ grid-column:3; justify-self:start; }
.nav__group a{ font-family:var(--display); font-weight:700; font-size:.98rem; text-transform:uppercase; letter-spacing:.02em; color:var(--ink); transition:color .2s; }
.nav__group a:hover, .nav__group a.is-active{ color:var(--rust); }
.nav__toggle{ display:none; }

.hero__inner{ text-align:center; margin-inline:auto; }
.hero__sub{ margin-inline:auto; }
.hero .btn-row{ justify-content:center; }

@media (max-width:760px){
  .nav__inner{ display:flex; justify-content:space-between; }
  .nav__menu{ display:flex; position:fixed; inset:0 0 0 auto; width:min(84%,340px); height:100dvh;
    flex-direction:column; align-items:flex-start; justify-content:center; gap:26px; background:var(--cream);
    border-left:var(--bw) solid var(--ink); padding:0 40px; transform:translateX(100%);
    transition:transform .32s var(--ease); z-index:1000; }
  .nav.is-open .nav__menu{ transform:none; }
  .nav__group{ flex-direction:column; align-items:flex-start; gap:26px; }
  .nav__toggle{ display:flex; z-index:1001; }
}

/* nudge logo down so it sits inline with the menu row */
.nav__inner{ align-items:center; }
.nav__logo{ align-self:center; display:flex; align-items:center; transform:translateY(4px); }
.nav__logo img{ height:54px; }


/* CLOUD edge for the first section divider on each page */
.edge-clouds{ --torn: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%201200%2060%27%20preserveAspectRatio%3D%27none%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%27M0%2060%20L0%2048%20A35%2035%200%200%201%2070%2048%20A25%2025%200%200%201%20120%2048%20A42%2042%200%200%201%20204%2048%20A30%2030%200%200%201%20264%2048%20A45%2045%200%200%201%20354%2048%20A23%2023%200%200%201%20400%2048%20A39%2039%200%200%201%20478%2048%20A31%2031%200%200%201%20540%2048%20A43%2043%200%200%201%20626%2048%20A26%2026%200%200%201%20678%2048%20A40%2040%200%200%201%20758%2048%20A29%2029%200%200%201%20816%2048%20A47%2047%200%200%201%20910%2048%20A35%2035%200%200%201%20980%2048%20A28%2028%200%200%201%201036%2048%20A42%2042%200%200%201%201120%2048%20A40%2040%200%200%201%201200%2048%20L1200%2060%20Z%27%2F%3E%3C%2Fsvg%3E"); }
.edge-clouds::before{ height:clamp(32px,5vw,54px); }


/* ===== COUNTDOWN ===== */
.countdown__grid{ display:flex; gap:18px; justify-content:center; flex-wrap:wrap; }
.cd{ background:var(--teal); border:var(--bw) solid var(--ink); border-radius:20px; box-shadow:var(--hard); min-width:104px; padding:18px 20px; }
.cd__num{ display:block; font-family:var(--display); font-weight:800; font-size:clamp(2.1rem,4.4vw,3.2rem); line-height:1; color:#fff; font-variant-numeric:tabular-nums; }
.cd__label{ display:block; font-family:var(--display); font-weight:700; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--yellow); margin-top:7px; }


/* countdown horizontal band layout */
.countdown{ padding-block:clamp(38px,5vw,60px); }
.countdown__inner{ display:flex; align-items:center; justify-content:space-between; gap:40px; flex-wrap:wrap; }
.countdown__copy{ max-width:500px; }
.countdown__kicker{ font-family:var(--accent); font-style:italic; text-transform:none; font-size:1.4rem; color:var(--rust); margin-bottom:2px; }
.countdown__copy h2{ color:var(--ink); }
.countdown__date{ font-family:var(--display); font-weight:700; color:var(--ink); margin-top:10px; letter-spacing:.02em; font-size:1.05rem; }
@media (max-width:760px){ .countdown__inner{ justify-content:center; text-align:center; } .countdown__copy{ text-align:center; } }

/* force logo + both menu groups onto the same row */
.nav__inner{ grid-template-columns:1fr auto 1fr; align-items:center; }
.nav__group--left{ grid-column:1; grid-row:1; justify-self:end; }
.nav__logo{ grid-column:2; grid-row:1; justify-self:center; transform:none; }
.nav__group--right{ grid-column:3; grid-row:1; justify-self:start; }
@media (max-width:760px){
  .nav__group--left,.nav__group--right,.nav__logo{ grid-row:auto; }
}


/* ===== WAIVER (tickets) ===== */
.waiver__doc{ max-width:780px; margin:0 auto; max-height:320px; overflow-y:auto; background:#fff;
  border:var(--bw) solid var(--ink); border-radius:var(--radius); padding:26px 28px; box-shadow:var(--hard); }
.waiver__doc h4{ font-family:var(--display); color:var(--teal); margin:18px 0 6px; font-size:1rem; }
.waiver__doc h4:first-child{ margin-top:0; }
.waiver__doc p{ margin-bottom:11px; font-size:.92rem; color:#3a2417; }
.wform{ max-width:780px; margin:26px auto 0; display:grid; gap:18px; background:#fff;
  border:var(--bw) solid var(--ink); border-radius:var(--radius); padding:30px; box-shadow:var(--hard); }
.wform .row2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.wform label{ display:block; font-family:var(--display); font-weight:700; font-size:.78rem; text-transform:uppercase; letter-spacing:.05em; color:var(--ink); margin-bottom:7px; }
.wform input[type=text], .wform input[type=email]{ width:100%; background:var(--cream); border:2px solid var(--ink); border-radius:12px; padding:13px 15px; font-family:var(--body); font-size:1rem; color:var(--ink); }
.wform input[type=text]:focus, .wform input[type=email]:focus{ outline:none; border-color:var(--rust); }
.wform .check{ display:flex; gap:12px; align-items:flex-start; }
.wform .check input{ width:22px; height:22px; margin-top:3px; accent-color:var(--teal); flex:0 0 auto; }
.wform .check label{ text-transform:none; font-family:var(--body); font-weight:400; font-size:.98rem; letter-spacing:0; margin:0; }
.wform__ok{ display:none; max-width:780px; margin:20px auto 0; background:var(--teal); color:#fff;
  border:var(--bw) solid var(--ink); border-radius:var(--radius); padding:26px; text-align:center; box-shadow:var(--hard); }
.wform__ok.show{ display:block; }
.wform__ok h3{ color:#fff; margin-bottom:6px; }
@media (max-width:600px){ .wform .row2{ grid-template-columns:1fr; } }

/* eyebrow pill text must stay dark on its white pill */
.pagehero .eyebrow, .band--teal .eyebrow, .band--brown .eyebrow{ color:var(--rust); }

/* keep text inside white cards dark, even when the card sits on a colored band */
.fact p{ color:var(--ink); }
.fact h4{ color:var(--rust); }
.pavilion h3{ color:var(--ink); }
.pavilion p, .pavilion .muted, .pavilion dd{ color:#4a3526; }
.pavilion dt{ color:var(--teal); }
.notice{ color:var(--ink); }

/* footer social brand icons */
.footer__social a svg{ width:19px; height:19px; }

/* ===== MAP ===== */
.mapband .map{ border:var(--bw) solid var(--ink); border-radius:var(--radius); overflow:hidden; box-shadow:var(--hard); margin-top:34px; }
.mapband .map iframe{ display:block; width:100%; height:420px; border:0; }
@media (max-width:600px){ .mapband .map iframe{ height:320px; } }

/* full-bleed map on teal band */
.mapband .map{ border-radius:0; border-inline:0; box-shadow:none; }
.mapband .map iframe{ height:460px; }
@media (max-width:600px){ .mapband .map iframe{ height:340px; } }

/* =========================================================
   SMALL-SCREEN PASS (phones)
   ========================================================= */
iframe{ max-width:100%; }
@media (max-width:600px){
  .container{ padding-inline:18px; }
  .h-xl{ font-size:clamp(2.2rem,9.5vw,3rem); }
  .h-lg{ font-size:clamp(1.85rem,7.5vw,2.6rem); }
  .h-md{ font-size:clamp(1.35rem,5.5vw,1.9rem); }
  .hero__sub{ font-size:1.08rem; }
  .pagehero p{ font-size:1.08rem; }
  .lead{ font-size:1.1rem; }
  .eyebrow{ font-size:.72rem; letter-spacing:.12em; }
  .btn{ padding:14px 22px; font-size:.9rem; }
  .btn-row{ width:100%; }
  .ptable th, .ptable td{ padding:12px 13px; font-size:.9rem; }
  .countdown__kicker{ font-size:1.2rem; }
  .countdown__grid{ width:100%; gap:12px; }
  .cd{ min-width:0; flex:1 1 42%; padding:14px 8px; }
  .cd__num{ font-size:2rem; }
  .waiver__doc{ padding:20px 18px; max-height:280px; }
  .wform{ padding:22px 18px; }
  .footer__base{ font-size:.78rem; }
}
@media (max-width:380px){
  .h-xl{ font-size:2.1rem; }
  .cd{ flex:1 1 100%; }
}


/* =========================================================
   PRELOADER — hopping logo
   ========================================================= */
.preloader{ position:fixed; inset:0; z-index:3000; background:var(--cream);
  display:grid; place-items:center; transition:opacity .6s ease, visibility .6s ease; }
.preloader.is-done{ opacity:0; visibility:hidden; }
.preloader__wrap{ text-align:center; }
.preloader__logo{ width:min(300px,62vw); display:block; margin:0 auto;
  transform-origin:center bottom; animation:vkrHop 1.05s cubic-bezier(.5,0,.5,1) infinite; }
.preloader__shadow{ width:120px; height:16px; margin:18px auto 0; border-radius:50%;
  background:rgba(42,23,9,.18); animation:vkrShadow 1.05s cubic-bezier(.5,0,.5,1) infinite; }
@keyframes vkrHop{
  0%   { transform:translateY(0) scaleY(1) rotate(-1.5deg); }
  15%  { transform:translateY(0) scaleY(.9) scaleX(1.04); }
  45%  { transform:translateY(-34px) scaleY(1.06) scaleX(.98) rotate(2deg); }
  75%  { transform:translateY(0) scaleY(.95) scaleX(1.03) rotate(-1deg); }
  100% { transform:translateY(0) scaleY(1) rotate(-1.5deg); }
}
@keyframes vkrShadow{
  0%,100% { transform:scale(1); opacity:.18; }
  45%     { transform:scale(.65); opacity:.07; }
}
@media (prefers-reduced-motion:reduce){
  .preloader__logo,.preloader__shadow{ animation:none; }
}

/* =========================================================
   FLYERS — butterfly + bee drifting as you scroll
   ========================================================= */
.flyer{ position:fixed; left:0; top:0; z-index:40; pointer-events:none; will-change:transform; }
.flyer--butterfly{ width:46px; }
.flyer--bee{ width:42px; }
.flyer svg{ width:100%; height:auto; display:block; overflow:visible; }
.bf-wing-l{ transform-origin:100% 50%; animation:bfFlapL .16s ease-in-out infinite alternate; }
.bf-wing-r{ transform-origin:0% 50%;   animation:bfFlapR .16s ease-in-out infinite alternate; }
@keyframes bfFlapL{ from{ transform:scaleX(1); } to{ transform:scaleX(.4); } }
@keyframes bfFlapR{ from{ transform:scaleX(1); } to{ transform:scaleX(.4); } }
.bee-wing-l{ transform-origin:78% 100%; animation:beeFlapL .09s linear infinite alternate; }
.bee-wing-r{ transform-origin:22% 100%; animation:beeFlapR .09s linear infinite alternate; }
@keyframes beeFlapL{ from{ transform:rotate(0); } to{ transform:rotate(-28deg); } }
@keyframes beeFlapR{ from{ transform:rotate(0); } to{ transform:rotate(28deg); } }
@media (prefers-reduced-motion:reduce){ .flyer{ display:none; } }

/* headline font: Rye (western). Headings only; UI/labels stay in the sans. */
:root{ --head:"Rye","Outfit",system-ui,sans-serif; }
h1,h2,h3,h4{ font-family:var(--head); font-weight:400; letter-spacing:0; line-height:1.05; }
.hero h1{ line-height:1.08; }

/* ===== Custom headline font: Nexa Rust Sans ===== */
@font-face{
  font-family:"Nexa Rust Sans";
  src:url("../fonts/NexaRustSans-Trial-Black.woff2") format("woff2"),
      url("../fonts/NexaRustSans-Trial-Black.ttf") format("truetype");
  font-weight:normal; font-style:normal; font-display:swap;
}
:root{ --head:"Nexa Rust Sans","Rye","Outfit",system-ui,sans-serif; }

/* body font: Nunito (chosen by UI/UX skill) — warm, highly readable */
:root{ --body:"Nunito", system-ui, -apple-system, sans-serif; }
body{ font-weight:400; }

/* tighter hero headline spacing (Nexa Rust Black runs tall) */
.hero h1{ line-height:0.88; letter-spacing:0; margin-bottom:20px; }

/* headline font: Baloo 2 (free look-alike for Nexa Rust Black) */
:root{ --head:"Baloo 2", "Outfit", system-ui, sans-serif; }
h1,h2,h3,h4{ font-weight:800; letter-spacing:0; }
.hero h1{ line-height:0.95; }

/* fix: buttons inside teal/brown bands kept their own text color (not the band link color) */
.band--teal .btn--yellow, .band--brown .btn--yellow,
.band--teal .btn--white,  .band--brown .btn--white { color:var(--ink); }
.band--teal .btn--teal,   .band--brown .btn--teal,
.band--teal .btn--rust,   .band--brown .btn--rust  { color:#fff; }


/* use the trial Nexa Rust Sans Black for headlines (apostrophes removed from headings) */
:root{ --head:"Nexa Rust Sans", "Baloo 2", "Outfit", system-ui, sans-serif; }
h1,h2,h3,h4{ font-weight:400; }
.hero h1{ line-height:0.9; }

/* =========================================================
   ANIMATED BARN HERO (home)
   ========================================================= */
.hero__media--barn{ background:linear-gradient(#6fc1e0,#d6f0fb); }
.barn-scene{ position:absolute; inset:0; z-index:0; overflow:hidden; }
.barn-scene svg{ width:100%; height:100%; display:block; }
.hero__media--barn::after{ background:linear-gradient(180deg, rgba(42,23,9,.04) 0%, rgba(42,23,9,.14) 45%, rgba(42,23,9,.72) 100%); }
.hero__media--barn .hero__inner{ position:relative; z-index:2; }

.barn-scene .sun{ transform-box:fill-box; animation:bsSun 1.7s cubic-bezier(.22,.61,.36,1) both; }
.barn-scene .sun-rays{ transform-box:fill-box; transform-origin:center; animation:bsSpin 42s linear infinite; }
.barn-scene .cloud-a{ animation:bsDrift 52s linear infinite; }
.barn-scene .cloud-b{ animation:bsDrift 68s linear infinite; animation-delay:-24s; }
.barn-scene .cloud-c{ animation:bsDrift 86s linear infinite; animation-delay:-52s; }
.barn-scene .door-l{ transform-box:fill-box; transform-origin:left center;  animation:bsDoorL 1.3s cubic-bezier(.22,.61,.36,1) .7s both; }
.barn-scene .door-r{ transform-box:fill-box; transform-origin:right center; animation:bsDoorR 1.3s cubic-bezier(.22,.61,.36,1) .7s both; }
.barn-scene .goat{ transform-box:fill-box; transform-origin:center bottom; animation:bsHop 1.5s ease-in-out 1.6s infinite; }
@keyframes bsSpin{ to{ transform:rotate(360deg); } }
@keyframes bsSun{ from{ transform:translateY(150px); opacity:0; } to{ transform:translateY(0); opacity:1; } }
@keyframes bsDrift{ from{ transform:translateX(-280px); } to{ transform:translateX(1720px); } }
@keyframes bsDoorL{ from{ transform:scaleX(1); } to{ transform:scaleX(.06); } }
@keyframes bsDoorR{ from{ transform:scaleX(1); } to{ transform:scaleX(.06); } }
@keyframes bsHop{ 0%,55%,100%{ transform:translateY(0);} 72%{ transform:translateY(-28px);} 88%{ transform:translateY(0);} }
@media (prefers-reduced-motion:reduce){
  .barn-scene .sun,.barn-scene .sun-rays,.barn-scene .cloud-a,.barn-scene .cloud-b,.barn-scene .cloud-c,.barn-scene .goat{ animation:none; }
  .barn-scene .sun{ transform:none; opacity:1; }
  .barn-scene .door-l{ transform:scaleX(.06); }
  .barn-scene .door-r{ transform:scaleX(.06); }
}

/* real-photo hero with cinematic Ken Burns intro */
.hero__media--photo{ background:#7DCFEA; overflow:hidden; }
.hero__photo{ position:absolute; inset:0; background-size:cover; background-position:center; z-index:0;
  transform:scale(1.06); animation:heroKen 22s ease-in-out infinite alternate, heroReveal 1.3s ease both; }
.hero__media--photo .hero__inner{ position:relative; z-index:2; }
@keyframes heroKen{ 0%{ transform:scale(1.06) translate(0,0); } 100%{ transform:scale(1.16) translate(-1.5%,-1%); } }
@keyframes heroReveal{ from{ opacity:0; } to{ opacity:1; } }
@media (prefers-reduced-motion:reduce){ .hero__photo{ animation:none; transform:scale(1.04); } }

/* mobile refinements (hero + flyers) */
@media (max-width:600px){
  .flyer--bee{ display:none; }            /* one creature is plenty on a phone */
  .flyer--butterfly{ width:34px; }
  .hero h1{ overflow-wrap:break-word; }
  .hero__media--photo{ min-height:62vh; }
  .countdown__date{ font-size:.98rem; }
}
@media (max-width:380px){
  .h-xl{ font-size:1.95rem; }
}

/* =========================================================
   CINEMATIC SCROLL PUSH-IN HERO (home)
   ========================================================= */
.hero-stage{ position:relative; height:185vh; }
.hero--sticky{ position:sticky; top:0; height:100vh; height:100svh; }
.hero--sticky .hero__media{ min-height:100vh; min-height:100svh; height:100%; }
.hero--sticky .hero__photo{ animation:heroReveal 1.3s ease both; will-change:transform; }
.hero--sticky .hero__inner{ will-change:transform,opacity; }
@media (prefers-reduced-motion:reduce){
  .hero-stage{ height:auto; }
  .hero--sticky{ position:static; height:auto; }
}

/* robustly center hero content (column-centered + centered text) */
.hero__inner{ display:flex; flex-direction:column; align-items:center; text-align:center; }
.hero__inner .eyebrow{ align-self:center; }
.hero h1{ text-align:center; width:100%; }
.hero__sub{ margin-inline:auto; }
.hero .btn-row{ justify-content:center; }
.hero--sticky .hero__media{ align-items:center; }   /* vertical center for push-in hero */

/* hero headline: fit the longest line + center every line on the same axis */
.hero__inner{ max-width:1240px; width:100%; margin-inline:auto; align-items:center; }
.hero .h-xl{ font-size:clamp(2.3rem, 6.4vw, 5.4rem); }
.hero h1{ width:100%; text-align:center; margin-inline:auto; }
.hero--sticky .hero__media{ justify-content:center; }

/* launch: headline font = Baloo 2 (free, license-clean) */
:root{ --head:"Baloo 2", "Outfit", system-ui, sans-serif; }
h1,h2,h3,h4{ font-weight:800; }
.hero h1{ line-height:0.95; }

/* headlines back to rustic Nexa Rust (trial Black) */
:root{ --head:"Nexa Rust Sans", "Baloo 2", "Outfit", system-ui, sans-serif; }
h1,h2,h3,h4{ font-weight:400; }
.hero h1{ line-height:0.9; }

/* =========================================================
   MOBILE: vertical-only scroll, no horizontal overflow
   ========================================================= */
html{ overflow-x:hidden; }
html, body{ max-width:100%; }
*{ min-width:0; }                 /* let flex/grid children shrink instead of overflowing */
img, svg, iframe, video{ max-width:100%; }

@media (max-width:600px){
  .container{ padding-inline:16px; }
  .hero .h-xl{ font-size:clamp(2rem, 8.2vw, 3rem); }  /* keep the 3-line headline within the screen */
  .flyer--butterfly{ width:30px; }
}
@media (max-width:380px){
  .hero .h-xl{ font-size:1.8rem; }
}

/* show the bee on mobile too (smaller) */
@media (max-width:600px){
  .flyer--bee{ display:block; width:30px; }
}

/* breathing room under the eyebrow pill before the headline */
.pagehero .eyebrow{ margin-bottom:30px; }
.hero__inner .eyebrow{ margin-bottom:26px; }

/* nav logo 50% larger */
.nav__logo img{ height:81px; }

/* nav logo size override */
.nav__logo img{ height:171px; }

/* nav logo responsive scaling (desktop 171px -> smaller on tablet/phone) */
@media (max-width:1100px){ .nav__logo img{ height:120px; } }
@media (max-width:820px){  .nav__logo img{ height:96px; } }
@media (max-width:600px){  .nav__logo img{ height:70px; } }
@media (max-width:380px){  .nav__logo img{ height:58px; } }

/* keep nav sticky: use clip (not hidden) so html/body don't become a scroll container */
html, body{ overflow-x:clip; }
.nav{ position:sticky; top:0; z-index:1000; }

/* ===== MOBILE ACTION BAR (Get Directions / Sign Waiver) ===== */
.mobilebar{ display:none; }
@media (max-width:760px){
  .mobilebar{ display:flex; position:fixed; left:0; right:0; bottom:0; z-index:900;
    border-top:var(--bw) solid var(--ink); }
  .mobilebar__btn{ flex:1; display:flex; align-items:center; justify-content:center; gap:8px;
    padding:14px 8px; font-family:var(--display); font-weight:800; font-size:.92rem;
    text-transform:uppercase; letter-spacing:.02em; }
  .mobilebar__btn svg{ width:18px; height:18px; flex:0 0 auto; }
  .mobilebar__btn.dir{ background:var(--teal); color:#fff; }
  .mobilebar__btn.waiver{ background:var(--yellow); color:var(--ink); border-left:var(--bw) solid var(--ink); }
  body{ padding-bottom:60px; }   /* keep footer clear of the fixed bar */
}

/* preloader: circular badge gentle rock + pulse */
.preloader__logo{ width:min(280px,60vw); animation:vkrLoad 1.4s ease-in-out infinite; }
.preloader__shadow{ display:none; }
@keyframes vkrLoad{
  0%   { transform:rotate(-6deg) scale(1); }
  50%  { transform:rotate(6deg) scale(1.07); }
  100% { transform:rotate(-6deg) scale(1); }
}
@media (prefers-reduced-motion:reduce){ .preloader__logo{ animation:none; } }

/* close the hairline gap between torn edge and its section */
.section::before, section.callout::before, .footer::before{ bottom:calc(100% - 2px); }

/* vertically center hero content (all photo heroes) */
.hero__media{ align-items:center; }