/* Casa da Azinheira: dawn over the olive grove. Lime-wash, holm-oak green, lichen. Newsreader + Hanken Grotesk. */
:root{
  --cal:#EEEFE8;
  --cal-2:#E2E5D8;
  --paper:#F8F9F4;
  --oak:#1C231D;
  --oak-2:#26302A;
  --oak-3:#323D35;
  --leaf:#56633F;
  --lichen:#CBD3AE;
  --sun:#F2C98A;
  --ink:#1C231D;
  --mute:#555F51;
  --line:rgba(28,35,29,.14);
  --range:#D5DBC3;
  --fd:'Newsreader','Iowan Old Style',Georgia,serif;
  --fb:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  --ease-out:cubic-bezier(.23,1,.32,1);
  --ease-slow:cubic-bezier(.45,0,.2,1);
  --g:clamp(16px,4.5vw,72px);
  --rib:30px;
  --z-head:20;--z-ask:40;--z-rib:50;--z-grain:60;
  --shadow:0 1px 2px rgba(28,35,29,.06),0 12px 28px -12px rgba(28,35,29,.22),0 40px 80px -40px rgba(28,35,29,.28);
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
html[data-lang="pt"] [lang="en"],html[data-lang="en"] [lang="pt-PT"]{display:none!important}
body{margin:0;background:var(--cal);color:var(--ink);font:400 17px/1.6 var(--fb);padding-bottom:var(--rib);overflow-x:hidden;-webkit-font-smoothing:antialiased}
body::after{content:"";position:fixed;inset:0;z-index:var(--z-grain);pointer-events:none;background:url(img/grain.png);opacity:.35;mix-blend-mode:multiply}
section{overflow-x:clip}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,h4{margin:0;font-family:var(--fd);font-weight:300;font-optical-sizing:auto;line-height:1.04;letter-spacing:-.015em;text-wrap:balance}
em,i{font-style:italic}
h1 em,h2 em{font-weight:300}
p{margin:0;text-wrap:pretty}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--leaf);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:8px;top:-60px;background:var(--oak);color:var(--cal);padding:10px 14px;z-index:99;border-radius:8px}
.skip:focus{top:8px}
.rv.pre{opacity:0;transform:translateY(24px)}
.rv.in{opacity:1;transform:none;transition:opacity 900ms var(--ease-out),transform 1100ms var(--ease-out)}

/* header */
.top{position:fixed;inset:0 0 auto 0;z-index:var(--z-head);display:flex;align-items:center;gap:28px;height:72px;padding:0 var(--g);color:#F4F5EF;transition:background-color 400ms ease,color 400ms ease,box-shadow 400ms ease}
.top.solid{background:rgba(238,239,232,.72);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);color:var(--ink);box-shadow:0 1px 0 var(--line)}
.mark{font:400 24px/1 var(--fd);letter-spacing:-.01em;text-decoration:none;margin-right:auto;white-space:nowrap}
.mark i{font-weight:300}
.nav{display:flex;gap:4px}
.nav a{font:500 15px/1 var(--fb);text-decoration:none;padding:14px 14px;border-radius:999px;transition:background-color 160ms ease}
.nav a:hover{background:rgba(127,140,110,.2)}
.lang{display:flex;gap:2px;padding:3px;border:1px solid currentColor;border-radius:999px}
.lang button{border:0;background:transparent;min-width:44px;min-height:38px;border-radius:999px;font:600 13px/1 var(--fb);letter-spacing:.06em;cursor:pointer;opacity:.85}
.lang button[aria-pressed="true"]{background:#F4F5EF;color:var(--oak);opacity:1}
.top.solid .lang button[aria-pressed="true"]{background:var(--oak);color:var(--cal)}

/* story */
.story{position:relative;height:100svh;min-height:560px;max-height:1040px;color:#F4F5EF;background:var(--oak);overflow:hidden;isolation:isolate}
.slides{position:absolute;inset:-6% 0 0 0;will-change:transform}
.slide{position:absolute;inset:0;margin:0;opacity:0;transition:opacity 1800ms var(--ease-slow)}
.slide.is-on{opacity:1}
.slide img{width:100%;height:100%;object-fit:cover;transform-origin:var(--ox,50%) var(--oy,50%);transform:scale(var(--s0,1.03))}
.slide.is-on img{animation:drift 9000ms linear both}
@keyframes drift{from{transform:scale(var(--s0,1.03))}to{transform:scale(var(--s1,1.1))}}
.slide:nth-child(2) img,.slide:nth-child(3) img,.slide:nth-child(5) img{object-position:50% 62%}
/* dawn: a warm light that breathes across the frame, two mist bands drifting */
.dawn{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.sun{position:absolute;left:58%;top:-30%;width:90vmax;height:90vmax;border-radius:50%;background:radial-gradient(closest-side,rgba(255,214,150,.55),rgba(255,190,120,.18) 45%,rgba(255,190,120,0) 70%);mix-blend-mode:soft-light;animation:sun 14s ease-in-out infinite alternate}
@keyframes sun{from{transform:translate3d(-8%,4%,0) scale(.92);opacity:.75}to{transform:translate3d(6%,-2%,0) scale(1.06);opacity:1}}
.mist{position:absolute;left:-30%;width:160%;height:38%;border-radius:50%;background:radial-gradient(closest-side,rgba(240,244,235,.22),rgba(240,244,235,0));filter:blur(8px)}
.m1{bottom:14%;animation:mist 26s linear infinite}
.m2{bottom:30%;height:26%;opacity:.7;animation:mist 34s linear infinite reverse}
@keyframes mist{from{transform:translate3d(-12%,0,0)}to{transform:translate3d(12%,0,0)}}
.story-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,19,15,.5) 0,rgba(14,19,15,0) 22%,rgba(14,19,15,.06) 40%,rgba(14,19,15,.5) 64%,rgba(14,19,15,.86) 100%)}
.story-copy{position:absolute;left:var(--g);right:var(--g);bottom:clamp(76px,10vh,124px);display:grid;gap:18px;max-width:1100px;z-index:2}
h1{font-size:clamp(42px,5.4vw,84px);font-weight:300;max-width:none;line-height:.98;letter-spacing:-.025em}
h1 em{display:block;color:var(--sun)}
html[data-lang="en"] h1{font-size:clamp(40px,4.7vw,72px)}
.caption{font:400 clamp(17px,1.4vw,20px)/1.45 var(--fb);color:#E1E6D2;min-height:1.45em;max-width:46ch;transition:opacity 500ms ease}
.caption.is-out{opacity:0}
.datebar{display:inline-flex;align-items:stretch;justify-self:start;margin-top:10px;background:rgba(20,26,21,.38);-webkit-backdrop-filter:blur(20px) saturate(1.4);backdrop-filter:blur(20px) saturate(1.4);border:1px solid rgba(244,245,239,.26);border-radius:999px;text-decoration:none;color:#F4F5EF;box-shadow:0 20px 40px -20px rgba(0,0,0,.5);transition:transform 160ms var(--ease-out),background-color 200ms ease}
.datebar:hover{background:rgba(20,26,21,.52)}
.datebar:active{transform:scale(.985)}
.db-cell{display:grid;gap:2px;padding:12px 26px;border-right:1px solid rgba(244,245,239,.18);min-width:150px}
.db-cell small{font:500 12.5px/1.2 var(--fb);color:var(--lichen)}
.db-cell b{font:500 17px/1.25 var(--fb)}
.db-go{display:flex;align-items:center;margin:6px;padding:0 28px;border-radius:999px;background:#F4F5EF;color:var(--oak);font:600 15.5px/1 var(--fb);white-space:nowrap}
.chapters{position:absolute;right:var(--g);bottom:clamp(104px,13vh,150px);display:grid;gap:4px;width:220px;z-index:2}
.chap{display:grid;gap:6px;padding:8px 0;min-height:44px;border:0;background:none;color:rgba(244,245,239,.6);text-align:left;font:400 italic 17px/1.2 var(--fd);cursor:pointer}
.chap[aria-selected="true"]{color:#F4F5EF}
.chap i{display:block;height:1px;background:rgba(244,245,239,.25);overflow:hidden}
.chap i::after{content:"";display:block;height:100%;background:#F4F5EF;transform:scaleX(0);transform-origin:left}
.chap.is-past i::after{transform:scaleX(1)}
.chap[aria-selected="true"] i::after{animation:fill var(--dur,7000ms) linear both}
.story.paused .chap[aria-selected="true"] i::after{animation:none;transform:scaleX(1)}
@keyframes fill{to{transform:scaleX(1)}}
.story-pause{position:absolute;right:var(--g);top:88px;z-index:2;width:44px;height:44px;border-radius:50%;border:1px solid rgba(244,245,239,.4);background:rgba(20,26,21,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer}
.story-pause span{position:absolute;left:50%;top:50%;width:10px;height:12px;margin:-6px 0 0 -5px;border-left:3px solid #F4F5EF;border-right:3px solid #F4F5EF}
.story-pause[aria-pressed="true"] span{width:0;height:0;border:0;border-left:11px solid #F4F5EF;border-top:7px solid transparent;border-bottom:7px solid transparent;margin:-7px 0 0 -4px}

/* availability */
.avail{position:relative;padding:clamp(72px,9vw,140px) var(--g) clamp(72px,8vw,120px);background:radial-gradient(70% 60% at 85% 0%,rgba(203,211,174,.55),transparent 70%),radial-gradient(60% 50% at 0% 100%,rgba(86,99,63,.10),transparent 70%),var(--cal)}
.avail>*{max-width:1320px;margin-left:auto;margin-right:auto}
.avail-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:16px 64px;align-items:end;margin-bottom:clamp(32px,4vw,56px)}
.avail-head h2,.rooms-head h2,.walk h2,.house h2{font-size:clamp(38px,4.6vw,68px)}
.avail-head h2 em,.walk h2 em,.house h2 em{color:var(--leaf)}
.avail-head p{color:var(--mute);max-width:50ch}
.avail-grid{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:clamp(24px,3vw,48px);align-items:start}
.cal-wrap{position:relative;background:rgba(248,249,244,.78);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.7);border-radius:24px;padding:clamp(18px,2.6vw,36px);box-shadow:var(--shadow)}
.cal-nav{position:absolute;right:clamp(18px,2.6vw,36px);top:clamp(14px,2.2vw,30px);display:flex;gap:8px}
.cal-arrow{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:#fff;font:400 24px/1 var(--fb);cursor:pointer;transition:background-color 160ms ease,transform 140ms var(--ease-out)}
.cal-arrow:hover:not(:disabled){background:var(--cal)}
.cal-arrow:active:not(:disabled){transform:scale(.94)}
.cal-arrow:disabled{opacity:.3;cursor:default}
.months{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3vw,48px)}
.month h3{font-size:28px;margin:4px 0 18px;padding-right:110px}
.month+.month h3{padding-right:0}
.wk,.days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.wk span{font:500 12.5px/1 var(--fb);color:var(--mute);text-align:center;padding-bottom:10px;text-transform:capitalize}
.day{position:relative;display:grid;align-content:center;justify-items:center;gap:1px;min-height:58px;padding:4px 0;border:0;background:transparent;cursor:pointer;color:var(--ink);transition:background-color 120ms ease,color 120ms ease}
.day b{font:500 16px/1.1 var(--fb)}
.day small{font:400 11.5px/1.1 var(--fb);color:var(--mute);font-variant-numeric:tabular-nums}
.day.peak small{color:var(--leaf);font-weight:600;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:2px}
.day:hover:not(:disabled){background:var(--cal-2);border-radius:12px}
.day:disabled{cursor:default}
.day.past b{color:rgba(28,35,29,.28)}
.day.busy b{color:rgba(28,35,29,.4);text-decoration:line-through}
.day.busy small{visibility:hidden}
.day.in-range,.day.hover-range{background:var(--range);border-radius:0}
.day.hover-range{background:#E0E4D3}
.day.is-in,.day.is-out{background:var(--oak);color:var(--cal)}
.day.is-in small,.day.is-out small{color:var(--lichen)}
.day.is-in{border-radius:999px 0 0 999px}
.day.is-out{border-radius:0 999px 999px 0}
.day.is-in.is-out{border-radius:999px}
.day.is-out small{visibility:hidden}
.day.blank{pointer-events:none}
.cal-legend{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-top:22px;font:400 13.5px/1.3 var(--fb);color:var(--mute)}
.lg{display:inline-block;width:18px;height:12px;border-radius:999px;margin-left:8px}
.lg:first-child{margin-left:0}
.lg-sel{background:var(--range);box-shadow:inset 6px 0 0 var(--oak)}
.lg-busy{background:linear-gradient(transparent 5px,rgba(28,35,29,.42) 5px 7px,transparent 7px)}
.lg-peak{height:3px;border-radius:2px;background:var(--leaf)}
.cal-msg{min-height:24px;margin-top:10px;font:500 14.5px/1.4 var(--fb);color:var(--leaf)}

/* the booking card: dark, warm, layered on the lime-wash */
.summary{position:sticky;top:92px;color:#EEF0E6;background:radial-gradient(120% 80% at 100% 0%,rgba(242,201,138,.16),transparent 60%),linear-gradient(180deg,var(--oak-2),var(--oak));border-radius:24px;padding:28px 24px 24px;display:grid;gap:20px;box-shadow:0 40px 80px -36px rgba(28,35,29,.6),0 1px 0 rgba(255,255,255,.06) inset}
.summary h3{font-size:32px}
fieldset{border:0;margin:0;padding:0;min-width:0}
legend{font:600 12.5px/1 var(--fb);letter-spacing:.06em;color:#A9B19D;margin-bottom:10px;padding:0}
.rp{display:grid;grid-template-columns:52px 1fr auto;gap:12px;align-items:center;width:100%;padding:8px;margin-bottom:6px;border:1px solid transparent;border-radius:14px;background:transparent;text-align:left;cursor:pointer;color:#EEF0E6;transition:border-color 140ms ease,background-color 140ms ease}
.rp:hover:not(:disabled){background:rgba(238,240,230,.06)}
.rp[aria-checked="true"]{border-color:rgba(203,211,174,.55);background:rgba(203,211,174,.1)}
.rp:disabled{opacity:.4;cursor:not-allowed}
.rp img{width:52px;height:52px;object-fit:cover;border-radius:10px}
.rp b{display:block;font:600 15.5px/1.25 var(--fb)}
.rp small{display:block;font:400 13px/1.3 var(--fb);color:#A9B19D}
.rp em{font:500 14.5px/1 var(--fb);font-style:normal;white-space:nowrap;color:var(--lichen)}
.guests{display:flex;align-items:center;justify-content:space-between;gap:12px;font:600 15px/1 var(--fb)}
.stepper{display:flex;align-items:center;gap:4px;border:1px solid rgba(238,240,230,.2);border-radius:999px;padding:3px}
.stepper button{width:44px;height:40px;border:0;border-radius:999px;background:transparent;color:#EEF0E6;font:400 20px/1 var(--fb);cursor:pointer}
.stepper button:hover:not(:disabled){background:rgba(238,240,230,.1)}
.stepper button:disabled{opacity:.3;cursor:default}
.stepper output{min-width:24px;text-align:center;font:600 16px/1 var(--fb)}
.bill{border-top:1px solid rgba(238,240,230,.14);padding-top:16px;display:grid;gap:6px;font-size:15px}
.bill-when{font:400 italic 20px/1.35 var(--fd);margin-bottom:6px}
.bill-row{display:flex;justify-content:space-between;gap:12px;color:#B7BEAB;font-variant-numeric:tabular-nums}
.bill-total{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-top:1px solid rgba(238,240,230,.14);margin-top:8px;padding-top:12px}
.bill-total span{font:500 15px/1 var(--fb)}
.bill-total b{font:300 44px/1 var(--fd);letter-spacing:-.02em;color:var(--sun)}
.bill-note{font-size:13.5px;color:#A9B19D}
.bill-empty{color:#B7BEAB}
.pill{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;border-radius:999px;font:600 16px/1 var(--fb);text-decoration:none;cursor:pointer;transition:transform 140ms var(--ease-out),background-color 180ms ease}
.pill:active{transform:scale(.97)}
.pill-dark{background:var(--sun);color:var(--oak);border:0;width:100%}
.pill-dark:hover{background:#F6D7A6}
.pill-dark:disabled{opacity:.35;cursor:default}
.pill-line{background:transparent;border:1px solid currentColor}
.pill-line:hover{background:rgba(127,140,110,.14)}
.pill-lichen{background:var(--lichen);color:var(--oak);border:0}
.pill-lichen:hover{background:#D9E0BF}
.req{display:grid;gap:14px}
.field label{display:block;font:600 13px/1 var(--fb);margin-bottom:8px;color:#C9CFBD}
.field input{width:100%;min-height:50px;padding:0 14px;border:1px solid rgba(238,240,230,.22);border-radius:14px;background:rgba(238,240,230,.06);font:400 16px var(--fb);color:#EEF0E6}
.field input:focus{outline:none;border-color:var(--sun)}
.field input[aria-invalid="true"]{border-color:#F0A08C}
.err{min-height:18px;margin-top:4px;font:500 13px/1.3 var(--fb);color:#F3B3A2}
.fine{font-size:13px;color:#A9B19D}
.done{display:grid;gap:12px;outline:none;animation:rise 600ms var(--ease-out) both}
.done h4{font-size:34px;font-style:italic}
.done code{font:600 15px/1 var(--fb);letter-spacing:.14em;background:rgba(242,201,138,.16);color:var(--sun);padding:8px 12px;border-radius:999px;justify-self:start}
.done .pill-line{color:#EEF0E6;justify-self:start}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* rooms carousel */
.rooms{position:relative;background:radial-gradient(60% 50% at 10% 0%,rgba(86,99,63,.35),transparent 70%),var(--oak);color:var(--cal);padding:clamp(72px,9vw,140px) 0 clamp(64px,8vw,120px);isolation:isolate}
.ghost{position:absolute;right:-2vw;bottom:-3vw;z-index:-1;margin:0;font:300 italic clamp(110px,19vw,300px)/.8 var(--fd);letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1px rgba(203,211,174,.18);white-space:nowrap;pointer-events:none}
.rooms-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:20px;padding:0 var(--g);margin-bottom:40px}
.rooms-head h2 em{color:var(--lichen)}
.rooms-ctrl{display:flex;align-items:center;gap:14px}
.ring-btn{width:52px;height:52px;border-radius:50%;border:1px solid rgba(238,239,232,.35);background:rgba(238,239,232,.04);color:var(--cal);font:400 26px/1 var(--fb);cursor:pointer;transition:background-color 160ms ease,transform 140ms var(--ease-out)}
.ring-btn:hover:not(:disabled){background:rgba(238,239,232,.12)}
.ring-btn:active:not(:disabled){transform:scale(.94)}
.ring-btn:disabled{opacity:.3;cursor:default}
.rooms-count{font:400 italic 20px/1 var(--fd);color:var(--lichen);min-width:110px;text-align:center}
.track{display:flex;gap:clamp(16px,2vw,32px);overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--g) 8px;scroll-padding:0 var(--g);scrollbar-width:none;overscroll-behavior-x:contain}
.track::-webkit-scrollbar{display:none}
.track:focus-visible{outline-offset:-2px}
.room{flex:0 0 min(1080px,82vw);scroll-snap-align:start;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(20px,3vw,48px);align-items:end;transition:opacity 500ms ease}
.room.is-dim{opacity:.32}
.room-ph{margin:0;overflow:hidden;background:var(--oak-2);border-radius:20px;box-shadow:0 40px 80px -40px rgba(0,0,0,.7)}
.room-ph img{width:100%;aspect-ratio:4/4.3;object-fit:cover;transition:transform 1200ms var(--ease-out)}
.room:hover .room-ph img{transform:scale(1.03)}
.room-txt{display:grid;gap:14px;padding-bottom:6px}
.room-txt h3{font-size:clamp(32px,3vw,46px)}
.room-txt p{color:#C6CBBD;max-width:40ch}
.room-specs{list-style:none;margin:0;padding:0}
.room-specs li{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-top:1px solid rgba(238,239,232,.12);font-size:15px}
.room-specs li span:first-child{color:#A9B19D}
.room-price{font:300 36px/1 var(--fd);color:var(--sun)}
.room-price small{font:400 14px var(--fb);color:#A9B19D}
.room .pill{justify-self:start}
.room .pill[aria-pressed="true"]{background:transparent;color:var(--lichen);border:1px solid var(--lichen)}

/* walk */
.walk{max-width:1440px;margin:0 auto;padding:clamp(72px,9vw,140px) var(--g);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,88px);align-items:center}
.walk-txt{display:grid;gap:20px;justify-items:start}
.walk-txt>p{color:var(--mute);max-width:46ch}
.walk-txt .fine{color:var(--mute)}
.legs{list-style:none;margin:0;padding:0;width:100%}
.legs li{display:grid;grid-template-columns:72px 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--line);transition:color 300ms ease}
.legs li b{font:400 italic 21px/1.3 var(--fd)}
.legs li.is-now{color:var(--leaf)}
.map{margin:0}
.map-card{position:relative;border-radius:24px;overflow:hidden;box-shadow:var(--shadow)}
.map svg{display:block;width:100%;height:auto}
.map-chip{position:absolute;left:18px;top:18px;margin:0;display:flex;gap:10px;align-items:baseline;padding:10px 16px;border-radius:999px;background:rgba(248,249,244,.7);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.8);font-size:14px;color:var(--mute)}
.map-chip b{font:400 italic 20px/1 var(--fd);color:var(--ink)}
.map figcaption{font-size:13.5px;color:var(--mute);margin-top:12px}
.m-ground{fill:#E3E7DA}
.m-grove circle{fill:#B8C29C}
.m-road{fill:none;stroke:#F8F9F4;stroke-width:16;stroke-linecap:round}
.m-thin{stroke-width:10}
.m-square{fill:#D2D9C2}
.m-route-bg{fill:none;stroke:var(--oak);stroke-width:3;stroke-dasharray:2 9;stroke-linecap:round;opacity:.5}
.m-route{fill:none;stroke:var(--oak);stroke-width:5;stroke-linecap:round}
.m-house rect,.m-house path{fill:var(--oak)}
.m-sanct rect{fill:var(--leaf)}
.m-walker{fill:var(--oak);stroke:#F8F9F4;stroke-width:4}
.m-label{font:600 17px var(--fb);fill:var(--oak)}
.m-time{font:400 italic 24px var(--fd);fill:var(--oak)}

/* house */
.house{max-width:1440px;margin:0 auto;padding:clamp(56px,7vw,110px) var(--g) clamp(72px,8vw,130px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px clamp(28px,5vw,88px);border-top:1px solid var(--line)}
.house h2{grid-column:1/-1}
.notes{margin:0}
.notes div{display:grid;grid-template-columns:140px 1fr;gap:16px;padding:16px 0;border-top:1px solid var(--line)}
.notes dt{font:600 15px/1.5 var(--fb)}
.notes dd{margin:0;color:var(--mute)}
.voices{display:grid;gap:28px;align-content:start}
.score{display:flex;align-items:baseline;gap:14px;padding:6px 0 4px}
.score b{font:300 80px/1 var(--fd);letter-spacing:-.03em}
.score span{color:var(--mute);font-size:15px}
.tag{font-style:normal;font:600 12px/1 var(--fb);letter-spacing:.06em;border:1px solid currentColor;border-radius:999px;padding:4px 8px;margin-left:6px;vertical-align:1px}
.voice{margin:0;display:grid;gap:8px}
.voice blockquote{margin:0;font:300 italic clamp(22px,1.9vw,28px)/1.35 var(--fd)}
.voice figcaption{font:500 14px/1 var(--fb);color:var(--mute)}

.foot{background:var(--oak);color:#C6CBBD;padding:64px var(--g) 96px;display:grid;gap:10px;overflow:hidden}
.foot-mark{font:300 clamp(48px,9vw,140px)/.95 var(--fd);letter-spacing:-.03em;color:var(--cal);white-space:nowrap}
.foot-mark i{color:var(--sun)}
.foot a{display:inline-flex;min-height:44px;align-items:center;color:var(--lichen);font-weight:600}

.ribbon{position:fixed;left:0;right:0;bottom:0;z-index:var(--z-rib);height:var(--rib);display:flex;align-items:center;justify-content:center;background:#121712;color:var(--lichen);font:500 12.5px/1 var(--fb);letter-spacing:.03em;text-decoration:none;padding-bottom:env(safe-area-inset-bottom)}
.ribbon:hover{text-decoration:underline;text-underline-offset:3px}

/* front desk assistant */
.ask{position:fixed;right:16px;bottom:calc(var(--rib) + 14px);z-index:var(--z-ask);display:inline-flex;align-items:center;gap:10px;min-height:50px;padding:0 22px 0 16px;border-radius:999px;border:1px solid rgba(238,239,232,.22);background:rgba(28,35,29,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:var(--cal);font:600 15px/1 var(--fb);cursor:pointer;box-shadow:0 12px 28px -10px rgba(15,20,16,.5);transition:transform 140ms var(--ease-out),opacity 160ms ease}
.ask:active{transform:scale(.97)}
.ask[aria-expanded="true"]{opacity:0;pointer-events:none}
.ask-dot{width:8px;height:8px;border-radius:50%;background:#9FD08A;box-shadow:0 0 0 3px rgba(159,208,138,.22)}
.desk{position:fixed;right:16px;bottom:calc(var(--rib) + 14px);z-index:var(--z-ask);width:min(390px,calc(100vw - 32px));max-height:min(580px,calc(100dvh - 140px));display:flex;flex-direction:column;background:rgba(28,35,29,.9);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);color:var(--cal);border-radius:24px;border:1px solid rgba(238,239,232,.12);box-shadow:0 30px 60px -20px rgba(10,14,11,.6);transform-origin:bottom right;transition:opacity 240ms var(--ease-out),transform 260ms var(--ease-out)}
.desk.is-enter{opacity:0;transform:translateY(12px) scale(.97)}
.desk-head{position:relative;padding:20px 60px 14px 22px;border-bottom:1px solid rgba(238,239,232,.12)}
.desk-head h2{font-size:30px;font-style:italic}
.desk-head p{font-size:13.5px;color:#A9B19D;margin-top:2px}
.desk-x{position:absolute;right:10px;top:10px;width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:var(--cal);font-size:26px;cursor:pointer}
.desk-x:hover{background:rgba(238,239,232,.1)}
.desk-log{flex:1;overflow:auto;padding:16px 20px;display:grid;gap:14px;align-content:start;min-height:150px}
.dm{margin:0;font-size:15.5px;line-height:1.5;max-width:92%}
.dm.me{justify-self:end;text-align:right;color:var(--lichen)}
.dm.bot{color:#E4E7DC}
.dm .who{display:block;font:600 11.5px/1.2 var(--fb);letter-spacing:.08em;color:#8F9886;margin-bottom:3px}
.dm .act{margin-top:10px}
.dots{display:inline-flex;gap:4px}
.dots i{width:6px;height:6px;border-radius:50%;background:var(--lichen);animation:blink 1000ms ease-in-out infinite}
.dots i:nth-child(2){animation-delay:150ms}.dots i:nth-child(3){animation-delay:300ms}
@keyframes blink{0%,100%{opacity:.25}50%{opacity:1}}
.desk-qs{display:grid;gap:8px;padding:14px 16px 16px;border-top:1px solid rgba(238,239,232,.12)}
.dq{min-height:44px;padding:9px 16px;border-radius:999px;border:1px solid rgba(203,211,174,.4);background:transparent;color:var(--cal);text-align:left;font:500 14.5px/1.3 var(--fb);cursor:pointer;transition:background-color 140ms ease,transform 140ms var(--ease-out)}
.dq:hover{background:rgba(203,211,174,.12)}
.dq:active{transform:scale(.98)}
.dq.act-btn{background:var(--sun);color:var(--oak);border-color:var(--sun)}

/* responsive */
@media (max-width:1140px){
  .avail-grid{grid-template-columns:1fr}
  .summary{position:static;max-width:640px}
  .chapters{width:180px}
}
@media (max-width:900px){
  .nav{display:none}
  .avail-head{grid-template-columns:1fr}
  .months{grid-template-columns:1fr}
  .month+.month{display:none}
  .room{flex-basis:84vw;grid-template-columns:1fr;align-items:start}
  .walk{grid-template-columns:1fr}
  .house{grid-template-columns:1fr}
}
@media (max-width:640px){
  body{font-size:16px}
  .top{height:62px;gap:12px}
  .mark{font-size:20px}
  .story{min-height:540px}
  /* portrait screens: zoom the two landscape frames toward the house and trees, not the sky */
  .slide:nth-child(1){--s0:1.6;--s1:1.68;--ox:46%;--oy:97%}
  .slide:nth-child(4){--s0:1.3;--s1:1.37;--ox:52%;--oy:96%}
  .slide:nth-child(2) img{object-position:50% 70%}
  .story-shade{background:linear-gradient(180deg,rgba(14,19,15,.5) 0,rgba(14,19,15,.12) 18%,rgba(14,19,15,.5) 46%,rgba(14,19,15,.9) 100%)}
  .story-copy{bottom:100px;gap:12px}
  h1{font-size:clamp(38px,11vw,50px)}
  .caption{font-size:16px}
  .datebar{display:grid;grid-template-columns:1fr 1fr;border-radius:20px;justify-self:stretch;margin-top:4px}
  .db-cell{min-width:0;padding:10px 16px}
  .db-cell:nth-child(2){border-right:0}
  .db-total{display:none}
  .db-go{grid-column:1/-1;justify-content:center;min-height:46px;margin:0 6px 6px}
  .chapters{left:var(--g);right:calc(var(--g) + 56px);top:74px;bottom:auto;width:auto;grid-template-columns:repeat(5,1fr);gap:6px}
  .chap{font-size:0;padding:21px 0;min-height:44px}
  .story-pause{top:74px}
  .avail{padding-left:10px;padding-right:10px}
  .avail-head{padding:0 6px}
  .cal-wrap{border-radius:20px;padding:16px 10px}
  .cal-nav{right:10px;top:12px}
  .month h3{font-size:24px;padding-left:6px}
  .day{min-height:50px}
  .day b{font-size:15px}
  .day small{font-size:10.5px}
  .summary{padding:22px 16px;border-radius:20px}
  .room{flex-basis:86vw}
  .room-ph img{aspect-ratio:4/3.6}
  .ghost{font-size:120px;bottom:-10px}
  .notes div{grid-template-columns:1fr;gap:2px}
  .score b{font-size:60px}
  .ask{right:12px;min-height:46px}
  .desk{right:8px;width:calc(100vw - 16px)}
}
@media (prefers-reduced-motion:reduce){
  .slide{transition:opacity 400ms ease}
  .slide.is-on img{animation:none;transform:scale(var(--s0,1))}
  .sun,.mist{animation:none}
  .chap[aria-selected="true"] i::after{animation:none;transform:scaleX(1)}
  .room-ph img{transition:none}
  .room:hover .room-ph img{transform:none}
  .rv.pre{opacity:1;transform:none}
  .done{animation:none}
  .desk{transition:opacity 150ms ease}
  .desk.is-enter{transform:none}
  .dots i{animation:none;opacity:.7}
}