/* The public facility page (lib/facilitypage.js). Home9 tokens from app.css:
   white paper, ink, walnut (--pine) for actions, green for "open".
   One bold element: the "Book a stay" band (steel-deep), where a guest picks a
   kind of stay by tab and reserves a specific spot or room. Everything around
   it stays quiet: sentence-case headings above content, soft panels instead
   of hairline rules, three radii by role (4px controls, 8px tiles, 14px big
   surfaces). Phone first; wider layouts are the min-width blocks. */
.fp{--gut:16px;--steel:#1E2B2F;--steel-2:#2A3A3F;--steel-ink:#E9EEEF;--steel-mute:#A9B6B9;
  --r-s:4px;--r-m:8px;--r-l:14px;
  max-width:1240px;margin:0 auto;padding:0 var(--gut) 96px;font-variant-numeric:tabular-nums}
.fp h1,.fp h2,.fp h3{font-family:var(--serif);letter-spacing:-.018em;color:var(--ink)}
.fp img{display:block;width:100%;height:100%;object-fit:cover}
.fp picture{display:block;width:100%;height:100%}
.fp a:focus-visible,.fp button:focus-visible,.fp summary:focus-visible{outline:3px solid var(--accent,#0F6E8C);outline-offset:2px}

/* ---- hero ------------------------------------------------------------------ */
.fp-hero{display:flex;flex-direction:column-reverse;gap:20px;padding-top:12px}
.fp-crumbs{font-size:13px;color:var(--ink-3);display:flex;gap:8px;margin-bottom:12px}
.fp-crumbs a{color:var(--ink-3)}
.fp h1{font-size:34px;line-height:1.02;margin:0 0 10px;font-weight:800;overflow-wrap:anywhere;letter-spacing:-.03em}
.fp-lede{font-size:19px;line-height:1.35;color:var(--ink);margin:0 0 10px;max-width:30ch;font-weight:600}
.fp-tagline{font-size:15px;color:var(--pine);font-weight:700;margin:0 0 4px}
.fp-addr{font-size:14px;color:var(--ink-3);margin:0 0 20px}

.fp-mosaic{position:relative;margin:0 calc(var(--gut) * -1);aspect-ratio:4/3;background:var(--surface-2)}
.fp-mosaic figure{margin:0;overflow:hidden;background:var(--surface-2)}
.fp-m-main{height:100%}
.fp-m-side{display:none}
.fp-m-all{position:absolute;right:12px;bottom:12px;background:rgba(255,255,255,.94);color:var(--ink);font-size:13.5px;font-weight:700;
  padding:9px 14px;border-radius:var(--r-s);box-shadow:0 2px 10px rgba(20,24,26,.18)}
.fp-m-all:hover{text-decoration:none;background:#fff}

.fp-book{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-l);padding:16px;box-shadow:var(--shadow)}
.fp-book-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.fp-book label{display:flex;flex-direction:column;gap:5px;font-size:13px;font-weight:700;color:var(--ink-2);min-width:0}
.fp-book label:nth-child(3){grid-column:1/-1}
.fp-book input,.fp-book select{font:inherit;font-size:16px;font-weight:600;color:var(--ink);min-height:48px;padding:8px 10px;
  border:1px solid var(--line);border-radius:var(--r-s);background:var(--surface-2);width:100%;min-width:0}
.fp-go{width:100%;justify-content:center;min-height:52px;margin-top:12px;font-size:16px;border-radius:var(--r-s)}
.fp-book-note{margin:10px 0 0;font-size:13px;color:var(--ink-3)}
.fp-call{font-size:14.5px;margin:14px 0 0;color:var(--ink-2)}
.fp-call a{font-weight:700}

/* ---- sticky section bar ---------------------------------------------------- */
.fp-index{position:sticky;top:var(--fp-top,60px);z-index:40;margin:32px calc(var(--gut) * -1) 0;background:rgba(255,255,255,.96);
  backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--line)}
.fp-index-in{display:flex;gap:4px;overflow-x:auto;padding:8px var(--gut);scrollbar-width:none;-webkit-overflow-scrolling:touch}
.fp-index-in::-webkit-scrollbar{display:none}
.fp-index a{flex:none;padding:8px 13px;font-size:14px;font-weight:650;color:var(--ink-2);white-space:nowrap;border-radius:999px}
.fp-index a:hover{background:var(--surface-2);text-decoration:none;color:var(--ink)}
.fp-index a[aria-current="true"]{background:var(--ink);color:#fff}

/* ---- sections -------------------------------------------------------------- */
.fp-secs{display:grid;grid-template-columns:minmax(0,1fr)}
.fp-sec{padding:44px 0 4px;scroll-margin-top:calc(var(--fp-top,60px) + 64px);min-width:0}
.fp-label{font-size:26px;line-height:1.1;margin:0 0 18px;font-weight:800;letter-spacing:-.025em}
.fp-body{min-width:0}
.fp-sub,.fp-note{font-size:14px;color:var(--ink-3)}
.fp-note{margin:8px 0 0}
.fp-prose p{font-size:17px;line-height:1.65;max-width:60ch;margin:0 0 14px;color:var(--ink-2)}
.fp-prose p:first-child{font-size:19px;line-height:1.5;color:var(--ink)}
.fp-h3{font-size:17px;margin:0 0 10px}
.fp-two{display:grid;gap:28px}

.fp-points{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.fp-points li{background:var(--surface-2);border-radius:var(--r-m);padding:14px 16px}
.fp-points h3{font-size:16px;margin:0 0 4px}
.fp-points p{margin:0;color:var(--ink-2);font-size:14.5px;line-height:1.5}

/* ---- book a stay: the band ------------------------------------------------- */
.fp-band{position:relative;margin:28px calc(var(--gut) * -1) 0;padding:34px var(--gut) 30px;background:var(--steel);color:var(--steel-ink)}
.fp-band .fp-label{color:#fff}
.fp-band a:not(.btn){color:#F2C9A4}
/* Phone: one row per kind of stay, stacked, so every price and count is in view. */
.fp-tabs{display:grid;gap:8px;margin:0 0 16px}
.fp-tabs::-webkit-scrollbar{display:none}
.fp-tab{text-align:left;display:grid;grid-template-columns:1fr auto;grid-template-areas:"name price" "open price";gap:2px 12px;align-items:center;
  padding:13px 14px;border-radius:var(--r-m);border:1px solid rgba(255,255,255,.14);background:var(--steel-2);color:var(--steel-ink);cursor:pointer;font:inherit}
.fp-tab:hover{border-color:rgba(255,255,255,.34)}
.fp-tab[aria-selected="true"]{background:#fff;color:var(--ink);border-color:#fff}
.fp-tab-name{grid-area:name;font-weight:750;font-size:15px;line-height:1.25}
.fp-tab-price{grid-area:price;font-family:var(--serif);font-weight:800;font-size:20px;line-height:1}
.fp-tab-price small{font-family:var(--sans);font-size:12.5px;font-weight:600;opacity:.7;margin-left:1px}
.fp-tab-open{grid-area:open;font-size:12.5px;font-weight:750;color:#7FD89E}
.fp-tab[aria-selected="true"] .fp-tab-open{color:var(--ok)}
.fp-tab-open.is-none{color:var(--steel-mute)}
.fp-tab[aria-selected="true"] .fp-tab-open.is-none{color:var(--ink-3)}

.fp-panel{background:#fff;color:var(--ink);border-radius:var(--r-l);overflow:hidden;display:grid}
.fp-panel + .fp-panel{margin-top:14px}
.fp-panel[hidden]{display:none}
.fp-panel a:not(.btn){color:var(--pine)}
.fp-panel-info{display:grid}
.fp-panel-img{aspect-ratio:16/10;background:var(--surface-2)}
.fp-panel-copy{padding:18px 18px 4px}
.fp-panel-copy h3{font-size:23px;margin:0 0 8px;line-height:1.15}
.fp-panel-copy p{margin:0 0 10px;color:var(--ink-2);font-size:15.5px;line-height:1.55}
.fp-badge{display:inline-block;vertical-align:4px;font-family:var(--sans);font-size:12px;font-weight:750;color:var(--pine);background:var(--pine-l);padding:2px 8px;border-radius:999px;letter-spacing:0}
.fp-facts{list-style:none;padding:0;margin:0 0 12px;display:flex;flex-wrap:wrap;gap:6px}
.fp-facts li{font-size:13px;font-weight:650;color:var(--ink-2);background:var(--surface-2);padding:4px 10px;border-radius:999px}
.fp-ticks{list-style:none;padding:0;margin:4px 0 10px;display:grid;grid-template-columns:1fr;gap:6px;font-size:14.5px;color:var(--ink-2)}
.fp-ticks li{padding-left:24px;position:relative}
.fp-ticks li::before{content:"";position:absolute;left:2px;top:.34em;width:12px;height:7px;border-left:2.5px solid var(--ok);border-bottom:2.5px solid var(--ok);transform:rotate(-45deg)}
.fp-more{font-weight:700}

.fp-panel-book{padding:16px 18px 18px;background:var(--surface-2)}
.fp-rates{width:100%;border-collapse:collapse;margin:0 0 6px;table-layout:fixed}
.fp-rates th{font-size:12.5px;font-weight:650;color:var(--ink-3);text-align:left;padding:0 0 2px}
.fp-rates td{font-family:var(--serif);font-size:24px;font-weight:800;padding:0 4px 0 0;white-space:nowrap;letter-spacing:-.02em}
.fp-adds{list-style:none;padding:0;margin:0 0 14px;font-size:13.5px;color:var(--ink-2)}
.fp-adds li{padding:2px 0}
.fp-when{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0 0 10px;padding-top:12px;border-top:1px solid var(--line);font-size:14px;color:var(--ink-2)}
.fp-when strong{font-family:var(--serif);font-size:18px;color:var(--ok)}
.fp-when a{font-weight:700}
.fp-doors{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.fp-doorcard{display:grid;grid-template-columns:1fr auto;grid-template-areas:"no go" "facts go" "price go";column-gap:12px;align-items:center;
  background:#fff;border:1px solid var(--line);border-left:4px solid var(--ok);border-radius:var(--r-m);padding:11px 12px 11px 14px}
.fp-door-no{grid-area:no;font-family:var(--serif);font-size:19px;font-weight:800;line-height:1.1}
.fp-door-facts{grid-area:facts;font-size:13px;color:var(--ink-3)}
.fp-door-price{grid-area:price;font-family:var(--serif);font-size:18px;font-weight:800;margin-top:2px}
.fp-door-price small{font-family:var(--sans);font-size:12.5px;font-weight:550;color:var(--ink-3)}
.fp-door-price .fp-door-extra{display:block;margin-top:2px;font-size:12px;line-height:1.35}
.fp-panel{scroll-margin-top:calc(var(--fp-top,64px) + 70px)}
.fp-doorcard{scroll-margin:calc(var(--fp-top,64px) + 70px) 0 120px}
.fp-doorcard.is-picked{border-color:var(--ink);border-left-color:var(--ok);box-shadow:0 0 0 2px var(--ink)}
.fp-doorcard .btn{grid-area:go;min-height:46px;min-width:100px;justify-content:center;border-radius:var(--r-s);font-size:15px}
.fp-none{margin:0;padding:12px 14px;background:#fff;border-radius:var(--r-m);font-size:14.5px;color:var(--ink-2)}
.fp-foot{margin:10px 0 0;font-size:12.5px;color:var(--ink-3)}

/* ---- map ------------------------------------------------------------------- */
.fp-sec .sitemap{margin-top:12px;border-radius:var(--r-l);overflow:hidden}

/* ---- amenities + details --------------------------------------------------- */
.fp-amen{list-style:none;padding:0;margin:0;display:grid;gap:4px 24px}
.fp-amen li{padding:10px 0 10px 28px;position:relative;display:flex;flex-direction:column;gap:2px}
.fp-amen li::before{content:"";position:absolute;left:3px;top:15px;width:12px;height:7px;border-left:2.5px solid var(--pine);border-bottom:2.5px solid var(--pine);transform:rotate(-45deg)}
.fp-amen strong{font-size:15.5px}
.fp-amen span{font-size:14px;color:var(--ink-2)}
.fp-spec,.fp-pol{margin:0;background:var(--surface-2);border-radius:var(--r-l);padding:4px 18px}
.fp-spec div,.fp-pol div{display:grid;grid-template-columns:minmax(110px,42%) 1fr;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
.fp-spec div:last-child,.fp-pol div:last-child{border-bottom:0}
.fp-spec dt,.fp-pol dt{font-size:14px;font-weight:700;color:var(--ink-2)}
.fp-spec dd,.fp-pol dd{margin:0;font-size:15px}

/* ---- photos ---------------------------------------------------------------- */
.fp-gallery{list-style:none;padding:0 var(--gut);margin:0 calc(var(--gut) * -1);display:grid;grid-auto-flow:column;grid-auto-columns:82%;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin}
.fp-gallery li{scroll-snap-align:start}
.fp-gallery a{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--surface-2);border-radius:var(--r-m)}
.fp-gallery p{font-size:13px;color:var(--ink-2);margin:6px 0 0}

.fp-who{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.fp-who li{border:1px solid var(--line);border-radius:var(--r-m);padding:16px}
.fp-who h3{font-size:17px;margin:0 0 4px}
.fp-who p{margin:0;color:var(--ink-2);font-size:15px;line-height:1.5}

.fp-where{font-size:17px;line-height:1.5;margin:0 0 12px}
.fp-drive{border-collapse:collapse;width:100%;max-width:440px;margin:0}
.fp-drive caption{text-align:left;font-size:14px;font-weight:700;color:var(--ink-2);padding-bottom:6px}
.fp-drive th,.fp-drive td{text-align:left;padding:9px 0;border-top:1px solid var(--line);font-size:15px}
.fp-drive th{font-weight:700}

.fp-faq{border-bottom:1px solid var(--line)}
.fp-faq:first-child{border-top:1px solid var(--line)}
.fp-faq summary{cursor:pointer;list-style:none;padding:15px 34px 15px 0;font-weight:700;font-size:16px;position:relative}
.fp-faq summary::-webkit-details-marker{display:none}
.fp-faq summary::after{content:"+";position:absolute;right:6px;top:12px;font-size:22px;font-weight:500;color:var(--pine)}
.fp-faq[open] summary::after{content:"−"}
.fp-faq p{margin:0 0 14px;color:var(--ink-2);max-width:62ch}

.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.fp-source{padding-top:28px}

/* ---- phone booking bar ----------------------------------------------------- */
.fp-bar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px var(--gut,16px) calc(10px + env(safe-area-inset-bottom));background:var(--paper);border-top:1px solid var(--line);box-shadow:0 -6px 20px rgba(20,24,26,.08)}
.fp-bar div{display:flex;flex-direction:column;font-size:14px;line-height:1.25;font-variant-numeric:tabular-nums}
.fp-bar strong{font-family:var(--serif);font-size:19px}
.fp-bar p{margin:0;white-space:nowrap}
.fp-bar span{font-size:12.5px;color:var(--ok);font-weight:700}
.fp-bar .btn{min-height:48px;padding:0 22px;border-radius:var(--r-s)}
body:has(.fp-bar) .h9foot{padding-bottom:80px}

/* ---- tablet ---------------------------------------------------------------- */
@media (min-width:720px){
  .fp{--gut:24px}
  .fp-book-row{grid-template-columns:1fr 1fr 1fr}
  .fp-book label:nth-child(3){grid-column:auto}
  .fp-mosaic{margin:0;border-radius:var(--r-l);overflow:hidden}
  .fp-points{grid-template-columns:1fr 1fr}
  .fp-amen{grid-template-columns:1fr 1fr}
  .fp-who{grid-template-columns:repeat(3,1fr)}
  .fp-gallery{grid-auto-flow:row;grid-template-columns:repeat(3,1fr);grid-auto-columns:auto;overflow:visible;padding:0;margin:0;gap:18px 14px}
  /* The first photo leads at double size: 1 + 2 beside it + rows of 3 fills a
     7-photo set with no orphan, and reads as a gallery rather than a grid. */
  .fp-g-lead2 li:first-child{grid-column:span 2}
  .fp-g-lead2 li:first-child a{aspect-ratio:auto;height:calc(100% - 26px)}
  .fp-g-lead3 li:first-child{grid-column:1 / -1}
  .fp-g-lead3 li:first-child a{aspect-ratio:21/8}
  .fp-band{margin-left:0;margin-right:0;border-radius:var(--r-l);padding:36px 28px 30px}
  .fp-tabs{grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
  .fp-tab{grid-template-areas:"name name" "price open";gap:6px 10px;align-items:end}
  .fp-ticks{grid-template-columns:1fr 1fr}
  .fp-doors{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
}

/* ---- desktop --------------------------------------------------------------- */
@media (min-width:960px){
  .fp-hero{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:40px;align-items:stretch;padding-top:28px}
  .fp h1{font-size:46px}
  .fp-lede{font-size:22px}
  .fp-mosaic{aspect-ratio:auto;min-height:460px;height:100%}
  .fp-mosaic-3{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:8px;background:transparent}
  .fp-mosaic-3 .fp-m-main{grid-row:1 / span 2}
  .fp-mosaic-3 .fp-m-side{display:block}
  .fp-index{margin:40px 0 0;border-radius:0}
  .fp-index-in{padding:8px 0}
  .fp-secs{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:56px}
  .fp-sec{grid-column:1 / -1;padding:60px 0 4px}
  .fp-sec.fp-half{grid-column:auto}
  .fp-label{font-size:32px;margin-bottom:22px}
  .fp-two{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start}
  .fp-two-wide{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
  .fp-points{grid-template-columns:1fr}
  .fp-band{padding:44px 40px 40px;margin-top:36px}
  .fp-band .fp-label{margin-bottom:20px}
  .fp-panel{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)}
  .fp-panel-info{grid-template-rows:auto 1fr}
  .fp-panel-img{aspect-ratio:16/9}
  .fp-panel-copy{padding:22px 26px 14px}
  .fp-panel-book{padding:24px 26px}
  .fp-doors{grid-template-columns:1fr}
  .fp-bar{display:none}
  body:has(.fp-bar) .h9foot{padding-bottom:0}
}
@media (prefers-reduced-motion:no-preference){
  .fp-tab{transition:background-color .15s,border-color .15s,color .15s}
}

/* ---- availability calendars (lib/calendar.js) ---------------------------------
   One card per rental unit / ground spot, two months side by side. Green = an
   open night; a linked green date starts a reservation from it. Struck grey =
   booked. A green date without a link is open but too short a gap for the
   minimum stay. */
.fp-cal-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 20px;margin-bottom:18px}
.fp-cal-nav{display:flex;align-items:center;gap:10px;font-size:16px}
.fp-cal-step{display:inline-grid;place-items:center;width:36px;height:36px;border:1px solid var(--line);border-radius:50%;
  font-size:22px;line-height:1;color:var(--ink);background:var(--paper)}
a.fp-cal-step:hover{text-decoration:none;border-color:var(--ink)}
span.fp-cal-step{color:var(--line);border-color:var(--line-2)}
.fp-cal-key{margin:0;display:flex;align-items:center;flex-wrap:wrap;gap:4px 14px}
.fp-cal-key>span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.fp-cal-key .k{display:inline-block;width:12px;height:12px;border-radius:3px}
.k-open{background:var(--ok-l);box-shadow:inset 0 0 0 1px rgba(23,122,61,.35)}
.k-taken{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line)}
.fp-cals{list-style:none;align-items:start;margin:0 0 28px;padding:0;display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(min(100%,440px),1fr))}
.fp-cal{border:1px solid var(--line);border-radius:var(--r-m);padding:14px;background:var(--paper)}
.fp-cal-shut{margin:0 0 28px;padding:12px 14px;border-radius:var(--r-m);background:var(--surface-2);font-size:14px;color:var(--ink-2)}
.fp-cals+.fp-cal-shut{margin-top:-14px}
.fp-cal-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;margin-bottom:10px}
.fp-cal-head h4{margin:0;font-size:16px;font-family:var(--serif)}
.fp-cal-head span{font-size:13px;color:var(--ink-3)}
.fp-cal-status{flex-basis:100%;font-weight:600}
.fp-cal-status.is-open{color:var(--ok)}
.fp-cal-months{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fp-month{width:100%;border-collapse:collapse;table-layout:fixed;font-size:12.5px;text-align:center}
.fp-month caption{font-weight:700;font-size:13px;color:var(--ink-2);padding-bottom:6px;text-align:left}
.fp-month th{font-weight:600;color:var(--ink-3);font-size:11px;padding:2px 0}
.fp-month td{padding:1px;height:28px}
.fp-month td>a,.fp-month td>span:first-child{display:grid;place-items:center;height:26px;border-radius:var(--r-s)}
.fp-month td.is-past{color:var(--ink-3);opacity:.45}
.fp-month td.is-taken>span:first-child{background:var(--surface-2);color:var(--ink-3);text-decoration:line-through}
.fp-month td.is-open>a,.fp-month td.is-open>span{background:var(--ok-l);color:var(--ok);font-weight:600}
.fp-month td.is-open>a:hover{background:var(--ok);color:#fff;text-decoration:none}
.fp-month td.is-short>span{font-weight:400;opacity:.75}
.fp-month td.is-today>a,.fp-month td.is-today>span{box-shadow:inset 0 0 0 2px var(--ok)}
/* Two months side by side leave a phone 20px cells; stack them instead. */
@media(max-width:560px){.fp-cal-months{grid-template-columns:1fr;gap:18px}}
@media(max-width:400px){.fp-cal{padding:12px 10px}.fp-cal-months{gap:8px}.fp-month{font-size:11.5px}.fp-month td{height:25px}.fp-month td>a,.fp-month td>span:first-child{height:23px}}

/* Monthly rentals: Reserve, or apply to rent (routes/apply.js). */
.fp-door-go{grid-area:go;display:flex;flex-direction:column;align-items:stretch;gap:6px;text-align:center}
.fp-apply{font-size:13px;font-weight:650;color:var(--pine);text-decoration:underline;text-underline-offset:3px}
/* The property's single public calendar: two months, roomier cells. */
.fp-cal-one{max-width:760px}
.fp-cal-one .fp-month td{height:36px}
.fp-cal-one .fp-month td>a,.fp-cal-one .fp-month td>span:first-child{height:33px;font-size:14px}