/* The Christmas parties page: Christmas at a heritage barn at dusk. Cream and
   deep pine green alternate section by section, and antique gold is the
   festive signature. Headings are Cormorant Garamond, everything else Inter.
   This file loads only on that page; the sitewide tokens are redefined on main
   and the footer, so the header keeps the sitewide colours. */
@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=Inter:wght@300;400;500;600&display=swap");

:root {
  --x-pine:     #1B3A2A;
  --x-evergreen:#2E5741;
  --x-gold:     #C9A227;
  --x-brass:    #B8892B;
  --x-cream:    #F7F1E6;
  --x-ivory:    #FBF8F1;
  --x-charcoal: #2A2A28;
  --x-taupe:    #8B7E6A;
  --x-sage:     #E4E8DC;
  --x-deepest:  #10241A;

  --x-serif: 'Cormorant Garamond', Georgia, serif;
  --x-sans:  'Inter', system-ui, sans-serif;

  --x-star-gold: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23C9A227' d='M12 1.5l2.2 8.3 8.3 2.2-8.3 2.2L12 22.5l-2.2-8.3L1.5 12l8.3-2.2z'/%3E%3C/svg%3E");
  --x-rule: var(--x-star-gold) center / 12px no-repeat,
            linear-gradient(var(--x-gold), var(--x-gold)) left center / 72px 1px no-repeat,
            linear-gradient(var(--x-gold), var(--x-gold)) right center / 72px 1px no-repeat;
}

main {
  --accent:        var(--x-pine);
  --accent-hover:  var(--x-evergreen);
  --rm-head:       var(--x-pine);
  --rm-ink:        var(--x-pine);
  --rm-text:       var(--x-charcoal);
  --rm-text-light: var(--x-taupe);
  --rm-border:     #E2D8C6;
  --rm-bg-footer:  var(--x-cream);
  --rm-font-body:    var(--x-sans);
  --rm-font-ui:      var(--x-sans);
  --rm-font-heading: var(--x-serif);
  background: var(--x-cream);
  color: var(--x-charcoal);
  font-family: var(--x-sans);
  font-size: 17px;
  line-height: 1.65;
}
main .hr-band--paper,
main .hr-band--white { background: var(--x-cream); }
main h1, main h2, main h3, main .hr-display { font-family: var(--x-serif); font-weight: 400; letter-spacing: -0.01em; color: var(--x-pine); }
main .hr-display { font-size: clamp(2.2rem, 3.6vw, 2.8rem); }
main .hr-lede { font-family: var(--x-sans); color: var(--x-charcoal); max-width: 700px; margin-inline: auto; }

/* Eyebrow labels: Inter, uppercase, spaced, gold. */
main .hr-eyebrow {
  font-family: var(--x-sans); font-size: 0.8rem; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--x-brass);
}
main .hr-eyebrow::before { display: none; }

/* Buttons: Inter 500, uppercase, spaced. */
main .hr-btn, main .hr-herocta__btn {
  font-family: var(--x-sans); font-size: 14px; font-weight: 500; letter-spacing: 0.15em; text-transform: uppercase;
  border-radius: 4px; transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

/* A thin gold rule with a star at the centre, between cream sections. */
#packages, #getting-here { position: relative; }
#packages::before, #getting-here::before {
  content: ""; position: absolute; top: 44px; left: 50%; transform: translateX(-50%);
  width: 180px; height: 14px; background: var(--x-rule); opacity: 0.8;
}

/* ---- Hero: full-bleed photo, soft dark overlay, centred ---- */
main .hr-subhero { align-items: center; }
main .hr-subhero__media img { filter: sepia(0.18) saturate(0.9) brightness(0.92); }
main .hr-subhero__scrim { background: linear-gradient(180deg, rgba(16, 28, 20, 0.55) 0%, rgba(16, 28, 20, 0.62) 55%, rgba(16, 28, 20, 0.78) 100%); }
main .hr-subhero__inner {
  display: flex; flex-direction: column; align-items: center; text-align: center;
  padding-top: 130px; color: var(--x-ivory); font-family: var(--x-sans); font-size: 1.2rem; line-height: 1.6;
}
main .hr-subhero__inner::before { content: ""; width: 180px; height: 14px; margin-bottom: 22px; background: var(--x-rule); }
main .hr-subhero__eyebrow { color: var(--x-gold); font-family: var(--x-sans); font-size: 0.8rem; font-weight: 500; letter-spacing: 0.2em; }
main .hr-subhero h1 {
  font-family: var(--x-serif); font-weight: 400; font-size: clamp(2.6rem, 6vw, 4.4rem); line-height: 1.05;
  color: var(--x-cream); max-width: 15ch; margin-inline: auto;
}
main .hr-subhero__sub { display: contents; font-style: normal; }
.hr-xmas-sub { display: block; max-width: 46ch; margin: 22px auto 0; font-family: var(--x-sans); font-size: 1.2rem; line-height: 1.6; color: var(--x-ivory); }
main .hr-herocta { order: 2; justify-content: center; margin-top: 30px; }
main .hr-herocta__btn { color: var(--x-gold); border: 1px solid var(--x-gold); padding: 15px 30px; }
main .hr-herocta__btn:hover { background: var(--x-gold); color: var(--x-pine); }
.hr-xmas-cues { order: 3; display: flex; flex-wrap: wrap; justify-content: center; gap: 14px 38px; margin-top: 40px; }
.hr-xmas-cue {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 0.82rem; letter-spacing: 0.08em; color: var(--x-ivory); opacity: 0.92;
}
.hr-xmas-cue::before { content: ""; width: 22px; height: 22px; background: center / contain no-repeat; }
.hr-xmas-cue--barn::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C9A227' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18M5 21V9l7-6 7 6v12M9 21v-6h6v6M9 11h6'/%3E%3C/svg%3E"); }
.hr-xmas-cue--food::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C9A227' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2v7a2 2 0 0 0 2 2v11M10 2v7a2 2 0 0 1-2 2M17 22V2c-2.5 1.5-3.5 4.5-3.5 8h3.5'/%3E%3C/svg%3E"); }
.hr-xmas-cue--glass::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C9A227' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 2h8l-1 7a3 3 0 0 1-6 0zM12 12v9M8 21h8'/%3E%3C/svg%3E"); }

/* ---- The evening: three ivory cards with a gold top edge ---- */
main .hr-factcard {
  background: var(--x-ivory); border: 1px solid #E2D8C6; border-top: 3px solid var(--x-gold); border-radius: 12px;
  box-shadow: none; transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
main .hr-factcard:hover { transform: translateY(-4px); border-color: var(--x-gold); box-shadow: 0 16px 34px rgba(139, 126, 106, 0.18); }
main .hr-factcard__ic { color: var(--x-pine); }
main .hr-factcard h3 { font-family: var(--x-serif); font-weight: 500; font-size: 1.4rem; color: var(--x-pine); }
main .hr-factcard p { font-family: var(--x-sans); color: var(--x-charcoal); }

/* ---- The place: deep pine, photo beside the text ---- */
#place { background: var(--x-pine); }
#place .hr-setting__body { position: relative; background: var(--x-pine); color: var(--x-ivory); }
#place .hr-setting__body::after {
  content: ""; position: absolute; right: 24px; bottom: 24px; width: 140px; height: 190px; opacity: 0.18; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 160' fill='none' stroke='%23C9A227' stroke-width='1.2' stroke-linecap='round'%3E%3Cpath d='M18 156C38 112 62 66 106 8'/%3E%3Cellipse cx='36' cy='118' rx='14' ry='6' transform='rotate(-35 36 118)'/%3E%3Cellipse cx='52' cy='112' rx='14' ry='6' transform='rotate(25 52 112)'/%3E%3Cellipse cx='52' cy='86' rx='14' ry='6' transform='rotate(-40 52 86)'/%3E%3Cellipse cx='70' cy='80' rx='14' ry='6' transform='rotate(20 70 80)'/%3E%3Cellipse cx='72' cy='54' rx='13' ry='5.5' transform='rotate(-45 72 54)'/%3E%3Cellipse cx='88' cy='48' rx='13' ry='5.5' transform='rotate(15 88 48)'/%3E%3Cellipse cx='92' cy='26' rx='11' ry='5' transform='rotate(-50 92 26)'/%3E%3C/svg%3E") center / contain no-repeat;
}
#place .hr-eyebrow { color: var(--x-gold); }
#place h2 { color: var(--x-cream); }
#place .hr-setting__text { font-family: var(--x-sans); color: var(--x-ivory); opacity: 0.88; }
#place .hr-setting__list li { color: var(--x-ivory); }
#place .hr-setting__list svg { display: none; }
#place .hr-setting__list li::before { content: ""; flex: none; width: 14px; height: 14px; margin-top: 5px; background: var(--x-star-gold) center / contain no-repeat; }
#place .hr-setting__media img { filter: sepia(0.15) saturate(0.95); }

/* ---- Packages: cream with a faint linen weave ---- */
#packages {
  background-color: var(--x-cream);
  background-image:
    repeating-linear-gradient(0deg, rgba(139, 126, 106, 0.035) 0 1px, transparent 1px 4px),
    repeating-linear-gradient(90deg, rgba(139, 126, 106, 0.03) 0 1px, transparent 1px 5px);
}
@media (min-width: 1000px) { #packages .hr-pkgs { grid-template-columns: repeat(3, 1fr); gap: 26px; align-items: stretch; } }
main .hr-pkg {
  position: relative; background: var(--x-ivory); border: 1px solid #E2D8C6; border-radius: 12px; box-shadow: none;
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
main .hr-pkg:hover { transform: translateY(-5px); border-color: var(--x-gold); box-shadow: 0 18px 40px rgba(139, 126, 106, 0.22), 0 0 0 1px rgba(201, 162, 39, 0.35); }
main .hr-pkg__media { display: none; }
main .hr-pkg__body { padding: 38px 32px 34px; }
main .hr-pkg__name { font-family: var(--x-serif); font-weight: 500; font-size: 1.6rem; color: var(--x-pine); }
main .hr-pkg__price { font-family: var(--x-serif); font-weight: 500; font-size: 2.5rem; color: var(--x-brass); margin-top: 6px; }
main .hr-pkg__price small { font-family: var(--x-sans); font-size: 0.8rem; color: var(--x-taupe); letter-spacing: 0.04em; }
main .hr-pkg__desc, main .hr-pkg__incl li { font-family: var(--x-sans); color: var(--x-charcoal); }
main .hr-pkg__incl-title { font-family: var(--x-sans); font-weight: 500; letter-spacing: 0.2em; color: var(--x-brass); }
main .hr-pkg__incl li::before { background: var(--x-star-gold) center / 11px no-repeat; top: 5px; }
main .hr-pkg .hr-btn { align-self: flex-start; background: transparent; color: var(--x-pine); border: 1px solid var(--x-gold); padding: 13px 28px; }
main .hr-pkg .hr-btn:hover { background: var(--x-gold); color: var(--x-pine); transform: none; }

/* The middle package: deep green with a gold price. */
main .hr-pkg:nth-child(2) { background: var(--x-pine); border-color: var(--x-pine); }
main .hr-pkg:nth-child(2) .hr-pkg__name { color: var(--x-cream); }
main .hr-pkg:nth-child(2) .hr-pkg__price { color: var(--x-gold); }
main .hr-pkg:nth-child(2) .hr-pkg__price small { color: rgba(251, 248, 241, 0.7); }
main .hr-pkg:nth-child(2) .hr-pkg__desc,
main .hr-pkg:nth-child(2) .hr-pkg__incl li { color: var(--x-ivory); }
main .hr-pkg:nth-child(2) .hr-pkg__incl-title { color: var(--x-gold); }
main .hr-pkg:nth-child(2) .hr-btn { background: var(--x-gold); border-color: var(--x-gold); color: var(--x-pine); }
main .hr-pkg:nth-child(2) .hr-btn:hover { background: var(--x-cream); border-color: var(--x-gold); }
#packages .hr-note { text-align: right; font-family: var(--x-sans); font-style: italic; font-size: 0.85rem; color: var(--x-taupe); max-width: none; }

/* ---- Planning the night: deep pine, a menu card of four blocks ---- */
#planning { position: relative; background: var(--x-pine); overflow: hidden; }
#planning::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 70px; opacity: 0.5; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 70' preserveAspectRatio='none'%3E%3Cpath d='M0 10 Q100 60 200 20 T400 14' fill='none' stroke='%23C9A227' stroke-width='0.8' stroke-opacity='0.6'/%3E%3C/svg%3E") top / 100% 70px no-repeat,
    radial-gradient(circle, rgba(201, 162, 39, 0.9) 2px, transparent 2.6px) 0 30px / 50px 20px repeat-x;
}
#planning .hr-eyebrow { color: var(--x-gold); }
#planning .hr-display { color: var(--x-cream); }
#planning .hr-evtypes { grid-template-columns: repeat(2, 1fr); gap: 0; max-width: 1000px; margin: 50px auto 0; }
#planning .hr-evtype { background: none; border: 0; border-radius: 0; box-shadow: none; padding: 34px 40px; text-align: left; }
#planning .hr-evtype:hover { transform: none; box-shadow: none; }
#planning .hr-evtype:nth-child(odd) { border-right: 1px solid rgba(201, 162, 39, 0.45); }
#planning .hr-evtype:nth-child(-n+2) { border-bottom: 1px solid rgba(201, 162, 39, 0.45); }
#planning .hr-evtype__icon { display: none; }
#planning .hr-evtype h3 { font-family: var(--x-serif); font-weight: 500; font-size: 1.5rem; color: var(--x-gold); margin: 0 0 10px; }
#planning .hr-evtype p { font-family: var(--x-sans); font-size: 1rem; line-height: 1.7; color: var(--x-ivory); opacity: 0.88; }
#planning .hr-evtype strong { color: var(--x-cream); font-weight: 500; }

/* ---- Questions: cream, two columns, gold hairlines between rows ---- */
main .hr-faqside { display: block; }
main .hr-faqside__head { position: static; text-align: center; }
main .hr-faqside__head .hr-eyebrow,
#getting-here .hr-eyebrow { justify-content: center; }
.hr-qa { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 64px; max-width: 1000px; margin: 46px auto 0; }
.hr-qa__item { padding: 28px 0; border-top: 1px solid rgba(201, 162, 39, 0.45); }
.hr-qa h3 { font-family: var(--x-sans); font-weight: 500; font-size: 1.05rem; line-height: 1.45; letter-spacing: 0; color: var(--x-pine); margin: 0 0 10px; }
.hr-qa p { font-family: var(--x-sans); font-size: 1rem; line-height: 1.7; color: var(--x-charcoal); margin: 0; }
.hr-qa a { color: var(--x-pine); text-decoration: underline; text-decoration-color: var(--x-gold); text-underline-offset: 3px; }
.hr-qa a:hover { color: var(--x-brass); }

/* ---- Getting here: a soft sage panel of four drive times ---- */
#getting-here .hr-info__getting {
  background: var(--x-sage); border-radius: 12px; max-width: 1000px; margin: 30px auto 0;
  padding: clamp(36px, 5vw, 56px); text-align: center;
}
#getting-here .hr-info__getting h2 { font-family: var(--x-serif); font-weight: 400; font-size: clamp(2rem, 3vw, 2.5rem); color: var(--x-pine); }
#getting-here .hr-lede { margin-inline: auto; }
#getting-here .hr-drivetimes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin-top: 34px; }
#getting-here .hr-drivetime { background: none; border: 0; border-radius: 0; box-shadow: none; padding: 6px 12px; }
#getting-here .hr-drivetime + .hr-drivetime { border-left: 1px solid rgba(184, 137, 43, 0.55); }
#getting-here .hr-drivetime__time { font-family: var(--x-serif); font-weight: 500; font-size: 2.2rem; color: var(--x-pine); }
#getting-here .hr-drivetime__time small { font-family: var(--x-sans); color: var(--x-pine); }
#getting-here .hr-drivetime__from { font-family: var(--x-sans); font-size: 0.75rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--x-taupe); }
#getting-here .hr-map { display: none; }

/* ---- Call to action: deep green, a gold double border, like a card ---- */
main .hr-enquiry { background: var(--x-pine); }
main .hr-enquiry__card { background: transparent; border: 3px double var(--x-gold); border-radius: 6px; box-shadow: none; max-width: 860px; }
#enquire .hr-head--center { margin-bottom: 0; }
#enquire .hr-head--center::before { content: ""; display: block; width: 180px; height: 14px; margin: 0 auto 24px; background: var(--x-rule); }
#enquire .hr-head--center::after {
  content: ""; display: block; width: 64px; height: 12px; margin: 30px auto 0;
  background: var(--x-star-gold) left center / 12px no-repeat, var(--x-star-gold) center / 12px no-repeat, var(--x-star-gold) right center / 12px no-repeat;
}
#enquire .hr-display { color: var(--x-cream); font-size: clamp(2.4rem, 4vw, 3.2rem); }
#enquire .hr-lede { color: var(--x-ivory); opacity: 0.9; max-width: 600px; }
#enquire .hr-btn--primary { background: var(--x-gold); color: var(--x-pine); border: 1px solid var(--x-gold); padding: 16px 34px; }
#enquire .hr-btn--primary:hover { background: var(--x-cream); color: var(--x-pine); border-color: var(--x-gold); transform: none; }

/* ---- Footer: deepest green, cream text, gold hovers ---- */
.hr-footer {
  --rm-head: var(--x-cream);
  --rm-text-light: #A99F8C;
  --rm-border: rgba(201, 162, 39, 0.3);
  --accent: var(--x-gold);
  position: relative; background: var(--x-deepest); color: var(--x-cream); border-top: 0; padding-top: 96px;
}
.hr-footer::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 26px; opacity: 0.35; pointer-events: none;
  background: radial-gradient(circle, var(--x-gold) 1.6px, transparent 2.2px) 0 12px / 34px 14px repeat-x;
}
.hr-footer::after {
  content: ""; position: absolute; top: 44px; left: 50%; transform: translateX(-50%);
  width: 180px; height: 14px; background: var(--x-rule); opacity: 0.8;
}
.hr-footer__col a, .hr-footer__col address { color: var(--x-cream); }
.hr-footer__col a:hover, .hr-footer__bottom a:hover { color: var(--x-gold); }
.hr-footer__maplink { color: var(--x-gold) !important; border-bottom-color: rgba(201, 162, 39, 0.45); }
.hr-footer__social a { color: var(--x-cream); }
.hr-footer__social a:hover { background: var(--x-gold); color: var(--x-pine); border-color: var(--x-gold); }
.hr-footer__acknow { color: #CFC6B4; }
.hr-footer__badge-row { background: var(--x-cream); border-radius: 12px; padding: 10px 14px; }
.hr-footer__bottom { font-family: var(--x-sans); color: var(--x-taupe); }

/* ---- Phones ---- */
@media (max-width: 760px) {
  .hr-xmas-cues { flex-direction: column; align-items: center; gap: 12px; }
  #planning .hr-evtypes, .hr-qa { grid-template-columns: 1fr; }
  #planning .hr-evtype { padding: 26px 4px; border-right: 0 !important; border-bottom: 1px solid rgba(201, 162, 39, 0.45); }
  #planning .hr-evtype:last-child { border-bottom: 0; }
  #getting-here .hr-drivetimes { grid-template-columns: repeat(2, 1fr); row-gap: 24px; }
  #getting-here .hr-drivetime:nth-child(3) { border-left: 0; }
  #packages .hr-note { text-align: center; }
  main .hr-btn, main .hr-herocta__btn { min-height: 48px; }
  main .hr-pkg__price { font-size: 2.2rem; }
}
