/* ==== ported from V2 by scripts/v5/v2-port (prune-css.cjs, port-css.cjs): re-run the port rather than editing above the end marker ==== */
/* ==== v2 sheet 9 of https://bhhl.lettiva.com/hope-mansell-hall/the-house: <style> /* Chapter ordinal — large Roman numeral above the eyebrow.  ==== */
.hero-16-chapter-index { font-family: var(--font-display); font-weight: 300; font-size: var(--type-h1); line-height: 1; color: var(--accent); margin-bottom: var(--space-6); font-variant-numeric: oldstyle-nums; }
/* ==== v2 sheet 10 of https://bhhl.lettiva.com/hope-mansell-hall/the-house: <style> .content-section-2 { container-type: inline-size; } /* ──  ==== */
.content-section-2 { container-type: inline-size; }
.content-section-2 .cs2-head { max-width: 55ch; margin-bottom: var(--space-12); }
.content-section-2 .cs2-head .cs2-eyebrow { margin-bottom: var(--space-5); }
.content-section-2 .cs2-head .cs2-sub { margin-top: var(--space-5); color: var(--muted-foreground-1); max-width: 52ch; }
.content-section-2.cs2-v-ledger .cs2-head { max-width: none; display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-8); flex-wrap: wrap; padding-bottom: var(--space-5); border-bottom: 1px solid color-mix(in srgb, var(--foreground) 15%, transparent); }
.content-section-2.cs2-v-ledger .cs2-head-main { max-width: 55ch; }
.content-section-2.cs2-v-ledger .cs2-meta { font-family: var(--font-mono); font-size: var(--type-eyebrow); letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted-foreground-1); font-feature-settings: "lnum", "tnum"; white-space: nowrap; }
.content-section-2.cs2-v-ledger .cs2-meta::before { content: ""; display: inline-block; width: 28px; height: 1px; background: var(--accent); vertical-align: middle; margin-right: 12px; opacity: 0.8; }
.content-section-2.cs2-v-centered .cs2-head { max-width: none; text-align: center; display: flex; flex-direction: column; align-items: center; margin-bottom: var(--space-16); }
.content-section-2.cs2-v-centered .cs2-heading { max-width: 24ch; margin-inline: auto; }
.content-section-2.cs2-v-centered .cs2-sub { margin-left: auto; margin-right: auto; max-width: 48ch; }
.content-section-2.cs2-v-centered .cs2-ornament { width: 36px; height: 1px; border: 0px; margin: var(--space-6) auto 0; background: color-mix(in srgb, var(--foreground) 30%, transparent); }
.content-section-2 .cs2-ornament { display: none; }
.content-section-2.cs2-v-centered .cs2-ornament { display: block; }
@container (max-width: 720px) {
.content-section-2.cs2-v-ledger .cs2-head { flex-direction: column; align-items: flex-start; gap: var(--space-3); }
.content-section-2 .cs2-head { margin-bottom: var(--space-8); }
.content-section-2.cs2-v-centered .cs2-head { margin-bottom: var(--space-10); }
}
/* ==== v2 sheet 11 of https://bhhl.lettiva.com/hope-mansell-hall/the-house: <style> .content-section-2 { container-type: inline-size; } /* ──  ==== */
.content-section-2 { container-type: inline-size; }
.content-section-2 .cs2-head { max-width: 55ch; margin-bottom: var(--space-12); }
.content-section-2 .cs2-head .cs2-eyebrow { margin-bottom: var(--space-5); }
.content-section-2 .cs2-head .cs2-sub { margin-top: var(--space-5); color: var(--muted-foreground-1); max-width: 52ch; }
.content-section-2.cs2-v-ledger .cs2-head { max-width: none; display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-8); flex-wrap: wrap; padding-bottom: var(--space-5); border-bottom: 1px solid color-mix(in srgb, var(--foreground) 15%, transparent); }
.content-section-2.cs2-v-ledger .cs2-head-main { max-width: 55ch; }
.content-section-2.cs2-v-ledger .cs2-meta { font-family: var(--font-mono); font-size: var(--type-eyebrow); letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted-foreground-1); font-feature-settings: "lnum", "tnum"; white-space: nowrap; }
.content-section-2.cs2-v-ledger .cs2-meta::before { content: ""; display: inline-block; width: 28px; height: 1px; background: var(--accent); vertical-align: middle; margin-right: 12px; opacity: 0.8; }
.content-section-2.cs2-v-centered .cs2-head { max-width: none; text-align: center; display: flex; flex-direction: column; align-items: center; margin-bottom: var(--space-16); }
.content-section-2.cs2-v-centered .cs2-heading { max-width: 24ch; margin-inline: auto; }
.content-section-2.cs2-v-centered .cs2-sub { margin-left: auto; margin-right: auto; max-width: 48ch; }
.content-section-2.cs2-v-centered .cs2-ornament { width: 36px; height: 1px; border: 0px; margin: var(--space-6) auto 0; background: color-mix(in srgb, var(--foreground) 30%, transparent); }
.content-section-2 .cs2-ornament { display: none; }
.content-section-2.cs2-v-centered .cs2-ornament { display: block; }
@container (max-width: 720px) {
.content-section-2.cs2-v-ledger .cs2-head { flex-direction: column; align-items: flex-start; gap: var(--space-3); }
.content-section-2 .cs2-head { margin-bottom: var(--space-8); }
.content-section-2.cs2-v-centered .cs2-head { margin-bottom: var(--space-10); }
}
/* ==== v2 sheet 12 of https://bhhl.lettiva.com/hope-mansell-hall/the-house: <style> .content-section-2 { container-type: inline-size; } /* ──  ==== */
.content-section-2 { container-type: inline-size; }
.content-section-2 .cs2-head { max-width: 55ch; margin-bottom: var(--space-12); }
.content-section-2 .cs2-head .cs2-eyebrow { margin-bottom: var(--space-5); }
.content-section-2 .cs2-head .cs2-sub { margin-top: var(--space-5); color: var(--muted-foreground-1); max-width: 52ch; }
.content-section-2.cs2-v-ledger .cs2-head { max-width: none; display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-8); flex-wrap: wrap; padding-bottom: var(--space-5); border-bottom: 1px solid color-mix(in srgb, var(--foreground) 15%, transparent); }
.content-section-2.cs2-v-ledger .cs2-head-main { max-width: 55ch; }
.content-section-2.cs2-v-ledger .cs2-meta { font-family: var(--font-mono); font-size: var(--type-eyebrow); letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted-foreground-1); font-feature-settings: "lnum", "tnum"; white-space: nowrap; }
.content-section-2.cs2-v-ledger .cs2-meta::before { content: ""; display: inline-block; width: 28px; height: 1px; background: var(--accent); vertical-align: middle; margin-right: 12px; opacity: 0.8; }
.content-section-2.cs2-v-centered .cs2-head { max-width: none; text-align: center; display: flex; flex-direction: column; align-items: center; margin-bottom: var(--space-16); }
.content-section-2.cs2-v-centered .cs2-heading { max-width: 24ch; margin-inline: auto; }
.content-section-2.cs2-v-centered .cs2-sub { margin-left: auto; margin-right: auto; max-width: 48ch; }
.content-section-2.cs2-v-centered .cs2-ornament { width: 36px; height: 1px; border: 0px; margin: var(--space-6) auto 0; background: color-mix(in srgb, var(--foreground) 30%, transparent); }
.content-section-2 .cs2-ornament { display: none; }
.content-section-2.cs2-v-centered .cs2-ornament { display: block; }
@container (max-width: 720px) {
.content-section-2.cs2-v-ledger .cs2-head { flex-direction: column; align-items: flex-start; gap: var(--space-3); }
.content-section-2 .cs2-head { margin-bottom: var(--space-8); }
.content-section-2.cs2-v-centered .cs2-head { margin-bottom: var(--space-10); }
}
/* ==== v2 sheet 13 of https://bhhl.lettiva.com/hope-mansell-hall/the-house: <style> .content-section-2 { container-type: inline-size; } /* ──  ==== */
.content-section-2 { container-type: inline-size; }
.content-section-2 .cs2-head { max-width: 55ch; margin-bottom: var(--space-12); }
.content-section-2 .cs2-head .cs2-eyebrow { margin-bottom: var(--space-5); }
.content-section-2 .cs2-head .cs2-sub { margin-top: var(--space-5); color: var(--muted-foreground-1); max-width: 52ch; }
.content-section-2.cs2-v-ledger .cs2-head { max-width: none; display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-8); flex-wrap: wrap; padding-bottom: var(--space-5); border-bottom: 1px solid color-mix(in srgb, var(--foreground) 15%, transparent); }
.content-section-2.cs2-v-ledger .cs2-head-main { max-width: 55ch; }
.content-section-2.cs2-v-ledger .cs2-meta { font-family: var(--font-mono); font-size: var(--type-eyebrow); letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted-foreground-1); font-feature-settings: "lnum", "tnum"; white-space: nowrap; }
.content-section-2.cs2-v-ledger .cs2-meta::before { content: ""; display: inline-block; width: 28px; height: 1px; background: var(--accent); vertical-align: middle; margin-right: 12px; opacity: 0.8; }
.content-section-2.cs2-v-centered .cs2-head { max-width: none; text-align: center; display: flex; flex-direction: column; align-items: center; margin-bottom: var(--space-16); }
.content-section-2.cs2-v-centered .cs2-heading { max-width: 24ch; margin-inline: auto; }
.content-section-2.cs2-v-centered .cs2-sub { margin-left: auto; margin-right: auto; max-width: 48ch; }
.content-section-2.cs2-v-centered .cs2-ornament { width: 36px; height: 1px; border: 0px; margin: var(--space-6) auto 0; background: color-mix(in srgb, var(--foreground) 30%, transparent); }
.content-section-2 .cs2-ornament { display: none; }
.content-section-2.cs2-v-centered .cs2-ornament { display: block; }
@container (max-width: 720px) {
.content-section-2.cs2-v-ledger .cs2-head { flex-direction: column; align-items: flex-start; gap: var(--space-3); }
.content-section-2 .cs2-head { margin-bottom: var(--space-8); }
.content-section-2.cs2-v-centered .cs2-head { margin-bottom: var(--space-10); }
}
/* ==== v2 sheet 14 of https://bhhl.lettiva.com/hope-mansell-hall/the-house: <style> /* Atmospheric CSS * / @layer atmospheric { /* ══════════════ ==== */
@layer atmospheric {
[data-section="inside-the-hall"] { background: linear-gradient(rgb(250, 247, 240) 0%, rgb(245, 240, 230) 100%); position: relative; }
[data-section="inside-the-hall"]::before { content: ""; position: absolute; inset: 0px; background-image: radial-gradient(at 23% 17%, rgba(26, 39, 64, 0.02), transparent 38%), radial-gradient(at 78% 73%, rgba(26, 39, 64, 0.024), transparent 42%); pointer-events: none; z-index: 0; }
[data-section="inside-the-hall"] > * { position: relative; z-index: 1; }
[data-section="everything-included"] { background: linear-gradient(rgb(250, 247, 240) 0%, rgb(245, 240, 230) 100%); position: relative; }
[data-section="everything-included"]::before { content: ""; position: absolute; inset: 0px; background-image: radial-gradient(at 23% 17%, rgba(26, 39, 64, 0.02), transparent 38%), radial-gradient(at 78% 73%, rgba(26, 39, 64, 0.024), transparent 42%); pointer-events: none; z-index: 0; }
[data-section="everything-included"] > * { position: relative; z-index: 1; }
[data-section="questions"] { background: rgba(255, 255, 255, 0.94); backdrop-filter: blur(12px); border-top: 1px solid rgba(26, 39, 64, 0.08); border-bottom: 1px solid rgba(26, 39, 64, 0.08); box-shadow: rgba(255, 255, 255, 0.85) 0px 1px 0px inset; }
[data-section] a[href="/enquire"], [data-section] a[href="/book"], [data-section] a[href="/contact"], [data-section] a[class*="bg-"] { position: relative; z-index: 10; box-shadow: rgba(0, 0, 0, 0.08) 0px 2px 8px, rgba(0, 0, 0, 0.06) 0px 8px 24px; transition: transform 0.25s, box-shadow 0.25s, background-color 0.25s; }
[data-section] a[href="/enquire"]:hover, [data-section] a[href="/book"]:hover, [data-section] a[href="/contact"]:hover, [data-section] a[class*="bg-"]:hover { transform: translateY(-1px); box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px, rgba(0, 0, 0, 0.08) 0px 12px 32px; }
[data-section="welcome"], [data-section="guest-book"], [data-section="inside-the-hall"], [data-section="everything-included"], [data-section="how-the-rooms-work"], [data-section="gardens"], [data-section="ground-notes"], [data-section="occasions"], [data-section="the-valley"], [data-section="eat-and-drink"], [data-section="our-story"], [data-section="letter-close"] { position: relative; }
[data-section="welcome"]::after, [data-section="guest-book"]::after, [data-section="inside-the-hall"]::after, [data-section="everything-included"]::after, [data-section="how-the-rooms-work"]::after, [data-section="gardens"]::after, [data-section="ground-notes"]::after, [data-section="occasions"]::after, [data-section="the-valley"]::after, [data-section="eat-and-drink"]::after, [data-section="our-story"]::after, [data-section="letter-close"]::after { content: ""; position: absolute; inset: 0px; pointer-events: none; z-index: 1; background: linear-gradient(168deg, rgba(196, 142, 72, 0.05) 0%, rgba(196, 142, 72, 0.016) 45%, rgba(26, 39, 64, 0.024) 100%); }
[data-section="availability"], [data-section="questions"], [data-section="floor-plans"], [data-section="fine-print"], [data-section="talk-to-a-person"] { position: relative; }
[data-section="availability"]::after, [data-section="questions"]::after, [data-section="floor-plans"]::after, [data-section="fine-print"]::after, [data-section="talk-to-a-person"]::after { content: ""; position: absolute; inset: 0px; pointer-events: none; z-index: 1; background: radial-gradient(at 10% 0%, rgba(255, 255, 255, 0.45), transparent 50%), linear-gradient(rgba(23, 56, 69, 0.035) 0%, rgba(23, 56, 69, 0) 35%); }
[data-page="the-house"] [data-section="arrival"] [data-hero-overlay] { background: linear-gradient(rgba(26, 39, 64, 0.36) 0%, rgba(26, 39, 64, 0.1) 38%, rgba(26, 39, 64, 0.04) 62%, rgba(26, 39, 64, 0.42) 100%) !important; }
[data-section="late-afternoon"] { position: relative; }
[data-section="late-afternoon"]::after { content: ""; position: absolute; inset: 0px; pointer-events: none; z-index: 1; background: radial-gradient(at 50% 55%, rgba(212, 156, 84, 0.06), transparent 70%); }
}
/* ==== v2 sheet 15 of https://bhhl.lettiva.com/hope-mansell-hall/the-house: <style> .sticky-booking-widget-floating-mobile { display: none; }  ==== */
.sticky-booking-widget-floating-mobile { display: none; }
@media (max-width: 768px) {
.sticky-booking-widget-floating-desktop { display: none !important; }
.sticky-booking-widget-floating-mobile { display: block; }
body { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
}
/* ==== end of the ported V2 CSS; the port's own V5 rules follow ==== */
/* ==== the house page's own rules (the port's V5 rules, after the marker above) ==== */

/* The sleeping arrangements (V2: BedroomConfig's cards). The numerals I, II, III are counted in CSS from
   the list; V2's layouts for two floors or more, six rooms or more and a single room are chosen by the
   probes the page carries (an invisible item that exists only when the list is that long). */
.port-probe { display: none; }
.port-lower { text-transform: lowercase; }
/* A room's beds ("2 singles") and their notes come worded from the record (bedCount, bedWord, bedNotes). */
.port-bedroom-cards { counter-reset: port-room; }
.port-bedroom { counter-increment: port-room; }
.port-bedroom-num::before { content: counter(port-room, upper-roman); }
.port-floor-range::before { content: counter(port-floor-first, upper-roman) "–" counter(port-floor-last, upper-roman); }
.port-bedroom-floor:not(:has(.port-probe-floor-rooms-2)) .port-floor-range::before { content: counter(port-floor-first, upper-roman); }
.port-bedroom-config:has(.port-probe-floors-2) .port-floor-rooms { margin-top: 3rem; }
.port-bedroom-config:not(:has(.port-probe-floors-2)) .port-floor-way { display: none; }
.port-bedroom-config h2:has(.port-rooms-many) .port-rooms-one, .port-bedroom-config h2:has(.port-floors-many) .port-floors-one { display: none; }
.port-bedroom-config:not(:has(.port-probe-rooms-6)) .port-bedroom-star { display: none; }

/* The floor plans (V2: FloorPlansWrapper). One plan alone is centred, with no label under it. */
.port-floor-plan-grid:has(> :only-child) { grid-template-columns: repeat(1, minmax(0, 1fr)); max-width: 32rem; margin-inline: auto; }
.port-floor-plan-grid:has(> :only-child) .port-floor-plan-label { display: none; }

/* The features checklist (V2: PropertyFeaturesWrapper). "Show N more": N is counted in CSS from the list
   itself; the rest opens above the button, as in V2. A list of four or fewer takes two columns. */
.port-features { counter-reset: port-more; }
.port-more-count { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.port-more-count > * { counter-increment: port-more; }
.port-more-n::before { content: counter(port-more); }
.port-more:not(:has(.port-more-rest > * > *)) { display: none; }
.port-more > summary { list-style: none; cursor: pointer; text-align: center; }
.port-more > summary::-webkit-details-marker { display: none; }
.port-more[open] .port-more-show, .port-more:not([open]) .port-more-less { display: none; }
.port-more[open] > summary svg { transform: rotate(180deg); }
.port-more[open] { display: flex; flex-direction: column; }
.port-more[open] > summary { order: 1; }
.port-more-rest { margin-top: 3rem; }
@media (min-width: 1024px) {
.port-features-grid:not(:has(> :nth-child(5))) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* The amenities (V2: PropertyAmenitiesWrapper's headline list and its sheet). The sheet is V2's drawer from
   the right, with the platform's own sheet script (scrim, close button, Escape); with no script it opens in
   place under the button. It shows for eight amenities or more, as V2 showed it. */
.port-amenity-icon { display: inline-flex; }
.port-amenity-icon > svg { width: 21px; height: 21px; stroke-width: 1.4; }
.port-amenity-sheet .port-amenity-icon > svg { width: 17px; height: 17px; stroke-width: 1.5; }
.port-amenities:not(:has(.port-probe-amenities-8)) .port-amenity-sheet { display: none; }
.port-amenity-sheet > summary { list-style: none; cursor: pointer; }
.port-amenity-sheet > summary::-webkit-details-marker { display: none; }
.port-amenity-sheet[open] > .sheet-panel { margin-top: 2rem; }
html:not(.js-sheet) .port-amenity-sheet .sheet-head > div { display: none; }
html.js-sheet .port-amenity-sheet[open] > .sheet-panel { position: fixed; top: 0; right: 0; bottom: 0; z-index: 1210; width: min(560px, 92vw); margin: 0; overflow-y: auto; background-color: var(--background); padding: 2rem 2rem 4rem; box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); animation: port-sheet-in 340ms ease-in-out both; }
@media (min-width: 768px) {
html.js-sheet .port-amenity-sheet[open] > .sheet-panel { padding: 2.5rem 2.5rem 4rem; }
}
html.js-sheet .port-amenity-sheet .sheet-close { position: absolute; top: 1.75rem; right: 1.75rem; padding: 0.25rem; border: 0; background: none; font-size: 26px; line-height: 1; color: var(--muted-foreground-1); cursor: pointer; }
html.js-sheet .port-amenity-sheet .sheet-close:hover { color: var(--foreground); }
.port-amenities > .sheet-scrim { position: fixed; inset: 0; z-index: 1200; background-color: color-mix(in srgb, var(--foreground) 42%, transparent); }
html.sheet-open { overflow: hidden; }
@keyframes port-sheet-in {
from { transform: translateX(100%); }
to { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
html.js-sheet .port-amenity-sheet[open] > .sheet-panel { animation: none; }
}

/* The film (V2: VirtualTourWrapper's frame). The platform's frame is sized by its own ratio; the frame
   inside V2's rounded box fills it. */



/* The house rules (V2: PropertyHouseRulesWrapper). One column alone takes the width; the prose keeps a rule
   per line (V2 ran those lines together). */
@media (min-width: 768px) {
.port-house-rules-cols:has(> :only-child) { grid-template-columns: repeat(1, minmax(0, 1fr)); }
}
.port-house-rules-prose > p + p { margin-top: 1rem; }
.port-house-rules-cols + .port-house-rules-prose { margin-top: 3.5rem; }
.port-house-rules-prose > p { white-space: pre-line; }

/* Tap targets (a V5 rule: a link or button is at least 44px tall on a phone). V2 drew this page's small
   controls (the section tabs, "Show N more", "Show all N amenities", the question categories, whose rule is the site
   sheet's) at the height of their words; below 1024px each is 44px tall here, its words centred in it, and from 1024px
   up they are V2's own size. The drawer's close button is 44px square the same way. The phone's tab strip is
   44px tall, so the sections it jumps to stop 8px lower. */
@media (max-width: 1023.98px) {
.port-more > summary { display: flex; align-items: center; justify-content: center; min-height: 44px; }
.port-amenity-sheet > summary { min-height: 44px; }
html.js-sheet .port-amenity-sheet .sheet-close { top: 0.75rem; right: 0.75rem; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; }
}

/* The features, V2's icon rows (V2: PropertyFeaturesWrapper, icon-row): a hairline above every row but the first of each block. */
.port-feature-rows > .port-feature-row + .port-feature-row { border-top-style: var(--tw-border-style, solid); border-top-width: 1px; border-color: var(--border-line-2); }
.port-bed-notes::before { content: "("; }
.port-bed-notes::after { content: ")"; }
.port-bed-notes:not(:has(.port-bed-note)) { display: none; }
.port-bed-note-slot:has(.port-bed-note) ~ .port-bed-note-slot .port-bed-note::before { content: ", "; }



/* The virtual tour frame (the block goes while no tour is on record): full bleed on a phone, a rounded 16:9 frame from 768px, as on Symonds Yat Lodge. */
.aspect-video { aspect-ratio: 16 / 9; } .border-y { border-block-style: solid; border-block-width: 1px; } .mx-\[calc\(-1\*var\(--section-pad-x\,1\.5rem\)\)\] { margin-inline: calc(-1 * var(--section-pad-x, 1.5rem)); } .w-\[calc\(100\%\+2\*var\(--section-pad-x\,1\.5rem\)\)\] { width: calc(100% + 2 * var(--section-pad-x, 1.5rem)); } @media (min-width: 48rem) { .md\:mx-0 { margin-inline: 0; } .md\:w-full { width: 100%; } .md\:rounded-xl { border-radius: var(--radius-xl, 0.75rem); } .md\:border { border-style: solid; border-width: 1px; } .md\:border-line-2 { border-color: var(--border-line-2); } }
.port-fcards:not(:has(> :nth-child(2))) { grid-template-columns: repeat(1, minmax(0, 1fr)); }
[data-section] > *:has(.port-amenity-sheet[open]) { z-index: 1300; }
.port-tour .lv-video > iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
@media (min-width: 640px) { .port-fcards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .port-fcards { grid-template-columns: repeat(3, minmax(0, 1fr)); } .port-fcards:not(:has(> :nth-child(3))) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }