@font-face{font-family:'Figtree';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/figtree-normal-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Figtree';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/figtree-normal-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Figtree';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/figtree-normal-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Figtree';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/figtree-normal-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Figtree';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/figtree-normal-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Figtree';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/figtree-normal-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/fraunces-normal-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/fraunces-normal-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:650;font-display:swap;src:url('/assets/fonts/fraunces-normal-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:650;font-display:swap;src:url('/assets/fonts/fraunces-normal-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
:root {
--linen: #FAF7F0;
--paper: #FFFFFF;
--ink: #26241C;
--ink-soft: #5E5947;
--olive: #565A33;
--olive-deep: #31331E;
--line: rgba(86, 90, 51, 0.18);
--gold: #9C8B4A;
--gold-light: #C9B878;
--brick: #8C4A3C;
--cream: #F4EFE2;
--radius: 10px;
--shadow: 0 10px 30px -18px rgba(38, 36, 28, 0.35);
--wrap: 1120px;
--ease: cubic-bezier(0.33, 1, 0.68, 1);
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
margin: 0;
font-family: "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
font-size: 1.0625rem;
line-height: 1.65;
color: var(--ink);
background: var(--linen);
-webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
figure { margin: 0; }
a { color: var(--olive); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--ink); }
[hidden] { display: none !important; }
::placeholder { color: rgba(94, 89, 71, 0.25); }
h1, h2, h3, .display {
font-family: "Fraunces", Georgia, serif;
font-weight: 600;
line-height: 1.14;
color: var(--ink);
margin: 0 0 0.6em;
text-wrap: balance;
}
h1 { font-size: clamp(2.1rem, 4.6vw, 3.3rem); letter-spacing: -0.01em; }
h2 { font-size: clamp(1.55rem, 3vw, 2.25rem); }
h3 { font-size: clamp(1.15rem, 2vw, 1.4rem); font-weight: 650; }
p { margin: 0 0 1em; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 clamp(1.1rem, 4vw, 2rem); }
.section { padding: clamp(3rem, 7vw, 5.5rem) 0; }
.section-tight { padding: clamp(2.2rem, 5vw, 3.5rem) 0; }
.kicker {
display: inline-flex; align-items: center; gap: 0.6rem;
font-size: 0.78rem; font-weight: 600; letter-spacing: 0.18em;
text-transform: uppercase; color: var(--olive); margin: 0 0 0.9rem;
}
.kicker::before { content: ""; width: 26px; height: 1px; background: var(--gold); }
.on-dark .kicker { color: var(--gold-light); }
.on-dark .kicker::before { background: var(--gold-light); }
.lede { font-size: clamp(1.08rem, 1.8vw, 1.25rem); color: var(--ink-soft); max-width: 62ch; }
.center { text-align: center; }
.center .lede, .center .kicker { margin-left: auto; margin-right: auto; }
.skip-link {
position: absolute; left: -999px; top: 0; z-index: 200;
background: var(--olive-deep); color: var(--cream); padding: 0.6rem 1rem;
}
.skip-link:focus { left: 0; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.btn {
display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
font: 600 1rem/1.2 "Figtree", sans-serif;
padding: 0.8rem 1.45rem; border-radius: 999px; border: 1px solid transparent;
cursor: pointer; text-decoration: none; white-space: nowrap;
transition: transform 0.25s var(--ease), box-shadow 0.25s var(--ease), background-color 0.25s var(--ease), color 0.25s var(--ease), border-color 0.25s var(--ease);
}
.btn:hover { transform: translateY(-1px); }
.btn svg { width: 16px; height: 16px; flex: 0 0 auto; }
.btn-book { background: var(--gold); color: #1C1A12; box-shadow: var(--shadow); }
.btn-book:hover { background: #a99751; color: #1C1A12; }
.btn-olive { background: var(--olive); color: var(--cream); }
.btn-olive:hover { background: var(--olive-deep); color: var(--cream); }
.btn-ghost { border-color: var(--olive); color: var(--olive); background: transparent; }
.btn-ghost:hover { background: var(--olive); color: var(--cream); }
.btn-ghost-light { border-color: rgba(244, 239, 226, 0.6); color: var(--cream); background: transparent; }
.btn-ghost-light:hover { background: var(--cream); color: var(--olive-deep); }
.btn-lg { padding: 0.95rem 1.8rem; font-size: 1.05rem; }
.site-head {
position: sticky; top: 0; z-index: 60;
background: rgba(250, 247, 240, 0.92);
backdrop-filter: blur(10px);
border-bottom: 1px solid var(--line);
transition: box-shadow 0.3s var(--ease);
}
.site-head.is-scrolled { box-shadow: 0 6px 24px -18px rgba(38, 36, 28, 0.5); }
.head-row { display: flex; align-items: center; gap: 1.4rem; min-height: 76px; }
.brand { display: inline-flex; align-items: center; flex: 0 1 auto; min-width: 0; }
.brand img { width: clamp(180px, 22vw, 236px); height: auto; }
.nav-primary { margin-left: auto; display: flex; align-items: center; gap: clamp(0.9rem, 2vw, 1.6rem); }
.nav-primary a:not(.btn) {
font-weight: 600; font-size: 0.98rem; color: var(--ink);
text-decoration: none; padding: 0.35rem 0; border-bottom: 2px solid transparent;
transition: color 0.2s var(--ease), border-color 0.2s var(--ease);
}
.nav-primary a:not(.btn):hover { color: var(--olive); border-bottom-color: var(--gold); }
body[data-page="home"] .nav-primary a[href="/"],
body[data-page="accommodation"] .nav-primary a[href="/accommodation/"],
body[data-page="attractions"] .nav-primary a[href="/attractions/"],
body[data-page="blog"] .nav-primary a[href="/blog/"],
body[data-page="contact"] .nav-primary a[href="/contact/"] { color: var(--olive); border-bottom-color: var(--gold); }
.nav-toggle {
display: none; margin-left: auto; background: none; border: 1px solid var(--line);
border-radius: 8px; padding: 0.5rem 0.65rem; cursor: pointer; color: var(--ink);
}
.nav-toggle svg { width: 22px; height: 22px; display: block; }
.mobile-nav {
display: none; position: fixed; inset: 76px 0 auto 0; z-index: 55;
background: var(--olive-deep); color: var(--cream);
padding: 1.2rem clamp(1.1rem, 4vw, 2rem) 1.6rem;
border-bottom: 2px solid var(--gold);
}
.mobile-nav.is-open { display: block; }
.mobile-nav a:not(.btn) {
display: block; padding: 0.7rem 0.2rem; color: var(--cream); text-decoration: none;
font: 600 1.15rem/1.3 "Figtree", sans-serif; border-bottom: 1px solid rgba(244, 239, 226, 0.12);
}
.mobile-nav a:not(.btn):hover { color: var(--gold-light); }
.mobile-nav .btn { margin-top: 1rem; width: 100%; }
@media (max-width: 900px) {
.nav-primary { display: none; }
.nav-toggle { display: inline-flex; }
}
.hero { position: relative; isolation: isolate; color: var(--cream); overflow: clip; }
.hero-media { position: absolute; inset: 0; z-index: -1; }
.hero-media img { width: 100%; height: 100%; object-fit: cover; }
.hero-media::after {
content: ""; position: absolute; inset: 0;
background: linear-gradient(180deg, rgba(30, 30, 20, 0.28) 0%, rgba(30, 30, 20, 0.18) 40%, rgba(30, 30, 20, 0.72) 100%);
}
.hero-inner { padding: clamp(5.5rem, 14vw, 10rem) 0 clamp(3.2rem, 8vw, 5.5rem); max-width: 46rem; }
.hero h1 { color: #fff; text-shadow: 0 2px 22px rgba(20, 20, 12, 0.45); }
.hero .lede { color: rgba(255, 255, 255, 0.94); text-shadow: 0 1px 14px rgba(20, 20, 12, 0.5); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-top: 1.6rem; }
.hero-chips { display: flex; flex-wrap: wrap; gap: 0.5rem 1.2rem; margin-top: 2rem; padding: 0; list-style: none; }
.hero-chips li {
display: inline-flex; align-items: center; gap: 0.45rem;
font-size: 0.9rem; font-weight: 600; color: rgba(255, 255, 255, 0.95);
}
.hero-chips svg { width: 15px; height: 15px; color: var(--gold-light); }
.hero-media img { transform: scale(1.03); animation: hero-settle 1.6s var(--ease) forwards; }
@keyframes hero-settle { to { transform: scale(1); } }
.wayfinder-band { background: var(--paper); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.wayfinder { margin: 1.8rem auto 0.4rem; max-width: 900px; }
.wayfinder svg { width: 100%; height: auto; display: block; }
.wf-road {
fill: none; stroke: var(--olive); stroke-width: 2.5; stroke-linecap: round;
stroke-dasharray: 4 9;
}
.wf-road-draw { fill: none; stroke: var(--gold); stroke-width: 2.5; stroke-linecap: round; opacity: 0; }
.wayfinder.wf-on .wf-road-draw { opacity: 1; transition: stroke-dashoffset 1.6s var(--ease) 0.15s, opacity 0.2s; }
.wf-town { fill: var(--olive); }
.wf-mid { fill: var(--gold); stroke: var(--paper); stroke-width: 3; }
.wf-label {
font: 600 15px/1 "Figtree", sans-serif; letter-spacing: 0.14em; fill: var(--ink);
}
.wf-sub { font: 600 12.5px/1 "Figtree", sans-serif; letter-spacing: 0.1em; fill: var(--ink-soft); }
.wf-here { font: 650 17px/1 "Fraunces", Georgia, serif; fill: var(--ink); letter-spacing: 0.02em; }
.wayfinder .wf-pop { opacity: 0; transform: translateY(6px); transition: opacity 0.5s var(--ease), transform 0.5s var(--ease); }
.wayfinder.wf-on .wf-pop { opacity: 1; transform: none; }
.wayfinder.wf-on .wf-pop:nth-of-type(1) { transition-delay: 0.5s; }
@media (max-width: 640px) {
.wayfinder .wf-sub { display: none; }
.wayfinder .wf-label { font-size: 30px; }
.wayfinder .wf-here { font-size: 42px; }
}
.card {
background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius);
box-shadow: var(--shadow); overflow: clip; min-width: 0;
}
.card-media { aspect-ratio: 16 / 10.5; overflow: clip; }
.card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s var(--ease); }
.card:hover .card-media img { transform: scale(1.035); }
.card-body { padding: 1.3rem 1.4rem 1.5rem; }
.card-body h3 { margin-bottom: 0.35rem; }
.card-note { color: var(--ink-soft); font-size: 0.98rem; }
.card-link { font-weight: 600; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.4rem; }
.grid-3 > *, .grid-2 > * { min-width: 0; }
@media (max-width: 900px) { .grid-3 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .grid-3, .grid-2 { grid-template-columns: 1fr; } }
.room-card { display: flex; flex-direction: column; }
.room-card .card-body { display: flex; flex-direction: column; flex: 1; }
.room-cap { font-size: 0.9rem; font-weight: 600; color: var(--olive); letter-spacing: 0.04em; }
.room-list { list-style: none; margin: 0.8rem 0 1.2rem; padding: 0; display: grid; gap: 0.35rem; }
.room-list li { display: flex; gap: 0.55rem; align-items: baseline; font-size: 0.97rem; color: var(--ink-soft); }
.room-list li::before {
content: ""; flex: 0 0 auto; width: 7px; height: 7px; border-radius: 50%;
background: var(--gold); transform: translateY(-1px);
}
.room-card .btn { margin-top: auto; align-self: flex-start; }
.amenities {
display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-top: 2rem;
}
.amenity {
background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius);
padding: 1rem 1.1rem; display: flex; align-items: center; gap: 0.8rem; min-width: 0;
}
.amenity svg { width: 26px; height: 26px; flex: 0 0 auto; color: var(--olive); }
.amenity span { font-weight: 600; font-size: 0.95rem; line-height: 1.3; }
@media (max-width: 900px) { .amenities { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 420px) { .amenities { grid-template-columns: 1fr; } }
.band-dark { background: var(--olive-deep); color: var(--cream); }
.band-dark h2, .band-dark h3 { color: var(--cream); }
.band-dark p { color: rgba(244, 239, 226, 0.88); }
.band-dark a:not(.btn) { color: var(--gold-light); }
.band-dark a:not(.btn):hover { color: var(--cream); }
.review-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; margin-top: 2.2rem; }
.review-grid > * { min-width: 0; }
.review-card {
background: rgba(244, 239, 226, 0.06); border: 1px solid rgba(244, 239, 226, 0.14);
border-radius: var(--radius); padding: 1.5rem 1.5rem 1.3rem; display: flex; flex-direction: column;
}
.stars { color: var(--gold-light); letter-spacing: 0.18em; font-size: 0.95rem; }
.review-card blockquote { margin: 0.8rem 0 1rem; font-size: 1.02rem; line-height: 1.6; flex: 1; }
.review-card cite { font-style: normal; font-size: 0.9rem; color: rgba(244, 239, 226, 0.7); }
@media (max-width: 900px) { .review-grid { grid-template-columns: 1fr; } }
.photo-band { position: relative; isolation: isolate; color: var(--cream); overflow: clip; }
.photo-band .band-media { position: absolute; inset: 0; z-index: -1; }
.photo-band .band-media img { width: 100%; height: 100%; object-fit: cover; }
.photo-band .band-media::after {
content: ""; position: absolute; inset: 0;
background: linear-gradient(90deg, rgba(38, 38, 24, 0.82) 0%, rgba(38, 38, 24, 0.55) 46%, rgba(38, 38, 24, 0.18) 100%);
}
.photo-band .band-inner { max-width: 34rem; padding: clamp(3.4rem, 8vw, 6rem) 0; }
.photo-band h2 { color: #fff; }
.photo-band p { color: rgba(255, 255, 255, 0.92); }
.gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.gallery figure {
border-radius: var(--radius); overflow: clip; border: 1px solid var(--line);
background: var(--paper); min-width: 0;
}
.gallery img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 3; }
.gallery figcaption { font-size: 0.85rem; color: var(--ink-soft); padding: 0.55rem 0.8rem; }
@media (max-width: 760px) { .gallery { grid-template-columns: 1fr 1fr; } }
.faq-list { display: grid; gap: 0.7rem; margin-top: 1.6rem; }
.faq-item {
background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius);
padding: 0; overflow: clip;
}
.faq-item summary {
cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 1rem;
align-items: center; padding: 1rem 1.25rem; font-weight: 650; font-family: "Figtree", sans-serif;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
content: "+"; font-size: 1.4rem; line-height: 1; color: var(--gold); flex: 0 0 auto;
transition: transform 0.3s var(--ease);
}
.faq-item[open] summary::after { transform: rotate(45deg); }
.faq-a { padding: 0 1.25rem 1.1rem; color: var(--ink-soft); }
.faq-a p:last-child { margin-bottom: 0; }
.form-card {
background: var(--paper); color: var(--ink); border: 1px solid var(--line);
border-radius: var(--radius); box-shadow: var(--shadow); padding: clamp(1.4rem, 3vw, 2.2rem);
}
.field { margin-bottom: 1.05rem; }
.field label { display: block; font-weight: 650; font-size: 0.95rem; margin-bottom: 0.35rem; }
.field .hint { font-weight: 400; color: var(--ink-soft); }
.field input, .field select, .field textarea {
width: 100%; font: inherit; color: var(--ink); background: var(--linen);
border: 1px solid var(--line); border-radius: 8px; padding: 0.7rem 0.85rem;
}
.field textarea { min-height: 130px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus {
outline: 2px solid var(--gold); outline-offset: 1px; border-color: var(--gold);
}
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.field-row > * { min-width: 0; }
.field select { min-width: 0; max-width: 100%; }
@media (max-width: 560px) { .field-row { grid-template-columns: 1fr; } }
.form-msg { border-radius: 8px; padding: 0.9rem 1.1rem; font-weight: 600; margin-top: 1rem; }
.form-msg.ok { background: rgba(86, 90, 51, 0.12); color: var(--olive-deep); border: 1px solid var(--olive); }
.form-msg.err { background: rgba(140, 74, 60, 0.1); color: var(--brick); border: 1px solid var(--brick); }
.contact-grid { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 2rem; align-items: start; }
.contact-grid > * { min-width: 0; }
@media (max-width: 900px) { .contact-grid { grid-template-columns: 1fr; } }
.contact-facts { display: grid; gap: 1rem; min-width: 0; }
.contact-facts > * { min-width: 0; }
.fact-tile > div { min-width: 0; overflow-wrap: anywhere; }
.fact-tile {
background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius);
padding: 1.1rem 1.25rem; display: flex; gap: 0.9rem; align-items: flex-start;
}
.fact-tile svg { width: 22px; height: 22px; flex: 0 0 auto; color: var(--olive); margin-top: 3px; }
.fact-tile strong { display: block; font-size: 0.85rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--olive); margin-bottom: 0.15rem; }
.crumbs { font-size: 0.9rem; color: var(--ink-soft); margin-bottom: 1rem; }
.crumbs a { color: var(--ink-soft); }
.crumbs a:hover { color: var(--olive); }
.post-head { max-width: 50rem; }
.post-meta { color: var(--ink-soft); font-size: 0.95rem; margin-top: 0.4rem; }
.post-hero { border-radius: var(--radius); overflow: clip; border: 1px solid var(--line); margin: 1.8rem 0; }
.post-hero img { width: 100%; height: auto; }
.post-body { max-width: 46rem; }
.post-body h2 { margin-top: 2.2em; }
.post-body h3 { margin-top: 1.6em; }
.post-body figure { margin: 1.8rem 0; border-radius: var(--radius); overflow: clip; border: 1px solid var(--line); }
.post-body figcaption { font-size: 0.85rem; color: var(--ink-soft); padding: 0.5rem 0.8rem; background: var(--paper); }
.post-body iframe { width: 100%; border: 1px solid var(--line); border-radius: var(--radius); }
.post-body blockquote {
margin: 1.6rem 0; padding: 0.4rem 0 0.4rem 1.2rem; border-left: 3px solid var(--gold);
color: var(--ink-soft); font-style: italic;
}
.table-scroll { overflow-x: auto; margin: 1.6rem 0; }
.table-scroll table { min-width: 560px; }
table { border-collapse: collapse; width: 100%; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); font-size: 0.98rem; }
th, td { text-align: left; padding: 0.65rem 0.9rem; border-bottom: 1px solid var(--line); }
th { font-family: "Figtree", sans-serif; font-size: 0.82rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--olive); }
td.num, th.num { text-align: right; padding-right: 1.2rem; }
td.num:last-child, th.num:last-child { padding-right: 0.9rem; }
tr:last-child td { border-bottom: none; }
.post-card { display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.post-card .card-body { flex: 1; display: flex; flex-direction: column; }
.card-cat {
font-size: 0.75rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
color: var(--olive); margin-bottom: 0.4rem;
}
.post-card h3 { font-size: 1.18rem; }
.post-card h3 a { color: var(--ink); text-decoration: none; }
.post-card h3 a:hover { color: var(--olive); }
.post-card .card-note { flex: 1; }
.post-card time { font-size: 0.85rem; color: var(--ink-soft); margin-top: 0.9rem; display: block; }
.dir-group { border-top: 1px solid var(--line); padding-top: 1.6rem; margin-top: 1.6rem; }
.dir-group h3 { display: flex; align-items: baseline; gap: 0.7rem; }
.dir-count { font: 600 0.8rem/1 "Figtree", sans-serif; color: var(--ink-soft); letter-spacing: 0.08em; }
.dir-list { list-style: none; margin: 0.9rem 0 0; padding: 0; columns: 2; column-gap: 2.5rem; }
.dir-list li { break-inside: avoid; padding: 0.28rem 0; }
.dir-list a { text-decoration: none; color: var(--ink); font-size: 0.99rem; }
.dir-list a:hover { color: var(--olive); text-decoration: underline; text-decoration-color: var(--gold); }
@media (max-width: 700px) { .dir-list { columns: 1; } }
.site-foot { background: var(--olive-deep); color: var(--cream); margin-top: 0; }
.foot-grid {
display: grid; grid-template-columns: 1.3fr 0.8fr 1fr 1.2fr; gap: 2rem;
padding: clamp(2.6rem, 6vw, 4rem) 0 2rem;
}
.foot-grid > * { min-width: 0; }
.site-foot h4 {
font: 600 0.8rem/1 "Figtree", sans-serif; letter-spacing: 0.18em; text-transform: uppercase;
color: var(--gold-light); margin: 0 0 1rem;
}
.site-foot p { color: rgba(244, 239, 226, 0.82); font-size: 0.97rem; }
.site-foot ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.45rem; }
.site-foot li { overflow-wrap: anywhere; }
.site-foot a:not(.btn) { color: rgba(244, 239, 226, 0.9); text-decoration: none; }
.site-foot a:not(.btn):hover { color: var(--gold-light); text-decoration: underline; }
.foot-logo-plate {
display: inline-block; background: var(--linen); border-radius: 8px; padding: 0.55rem 0.8rem; margin-bottom: 1rem;
}
.foot-logo-plate img { width: 190px; height: auto; }
.foot-wayfinder { margin-top: 0.4rem; }
.foot-wayfinder svg { width: 100%; max-width: 300px; height: auto; }
.foot-wayfinder .wf-label { fill: rgba(244, 239, 226, 0.85); font-size: 13.5px; }
.foot-wayfinder .wf-road { stroke: rgba(244, 239, 226, 0.5); stroke-width: 2; }
.foot-wayfinder .wf-town { fill: rgba(244, 239, 226, 0.8); }
.foot-wayfinder .wf-mid { fill: var(--gold-light); stroke: var(--olive-deep); }
.foot-bottom {
border-top: 1px solid rgba(244, 239, 226, 0.14); padding: 1.2rem 0 1.6rem;
display: flex; flex-wrap: wrap; gap: 0.6rem 1.6rem; justify-content: space-between;
font-size: 0.88rem; color: rgba(244, 239, 226, 0.65);
}
.foot-bottom a { color: rgba(244, 239, 226, 0.75); }
@media (max-width: 900px) { .foot-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .foot-grid { grid-template-columns: 1fr; } }
.mobile-book-bar {
position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
display: none; gap: 0.7rem; padding: 0.65rem clamp(0.9rem, 4vw, 1.4rem);
padding-bottom: calc(0.65rem + env(safe-area-inset-bottom, 0px));
background: rgba(49, 51, 30, 0.97); border-top: 1px solid rgba(244, 239, 226, 0.18);
}
.mobile-book-bar .btn { flex: 1; padding: 0.75rem 0.5rem; font-size: 0.98rem; }
@media (max-width: 760px) {
.mobile-book-bar { display: flex; }
body { padding-bottom: 64px; }
}
.cta-band { text-align: center; }
.cta-band .btn { margin: 0.3rem 0.4rem; }
.cta-phone { margin-top: 1.1rem; font-size: 1rem; }
.reveal { opacity: 0; transform: translateY(18px); transition: opacity 0.6s var(--ease), transform 0.6s var(--ease); }
.reveal.is-in { opacity: 1; transform: none; }
.reveal-2 { transition-delay: 0.12s; }
.reveal-3 { transition-delay: 0.24s; }
.no-js .reveal { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
html { scroll-behavior: auto; }
*, *::before, *::after { animation-duration: 0.001s !important; transition-duration: 0.001s !important; }
.reveal { opacity: 1; transform: none; }
.hero-media img { transform: none; animation: none; }
.wayfinder .wf-pop { opacity: 1; transform: none; }
.wayfinder .wf-road-draw { opacity: 1; stroke-dashoffset: 0 !important; }
}
.page-banner { padding-top: clamp(2.6rem, 6vw, 4.2rem); padding-bottom: clamp(1.6rem, 4vw, 2.6rem); }
.page-banner .lede { margin-top: 0.4rem; }
.mt-0 { margin-top: 0; }
.mb-0 { margin-bottom: 0; }
.small { font-size: 0.9rem; color: var(--ink-soft); }
.divider-orn { display: flex; justify-content: center; margin: 0 0 1.2rem; color: var(--olive); }
.divider-orn svg { width: 88px; height: 18px; }
main [id] { scroll-margin-top: 96px; }
.num-index {
list-style: none; counter-reset: ni; margin: 1.6rem 0 0; padding: 0;
display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.7rem;
}
.num-index.cols-4 { grid-template-columns: repeat(4, 1fr); }
.num-index li { counter-increment: ni; min-width: 0; }
.num-index a {
display: flex; align-items: center; gap: 0.75rem; text-decoration: none;
background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius);
padding: 0.7rem 0.9rem; color: var(--ink); font-weight: 600; font-size: 0.97rem;
transition: border-color 0.25s var(--ease), transform 0.25s var(--ease);
}
.num-index a:hover { border-color: var(--gold); transform: translateY(-1px); color: var(--olive); }
.num-index a::before {
content: counter(ni); flex: 0 0 auto; width: 1.7rem; height: 1.7rem;
display: inline-flex; align-items: center; justify-content: center; border-radius: 50%;
background: var(--olive); color: var(--cream); font: 650 0.9rem/1 "Fraunces", Georgia, serif;
}
@media (max-width: 900px) { .num-index, .num-index.cols-4 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .num-index, .num-index.cols-4 { grid-template-columns: 1fr; } }
.idea-index { margin: 1.2rem 0 0; padding: 0 0 0 1.4rem; columns: 3; column-gap: 2.5rem; font-weight: 600; }
.idea-index.cols-2 { columns: 2; }
.idea-index li { break-inside: avoid; padding: 0.25rem 0; }
.idea-index li::marker { color: var(--olive); font-weight: 600; }
@media (max-width: 860px) { .idea-index { columns: 2; } }
@media (max-width: 540px) { .idea-index, .idea-index.cols-2 { columns: 1; } }
.chips { display: flex; flex-wrap: wrap; gap: 0.45rem; margin-top: 0.9rem; }
.chip {
display: inline-flex; align-items: center; gap: 0.4rem;
font-size: 0.79rem; font-weight: 600; letter-spacing: 0.04em; color: var(--olive);
background: rgba(86, 90, 51, 0.08); border-radius: 999px; padding: 0.2rem 0.68rem;
}
.chip strong { font-weight: 700; color: var(--olive-deep); }
.dot-list { list-style: none; margin: 0.8rem 0 0; padding: 0; display: grid; gap: 0.35rem; }
.dot-list li { display: flex; gap: 0.55rem; align-items: baseline; font-size: 0.97rem; color: var(--ink-soft); }
.dot-list li::before {
content: ""; flex: 0 0 auto; width: 7px; height: 7px; border-radius: 50%;
background: var(--olive); transform: translateY(-1px);
}