:root {
  --ink: #211c19;
  --espresso: #312821;
  --cocoa: #5c4a3d;
  --taupe: #8d7b6b;
  --sand: #d8c5a8;
  --oat: #efe4d2;
  --cream: #f7efe2;
  --linen: #fffaf2;
  --white: #fffdf8;
  --gold: #b68b4a;
  --tan: #b68b4a;
  --clay: #a06f4b;
  --forest: #312821;
  --muted: #756a60;
  --shadow: 0 24px 70px rgba(64, 49, 37, .16);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background:
    radial-gradient(circle at top left, rgba(182,139,74,.20), transparent 30rem),
    linear-gradient(180deg, var(--linen), var(--cream) 54%, #eadcc7);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
}

h1, h2, h3 {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 600;
  line-height: 1.02;
  margin: 0;
}

h1 { font-size: clamp(2.9rem, 6.2vw, 6.2rem); letter-spacing: -.055em; }
h2 { font-size: clamp(2.2rem, 4.3vw, 4.6rem); letter-spacing: -.045em; color: var(--espresso); }
h3 { font-size: 1.55rem; color: var(--espresso); }
p { margin: 0; }
a { color: inherit; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.5rem;
  padding: .85rem clamp(1.2rem, 4vw, 4.5rem);
  background: rgba(251,246,235,.82);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(49,40,33,.12);
}
.brand { display: inline-flex; align-items: center; gap: .85rem; text-decoration: none; }
.brand-wordmark { width: min(210px, 34vw); display: block; }
.brand-mark { width: clamp(2.25rem, 4.2vw, 3.2rem); display: block; }
nav { display: flex; align-items: center; gap: 1.4rem; font-size: .92rem; font-weight: 650; color: var(--espresso); }
nav a { text-decoration: none; }
nav a { padding: .65rem .75rem; border-radius: 999px; transition: background .2s ease, color .2s ease, box-shadow .2s ease; }

.section-pad { padding: clamp(4rem, 8vw, 8rem) clamp(1.2rem, 5vw, 5rem); }
.compact { padding-block: clamp(2rem, 5vw, 5rem); }
.eyebrow {
  text-transform: uppercase;
  letter-spacing: .18em;
  font-size: .78rem;
  font-weight: 800;
  color: var(--clay);
  margin-bottom: 1rem;
}
.lead { font-size: clamp(1.2rem, 2vw, 1.55rem); max-width: 46rem; color: rgba(255,255,255,.88); }

.hero {
  min-height: calc(108vh - 76px);
  padding-top: clamp(6rem, 10vw, 9rem);
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, .58fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  color: white;
  background:
    linear-gradient(90deg, rgba(35,28,24,.92), rgba(35,28,24,.64) 42%, rgba(35,28,24,.16)),
    url("assets/selected/hero/01_Bell_Tents_Day_405-Edit.webp") top right 18%/cover no-repeat;
}
.hero::before {
  content: "";
  position: absolute;
  inset: auto -8rem -14rem auto;
  width: min(60vw, 42rem);
  aspect-ratio: 1;
  background: url("assets/live/live-logo.png") center/contain no-repeat;
  opacity: .05;
  transform: rotate(-8deg);
  z-index: -1;
}
.hero h1 { max-width: 54rem; margin-bottom: 1.3rem; }
.hero .eyebrow { color: #ead7ad; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .9rem; margin-top: 2rem; }
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3.25rem;
  padding: .9rem 1.35rem;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 800;
}
.button.primary { background: var(--tan); color: #241d13; }
.button.secondary { border: 1px solid rgba(255,255,255,.45); color: white; }
.hero-card {
  align-self: stretch;
  display: grid;
  align-content: center;
  min-height: 27rem;
  padding: 2rem;
  border: 1px solid rgba(255,255,255,.30);
  border-radius: 2rem;
  background: rgba(35,28,24,.48);
  backdrop-filter: blur(18px);
  box-shadow: var(--shadow);
}
.hero-card img { width: 6.5rem; filter: brightness(0) invert(1) drop-shadow(0 12px 22px rgba(0,0,0,.2)); margin-bottom: 1.15rem; }
.hero-card h2 { color: white; font-size: clamp(2rem, 3.5vw, 3rem); margin-bottom: 1rem; }
.hero-card p { color: rgba(255,255,255,.84); font-size: 1.06rem; }

.intro-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin-top: -3rem;
  position: relative;
  z-index: 2;
}
.intro-grid article, .price-card, .sleeping, details, .contact-card {
  background: rgba(255,253,248,.88);
  border: 1px solid rgba(49,40,33,.11);
  border-radius: 1.4rem;
  box-shadow: 0 18px 50px rgba(49,40,33,.08);
}
.intro-grid article { padding: 1.45rem; }
.intro-grid span { color: var(--tan); font-weight: 900; }
.intro-grid h2 { font-size: 1.6rem; margin: .75rem 0 .55rem; letter-spacing: -.02em; }
.intro-grid p, .price-card p, .section-heading p, .split p, .timeline span, .service-areas p, details p, .contact p, footer p { color: var(--muted); }

.page-home #tents {
  padding-top: clamp(1.25rem, 2.5vw, 2.25rem);
  padding-bottom: clamp(1.5rem, 3vw, 2.75rem);
}
.page-home #tents .image-row { margin-top: 0; }
.page-home #occasions { padding-top: clamp(2rem, 4vw, 3.5rem); }

.section-heading { max-width: 58rem; margin-bottom: 2rem; }
.section-heading h2 { margin-bottom: 1rem; }
.cards { display: grid; gap: 1rem; }
.cards.four { grid-template-columns: repeat(4, 1fr); }
.cards.six { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; }
.price-card { padding: 0; min-height: 20rem; display: flex; flex-direction: column; overflow: hidden; }
.cards.six .price-card { min-height: 22rem; }
.card-photo { min-height: 12rem; background: var(--photo) center/cover no-repeat; border-bottom: 1px solid rgba(49,40,33,.10); }
.cards.six .card-photo { min-height: 13rem; }
.price-card .tag, .price-card h3, .price-card p:last-child { margin-left: 1.5rem; margin-right: 1.5rem; }
.price-card .tag { color: var(--clay); font-weight: 900; text-transform: uppercase; letter-spacing: .08em; font-size: .8rem; margin-top: 1.2rem; margin-bottom: .8rem; }
.price-card h3 { margin-bottom: .9rem; }
.price-card p:last-child { margin-top: auto; }
.price-card.featured { background: var(--espresso); color: white; }
.cards.four .price-card.featured { transform: translateY(-.8rem); }
.price-card.featured .card-photo { border-bottom-color: rgba(255,255,255,.12); }
.price-card.featured h3, .price-card.featured .tag { color: #f0d6a5; }
.price-card.featured p:last-child { color: rgba(255,255,255,.78); }
.sleeping {
  margin-top: 1rem;
  padding: 1.5rem;
  display: grid;
  grid-template-columns: .65fr 1fr 1fr;
  gap: 1rem;
  align-items: center;
}
.sleeping h3 { color: var(--clay); }
.sleeping strong { display: block; color: var(--espresso); margin-bottom: .25rem; }
.sleeping p { color: var(--muted); }
.page-bookings #booking-builder { padding-top: clamp(1.75rem, 3vw, 2.75rem); }

.split {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(300px, 1.1fr);
  gap: clamp(2rem, 6vw, 6rem);
  align-items: center;
}
.split h2 { margin-bottom: 1.2rem; }
.tick-list { list-style: none; padding: 0; margin: 1.7rem 0 0; display: grid; gap: .8rem; }
.tick-list li { position: relative; padding-left: 2rem; font-weight: 750; color: var(--espresso); }
.tick-list li::before { content: "✓"; position: absolute; left: 0; color: var(--clay); }
.photo-panel { display: grid; grid-template-columns: 1.1fr .9fr; grid-template-rows: 13rem 13rem; gap: 1rem; }
.photo-card {
  display: flex;
  align-items: end;
  padding: 1.2rem;
  border-radius: 1.5rem;
  color: white;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.6rem;
  background:
    linear-gradient(0deg, rgba(35,28,24,.70), rgba(35,28,24,.05)),
    var(--photo, url("assets/selected/hero/05_Bell_Tents_Day_215-Edit.webp")) center/cover no-repeat;
  box-shadow: var(--shadow);
}
.photo-card.large { grid-row: span 2; font-size: 2.5rem; }
.photo-card:nth-child(1) { --photo: url("assets/selected/services_interiors/03_Truly-Chic-coffee-table-view.webp"); }
.photo-card:nth-child(2) { --photo: url("assets/selected/weddings_venues/05_venetianorrington-FarleighHouseArchersOpenDay-17.webp"); }
.photo-card:nth-child(3) { --photo: url("assets/selected/lifestyle_details/06_Bell_Tents_Evening_75.webp"); }
.photo-card.muted { background: linear-gradient(0deg, rgba(35,28,24,.70), rgba(35,28,24,.05)), var(--photo) center/cover no-repeat; }

.timeline { background: rgba(255,253,248,.52); }
.timeline ol {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  counter-reset: steps;
}
.timeline li {
  counter-increment: steps;
  padding: 1.4rem;
  border-top: 3px solid var(--tan);
  background: rgba(255,253,248,.65);
  border-radius: 0 0 1.2rem 1.2rem;
}
.timeline li::before { content: counter(steps, decimal-leading-zero); display: block; color: var(--tan); font-weight: 900; margin-bottom: 1.2rem; }
.timeline strong { display: block; font-size: 1.2rem; color: var(--espresso); margin-bottom: .4rem; }
.timeline span { display: block; }

.service-areas { text-align: center; }
.service-areas h2 { max-width: 56rem; margin: 0 auto 1rem; }
.service-areas p { max-width: 38rem; margin: 0 auto; }
.area-pills { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; margin-top: 1.8rem; }
.area-pills span { padding: .75rem 1rem; border-radius: 999px; background: var(--espresso); color: white; font-weight: 800; }

.faq-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
details { padding: 1.2rem 1.35rem; }
summary { cursor: pointer; color: var(--espresso); font-weight: 900; font-size: 1.05rem; }
details p { margin-top: .75rem; }

.contact {
  display: grid;
  grid-template-columns: 1fr minmax(280px, .55fr);
  gap: 2rem;
  align-items: center;
  background: var(--espresso);
  color: white;
}
.contact h2 { color: white; margin-bottom: 1rem; }
.contact .eyebrow { color: #ead7ad; }
.contact p { color: rgba(255,255,255,.75); }
.contact-card { padding: 1.4rem; background: rgba(255,255,255,.10); border-color: rgba(255,255,255,.18); box-shadow: none; }
.contact-card a { display: block; color: white; font-weight: 900; font-size: 1.25rem; text-decoration: none; margin-bottom: .8rem; }


@media (max-width: 980px) {
  nav a:not(.nav-enquire) { display: none; }
  .hero, .split, .contact { grid-template-columns: 1fr; }
  .intro-grid, .cards.four, .cards.six, .timeline ol, .faq-grid { grid-template-columns: repeat(2, 1fr); }
  .sleeping { grid-template-columns: 1fr; }
  .hero-card { min-height: 20rem; }
}

@media (max-width: 640px) {
  .site-header { align-items: flex-start; }
  .brand img { width: 170px; }
  .intro-grid, .cards.four, .cards.six, .timeline ol, .faq-grid { grid-template-columns: 1fr; }
  .photo-panel { grid-template-columns: 1fr; grid-template-rows: repeat(3, 12rem); }
  .photo-card.large { grid-row: span 1; }
}

/* Additional prototype pages */
.page-hero {
  padding: clamp(4rem, 8vw, 7rem) clamp(1.2rem, 5vw, 5rem);
  background:
    linear-gradient(120deg, rgba(35,28,24,.92), rgba(35,28,24,.55)),
    url("assets/selected/hero/04_Bell_Tents_Evening_16.webp") center/cover no-repeat;
  color: white;
}
.page-hero h1 { max-width: 62rem; margin-bottom: 1rem; }
.page-hero .lead { color: rgba(255,255,255,.86); }
.page-hero .eyebrow { color: #ead7ad; }
.content-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 1.2rem; align-items: start; }
.panel, .booking-card, .blog-card, .form-card, .basket, .image-placeholder, .seo-card {
  background: rgba(255,253,248,.9);
  border: 1px solid rgba(46,66,43,.11);
  border-radius: 1.4rem;
  box-shadow: 0 18px 50px rgba(46,66,43,.08);
}
.panel { padding: 1.5rem; }
.optional-extras-card h3 { margin-bottom: .75rem; }
.event-grid, .blog-grid, .seo-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.booking-card, .blog-card, .seo-card { padding: 1.35rem; }
.blog-card { display: flex; flex-direction: column; }
.blog-card .image-placeholder + .article-meta { margin-top: 1.1rem; }
.blog-card .button { align-self: flex-start; margin-top: 1.1rem; }
.booking-card h3, .blog-card h3, .seo-card h3 { margin-bottom: .6rem; }
.booking-card p, .blog-card p, .form-card p, .basket p, .image-placeholder p, .seo-card p, .article-body p, .article-body li { color: var(--muted); }
.booking-card .button { margin-top: 1rem; }
.booking-options { display: grid; gap: 1rem; }
.shop-item { display: grid; grid-template-columns: 1fr auto; gap: 1rem; align-items: center; padding: 1rem; background: var(--linen); border: 1px solid rgba(46,66,43,.1); border-radius: 1rem; }
.shop-item strong { display: block; color: var(--forest); font-size: 1.1rem; }
.shop-item small { display: block; color: var(--clay); font-weight: 800; margin-top: .2rem; }
.shop-controls { display: flex; gap: .5rem; align-items: center; }
select, input, textarea {
  width: 100%;
  border: 1px solid rgba(46,66,43,.18);
  border-radius: .85rem;
  background: #fffdf8;
  padding: .8rem .9rem;
  font: inherit;
  color: var(--ink);
}
.shop-controls select { width: 5rem; }
button.button { border: 0; cursor: pointer; font: inherit; }
.basket { padding: 1.2rem; position: sticky; top: 6rem; }
.basket h2 { font-size: 2rem; margin-bottom: .7rem; }
.basket-list { list-style: none; padding: 0; margin: 1rem 0; display: grid; gap: .55rem; }
.basket-list li { display: flex; justify-content: space-between; gap: 1rem; border-bottom: 1px solid rgba(46,66,43,.11); padding-bottom: .45rem; }
.delivery-estimate-card { background: #fbf4e9; border: 1px solid rgba(199,160,100,.34); border-radius: 1rem; padding: .9rem; margin: 1rem 0; }
.delivery-estimate-card strong { display: block; color: var(--forest); margin-bottom: .35rem; }
.delivery-estimate-card p { margin: 0; font-size: .94rem; }
.form-card { padding: 1.5rem; margin-top: 1rem; }
.booking-details-card { max-width: 980px; margin: 1.2rem auto 2.2rem; }
.compact-heading { margin-top: 2.4rem; margin-bottom: 1.4rem; }
.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .9rem; }
.form-card h2 + .form-grid { margin-top: 1.25rem; }
.form-actions-panel { max-width: 980px; margin: 1.6rem auto 0; text-align: center; }
.form-actions-panel .notice { margin-left: auto; margin-right: auto; max-width: 720px; }
.form-grid .full { grid-column: 1 / -1; }
.date-field { position: relative; }
.date-input-wrap { display: grid; grid-template-columns: 1fr auto; gap: .5rem; align-items: center; }
.date-input-wrap input[readonly] { cursor: pointer; background: #fffdf8; }
.date-picker-trigger,
.date-nav,
.date-day {
  border: 1px solid rgba(46,66,43,.16);
  border-radius: .8rem;
  background: #fffdf8;
  color: var(--forest);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.date-picker-trigger { padding: .8rem .9rem; white-space: nowrap; }
.date-picker-popover {
  position: absolute;
  z-index: 20;
  left: 0;
  right: 0;
  top: calc(100% + .45rem);
  background: #fffdf8;
  border: 1px solid rgba(46,66,43,.18);
  border-radius: 1rem;
  box-shadow: 0 18px 40px rgba(43,35,26,.16);
  padding: .9rem;
}
.date-picker-head { display: grid; grid-template-columns: 2.5rem 1fr 2.5rem; gap: .5rem; align-items: center; text-align: center; margin-bottom: .7rem; }
.date-nav { height: 2.35rem; font-size: 1.35rem; line-height: 1; }
.date-nav:disabled { opacity: .35; cursor: not-allowed; }
.date-weekdays,
.date-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: .28rem; text-align: center; }
.date-weekdays { color: var(--muted); font-size: .78rem; font-weight: 800; margin-bottom: .35rem; }
.date-empty { min-height: 2.25rem; }
.date-day { min-height: 2.35rem; padding: .35rem 0; }
.date-day:hover:not(:disabled),
.date-day.selected { background: var(--tan); color: #241d13; }
.date-day.today { outline: 2px solid rgba(199,160,100,.55); outline-offset: 1px; }
.date-day:disabled { opacity: .28; cursor: not-allowed; text-decoration: line-through; }
.form-inline-action { display: flex; align-items: end; }
.form-inline-action .button { width: 100%; justify-content: center; }
.notice { background: #efe4d1; color: var(--forest); padding: 1rem; border-radius: 1rem; font-weight: 750; margin: 1rem 0; }
.image-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-top: 1.5rem; }
.image-placeholder {
  min-height: 16rem;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  justify-content: end;
  overflow: hidden;
  color: white;
  background:
    linear-gradient(0deg, rgba(35,28,24,.72), rgba(35,28,24,.05)),
    var(--photo, url("assets/selected/services_interiors/04_Bell_Tents_Day_61.webp")) center/cover no-repeat;
}
.image-placeholder.live-one { --photo: url("assets/selected/services_interiors/04_Bell_Tents_Day_61.webp"); }
.image-placeholder.live-two { --photo: url("assets/selected/services_interiors/01_Camp_Chic_10.webp"); }
.image-placeholder.live-three { --photo: url("assets/selected/services_interiors/02_Camp_Chic_14.webp"); }
.image-placeholder.event-photo { --photo: url("assets/selected/lifestyle_details/07_Bell_Tents_Evening_77.webp"); }
.image-placeholder.setup-photo { --photo: url("assets/selected/hero/05_Bell_Tents_Day_215-Edit.webp"); }
.image-placeholder.interior-photo { --photo: url("assets/selected/services_interiors/01_Camp_Chic_10.webp"); }
.image-placeholder.detail-photo { --photo: url("assets/selected/lifestyle_details/10_venetianorrington-FarleighHouseArchersOpenDay-128.webp"); }
.image-placeholder.wedding-photo { --photo: url("assets/selected/weddings_venues/03_Bell_Tents_Day_344.webp"); }
.image-placeholder.fire-photo { --photo: url("assets/selected/lifestyle_details/05_Bell_Tents_Evening_50.webp"); }
.image-placeholder strong { color: white; font-size: 1.25rem; }
.page-home #tents .image-placeholder strong { font-size: clamp(1rem, 1.6vw, 1.1rem); max-width: 14rem; line-height: 1.18; }
.image-placeholder p { color: rgba(255,255,255,.82); }
.article-body { max-width: 860px; margin: 0 auto; }
.article-body h2 { margin: 2rem 0 1rem; }
.article-body p { margin: 0 0 1rem; }
.article-body ul, .article-body ol { margin: 0 0 1.2rem; }
.article-photo {
  width: 100%;
  display: block;
  border-radius: 1.4rem;
  box-shadow: var(--shadow);
  object-fit: cover;
  margin: 1.4rem 0 2rem;
}
.article-photo-hero { max-height: 34rem; }
.article-image-row img {
  width: 100%;
  height: 22rem;
  object-fit: contain;
  background: rgba(255,250,242,.82);
  padding: .35rem;
  border-radius: 1.2rem;
  border: 1px solid rgba(49,40,33,.10);
  box-shadow: 0 14px 36px rgba(49,40,33,.08);
}
.article-image-pair { grid-template-columns: 1fr; gap: 1.4rem; }
.article-image-pair img { height: clamp(28rem, 58vw, 42rem); }
.article-meta { color: var(--clay); font-weight: 900; text-transform: uppercase; letter-spacing: .08em; font-size: .82rem; margin-bottom: 1rem; }
.video-placeholder { min-height: 22rem; border-radius: 1.4rem; background: linear-gradient(135deg, #233820, #c7a064); color: white; display: grid; place-items: center; text-align: center; padding: 2rem; box-shadow: var(--shadow); }
.check-list { list-style: none; padding: 0; display: grid; gap: .7rem; }
.check-list li { padding-left: 1.8rem; position: relative; color: var(--muted); }
.check-list li::before { content: "✓"; position: absolute; left: 0; color: var(--clay); font-weight: 900; }
@media (max-width: 980px) {
  .content-grid, .event-grid, .blog-grid, .seo-grid, .form-grid, .image-row { grid-template-columns: 1fr; }
  .basket { position: static; }
}

/* Footer and SEO landing page structure */
.site-footer {
  display: grid;
  grid-template-columns: minmax(240px, 1.2fr) repeat(2, minmax(170px, .65fr));
  gap: 2rem;
  padding: clamp(2.4rem, 5vw, 4rem) clamp(1.2rem, 5vw, 5rem);
  background: #211c19;
  color: white;
}
.footer-brand { display: grid; justify-items: start; }
.site-footer .footer-wordmark { width: 13rem; filter: brightness(0) invert(1); opacity: .94; }
.site-footer .footer-mark { width: 3.8rem; filter: none; opacity: .98; margin-top: .9rem; }
.site-footer p { color: rgba(255,255,255,.68); max-width: 28rem; margin-top: 1rem; }
.site-footer .footer-contact { margin-top: .85rem; line-height: 1.7; font-weight: 800; }
.site-footer .footer-contact a { color: rgba(255,255,255,.88); text-decoration: none; }
.site-footer .footer-contact a:hover { color: white; text-decoration: underline; }
.site-footer .footer-social { margin-top: .85rem; display: flex; gap: .65rem; align-items: center; }
.site-footer .social-icon {
  width: 2.35rem;
  height: 2.35rem;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px;
  color: var(--sand);
  background: rgba(255,255,255,.06);
  text-decoration: none;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}
.site-footer .social-icon svg { width: 1.15rem; height: 1.15rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.site-footer .social-icon.facebook svg { fill: currentColor; stroke: none; }
.site-footer .social-icon:hover { color: white; background: rgba(255,255,255,.13); transform: translateY(-1px); }
.footer-links { display: grid; align-content: start; gap: .45rem; }
.footer-links strong { color: var(--sand); margin-bottom: .35rem; }
.footer-links a { color: rgba(255,255,255,.78); text-decoration: none; }
.footer-links a:hover { color: white; text-decoration: underline; }

.page-home .hero { background:
  linear-gradient(90deg, rgba(35,28,24,.92), rgba(35,28,24,.64) 42%, rgba(35,28,24,.16)),
  url("assets/selected/hero/01_Bell_Tents_Day_405-Edit.webp") center right 18%/cover no-repeat;
}
.page-bookings .page-hero { background:
  linear-gradient(120deg, rgba(35,28,24,.88), rgba(35,28,24,.42)),
  url("assets/selected/hero/03_Bell_Tents_Day_427-Edit.webp") center/cover no-repeat;
  background-position: center 65%;
}
.page-weddings .page-hero { background:
  linear-gradient(120deg, rgba(35,28,24,.90), rgba(35,28,24,.42)),
  url("assets/selected/weddings_venues/03_Bell_Tents_Day_344.webp") center 58%/cover no-repeat;
}
.page-festivals .page-hero { background:
  linear-gradient(120deg, rgba(35,28,24,.90), rgba(35,28,24,.40)),
  url("assets/selected/hero/02_Bell_Tents_Evening_32-copy.webp") center 58%/cover no-repeat;
}
.page-blogs .page-hero, .page-blog .page-hero { background:
  linear-gradient(120deg, rgba(35,28,24,.88), rgba(35,28,24,.40)),
  url("assets/selected/lifestyle_details/05_Bell_Tents_Evening_50.webp") center/cover no-repeat;
}
.page-enquire .page-hero { background:
  linear-gradient(120deg, rgba(35,28,24,.88), rgba(35,28,24,.38)),
  url("assets/selected/services_interiors/02_Camp_Chic_14.webp") center/cover no-repeat;
}
.page-area .page-hero { background:
  linear-gradient(120deg, rgba(35,28,24,.88), rgba(35,28,24,.38)),
  url("assets/user-uploaded/1779205978103-19c2c5db-PXL-20250621-130223010-2.jpg") center 48%/cover no-repeat;
}
.page-area-somerset .page-hero { background-image: linear-gradient(120deg, rgba(35,28,24,.88), rgba(35,28,24,.38)), url("assets/user-uploaded/1779205978103-19c2c5db-PXL-20250621-130223010-2.jpg"); }
.page-area-bath .page-hero { background-image: linear-gradient(120deg, rgba(35,28,24,.88), rgba(35,28,24,.38)), url("assets/user-uploaded/1779205978103-19c2c5db-PXL-20250621-130223010-2.jpg"); }
.page-area-bristol .page-hero { background-image: linear-gradient(120deg, rgba(35,28,24,.88), rgba(35,28,24,.38)), url("assets/user-uploaded/1779205978103-19c2c5db-PXL-20250621-130223010-2.jpg"); }
.page-area-wiltshire .page-hero { background-image: linear-gradient(120deg, rgba(35,28,24,.88), rgba(35,28,24,.38)), url("assets/user-uploaded/1779205978103-19c2c5db-PXL-20250621-130223010-2.jpg"); }
.page-area-dorset .page-hero { background-image: linear-gradient(120deg, rgba(35,28,24,.88), rgba(35,28,24,.38)), url("assets/user-uploaded/1779205978103-19c2c5db-PXL-20250621-130223010-2.jpg"); }
.page-area-gloucestershire .page-hero { background-image: linear-gradient(120deg, rgba(35,28,24,.88), rgba(35,28,24,.38)), url("assets/user-uploaded/1779205978103-19c2c5db-PXL-20250621-130223010-2.jpg"); }

.enquiry-form { max-width: 960px; margin-inline: auto; }
.website-field {
  position: absolute;
  left: -9999px;
  opacity: 0;
  pointer-events: none;
}
@media (max-width: 760px) {
  .site-footer { grid-template-columns: 1fr; }
}

/* Wedding and festival landing pages */
.event-hero { min-height: clamp(31rem, 62vh, 42rem); display: grid; align-content: center; }
.event-intro .tick-list { margin-bottom: 0; }
.event-photo-stack {
  display: grid;
  grid-template-columns: 1fr .82fr;
  gap: 1rem;
  align-items: end;
}
.event-photo-stack img {
  width: 100%;
  height: clamp(23rem, 42vw, 36rem);
  object-fit: cover;
  border-radius: 1.4rem;
  box-shadow: var(--shadow);
}
.event-photo-stack img:nth-child(2) {
  height: clamp(17rem, 31vw, 27rem);
  transform: translateY(2rem);
}
.event-band { background: rgba(255,253,248,.54); }
.event-steps .seo-card span {
  display: inline-block;
  color: var(--tan);
  font-weight: 900;
  margin-bottom: .7rem;
}
.event-content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
  gap: clamp(1.4rem, 4vw, 3rem);
  align-items: start;
}
.event-content-grid h2 { margin-bottom: 1rem; }
.event-content-grid p { color: var(--muted); }
.event-list-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1.5rem;
}
.event-list-grid article {
  padding: 1.25rem;
  border-radius: 1.2rem;
  background: rgba(255,253,248,.78);
  border: 1px solid rgba(49,40,33,.10);
}
.event-list-grid h3 { margin-bottom: .55rem; }
.event-side-panel {
  position: sticky;
  top: 6rem;
  display: grid;
  gap: .75rem;
}
.event-side-panel h3 { margin-bottom: .3rem; }
.button.secondary.dark {
  border-color: rgba(49,40,33,.22);
  color: var(--espresso);
  background: rgba(255,253,248,.74);
}
.event-faqs { padding-top: clamp(2rem, 5vw, 4rem); }
@media (max-width: 980px) {
  .event-content-grid, .event-photo-stack { grid-template-columns: 1fr; }
  .event-photo-stack img:nth-child(2) { transform: none; }
  .event-side-panel { position: static; }
}
@media (max-width: 640px) {
  .event-list-grid { grid-template-columns: 1fr; }
  .event-photo-stack img, .event-photo-stack img:nth-child(2) { height: 18rem; }
}

/* Clickable tent galleries */
.gallery-trigger {
  width: 100%;
  border: 0;
  cursor: pointer;
  position: relative;
  display: block;
}
.gallery-trigger::after {
  content: "View gallery";
  position: absolute;
  right: .85rem;
  bottom: .85rem;
  padding: .45rem .7rem;
  border-radius: 999px;
  background: rgba(35,28,24,.82);
  color: white;
  font-size: .78rem;
  font-weight: 850;
  letter-spacing: .02em;
}
.gallery-modal {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: none;
  place-items: center;
  padding: 1.2rem;
  background: rgba(20,16,14,.72);
  backdrop-filter: blur(10px);
}
.gallery-modal.open { display: grid; }
.gallery-dialog {
  width: min(980px, 96vw);
  max-height: 92vh;
  overflow: auto;
  padding: clamp(1rem, 3vw, 1.8rem);
  border-radius: 1.8rem;
  background: var(--linen);
  box-shadow: 0 30px 90px rgba(0,0,0,.34);
  position: relative;
}
.gallery-close {
  position: absolute;
  top: .9rem;
  right: .9rem;
  width: 2.5rem;
  height: 2.5rem;
  border: 0;
  border-radius: 999px;
  background: var(--espresso);
  color: white;
  font-size: 1.7rem;
  cursor: pointer;
}
.gallery-frame {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: .8rem;
  align-items: center;
  margin-top: 1rem;
}
.gallery-frame img {
  width: 100%;
  max-height: 62vh;
  object-fit: contain;
  border-radius: 1.1rem;
  background: #eadcc7;
}
.gallery-nav {
  width: 2.6rem;
  height: 4rem;
  border: 0;
  border-radius: 999px;
  background: var(--espresso);
  color: white;
  font-size: 2.2rem;
  cursor: pointer;
}
.gallery-caption { color: var(--muted); margin-top: .9rem; }
.gallery-dots { display: flex; justify-content: center; gap: .45rem; margin-top: .9rem; }
.gallery-dots button {
  width: .7rem;
  height: .7rem;
  border: 0;
  border-radius: 999px;
  background: rgba(49,40,33,.28);
  cursor: pointer;
}
.gallery-dots button.active { background: var(--espresso); }
.extra-picker {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) 5.5rem minmax(0, 1fr) auto;
  gap: .75rem;
  align-items: end;
  padding: 1rem;
  background: var(--linen);
  border: 1px solid rgba(46,66,43,.1);
  border-radius: 1rem;
}
.extra-picker label { display: grid; gap: .25rem; font-weight: 800; color: var(--espresso); }
.extra-picker select { width: 100%; }
@media (max-width: 760px) {
  .gallery-frame { grid-template-columns: 1fr; }
  .gallery-nav { width: 100%; height: 2.8rem; }
  .extra-picker { grid-template-columns: 1fr; }
}
.extra-rows { display: grid; gap: .75rem; margin-top: 1rem; }
.extra-picker.extra-added { opacity: .78; }
.extra-picker.extra-added select { background: #f0eadf; }
.extra-picker button:disabled { cursor: default; background: var(--taupe); color: white; }
.basket .button.secondary,
.manager-actions .button.secondary {
  border: 1px solid rgba(49,40,33,.22);
  color: var(--espresso);
  background: rgba(255,253,248,.72);
}

/* --------------------------------------------------------------------------
   Warm Wix-inspired colour/theme variant — corrected 2026-06-02
   IMPORTANT: this block intentionally contains no photo URLs and no image
   filters. Photo choices, positions and image treatments stay identical to the
   first local website; only colours/cards/buttons/text chrome are warmed.
---------------------------------------------------------------------------- */
:root {
  --ink: #2f241d;
  --espresso: #4a3627;
  --cocoa: #765b46;
  --taupe: #a88f78;
  --sand: #ead5ad;
  --oat: #f7ecd8;
  --cream: #fff4df;
  --linen: #fffaf0;
  --white: #fffefa;
  --gold: #d8a447;
  --tan: #e0ad58;
  --clay: #bd7447;
  --forest: #75613f;
  --muted: #776557;
  --shadow: 0 22px 58px rgba(116, 83, 45, .14);
}

body {
  background:
    radial-gradient(circle at top left, rgba(247, 204, 117, .34), transparent 30rem),
    radial-gradient(circle at 85% 10%, rgba(255, 255, 255, .86), transparent 24rem),
    linear-gradient(180deg, #fffaf0 0%, #fff3dc 45%, #f7e5c6 100%);
}

.site-header {
  background: rgba(255, 250, 240, .94);
  border-bottom-color: rgba(205, 157, 73, .24);
  box-shadow: 0 10px 30px rgba(116, 83, 45, .07);
}
.brand-wordmark { width: min(230px, 38vw); }
nav { color: #6a4b31; }
nav a:hover, nav a:focus-visible { background: rgba(224, 173, 88, .16); color: #4b321f; }

h2, h3 { color: #5a3d29; }
.eyebrow { color: #b56b3f; }
.hero .eyebrow { color: #ffe1a5; }
.hero h1 { text-shadow: 0 3px 18px rgba(49, 34, 24, .24); }
.lead { color: rgba(255, 250, 240, .94); }
.button.primary {
  background: linear-gradient(135deg, #ffd37a, #d99c3f);
  color: #392515;
  box-shadow: 0 12px 28px rgba(102, 66, 26, .20);
}
.button.secondary {
  background: rgba(255, 250, 240, .14);
  border-color: rgba(255,255,255,.70);
  color: #fffaf0;
}

.intro-grid article, .price-card, .sleeping, details, .contact-card,
.booking-panel, .event-card, .option-card, .summary-card, .blog-card {
  background-color: rgba(255, 254, 250, .92);
  border-color: rgba(205, 157, 73, .20);
  box-shadow: 0 18px 46px rgba(116, 83, 45, .10);
}
.intro-grid article { border-radius: 1.75rem; }
.intro-grid span, .price-card .tag { color: #c47b35; }
.price-card { border-radius: 1.65rem; }
.price-card.featured { background: linear-gradient(160deg, #68492f, #3f2c20); }
.price-card.featured h3, .price-card.featured .tag { color: #ffd58c; }
.photo-card { border-radius: 1.9rem; box-shadow: 0 22px 50px rgba(116, 83, 45, .16); }
.timeline { background-color: rgba(255,253,248,.58); }
.timeline li strong { color: #5a3d29; }
.service-areas { background-color: rgba(255, 254, 250, .42); }
footer { background-color: #4b321f; color: #fff8eb; }
footer p, footer a { color: rgba(255, 248, 235, .82); }

input, select, textarea, .field-input {
  border-color: rgba(205, 157, 73, .32) !important;
  background-color: rgba(255, 254, 250, .96) !important;
}
input:focus, select:focus, textarea:focus, .field-input:focus {
  outline: 2px solid rgba(224, 173, 88, .28) !important;
  border-color: #d89c3f !important;
}

/* 2026-06-02 Jess preference: homepage hero side card should keep the warmer,
   brighter beige/yellow fill from the earlier warm mockup. */
.hero-card {
  background: linear-gradient(160deg, rgba(255, 238, 194, .94), rgba(246, 210, 133, .88));
  color: #4b321f;
  border-color: rgba(255, 255, 255, .66);
  box-shadow: 0 24px 70px rgba(86, 54, 26, .22);
}
.hero-card img { filter: none; }
.hero-card h2 { color: #5a3d29; }
.hero-card p { color: #705844; }

/* 2026-06-02 Jess correction: hero side card should match the top banner
   colour, not the brighter yellow version. */
.hero-card {
  background: rgba(255, 250, 240, .94);
  color: #4b321f;
  border-color: rgba(205, 157, 73, .24);
  box-shadow: 0 18px 46px rgba(116, 83, 45, .14);
}
.hero-card img { filter: none; }
.hero-card h2 { color: #5a3d29; }
.hero-card p { color: #705844; }

/* 2026-06-02 Jess correction: overlays were stealing the magic from the photos.
   Keep enough shade for text legibility, but let the images sell the site. */
.hero,
.page-home .hero {
  background-image:
    linear-gradient(90deg, rgba(35,28,24,.58), rgba(35,28,24,.28) 42%, rgba(35,28,24,.04)),
    url("assets/selected/hero/01_Bell_Tents_Day_405-Edit.webp");
}
.page-hero,
.page-bookings .page-hero,
.page-blogs .page-hero,
.page-blog .page-hero,
.page-enquire .page-hero,
.page-area .page-hero {
  background-image:
    linear-gradient(120deg, rgba(35,28,24,.54), rgba(35,28,24,.16)),
    var(--hero-photo, url("assets/selected/hero/04_Bell_Tents_Evening_16.webp"));
}
.photo-card,
.photo-card.muted {
  background-image:
    linear-gradient(0deg, rgba(35,28,24,.38), rgba(35,28,24,.02)),
    var(--photo, url("assets/selected/hero/05_Bell_Tents_Day_215-Edit.webp"));
}
.image-placeholder {
  background-image:
    linear-gradient(0deg, rgba(35,28,24,.42), rgba(35,28,24,.04)),
    var(--photo, url("assets/selected/services_interiors/04_Bell_Tents_Day_61.webp"));
}
.hero h1, .page-hero h1 { text-shadow: 0 3px 16px rgba(35,28,24,.34); }
.photo-card, .image-placeholder { text-shadow: 0 2px 10px rgba(35,28,24,.34); }

/* 2026-06-02 Jess correction: Tent and interior choice cards felt cramped,
   with the description pushed hard to the bottom. Give card text more air. */
.cards.six .price-card {
  min-height: 23.5rem;
  padding-bottom: 1.55rem;
}
.cards.six .price-card .tag {
  margin-top: 1.35rem;
  margin-bottom: .55rem;
}
.cards.six .price-card h3 {
  margin-bottom: .65rem;
}
.cards.six .price-card p:last-child {
  margin-top: 0;
  margin-bottom: 0;
  line-height: 1.55;
  max-width: 92%;
}

/* 2026-06-02 Jess request: place the Camp Chic logo underneath the copy in
   the homepage “Delivered, erected & styled” card. */
.hero-card .hero-card-logo {
  width: min(13rem, 78%);
  margin: 1.6rem 0 0;
  filter: none;
  opacity: .96;
}

/* 2026-06-02 Jess correction: use only the tent icon at the bottom of the
   homepage hero side card, not the full Camp Chic wordmark. */
.hero-card .hero-card-icon {
  width: 4.4rem;
  margin: 1.65rem auto 0;
  display: block;
  filter: none;
  opacity: .98;
}

/* 2026-06-02 Jess reset: undo the homepage hero side-card bottom logo/icon
   experiment and return the card content to the original arrangement. */
.hero-card > img:not(.hero-card-logo) {
  width: 6.5rem;
  margin: 0 0 1.15rem;
}

/* 2026-06-02 Jess annotated screenshot: copy the same small tent icon/mark
   used beside the header logo into the marked X position in the hero card. */
.hero-card .hero-card-x-icon {
  width: clamp(3.2rem, 5.2vw, 4.7rem);
  margin: 1.35rem auto 0;
  display: block;
  filter: none;
  opacity: .98;
}

/* 2026-06-02 Jess correction: X-position tent icon is correct, but should be
   about one third of the previous size. */
.hero-card .hero-card-x-icon {
  width: clamp(1.05rem, 1.75vw, 1.55rem);
  margin-top: 1.25rem;
}

/* Hard override after Safari/cache issue: keep X-position tent icon tiny. */
.hero-card img.hero-card-x-icon {
  width: 1.35rem !important;
  max-width: 1.35rem !important;
  height: auto !important;
}

/* 2026-06-02 Jess correction: not tiny — set X-position tent icon to a true
   one-third-ish size relative to the original large mark. */
.hero-card img.hero-card-x-icon {
  width: 2.2rem !important;
  max-width: 2.2rem !important;
  height: auto !important;
}

/* 2026-06-02 Jess adjustment: icon slightly bigger again, with more space
   between the paragraph and the tent mark. */
.hero-card img.hero-card-x-icon {
  width: 2.75rem !important;
  max-width: 2.75rem !important;
  height: auto !important;
  margin-top: 2rem !important;
}

/* 2026-06-02 Jess request: replace the three For Every Occasion images with
   one 8-slot gallery that rotates every 3 seconds and stays Photo Manager-editable. */
.occasion-gallery {
  border-radius: 2rem;
  overflow: hidden;
  background: rgba(255, 254, 250, .92);
  border: 1px solid rgba(205, 157, 73, .20);
  box-shadow: 0 22px 50px rgba(116, 83, 45, .16);
}
.occasion-gallery-frame {
  position: relative;
  min-height: clamp(24rem, 42vw, 36rem);
  background: #eadcc7;
}
.occasion-gallery-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity .85s ease;
}
.occasion-gallery-slide.is-active { opacity: 1; }
.occasion-gallery-caption {
  display: grid;
  gap: .25rem;
  padding: 1.15rem 1.35rem;
}
.occasion-gallery-caption strong {
  color: #5a3d29;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.35rem;
}
.occasion-gallery-caption span { color: var(--muted); font-weight: 650; }
@media (max-width: 820px) {
  .occasion-gallery-frame { min-height: 22rem; }
}

/* 2026-06-02 Jess request: remove the text banner under the For Every Occasion gallery. */
.occasion-gallery-caption { display: none !important; }

/* 2026-06-02 Jess request: remove the homepage side card and make the hero
   shallower so the three intro boxes are visible below the fold. */
.page-home .hero {
  min-height: clamp(30rem, 68vh, 42rem);
  grid-template-columns: minmax(0, 1fr);
  align-content: center;
  padding-top: clamp(3rem, 6vw, 5.5rem);
  padding-bottom: clamp(5rem, 7vw, 6.5rem);
}
.page-home .hero-copy { max-width: 58rem; }
.page-home .lead { max-width: 50rem; }
.page-home .intro-grid { margin-top: -4.25rem; }
@media (max-width: 820px) {
  .page-home .hero { min-height: 32rem; padding-bottom: 5.25rem; }
  .page-home .intro-grid { margin-top: -2.75rem; }
}

/* 2026-06-02 Jess correction: homepage hero was cropped too aggressively at
   the bottom and the intro cards were cramped against it. Show more tent/base
   area, crop more from the top, and give the cards breathing room. */
.page-home .hero {
  min-height: clamp(35rem, 76vh, 48rem);
  background-position: center 34% !important;
  padding-bottom: clamp(3.75rem, 5.5vw, 5rem);
}
.page-home .intro-grid {
  margin-top: clamp(1.25rem, 2.6vw, 2.25rem);
}
@media (max-width: 820px) {
  .page-home .hero {
    min-height: 36rem;
    background-position: center 36% !important;
    padding-bottom: 4rem;
  }
  .page-home .intro-grid { margin-top: 1.25rem; }
}

/* 2026-06-02 Jess correction: reduce the gap again and show more of the lower
   tent area in the homepage hero image. */
.page-home .hero {
  min-height: clamp(37rem, 80vh, 51rem);
  background-position: center bottom !important;
  padding-bottom: clamp(2.25rem, 3.5vw, 3.25rem);
}
.page-home .intro-grid {
  margin-top: clamp(.35rem, 1vw, .9rem);
}
@media (max-width: 820px) {
  .page-home .hero {
    min-height: 38rem;
    background-position: center bottom !important;
    padding-bottom: 2.75rem;
  }
  .page-home .intro-grid { margin-top: .5rem; }
}

/* 2026-06-02 Jess correction: still too much gap below the homepage hero, and
   the crop shows too much grass. Tighten the boxes back up and show more trees. */
.page-home .hero {
  background-position: center 48% !important;
  padding-bottom: clamp(1.5rem, 2.4vw, 2.25rem);
}
.page-home .intro-grid {
  margin-top: clamp(-.75rem, -1vw, -.25rem);
}
@media (max-width: 820px) {
  .page-home .hero {
    background-position: center 40% !important;
    padding-bottom: 1.75rem;
  }
  .page-home .intro-grid { margin-top: -.35rem; }
}

/* 2026-06-02 Jess fine-tune: previous crop went too far. Nudge homepage hero
   image slightly back up to reveal more of the left tent/right-hand side. */
.page-home .hero {
  background-position: center 48% !important;
}
@media (max-width: 820px) {
  .page-home .hero { background-position: center 46% !important; }
}

/* 2026-06-02 Jess request: move homepage hero text higher so it does not cover
   the tents; final crop/text position can now be controlled in Photo Manager. */
.page-home .hero-copy {
  transition: transform .2s ease;
}
.page-home .hero {
  background-position: center 50% !important;
}

/* 2026-06-02: homepage hero controls helper spacing in Photo Manager. */
.hero-preview-actions { margin: 1rem 0 0; }

/* Keep Photo Manager easy to return to while previewing local edits. */
.back-to-photo-manager {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 50;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .75rem 1rem;
  border-radius: 999px;
  background: rgba(255,250,240,.94);
  color: #4b321f;
  border: 1px solid rgba(205,157,73,.32);
  box-shadow: 0 12px 32px rgba(49,40,33,.18);
  font-weight: 850;
  text-decoration: none;
}

/* 2026-06-02 Jess fine-tune: liked the current homepage hero variant, but wants
   a little more grass visible at the bottom. */
.page-home .hero {
  background-position: center 53% !important;
}

/* 2026-06-02 Jess: previous grass nudge was not visible enough. Move homepage
   hero crop further down to show more grass at the bottom. */
.page-home .hero {
  background-position: center 58% !important;
}

/* 2026-06-02 Jess fine-tune: keep more grass visible, but crop a little from
   the top / reduce hero height so the three intro boxes are visible again. */
.page-home .hero {
  min-height: clamp(34.5rem, 72vh, 45rem);
  background-position: center 58% !important;
  padding-bottom: clamp(1.35rem, 2.2vw, 2rem);
}
.page-home .intro-grid {
  margin-top: clamp(-1.1rem, -1.5vw, -.55rem);
}
@media (max-width: 820px) {
  .page-home .hero {
    min-height: 34.5rem;
    background-position: center 58% !important;
  }
}

/* 2026-06-02 Jess fine-tune: previous crop lost the grass again. Make the hero
   image area slightly taller to recover bottom grass, while keeping intro boxes
   close/peeking below. */
.page-home .hero {
  min-height: clamp(36rem, 76vh, 48rem);
  background-position: center 58% !important;
  padding-bottom: clamp(1.1rem, 1.8vw, 1.7rem);
}
.page-home .intro-grid {
  margin-top: clamp(-1.6rem, -2.1vw, -.95rem);
}
@media (max-width: 820px) {
  .page-home .hero {
    min-height: 36rem;
    background-position: center 58% !important;
    padding-bottom: 1.25rem;
  }
  .page-home .intro-grid { margin-top: -1rem; }
}

/* 2026-06-02 Jess correction: do NOT make the homepage hero taller. Keep the
   hero area controlled so the three boxes remain visible, crop from the top,
   and shift the photo down within the same box so there is grass/space beneath
   the tents. */
.page-home .hero {
  min-height: clamp(34.5rem, 72vh, 45rem) !important;
  background-position: center 64% !important;
  padding-bottom: clamp(1.15rem, 1.9vw, 1.75rem) !important;
}
.page-home .hero-copy {
  transform: translateY(-42px) !important;
}
.page-home .intro-grid {
  margin-top: clamp(-1.15rem, -1.6vw, -.65rem) !important;
}
@media (max-width: 820px) {
  .page-home .hero {
    min-height: 34.5rem !important;
    background-position: center 64% !important;
  }
}

/* 2026-06-02 Jess correction: keep the controlled hero area, move the image up
   inside it to reveal more grass at the bottom, and lift the text higher. */
.page-home .hero {
  min-height: clamp(34.5rem, 72vh, 45rem) !important;
  background-position: center 72% !important;
}
.page-home .hero-copy {
  transform: translateY(-62px) !important;
}

/* 2026-06-02 Jess fine-tune: current crop/text is better; make the homepage
   hero area slightly longer so the tent is less obscured by the text. */
.page-home .hero {
  min-height: clamp(36rem, 75vh, 47rem) !important;
  background-position: center 72% !important;
}
.page-home .hero-copy {
  transform: translateY(-62px) !important;
}

/* 2026-06-02 Jess fine-tune: keep current hero size/crop, lift homepage hero
   text slightly higher again. */
.page-home .hero-copy {
  transform: translateY(-74px) !important;
}

/* 2026-06-02 Jess fine-tune: lift homepage hero text a little bit more. */
.page-home .hero-copy {
  transform: translateY(-84px) !important;
}

/* 2026-06-02 Jess: previous text lift was not visible enough. Force a more
   noticeable lift of the homepage hero text. */
.page-home .hero-copy {
  transform: translateY(-112px) !important;
}

/* 2026-06-02 saved homepage hero position after Jess approval. */
.page-home .hero {
  background-position: center 72% !important;
}
.page-home .hero-copy {
  transform: translateY(-112px) !important;
}

/* 2026-06-02 Jess request: rounded golden buttons should be a softer,
   lighter golden-brown rather than bright gold/yellow. */
:root {
  --gold: #bf8f59;
  --tan: #bf8f59;
}
.button.primary,
.manager-actions .button.primary,
.hero-actions .button.primary {
  background: linear-gradient(135deg, #d2a571, #ad7848) !important;
  color: #382416 !important;
  box-shadow: 0 12px 26px rgba(91, 56, 28, .18);
}
.button.primary:hover,
.button.primary:focus-visible {
  background: linear-gradient(135deg, #d8b07f, #b98250) !important;
}
.date-day.selected {
  background: #bf8f59 !important;
  color: #382416 !important;
}

/* 2026-06-02 Jess fine-tune: golden-brown buttons were making dark text a bit
   hard to read. Lighten slightly while keeping the brown/gold direction. */
:root {
  --gold: #c99b66;
  --tan: #c99b66;
}
.button.primary,
.manager-actions .button.primary,
.hero-actions .button.primary {
  background: linear-gradient(135deg, #ddb789, #c1905a) !important;
  color: #2f2016 !important;
}
.button.primary:hover,
.button.primary:focus-visible {
  background: linear-gradient(135deg, #e4c197, #c99a67) !important;
}
.date-day.selected {
  background: #c99b66 !important;
  color: #2f2016 !important;
}

/* 2026-06-02 Jess request: add clear Bookings CTA under How Booking Works. */
.section-actions.centered-actions {
  display: flex;
  justify-content: center;
  margin-top: 1.6rem;
}

/* 2026-06-02: booking route as two single-choice buttons. */
.booking-route-choice {
  border: 0;
  padding: 0;
  margin: 0;
  display: grid;
  gap: .55rem;
  align-content: start;
}
.booking-route-choice legend {
  font-family: inherit;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .04em;
  color: var(--ink);
  margin-bottom: .35rem;
}
.route-choice {
  appearance: none;
  border: 1px solid rgba(82, 55, 37, .24);
  border-radius: 999px;
  background: rgba(255, 253, 246, .78);
  color: var(--ink);
  padding: .85rem 1rem;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 10px 24px rgba(76, 52, 32, .08);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
}
.route-choice:hover,
.route-choice:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(76, 52, 32, .13);
  outline: none;
}
.route-choice.is-selected {
  background: var(--button-bg);
  border-color: rgba(82, 55, 37, .38);
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.32), 0 14px 30px rgba(76, 52, 32, .14);
}


/* Jess review pass - contact, gallery and review refinements */
.blog-listing-section { padding-top: clamp(1.4rem, 3vw, 2.6rem); }
.reviews-section { background: rgba(255,253,248,.54); }
.review-carousel { position: relative; min-height: 14.5rem; max-width: 820px; margin: 0 auto; }
.review-slide { position: absolute; inset: 0; opacity: 0; transform: translateY(10px); transition: opacity .6s ease, transform .6s ease; background: rgba(255,253,248,.92); border: 1px solid rgba(49,40,33,.11); border-radius: 1.5rem; box-shadow: 0 18px 50px rgba(49,40,33,.08); padding: clamp(1.25rem, 2.5vw, 1.8rem); display: grid; align-content: center; }
.review-slide.is-active { opacity: 1; transform: translateY(0); z-index: 1; }
.review-slide p { font-family: Georgia, 'Times New Roman', serif; color: var(--espresso); font-size: clamp(1.12rem, 2vw, 1.45rem); line-height: 1.35; margin-bottom: 1.1rem; }
.review-slide strong { color: var(--forest); font-size: 1.05rem; }
.review-slide span { color: var(--clay); font-weight: 900; margin-top: .3rem; }
.contact-form .human-check { margin-bottom: .75rem; }
.contact-form .button[type='submit'], .contact-form + .image-row { margin-top: 1.25rem; }
.direct-contact-card { margin-top: 1.6rem; }
.direct-contact-card h2 { margin-bottom: .9rem; }
.direct-contact-card h2 + p { margin-top: 0; margin-bottom: 1.25rem; }
.page-contact .image-row { margin-top: 1.8rem; }


/* Jess mobile/review refinement pass */
.hero-location-line { font-size: clamp(.82rem, 1.1vw, .98rem); letter-spacing: .17em; }
.page-home #occasions { align-items: start; }
.page-home #occasions > div:first-child { padding-top: .15rem; }
.review-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; max-width: 1100px; margin: 0 auto; }
.review-card { background: rgba(255,253,248,.92); border: 1px solid rgba(49,40,33,.11); border-radius: 1.35rem; box-shadow: 0 18px 50px rgba(49,40,33,.08); padding: clamp(1.1rem, 2vw, 1.55rem); }
.review-card p { font-family: Georgia, 'Times New Roman', serif; color: var(--espresso); font-size: clamp(1rem, 1.45vw, 1.22rem); line-height: 1.38; margin-bottom: .95rem; }
.review-card strong { display:block; color: var(--forest); font-size: 1rem; }
.review-card span { display:block; color: var(--clay); font-weight: 900; margin-top: .25rem; }
.social-icon { width: 3.15rem; height: 3.15rem; }
.social-icon svg { width: 1.8rem; height: 1.8rem; }
@media(max-width: 760px){
  .review-grid { grid-template-columns: 1fr; }
  .hero-location-line { font-size: .78rem; letter-spacing: .12em; }
  .hero { min-height: 94vh; padding-top: 5.5rem; }
}


/* Keep mobile navigation visible in the warm prototype preview */
@media(max-width: 760px){
  .site-header { gap: .75rem; padding: .75rem 1rem; }
  .site-header nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .25rem; }
  .site-header nav a { display: inline-flex !important; padding: .42rem .55rem; font-size: .76rem; }
}

.page-bookings .page-hero { padding-top: clamp(3rem, 5.5vw, 5rem); padding-bottom: clamp(4.5rem, 7vw, 6.5rem); }
.demo-button { margin-top: 1rem; }

.footer-social .social-icon { width: 3.15rem; height: 3.15rem; }
.footer-social .social-icon svg { width: 1.8rem; height: 1.8rem; }

/* Private landing page: four core guest tent cards in a centered 2x2 grid */
.cards.demo-four { grid-template-columns: repeat(2, minmax(260px, 1fr)); max-width: 860px; margin-left: auto; margin-right: auto; }
.cards.demo-four .price-card { min-height: 24rem; }
.cards.demo-four .price-card p:last-child { margin-bottom: 1.4rem; }
@media(max-width: 760px){ .cards.demo-four { grid-template-columns: 1fr; max-width: 100%; } }

.demo-sleeping { grid-template-columns: .65fr 1fr; max-width: 760px; margin-left: auto; margin-right: auto; }
@media(max-width: 760px){ .demo-sleeping { grid-template-columns: 1fr; } }

.page-area .section-actions { margin-top: 1.35rem; }
.page-area .section-actions .button { text-decoration: none; }

.page-area .area-venue-copy { margin-top: 1.55rem; }

.photo-card.photo-link { color: inherit; text-decoration: none; cursor: pointer; transition: transform .18s ease, box-shadow .18s ease, filter .18s ease; }
.photo-card.photo-link:hover, .photo-card.photo-link:focus-visible { transform: translateY(-2px); filter: brightness(1.03); box-shadow: 0 18px 46px rgba(49,40,33,.16); outline: none; }
.photo-card.photo-link:focus-visible { box-shadow: 0 0 0 3px rgba(201,155,102,.35), 0 18px 46px rgba(49,40,33,.16); }

/* 2026-06-03: area page image tiles are clickable; keep tile text readable over photos. */
.page-area .photo-card.photo-link {
  color: #fff !important;
  text-shadow: 0 2px 14px rgba(0,0,0,.45);
}

.page-area .area-family-copy { margin-top: 1rem; }

/* 2026-06-04 responsive header/hero fix after live-domain review:
   prevent the top nav/logo from crowding or disappearing in narrow windows, and
   stop the homepage hero eyebrow line being cropped by the old fixed text lift. */
.site-header {
  flex-wrap: wrap;
}
.site-header nav {
  min-width: 0;
  flex-wrap: wrap;
  justify-content: flex-end;
  row-gap: .35rem;
}
.brand {
  flex: 0 1 auto;
  min-width: 0;
}
.brand-wordmark {
  width: clamp(9.5rem, 20vw, 13.25rem);
  max-width: 42vw;
}
.brand-mark {
  width: clamp(2rem, 3vw, 2.75rem);
  flex: 0 0 auto;
}
.hero-location-line {
  max-width: 100%;
  line-height: 1.35;
  text-wrap: balance;
}

@media (max-width: 980px) {
  .site-header {
    align-items: flex-start;
    gap: .65rem 1rem;
  }
  .site-header nav {
    flex: 1 1 100%;
    justify-content: flex-start;
    gap: .35rem;
    font-size: .84rem;
  }
  .site-header nav a {
    padding: .48rem .62rem;
  }
  .brand-wordmark {
    width: clamp(8.75rem, 30vw, 11rem);
    max-width: none;
  }
  .brand-mark {
    width: 2.15rem;
  }
  .page-home .hero-copy {
    transform: translateY(-42px) !important;
  }
  .page-home .hero {
    padding-top: clamp(4.75rem, 8vw, 6.25rem) !important;
  }
}

@media (max-width: 640px) {
  .site-header {
    position: sticky;
    padding: .62rem .82rem;
  }
  .site-header .brand {
    width: 100%;
    justify-content: space-between;
  }
  .brand-wordmark {
    width: min(10rem, 62vw);
  }
  .brand-mark {
    width: 2rem;
  }
  .site-header nav {
    width: 100%;
    overflow-x: auto;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: .05rem;
  }
  .site-header nav::-webkit-scrollbar { display: none; }
  .site-header nav a {
    flex: 0 0 auto;
    white-space: nowrap;
    font-size: .74rem;
    padding: .38rem .5rem;
  }
  .page-home .hero {
    min-height: auto !important;
    padding-top: clamp(3.75rem, 12vw, 5rem) !important;
    padding-bottom: clamp(2.5rem, 10vw, 4rem) !important;
    background-position: center 66% !important;
  }
  .page-home .hero-copy {
    transform: none !important;
    max-width: 100%;
  }
  .hero-location-line {
    font-size: .72rem !important;
    letter-spacing: .08em !important;
    margin-bottom: .75rem;
  }
  .page-home h1 {
    font-size: clamp(2.35rem, 13vw, 3.6rem);
    letter-spacing: -.045em;
  }
  .page-home .lead {
    font-size: 1.03rem;
  }
  .hero-actions {
    gap: .65rem;
    margin-top: 1.35rem;
  }
  .hero-actions .button {
    min-height: 2.85rem;
    padding: .72rem 1rem;
  }
}

/* 2026-06-04 mobile homepage-only polish after Jess review.
   Scope tightly to .page-home and mobile widths so desktop stays unchanged. */
.mobile-menu-toggle { display: none; }

.mobile-menu-toggle {
  cursor: pointer;
  pointer-events: auto;
  touch-action: manipulation;
}
.mobile-hero-gallery { display: none; }

@media (max-width: 760px) {
  .page-home .site-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: .45rem .65rem;
    padding: .58rem .78rem;
  }
  .page-home .site-header .brand {
    width: auto;
    justify-content: flex-start;
    gap: .48rem;
  }
  .page-home .brand-wordmark {
    width: clamp(7.6rem, 42vw, 9.3rem) !important;
    max-width: 100%;
  }
  .page-home .brand-mark {
    width: clamp(1.18rem, 8vw, 1.62rem) !important;
    max-height: 1.62rem;
    object-fit: contain;
  }
  .page-home .mobile-menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.25rem;
    padding: .45rem .78rem;
    border: 1px solid rgba(82,55,37,.24);
    border-radius: 999px;
    background: rgba(255,250,242,.92);
    color: #4b321f;
    font: inherit;
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .03em;
    box-shadow: 0 8px 18px rgba(49,40,33,.08);
  }
  .page-home .mobile-menu-toggle::after {
    content: "☰";
    margin-left: .42rem;
    font-size: .9rem;
    line-height: 1;
  }
  .page-home .mobile-menu-toggle[aria-expanded="true"]::after { content: "×"; font-size: 1.05rem; }
  .page-home .site-header nav {
    grid-column: 1 / -1;
    display: none !important;
    width: 100%;
    overflow: visible;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    gap: .35rem;
    padding-top: .25rem;
  }
  .page-home.mobile-nav-open .site-header nav {
    display: flex !important;
  }
  .page-home .site-header nav a {
    flex: 0 1 auto;
    white-space: nowrap;
    font-size: .75rem;
    padding: .42rem .58rem;
    background: rgba(255,253,248,.78);
    border: 1px solid rgba(82,55,37,.10);
  }

  .page-home .hero {
    position: relative;
    display: block;
    min-height: auto !important;
    padding: clamp(2.65rem, 12vw, 4.1rem) .95rem 2.15rem !important;
    overflow: hidden;
    background-image: linear-gradient(180deg, rgba(35,28,24,.58), rgba(35,28,24,.74)) !important;
    background-position: center center !important;
    color: white;
  }
  .page-home .hero::before { display: none; }
  .page-home .mobile-hero-gallery {
    display: block;
    position: absolute;
    inset: 0;
    z-index: -2;
  }
  .page-home .mobile-hero-gallery::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    background: linear-gradient(180deg, rgba(35,28,24,.54), rgba(35,28,24,.70) 54%, rgba(35,28,24,.82));
  }
  .page-home .mobile-hero-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    background: var(--photo) center 58% / cover no-repeat;
    transform: scale(1.015);
    transition: opacity 1.05s ease;
  }
  .page-home .mobile-hero-slide.is-active { opacity: 1; }
  .page-home .hero-copy {
    position: relative;
    z-index: 1;
    max-width: 24rem;
    transform: none !important;
    padding-top: .35rem;
  }
  .page-home .hero-location-line {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #ffe4ae !important;
    font-size: .64rem !important;
    letter-spacing: .075em !important;
    line-height: 1.38 !important;
    margin: 0 0 .62rem !important;
    text-wrap: balance;
  }
  .page-home .hero h1 {
    font-size: clamp(2rem, 10.8vw, 3rem) !important;
    line-height: .98;
    letter-spacing: -.045em;
    margin-bottom: .78rem;
  }
  .page-home .lead {
    font-size: .96rem !important;
    line-height: 1.42;
    max-width: 21rem;
    color: rgba(255,255,255,.9);
  }
  .page-home .hero-actions {
    margin-top: 1.05rem;
    gap: .55rem;
  }
  .page-home .hero-actions .button {
    min-height: 2.55rem;
    padding: .62rem .86rem;
    font-size: .82rem;
  }

  .page-home .intro-grid {
    grid-template-columns: 1fr !important;
    gap: .62rem;
    padding: 1rem .85rem 1.5rem;
    margin-top: 0 !important;
  }
  .page-home .intro-grid article {
    padding: .88rem .95rem;
    border-radius: 1rem;
  }
  .page-home .intro-grid span {
    font-size: .78rem;
  }
  .page-home .intro-grid h2 {
    font-size: 1.15rem;
    margin: .35rem 0 .25rem;
  }
  .page-home .intro-grid p {
    font-size: .88rem;
    line-height: 1.42;
  }

  .page-home #how-it-works.timeline {
    padding-top: 2.35rem;
    padding-bottom: 2.45rem;
  }
  .page-home #how-it-works .section-heading {
    margin-bottom: 1.05rem;
  }
  .page-home #how-it-works .eyebrow {
    font-size: .68rem;
    margin-bottom: .45rem;
  }
  .page-home #how-it-works h2 {
    font-size: clamp(1.7rem, 8.5vw, 2.35rem);
  }
  .page-home #how-it-works ol {
    grid-template-columns: 1fr !important;
    gap: .65rem;
  }
  .page-home #how-it-works li {
    padding: .85rem .95rem;
    border-radius: .85rem;
    border-top-width: 2px;
  }
  .page-home #how-it-works li::before {
    margin-bottom: .35rem;
    font-size: .78rem;
  }
  .page-home #how-it-works strong {
    font-size: 1rem;
    margin-bottom: .2rem;
  }
  .page-home #how-it-works span {
    font-size: .86rem;
    line-height: 1.4;
  }
  .page-home #how-it-works .section-actions.centered-actions {
    margin-top: 1rem;
  }
}

/* 2026-06-04 mobile homepage v2: restore visible eyebrow/title spacing under sticky header. */
@media (max-width: 760px) {
  .page-home .hero {
    padding-top: clamp(5.25rem, 22vw, 6.4rem) !important;
  }
  .page-home .hero-copy {
    padding-top: 0 !important;
  }
  .page-home .hero-location-line {
    position: relative;
    z-index: 3;
    display: block !important;
    min-height: 1.2em;
  }
  .page-home .hero h1 {
    font-size: clamp(1.82rem, 9.3vw, 2.55rem) !important;
    line-height: 1.02 !important;
    margin-bottom: .7rem !important;
  }
  .page-home .lead {
    font-size: .92rem !important;
  }
}

/* 2026-06-04 mobile logo proportion nudge. */
@media (max-width: 760px) {
  .page-home .brand-mark {
    width: clamp(1.38rem, 8.8vw, 1.88rem) !important;
    max-height: 1.88rem;
  }
}

/* 2026-06-04 mobile menu focus polish: keep keyboard focus, avoid default blue ring. */
@media (max-width: 760px) {
  .page-home .mobile-menu-toggle:focus { outline: none; }
  .page-home .mobile-menu-toggle:focus-visible {
    outline: 2px solid rgba(169, 109, 54, .72);
    outline-offset: 3px;
  }
}


/* 2026-06-04 global mobile header/menu polish — all pages. */
@media (max-width: 760px) {
  .site-header {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center !important;
    gap: .45rem .65rem;
    padding: .58rem .78rem !important;
  }
  .site-header .brand {
    width: auto !important;
    justify-content: flex-start !important;
    gap: .48rem !important;
    min-width: 0;
  }
  .brand-wordmark {
    width: clamp(7.6rem, 42vw, 9.3rem) !important;
    max-width: 100% !important;
  }
  .brand-mark {
    width: clamp(1.38rem, 8.8vw, 1.88rem) !important;
    max-height: 1.88rem !important;
    object-fit: contain !important;
  }
  .mobile-menu-toggle {
    display: inline-flex !important;
    position: relative;
    z-index: 1002;
    align-items: center;
    justify-content: center;
    min-height: 2.25rem;
    padding: .45rem .78rem;
    border: 1px solid rgba(82,55,37,.24);
    border-radius: 999px;
    background: rgba(255,250,242,.92);
    color: #4b321f;
    font: inherit;
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .03em;
    box-shadow: 0 8px 18px rgba(49,40,33,.08);
  }
  .mobile-menu-toggle::after {
    content: "☰";
    margin-left: .42rem;
    font-size: .9rem;
    line-height: 1;
  }
  .mobile-menu-toggle[aria-expanded="true"]::after { content: "×"; font-size: 1.05rem; }
  .mobile-menu-toggle:focus { outline: none; }
  .mobile-menu-toggle:focus-visible {
    outline: 2px solid rgba(169, 109, 54, .72);
    outline-offset: 3px;
  }
  .site-header nav {
    grid-column: 1 / -1;
    position: relative;
    z-index: 1001;
    display: none !important;
    width: 100%;
    overflow: visible !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    gap: .35rem !important;
    padding-top: .25rem;
    padding-bottom: 0 !important;
  }
  body.mobile-nav-open .site-header nav {
    display: flex !important;
  }
  .site-header nav a {
    display: inline-flex !important;
    flex: 0 1 auto !important;
    white-space: nowrap;
    font-size: .75rem;
    padding: .42rem .58rem;
    background: rgba(255,253,248,.78);
    border: 1px solid rgba(82,55,37,.10);
  }

  /* Jess asked to remove these two homepage images on mobile only. */
  .page-home #tents .image-placeholder.live-two,
  .page-home #tents .image-placeholder.live-three {
    display: none !important;
  }
  .page-home #tents .image-row {
    grid-template-columns: 1fr !important;
  }
}

/* 2026-06-05 Jess mobile-only condensation pass. Desktop unchanged. */
@media (max-width: 760px) {
  /* Menu opens as a true dropdown list rather than bunched horizontal tabs. */
  .site-header {
    position: sticky;
  }
  .site-header nav,
  .page-home .site-header nav {
    border: 1px solid rgba(82,55,37,.12);
    border-radius: 1rem;
    background: rgba(255,250,242,.97);
    box-shadow: 0 14px 32px rgba(49,40,33,.12);
    padding: .45rem !important;
    gap: .18rem !important;
  }
  body.mobile-nav-open .site-header nav,
  .page-home.mobile-nav-open .site-header nav {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }
  .site-header nav a,
  .page-home .site-header nav a {
    display: flex !important;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    border: 0 !important;
    border-radius: .78rem;
    background: transparent !important;
    padding: .62rem .78rem !important;
    font-size: .86rem !important;
    font-weight: 850;
  }
  .site-header nav a::after,
  .page-home .site-header nav a::after {
    content: "›";
    color: rgba(82,55,37,.46);
    font-size: 1rem;
  }
  .site-header nav a:hover,
  .site-header nav a:focus-visible {
    background: rgba(182,139,74,.14) !important;
    outline: none;
  }

  /* Homepage: remove the 01/02/03 intro boxes completely on mobile. */
  .page-home .intro-grid {
    display: none !important;
  }

  /* Homepage hero: keep text readable but let more photo through. */
  .page-home .mobile-hero-gallery::after {
    background: linear-gradient(180deg, rgba(35,28,24,.34), rgba(35,28,24,.48) 58%, rgba(35,28,24,.62)) !important;
  }
  .page-home .hero {
    background-image: linear-gradient(180deg, rgba(35,28,24,.38), rgba(35,28,24,.56)) !important;
  }

  /* Hide hero eyebrow/subtitle on every non-home hero image. */
  body:not(.page-home) .page-hero > .eyebrow:first-child {
    display: none !important;
  }
  body:not(.page-home) .page-hero {
    padding-top: clamp(2.2rem, 9vw, 3.2rem) !important;
    padding-bottom: clamp(2.4rem, 10vw, 3.6rem) !important;
  }
  body:not(.page-home) .page-hero h1 {
    font-size: clamp(2.05rem, 10vw, 2.85rem) !important;
    margin-bottom: .7rem;
  }
  body:not(.page-home) .page-hero .lead {
    font-size: .94rem !important;
    line-height: 1.42;
  }

  /* Location: replace bulky brown bubbles with a clear bold text-strip style. */
  .service-areas {
    padding-top: 2.35rem !important;
    padding-bottom: 2.55rem !important;
  }
  .service-areas h2 {
    font-size: clamp(1.8rem, 8.7vw, 2.45rem) !important;
    margin-bottom: .7rem;
  }
  .service-areas p:not(.eyebrow) {
    font-size: .92rem;
    line-height: 1.42;
  }
  .area-pills {
    display: flex;
    gap: .45rem .7rem;
    margin-top: 1.05rem;
    padding-top: .85rem;
    border-top: 1px solid rgba(82,55,37,.16);
  }
  .area-pills span {
    padding: 0 !important;
    background: transparent !important;
    color: var(--espresso) !important;
    border-radius: 0 !important;
    font-size: .78rem;
    font-weight: 950;
    letter-spacing: .055em;
    text-transform: uppercase;
  }
  .area-pills span:not(:last-child)::after {
    content: "·";
    margin-left: .7rem;
    color: var(--tan);
  }

  /* Testimonials: show first three only on mobile and make cards tighter. */
  .review-grid .review-card:nth-child(n+4) {
    display: none !important;
  }
  .reviews-section {
    padding-top: 2.4rem !important;
    padding-bottom: 2.5rem !important;
  }
  .review-grid {
    gap: .65rem !important;
  }
  .review-card {
    padding: .9rem .95rem !important;
    border-radius: 1rem !important;
  }
  .review-card p {
    font-size: .92rem !important;
    line-height: 1.34 !important;
    margin-bottom: .55rem !important;
  }
  .review-card strong,
  .review-card span {
    font-size: .82rem !important;
  }

  /* FAQs: same content, less vertical space. */
  .faqs,
  .page-home #faqs {
    padding-top: 2.35rem !important;
    padding-bottom: 2.45rem !important;
  }
  .faq-grid {
    gap: .45rem !important;
  }
  details {
    padding: .72rem .85rem !important;
    border-radius: .85rem !important;
  }
  summary {
    font-size: .92rem !important;
    line-height: 1.25;
  }
  details p {
    margin-top: .45rem !important;
    font-size: .86rem;
    line-height: 1.36;
  }

  /* Booking route boxes: smaller. */
  .page-bookings #booking-routes {
    padding-top: 2.1rem !important;
    padding-bottom: 1.75rem !important;
  }
  .page-bookings .event-grid {
    gap: .6rem !important;
  }
  .page-bookings .booking-card {
    padding: .85rem .9rem !important;
    border-radius: 1rem !important;
  }
  .page-bookings .booking-card .eyebrow {
    font-size: .62rem !important;
    margin-bottom: .35rem !important;
  }
  .page-bookings .booking-card h3 {
    font-size: 1.05rem !important;
    margin-bottom: .35rem !important;
  }
  .page-bookings .booking-card p {
    font-size: .84rem !important;
    line-height: 1.34 !important;
  }
  .page-bookings .booking-card .button {
    min-height: 2.25rem;
    padding: .52rem .78rem;
    font-size: .8rem;
    margin-top: .65rem;
  }

  /* Tent cards/interiors: smaller cards and photos. */
  .page-bookings #tent-packages {
    padding-top: 2.1rem !important;
    padding-bottom: 1.7rem !important;
  }
  .page-bookings .cards.six {
    gap: .65rem !important;
  }
  .page-bookings .cards.six .price-card,
  .page-bookings .price-card {
    min-height: 0 !important;
    border-radius: 1rem !important;
  }
  .page-bookings .cards.six .card-photo,
  .page-bookings .card-photo {
    min-height: 8.2rem !important;
  }
  .page-bookings .price-card .tag,
  .page-bookings .price-card h3,
  .page-bookings .price-card p:last-child {
    margin-left: .9rem !important;
    margin-right: .9rem !important;
  }
  .page-bookings .price-card .tag {
    margin-top: .78rem !important;
    margin-bottom: .35rem !important;
    font-size: .67rem !important;
  }
  .page-bookings .price-card h3 {
    font-size: 1.08rem !important;
    margin-bottom: .35rem !important;
  }
  .page-bookings .price-card p:last-child {
    font-size: .84rem !important;
    line-height: 1.34 !important;
    margin-bottom: .85rem !important;
  }

  /* Booking form + basket: compact without removing fields. */
  .page-bookings #booking-builder,
  .page-contact .section-pad.compact {
    padding-top: 2rem !important;
    padding-bottom: 2.25rem !important;
  }
  .form-card,
  .basket,
  .panel.optional-extras-card {
    padding: .95rem !important;
    border-radius: 1rem !important;
  }
  .form-card h2,
  .basket h2,
  .panel.optional-extras-card h3 {
    font-size: clamp(1.45rem, 7.5vw, 1.95rem) !important;
    margin-bottom: .55rem !important;
  }
  .form-card .eyebrow,
  .compact-heading .eyebrow,
  .panel.optional-extras-card .eyebrow {
    font-size: .62rem !important;
    margin-bottom: .35rem !important;
  }
  .form-grid {
    grid-template-columns: 1fr !important;
    gap: .5rem !important;
  }
  label {
    font-size: .78rem;
    font-weight: 800;
    line-height: 1.25;
  }
  select,
  input,
  textarea {
    padding: .58rem .68rem !important;
    border-radius: .68rem !important;
    font-size: .88rem !important;
  }
  textarea {
    min-height: 5.4rem;
  }
  .date-input-wrap {
    gap: .35rem !important;
    grid-template-columns: 1fr auto;
  }
  .date-picker-trigger {
    padding: .58rem .6rem !important;
    font-size: .78rem !important;
  }
  .form-card .button[type='submit'],
  .form-actions-panel .button {
    min-height: 2.55rem;
    padding: .62rem .9rem;
    font-size: .84rem;
  }
  .compact-heading {
    margin-top: 1.55rem !important;
    margin-bottom: .85rem !important;
  }
  .compact-heading h2,
  .section-heading h2 {
    font-size: clamp(1.65rem, 8.4vw, 2.25rem) !important;
  }
  .section-heading {
    margin-bottom: 1rem !important;
  }
  .section-heading p:not(.eyebrow) {
    font-size: .9rem;
    line-height: 1.38;
  }

  /* Booking item rows: select above Add button on the right, more room for description. */
  .page-bookings .content-grid {
    grid-template-columns: 1fr !important;
    gap: .8rem !important;
  }
  .shop-item {
    grid-template-columns: minmax(0, 1fr) 4.25rem !important;
    gap: .65rem !important;
    padding: .72rem !important;
    border-radius: .85rem !important;
    align-items: start !important;
  }
  .shop-item strong {
    font-size: .96rem !important;
    line-height: 1.18;
  }
  .shop-item p {
    font-size: .8rem !important;
    line-height: 1.28 !important;
    margin-top: .15rem;
  }
  .shop-item small {
    font-size: .72rem !important;
    margin-top: .2rem !important;
  }
  .shop-controls {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .35rem !important;
    justify-items: stretch !important;
    align-items: stretch !important;
  }
  .shop-controls select {
    width: 100% !important;
    min-width: 0;
    padding: .45rem .35rem !important;
    text-align: center;
  }
  .shop-controls .button,
  .shop-controls button.button {
    min-height: 2.1rem !important;
    padding: .45rem .4rem !important;
    font-size: .78rem !important;
  }
  .basket {
    position: static !important;
  }
  .basket-list {
    margin: .65rem 0 !important;
    gap: .35rem !important;
  }
  .basket p,
  .notice {
    font-size: .82rem !important;
    line-height: 1.34 !important;
  }
  .form-actions-panel {
    margin-top: 1rem !important;
  }

  /* Contact page: condense form and remove two requested image tiles on mobile. */
  .page-contact .contact-form .button[type='submit'] {
    margin-top: .8rem !important;
  }
  .page-contact .image-row .wedding-photo,
  .page-contact .image-row .fire-photo {
    display: none !important;
  }
  .page-contact .image-row {
    grid-template-columns: 1fr !important;
    margin-top: .9rem !important;
  }
  .page-contact .direct-contact-card {
    margin-top: .95rem !important;
    padding: .95rem !important;
  }
  .page-contact .direct-contact-card h2 {
    font-size: 1.35rem !important;
  }
  .page-contact .direct-contact-card .hero-actions {
    gap: .45rem !important;
    margin-top: .7rem !important;
  }
}

/* 2026-06-05 mobile condensation corrections after visual QA. */
@media (max-width: 760px) {
  /* Strongly remove homepage 01/02/03 cards. */
  body.page-home section.intro-grid,
  body.page-home .intro-grid.section-pad.compact,
  body.page-home .intro-grid[aria-label="Service highlights"] {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
  }

  /* Jess asked for hero subtitles gone on non-home pages: remove the descriptive lead too. */
  body:not(.page-home) .page-hero > .lead {
    display: none !important;
  }
  body:not(.page-home) .page-hero h1 {
    margin-bottom: 0 !important;
  }

  /* Make quantity select unmistakably stacked above Add button. */
  .page-bookings .shop-controls {
    display: flex !important;
    flex-direction: column !important;
    width: 4.65rem !important;
    gap: .32rem !important;
  }
  .page-bookings .shop-controls select,
  .page-bookings .shop-controls .button,
  .page-bookings .shop-controls button.button {
    width: 100% !important;
  }
  .page-bookings .shop-item {
    grid-template-columns: minmax(0, 1fr) 4.65rem !important;
  }
}

/* 2026-06-05 mobile hero subtitle final override: page-hero only; homepage unaffected. */
@media (max-width: 760px) {
  .page-hero p.lead,
  .page-hero .lead {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
  }
}

/* 2026-06-05 mobile detail polish pass: Jess follow-up. */
@media (max-width: 760px) {
  /* Bigger, easier tap target for Menu. */
  .mobile-menu-toggle {
    min-height: 2.65rem !important;
    padding: .58rem .95rem !important;
    font-size: .9rem !important;
  }
  .mobile-menu-toggle::after {
    font-size: 1.05rem !important;
  }
  .mobile-menu-toggle[aria-expanded="true"]::after {
    font-size: 1.2rem !important;
  }

  /* Homepage hero copy/buttons centred on the image. */
  .page-home .hero {
    display: grid !important;
    place-items: center !important;
    text-align: center !important;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
  .page-home .hero-copy {
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 24rem !important;
    text-align: center !important;
  }
  .page-home .hero-location-line,
  .page-home .lead {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .page-home .hero-actions {
    justify-content: center !important;
  }

  /* Condense For every occasion without losing any content. */
  .page-home #occasions {
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
    padding-top: 2.25rem !important;
    padding-bottom: 2.2rem !important;
  }
  .page-home #occasions .eyebrow {
    font-size: .64rem !important;
    margin-bottom: .45rem !important;
  }
  .page-home #occasions h2 {
    font-size: clamp(1.72rem, 8.7vw, 2.25rem) !important;
    margin-bottom: .55rem !important;
  }
  .page-home #occasions p:not(.eyebrow) {
    font-size: .9rem !important;
    line-height: 1.36 !important;
  }
  .page-home #occasions .tick-list {
    gap: .42rem !important;
    margin-top: .8rem !important;
  }
  .page-home #occasions .tick-list li {
    padding-left: 1.35rem !important;
    font-size: .85rem !important;
    line-height: 1.3 !important;
  }
  .page-home #occasions .occasion-gallery-frame {
    min-height: 11rem !important;
    height: 11rem !important;
    border-radius: 1rem !important;
  }

  /* Sleep arrangements box smaller. */
  .sleeping,
  .page-bookings .sleeping,
  .demo-sleeping {
    margin-top: .65rem !important;
    padding: .8rem .9rem !important;
    gap: .45rem !important;
    border-radius: .95rem !important;
  }
  .sleeping h3,
  .page-bookings .sleeping h3,
  .demo-sleeping h3 {
    font-size: 1.05rem !important;
  }
  .sleeping strong,
  .sleeping p,
  .page-bookings .sleeping strong,
  .page-bookings .sleeping p,
  .demo-sleeping strong,
  .demo-sleeping p {
    font-size: .82rem !important;
    line-height: 1.3 !important;
  }

  /* Tent cards: larger image boxes and show more of the full tent. */
  .page-bookings .cards.six .card-photo,
  .page-bookings .card-photo,
  .cards.demo-four .card-photo {
    min-height: 11.8rem !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-color: #efe4d2 !important;
  }
  .page-bookings .price-card p:last-child {
    font-size: .82rem !important;
    line-height: 1.3 !important;
  }

  /* Footer: Explore and Areas side-by-side. */
  .site-footer {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 1rem .8rem !important;
    padding: 1.45rem .95rem !important;
  }
  .site-footer .footer-brand {
    grid-column: 1 / -1 !important;
  }
  .site-footer .footer-links {
    min-width: 0;
  }
  .site-footer .footer-links strong {
    font-size: .8rem !important;
    letter-spacing: .08em;
    text-transform: uppercase;
  }
  .site-footer .footer-links a {
    font-size: .82rem !important;
    line-height: 1.25 !important;
    margin-top: .35rem !important;
  }

  /* Contact page call/email buttons smaller. */
  .page-contact .direct-contact-card .hero-actions .button {
    min-height: 2.18rem !important;
    padding: .48rem .68rem !important;
    font-size: .76rem !important;
    flex: 1 1 auto;
  }
}

/* 2026-06-05 mobile detail v5 final alignment/nav hardening. */
@media (max-width: 760px) {
  .page-home .hero,
  .page-home .hero-copy,
  .page-home .hero h1,
  .page-home .hero .lead,
  .page-home .hero-location-line {
    text-align: center !important;
  }
  .page-home .hero h1,
  .page-home .hero .lead {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .page-home .hero-actions {
    width: 100% !important;
    justify-content: center !important;
    align-items: center !important;
  }

  body:not(.mobile-nav-open) .site-header nav {
    display: none !important;
  }
  body.mobile-nav-open .site-header nav,
  body.page-home.mobile-nav-open .site-header nav {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
  }
  body.mobile-nav-open .site-header nav a,
  body.page-home.mobile-nav-open .site-header nav a {
    display: flex !important;
    width: 100% !important;
    flex: 1 1 auto !important;
  }
}

/* 2026-06-05 mobile gallery/hero alignment pass. */
@media (max-width: 760px) {
  /* Homepage hero copy should be vertically centred, but left-aligned. */
  .page-home .hero {
    place-items: center start !important;
    text-align: left !important;
  }
  .page-home .hero-copy,
  .page-home .hero h1,
  .page-home .hero .lead,
  .page-home .hero-location-line {
    text-align: left !important;
  }
  .page-home .hero-copy,
  .page-home .hero h1,
  .page-home .hero .lead,
  .page-home .hero-location-line {
    margin-left: 0 !important;
    margin-right: auto !important;
  }
  .page-home .hero-actions {
    justify-content: flex-start !important;
    align-items: center !important;
  }

  /* Tent gallery modal: overlay small round arrows on image instead of long bars. */
  .gallery-dialog {
    width: min(94vw, 28rem) !important;
    padding: .9rem !important;
    border-radius: 1.15rem !important;
  }
  .gallery-frame {
    position: relative !important;
    display: block !important;
    margin-top: .75rem !important;
  }
  .gallery-frame img {
    display: block;
    width: 100% !important;
    aspect-ratio: 4 / 3 !important;
    height: auto !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center center !important;
    border-radius: .95rem !important;
    background: #eadcc7 !important;
  }
  .gallery-nav {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 2 !important;
    width: 2.25rem !important;
    height: 2.25rem !important;
    min-width: 2.25rem !important;
    padding: 0 !important;
    border-radius: 999px !important;
    background: rgba(49,40,33,.82) !important;
    color: #fff !important;
    font-size: 1.55rem !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 8px 18px rgba(0,0,0,.24) !important;
  }
  .gallery-nav.prev { left: .45rem !important; }
  .gallery-nav.next { right: .45rem !important; }
  .gallery-caption {
    margin-top: .62rem !important;
    font-size: .86rem !important;
    line-height: 1.34 !important;
  }
  .gallery-dots {
    margin-top: .55rem !important;
    gap: .32rem !important;
  }
  .gallery-dots button {
    width: .52rem !important;
    height: .52rem !important;
  }
}

/* 2026-06-05 gallery modal arrow hard override for mobile open modal. */
@media (max-width: 760px) {
  .gallery-modal.open .gallery-frame {
    position: relative !important;
    display: block !important;
    grid-template-columns: none !important;
  }
  .gallery-modal.open .gallery-frame .gallery-nav,
  .gallery-modal.open button.gallery-nav,
  .gallery-modal.open button.gallery-nav.prev,
  .gallery-modal.open button.gallery-nav.next {
    position: absolute !important;
    top: 50% !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
    width: 2.15rem !important;
    height: 2.15rem !important;
    min-width: 2.15rem !important;
    max-width: 2.15rem !important;
    padding: 0 !important;
    border-radius: 999px !important;
    background: rgba(49,40,33,.86) !important;
    font-size: 1.45rem !important;
    line-height: 1 !important;
  }
  .gallery-modal.open button.gallery-nav.prev { left: .45rem !important; right: auto !important; }
  .gallery-modal.open button.gallery-nav.next { right: .45rem !important; left: auto !important; }
}


/* Camp Chic area pages mobile polish — 2026-06-05
   Mobile-only: larger shared hero image, matching image-title sizing, and first image card moved under tick list. */
@media (max-width: 760px) {
  .page-area .page-hero {
    min-height: 24rem;
    display: grid;
    align-content: end;
    padding-top: 7.25rem;
    padding-bottom: 2rem;
    background-image:
      linear-gradient(120deg, rgba(35,28,24,.76), rgba(35,28,24,.22)),
      url("assets/user-uploaded/1779205978103-19c2c5db-PXL-20250621-130223010-2.jpg") !important;
    background-size: cover !important;
    background-position: center 48% !important;
  }
  .page-area .page-hero h1 {
    font-size: clamp(2.25rem, 11vw, 3.5rem);
  }
  .page-area .page-hero .lead {
    display: block;
    font-size: 1rem;
    line-height: 1.45;
    max-width: 22rem;
  }
  .page-area .tick-list {
    margin-bottom: .9rem;
  }
  .page-area .area-mobile-feature-card {
    display: flex;
    min-height: 13.5rem;
    margin: .9rem 0 1.05rem;
    font-size: 1.6rem;
  }
  .page-area .photo-panel {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(2, 11.5rem);
    margin-top: 1.25rem;
  }
  .page-area .photo-panel .photo-card.large {
    display: none;
  }
  .page-area .photo-card.large,
  .page-area .photo-card.photo-link {
    font-size: 1.6rem;
    line-height: 1.08;
  }
}
@media (min-width: 761px) {
  .page-area .area-mobile-feature-card { display: none; }
}


/* 2026-06-05 homepage mobile hero readability polish. */
@media (max-width: 760px) {
  .page-home .mobile-hero-gallery::after {
    background: linear-gradient(180deg, rgba(35,28,24,.32), rgba(35,28,24,.42) 54%, rgba(35,28,24,.56)) !important;
  }
  .page-home .hero .lead {
    font-size: 1.05rem !important;
    line-height: 1.45 !important;
    font-weight: 750 !important;
    color: rgba(255,255,255,.96) !important;
    text-shadow: 0 2px 12px rgba(20,16,14,.38) !important;
  }
}


/* 2026-06-05 homepage mobile hero copy refinement: shorter subtitle, less heavy weight. */
@media (max-width: 760px) {
  .page-home .hero .lead {
    font-size: 1rem !important;
    line-height: 1.42 !important;
    font-weight: 620 !important;
    max-width: 20.5rem !important;
  }
}

/* 2026-06-05 contact mobile hero buttons: smaller over-image CTAs only. */
@media (max-width: 760px) {
  .page-contact .page-hero .hero-actions {
    gap: .45rem !important;
    margin-top: 1rem !important;
  }
  .page-contact .page-hero .hero-actions .button {
    min-height: 2.38rem !important;
    padding: .56rem .86rem !important;
    font-size: .82rem !important;
    line-height: 1.12 !important;
    letter-spacing: 0 !important;
  }
}

/* 2026-06-05 Honeymoon Suite modal: mobile-only image lift. */
@media (max-width: 760px) {
  .gallery-modal[data-gallery="honeymoon"] .gallery-dialog {
    padding-top: .9rem !important;
  }
  .gallery-modal[data-gallery="honeymoon"] #galleryKicker {
    margin-bottom: .35rem !important;
  }
  .gallery-modal[data-gallery="honeymoon"] #galleryTitle {
    margin-bottom: .45rem !important;
    line-height: 1.05 !important;
  }
  .gallery-modal[data-gallery="honeymoon"] .gallery-frame {
    margin-top: .35rem !important;
    transform: none !important;
    margin-bottom: 0 !important;
  }
  .gallery-modal[data-gallery="honeymoon"] .gallery-frame img {
    object-position: center 72% !important;
  }
}

/* 2026-06-05 mobile hero overlay lightening pass. Keep text readable, but let more photo through. */
@media (max-width: 760px) {
  .page-home .mobile-hero-gallery::after {
    background: linear-gradient(180deg, rgba(35,28,24,.20), rgba(35,28,24,.30) 54%, rgba(35,28,24,.42)) !important;
  }
  .page-home .hero {
    background-image: linear-gradient(180deg, rgba(35,28,24,.22), rgba(35,28,24,.34)) !important;
  }
  .page-bookings .page-hero {
    background-image: linear-gradient(120deg, rgba(35,28,24,.42), rgba(35,28,24,.10)), url("assets/selected/hero/03_Bell_Tents_Day_427-Edit.webp") !important;
  }
  .page-blogs .page-hero,
  .page-blog .page-hero {
    background-image: linear-gradient(120deg, rgba(35,28,24,.42), rgba(35,28,24,.10)), url("assets/selected/lifestyle_details/05_Bell_Tents_Evening_50.webp") !important;
  }
  .page-enquire .page-hero {
    background-image: linear-gradient(120deg, rgba(35,28,24,.42), rgba(35,28,24,.10)), url("assets/selected/services_interiors/02_Camp_Chic_14.webp") !important;
  }
  .page-area .page-hero {
    background-image: linear-gradient(120deg, rgba(35,28,24,.42), rgba(35,28,24,.10)), url("assets/selected/hero/04_Bell_Tents_Evening_16.webp") !important;
  }
}

/* 2026-06-05 mobile homepage hero: remove subtitle without changing hero size. */
@media (max-width: 760px) {
  .page-home .hero .lead {
    display: none !important;
  }
  .page-home .hero-copy {
    transform: translateY(-3rem) !important;
  }
  .page-home .hero-actions {
    margin-top: .65rem !important;
  }
}

/* 2026-06-05 area pages mobile hero rollback: restore compact top hero size. */
@media (max-width: 760px) {
  .page-area .page-hero {
    min-height: auto !important;
    align-content: center !important;
    padding-top: clamp(2.2rem, 9vw, 3.2rem) !important;
    padding-bottom: clamp(2.4rem, 10vw, 3.6rem) !important;
    background-position: center 50% !important;
  }
  .page-area .page-hero h1 {
    font-size: clamp(2.05rem, 10vw, 2.85rem) !important;
  }
  .page-area .page-hero .lead {
    display: none !important;
  }
}

/* 2026-06-05 area pages mobile hero: match homepage hero scale, not oversized. */
@media (max-width: 760px) {
  .page-area .page-hero {
    min-height: clamp(16rem, 38vh, 20rem) !important;
    display: grid !important;
    align-content: end !important;
    padding-top: clamp(3rem, 10vw, 4rem) !important;
    padding-bottom: clamp(2.2rem, 8vw, 3rem) !important;
    background-position: center 50% !important;
  }
}

/* 2026-06-05 area pages mobile hero: homepage-style content pattern. */
.page-area .page-hero .area-mobile-kicker,
.page-area .page-hero .area-mobile-location,
.page-area .page-hero .area-mobile-actions {
  display: none;
}
@media (max-width: 760px) {
  .page-area .page-hero {
    min-height: clamp(20rem, 54vh, 27rem) !important;
    display: grid !important;
    align-content: start !important;
    justify-items: start !important;
    padding-top: clamp(2.2rem, 9vw, 3.2rem) !important;
    padding-bottom: 2rem !important;
    text-align: left !important;
  }
  .page-area .page-hero .area-desktop-eyebrow,
  .page-area .page-hero .lead {
    display: none !important;
  }
  .page-area .page-hero .area-mobile-kicker {
    display: block !important;
    color: #ffe4ae !important;
    font-size: .64rem !important;
    letter-spacing: .075em !important;
    line-height: 1.38 !important;
    margin: 0 0 .5rem !important;
  }
  .page-area .page-hero h1 {
    font-size: clamp(2rem, 10.8vw, 3rem) !important;
    line-height: .98 !important;
    letter-spacing: -.045em !important;
    margin: 0 0 .45rem !important;
    max-width: 22rem !important;
    text-align: left !important;
  }
  .page-area .page-hero .area-mobile-location {
    display: block !important;
    margin: 0 0 .65rem !important;
    color: rgba(255,255,255,.92) !important;
    font-weight: 800 !important;
    font-size: .95rem !important;
  }
  .page-area .page-hero .area-mobile-actions {
    display: flex !important;
    justify-content: flex-start !important;
    gap: .55rem !important;
    margin-top: .65rem !important;
  }
  .page-area .page-hero .area-mobile-actions .button {
    min-height: 2.55rem !important;
    padding: .62rem .86rem !important;
    font-size: .82rem !important;
  }
}

/* 2026-06-05 About page and area mobile subtitle cleanup. */
.about-photo-card {
  min-height: 24rem;
  display: grid;
  align-content: end;
  gap: .35rem;
  padding: 1.3rem;
  border-radius: 1.35rem;
  overflow: hidden;
  color: white;
  background:
    linear-gradient(180deg, rgba(35,28,24,.08), rgba(35,28,24,.62)),
    var(--photo, url("assets/user-uploaded/1779185567967-88e7b71c-Bell-Tents-Day-39.jpg")) center/cover no-repeat;
  box-shadow: var(--shadow);
}
.about-photo-card strong { font-family: 'Playfair Display', Georgia, serif; font-size: clamp(1.6rem, 4vw, 2.5rem); line-height: 1; }
.about-photo-card span { color: rgba(255,255,255,.84); font-weight: 800; }
.about-comfort > h2 { max-width: 48rem; }
.page-about .section-actions { display: flex; gap: .75rem; flex-wrap: wrap; margin-top: 1.25rem; }
@media (max-width: 760px) {
  .page-area .page-hero .area-mobile-location {
    display: none !important;
  }
  .page-about .page-hero h1 {
    font-size: clamp(2.05rem, 10vw, 2.9rem) !important;
  }
  .page-about .page-hero .lead {
    display: block !important;
    height: auto !important;
    visibility: visible !important;
    font-size: .98rem !important;
    line-height: 1.4 !important;
    margin-top: .8rem !important;
  }
  .about-photo-card {
    min-height: 17rem;
  }
}

/* 2026-06-05 About Us refinement: spacing and image comfort cards. */
.about-story p + p {
  margin-top: 1.05rem;
}
.about-comfort > h2 {
  margin-bottom: 1.6rem;
}
.about-comfort-cards {
  align-items: stretch;
}
.about-comfort-card {
  overflow: hidden;
  padding: 0 0 1.25rem !important;
}
.about-comfort-card .about-card-photo {
  min-height: 12.5rem;
  border-radius: 1.2rem 1.2rem 0 0;
  background: var(--photo) center/cover no-repeat;
}
.about-comfort-card h3,
.about-comfort-card p {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
.about-comfort-card h3 {
  margin-top: 1.15rem;
}
.about-comfort-card p {
  margin-top: .65rem;
}
@media (max-width: 760px) {
  .about-comfort > h2 {
    margin-bottom: 1.2rem;
  }
  .about-comfort-card .about-card-photo {
    min-height: 10.75rem;
  }
}

/* 2026-06-05 About Us comfort-card condensation and tent crop fix. */
.about-comfort-card .about-card-photo {
  min-height: 15.5rem !important;
}
.about-comfort-card:first-child .about-card-photo {
  background-position: center 34% !important;
}
.about-comfort-card h3 {
  margin-top: .82rem !important;
  font-size: 1.22rem !important;
  line-height: 1.05 !important;
}
.about-comfort-card p {
  margin-top: .42rem !important;
  font-size: .88rem !important;
  line-height: 1.32 !important;
}
.about-comfort-card h3,
.about-comfort-card p {
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}
@media (max-width: 760px) {
  .about-comfort-card .about-card-photo {
    min-height: 13.6rem !important;
  }
  .about-comfort-card h3 {
    font-size: 1.12rem !important;
  }
  .about-comfort-card p {
    font-size: .84rem !important;
    line-height: 1.3 !important;
  }
}

/* 2026-06-05 About Us personal photos and smaller hero buttons. */
.page-about .about-hero {
  background-position: 60% 40% !important;
}
.page-about .about-hero .hero-actions {
  gap: .55rem !important;
  margin-top: 1.1rem !important;
}
.page-about .about-hero .hero-actions .button {
  min-height: 2.35rem !important;
  padding: .52rem .82rem !important;
  font-size: .82rem !important;
  line-height: 1.12 !important;
}
.page-about .about-story .about-photo-card span {
  display: none !important;
}
@media (max-width: 760px) {
  .page-about .about-hero {
    min-height: clamp(21rem, 58vh, 30rem) !important;
    padding-bottom: 1.55rem !important;
    background-position: center 58% !important;
  }
  .page-about .about-hero .hero-actions {
    margin-top: .8rem !important;
  }
  .page-about .about-hero .hero-actions .button {
    min-height: 2.15rem !important;
    padding: .46rem .68rem !important;
    font-size: .76rem !important;
  }
}

/* 2026-06-05 About Us comfort section rewritten as personal values. */
.about-values-list .about-comfort-intro {
  max-width: 54rem;
  color: var(--muted);
  font-weight: 650;
  margin: .7rem 0 1.5rem;
}
.about-values-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}
.about-values-grid article {
  padding: 1.15rem;
  border-radius: 1.2rem;
  background: rgba(255,253,248,.82);
  border: 1px solid rgba(49,40,33,.10);
  box-shadow: 0 12px 30px rgba(49,40,33,.07);
}
.about-values-grid span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  background: rgba(182,139,74,.18);
  color: var(--clay);
  font-weight: 900;
  font-size: .78rem;
  margin-bottom: .7rem;
}
.about-values-grid h3 {
  font-size: 1.12rem;
  line-height: 1.08;
  margin-bottom: .45rem;
}
.about-values-grid p {
  color: var(--muted);
  font-size: .92rem;
  line-height: 1.38;
}
.page-about .about-events .about-photo-card {
  background-position: center center;
}
@media (max-width: 760px) {
  .about-values-grid {
    grid-template-columns: 1fr;
    gap: .75rem;
  }
  .about-values-grid article {
    padding: .95rem;
  }
  .about-values-grid h3 {
    font-size: 1.02rem;
  }
  .about-values-grid p {
    font-size: .86rem;
  }
}

/* 2026-06-05 About Us CTA visibility and festival-card text position. */
.page-about .about-events .section-actions .button.secondary {
  background: rgba(70, 47, 31, .92) !important;
  border-color: rgba(70, 47, 31, .92) !important;
  color: #fff8eb !important;
  box-shadow: 0 12px 26px rgba(70, 47, 31, .16);
}
.page-about .about-events .section-actions .button.secondary:hover,
.page-about .about-events .section-actions .button.secondary:focus-visible {
  background: #3f2c20 !important;
  border-color: #3f2c20 !important;
}
.page-about .about-events .about-photo-card {
  align-content: start !important;
  padding-top: 1rem !important;
}
@media (max-width: 760px) {
  .page-about .about-events .about-photo-card {
    padding-top: .85rem !important;
  }
}


/* 2026-06-05 provisional footer legal marker. */
.footer-legal {
  grid-column: 1 / -1;
  margin-top: 1.4rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(255,248,235,.18);
  color: rgba(255,248,235,.72);
  font-size: .82rem;
  line-height: 1.45;
}
.footer-legal p { margin: 0; }
.footer-legal p + p { margin-top: .25rem; }
@media (max-width: 760px) {
  .footer-legal {
    margin-top: .9rem;
    padding-top: .85rem;
    font-size: .74rem;
  }
}


/* 2026-06-05 Dressing Tent first gallery crop adjustment: mobile image-only crop, no layout shift. */
@media (max-width: 760px) {
  .gallery-modal[data-gallery="dressingRoom"][data-gallery-index="0"] .gallery-frame img {
    object-position: center bottom !important;
  }
}


/* 2026-06-05 clean typography draft v2: smaller, more editorial heading scale. */
:root {
  --cc-h1: clamp(2.3rem, 4.25vw, 4.35rem);
  --cc-h2: clamp(1.75rem, 2.85vw, 3rem);
  --cc-h3: clamp(1.16rem, 1.45vw, 1.34rem);
}
body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
h1,
.hero h1,
.page-hero h1 {
  font-size: var(--cc-h1) !important;
  letter-spacing: -.04em !important;
  line-height: .98 !important;
}
h2,
.section-heading h2,
.compact-heading h2,
.split h2,
.service-areas h2,
.contact h2,
.direct-contact-card h2,
.form-card h2,
.basket h2,
.about-comfort > h2,
.hero-card h2 {
  font-size: var(--cc-h2) !important;
  letter-spacing: -.032em !important;
  line-height: 1.03 !important;
}
h3,
.price-card h3,
.booking-card h3,
.blog-card h3,
.seo-card h3,
.sleeping h3,
.about-values-grid h3,
.intro-grid h2 {
  font-size: var(--cc-h3) !important;
  letter-spacing: -.018em !important;
  line-height: 1.12 !important;
}
.section-heading,
.compact-heading {
  max-width: 58rem;
}
.section-heading h2,
.compact-heading h2 {
  margin-bottom: .85rem !important;
}
.lead,
.page-hero .lead,
.section-heading p,
.compact-heading p {
  font-size: clamp(1rem, 1.35vw, 1.18rem) !important;
  line-height: 1.48 !important;
}
.eyebrow,
.hero-location-line,
.area-mobile-kicker {
  letter-spacing: .16em !important;
}
.about-photo-card strong {
  font-size: clamp(1.35rem, 2.8vw, 2rem) !important;
}
@media (max-width: 760px) {
  :root {
    --cc-h1: clamp(1.82rem, 8.1vw, 2.42rem);
    --cc-h2: clamp(1.38rem, 6.2vw, 1.88rem);
    --cc-h3: clamp(1.04rem, 4.6vw, 1.22rem);
  }
  h1,
  .hero h1,
  .page-hero h1,
  .page-home .hero h1,
  body:not(.page-home) .page-hero h1,
  .page-area .page-hero h1,
  .page-about .page-hero h1 {
    font-size: var(--cc-h1) !important;
    letter-spacing: -.038em !important;
    line-height: 1 !important;
  }
  h2,
  .section-heading h2,
  .compact-heading h2,
  .split h2,
  .service-areas h2,
  .contact h2,
  .direct-contact-card h2,
  .form-card h2,
  .basket h2,
  .about-comfort > h2,
  .hero-card h2,
  .page-home #how-it-works h2,
  .page-home #occasions h2 {
    font-size: var(--cc-h2) !important;
    letter-spacing: -.028em !important;
    line-height: 1.05 !important;
  }
  h3,
  .price-card h3,
  .booking-card h3,
  .blog-card h3,
  .seo-card h3,
  .sleeping h3,
  .about-values-grid h3,
  .intro-grid h2,
  .page-bookings .price-card h3,
  .page-bookings .booking-card h3 {
    font-size: var(--cc-h3) !important;
    letter-spacing: -.012em !important;
    line-height: 1.12 !important;
  }
  .lead,
  .page-hero .lead,
  .section-heading p,
  .compact-heading p {
    font-size: .95rem !important;
    line-height: 1.45 !important;
  }
  .about-photo-card strong {
    font-size: clamp(1.2rem, 6vw, 1.55rem) !important;
  }
}


/* 2026-06-05 clean typography draft v3: force consistent main section-title scale. */
:root {
  --cc-section-title: clamp(1.75rem, 2.85vw, 3rem);
}
.page-home #occasions h2,
.page-home #how-it-works h2,
.page-home .service-areas > h2,
.page-home #faqs .section-heading h2,
.page-home #reviews .section-heading h2,
.page-bookings .section-heading h2,
.page-bookings .compact-heading h2,
.page-bookings .form-card h2,
.page-bookings .basket h2,
.page-bookings .gallery-dialog h2,
.page-about .section-heading h2,
.page-about .split h2,
.page-about .about-comfort h2,
.page-area .section-heading h2,
.page-contact .section-heading h2,
.page-contact .direct-contact-card h2 {
  font-size: var(--cc-section-title) !important;
  line-height: 1.03 !important;
  letter-spacing: -.032em !important;
}
@media (max-width: 760px) {
  :root {
    --cc-section-title: clamp(1.38rem, 6.2vw, 1.88rem);
  }
  .page-home #occasions h2,
  .page-home #how-it-works h2,
  .page-home .service-areas > h2,
  .page-home #faqs .section-heading h2,
  .page-home #reviews .section-heading h2,
  .page-bookings .section-heading h2,
  .page-bookings .compact-heading h2,
  .page-bookings .form-card h2,
  .page-bookings .basket h2,
  .page-bookings .gallery-dialog h2,
  .page-about .section-heading h2,
  .page-about .split h2,
  .page-about .about-comfort h2,
  .page-area .section-heading h2,
  .page-contact .section-heading h2,
  .page-contact .direct-contact-card h2 {
    font-size: var(--cc-section-title) !important;
    line-height: 1.05 !important;
    letter-spacing: -.028em !important;
  }
}


/* 2026-06-05 clean typography draft v4: standardise small kicker/eyebrow labels. */
:root {
  --cc-eyebrow-size: .78rem;
  --cc-eyebrow-line: 1.6;
  --cc-eyebrow-spacing: .16em;
}
.eyebrow,
.section-heading .eyebrow,
.compact-heading .eyebrow,
.form-card .eyebrow,
.booking-card .eyebrow,
.panel.optional-extras-card .eyebrow,
.page-home #occasions .eyebrow,
.page-home #how-it-works .eyebrow,
.page-bookings .section-heading .eyebrow,
.page-about .eyebrow,
.page-contact .eyebrow,
.page-area .eyebrow {
  font-size: var(--cc-eyebrow-size) !important;
  line-height: var(--cc-eyebrow-line) !important;
  letter-spacing: var(--cc-eyebrow-spacing) !important;
}
@media (max-width: 760px) {
  :root {
    --cc-eyebrow-size: .64rem;
    --cc-eyebrow-line: 1.6;
    --cc-eyebrow-spacing: .16em;
  }
  .eyebrow,
  .section-heading .eyebrow,
  .compact-heading .eyebrow,
  .form-card .eyebrow,
  .booking-card .eyebrow,
  .panel.optional-extras-card .eyebrow,
  .page-home #occasions .eyebrow,
  .page-home #how-it-works .eyebrow,
  .page-bookings .section-heading .eyebrow,
  .page-about .eyebrow,
  .page-contact .eyebrow,
  .page-area .eyebrow {
    font-size: var(--cc-eyebrow-size) !important;
    line-height: var(--cc-eyebrow-line) !important;
    letter-spacing: var(--cc-eyebrow-spacing) !important;
  }
}


/* 2026-06-05 clean typography draft v5: override older page-specific eyebrow rules too. */
body .eyebrow,
body.page-home .eyebrow,
body.page-bookings .eyebrow,
body.page-about .eyebrow,
body.page-contact .eyebrow,
body.page-area .eyebrow,
body.page-bookings .booking-card .eyebrow,
body.page-bookings .form-card .eyebrow,
body.page-bookings .compact-heading .eyebrow,
body.page-bookings .panel.optional-extras-card .eyebrow,
body.page-home #how-it-works .eyebrow,
body.page-home #occasions .eyebrow {
  font-size: .78rem !important;
  line-height: 1.6 !important;
  letter-spacing: .16em !important;
}
@media (max-width: 760px) {
  body .eyebrow,
  body.page-home .eyebrow,
  body.page-bookings .eyebrow,
  body.page-about .eyebrow,
  body.page-contact .eyebrow,
  body.page-area .eyebrow,
  body.page-bookings .booking-card .eyebrow,
  body.page-bookings .form-card .eyebrow,
  body.page-bookings .compact-heading .eyebrow,
  body.page-bookings .panel.optional-extras-card .eyebrow,
  body.page-home #how-it-works .eyebrow,
  body.page-home #occasions .eyebrow {
    font-size: .64rem !important;
    line-height: 1.6 !important;
    letter-spacing: .16em !important;
  }
}


/* 2026-06-05 clean typography draft v6: uniform hero CTAs and cleaner About image cards. */
.hero-actions .button,
.page-hero .hero-actions .button,
.hero .hero-actions .button {
  min-height: 2.55rem !important;
  padding: .62rem 1rem !important;
  font-size: .86rem !important;
  line-height: 1.1 !important;
}
.page-bookings .page-hero h1 {
  font-size: clamp(2.15rem, 4vw, 4rem) !important;
}
.page-about .about-story .about-photo-card strong,
.page-about .about-events .about-photo-card strong {
  display: none !important;
}
@media (max-width: 760px) {
  .hero-actions .button,
  .page-hero .hero-actions .button,
  .hero .hero-actions .button {
    min-height: 2.32rem !important;
    padding: .55rem .9rem !important;
    font-size: .8rem !important;
  }
  .page-bookings .page-hero h1 {
    font-size: clamp(1.72rem, 7.8vw, 2.25rem) !important;
  }
}


/* 2026-06-05 clean typography draft v7: cache-bust after hero CTA sizing refinement. */


/* 2026-06-05 optional extras title scale fix: match brown Playfair card titles. */
.page-bookings .panel.optional-extras-card h3,
.guest-demo .panel.optional-extras-card h3 {
  font-size: var(--cc-h3, clamp(1.16rem, 1.45vw, 1.34rem)) !important;
  line-height: 1.12 !important;
  letter-spacing: -.018em !important;
  margin-bottom: .55rem !important;
}
@media (max-width: 760px) {
  .page-bookings .panel.optional-extras-card h3,
  .guest-demo .panel.optional-extras-card h3 {
    font-size: var(--cc-h3, clamp(1.04rem, 4.6vw, 1.22rem)) !important;
    line-height: 1.12 !important;
    letter-spacing: -.012em !important;
  }
}


/* 2026-06-05 About story image no dark filter: remove overlay from image above Comfort matters only. */
.page-about .about-story .about-photo-card {
  background: var(--photo, url("assets/user-uploaded/20260605-about-values-mike-jess-inside-tent.jpg")) center/cover no-repeat !important;
}


/* 2026-06-05 About events image no dark filter/text: remove overlay and Hotel Melody text from lower About image. */
.page-about .about-events .about-photo-card {
  background: var(--photo, url("assets/user-uploaded/20260605-about-festival-memories-bell-tent-field.jpg")) center/cover no-repeat !important;
}
.page-about .about-events .about-photo-card span {
  display: none !important;
}


/* 2026-06-05 area hero desktop/mobile image alignment.
   Desktop now uses the same Glastonbury field/tents image selected for the mobile area hero. */
.page-area .page-hero {
  background-position: center 48%;
}


/* 2026-06-05 desktop-only hero face crop check.
   Photo analysis: About hero faces sit around x52-72%, y37-38%; keep them visible on desktop. */
@media (min-width: 761px) {
  .page-about .about-hero {
    background-position: 60% 40% !important;
  }
  .page-area .page-hero {
    background-position: center 60% !important;
  }
}


/* 2026-06-05 desktop-only Gallery hero face crop.
   Photo analysis: Gallery hero faces sit around x40-61%, y42-43%; keep faces visible on desktop. */
@media (min-width: 761px) {
  .page-blogs .page-hero {
    background-position: 58% 42% !important;
  }
}
