@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600&display=swap');

:root { --cream:#f5ead8; --ink:#171612; --muted:#756d60; --line:rgba(23,22,18,.2); --dark:#24231f; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--cream); font:16px Lora, Georgia, serif; }
a { color:inherit; }
.site-nav { position:absolute; z-index:10; top:0; right:0; display:flex; gap:2.6rem; padding:2.2rem 4rem; color:#fff; }
.nav-link { padding-bottom:.35rem; text-decoration:none; border-bottom:1px solid transparent; }
.nav-link:hover, .nav-link.active { border-color:currentColor; }
.photo-hero { position:relative; min-height:100vh; background:linear-gradient(rgba(15,22,30,.16),rgba(15,22,30,.3)),url('assets/hero.jpg') center/cover no-repeat; }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.08),transparent 35%,rgba(0,0,0,.28)); }
.hero-copy { position:absolute; left:8vw; bottom:10vh; max-width:620px; color:#fff; }
.hero-copy h1 { margin:.5rem 0 1.3rem; font-size:clamp(3rem,7vw,7rem); line-height:.98; font-weight:400; }
.hero-copy > p:not(.eyebrow) { max-width:500px; font-size:1.2rem; line-height:1.6; }
.eyebrow { color:var(--muted); text-transform:uppercase; letter-spacing:.18em; font-size:.72rem; }
.eyebrow.light { color:rgba(255,255,255,.82); }
.hero-actions, .contact-actions { display:flex; gap:1rem; flex-wrap:wrap; margin-top:2rem; }
.button { display:inline-block; padding:.95rem 1.45rem; text-decoration:none; border:1px solid currentColor; transition:.2s; }
.button-light { color:#fff; border-color:#fff; }
.button-light:hover { background:#fff; color:var(--ink); }
.button-ghost { color:#fff; background:rgba(255,255,255,.1); }
.button-ghost:hover { background:#fff; color:var(--ink); }
.button-dark:hover { background:var(--ink); color:var(--cream); }
.feature-band { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; padding:5rem 8vw; background:var(--line); }
.feature-card { display:grid; gap:1rem; min-height:190px; padding:2rem; background:var(--cream); text-decoration:none; }
.feature-card strong { font-size:1.4rem; font-weight:400; }
.feature-card span, .text-copy, .service-grid p, .contact-preview p { color:var(--muted); line-height:1.7; }
.feature-card:hover strong, .text-link:hover, .reservation-text-link:hover { text-decoration:underline; text-underline-offset:.3em; }
.text-section { padding:9rem 8vw; }
.two-column { display:grid; grid-template-columns:1fr 1fr; gap:8vw; }
.text-section h2, .service-section h2, .contact-preview h2 { margin:.5rem 0; font-size:clamp(2.2rem,4.5vw,5rem); line-height:1.05; font-weight:400; }
.text-copy { max-width:570px; line-height:1.85; }
.text-copy p { margin-top:0; margin-bottom:1.6rem; }
.text-link, .reservation-text-link { display:inline-block; margin-top:1rem; text-underline-offset:.3em; }
.service-section { padding:8rem 8vw; background:#e9dec9; }
.section-heading { max-width:650px; }
.section-heading > p:last-child { color:var(--muted); line-height:1.8; }
.service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; margin-top:5rem; }
.service-grid article { padding-top:1.5rem; border-top:1px solid var(--line); }
.service-grid h3 { margin:0 0 1rem; font-size:1.5rem; font-weight:400; }
.rooms-preview { padding:8rem 8vw; background:#f0e5d3; }
.rooms-preview-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-top:3rem; }
.room-card { overflow:hidden; background:#e9dec9; }
.room-card img { display:block; width:100%; aspect-ratio:1.15; object-fit:cover; }
.room-card-body { display:block; padding:1.35rem; }
.room-card-body strong { display:block; font-size:1.2rem; font-weight:400; }
.room-card-body small, .room-meta { display:block; margin-top:.55rem; color:var(--muted); line-height:1.5; }
.rooms-preview .room-card { text-decoration:none; transition:transform .2s ease; }
.rooms-preview .room-card:hover { transform:translateY(-4px); }
.rooms-stat-band { display:flex; flex-wrap:wrap; gap:1px; margin-top:2.5rem; background:var(--line); }
.rooms-stat-band span { flex:1; min-width:180px; padding:1.25rem 1.5rem; background:var(--cream); color:var(--muted); }
.rooms-stat-band strong { display:block; margin-bottom:.25rem; color:var(--ink); font-size:1.7rem; font-weight:400; }
.rooms-preview-link { margin-top:2.5rem; }
.rooms-main .page-intro { padding-bottom:2rem; }
.rooms-stat-band-page { margin:0 0 3rem; }
.rooms-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.rooms-grid .room-card { display:grid; grid-template-columns:42% 58%; }
.rooms-grid .room-card img { height:100%; min-height:245px; aspect-ratio:auto; }
.room-card-title { display:flex; justify-content:space-between; gap:1rem; align-items:start; }
.room-card-title h2 { margin:0; font-size:1.35rem; line-height:1.15; font-weight:400; }
.room-status { flex:none; padding:.3rem .45rem; color:var(--muted); border:1px solid var(--line); font-size:.68rem; text-transform:uppercase; letter-spacing:.08em; }
.rooms-grid .room-card-body > p:not(.room-meta) { color:var(--muted); line-height:1.65; }
.room-reserve { margin-top:1rem; font-size:.85rem; }
.room-card-inactive { opacity:.78; }
.rooms-note { max-width:760px; margin:8rem 0 0; padding:4rem; background:#e9dec9; }
.rooms-note h2 { margin:.5rem 0 1rem; font-size:clamp(2.2rem,4vw,4rem); font-weight:400; }
.rooms-note p:not(.eyebrow) { color:var(--muted); line-height:1.8; }
.pricing-copy { max-width:450px; color:var(--muted); line-height:1.8; }
.photo-strip { display:grid; grid-template-columns:1fr 1fr; min-height:540px; }
.photo-tile { background-position:center; background-size:cover; }
.photo-tile-wellness { background-image:url('assets/wellness.jpg'); }
.photo-tile-house { background-image:url('assets/house.jpg'); }
.location-section { background:#f0e5d3; }
.contact-preview { display:flex; justify-content:space-between; align-items:end; gap:3rem; padding:8rem 8vw; color:var(--cream); background:var(--dark); }
.contact-preview .eyebrow { color:#cbbda6; }
.contact-preview p { color:#cbbda6; line-height:1.9; }
.contact-preview a { text-underline-offset:.25em; }
.reservation-text-link { color:var(--cream); }
.site-footer { display:flex; justify-content:space-between; gap:1rem; padding:2rem 4rem; color:var(--muted); background:var(--cream); font-size:.85rem; }
.footer-social { display:flex; gap:1.2rem; }
.footer-social a { text-decoration:none; }
.site-nav-dark { position:relative; color:var(--ink); border-bottom:1px solid var(--line); }
.inner-main { max-width:1200px; margin:0 auto; padding:4rem 4rem 8rem; }
.page-intro { max-width:760px; padding:5rem 0 4rem; }
.page-intro p { color:var(--muted); font-size:1.1rem; line-height:1.8; }
.gallery-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.gallery-grid img { display:block; width:100%; aspect-ratio:1.3; object-fit:cover; }
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:start; }
.contact-details p { margin:1.5rem 0; line-height:1.8; }
.contact-details a { text-underline-offset:.22em; }
iframe { display:block; width:100%; min-height:310px; margin-top:2rem; border:0; filter:grayscale(1) contrast(.9); }
.contact-form { display:grid; gap:1.2rem; }
.contact-form h2, .contact-details h2 { margin-top:0; }
.contact-form label { display:grid; gap:.5rem; color:var(--muted); font-size:.85rem; }
input, textarea { width:100%; padding:1rem; color:var(--ink); background:rgba(255,255,255,.18); border:1px solid var(--line); font:inherit; }
textarea { min-height:160px; resize:vertical; }
.contact-form button { padding:1rem 1.4rem; color:var(--cream); background:var(--ink); border:1px solid var(--ink); font:inherit; cursor:pointer; }
.form-note { color:var(--muted); line-height:1.6; }
.faq-section { max-width:800px; margin-top:8rem; }
.faq-section details { padding:1.2rem 0; border-top:1px solid var(--line); }
.faq-section details:last-child { border-bottom:1px solid var(--line); }
.faq-section summary { cursor:pointer; list-style:none; font-size:1.1rem; }
.faq-section summary::-webkit-details-marker { display:none; }
.faq-section summary::after { content:'+'; float:right; }
.faq-section details[open] summary::after { content:'–'; }
.faq-section details p { max-width:650px; color:var(--muted); line-height:1.7; }
.pricing-main { max-width:1100px; }
.pricing-intro { max-width:680px; }
.pricing-layout { display:grid; grid-template-columns:1.25fr .75fr; gap:1rem; }
.price-card { padding:3rem; background:#e9dec9; }
.price-card-fee { background:#2f3c35; color:var(--cream); }
.price-card-fee .eyebrow, .price-card-fee .price-label { color:#cbbda6; }
.price-value { margin:.8rem 0 .3rem; font-size:clamp(3.8rem,8vw,7rem); line-height:1; }
.price-value span { font-size:1.3rem; }
.price-label { margin:0; color:var(--muted); }
.price-divider { height:1px; margin:3rem 0 1.3rem; background:var(--line); }
.price-breakdown { margin:0; }
.price-breakdown div { display:flex; justify-content:space-between; gap:1rem; padding:.8rem 0; border-bottom:1px solid var(--line); }
.price-breakdown dt, .price-breakdown dd { margin:0; }
.price-total { font-size:1.2rem; }
.fee-note { max-width:270px; margin-top:3rem; color:#cbbda6; line-height:1.8; }
.price-summary { display:flex; justify-content:space-between; gap:3rem; align-items:center; margin-top:1rem; padding:3rem; color:var(--cream); background:var(--dark); }
.price-summary h2 { margin:.5rem 0 0; font-size:clamp(2.4rem,5vw,4.5rem); font-weight:400; }
.price-summary h2 small { display:block; margin-top:.35rem; color:#cbbda6; font-size:1rem; }
.price-summary > p { max-width:380px; color:#cbbda6; line-height:1.8; }
.pricing-info { padding:9rem 0; }
.pricing-cta { display:flex; justify-content:space-between; align-items:center; gap:3rem; padding:5rem 3rem; color:var(--cream); background:#2f3c35; }
.pricing-cta h2 { max-width:650px; margin:.5rem 0 0; font-size:clamp(2rem,4vw,4rem); line-height:1.05; font-weight:400; }
.pricing-cta .eyebrow { color:#cbbda6; }
@media (max-width:700px) {
  .site-nav { gap:1.1rem; padding:1.3rem 1.2rem; font-size:.9rem; }
  .hero-copy { right:1.3rem; bottom:7vh; left:1.3rem; }
  .hero-copy h1 { font-size:3.3rem; }
  .feature-band, .two-column, .service-grid, .contact-grid { grid-template-columns:1fr; }
  .feature-band { padding:2rem 1.3rem; }
  .text-section, .service-section { padding:5rem 1.3rem; }
  .photo-strip { grid-template-columns:1fr; min-height:650px; }
  .photo-tile { min-height:325px; }
  .contact-preview { display:block; padding:5rem 1.3rem; }
  .contact-actions { margin-top:2rem; }
  .site-footer { flex-direction:column; padding:1.5rem 1.2rem; }
  .inner-main { padding:2rem 1.2rem 5rem; }
  .page-intro { padding:3rem 0 2.5rem; }
  .gallery-grid { grid-template-columns:1fr; }
  .contact-grid { gap:4rem; }
  .faq-section { margin-top:5rem; }
  .pricing-layout { grid-template-columns:1fr; }
  .rooms-preview { padding:5rem 1.3rem; }
  .rooms-preview-grid { grid-template-columns:repeat(2,1fr); }
  .rooms-grid { grid-template-columns:1fr; }
  .rooms-grid .room-card { grid-template-columns:1fr; }
  .rooms-grid .room-card img { min-height:0; aspect-ratio:1.25; }
  .rooms-note { margin-top:5rem; padding:2rem 1.3rem; }
  .price-card, .price-summary, .pricing-cta { padding:2rem 1.3rem; }
  .price-summary, .pricing-cta { display:block; }
  .price-summary > p { margin-top:2rem; }
  .pricing-cta .button { margin-top:2rem; }
}
@media (max-width:430px) {
  .rooms-preview-grid { grid-template-columns:1fr; }
  .site-nav { gap:.75rem; font-size:.8rem; }
}
