/* Wellness Weekend on Bricks: small fixes so site.css works inside the Bricks page wrappers,
   plus icon helpers for content edited in Bricks (no inline SVG needed). */

html { font-size: 100%; }

/* Bricks wraps the header template in #brx-header: that wrapper is what sticks */
#brx-header { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50; }
#brx-header .site-header { position: relative; top: auto; }

/* Bricks caps every div at max-width: 100%, which shrinks the hero's sun shapes (they hang past their box on purpose) */
.hero__media, .hero__sun, .hero__sun-pair { max-width: none; }

/* Rich text lists with the class "ticks" get the check icon without any code */
.ticks li:not(:has(> svg)) { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 12px; align-items: start; }
.ticks li:not(:has(> svg))::before {
  content: ""; width: 20px; height: 20px; margin-top: 3px; background: currentColor;
  -webkit-mask: url("../icons/check.svg") center / contain no-repeat; mask: url("../icons/check.svg") center / contain no-repeat;
}
.ticks--plus li:not(:has(> svg))::before { -webkit-mask-image: url("../icons/plus.svg"); mask-image: url("../icons/plus.svg"); }
.ticks--circle li:not(:has(> svg))::before { -webkit-mask-image: url("../icons/check-circle.svg"); mask-image: url("../icons/check-circle.svg"); }
.band--beige .ticks li:not(:has(> svg))::before, .tier .ticks li::before, .upgrade .ticks li::before { background: var(--brown); }
.band--brown .ticks li:not(:has(> svg))::before, .pass .ticks li::before { background: var(--gold); }
.ticks p { margin: 0; }

/* Buttons and links with an arrow: add the class "btn--arrow" (or "text-link--arrow") in Bricks */
.btn--arrow::after, .text-link--arrow::after, .btn--external::after {
  content: ""; flex: none; width: 18px; height: 18px; background: currentColor;
  -webkit-mask: url("../icons/arrow-right.svg") center / contain no-repeat; mask: url("../icons/arrow-right.svg") center / contain no-repeat;
  transition: transform 0.25s var(--ease);
}
.text-link--arrow::after { width: 16px; height: 16px; }
.btn--external::after { -webkit-mask-image: url("../icons/arrow-up-right.svg"); mask-image: url("../icons/arrow-up-right.svg"); }
.btn--arrow:hover::after, .text-link--arrow:hover::after { transform: translateX(3px); }
.btn--back::before {
  content: ""; flex: none; width: 18px; height: 18px; background: currentColor;
  -webkit-mask: url("../icons/arrow-left.svg") center / contain no-repeat; mask: url("../icons/arrow-left.svg") center / contain no-repeat;
}
.btn--calendar::before, .btn--map-pin::after {
  content: ""; flex: none; width: 18px; height: 18px; background: currentColor;
  -webkit-mask: url("../icons/calendar-blank.svg") center / contain no-repeat; mask: url("../icons/calendar-blank.svg") center / contain no-repeat;
}
.btn--map-pin::after { -webkit-mask-image: url("../icons/map-pin.svg"); mask-image: url("../icons/map-pin.svg"); }

/* FAQ built with Bricks: the plus icon on each question */
.faq summary.has-plus::after {
  content: ""; flex: none; width: 22px; height: 22px; background: var(--brown);
  -webkit-mask: url("../icons/plus.svg") center / contain no-repeat; mask: url("../icons/plus.svg") center / contain no-repeat;
  transition: transform 0.3s var(--ease);
}
.faq details[open] summary.has-plus::after { transform: rotate(45deg); }

/* Rich text inside festival blocks keeps the block's own spacing */
.brxe-text > p:first-child { margin-top: 0; }
.brxe-text > p:last-child { margin-bottom: 0; }

/* The e-ticket page */
.eticket-view { display: grid; gap: 24px; justify-items: center; }
.eticket-view [data-eticket] { width: 100%; max-width: 380px; }
.eticket-view__actions .btn .ic { width: 18px; height: 18px; }
@media print {
  #brx-header, #brx-footer, .no-print, .eticket-view__actions { display: none !important; }
  body, .band { background: #fff !important; }
}

/* Booking form messages */
.error-summary { color: #b3261e; font-size: 14px; }

/* Tick lists built in Bricks: an item with the class "is-plus" gets the coral plus (the extras a pass adds) */
.ticks li.is-plus::before { -webkit-mask-image: url("../icons/plus.svg"); mask-image: url("../icons/plus.svg"); background: var(--coral) !important; }

/* Buttons built in Bricks around an Om Icon */
.slider-arrow .ic, .offering__badge .ic { pointer-events: none; }

/* 3 Nov design: the tick colours of the dark Workshop Pass cards (the static site colours its inline icons the same way) */
.tier--feature .ticks li::before, .tier--feature .ticks li.is-plus::before { background: var(--gold) !important; }
.pass .ticks li.is-plus::before { background: #f3d9a6 !important; }

/* Page speed (5 Nov): the hero video is the largest thing on the first screen, so it no longer fades in from
   invisible (that held back "largest contentful paint"); it only rises into place. */
@keyframes rise-move { from { transform: translateY(18px); } to { transform: none; } }
@media (prefers-reduced-motion: no-preference) { .hero .hero__reel-wrap.reveal { animation-name: rise-move; } }

/* Page speed: until Inter arrives, text uses Arial scaled to Inter's size, so lines don't rewrap and the page
   below doesn't jump when the font swaps in. */
@font-face { font-family: "Inter Fallback"; src: local("Arial"); size-adjust: 107.4%; ascent-override: 90.2%; descent-override: 22.48%; line-gap-override: 0%; }
:root { --font: "Inter", "Inter Fallback", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
