/* ==========================================================
   In Bed with Honey · styles
   Visual system from Carlee's Written Visual Style Guide (Sept 16, 2026):
   warm parchment, deep botanical green, honey gold, blush, candlelight.
   ========================================================== */
/* Self-hosted fonts (SIL Open Font License, see /fonts) */
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/cormorant-garamond-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/cormorant-garamond-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/cormorant-garamond-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/cormorant-garamond-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Cormorant Garamond"; font-style: italic; font-weight: 400; font-display: swap; src: url("../fonts/cormorant-garamond-latin-400-italic.woff2") format("woff2"); }
@font-face { font-family: "Cormorant Garamond"; font-style: italic; font-weight: 500; font-display: swap; src: url("../fonts/cormorant-garamond-latin-500-italic.woff2") format("woff2"); }
@font-face { font-family: "Allura"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/allura-latin-400-normal.woff2") format("woff2"); }

:root {
  /* parchment + cream */
  --parchment: #f4e8d6;
  --parchment-2: #eddcc2;
  --cream-hi: #fbf5eb;
  /* deep botanical green */
  --green: #25301f;
  --green-2: #313d29;
  --green-3: #4a583d;
  --btn-green: #5b6a4b;
  /* honey */
  --honey: #c8963e;
  --honey-hi: #e8c27a;
  --honey-deep: #9c6b1f;
  --amber: #d98c1c;
  --blush: #d6a393;
  /* text */
  --ink: #1f2619;
  --text: #3a2f24;
  --text-muted: #6e5d4b;
  --text-light: #f6ecdd;
  --muted-light: #dccbb3;
  --line: rgba(200, 150, 62, .55);

  --serif: "Cormorant Garamond", "EB Garamond", Georgia, serif;
  --script: "Allura", "Parisienne", "Snell Roundhand", cursive;

  --gutter: clamp(18px, 4.5vw, 64px);
  --frame: 12px;
  --radius: 16px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; interpolate-size: allow-keywords; }
body {
  margin: 0; font-family: var(--serif); font-weight: 500;
  font-size: clamp(18px, .55vw + 14.5px, 21px); line-height: 1.6;
  color: var(--text); background: var(--parchment);
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
.theme-dark { background: var(--green); color: var(--text-light); }
img { max-width: 100%; display: block; }
a { color: inherit; }
h1, h2, h3, h4 { font-weight: 500; line-height: 1.05; margin: 0 0 .35em; letter-spacing: -.01em; color: inherit; text-wrap: balance; }
p { margin: 0 0 1em; }
strong { font-weight: 700; color: var(--ink); }
.theme-dark strong, .split--green strong { color: var(--text-light); }
.script { font-family: var(--script); font-weight: 400; letter-spacing: 0; color: var(--honey); line-height: .9; }
.theme-light .script { color: var(--honey-deep); }
.script--green { color: var(--green-3) !important; }
.script--line { font-size: 1.75em; display: block; line-height: 1.2; margin: .3em 0 .5em; }
.wrap { max-width: 1320px; margin: 0 auto; padding-inline: var(--gutter); }
.center { text-align: center; }
.skip { position: absolute; left: -999px; top: 8px; background: var(--cream-hi); color: var(--ink); padding: 8px 14px; z-index: 100; }
.skip:focus { left: 20px; }
:focus-visible { outline: 2px solid var(--honey); outline-offset: 3px; }
.bee { width: 1em; height: 1em; display: inline-block; vertical-align: -.12em; color: var(--honey); flex: none; }
.ico-sm { width: 2em; height: 1em; color: var(--honey); vertical-align: -.1em; }
.ico-sm.flip { transform: scaleX(-1); }
.hp { position: absolute; left: -9999px; }

/* Thin honey-gold frame around the whole window, as in every guide screen */
.frame { position: fixed; inset: var(--frame); border: 1px solid var(--line); border-radius: 18px; pointer-events: none; z-index: 44; }

/* ---------- Header ---------- */
.site-header { position: fixed; top: var(--frame); left: var(--frame); right: var(--frame); z-index: 40; transition: transform .5s cubic-bezier(.2,.8,.2,1); border-radius: 18px 18px 0 0; }
.theme-dark .site-header { color: var(--text-light); }
.theme-light .site-header { color: var(--ink); }
.site-header::before {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit;
  backdrop-filter: blur(14px) saturate(1.15); -webkit-backdrop-filter: blur(14px) saturate(1.15);
  border-bottom: 1px solid var(--line); opacity: 0; transition: opacity .45s;
}
.theme-dark .site-header::before { background: rgba(33, 42, 27, .78); }
.theme-light .site-header::before { background: rgba(244, 232, 214, .88); }
.site-header.is-scrolled::before, .page-request .site-header::before { opacity: 1; }
.site-header.is-hidden:not(.nav-open) { transform: translateY(-130%); }
.bar { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 20px clamp(18px, 3.4vw, 52px); transition: padding .4s; }
.site-header.is-scrolled .bar { padding-top: 12px; padding-bottom: 12px; }
.logo { text-decoration: none; font-size: 1.28rem; letter-spacing: .05em; white-space: nowrap; display: inline-flex; align-items: center; gap: .3em; }
.logo .script { font-size: 2.35rem; line-height: .8; transform: translateY(.06em); }
.nav { display: flex; align-items: center; gap: clamp(14px, 2vw, 34px); }
.nav a { position: relative; text-decoration: none; font-size: 1.02rem; opacity: .9; white-space: nowrap; transition: opacity .3s; }
.nav a:hover { opacity: 1; }
.nav > a:not(.btn-outline)::after { content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 1px; background: var(--honey); transform: scaleX(0); transform-origin: left; transition: transform .45s cubic-bezier(.2,.8,.2,1); }
.nav > a:not(.btn-outline):hover::after { transform: scaleX(1); }
.nav > a.is-current { opacity: 1; }
.nav > a.is-current::after { display: none; }
.btn-outline { border: 1px solid var(--honey); padding: 10px 20px; border-radius: 3px; text-decoration: none; display: inline-flex; align-items: center; gap: .6em; transition: background .3s; }
.btn-outline:hover { background: rgba(200,150,62,.16); }
.nav-toggle { display: none; background: none; border: 1px solid var(--line); color: inherit; border-radius: 4px; padding: 8px 14px; font: inherit; min-height: 44px; cursor: pointer; }

/* ==========================================================
   HONEY DRIPS · signature accent
   ========================================================== */
.honey { position: absolute; left: 0; right: 0; pointer-events: none; z-index: 2; }
.honey__band {
  position: absolute; left: 0; right: 0; top: 0; height: var(--band, 4px); border-radius: 99px;
  background: linear-gradient(180deg, #f6d08a 0%, #e0992a 45%, #b36a10 100%);
  box-shadow: 0 1px 2px rgba(110, 55, 0, .35), inset 0 1px 0 rgba(255, 240, 200, .8);
  transform-origin: left center; animation: pour 1.4s cubic-bezier(.3,.7,.2,1) var(--pour, .2s) both;
}
.honey i {
  position: absolute; top: 1px; left: var(--x); width: var(--w, 6px); margin-left: calc(var(--w, 6px) / -2);
  background: linear-gradient(90deg, #a8620f 0%, #e39f33 30%, #ffdb95 48%, #dc921f 66%, #9c5a0c 100%);
  border-radius: 0 0 99px 99px; transform-origin: top;
  animation: dripGrow 2.6s cubic-bezier(.5,0,.25,1) calc(var(--d) + var(--pour, .2s) + .4s) both,
             sag 4.5s ease-in-out calc(var(--d) + var(--pour, .2s) + 3s) infinite alternate;
}
.honey i::after { /* the bulb */
  content: ""; position: absolute; left: 50%; bottom: calc(var(--w, 6px) * -.55);
  width: calc(var(--w, 6px) * 1.55); aspect-ratio: .82; transform: translateX(-50%);
  border-radius: 50% 50% 50% 50% / 42% 42% 58% 58%;
  background: radial-gradient(circle at 34% 30%, #fff0c8 0%, #f0b551 22%, #d98c1c 55%, #9c5a0c 100%);
  box-shadow: 0 2px 3px rgba(110, 55, 0, .35);
}
.honey i::before { /* a drop that lets go now and then */
  content: ""; position: absolute; left: 50%; top: 100%; width: calc(var(--w, 6px) * 1.1); aspect-ratio: .8;
  margin-left: calc(var(--w, 6px) * -.55); border-radius: 50% 50% 50% 50% / 40% 40% 60% 60%;
  background: radial-gradient(circle at 35% 30%, #ffe7b0, #e39a2a 50%, #a8620f); opacity: 0;
  animation: fall 7s cubic-bezier(.55,0,1,.45) calc(var(--d) * 3 + 4.5s) infinite;
}
@keyframes pour { from { transform: scaleX(0); opacity: 0; } to { transform: scaleX(1); opacity: 1; } }
@keyframes dripGrow { from { height: 0; } to { height: var(--h); } }
@keyframes sag { from { height: var(--h); } to { height: calc(var(--h) * 1.14); } }
@keyframes fall {
  0%, 62% { opacity: 0; transform: translateY(0) scale(.5); }
  66% { opacity: 1; transform: translateY(4px) scale(1); }
  96% { opacity: .95; transform: translateY(var(--fall, 140px)) scale(1); }
  100% { opacity: 0; transform: translateY(calc(var(--fall, 140px) + 8px)) scale(.9, .6); }
}
/* over page titles */
.honeyed { position: relative; display: inline-block; padding-inline: .05em .15em; }
.honey--title { top: .22em; left: .12em; right: .2em; --band: 3px; --pour: 1.1s; --fall: 70px; }
.honey--title i { --w: 5px; }
/* under the current nav item: "you are here" */
.honey--nav { top: calc(100% + 3px); --band: 2.5px; --pour: .3s; --fall: 26px; }
.honey--nav i { --w: 4px; }
/* hanging from the frame on the landing page (one organic SVG) */
.hero-drips { position: absolute; top: calc(var(--frame) - 1px); left: clamp(240px, 21%, 400px); width: clamp(130px, 11vw, 190px); height: auto; z-index: 39; pointer-events: none; overflow: visible;
  filter: drop-shadow(0 4px 6px rgba(40, 20, 0, .5)) drop-shadow(0 0 10px rgba(255, 190, 90, .25)); clip-path: inset(0 0 100% 0); animation: honeyFlow 3.8s cubic-bezier(.55,0,.2,1) .5s forwards; }
@keyframes honeyFlow { to { clip-path: inset(0 0 -60% 0); } }
.hd-drip { transform-box: fill-box; transform-origin: 50% 0; animation: sagSvg 5.5s ease-in-out infinite alternate; animation-delay: calc(4s + var(--k) * 1.3s); }
@keyframes sagSvg { from { transform: scaleY(1); } to { transform: scaleY(1.07); } }
.hd-drop { opacity: 0; transform-box: fill-box; transform-origin: center; animation: hdFall 9s cubic-bezier(.55,0,1,.45) infinite; animation-delay: calc(6s + var(--k) * 2.7s); }
@keyframes hdFall { 0%, 70% { opacity: 0; transform: translateY(-4px) scale(.5); } 73% { opacity: 1; transform: translateY(0) scale(1); } 97% { opacity: .9; transform: translateY(520px) scale(1, 1.15); } 100% { opacity: 0; transform: translateY(540px) scale(1.3, .5); } }

/* ---------- Buttons & links ---------- */
.btn-honey {
  position: relative; overflow: hidden; isolation: isolate;
  display: inline-flex; align-items: center; gap: .75em;
  background: linear-gradient(135deg, #dcb468, #c18d38 55%, #d6ad5f);
  color: #fffaf0; text-decoration: none; letter-spacing: .16em; text-transform: uppercase;
  font-size: .92rem; font-weight: 600; padding: 18px 32px; border-radius: 3px; border: 0; cursor: pointer; font-family: inherit;
  box-shadow: 0 10px 30px rgba(20, 16, 8, .3); transition: transform .3s, filter .3s;
}
.btn-honey .bee { color: #fff4dd; }
.btn-honey:hover { filter: brightness(1.06); transform: translateY(-1px); }
.btn-green {
  position: relative; overflow: hidden; isolation: isolate;
  display: inline-flex; align-items: center; justify-content: center; gap: .7em;
  background: var(--btn-green); color: var(--text-light); text-decoration: none;
  font-family: inherit; font-size: 1.2rem; font-weight: 500; padding: 15px 40px; border-radius: 4px; border: 0; cursor: pointer;
  box-shadow: 0 8px 22px rgba(37, 48, 31, .25); transition: background .3s, transform .3s;
}
.btn-green .bee { color: var(--honey-hi); }
.btn-green:hover { background: #4e5c40; transform: translateY(-1px); }
.btn-block { width: 100%; }
.btn-honey::after, .btn-green::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(110deg, transparent 30%, rgba(255,247,222,.45) 50%, transparent 70%);
  transform: translateX(-120%); animation: sheen 7s ease-in-out infinite 2s;
}
@keyframes sheen { 0%, 72% { transform: translateX(-120%); } 92%, 100% { transform: translateX(120%); } }
.text-link { display: inline-flex; align-items: center; gap: .7em; text-underline-offset: 6px; text-decoration-color: var(--honey); text-decoration-thickness: 1px; }
.text-link::after { content: "\27F6"; display: inline-block; color: var(--honey); transition: transform .3s; }
.text-link:hover::after { transform: translateX(6px); }

/* ---------- Ornament rule ---------- */
.rule { display: flex; align-items: center; gap: 14px; color: var(--honey); max-width: 320px; margin: 16px 0 26px; }
.rule::before, .rule::after { content: ""; height: 1px; flex: 1; background: currentColor; opacity: .75; }
.rule--center { margin-inline: auto; }
.rule--short { max-width: 150px; margin: 10px auto 16px; }

/* ==========================================================
   HOME · one photo, three movements (hero → cherishing → beds)
   ========================================================== */
.scene { position: relative; --p: 0; }
.stage { position: sticky; top: 0; height: 100vh; height: 100svh; margin-bottom: -100vh; margin-bottom: -100svh; overflow: hidden; z-index: 0; }
.stage__media { position: absolute; inset: 0; overflow: hidden; animation: breathe 28s ease-in-out infinite alternate; }
.stage__img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 62% 32%;
  /* screens 01-03 keep the same room visible through all three movements; only a gentle dim */
  filter: brightness(calc(1 - var(--p) * .28)) saturate(calc(1 - var(--p) * .12)) blur(calc(var(--p) * 1px));
  transform: scale(calc(1.02 + var(--p) * .03));
}
.stage::before {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(90deg, rgba(22, 26, 16, .9) 0%, rgba(22, 26, 16, .66) 34%, rgba(22, 26, 16, .12) 64%, rgba(22, 26, 16, 0) 100%),
    linear-gradient(0deg, rgba(22, 26, 16, .6), transparent 38%);
}
.stage::after { content: ""; position: absolute; inset: 0; z-index: 1; background: rgba(28, 34, 22, calc(var(--p) * .3)); }
@keyframes breathe { from { transform: scale(1); } to { transform: scale(1.06) translate(-1%, -1%); } }

.panel { position: relative; z-index: 3; min-height: 100vh; min-height: 100svh; display: flex; align-items: center; padding: 130px 0 90px; color: var(--text-light); }
.panel__inner { max-width: 580px; margin-left: clamp(24px, 14vw, 240px); margin-right: var(--gutter); }
.panel h1 { font-size: clamp(2.9rem, 5vw, 4.7rem); }
.panel h1 .script, .panel h2 .script { font-size: 1.22em; display: block; margin-top: .06em; color: var(--honey); }
.panel h2 { font-size: clamp(2.5rem, 4.3vw, 4rem); }
.panel p { color: var(--muted-light); }
.panel .lede { font-size: 1.14em; color: var(--text-light); }
.panel--cherish .panel__inner { max-width: 620px; }
.panel--cherish .script--line { font-size: 1.9em; color: var(--honey-hi); margin-top: .15em; }
.values { letter-spacing: .2em; text-transform: uppercase; font-size: .8rem; color: var(--honey-hi) !important; margin-top: 1.6em; }
.welcome { font-size: 1.1em; }
.welcome em { color: var(--text-light); }
.actions { display: flex; flex-direction: column; align-items: flex-start; gap: 26px; margin-top: 34px; }
.panel .btn-honey { margin-top: 10px; }

/* Scroll-linked fade for each movement (JS sets --f 0..1) */
[data-fade] { opacity: var(--f, 1); filter: blur(calc((1 - var(--f, 1)) * 8px)); translate: 0 calc((1 - var(--f, 1)) * -24px); }

/* Atmosphere on the stage */
.glow { position: absolute; z-index: 1; pointer-events: none; border-radius: 50%; width: var(--s, 34vmax); height: var(--s, 34vmax); background: radial-gradient(circle, rgba(255,186,105,.3) 0%, rgba(255,160,80,.1) 35%, transparent 65%); mix-blend-mode: screen; transform: translate(-50%, -50%); animation: flicker 3.7s infinite; }
.glow--a { left: 88%; top: 86%; }
.glow--b { left: 58%; top: 16%; --s: 26vmax; animation-duration: 5.3s; animation-delay: -2s; }
@keyframes flicker { 0%, 100% { opacity: .85; } 12% { opacity: .62; } 25% { opacity: .95; } 41% { opacity: .7; } 58% { opacity: 1; } 73% { opacity: .75; } }
.rays { position: absolute; top: -30%; right: -20%; width: 90%; height: 150%; z-index: 1; pointer-events: none;
  background: repeating-conic-gradient(from 195deg at 80% 0%, rgba(255,222,165,0) 0deg 5deg, rgba(255,222,165,.07) 7deg 9deg, rgba(255,222,165,0) 12deg 17deg);
  -webkit-mask-image: radial-gradient(ellipse 70% 80% at 80% 0%, #000, transparent 75%); mask-image: radial-gradient(ellipse 70% 80% at 80% 0%, #000, transparent 75%);
  filter: blur(8px); mix-blend-mode: screen; transform-origin: 80% 0%; animation: rays 20s ease-in-out infinite alternate; }
@keyframes rays { from { transform: rotate(-3deg); } to { transform: rotate(4deg); } }
.veils { position: absolute; inset: 0; z-index: 1; pointer-events: none; overflow: hidden; }
.veil { position: absolute; top: -12%; height: 124%; width: 30%;
  background: repeating-linear-gradient(90deg, rgba(255,238,214,0) 0 16px, rgba(255,238,214,.06) 24px, rgba(255,238,214,0) 38px), linear-gradient(90deg, transparent, rgba(255,238,214,.08) 30%, rgba(255,238,214,.14) 50%, rgba(255,238,214,.06) 72%, transparent);
  filter: blur(5px); mix-blend-mode: screen; transform-origin: 50% 0; animation: sway 12s ease-in-out infinite alternate;
  -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent); mask-image: linear-gradient(180deg, #000 55%, transparent); }
.v1 { left: -8%; translate: calc(var(--p) * 18vw) 0; }
.v2 { left: 46%; width: 18%; opacity: .5; animation-duration: 16s; animation-delay: -6s; }
.v3 { right: -10%; translate: calc(var(--p) * -18vw) 0; animation-delay: -3s; animation-duration: 14s; }
@keyframes sway { from { transform: skewX(-2.5deg); } to { transform: skewX(3deg) scaleX(1.1); } }
.mist { position: absolute; left: 0; right: 0; bottom: 0; height: 65%; z-index: 2; pointer-events: none; }
.stage .mist { height: 100%; }
.stage .mist { translate: 0 calc(var(--p) * -18%); opacity: calc(.7 + var(--p) * .5); }
.mist span { position: absolute; bottom: -30%; width: 75%; height: 100%; border-radius: 50%; background: radial-gradient(ellipse at center, rgba(255,236,216,.15), rgba(255,236,216,.04) 45%, transparent 68%); filter: blur(28px); animation: drift 40s ease-in-out infinite; }
.mist span:nth-child(1) { left: -25%; }
.mist span:nth-child(2) { left: 35%; animation-duration: 55s; animation-direction: reverse; opacity: .8; bottom: -40%; }
.mist span:nth-child(3) { left: 70%; width: 55%; animation-duration: 47s; animation-delay: -20s; opacity: .6; }
@keyframes drift { 0%, 100% { transform: translateX(-12%); } 50% { transform: translateX(14%) translateY(-6%) scale(1.12); } }
.fx-dust { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; }
.flyer { position: absolute; z-index: 3; left: 0; top: 0; width: 22px; height: 22px; pointer-events: none;
  offset-path: path("M -60 520 C 220 380, 380 620, 640 420 S 1000 180, 1180 300 S 1500 420, 1800 160"); offset-rotate: auto 90deg;
  color: var(--honey-hi); filter: drop-shadow(0 0 6px rgba(255,210,140,.8)); animation: fly 26s linear infinite 3s; opacity: 0; }
.flyer .bee { width: 22px; height: 22px; color: inherit; animation: flutter .12s linear infinite alternate; }
@keyframes fly { 0% { offset-distance: 0%; opacity: 0; } 3% { opacity: .95; } 42% { opacity: .95; } 46% { offset-distance: 100%; opacity: 0; } 100% { offset-distance: 100%; opacity: 0; } }
@keyframes flutter { from { transform: scaleX(1); } to { transform: scaleX(.86); } }

/* ---------- Botanicals (Carlee's approved linework, traced from 05_Meet_Honey) ---------- */
.botanical { position: absolute; pointer-events: none; width: auto; max-width: none; z-index: 1; opacity: .9; transform-origin: 50% 100%; animation: stemSway 9s ease-in-out infinite alternate; }
.theme-light .botanical:not(.botanical--footer) { filter: brightness(.82) saturate(1.1); }
.js .botanical { clip-path: inset(100% 0 0 0); transition: clip-path 3.2s cubic-bezier(.35,0,.2,1); }
.js .botanical.is-in { clip-path: inset(-5% -5% -5% -5%); }
@keyframes stemSway { from { rotate: -.8deg; } to { rotate: .9deg; } }
.botanical--hero { left: calc(var(--frame) + 6px); bottom: 0; height: min(68vh, 640px); z-index: 2; opacity: .75; }
.botanical--edge { left: clamp(10px, 1.6vw, 28px); top: 130px; height: min(calc(100% - 200px), 860px); opacity: .85; }
.botanical--right { left: auto; right: clamp(10px, 1.6vw, 28px); }
.botanical--footer { right: 3%; bottom: -40px; height: 360px; opacity: .35; }

/* ---------- The Seven Beds ---------- */
.panel--beds { display: block; padding: 18vh 0 110px; }
.panel--beds::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(31,39,25,0) 0, rgba(31,39,25,.5) 30vh, rgba(31,39,25,.78) 100%); pointer-events: none; }
.beds-intro { max-width: 600px; margin-left: clamp(0px, 10vw, 180px); }
.beds-intro p { color: var(--muted-light); font-size: 1.12em; }
.hint { font-style: italic; color: var(--text-light) !important; font-size: 1em !important; display: flex; align-items: center; gap: 10px; }
.aurora { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; -webkit-mask-image: linear-gradient(180deg, transparent, #000 25%, #000 60%, transparent 95%); mask-image: linear-gradient(180deg, transparent, #000 25%, #000 60%, transparent 95%); }
.aurora span { position: absolute; border-radius: 50%; filter: blur(70px); mix-blend-mode: screen; opacity: .45; animation: aurora 30s ease-in-out infinite alternate; }
.aurora span:nth-child(1) { width: 55vw; height: 40vw; left: -10%; top: 30%; background: rgba(200,150,62,.32); }
.aurora span:nth-child(2) { width: 45vw; height: 35vw; right: -8%; top: 45%; background: rgba(214,163,147,.26); animation-duration: 38s; animation-delay: -12s; }
.aurora span:nth-child(3) { width: 35vw; height: 28vw; left: 38%; top: 62%; background: rgba(90,120,80,.22); animation-duration: 44s; animation-delay: -20s; }
@keyframes aurora { from { transform: translate(0, 0); } to { transform: translate(8vw, -6vh) scale(1.2); } }

.arches { list-style: none; margin: 48px 0 0; padding: 8px 2px 12px; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: clamp(10px, 1.6vw, 26px); }
.arch { all: unset; position: relative; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 14px; width: 100%; perspective: 700px; translate: 0 var(--wy, 0px); }
.arch:focus-visible { outline: 2px solid var(--honey); outline-offset: 6px; border-radius: 8px; }
.arch::before { content: ""; position: absolute; z-index: -1; left: 50%; top: 38%; width: 130%; aspect-ratio: 1; transform: translate(-50%, -50%); background: radial-gradient(circle, rgba(232,194,122,.28), transparent 62%); opacity: .25; animation: halo 6s ease-in-out infinite; animation-delay: calc(var(--i, 0) * -.85s); pointer-events: none; }
.arches li:nth-child(2) .arch::before { --i: 1; } .arches li:nth-child(3) .arch::before { --i: 2; } .arches li:nth-child(4) .arch::before { --i: 3; }
.arches li:nth-child(5) .arch::before { --i: 4; } .arches li:nth-child(6) .arch::before { --i: 5; } .arches li:nth-child(7) .arch::before { --i: 6; }
@keyframes halo { 0%, 100% { opacity: .15; } 50% { opacity: .7; } }
.arch__frame {
  position: relative; width: 100%; aspect-ratio: 17 / 25; border-radius: 999px 999px 6px 6px; overflow: hidden;
  border: 2px solid var(--honey); padding: 5px; background: linear-gradient(180deg, rgba(232,194,122,.25), rgba(200,150,62,.08));
  box-shadow: 0 0 0 1px rgba(232,194,122,.35), 0 20px 40px rgba(0,0,0,.4);
  transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
  transition: transform .45s cubic-bezier(.2,.8,.2,1), box-shadow .45s;
}
.arch__frame img { width: 100%; height: 100%; object-fit: cover; border-radius: 999px 999px 3px 3px; transition: transform .8s; }
.arch__frame::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: linear-gradient(115deg, transparent 30%, rgba(255,241,205,.5) 48%, rgba(255,241,205,.08) 56%, transparent 66%); transform: translateX(-130%); transition: transform 1.1s cubic-bezier(.2,.8,.2,1); }
.arch:hover .arch__frame::after, .arch:focus-visible .arch__frame::after { transform: translateX(130%); }
.arch:hover .arch__frame { transform: translateY(-6px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); box-shadow: 0 0 0 1px var(--honey-hi), 0 26px 50px rgba(0,0,0,.5), 0 0 40px rgba(232,194,122,.25); }
.arch:hover img { transform: scale(1.06); }
.arch[aria-expanded="true"] .arch__frame { transform: translateY(-9px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); border-color: var(--honey-hi); box-shadow: 0 0 0 1px var(--honey-hi), 0 0 50px rgba(232,194,122,.5); }
.arch[aria-expanded="true"] img { transform: scale(1.08); }
.arch__label { letter-spacing: .14em; text-transform: uppercase; font-size: .95rem; display: flex; align-items: center; gap: .55em; color: var(--text-light); white-space: nowrap; }
.arch__label .bee { font-size: .85em; }
.arch[aria-expanded="true"] .arch__label { text-decoration: underline; text-underline-offset: 8px; text-decoration-color: var(--honey); }
.swipe-hint { display: none; }

/* Drawer, after the approved Sanctuary template */
.drawer { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .65s cubic-bezier(.2,.8,.2,1); }
.drawer.is-open { grid-template-rows: 1fr; }
.drawer__inner { overflow: hidden; padding-top: 40px; margin-top: -40px; }
.drawer__card {
  position: relative; margin-top: 44px; color: var(--text);
  background: linear-gradient(180deg, var(--cream-hi), var(--parchment) 60%);
  border: 1px solid rgba(200, 120, 50, .6); border-radius: 22px;
  padding: clamp(28px, 4vw, 54px) clamp(22px, 4vw, 60px) 28px;
  box-shadow: 0 34px 70px rgba(0,0,0,.4);
}
.drawer__notch { position: absolute; top: 0; left: var(--notch, 50%); width: 64px; height: 34px; transform: translate(-50%, -100%); background: var(--cream-hi); border: 1px solid rgba(200, 120, 50, .6); border-bottom: 0; border-radius: 64px 64px 0 0; display: grid; place-items: end center; padding-bottom: 2px; transition: left .5s cubic-bezier(.2,.8,.2,1); }
.drawer__notch .bee { font-size: 1.3rem; color: #c8782f; margin-bottom: -10px; background: var(--cream-hi); }
.drawer__close { position: absolute; top: 12px; right: 14px; z-index: 3; background: none; border: 0; font: inherit; font-size: 1.9rem; line-height: 1; color: var(--text-muted); cursor: pointer; min-width: 44px; min-height: 44px; }
.bed { display: none; grid-template-columns: minmax(170px, 230px) 1fr 1.35fr; gap: clamp(22px, 3.6vw, 56px); align-items: start; }
.bed.is-active { display: grid; }
.bed__img { border-radius: 999px 999px 6px 6px; overflow: hidden; border: 2px solid var(--honey); padding: 4px; background: rgba(200,150,62,.15); box-shadow: 0 16px 30px rgba(90,55,20,.25); }
.bed__img img { border-radius: 999px 999px 3px 3px; aspect-ratio: 17/25; object-fit: cover; width: 100%; }
.bed h3 { font-size: clamp(2.2rem, 3.3vw, 3.1rem); letter-spacing: .06em; text-transform: uppercase; color: var(--ink); margin-bottom: .12em; font-weight: 500; }
.bed .tagline { font-family: var(--script); color: var(--green-3); font-size: 1.85rem; line-height: 1.2; margin-bottom: .9em; }
.drawer__card p, .drawer__card dd, .drawer__card li { color: var(--text); }
.bed__main p { font-size: 1.08em; }
.bed__cta { margin-top: 10px; }
.bed__meta { position: relative; border-left: 1px dotted rgba(200, 120, 50, .7); padding-left: clamp(22px, 3vw, 44px); }
.bed__meta h4 { font-size: 1.3rem; color: var(--green-3); margin: 0 0 14px; text-align: left; }
.includes { list-style: none; padding: 0; margin: 0 0 24px; display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 10px 24px; }
.includes li { display: flex; align-items: center; gap: .45em; color: var(--text); }
.includes li .bee { color: #c8782f; }
.facets { margin: 0; }
.facets div { display: grid; grid-template-columns: 9.5em 1fr; gap: 16px; padding: 14px 4px; border-top: 1px dotted rgba(200,120,50,.55); }
.facets dt { display: flex; align-items: center; gap: .6em; font-size: 1.28rem; color: var(--green-3); }
.facets dd { margin: 0; align-self: center; }
.facets .dot { color: #c8782f; }
.ico { width: 34px; height: 34px; color: #c8782f; flex: none; }
.drawer__nav { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 26px; }
.drawer__foot { margin: 0; flex: 1; text-align: center; font-style: italic; color: var(--text-muted) !important; font-size: 1.1em; display: flex; align-items: center; justify-content: center; gap: 12px; }
.drawer__foot .ico-sm { color: #c8782f; }
.drawer__step { background: none; border: 1px solid rgba(200,120,50,.45); border-radius: 999px; color: var(--ink); font: inherit; font-size: .98rem; padding: 10px 20px; min-height: 44px; cursor: pointer; white-space: nowrap; transition: background .25s, border-color .25s; }
.drawer__step:hover { background: rgba(200,150,62,.16); border-color: var(--honey); }
.bed.is-active > * { animation: unfold .9s cubic-bezier(.2,.8,.2,1) both; }
.bed.is-active > :nth-child(2) { animation-delay: .1s; }
.bed.is-active > :nth-child(3) { animation-delay: .2s; }
.bed.is-active .includes li { animation: unfold .6s cubic-bezier(.2,.8,.2,1) both; animation-delay: calc(.3s + var(--i, 0) * 70ms); }
.bed.is-active .bed__img img { animation: develop 1.5s ease both; }
@keyframes unfold { from { opacity: 0; transform: translateY(14px); filter: blur(4px); } to { opacity: 1; transform: none; filter: none; } }
@keyframes develop { from { filter: brightness(1.6) blur(6px) saturate(.4); transform: scale(1.08); } to { filter: none; transform: scale(1); } }

/* ==========================================================
   SPLIT PAGES · photo fading into parchment (or green)
   ========================================================== */
.split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); min-height: 100svh; background: var(--parchment); position: relative; }
.split--right .split__media { order: 2; }
.split__media { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; }
.split__media img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.08) translateY(calc(var(--sp, 0) * -4%)); transition: transform .2s linear; }
.split--right .split__media { -webkit-mask-image: linear-gradient(90deg, transparent 0, rgba(0,0,0,.6) 10%, #000 26%), linear-gradient(180deg, transparent 0, rgba(0,0,0,.35) 70px, #000 170px); -webkit-mask-composite: source-in; mask-image: linear-gradient(90deg, transparent 0, rgba(0,0,0,.6) 10%, #000 26%), linear-gradient(180deg, transparent 0, rgba(0,0,0,.35) 70px, #000 170px); mask-composite: intersect; }
.split--left .split__media { -webkit-mask-image: linear-gradient(270deg, transparent 0, rgba(0,0,0,.6) 10%, #000 28%); mask-image: linear-gradient(270deg, transparent 0, rgba(0,0,0,.6) 10%, #000 28%); }
.split__body { position: relative; padding: 150px clamp(26px, 5.5vw, 96px) 110px clamp(70px, 9vw, 150px); }
.split--left .split__body { padding: 150px clamp(90px, 13vw, 230px) 110px clamp(26px, 4vw, 70px); }
.split__copy { position: relative; z-index: 2; max-width: 600px; }
.page-title { font-size: clamp(3rem, 5.6vw, 5.3rem); line-height: .98; color: var(--ink); margin-bottom: .1em; }
.page-title .script { font-size: 1.28em; color: var(--honey-deep); }
.page-title--center { text-align: center; }
.subtitle { font-size: 1.5rem; color: var(--green-3); margin: .2em 0 0 .6em; }
.lede { font-size: 1.2em; }
.lede--italic { font-style: italic; font-size: clamp(1.45rem, 2.2vw, 1.9rem); line-height: 1.25; color: var(--ink); }
.stanza { font-size: 1.06em; line-height: 1.5; }
.indent { padding-left: 2.2em; font-style: italic; }
.indent--2 { padding-left: 3em; }
.closing { margin-top: 2.2em; padding-top: 1.4em; border-top: 1px solid var(--line); }
.closing .script--line { margin: 0 0 .1em; font-size: 2.1em; }
.invite { font-style: italic; font-size: clamp(1.45rem, 2.2vw, 1.8rem); color: var(--honey-deep); text-decoration: underline; text-decoration-color: var(--line); text-underline-offset: 7px; transition: color .3s; }
.invite:hover { color: var(--green-3); }
/* Meet Honey: deep green */
.split--green { background: var(--green); color: var(--muted-light); }
.split--green .page-title { color: var(--text-light); }
.split--green .page-title .script { color: var(--honey); }
.split--green .lede--italic { color: var(--honey-hi); }
.split--green .split__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 50%, rgba(37,48,31,.5)); }
.split--confirm .split__copy { margin-inline: auto; text-align: center; }
.split--confirm .page-title .script { display: block; font-size: 1.05em; margin-top: .1em; }

/* ==========================================================
   RESERVE SPACIOUSNESS
   ========================================================== */
.offerings { position: relative; overflow: hidden; padding: 150px 0 110px; min-height: 100svh; }
.offerings__bg { position: absolute; inset: 0; z-index: 0; background: url("../images/offerings-bg.jpg") center / cover no-repeat; transform: scale(1.1); }
.offerings__bg::after { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse 70% 60% at 50% 40%, rgba(247,238,224,.93), rgba(244,232,214,.8) 60%, rgba(235,220,196,.72)); }
.offerings .wrap { position: relative; z-index: 2; }
.offerings__head { max-width: 760px; margin: 0 auto; text-align: center; }
.offerings__head .page-title .script { color: var(--green-3); }
.offerings__head .script--line { font-size: 2em; color: var(--ink) !important; font-family: var(--script); }
.offer-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 44px); margin: 46px auto 0; max-width: 1080px; }
.offer { text-align: center; }
.offer__img { position: relative; border-radius: 16px; overflow: hidden; border: 1px solid var(--honey); padding: 5px; background: rgba(255,248,236,.6); box-shadow: 0 18px 40px rgba(90,60,20,.18); margin-bottom: 20px; }
.offer__img img { width: 100%; aspect-ratio: 5 / 4; object-fit: cover; border-radius: 12px; transition: transform 1s; }
.offer:hover .offer__img img { transform: scale(1.05); }
.offer h2 { font-size: clamp(1.9rem, 2.6vw, 2.4rem); color: var(--ink); margin-bottom: .1em; }
.offer__meta { font-size: 1.25rem; letter-spacing: .05em; color: var(--text); margin: 0; }
.offer p:last-child { max-width: 32ch; margin-inline: auto; }
.promises { list-style: none; padding: 0; margin: 50px auto 30px; display: flex; justify-content: center; flex-wrap: wrap; gap: 0; max-width: 1000px; }
.promises li { padding: 6px clamp(14px, 2.5vw, 34px); font-size: 1.15rem; color: var(--ink); }
.promises li + li { border-left: 1px solid var(--honey); }
.clarify { max-width: 640px; margin: 44px auto 0; text-align: center; color: var(--text-muted); font-size: 1rem; }
.clarify em { color: var(--ink); font-size: 1.12em; }
.botanical--corner { bottom: -2%; height: min(62vh, 560px); z-index: 1; opacity: .8; }
.botanical--corner.botanical--left { left: calc(var(--frame) + 4px); }
.botanical--corner.botanical--right { left: auto; right: calc(var(--frame) + 4px); transform: scaleX(-1); animation-name: stemSwayFlip; }
@keyframes stemSwayFlip { from { rotate: .8deg; } to { rotate: -.9deg; } }

/* ==========================================================
   QUESTIONS & BOUNDARIES
   ========================================================== */
.faq-page { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.2fr); gap: clamp(30px, 5vw, 80px); padding: 140px clamp(22px, 5vw, 80px) 100px; position: relative; }
.faq-page__media { position: sticky; top: 110px; align-self: start; padding-left: clamp(40px, 6vw, 110px); }
.soft-photo { position: relative; border-radius: 18px; overflow: hidden; border: 1px solid var(--honey); padding: 6px; background: var(--cream-hi); box-shadow: 0 24px 50px rgba(90,60,20,.18); }
.soft-photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 13px; }
.botanical--faq { top: 10px; left: 0; height: 90%; }
.tagline-lg { font-size: 2.1rem !important; margin: 0 0 18px !important; }
.faq-toc { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 34px; }
.faq-toc a { text-decoration: none; border: 1px solid var(--line); border-radius: 999px; padding: 8px 16px; font-size: .95rem; transition: background .3s; }
.faq-toc a:hover { background: rgba(200,150,62,.15); }
.qa-group { margin-bottom: 40px; scroll-margin-top: 120px; }
.qa-group__title { font-size: 1.1rem; letter-spacing: .18em; text-transform: uppercase; color: var(--green-3); display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.qa { border: 1px solid rgba(200, 120, 50, .5); border-radius: 16px; background: rgba(251, 245, 235, .6); margin-bottom: 12px; transition: background .4s, box-shadow .4s; }
.qa[open] { background: var(--cream-hi); box-shadow: 0 14px 30px rgba(90,60,20,.1); }
.qa summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 16px; padding: 16px 56px 16px 18px; font-size: 1.22rem; color: var(--ink); position: relative; min-height: 44px; }
.qa summary::-webkit-details-marker { display: none; }
.qa summary::after { content: "+"; position: absolute; right: 22px; top: 50%; transform: translateY(-50%); color: #c8782f; font-size: 1.7rem; font-weight: 300; transition: transform .35s; }
.qa[open] summary::after { content: "\2212"; }
.qa__bloom { width: 30px; height: 30px; color: #c8782f; flex: none; transition: rotate .8s cubic-bezier(.2,.8,.2,1); }
.qa[open] .qa__bloom { rotate: 60deg; }
.qa__a { padding: 4px 26px 8px 64px; border-top: 1px dotted rgba(200,120,50,.5); margin: 0 18px; padding-top: 14px; }
.qa__a p { margin-bottom: .7em; }
.qa::details-content { block-size: 0; overflow: hidden; transition: block-size .5s cubic-bezier(.2,.8,.2,1), content-visibility .5s allow-discrete; }
.qa[open]::details-content { block-size: auto; }

/* ==========================================================
   REQUEST A VISIT
   ========================================================== */
.request { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); min-height: 100svh; }
.request__intro { position: relative; color: var(--text-light); background: var(--green); }
.request__photo { position: absolute; inset: 0; overflow: hidden; }
.request__photo img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.5) saturate(.9); }
.request__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(37,48,31,.35), rgba(37,48,31,.7)); }
.request__intro-copy { position: sticky; top: 0; z-index: 2; padding: 150px clamp(26px, 5vw, 90px) 80px; max-width: 640px; margin-left: auto; }
.request__intro .page-title { color: var(--text-light); }
.request__intro .page-title .script { color: var(--honey); display: block; padding-left: .8em; }
.request__intro p { color: var(--muted-light); }
.request__intro .lede { color: var(--text-light); }
.request__form { position: relative; padding: 140px clamp(56px, 7vw, 120px) 90px; background: linear-gradient(90deg, var(--parchment-2), var(--parchment) 20%); }
.botanical--form { top: 150px; height: min(80%, 820px); opacity: .9; }
.botanical--form.botanical--left { left: 10px; }
.botanical--form.botanical--right { left: auto; right: 10px; }
.form { position: relative; z-index: 2; max-width: 680px; margin-inline: auto; background: rgba(251, 245, 235, .82); border: 1px solid var(--line); border-radius: 22px; padding: clamp(28px, 4vw, 48px); box-shadow: 0 24px 60px rgba(90,60,20,.12); }
.form__bee { position: absolute; top: 18px; left: 50%; transform: translateX(-50%); font-size: 1.6rem; color: var(--honey); display: flex; }
.form fieldset { border: 0; padding: 0; margin: 0 0 34px; min-width: 0; }
.form > fieldset > legend { font-size: 1.65rem; color: var(--green-3); padding: 0; margin: 12px 0 14px; display: flex; align-items: center; gap: 12px; }
.form > fieldset > legend::after { content: ""; height: 1px; width: 60px; background: var(--line); }
.field { margin-bottom: 18px; }
.field label, .field .label { display: block; margin-bottom: 6px; font-size: 1.05rem; color: var(--ink); padding: 0; }
.sub { border: 0; padding: 0; margin: 0 0 18px; }
.opt, .req { color: var(--text-muted); font-style: italic; font-size: .9em; }
.form input[type=text], .form input[type=email], .form input[type=tel], .form textarea {
  width: 100%; font: inherit; font-size: 1.02rem; color: var(--ink); background: var(--cream-hi);
  border: 1px solid rgba(160,120,60,.45); border-radius: 5px; padding: 11px 13px; transition: border-color .3s, box-shadow .3s;
}
.form textarea { min-height: 96px; resize: vertical; }
.form input:focus, .form textarea:focus { outline: none; border-color: var(--honey); box-shadow: 0 0 0 4px rgba(200,150,62,.18), 0 0 22px rgba(232,194,122,.25); }
.row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.checks { display: flex; flex-wrap: wrap; gap: 10px; }
.check, .field .check { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; margin-bottom: 0; }
.check input { width: 20px; height: 20px; accent-color: var(--btn-green); margin: 3px 0 0; flex: none; }
.chip, .field .chip { align-items: center; }
.chip { border: 1px solid rgba(160,120,60,.45); border-radius: 999px; padding: 8px 15px; background: var(--cream-hi); align-items: center; min-height: 44px; transition: background .3s, border-color .3s, box-shadow .3s; }
.chip input { margin: 0; }
.chip:has(input:checked) { background: rgba(232,194,122,.35); border-color: var(--honey); box-shadow: 0 0 16px rgba(232,194,122,.35); }
.acks .ack { margin-bottom: 12px; line-height: 1.45; }
.age-note { color: #9a3b1c; font-style: italic; }
.form__note { font-style: italic; color: var(--text-muted); text-align: center; font-size: .98rem; }

/* ==========================================================
   Continue deeper + footer
   ========================================================== */
.deeper { position: relative; text-align: center; padding: 80px var(--gutter) 90px; background: var(--parchment-2); overflow: hidden; }
.theme-dark .deeper { background: var(--green-2); }
.deeper a { display: inline-flex; flex-direction: column; align-items: center; gap: 4px; text-decoration: none; }
.deeper__kicker { letter-spacing: .24em; text-transform: uppercase; font-size: .8rem; color: var(--honey-deep); }
.theme-dark .deeper__kicker { color: var(--honey-hi); }
.deeper__name { font-size: clamp(2.2rem, 4.2vw, 3.6rem); line-height: 1.1; }
.deeper__arrow { color: var(--honey); font-size: 1.8rem; transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.deeper a:hover .deeper__arrow { transform: translateX(10px); }
.site-footer { position: relative; overflow: hidden; background: var(--green); color: var(--muted-light); padding: 70px 0 60px; font-size: .98rem; }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 34px; position: relative; z-index: 2; }
.site-footer a { text-decoration: none; }
.site-footer a:hover { color: var(--honey-hi); }
.site-footer ul { list-style: none; padding: 0; margin: 0; }
.site-footer li { margin-bottom: 8px; }
.site-footer .logo { color: var(--text-light); margin-bottom: 14px; }
.footer-line { max-width: 34ch; }
.fine { grid-column: 1 / -1; border-top: 1px solid rgba(200,150,62,.28); padding-top: 22px; font-size: .86rem; opacity: .75; margin: 0; }

/* ==========================================================
   Motion: reveals, words, thread, lumen, sparkles, transitions
   ========================================================== */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: vtOut .4s ease both; }
::view-transition-new(root) { animation: vtIn .7s ease both; }
@keyframes vtOut { to { opacity: 0; filter: blur(4px); } }
@keyframes vtIn { from { opacity: 0; filter: blur(6px); } }
[data-depth] { translate: 0 var(--py, 0px); }
.js [data-r] { opacity: 0; transform: translateY(26px); filter: blur(8px); transition: opacity 1s ease, transform 1.1s cubic-bezier(.2,.8,.2,1), filter 1s ease; transition-delay: var(--d, 0ms); }
.js [data-r].is-in { opacity: 1; transform: none; filter: none; }
.js .rule[data-r]::before { transform-origin: right; } .js .rule[data-r]::after { transform-origin: left; }
.js .rule[data-r]::before, .js .rule[data-r]::after { transform: scaleX(0); transition: transform 1.4s cubic-bezier(.2,.8,.2,1) calc(var(--d, 0ms) + .2s); }
.js .rule[data-r].is-in::before, .js .rule[data-r].is-in::after { transform: scaleX(1); }
.js .words .w { display: inline-block; opacity: 0; filter: blur(14px); transform: translateY(.35em) scale(1.04); letter-spacing: .1em;
  transition: opacity 1.5s ease, filter 1.6s ease, transform 1.8s cubic-bezier(.2,.8,.2,1), letter-spacing 2s cubic-bezier(.2,.8,.2,1); transition-delay: calc(var(--w, 0) * 120ms + var(--wd, 0ms)); }
.js .words.is-in .w { opacity: 1; filter: blur(0); transform: none; letter-spacing: normal; }
.js .panel h1 .script.w, .js .panel h2 .script.w { display: block; }
.js .words .w.honeyed { display: inline-block; }
.shimmer { background: linear-gradient(100deg, #b8862f 0%, #e8c27a 28%, #fff1cf 40%, #e8c27a 52%, #c8963e 75%, #b8862f 100%); background-size: 250% 100%; -webkit-background-clip: text; background-clip: text; color: transparent !important; animation: shimmer 7s ease-in-out infinite; padding: 0 .14em .14em 0; margin-right: -.14em; }
@keyframes shimmer { 0%, 100% { background-position: 100% 0; } 50% { background-position: 0% 0; } }
.thread { position: fixed; left: calc(var(--frame) + 6px); top: 18vh; height: 64vh; width: 30px; z-index: 35; pointer-events: none; opacity: .75; }
.thread svg { width: 100%; height: 100%; overflow: visible; }
.thread path { fill: none; stroke: var(--honey); stroke-width: 1.2; vector-effect: non-scaling-stroke; }
.thread__ghost { opacity: .18; }
.thread__line { stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--tp, 0)); filter: drop-shadow(0 0 3px rgba(232,194,122,.8)); }
.thread__bee { position: absolute; left: var(--bx, 50%); top: var(--by, 0%); width: 17px; height: 17px; transform: translate(-50%, -50%) rotate(var(--br, 180deg)); color: var(--honey); filter: drop-shadow(0 0 5px rgba(255,210,140,.9)); }
.thread__bee .bee { width: 17px; height: 17px; color: inherit; animation: flutter .12s linear infinite alternate; }
.lumen { position: fixed; left: 0; top: 0; width: 520px; height: 520px; margin: -260px 0 0 -260px; z-index: 4; pointer-events: none; border-radius: 50%; background: radial-gradient(circle, rgba(255,214,150,.13), rgba(255,200,130,.05) 40%, transparent 68%); mix-blend-mode: screen; opacity: 0; transition: opacity .8s; transform: translate(var(--lx, -999px), var(--ly, -999px)); }
.lumen.on { opacity: 1; }
.spark { position: fixed; z-index: 70; pointer-events: none; left: 0; top: 0; width: var(--s, 6px); height: var(--s, 6px); border-radius: 50%; background: radial-gradient(circle, #fff7df 0%, #f2d38f 40%, rgba(200,150,62,0) 72%); animation: spark var(--t, 900ms) cubic-bezier(.15,.7,.3,1) forwards; }
.spark.star { border-radius: 0; background: #ffe9b8; clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%); filter: drop-shadow(0 0 4px #f5cf85); }
@keyframes spark { from { transform: translate(-50%, -50%) scale(1); opacity: 1; } to { transform: translate(calc(-50% + var(--dx, 0px)), calc(-50% + var(--dy, -30px))) scale(0) rotate(var(--rot, 90deg)); opacity: 0; } }
.logo .bee { transition: transform .5s cubic-bezier(.3,1.6,.5,1); }
.logo:hover .bee { transform: rotate(-18deg) translateY(-3px) scale(1.15); }

/* ==========================================================
   RESPONSIVE
   ========================================================== */
@media (min-width: 1600px) { .panel h1 { font-size: 5rem; } .panel__inner { max-width: 640px; } }
@media (max-width: 1240px) {
  .nav { gap: 16px; } .nav a { font-size: .95rem; }
  .arch__label { font-size: .78rem; letter-spacing: .08em; } .arch__label .bee { display: none; }
  .bed { grid-template-columns: 190px 1fr; }
  .bed__meta { grid-column: 1 / -1; border-left: 0; padding-left: 0; border-top: 1px dotted rgba(200,120,50,.7); padding-top: 22px; }
}
@media (max-width: 1100px) {
  .nav-toggle { display: block; position: relative; z-index: 3; }
  .nav { position: fixed; inset: 0; z-index: 2; flex-direction: column; justify-content: center; gap: 22px; background: radial-gradient(ellipse at 50% 30%, #3a4a30, var(--green) 70%); color: var(--text-light); opacity: 0; pointer-events: none; transition: opacity .35s; border-radius: 18px; }
  .nav.is-open { opacity: 1; pointer-events: auto; }
  .nav a { font-size: 1.55rem; opacity: 0; transform: translateY(14px); transition: opacity .5s, transform .6s cubic-bezier(.2,.8,.2,1); transition-delay: calc(var(--i, 0) * 70ms + .1s); }
  .nav.is-open a { opacity: 1; transform: none; }
  .site-header.nav-open { color: var(--text-light); }
  .split, .request { grid-template-columns: 1fr; }
  .split__media, .split--right .split__media { order: 0; position: relative; height: 62svh; -webkit-mask-image: linear-gradient(180deg, #000 60%, transparent); mask-image: linear-gradient(180deg, #000 60%, transparent); }
  .split__body, .split--left .split__body { padding: 20px var(--gutter) 90px calc(var(--gutter) + 46px); margin-top: -60px; }
  .split--left .split__body { padding-right: calc(var(--gutter) + 40px); padding-left: var(--gutter); }
  .botanical--edge { top: 40px; height: min(calc(100% - 120px), 700px); opacity: .6; }
  .faq-page { grid-template-columns: 1fr; padding-top: 120px; }
  .faq-page__media { position: relative; top: 0; max-width: 520px; }
  .request__intro-copy { position: relative; margin: 0; max-width: none; padding-top: 130px; }
  .request__form { padding: 60px var(--gutter) 80px; }
  .botanical--form { display: none; }
  .thread { display: none; }
}
@media (min-width: 641px) and (max-width: 960px) {
  .arches { display: flex; flex-wrap: wrap; justify-content: center; gap: 28px 20px; }
  .arches li { width: calc(25% - 15px); }
  .arch__label { font-size: .9rem; }
  .offer-row { grid-template-columns: 1fr 1fr; }
  .offer:last-child { grid-column: 1 / -1; max-width: 420px; margin-inline: auto; }
}
@media (max-width: 640px) {
  :root { --frame: 6px; }
  .frame { border-radius: 12px; }
  .site-header { border-radius: 12px 12px 0 0; }
  .bar { padding: 12px 16px; }
  .logo { font-size: 1.05rem; } .logo .script { font-size: 1.9rem; }
  .hero-drips { left: auto; right: 34%; width: 70px; }
  .panel { align-items: flex-end; padding: 110px 0 12vh; }
  .panel--cherish { align-items: center; }
  .panel__inner { margin-left: var(--gutter); }
  .stage__img { object-position: 64% 20%; }
  .stage::before { background: linear-gradient(0deg, rgba(22,26,16,.95) 0%, rgba(22,26,16,.72) 50%, rgba(22,26,16,.15) 80%); }
  .botanical--hero { height: 44vh; opacity: .45; }
  .beds-intro { margin-left: 0; }
  .arches { display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 40%; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-left: var(--gutter); margin: 36px calc(var(--gutter) * -1) 0; padding: 14px var(--gutter) 16px; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 var(--gutter), #000 calc(100% - 36px), transparent); mask-image: linear-gradient(90deg, transparent 0, #000 var(--gutter), #000 calc(100% - 36px), transparent); }
  .arches::-webkit-scrollbar { display: none; }
  .arches li { scroll-snap-align: start; }
  .arch__label { font-size: .85rem; }
  .swipe-hint { display: block; text-align: right; font-style: italic; color: var(--muted-light); font-size: .95rem; margin: 4px 0 0; animation: nudge 2.4s ease-in-out infinite; }
  @keyframes nudge { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(-8px); } }
  .drawer__card { padding: 30px 20px 22px; border-radius: 18px; }
  .drawer__notch { display: none; }
  .bed { grid-template-columns: 92px 1fr; gap: 18px; }
  .bed h3 { font-size: 1.9rem; }
  .bed .tagline { font-size: 1.5rem; }
  .bed__main { grid-column: 2; }
  .facets div { grid-template-columns: 1fr; gap: 4px; }
  .includes { justify-content: flex-start; gap: 8px 16px; }
  .drawer__nav .drawer__foot { display: none; }
  .drawer__step { flex: 1; }
  .row { grid-template-columns: 1fr; }
  .offer-row { grid-template-columns: 1fr; max-width: 420px; }
  .promises { flex-direction: column; align-items: center; }
  .promises li + li { border-left: 0; border-top: 1px solid var(--line); }
  .botanical--corner { height: 36vh; opacity: .35; }
  .faq-page { padding-inline: var(--gutter); }
  .faq-page__media { padding-left: 34px; }
  .qa summary { font-size: 1.1rem; padding-right: 46px; }
  .qa__a { padding-left: 14px; margin: 0 12px; }
  .footer-grid { grid-template-columns: 1fr; }
  .split__body { padding-left: calc(var(--gutter) + 30px); }
  .indent, .indent--2 { padding-left: 1em; }
}
@media (max-height: 540px) and (orientation: landscape) {
  .panel { min-height: auto; padding: 110px 0 60px; }
  .split__media { height: 100svh; }
}
@media (hover: none) { .lumen { display: none; } .arch:hover .arch__frame, .arch:hover img { transform: none; } }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .js [data-r], .js .words .w { opacity: 1 !important; transform: none !important; filter: none !important; letter-spacing: normal !important; }
  .js .rule[data-r]::before, .js .rule[data-r]::after { transform: none !important; }
  .js .botanical { clip-path: none !important; }
  .flyer, .fx-dust, .spark, .swipe-hint, .lumen, .thread__bee, .honey i::before, .hero-drips i::before { display: none !important; }
  .honey i, .hero-drips i { height: var(--h) !important; }
  [data-depth], .arch, .v1, .v3, .stage .mist, [data-fade] { translate: none !important; }
  [data-fade] { opacity: 1 !important; filter: none !important; }
  .stage__img { filter: brightness(.8) !important; transform: none !important; }
}

/* Glassy drips poured over each page title: the "you are here" honey */
.honeyed .title-drips { position: absolute; top: -.08em; left: 16%; width: 1.7em; height: auto; overflow: visible; pointer-events: none; z-index: 2;
  clip-path: inset(0 0 100% 0); animation: honeyFlow 3.4s cubic-bezier(.55,0,.2,1) 1.5s forwards; filter: drop-shadow(0 2px 3px rgba(60,30,0,.35)); }
.title-drips .hd-drop { animation-name: tdFall; }
@keyframes tdFall { 0%, 70% { opacity: 0; transform: translateY(-3px) scale(.5); } 73% { opacity: 1; transform: translateY(0) scale(1); } 96% { opacity: .9; transform: translateY(130px) scale(1, 1.15); } 100% { opacity: 0; transform: translateY(136px) scale(1.3, .5); } }
.field .chip { padding: 8px 16px; margin: 0; }
.split--left .split__body { padding-right: clamp(120px, 16vw, 260px); }
.request__photo img { filter: brightness(.62) saturate(.95); }
@media (max-width: 1100px) { .split--left .split__body { padding-right: calc(var(--gutter) + 40px); } }
@media (prefers-reduced-motion: reduce) { .honeyed .title-drips, .hero-drips { clip-path: none !important; } .hd-drop { display: none; } }
@media (max-width: 640px) {
  .hero-drips { left: 54%; right: auto; width: 96px; }
  .botanical--edge { opacity: .28; }
  .honeyed .title-drips { width: 1.5em; }
}

/* ==========================================================
   ROUND 4 · background honey, nav contact, mobile doorway explorer
   ========================================================== */
.hero-drips { top: calc(var(--frame) - 1px); }
.honey-veil { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; opacity: .75; }
.honey-edge { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 43; pointer-events: none; }
.thread { display: none !important; }

/* footer contact */
.footer-h { font-size: .8rem; letter-spacing: .22em; text-transform: uppercase; color: var(--honey-hi); margin: 4px 0 12px; font-weight: 500; }
.footer-contact { scroll-margin-top: 40px; }
.footer-contact:target { animation: contactGlow 2.4s ease; border-radius: 10px; }
@keyframes contactGlow { 0% { box-shadow: 0 0 0 0 rgba(232,194,122,0); } 30% { box-shadow: 0 0 0 10px rgba(232,194,122,.18); } 100% { box-shadow: 0 0 0 0 rgba(232,194,122,0); } }

/* hint copy by input type */
.hint--tap { display: none; }
@media (hover: none), (max-width: 640px) { .hint--click { display: none; } .hint--tap { display: inline; } }
.door-dots { display: none; }

/* Desktop drawer: the doorways stay where they are while the drawer opens beneath */
.drawer__inner { overflow: clip; }

@media (max-width: 640px) {
  /* one doorway centred, its neighbours peeking in */
  .arches {
    grid-auto-columns: 58%; gap: 16px; scroll-snap-type: x mandatory; scroll-padding-inline: 21%;
    margin: 26px calc(var(--gutter) * -1) 0; padding: 22px 21% 10px;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent 0, #000 12%, #000 88%, transparent);
    overscroll-behavior-x: contain;
  }
  .arches li { scroll-snap-align: center; scroll-snap-stop: always; }
  .arch { translate: none !important; gap: 12px; }
  .arch__frame { transform: scale(.9); opacity: .6; transition: transform .5s cubic-bezier(.2,.8,.2,1), opacity .5s, box-shadow .5s; }
  .arches li.is-centred .arch__frame { transform: scale(1); opacity: 1; }
  .arch[aria-expanded="true"] .arch__frame { transform: scale(1) translateY(-4px); opacity: 1; }
  .arch:hover .arch__frame { transform: scale(.9); }
  .arches li.is-centred .arch:hover .arch__frame { transform: scale(1); }
  .arch__label { font-size: .95rem; letter-spacing: .14em; opacity: .7; transition: opacity .4s; }
  .arches li.is-centred .arch__label { opacity: 1; }
  .arch__label .bee { display: inline-block; }
  .swipe-hint { display: none !important; }
  .door-dots { display: flex; justify-content: center; gap: 10px; margin: 6px 0 0; }
  .door-dots span { width: 7px; height: 7px; border-radius: 50%; border: 1px solid var(--honey); transition: background .4s, transform .4s; }
  .door-dots span.on { background: var(--honey); transform: scale(1.25); }
  .door-dots span.open { box-shadow: 0 0 8px rgba(232,194,122,.8); }

  /* the drawer: the big doorway above already shows the room, so the text gets the full width */
  .drawer__card { margin-top: 26px; padding: 26px 20px 0; }
  .drawer__inner { padding-top: 0; margin-top: 0; }
  .bed { display: none; grid-template-columns: 1fr; gap: 0; }
  .bed.is-active { display: block; }
  .bed__img { display: none; }
  .bed h3 { font-size: 2rem; padding-right: 40px; }
  .bed .tagline { font-size: 1.55rem; }
  .bed__meta { border: 0; border-top: 1px dotted rgba(200,120,50,.7); padding: 20px 0 0; margin-top: 22px; }
  .bed__meta h4 { text-align: left; }
  .includes { justify-content: flex-start; }
  .facets div { grid-template-columns: 1fr; gap: 2px; padding: 12px 0; }
  .facets dt { font-size: 1.12rem; }
  .ico { width: 28px; height: 28px; }
  .drawer__close { top: 10px; right: 8px; }
  /* Previous / Next stay within thumb reach while you read */
  .drawer__nav { position: sticky; bottom: 0; z-index: 4; margin: 20px -20px 0; padding: 12px 14px calc(14px + env(safe-area-inset-bottom)); background: linear-gradient(0deg, var(--parchment) 70%, rgba(244,232,214,0)); border-radius: 0 0 18px 18px; }
  .drawer__step { flex: 1; font-size: 1rem; }
  .panel--beds { padding-bottom: 70px; }
}
@media (max-width: 640px) {
  /* the row spans the full screen, so size it in vw: every doorway, including the first and last, can sit dead centre */
  .arches { grid-auto-columns: 58vw; padding-inline: 21vw; scroll-padding-inline: 0; }
  .hero-drips { left: 55%; width: 72px; }
  /* on a phone the words run full width, so the hanging honey belongs to the opening moment only */
  .stage .hero-drips, .stage .honey-veil { opacity: calc(1 - var(--p) * 2.2); }
}
/* her frame drips belong to the opening and to Cherishing (screens 01-02), not over the Beds (screen 03) */
.stage .hero-drips { opacity: clamp(0, calc((1 - var(--p)) * 3), 1); }

/* ==========================================================
   ROUND 5 · gooey honey, lighter-than-air sparkle
   ========================================================== */
/* motes: fade in softly, drift up with a small sway, dissolve */
.spark { animation: floatUp var(--t, 3600ms) cubic-bezier(.25,.1,.25,1) forwards; opacity: 0;
  background: radial-gradient(circle, rgba(255,247,223,.95) 0%, rgba(242,211,143,.7) 40%, rgba(200,150,62,0) 72%); }
.spark.star { opacity: 0; filter: drop-shadow(0 0 3px rgba(245,207,133,.7)); }
@keyframes floatUp {
  0%   { transform: translate(-50%, -50%) scale(.4); opacity: 0; }
  18%  { opacity: .75; }
  50%  { transform: translate(calc(-50% + var(--dx) * .6 + var(--sw)), calc(-50% + var(--dy) * .5)) scale(1) rotate(calc(var(--rot) * .5)); }
  100% { transform: translate(calc(-50% + var(--dx) - var(--sw)), calc(-50% + var(--dy))) scale(.7) rotate(var(--rot)); opacity: 0; }
}

/* frame honey (01): pours slowly, sags like syrup, and a drop only lets go after it has stretched */
.hero-drips { animation: honeyFlow 7s cubic-bezier(.6,0,.25,1) .6s forwards; }
.honeyed .title-drips { animation: honeyFlow 6s cubic-bezier(.6,0,.25,1) 1.4s forwards; }
.hd-drip { animation: sagSvg 9s cubic-bezier(.45,0,.55,1) infinite alternate; animation-delay: calc(7s + var(--k) * 2s); }
@keyframes sagSvg { from { transform: scaleY(1) scaleX(1); } to { transform: scaleY(1.16) scaleX(.94); } }
.hd-drop { animation: hdGoo 18s cubic-bezier(.5,0,.5,1) infinite; animation-delay: calc(9s + var(--k) * 5s); }
@keyframes hdGoo {
  0%, 58%  { opacity: 0; transform: translateY(0) scale(.7, .7); }
  62%      { opacity: 1; transform: translateY(2px) scale(1, 1.05); }
  82%      { opacity: 1; transform: translateY(34px) scale(.95, 1.25); }   /* stretching, still attached */
  100%     { opacity: 0; transform: translateY(230px) scale(1, 1.1); }
}
.title-drips .hd-drop { animation-name: tdGoo; animation-duration: 16s; }
@keyframes tdGoo {
  0%, 58%  { opacity: 0; transform: translateY(0) scale(.7); }
  62%      { opacity: 1; transform: translateY(1px) scale(1, 1.05); }
  84%      { opacity: 1; transform: translateY(16px) scale(.95, 1.22); }
  100%     { opacity: 0; transform: translateY(90px) scale(1, 1.1); }
}
/* nav "you are here" honey: slower, thicker */
.honey i { animation: dripGrow 4.5s cubic-bezier(.6,0,.3,1) calc(var(--d) + var(--pour, .2s) + .6s) both, sag 7s ease-in-out calc(var(--d) + var(--pour, .2s) + 5s) infinite alternate; }
.honey i::before { animation: fall 14s cubic-bezier(.6,0,.9,.5) calc(var(--d) * 3 + 7s) infinite; }
@media (max-width: 640px) {
  /* plain, predictable swiping: flick freely, settle on the nearest doorway */
  .arches li { scroll-snap-stop: normal; }
  .arches { -webkit-mask-image: none; mask-image: none; touch-action: pan-x pan-y; }
  .arch { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
}
/* golden, glassy honey everywhere (after the references Poppe shared) */
.honey__band { background: linear-gradient(180deg, #ffe28a 0%, #f6b21c 45%, #c77a00 100%); box-shadow: 0 1px 2px rgba(120,70,0,.35), inset 0 1px 0 rgba(255,250,225,.9); }
.honey i { background: linear-gradient(90deg, #b56a00 0%, #f0a50a 25%, #ffe289 45%, #f6b21c 65%, #a95f00 100%); }
.honey i::after { background: radial-gradient(circle at 34% 30%, #fffbe0 0%, #ffe07a 22%, #f5ad14 55%, #9a5500 100%); }
.honey i::before { background: radial-gradient(circle at 35% 30%, #fffbe0, #f5ad14 50%, #b56a00); }
.hero-drips { filter: drop-shadow(0 3px 5px rgba(60,30,0,.35)) drop-shadow(0 0 12px rgba(255,200,80,.3)); width: clamp(150px, 12vw, 210px); }
.honeyed .title-drips { width: 1.6em; top: -.12em; }
/* let the tapered coating ends show past the drawing's edges */
.hero-drips, .honeyed .title-drips { clip-path: inset(0 -12% 100% -12%); animation-name: honeyFlowWide; }
@keyframes honeyFlowWide { to { clip-path: inset(0 -12% -60% -12%); } }
@media (prefers-reduced-motion: reduce) { .hero-drips, .honeyed .title-drips { clip-path: none !important; } }

/* ==========================================================
   ROUND 7 · phones: the Seven Beds as a list of doorways that open in place
   ========================================================== */
.arch__text { display: contents; }
.arch__tag, .beds-foot { display: none; }

@media (max-width: 640px) {
  .arches { display: flex; flex-direction: column; gap: 12px; overflow: visible; margin: 26px 0 0; padding: 0;
    -webkit-mask-image: none; mask-image: none; scroll-snap-type: none; }
  .arches li { width: auto; scroll-snap-align: none; }
  .arch { flex-direction: row; align-items: center; gap: 16px; padding: 10px 44px 10px 10px; perspective: none; translate: none !important;
    border: 1px solid rgba(200,150,62,.45); border-radius: 16px; background: rgba(24,30,19,.72); position: relative; transition: border-color .4s, background .4s; }
  .arch::before { display: none; }
  .arch::after { content: "+"; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); color: var(--honey); font-size: 1.6rem; font-weight: 300; }
  .arch[aria-expanded="true"] { border-color: var(--honey); background: rgba(44,52,33,.9); }
  .arch[aria-expanded="true"]::after { content: "\2212"; }
  .arch__frame, .arches li .arch__frame, .arches li.is-centred .arch__frame, .arch:hover .arch__frame, .arch[aria-expanded="true"] .arch__frame {
    width: 62px; flex: none; transform: none !important; opacity: 1 !important; padding: 3px; box-shadow: none; }
  .arch__frame::after { display: none; }
  .arch__text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
  .arch__label, .arches li .arch__label { font-size: 1.05rem; letter-spacing: .16em; opacity: 1; justify-content: flex-start; }
  .arch__label .bee { display: none; }
  .arch[aria-expanded="true"] .arch__label { text-decoration: none; color: var(--honey-hi); }
  .arch__tag { display: block; font-family: var(--script); color: var(--muted-light); font-size: 1.25rem; line-height: 1.2; white-space: normal; }
  .door-dots, .swipe-hint, .drawer__notch, .drawer__nav { display: none !important; }
  .beds-foot { display: flex; align-items: center; gap: 10px; margin: 22px 0 0; font-style: italic; color: var(--muted-light); }

  /* the room: plain show/hide, no animated clipping */
  .drawer { display: none; transition: none; }
  .drawer.is-open { display: block; }
  .drawer__inner { overflow: visible; padding: 0; margin: 0; }
  .drawer__card { margin: 10px 0 6px; padding: 22px 18px 20px; border-radius: 16px; box-shadow: 0 14px 30px rgba(0,0,0,.35); }
  .bed h3 { display: none; }            /* the name is already on the doorway above */
  .bed .tagline { display: none; }
  .bed__main p:first-of-type { font-size: 1.2em; font-style: italic; }
  .drawer__close { display: none; }
}

/* ==========================================================
   Phones & tablets: lighter effects so every part of the page paints
   (large blurs, blend modes and backdrop filters exhaust mobile graphics memory)
   ========================================================== */
@media (max-width: 960px), (hover: none) {
  .veils, .rays, .aurora, .glow, .lumen, .mist, .flyer { display: none !important; }
  .stage__media { animation: none; }
  .stage__img { filter: none !important; transform: none !important; }
  .stage::after { background: rgba(28,34,22, calc(var(--p) * .45)); }
  [data-fade] { filter: none !important; }
  .js [data-r], .js .words .w, .bed.is-active > *, .bed.is-active .includes li { filter: none !important; }
  .site-header::before { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  .theme-dark .site-header::before { background: rgba(33,42,27,.96); }
  .theme-light .site-header::before { background: rgba(244,232,214,.97); }
  .split__media { -webkit-mask-image: linear-gradient(180deg, #000 60%, transparent) !important; mask-image: linear-gradient(180deg, #000 60%, transparent) !important; }
  .shimmer { animation: none; }
  .botanical { animation: none; }
  .arch__frame img, .offer__img img { transition: none; }
}
@media (max-width: 640px) { .arches, .arches * { overflow-anchor: none; } }
@media (max-width: 640px) { .arch { box-sizing: border-box; width: 100%; } .arches li { min-width: 0; } }

/* ==========================================================
   ROUND 8 · the doorway opens
   Carved doors swing apart on golden light and the room glows into view.
   Transforms and opacity only, so phones paint it reliably.
   ========================================================== */
.portal { position: relative; perspective: 900px; isolation: isolate; }
.portal img { position: relative; z-index: 0; }
.bed.is-active .portal img { animation: roomIn 2.2s cubic-bezier(.2,.7,.2,1) both !important; filter: none !important; }
@keyframes roomIn { 0% { transform: scale(1.18); opacity: .35; } 35% { opacity: .55; } 100% { transform: scale(1); opacity: 1; } }

/* warm light pouring through the opening */
.portal__glow { position: absolute; inset: 4px; z-index: 1; border-radius: 999px 999px 3px 3px; pointer-events: none;
  background: radial-gradient(ellipse 60% 70% at 50% 55%, rgba(255,236,180,.95), rgba(255,196,90,.55) 40%, rgba(255,170,60,0) 75%); opacity: 0; }
.bed.is-active .portal__glow { animation: glowPour 2.6s ease-out .35s both; }
@keyframes glowPour { 0% { opacity: 0; transform: scaleX(.05); } 25% { opacity: 1; transform: scaleX(.6); } 55% { opacity: .9; transform: scaleX(1); } 100% { opacity: 0; transform: scaleX(1.1); } }

/* the line of light at the seam before the doors part */
.portal__seam { position: absolute; left: 50%; top: 6%; bottom: 4px; width: 2px; margin-left: -1px; z-index: 3; pointer-events: none;
  background: linear-gradient(180deg, transparent, #fff3c8 20%, #ffd76e 60%, transparent); box-shadow: 0 0 10px 3px rgba(255,210,120,.8); opacity: 0; }
.bed.is-active .portal__seam { animation: seam 1.1s ease-out .1s both; }
@keyframes seam { 0% { opacity: 0; transform: scaleY(.2); } 40% { opacity: 1; transform: scaleY(1); } 70% { opacity: 1; } 100% { opacity: 0; } }

/* the two carved doors */
.door { position: absolute; top: 4px; bottom: 4px; width: calc(50% - 4px); z-index: 2; pointer-events: none; backface-visibility: hidden;
  background:
    radial-gradient(circle at var(--kx) 56%, #ffe7a6 0 2.2px, #c8963e 2.3px 3.4px, transparent 3.5px),
    linear-gradient(180deg, rgba(255,255,255,.05), transparent 30%),
    repeating-linear-gradient(90deg, rgba(0,0,0,.08) 0 1px, transparent 1px 7px),
    linear-gradient(90deg, #2e3c25, #22301c);
  box-shadow: inset 0 0 0 1px rgba(232,194,122,.8), inset 0 0 0 7px rgba(34,46,28,.9), inset 0 0 0 8px rgba(200,150,62,.55); }
.door--l { left: 4px; border-radius: 999px 0 0 3px / 999px 0 0 3px; transform-origin: left center; --kx: 86%; }
.door--r { right: 4px; border-radius: 0 999px 3px 0 / 0 999px 3px 0; transform-origin: right center; --kx: 14%; }
.bed.is-active .door--l { animation: doorL 1.7s cubic-bezier(.55,.05,.2,1) .45s both; }
.bed.is-active .door--r { animation: doorR 1.7s cubic-bezier(.55,.05,.2,1) .5s both; }
@keyframes doorL { 0% { transform: rotateY(0); } 12% { transform: rotateY(6deg); } 75% { opacity: 1; } 100% { transform: rotateY(-108deg); opacity: 0; } }
@keyframes doorR { 0% { transform: rotateY(0); } 12% { transform: rotateY(-6deg); } 75% { opacity: 1; } 100% { transform: rotateY(108deg); opacity: 0; } }
/* doors swing shut when a room is closed on a phone */
.bed.is-closing .door { animation: none !important; transition: transform .45s cubic-bezier(.4,0,.6,1), opacity .2s; opacity: 1; transform: rotateY(0) !important; }
.bed.is-closing .portal__glow, .bed.is-closing .portal__seam { animation: none !important; opacity: 0; }

/* words arrive once the doors have opened */
.bed.is-active > .bed__main { animation-delay: .9s !important; }
.bed.is-active > .bed__meta { animation-delay: 1.15s !important; }
.bed.is-active .includes li { animation-delay: calc(1.3s + var(--i, 0) * 80ms) !important; }

@media (max-width: 640px) {
  /* the doorway leads the room on phones */
  .bed__img, .bed__img.portal { display: block !important; width: 64%; max-width: 250px; margin: 2px auto 22px; }
  .drawer__card { padding-top: 24px; }
  .bed__main p:first-of-type { text-align: center; }
  .bed__cta { display: flex; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
  .door, .portal__glow, .portal__seam { display: none !important; }
}

/* ==========================================================
   ROUND 9 · brought back in line with the style guide
   ========================================================== */
/* gold "warm and honeyed rather than metallic-yellow or flashy": a slow, low-contrast glow */
.shimmer { background: linear-gradient(100deg, #c08a36 0%, #d8a855 35%, #ecc987 50%, #d8a855 65%, #c08a36 100%);
  background-size: 220% 100%; -webkit-background-clip: text; background-clip: text; animation-duration: 16s; }
/* bees as the only small ornaments */
.bee-orn { font-size: .9em; color: var(--honey); opacity: .9; }
.qa__bloom { width: 22px; height: 22px; color: #c8782f; transition: transform .6s cubic-bezier(.2,.8,.2,1); }
.qa[open] .qa__bloom { rotate: 0deg; transform: scale(1.15); }
.qa-group__title .bee-orn { font-size: 1.1rem; }
.deeper a { gap: 8px; }

/* ==========================================================
   ROUND 10 · honeycomb cursor, room CTA, steady door opening
   ========================================================== */
.bed__book { margin-top: 14px; padding: 15px 26px; font-size: .86rem; }
@media (max-width: 640px) { .bed__book { display: flex; justify-content: center; width: 100%; margin: 8px 0 4px; } }

/* ==========================================================
   ROUND 11 · the whimsical, ethereal phone experience
   Everything here moves with transform / opacity only.
   ========================================================== */

/* 1 · each room has its own light */
#bed-honey     { --room: 255, 206, 120; }
#bed-sanctuary { --room: 255, 236, 205; }
#bed-hearth    { --room: 255, 150, 70; }
#bed-sea       { --room: 130, 170, 255; }
#bed-ember     { --room: 255, 120, 140; }
#bed-oracle    { --room: 190, 160, 255; }
#bed-adornment { --room: 255, 190, 205; }
.bed .portal__glow { background: radial-gradient(ellipse 60% 70% at 50% 55%, rgba(255,250,235,.95), rgba(var(--room), .75) 38%, rgba(var(--room), 0) 75%); }
.bed .portal__seam { background: linear-gradient(180deg, transparent, #fffaf0 20%, rgb(var(--room)) 60%, transparent); box-shadow: 0 0 12px 3px rgba(var(--room), .85); }
.room-tint { position: fixed; inset: 0; z-index: 38; pointer-events: none; opacity: 0; transition: opacity 1.6s ease, background 1.2s ease;
  background: radial-gradient(ellipse 90% 70% at 50% 60%, rgba(var(--room-now, 255,206,120), .16), rgba(var(--room-now, 255,206,120), .05) 60%, transparent 85%); }
body.room-open .room-tint { opacity: 1; }

/* 4 · deeper means warmer: dusk at the top, candlelight by the Beds (home page) */
.depth-light { position: fixed; inset: 0; z-index: 37; pointer-events: none; }
.depth-light span { position: absolute; inset: 0; }
.depth-light .dusk { background: linear-gradient(180deg, rgba(70,82,130,.16), rgba(70,82,130,.06) 60%, transparent); opacity: calc(1 - var(--deep, 0)); }
.depth-light .candle { background: radial-gradient(ellipse 110% 80% at 50% 100%, rgba(255,160,60,.16), rgba(255,160,60,.04) 60%, transparent); opacity: var(--deep, 0); }

/* 2 · the room tilts with the phone (--tx / --ty from the gyroscope, -1..1) */
@media (hover: none) {
  .fx-dust { translate: calc(var(--tx, 0) * 14px) calc(var(--ty, 0) * 10px); }
  .botanical { translate: calc(var(--tx, 0) * -7px) calc(var(--ty, 0) * -5px); }
  .stage__media { translate: calc(var(--tx, 0) * 6px) calc(var(--ty, 0) * 5px); inset: -14px; }
  .honey-veil { translate: calc(var(--tx, 0) * 3px) 0; }
  .arch__frame img { translate: calc(var(--tx, 0) * 3px) calc(var(--ty, 0) * 2px); scale: 1.06; }
}

/* 3 · honey where your finger lands */
.tap-bead { position: fixed; left: 0; top: 0; width: 12px; height: 13px; margin: -6px 0 0 -6px; z-index: 95; pointer-events: none;
  border-radius: 50% 50% 50% 50% / 44% 44% 56% 56%;
  background: radial-gradient(circle at 50% 55%, rgba(150,80,0,.25), rgba(214,132,12,.42) 55%, rgba(255,198,82,.92) 86%, rgba(255,226,150,.95));
  box-shadow: 0 0 8px rgba(255,190,80,.35);
  animation: tapBead 1.9s cubic-bezier(.45,0,.3,1) forwards; }
.tap-bead::after { content: ""; position: absolute; left: 22%; top: 18%; width: 28%; height: 32%; border-radius: 50%; background: rgba(255,255,248,.9); }
@keyframes tapBead {
  0%   { transform: translate(var(--x), var(--y)) scale(.2); opacity: 0; }
  14%  { transform: translate(var(--x), var(--y)) scale(1.05); opacity: 1; }
  40%  { transform: translate(var(--x), calc(var(--y) + 4px)) scale(.95, 1.12); opacity: 1; }
  100% { transform: translate(var(--x), calc(var(--y) + 34px)) scale(.8, 1.3); opacity: 0; }
}

/* 5 · botanicals grow as you scroll (phones: driven by scroll, set inline by JS) */

/* 6 · the phone menu unveils like a sheer curtain drawing back */
.nav-bot { display: none; }
@media (max-width: 1100px) {
  .nav { overflow: hidden; }
  .nav::before, .nav::after { content: ""; position: absolute; top: 0; bottom: 0; width: 52%; z-index: 5; pointer-events: none;
    background: repeating-linear-gradient(90deg, rgba(255,240,215,.0) 0 14px, rgba(255,240,215,.1) 20px, rgba(255,240,215,0) 32px),
                linear-gradient(90deg, rgba(247,230,205,.28), rgba(247,230,205,.14));
    transition: transform 1.1s cubic-bezier(.6,.05,.25,1) .05s, opacity 1.1s ease .2s; }
  .nav::before { left: 0; transform-origin: left; }
  .nav::after { right: 0; transform-origin: right; transform: scaleX(-1); }
  .nav.is-open::before { transform: translateX(-92%) skewX(-3deg); opacity: .5; }
  .nav.is-open::after { transform: scaleX(-1) translateX(-92%) skewX(-3deg); opacity: .5; }
  .nav-bot { display: block; position: absolute; bottom: -10px; height: 58vh; width: auto; max-width: none; opacity: 0; z-index: 1;
    transform: translateY(40px); transition: opacity 1.4s ease .35s, transform 1.8s cubic-bezier(.2,.8,.2,1) .35s; pointer-events: none; }
  .nav-bot--l { left: 8px; }
  .nav-bot--r { right: 8px; height: 46vh; }
  .nav.is-open .nav-bot { opacity: .55; transform: none; }
  .nav a { position: relative; z-index: 6; }
}

/* 8 · pages dim like a candle and brighten on the next one */
::view-transition-old(root) { animation: candleOut .5s ease-in both; }
::view-transition-new(root) { animation: candleIn .9s ease-out both; }
@keyframes candleOut { 0% { opacity: 1; filter: brightness(1); } 40% { filter: brightness(.8) sepia(.3); } 55% { filter: brightness(.9) sepia(.3); } 100% { opacity: 0; filter: brightness(.35) sepia(.5); } }
@keyframes candleIn { 0% { opacity: 0; filter: brightness(.35) sepia(.5); } 60% { opacity: 1; filter: brightness(.95) sepia(.1); } 100% { filter: none; } }
.candle-veil { position: fixed; inset: 0; z-index: 200; pointer-events: none; background: #1b140b; opacity: 0; transition: opacity .45s ease-in; }
.candle-veil.on { opacity: .92; }
.candle-veil.lift { opacity: 0; transition: opacity .9s ease-out; }

/* 9 · a quiet invitation within thumb reach */
.thumb-cta { display: none; }
@media (max-width: 960px) {
  .thumb-cta { display: inline-flex; align-items: center; gap: .6em; position: fixed; left: 50%; bottom: calc(18px + env(safe-area-inset-bottom)); z-index: 41;
    transform: translate(-50%, 30px); opacity: 0; pointer-events: none;
    padding: 12px 22px; border-radius: 999px; text-decoration: none; font-size: .95rem; letter-spacing: .08em;
    color: #fffaf0; background: rgba(38,48,31,.94); border: 1px solid rgba(232,194,122,.8);
    box-shadow: 0 10px 26px rgba(0,0,0,.35), 0 0 18px rgba(232,194,122,.18);
    transition: opacity .7s ease, transform .8s cubic-bezier(.2,.8,.2,1); }
  .thumb-cta .bee { color: var(--honey-hi); }
  .thumb-cta.show { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .tap-bead, .nav::before, .nav::after { display: none !important; }
  .nav-bot { transition: none !important; }
  .fx-dust, .botanical, .stage__media, .honey-veil, .arch__frame img { translate: none !important; }
}
@media (max-width: 640px) { .panel--beds { padding-bottom: 120px; } }
/* phones: one of her botanicals climbs from the bottom-left corner as you read */
@media (hover: none) {
  .botanical.botanical--vine { position: fixed; top: auto; bottom: calc(var(--frame) + 2px); left: calc(var(--frame) + 2px); right: auto;
    height: 52vh; width: auto; max-width: none; opacity: .62; z-index: 36; transform: none; rotate: none; animation: none;
    filter: none; }
  .theme-light .botanical.botanical--vine { filter: brightness(.82) saturate(1.1); }
  .stage .botanical.botanical--vine { position: absolute; }
}

/* ==========================================================
   ROUND 12 · the middle path: a glimpse on the home page, a room of its own
   ========================================================== */
/* home drawer: a glimpse */
.bed--glimpse { grid-template-columns: minmax(170px, 230px) minmax(0, 1fr); max-width: 900px; margin-inline: auto; }
.bed--glimpse .facets { margin: 18px 0 6px; }
.bed--glimpse .facets div { grid-template-columns: 8em 1fr; border-bottom: 1px dotted rgba(200,120,50,.55); }
.bed__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 26px; margin-top: 22px; }
.bed__actions .btn-honey { padding: 15px 26px; font-size: .86rem; }
.bed.is-active .bed__actions { animation: unfold .8s cubic-bezier(.2,.8,.2,1) 1.2s both; }
@media (max-width: 640px) {
  .bed--glimpse .facets div { grid-template-columns: 1fr; }
  .bed__actions { flex-direction: column; align-items: stretch; text-align: center; }
  .bed__actions .btn-honey { justify-content: center; }
  .bed__actions .text-link { justify-content: center; }
}

/* a room of its own */
.bedroom { position: relative; overflow: hidden; min-height: 100svh; padding: 130px 0 90px;
  background: radial-gradient(ellipse 70% 50% at 30% 30%, rgba(var(--room), .16), transparent 70%), linear-gradient(180deg, #1f2819, var(--green) 40%, #1c2416); }
.bedroom__glow { position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse 60% 45% at 25% 35%, rgba(var(--room), .22), transparent 70%); animation: roomBreath 9s ease-in-out infinite alternate; }
@keyframes roomBreath { from { opacity: .6; } to { opacity: 1; } }
.bedroom__wrap { position: relative; z-index: 3; max-width: 1180px; }
.bedroom__back { color: var(--muted-light); font-size: 1rem; margin-bottom: 22px; }
.bedroom__back::after { content: none; }
.bedroom__back::before { content: "\27F5"; color: var(--honey); margin-right: 4px; }
.bedroom__card { margin-top: 0 !important; }
.bed--page { display: grid; grid-template-columns: minmax(220px, 300px) minmax(0, 1fr) minmax(0, 1.15fr); }
.bed--page h3 { font-size: clamp(2.6rem, 4vw, 3.6rem); }
.bed--page .bed__book { display: inline-flex; }
.bedroom__foot { text-align: center; font-style: italic; color: var(--muted-light); margin: 30px 0 70px; display: flex; justify-content: center; align-items: center; gap: 12px; }
.other-doors h2 { text-align: center; color: var(--text-light); font-size: clamp(2rem, 3.4vw, 3rem); }
.other-doors h2 .script { display: block; color: var(--honey); font-size: 1.15em; }
.door-links { list-style: none; padding: 0; margin: 34px 0 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: clamp(10px, 1.6vw, 22px); }
.door-link { display: flex; flex-direction: column; align-items: center; gap: 12px; text-decoration: none; color: var(--text-light); }
.door-link .arch__frame { transition: transform .5s cubic-bezier(.2,.8,.2,1), box-shadow .5s; }
.door-link:hover .arch__frame, .door-link:focus-visible .arch__frame { transform: translateY(-6px); box-shadow: 0 0 0 1px var(--honey-hi), 0 0 36px rgba(var(--room), .45); }
.door-link__name { letter-spacing: .14em; text-transform: uppercase; font-size: .88rem; }
@media (max-width: 1240px) { .bed--page { grid-template-columns: 240px minmax(0, 1fr); } .bed--page .bed__meta { grid-column: 1 / -1; } }
@media (max-width: 640px) {
  .bedroom { padding-top: 96px; }
  .bed--page { display: block; }
  .bed--page h3, .bed--page .tagline { display: block !important; text-align: center; }
  .bed--page .tagline { font-size: 1.5rem; }
  .bed--page .bed__img { margin-top: 6px; }
  .bed--page .bed__book { display: flex; }
  .door-links { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 12px; }
  .door-link__name { font-size: .78rem; letter-spacing: .1em; }
  .door-link .arch__frame { width: 100%; }
}

/* title honey: a soft, translucent glaze with a few slow, gooey drips */
.honeyed .title-drips { width: 1.25em; top: -.04em; left: 22%; opacity: .95; filter: none;
  animation: honeyFlowWide 8s cubic-bezier(.6,0,.25,1) 1.6s forwards; }
.title-drips .hd-drip { animation: sagSvg 12s cubic-bezier(.45,0,.55,1) infinite alternate; animation-delay: 8s; }
.title-drips .hd-drop { animation-duration: 22s; }
/* Bed page: image + words side by side, the room's details across the full width below */
.bed--page { grid-template-columns: minmax(220px, 300px) minmax(0, 1fr) !important; }
.bed--page .bed__meta { grid-column: 1 / -1; border-left: 0; padding: 30px 0 0; margin-top: 10px; border-top: 1px dotted rgba(200,120,50,.7); }
.bed--page .facets { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 34px; }
.bed--page .facets div { grid-template-columns: 1fr; gap: 6px; border-top: 0; padding: 8px 0; }
@media (max-width: 800px) { .bed--page .facets { grid-template-columns: 1fr; } .bed--page .facets div { border-top: 1px dotted rgba(200,120,50,.55); } }
.honeyed .title-drips { clip-path: inset(-40% -15% 100% -15%); animation-name: titlePour;
  filter: drop-shadow(0 0 3px rgba(255,178,80,.45)) drop-shadow(0 1px 1px rgba(90,45,0,.25)); }
@keyframes titlePour { to { clip-path: inset(-40% -15% -60% -15%); } }

/* ==========================================================
   ROUND 13 · honey that drips from the bottom of each letter
   ========================================================== */
.honeyed { position: relative; }
.ldrip { position: absolute; pointer-events: none; z-index: 2; }
.ldrip__body { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; transform-origin: 50% 0;
  filter: drop-shadow(0 0 1.5px rgba(255,180,80,.4)) drop-shadow(0 1px 1px rgba(110,60,0,.2));
  clip-path: inset(0 -30% 100% -30%);
  /* first it flows out of the letter; then it lives: swell, stretch, let go, pull back, build up again */
  animation: ldripFlow var(--t) cubic-bezier(.62,0,.28,1) var(--d) forwards,
             ldripLife var(--cycle) cubic-bezier(.45,0,.55,1) calc(var(--d) + var(--t) + var(--cd)) infinite; }
@keyframes ldripFlow { to { clip-path: inset(0 -30% -10% -30%); } }
@keyframes ldripLife {
  0%   { transform: scaleY(.5)  scaleX(1.04); }    /* a small bead after the last drop */
  55%  { transform: scaleY(1)   scaleX(1); }       /* slowly builds back up */
  78%  { transform: scaleY(1.22) scaleX(.95); }    /* heavy, stretching */
  83%  { transform: scaleY(1.3) scaleX(.93); }
  86%  { transform: scaleY(.45) scaleX(1.05); }    /* lets go, springs back */
  92%  { transform: scaleY(.56) scaleX(1.02); }
  100% { transform: scaleY(.5)  scaleX(1.04); }
}
/* the drop that lets go and falls down the page */
.ldrip__drop { position: absolute; margin-left: -.1em; transform: translateX(-10%); opacity: 0;
  border-radius: 50% 50% 50% 50% / 42% 42% 58% 58%;
  background: radial-gradient(circle at 50% 55%, rgba(255,215,140,.3) 0%, rgba(245,166,60,.45) 55%, rgba(255,208,125,.92) 86%, rgba(255,238,190,.95) 100%);
  box-shadow: inset -.012em -.016em 0 -.004em rgba(255,255,248,.8), 0 0 3px rgba(255,180,80,.35);
  animation: ldripFall var(--cycle) cubic-bezier(.45,0,.55,1) calc(var(--d) + var(--t) + var(--cd)) infinite; }
@keyframes ldripFall {
  0%, 82%  { opacity: 0; transform: translateY(0) scale(.8, .9); }
  84%      { opacity: 1; transform: translateY(.06em) scale(1, 1.15); }
  99%      { opacity: 0; transform: translateY(var(--fall)) scale(.9, 1.25); }
  100%     { opacity: 0; transform: translateY(0) scale(.8, .9); }
}
@media (prefers-reduced-motion: reduce) { .ldrip__body, .ldrip__drop { animation: none !important; } .ldrip__body { clip-path: none !important; } }

/* ==========================================================
   ROUND 14 · calmer movement between places
   ========================================================== */
html { scroll-behavior: auto; }          /* scripted glides handle smooth movement */
/* pages fade softly into each other: opacity only, so phones never stutter */
::view-transition-old(root) { animation: pageOut .32s ease-in both; }
::view-transition-new(root) { animation: pageIn .55s ease-out both; }
@keyframes pageOut { to { opacity: 0; } }
@keyframes pageIn { from { opacity: 0; } }
.candle-veil { transition: opacity .3s ease-in; background: #1d170e; }
.candle-veil.lift { transition: opacity .55s ease-out; }

/* ==========================================================
   ROUND 15 · honey answers every tap and click
   ========================================================== */
.tap-bead { display: none !important; }          /* replaced by .touch-drop */
.touch-drop { position: fixed; z-index: 95; width: 0; height: 0; pointer-events: none; }
.touch-drop__bead { position: absolute; left: calc(var(--s) / -2); top: calc(var(--s) / -2); width: var(--s); height: calc(var(--s) * 1.08);
  border-radius: 50% 50% 50% 50% / 44% 44% 56% 56%;
  background: radial-gradient(circle at 50% 55%, rgba(170,90,0,.35) 0%, rgba(230,145,25,.55) 52%, rgba(255,200,95,.95) 82%, rgba(255,236,185,1) 100%);
  box-shadow: 0 0 10px rgba(255,180,70,.55), 0 2px 4px rgba(90,45,0,.25);
  animation: tdBead 2.3s cubic-bezier(.45,0,.35,1) forwards; }
.touch-drop__bead::after { content: ""; position: absolute; left: 22%; top: 16%; width: 28%; height: 34%; border-radius: 50%; background: rgba(255,255,250,.95); transform: rotate(-20deg); }
.touch-drop__thread { position: absolute; left: -1.2px; top: 0; width: 2.4px; height: var(--fall); transform-origin: 50% 0; transform: scaleY(0);
  border-radius: 2px; background: linear-gradient(90deg, rgba(255,210,120,.9), rgba(230,150,40,.5), rgba(255,210,120,.9));
  animation: tdThread 2.3s cubic-bezier(.45,0,.35,1) forwards; }
@keyframes tdBead {
  0%   { transform: scale(.15); opacity: 0; }
  10%  { transform: scale(1.12, 1); opacity: 1; }        /* the drop forms */
  22%  { transform: scale(.96, 1.06); }
  45%  { transform: translate(calc(var(--lean) * .3), calc(var(--fall) * .2)) scale(.9, 1.22); }   /* stretching on its thread */
  55%  { transform: translate(calc(var(--lean) * .45), calc(var(--fall) * .3)) scale(.92, 1.3); opacity: 1; }
  100% { transform: translate(var(--lean), var(--fall)) scale(.85, 1.15); opacity: 0; }          /* lets go and falls */
}
@keyframes tdThread {
  0%, 18% { transform: scaleY(0); opacity: 1; }
  45%     { transform: scaleY(.2); opacity: 1; }
  55%     { transform: scaleY(.3); opacity: .9; }
  60%     { transform: scaleY(.1); opacity: .6; }          /* the thread snaps and pulls back */
  75%, 100% { transform: scaleY(0); opacity: 0; }
}
/* where motion is reduced: the drop only swells and fades */
.touch-drop--calm .touch-drop__bead { animation: tdCalm 1.4s ease forwards; }
.touch-drop--calm .touch-drop__thread { display: none; }
@keyframes tdCalm { 0% { transform: scale(.4); opacity: 0; } 25% { transform: scale(1); opacity: 1; } 100% { transform: scale(1.05); opacity: 0; } }
/* a title drip let go by a tap */
.ldrip--tapped .ldrip__body { animation: ldripTapped 1.8s cubic-bezier(.45,0,.35,1) both !important; clip-path: none !important; }
.ldrip--tapped .ldrip__drop { animation: ldripTapDrop 1.8s cubic-bezier(.5,0,.8,.5) both !important; }
@keyframes ldripTapped { 0% { transform: scaleY(1); } 30% { transform: scaleY(1.35) scaleX(.92); } 38% { transform: scaleY(.45) scaleX(1.06); } 60% { transform: scaleY(.6); } 100% { transform: scaleY(1); } }
@keyframes ldripTapDrop { 0%, 30% { opacity: 0; transform: translateY(0); } 34% { opacity: 1; transform: translateY(.06em) scale(1, 1.15); } 100% { opacity: 0; transform: translateY(var(--fall)) scale(.9, 1.25); } }

/* ROUND 16 · title honey drawn as real, slow honey on a canvas under each script word */
.title-honey { position: absolute; pointer-events: none; z-index: 2; }
.panel--hero { overflow-x: clip; }
.ldrip { display: none !important; }
.touch-drop__thread { width: calc(var(--s) * .16); left: calc(var(--s) * -.08); }
/* phones & tablets: shorter photo on photo+text pages, so each page opens with its title in view */
@media (max-width: 1100px) {
  .split__media, .split--right .split__media { height: 44svh; }
  .split__body, .split--left .split__body { margin-top: -40px; padding-top: 10px; }
}
@media (max-width: 1100px) { .theme-light .site-header::before { opacity: 1; } }
/* the floating invitation on every page, every screen size */
@media (min-width: 961px) {
  .thumb-cta { display: inline-flex; align-items: center; gap: .6em; position: fixed; right: calc(var(--frame) + 28px); bottom: calc(var(--frame) + 26px); left: auto; z-index: 41;
    transform: translateY(30px); opacity: 0; pointer-events: none;
    padding: 13px 24px; border-radius: 999px; text-decoration: none; font-size: 1rem; letter-spacing: .08em;
    color: #fffaf0; background: rgba(38,48,31,.94); border: 1px solid rgba(232,194,122,.8);
    box-shadow: 0 10px 26px rgba(0,0,0,.3), 0 0 18px rgba(232,194,122,.18);
    transition: opacity .7s ease, transform .8s cubic-bezier(.2,.8,.2,1), background .3s; }
  .thumb-cta .bee { color: var(--honey-hi); }
  .thumb-cta.show { opacity: 1; transform: none; pointer-events: auto; }
  .thumb-cta:hover { background: rgba(52,64,42,.97); }
}
.logo-honey { padding-inline: 0 .1em; overflow: visible; }
.logo { overflow: visible; }

/* ==========================================================
   HEARTH II · the doorway carries you into the room
   ========================================================== */
.hearth-ii .arch-link { text-decoration: none; color: inherit; }
@media (max-width: 640px) { .hearth-ii .arch-link::after { content: "\2192"; font-size: 1.3rem; } }
/* the passage: the tapped doorway grows to fill the screen, its doors swing open onto the room */
.door-pass { position: fixed; inset: 0; z-index: 300; pointer-events: none; background: rgba(20,24,15,0); transition: background .5s ease; }
.door-pass.is-going { background: rgba(20,24,15,.92); }
.door-pass__arch { position: fixed; left: var(--x); top: var(--y); width: var(--w); height: var(--h); overflow: hidden; perspective: 1200px;
  border-radius: 999px 999px 6px 6px; border: 2px solid var(--honey);
  box-shadow: 0 0 0 1px rgba(232,194,122,.5), 0 0 60px rgba(var(--room), .45);
  transition: left .75s cubic-bezier(.6,.05,.2,1), top .75s cubic-bezier(.6,.05,.2,1), width .75s cubic-bezier(.6,.05,.2,1), height .75s cubic-bezier(.6,.05,.2,1), border-radius .75s ease; }
.door-pass.is-going .door-pass__arch { left: 50%; top: 50%; width: min(78vw, 62vh); height: min(114vw, 90vh); transform: translate(-50%, -50%); }
.door-pass__arch img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.12); transition: transform 1.3s ease .3s; }
.door-pass.is-going .door-pass__arch img { transform: scale(1.02); }
.door-pass__glow { position: absolute; inset: 0; background: radial-gradient(ellipse 60% 70% at 50% 55%, rgba(255,250,235,.95), rgba(var(--room), .7) 40%, rgba(var(--room), 0) 78%); opacity: 0; }
.door-pass.is-going .door-pass__glow { animation: glowPour 1.2s ease-out .5s both; }
.door-pass__seam { position: absolute; left: 50%; top: 6%; bottom: 0; width: 2px; margin-left: -1px; background: linear-gradient(180deg, transparent, #fffaf0 20%, rgb(var(--room)) 60%, transparent); box-shadow: 0 0 12px 3px rgba(var(--room), .85); opacity: 0; }
.door-pass.is-going .door-pass__seam { animation: seam .7s ease-out .35s both; }
.door-pass .door { top: 0; bottom: 0; }
.door-pass .door--l { left: 0; width: 50%; }
.door-pass .door--r { right: 0; width: 50%; }
.door-pass.is-going .door--l { animation: doorL .9s cubic-bezier(.5,.05,.25,1) .5s both; }
.door-pass.is-going .door--r { animation: doorR .9s cubic-bezier(.5,.05,.25,1) .54s both; }
/* arriving through the passage: the room is already open */
.passed-through .bed--page .door, .passed-through .bed--page .portal__seam { display: none; }
.passed-through .bed--page .portal img { animation: none !important; }

/* ==========================================================
   HEARTH II · one door, then deeper into the room
   ========================================================== */
/* the passage ends by moving forward until the room fills the screen */
.door-pass.is-deeper .door-pass__arch { left: 50%; top: 50%; width: 100vw; height: 100vh; transform: translate(-50%, -50%); border-radius: 0; border-color: transparent; box-shadow: none;
  transition: left .7s cubic-bezier(.5,0,.2,1), top .7s cubic-bezier(.5,0,.2,1), width .7s cubic-bezier(.5,0,.2,1), height .7s cubic-bezier(.5,0,.2,1), border-radius .5s ease, border-color .4s; }
.door-pass.is-deeper .door-pass__arch img { transform: scale(1.06); transition: transform .8s ease; }
.door-pass.is-deeper .door { display: none; }
.door-pass.is-deeper { background: rgba(20,24,15,1); }

/* the Bed page, arrived at through the passage: no second door; the room is all around you */
.bedroom__hero { display: none; }
.passed-through .bedroom__hero { display: block; position: absolute; left: 0; right: 0; top: 0; height: 64svh; overflow: hidden; z-index: 1;
  animation: heroSettle 1.4s cubic-bezier(.3,.7,.2,1) both; }
.passed-through .bedroom__hero img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.06); animation: heroImg 1.6s ease both; }
.passed-through .bedroom__hero::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(31,40,25,.15) 0%, rgba(31,40,25,0) 40%, rgba(31,40,25,.65) 80%, var(--green) 100%), radial-gradient(ellipse 70% 60% at 50% 40%, rgba(var(--room), .18), transparent 70%); }
@keyframes heroSettle { from { height: 100svh; } to { height: 64svh; } }
@keyframes heroImg { from { transform: scale(1.06); } to { transform: scale(1); } }
.passed-through .bedroom { padding-top: calc(64svh - 40px); }
.passed-through .bedroom__wrap { animation: riseIn 1.1s cubic-bezier(.2,.8,.2,1) .35s both; }
@keyframes riseIn { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: none; } }
.passed-through .bed--page .bed__img { display: none; }                 /* the room is the hero now, not a doorway */
.passed-through .bed--page { grid-template-columns: minmax(0, 1fr) !important; }
.passed-through .bed--page .bed__main { text-align: center; max-width: 640px; margin-inline: auto; }
.passed-through .bed--page .bed__book { margin-inline: auto; }
.passed-through .bedroom__glow { display: none; }
@media (min-width: 961px) { .passed-through .bedroom__hero { height: 72vh; } @keyframes heroSettle { from { height: 100vh; } to { height: 72vh; } } .passed-through .bedroom { padding-top: calc(72vh - 60px); } }
@media (prefers-reduced-motion: reduce) { .passed-through .bedroom__hero, .passed-through .bedroom__hero img, .passed-through .bedroom__wrap { animation: none !important; } }
body.passed-through .bed--page .bed__img, body.passed-through .bed--page .bed__img.portal { display: none !important; }

/* ROUND 17 · the tap streak has a soft round top (height grows instead of scaling, so the rounding never flattens) */
.touch-drop__thread { transform: none !important; height: 0; border-radius: 999px; overflow: visible;
  top: calc(var(--s) * -.1); width: calc(var(--s) * .2); left: calc(var(--s) * -.1);
  background: linear-gradient(90deg, rgba(255,214,130,.92), rgba(232,152,42,.55) 50%, rgba(255,214,130,.92));
  animation-name: tdThreadH; }
.touch-drop__thread::before { content: ""; position: absolute; left: 50%; top: calc(var(--s) * -.05); width: calc(var(--s) * .26); height: calc(var(--s) * .3);
  transform: translateX(-50%); border-radius: 50% 50% 46% 46% / 58% 58% 42% 42%;
  background: radial-gradient(circle at 45% 40%, rgba(255,236,190,.95), rgba(236,160,48,.7) 70%, rgba(236,160,48,0) 100%); }
@keyframes tdThreadH {
  0%, 18% { height: 0; opacity: 1; }
  45%     { height: calc(var(--fall) * .2); opacity: 1; }
  55%     { height: calc(var(--fall) * .3); opacity: .9; }
  60%     { height: calc(var(--fall) * .1); opacity: .6; }
  75%, 100% { height: 0; opacity: 0; }
}

/* ROUND 18 · HEARTH III: only the seven doorways. The same arched gallery on every screen; each door opens into its room. */
.hearth-iii .beds-intro h2 .script { display: block; }
.hearth-iii .arches { display: flex !important; flex-wrap: wrap; justify-content: center; flex-direction: row !important;
  gap: clamp(22px, 3vw, 34px) clamp(12px, 2vw, 22px); overflow: visible !important; margin: 40px auto 0 !important; padding: 0 !important;
  max-width: 1180px; -webkit-mask-image: none !important; mask-image: none !important; scroll-snap-type: none !important; }
.hearth-iii .arches li { width: calc((100% - 3 * clamp(12px, 2vw, 22px)) / 4); opacity: 1 !important; }
.hearth-iii .arch { display: flex !important; flex-direction: column !important; align-items: center; gap: 12px; padding: 0 !important;
  border: 0 !important; background: none !important; translate: none !important; }
.hearth-iii .arch::after { display: none !important; }
.hearth-iii .arch__frame, .hearth-iii .arches li .arch__frame, .hearth-iii .arches li.is-centred .arch__frame {
  width: 100% !important; transform: none !important; opacity: 1 !important; padding: 4px !important; }
.hearth-iii .arch__text { display: flex !important; flex-direction: column; align-items: center; gap: 4px; text-align: center; }
.hearth-iii .arch__label { justify-content: center !important; font-size: clamp(.9rem, 1.4vw, 1.05rem) !important; letter-spacing: .16em; }
.hearth-iii .arch__label .bee { display: none !important; }
.hearth-iii .arch__tag { display: block !important; font-family: var(--script); color: var(--muted-light); font-size: 1.15rem; line-height: 1.2; max-width: 22ch; }
.hearth-iii .beds-foot { display: flex !important; justify-content: center; align-items: center; gap: 10px; margin: 40px 0 0; font-style: italic; color: var(--muted-light); }
.hearth-iii .door-dots, .hearth-iii .swipe-hint { display: none !important; }
@media (min-width: 1100px) { .hearth-iii .arches li { width: calc((100% - 3 * 22px) / 4 - 2px); } }
@media (max-width: 760px) {
  .hearth-iii .arches { gap: 22px 10px; margin-top: 30px !important; }
  .hearth-iii .arches li { width: calc((100% - 20px) / 3); }
  .hearth-iii .arch { gap: 10px; }
  .hearth-iii .arch__label { font-size: .82rem !important; letter-spacing: .14em; }
  .hearth-iii .arch__tag { display: none !important; }        /* names only on phones, like the gallery she liked */
}
@media (max-width: 340px) { .hearth-iii .arches li { width: calc((100% - 10px) / 2); } }
.hearth-iii .beds-intro { margin: 0 auto; text-align: center; max-width: 620px; }
.hearth-iii .beds-intro .rule { margin-left: auto; margin-right: auto; justify-content: center; }
.hearth-iii .beds-intro .hint { justify-content: center; }
.hearth-iii .beds-foot { text-align: center; }

/* ROUND 19 · HEARTH III: the room opens in place. A modal on desktop, a full-screen takeover on phones. */
.door-pass.is-leaving { opacity: 0; transition: opacity .6s ease; }
.room-modal { position: fixed; inset: 0; z-index: 250; display: flex; align-items: center; justify-content: center; }
.room-modal[hidden] { display: none; }
.room-modal__backdrop { position: absolute; inset: 0; background: rgba(12,16,10,.8); opacity: 0; transition: opacity .45s ease; }
.room-modal__panel { position: relative; width: min(1120px, calc(100vw - 64px)); height: min(88vh, 940px); border-radius: 26px; overflow: hidden;
  background: radial-gradient(ellipse 70% 40% at 50% 30%, rgba(var(--room, 232,194,122), .14), transparent 70%), linear-gradient(180deg, #1f2819, var(--green) 50%, #1c2416);
  border: 1px solid rgba(232,194,122,.55); box-shadow: 0 30px 80px rgba(0,0,0,.55), 0 0 70px rgba(var(--room, 232,194,122), .2);
  opacity: 0; transform: translateY(26px) scale(.97); transition: opacity .5s ease, transform .6s cubic-bezier(.2,.8,.2,1); }
.room-modal.is-open .room-modal__backdrop { opacity: 1; }
.room-modal.is-open .room-modal__panel { opacity: 1; transform: none; }
.room-modal.is-instant .room-modal__panel, .room-modal.is-instant .room-modal__backdrop { transition: none; }
.room-modal__scroll { position: absolute; inset: 0; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.room-modal__close { position: absolute; top: 16px; right: 16px; z-index: 5; width: 48px; height: 48px; border-radius: 50%; padding: 0;
  display: flex; align-items: center; justify-content: center; cursor: pointer; font: 300 1.9rem/1 var(--serif, serif);
  color: #fffaf0; background: rgba(24,30,19,.7); border: 1px solid rgba(232,194,122,.8); box-shadow: 0 4px 18px rgba(0,0,0,.35); transition: background .3s, transform .3s; }
.room-modal__close:hover, .room-modal__close:focus-visible { background: rgba(44,52,33,.95); transform: rotate(90deg); }
.room-sheet[hidden] { display: none; }
.room-sheet__hero { position: relative; height: 48vh; overflow: hidden; }
.room-sheet__hero img { width: 100%; height: 100%; object-fit: cover; display: block; }
.room-sheet__hero::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(31,40,25,.1) 0%, rgba(31,40,25,0) 40%, rgba(31,40,25,.7) 82%, var(--green) 100%), radial-gradient(ellipse 70% 60% at 50% 40%, rgba(var(--room), .18), transparent 70%); }
.room-sheet__body { position: relative; z-index: 2; margin-top: -110px; padding: 0 clamp(18px, 4vw, 48px) 44px; }
.room-sheet__card { margin: 0 auto !important; max-width: 940px; }
.room-sheet .bed--sheet { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr) !important; gap: clamp(22px, 3.4vw, 48px); }
.room-sheet .bed--sheet .bed__main { text-align: left; }
.room-sheet .bed--sheet .bed__book { display: inline-flex; }
.room-sheet .bedroom__foot { margin: 28px 0 22px; }
.room-sheet__nav { display: flex; justify-content: space-between; gap: 12px; max-width: 940px; margin: 0 auto; }
.room-sheet__step { font: inherit; font-size: .86rem; letter-spacing: .14em; text-transform: uppercase; cursor: pointer;
  color: var(--text-light); background: rgba(24,30,19,.5); border: 1px solid rgba(232,194,122,.5); border-radius: 999px; padding: 11px 20px; transition: border-color .3s, background .3s; }
.room-sheet__step:hover, .room-sheet__step:focus-visible { border-color: var(--honey-hi); background: rgba(44,52,33,.9); }
.room-sheet.is-in .room-sheet__hero img { animation: heroImg 1.4s ease both; }
.room-sheet.is-in .room-sheet__body { animation: riseIn .9s cubic-bezier(.2,.8,.2,1) .12s both; }
html.room-open, html.room-open body { overflow: hidden; }
html.room-open .thumb-cta { opacity: 0 !important; pointer-events: none !important; }
html.room-open .touch-drop { z-index: 400; }
@media (max-width: 760px) {
  .room-modal__panel { width: 100vw; height: 100svh; border-radius: 0; border: 0; box-shadow: none; transform: translateY(40px); }
  .room-modal__backdrop { display: none; }
  .room-modal__close { top: calc(14px + env(safe-area-inset-top, 0px)); right: 14px; width: 44px; height: 44px; }
  .room-sheet__hero { height: 58svh; }
  .room-modal.is-arriving .room-sheet.is-in .room-sheet__hero { animation: sheetSettle 1.3s cubic-bezier(.3,.7,.2,1) both; }
  .room-sheet__body { margin-top: -70px; padding: 0 14px 36px; }
  .room-sheet .bed--sheet { grid-template-columns: minmax(0, 1fr) !important; gap: 22px; }
  .room-sheet .bed--sheet .bed__main { text-align: center; }
  .room-sheet .bed--sheet h3, .room-sheet .bed--sheet .tagline { display: block !important; text-align: center; }
  .room-sheet .bed--sheet .bed__book { display: flex; margin-inline: auto; }
  .room-sheet__step { padding: 10px 14px; font-size: .78rem; letter-spacing: .1em; }
}
@keyframes sheetSettle { from { height: 100svh; } to { height: 58svh; } }
@media (prefers-reduced-motion: reduce) { .room-sheet.is-in .room-sheet__hero, .room-sheet.is-in .room-sheet__hero img, .room-sheet.is-in .room-sheet__body { animation: none !important; } }
/* one clean column inside the sheet, whatever the older drawer rules said */
.room-sheet .bed--sheet { grid-template-columns: minmax(0, 1fr) !important; }
.room-sheet .bed--sheet > * { grid-column: 1 / -1 !important; min-width: 0; width: auto !important; }
.room-sheet .bed--sheet .bed__meta { border-top: 1px solid rgba(160,120,60,.25); padding-top: 22px; }
/* desktop modal: the room stands tall on the left, its story scrolls on the right */
@media (min-width: 761px) {
  .room-sheet:not([hidden]) { display: grid; grid-template-columns: minmax(300px, 40%) minmax(0, 1fr); min-height: 100%; }
  .room-sheet__hero { position: sticky; top: 0; height: min(88vh, 940px); }
  .room-sheet__hero::after { background: linear-gradient(90deg, rgba(31,40,25,0) 55%, rgba(31,40,25,.85) 92%, var(--green) 100%), radial-gradient(ellipse 70% 60% at 50% 40%, rgba(var(--room), .2), transparent 70%); }
  .room-sheet__body { margin: 0 0 0 -40px; padding: 76px clamp(28px, 3.4vw, 48px) 40px 0; }
  .room-sheet__card { max-width: 640px; }
  .room-sheet__nav { max-width: 640px; }
  .room-sheet .bed--sheet .bed__main { text-align: left; }
}

/* ROUND 21 · Hearth III is the home. Desktop shows the seven doorways as one row, as in the Seven Beds reference. */
.hearth-iii .arch-room { text-decoration: none; color: inherit; }
@media (min-width: 1000px) {
  .hearth-iii .arches { flex-wrap: nowrap !important; max-width: 1240px; gap: clamp(12px, 1.4vw, 22px) !important; }
  .hearth-iii .arches li { width: auto !important; flex: 1 1 0; min-width: 0; }
  .hearth-iii .arch__tag { display: none !important; }
  .hearth-iii .arch__label .bee { display: inline-block !important; }
  .hearth-iii .arch__label { font-size: clamp(.78rem, .95vw, .95rem) !important; letter-spacing: .12em; gap: .4em; white-space: nowrap; }
}

/* ROUND 22 · JOURNAL: a quiet cream editorial page. Bracketed text is placeholder for Carlee's own words. */
.journal { position: relative; min-height: 100svh; padding: 150px 0 110px; overflow: hidden;
  background: radial-gradient(ellipse 60% 40% at 80% 10%, rgba(232,194,122,.18), transparent 70%), var(--parchment); color: var(--ink, #2b2a22); }
.journal__wrap { position: relative; z-index: 2; max-width: 760px; }
.journal__head { text-align: center; }
.journal__intro { font-size: 1.2rem; margin: 18px auto 0; max-width: 34ch; }
.entries { margin-top: 64px; }
.entry { text-align: center; padding: 6px 0; }
.entry__date { letter-spacing: .22em; text-transform: uppercase; font-size: .8rem; color: var(--honey-deep); margin: 0 0 10px; }
.entry__title { font-size: clamp(1.8rem, 3.2vw, 2.5rem); font-weight: 400; line-height: 1.15; margin: 0 0 14px; }
.entry__title a { color: inherit; text-decoration: none; transition: color .3s; }
.entry__title a:hover, .entry__title a:focus-visible { color: var(--honey-deep); }
.entry__excerpt { font-size: 1.12rem; max-width: 46ch; margin: 0 auto 14px; }
.entry__rule { margin: 44px auto; }
.entries .entry__rule:last-child { display: none; }
.ph { font-style: italic; opacity: .6; }
.journal--entry .journal__wrap { max-width: 680px; }
.journal__back { display: inline-block; margin-bottom: 34px; }
.journal__back::after { content: none; }
.journal__back::before { content: "\27F5"; color: var(--honey); margin-right: 6px; }
.entry-full { text-align: center; }
.entry-full__title { font-size: clamp(2.2rem, 4.6vw, 3.4rem); }
.entry-full__body { text-align: left; font-size: 1.15rem; line-height: 1.75; margin-top: 30px; }
.entry-full__body .script--line { text-align: center; font-size: 1.9rem; margin: 30px 0; }
@media (max-width: 760px) {
  .journal { padding: 112px 0 80px; }
  .journal .botanical--edge { opacity: .35; }
  .entries { margin-top: 44px; }
}

/* Soft desktop pointer. Honey drops appear only on click or touch. */
@media (hover: hover) and (pointer: fine) {
  html, body {
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='4.5' fill='%23d9ac65' stroke='%23fff4da' stroke-width='1.5'/%3E%3Ccircle cx='10' cy='10' r='5.5' fill='none' stroke='%23745636' stroke-opacity='.55' stroke-width='.6'/%3E%3C/svg%3E") 10 10, auto;
  }
  a, button, summary, label, select, input[type="checkbox"], input[type="radio"],
  .arch, .check, .field .check, .qa summary {
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='6.5' fill='%23d9ac65' stroke='%23fff4da' stroke-width='1.5'/%3E%3Ccircle cx='12' cy='12' r='7.5' fill='none' stroke='%23745636' stroke-opacity='.55' stroke-width='.6'/%3E%3C/svg%3E") 12 12, pointer !important;
  }
  input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]), textarea, [contenteditable="true"] { cursor: text; }
}

/* Keep both home options readable in the client review navigation. */
@media (min-width: 1101px) {
  .nav { gap: clamp(10px, 1.2vw, 20px); }
  .nav a { white-space: nowrap; }
}
@media (max-width: 640px) {
  .nav { gap: 12px; }
  .hearth-inline .drawer__card { padding: 42px 20px 24px; }
  .hearth-inline .drawer__nav { flex-wrap: wrap; }
  .hearth-inline .drawer__foot { flex-basis: 100%; order: 3; }
}

/* Give the modal's copy usable line lengths within its own column. */
.room-sheet .bed--sheet .bed__meta {
  border-left: 0;
  padding-inline: 0;
}
.room-sheet .bed--sheet .facets {
  display: block;
}
.room-sheet .bed--sheet .facets > div {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  align-items: start;
  gap: 20px;
  padding: 20px 0;
  border-top: 1px dotted rgba(160, 120, 60, .4);
}
.room-sheet .bed--sheet .facets dt {
  align-items: center;
  font-size: 1.08rem;
}
.room-sheet .bed--sheet .facets dd {
  align-self: start;
  line-height: 1.55;
}
.room-sheet .bed--sheet .facets .ico { width: 26px; height: 26px; }
@media (min-width: 761px) {
  .room-sheet:not([hidden]) { grid-template-columns: minmax(220px, 34%) minmax(0, 1fr); }
  .room-sheet__body { margin-left: -20px; padding: 72px 32px 36px 0; }
  .room-sheet__card { padding: 36px clamp(24px, 3vw, 40px) 24px; }
}
@media (max-width: 480px) {
  .room-sheet .bed--sheet .facets > div { grid-template-columns: 1fr; gap: 8px; }
}

/* Return paths from the supporting pages into the Seven Beds. */
.beds-return { position: absolute; top: 104px; left: var(--gutter, 32px); z-index: 6; font-size: .95rem; }
.beds-invitation { padding: 52px var(--gutter, 24px); text-align: center; background: var(--green); color: var(--text-light); }
.beds-invitation h2 { color: var(--text-light); font-size: clamp(1.8rem, 3vw, 2.6rem); margin-bottom: 12px; }
.beds-invitation .script, .beds-invitation .text-link { color: var(--honey); }
.beds-invitation p { margin: 0 auto 18px; max-width: 600px; }
@media (max-width: 640px) { .beds-return { top: 76px; left: 20px; font-size: .9rem; } }
.beds-return::after, .beds-invitation .text-link::after { content: none; }
.beds-return { color: var(--ink); background: rgba(249, 240, 224, .94); padding: 6px 12px; border: 1px solid rgba(160,120,60,.3); border-radius: 4px; }

/* Hearth II keeps the selected doorway and its drawer visibly paired. */
.hearth-inline .arch__label { padding: 7px 10px; border-radius: 4px; border: 1px solid transparent; }
.hearth-inline .arch[aria-expanded="true"] .arch__label {
  background: var(--honey-hi); color: var(--ink); border-color: var(--honey-hi);
  text-decoration: none; opacity: 1;
}
.hearth-inline .arch[aria-expanded="true"] .arch__label::before { content: "✓"; font-size: .9em; }
.hearth-inline .arches:has([aria-expanded="true"]) .arch[aria-expanded="false"] .arch__frame { opacity: .58; }
.hearth-inline .arch[aria-expanded="true"] .arch__frame {
  outline: 3px solid var(--honey-hi); outline-offset: 5px;
}
.hearth-inline .drawer.is-open .drawer__card { border: 2px solid var(--honey); }
.hearth-inline .drawer__selection {
  margin: 0 36px 28px 0; padding: 0 0 14px;
  border-bottom: 1px solid rgba(160,120,60,.4);
  color: var(--green) !important; font-size: 1.05rem; letter-spacing: .05em;
}
.hearth-inline .drawer__notch { left: clamp(36px, var(--notch, 50%), calc(100% - 36px)); }
@media (max-width: 640px) {
  .hearth-inline .arch__label { padding: 6px 3px; letter-spacing: .04em !important; }
}

/* Home variants share a single navigation disclosure. */
.home-options { position: relative; }
.home-options > summary { list-style: none; cursor: pointer; white-space: nowrap; padding: 10px 0; font-size: .95rem; }
.home-options > summary::-webkit-details-marker { display: none; }
.home-options > summary::after { content: "⌄"; display: inline-block; margin-left: 7px; }
.home-options[open] > summary::after { transform: rotate(180deg); }
.home-options > summary:focus-visible { outline: 2px solid var(--honey); outline-offset: 5px; }
.home-options__links { position: absolute; top: 100%; left: -16px; min-width: 160px; padding: 10px; border: 1px solid var(--honey); border-radius: 8px; background: var(--green); box-shadow: 0 12px 24px rgba(0,0,0,.25); }
.nav .home-options__links a { display: block; padding: 10px 14px; color: var(--text-light); white-space: nowrap; }
.nav .home-options__links a:hover, .nav .home-options__links a.is-current { background: rgba(232,194,122,.14); color: var(--honey-hi); }
@media (max-width: 1100px) {
  .home-options { text-align: center; }
  .home-options > summary { font-size: 1.2rem; padding: 0; }
  .home-options__links { position: static; min-width: 180px; margin-top: 10px; padding: 4px 12px; box-shadow: none; }
  .nav .home-options__links a { font-size: 1rem; padding: 7px 12px; }
}

.honeyed--subtle .title-honey { opacity: .9; }

/* Client review: quieter light, immediate botanical, readable inline details. */
.stage .rays, .stage .veils { display: none; }
.js .botanical--hero { clip-path: none; opacity: 0; transition: opacity 1.6s ease 3.2s; }
.js .botanical--hero.is-in { opacity: .75; }
@media (max-width: 640px) { .js .botanical--hero.is-in { opacity: .45; } }
@media (prefers-reduced-motion: reduce) { .js .botanical--hero { opacity: .75; transition: none; } }
.hearth-inline .facets > div { grid-template-columns: 1fr; gap: 8px; }
.hearth-inline .facets dd { align-self: start; line-height: 1.55; }
.hearth-inline .facets dt { align-self: start; }
.form .field { margin-bottom: 26px; }
.form .field label, .form .field .label { line-height: 1.5; }
.form textarea { min-height: 120px; line-height: 1.6; }
.form .acks .ack { padding: 12px 0; margin-bottom: 4px; line-height: 1.6; }
.form .acks .ack + .ack { border-top: 1px solid var(--line); }
.form input:user-invalid, .form textarea:user-invalid { border-color: #9a3b1c; outline: 2px solid #9a3b1c; outline-offset: 3px; }
@media (max-width: 760px) {
  .hearth-inline .drawer__nav { display: flex !important; position: static; margin: 24px 0 0; padding: 12px 0; gap: 8px; }
  .hearth-inline .drawer__step { min-width: 0; white-space: normal; padding: 10px 12px; }
}
/* Keep decorative sparks from extending the horizontal scroll area. */
html:has(.hearth-inline) { overflow-x: clip; }

/* Touch honey gathers, stretches, then releases without a bright halo. */
.touch-drop__bead { box-shadow: 0 1px 3px rgba(90,45,0,.18); animation: tdSoftBead 3.1s ease-in-out forwards; }
.touch-drop__bead::after { width: 19%; height: 28%; background: rgba(255,255,245,.75); }
.touch-drop__thread { animation: tdSoftThread 3.1s ease-in-out forwards; }
@keyframes tdSoftBead {
  0% { transform: scale(.25); opacity: 0; }
  15% { transform: scale(1.05,.92); opacity: .9; }
  32% { transform: translateY(calc(var(--fall) * .04)) scale(1,1.08); opacity: .9; }
  58% { transform: translateY(calc(var(--fall) * .28)) scale(.88,1.25); opacity: .9; }
  68% { transform: translateY(calc(var(--fall) * .38)) scale(.82,1.35); opacity: .85; }
  100% { transform: translate(var(--lean),var(--fall)) scale(.88,1.1); opacity: 0; }
}
@keyframes tdSoftThread {
  0%,15% { height: 0; opacity: 0; }
  32% { height: calc(var(--fall) * .04); opacity: .65; }
  58% { height: calc(var(--fall) * .28); opacity: .65; }
  68% { height: calc(var(--fall) * .38); opacity: .4; }
  78%,100% { height: 0; opacity: 0; }
}
.touch-drop--calm .touch-drop__bead { animation: tdCalm 1.4s ease forwards; }
/* Bed navigation stays within the open card while its details scroll. */
.hearth-inline .drawer__nav {
  display: flex !important; position: sticky; bottom: 12px; z-index: 8;
  flex-wrap: nowrap; gap: 12px; margin: 28px 0 0; padding: 12px;
  background: rgba(251,245,235,.97); border: 1px solid var(--honey);
  border-radius: 14px; box-shadow: 0 5px 20px rgba(45,35,15,.12);
}
.hearth-inline .drawer__nav .drawer__foot { display: none; }
.hearth-inline .drawer__step { flex: 1; min-width: 0; min-height: 48px; white-space: normal; }
.hearth-inline .drawer__close { display: block; }
@media (max-width: 760px) {
  .hearth-inline .drawer__nav { bottom: calc(8px + env(safe-area-inset-bottom)); gap: 8px; padding: 8px; }
  .hearth-inline .drawer__step { padding: 10px 8px; font-size: 1rem; line-height: 1.25; }
  .hearth-inline .drawer__card { padding-inline: 16px; }
}
/* Consistent labels throughout the Bed details. */
.bed__meta h4, .facets dt { font-size: 1.28rem; font-weight: 500; line-height: 1.4; letter-spacing: 0; }
@media (max-width: 640px) {
  .bed__meta h4, .facets dt { font-size: 1.12rem; }
}
.room-sheet .bed--sheet .bed__meta h4 { font-size: 1.08rem; }
/* Closed drawers must not expose their card or sticky navigation. */
.hearth-inline .drawer:not(.is-open) { display: none; }

/* October client imagery and stationary honey accents. */
.reference-icon { width:2.1em; height:2.1em; flex:none; overflow:hidden; mix-blend-mode:multiply; vertical-align:middle; }
.reference-icon { filter:url(#reference-ink); }
.facets dt .reference-icon { width:2em; height:2em; margin-right:.45em; }
.bed__meta li .reference-icon { width:1.6em; height:1.6em; }
.stationary-drip { pointer-events:none; overflow:visible; position:absolute; z-index:2; }
.stationary-drip .hd-drop { display:none; }
.nav > a { position:relative; }
.nav-drip { width:12px; height:28px; left:50%; top:calc(100% + 3px); transform:translateX(-50%); opacity:.7; }
.home-drip { width:85px; height:130px; left:clamp(280px,25vw,420px); top:var(--frame); }
.experience-gallery { order:3; grid-column:1/-1; display:grid; grid-template-columns:1.4fr 1fr; gap:24px; padding:40px clamp(24px,6vw,100px) 70px; }
.experience-gallery img { width:100%; height:500px; object-fit:cover; border-radius:160px 160px 12px 12px; }
.offer-detail { margin:64px auto 30px; width:min(100%,420px); }
.offer-detail img { width:100%; max-height:540px; object-fit:cover; border-radius:210px 210px 12px 12px; }
.faq-closing { margin:60px 0 0; }
.faq-closing img { width:100%; height:auto; border-radius:16px; }
.contact-page .form { margin-block:40px; display:grid; gap:12px; }
.contact-page .form label { margin-top:12px; }
.contact-page .form select { width:100%; font:inherit; padding:12px; background:var(--cream,#f7eedf); border:1px solid var(--line); color:var(--ink); }
.page-confirmation .split--confirm { display:block; position:relative; padding:150px 24px 80px; background:#293020 url('../images/confirmation.jpg') center/cover; }
.page-confirmation .split__media { display:none; }
.page-confirmation .split__body { padding:0; background:none; }
.page-confirmation .split__copy { max-width:720px; padding:110px 64px 60px; background:#f7eedf; border:1px solid #cda45d; border-radius:50% 50% 28px 28px / 160px 160px 28px 28px; box-shadow:0 20px 60px #0005; }
.confirmation-drip { top:35px; right:32px; width:125px; height:145px; transform:rotate(-8deg); }
.page-confirmation .split__body > .botanical { display:none; }
@media(max-width:800px){
 .nav-drip { top:calc(100% + 2px); left:50%; height:20px; width:9px; }
 .home-drip { left:260px; width:48px; height:74px; }
 .experience-gallery { grid-template-columns:1fr; padding:24px 24px 50px; }
 .experience-gallery img { height:auto; max-height:540px; }
 .page-confirmation .split--confirm { padding:130px 20px 60px; }
 .page-confirmation .split__copy { padding:100px 28px 40px; border-radius:50% 50% 20px 20px / 90px 90px 20px 20px; }
 .confirmation-drip { width:78px; height:90px; top:22px; right:18px; }
}

/* Keep Honey's face inside the crop as the hero becomes portrait-shaped. */
.stage__img { object-position: 88% 35%; }
@media (max-aspect-ratio: 1/1) {
 .stage__img { object-position: 92% 35%; }
 .stage::before { background:linear-gradient(90deg,rgba(22,26,16,.7),rgba(22,26,16,.28)),linear-gradient(0deg,rgba(22,26,16,.65),transparent 75%); }
}
@media (max-width:520px) {
 .stage__media { inset:-42px -14px 0; animation:none; translate:none; }
 .stage__img { object-position:92% 0; transform:none; }
 .panel--hero { align-items:flex-start; padding-top:max(260px,32svh); padding-bottom:60px; }
}

/* Client review: calmer doors, clear current page, and accessible request copy. */
.flyer, .door, .portal__glow, .portal__seam { display:none !important; }
.page-confirmation .title-drips { display:none; }
.honeyed--subtle .title-honey, .page-confirmation .title-honey { display:none; }
.nav > a.is-current::after { display:block; transform:scaleX(1); }
.site-header.is-scrolled::before { opacity:0; }
.site-header.nav-open::before { opacity:1; }
.request__intro-copy { position:relative; }
.botanical--hero { scale:-1 1; }
.bed-flourish { color:var(--honey); font-size:1.1em; line-height:1; }
.bed-flourish--right { transform:scaleX(-1); }
.hearth-inline .beds-foot { margin-block:18px; }
.hearth-inline .drawer__card { margin-top:14px; }
.hearth-inline .drawer:has(#bed-honey.is-active) .drawer__card { background:#f6ead4; }
.hearth-inline .drawer:has(#bed-sanctuary.is-active) .drawer__card { background:#ececde; }
.hearth-inline .drawer:has(#bed-hearth.is-active) .drawer__card { background:#f0e4d5; }
.hearth-inline .drawer:has(#bed-sea.is-active) .drawer__card { background:#e2edeb; }
.hearth-inline .drawer:has(#bed-ember.is-active) .drawer__card { background:#f3e2d9; }
.hearth-inline .drawer:has(#bed-oracle.is-active) .drawer__card { background:#eae4ee; }
.hearth-inline .drawer:has(#bed-adornment.is-active) .drawer__card { background:#efe7db; }
.birth-date, .birth-time { grid-template-columns:repeat(3,minmax(0,1fr)); }
.form select { width:100%; min-height:44px; padding:10px; font:inherit; color:var(--ink); background:var(--cream,#f7eedf); border:1px solid var(--line); border-radius:3px; }

/* Meet Honey: steady portrait framing and a soft, readable header. */
.page-about .split__media img { object-position:56% 18%; transform:none; }
.page-about .site-header::before {
 opacity:1; bottom:-55px; border:0;
 background:linear-gradient(to bottom,rgba(25,32,22,.96) 0%,rgba(25,32,22,.78) 52%,rgba(25,32,22,0) 100%);
 backdrop-filter:none; -webkit-backdrop-filter:none; pointer-events:none;
}
.page-about .site-header.nav-open::before { bottom:0; background:var(--green); }
@media (max-width:1100px) {
 .page-about .split__media { height:64svh; min-height:500px; max-height:680px; padding-top:80px; }
 .page-about .split__media img { height:100%; object-position:56% 12%; }
}

/* How a Visit Unfolds: frame face and honey-covered hand together. */
.page-experience .split__media img { object-position:66% 20%; transform:none; }
.page-experience .site-header::before {
 opacity:1; bottom:-55px; border:0;
 background:linear-gradient(to bottom,rgba(247,238,223,.98),rgba(247,238,223,.88) 52%,rgba(247,238,223,0));
 backdrop-filter:none; -webkit-backdrop-filter:none; pointer-events:none;
}
.page-experience .site-header.nav-open::before { bottom:0; background:var(--green); }
@media (max-width:1100px) {
 .page-experience .split__media { height:62svh; min-height:460px; max-height:640px; padding-top:80px; }
 .page-experience .split__media img { object-position:65% 20%; }
}

/* The Lived Sanctuary: keep Honey and the flowers in the portrait crop. */
.page-sanctuary .split__media img { object-position:61% 15%; transform:none; }
.page-sanctuary .site-header::before {
 opacity:1; bottom:-55px; border:0;
 background:linear-gradient(to bottom,rgba(247,238,223,.98),rgba(247,238,223,.88) 52%,rgba(247,238,223,0));
 backdrop-filter:none; -webkit-backdrop-filter:none; pointer-events:none;
}
.page-sanctuary .site-header.nav-open::before { bottom:0; background:var(--green); }
@media (max-width:1100px) {
 .page-sanctuary .split__media { height:64svh; min-height:500px; max-height:680px; padding-top:80px; }
 .page-sanctuary .split__media img { object-position:61% 15%; }
}

/* Contact: anchor the woodland portrait on Honey, not the surrounding foliage. */
.page-contact .split__media { padding-top:80px; }
.page-contact .split__media img { object-position:30% 10%; transform:none; }
.page-contact .site-header::before {
 opacity:1; bottom:-55px; border:0;
 background:linear-gradient(to bottom,rgba(247,238,223,.98),rgba(247,238,223,.88) 52%,rgba(247,238,223,0));
 backdrop-filter:none; -webkit-backdrop-filter:none; pointer-events:none;
}
.page-contact .site-header.nav-open::before { bottom:0; background:var(--green); }
@media (max-width:1100px) {
 .page-contact .split__media { height:64svh; min-height:500px; max-height:680px; padding-top:80px; }
 .page-contact .split__media img { object-position:30% 5%; }
}

/* Mobile home botanicals stay at the edge, beneath the reading hierarchy. */
@media (max-width:760px) {
 .page-index .botanical--hero { left:-28px; height:32svh; max-width:110px; object-fit:contain; object-position:left bottom; }
 .page-index .botanical--hero,
 .js .page-index .botanical--hero.is-in { opacity:.12; }
 .page-index .botanical--footer { opacity:.12; width:90px; height:auto; right:-15px; }
}

/* October 12 review follow-up: hands-only doors and complete portraits. */
.arch__frame img { scale:1.8; translate:none; object-position:50% 50%; }
.arch:hover img, .arch[aria-expanded="true"] img { transform:none; }
.request__intro { background:var(--parchment); color:var(--ink); }
.request__intro .page-title, .request__intro p, .request__intro .lede { color:var(--ink); }
.request__intro .page-title .script { color:var(--honey-deep); padding-left:0; }
.request__heading { display:flex; align-items:center; gap:22px; }
.request__heading .page-title { font-size:clamp(2.4rem,3.6vw,4rem); min-width:0; }
.request__portrait { width:clamp(90px,10vw,145px); aspect-ratio:3/4; flex-shrink:0; object-fit:cover; object-position:50% 35%; border-radius:80px 80px 8px 8px; }
.page-contact .split__media { height:auto; min-height:0; max-height:none; align-self:start; padding-top:100px; position:sticky; }
.page-contact .split__media img { display:block; width:100%; height:auto; object-fit:contain; transform:none; }
.page-contact .split__media { mask-image:none !important; -webkit-mask-image:none !important; }
@media(max-width:900px) {
 .page-contact .split__media { position:relative; height:auto; min-height:0; max-height:none; padding:90px var(--gutter) 0; }
 .page-contact .split__media img { height:auto; width:100%; max-height:none; border-radius:180px 180px 8px 8px; }
 .request__heading { gap:18px; }
 .request__heading .page-title { font-size:clamp(2.4rem,7vw,3.5rem); }
}
/* Let the full-height Contact photograph scroll naturally, including the feet. */
.page-contact .split__media { position:relative; }
@media(max-width:900px) {
 .page-contact .split__body { margin-top:0; padding-top:36px; }
}

/* Exact artwork supplied by Honey, October 13. */
.client-home-drip, .client-nav-drip, .client-confirmation-drip { position:absolute; pointer-events:none; overflow:hidden; }
.client-home-drip { top:0; left:290px; width:145px; height:80px; }
.client-nav-drip { top:calc(100% + 3px); left:50%; translate:-50% 0; width:42px; height:27px; }
.client-confirmation-drip { top:12px; right:20px; width:220px; height:264px; z-index:3; }
.arch__frame img { scale:1.15; }
.arch__frame img[src$="bed-ember.jpg"] { scale:1.35; }
.portal img { scale:1; }
.portal img[src$="bed-adornment.jpg"], .portal img[src$="bed-honey.jpg"] { scale:1.08; }
@media(max-width:800px) {
 .client-home-drip { left:205px; width:70px; height:39px; }
 .client-nav-drip { width:32px; height:20px; }
 .client-confirmation-drip { top:8px; right:8px; width:105px; height:126px; }
}
@media(max-width:360px) { .client-home-drip { left:190px; width:52px; height:29px; } }

/* Blend the supplied still honey into the site's quieter gold and fine rules. */
.client-home-drip, .client-nav-drip {
 filter: saturate(.72) sepia(.3) brightness(.94) contrast(.88);
 opacity:.88;
 -webkit-mask-image:linear-gradient(to right, transparent, #0009 12%, #000 25%, #000 75%, #0009 88%, transparent);
 mask-image:linear-gradient(to right, transparent, #0009 12%, #000 25%, #000 75%, #0009 88%, transparent);
}
.client-home-drip { top:-1px; }
.client-nav-drip { top:calc(100% + 2px); width:35px; height:22px; }
.client-confirmation-drip {
 filter:saturate(.6) sepia(.12) brightness(1.02) contrast(.86);
 opacity:.92;
 -webkit-mask-image:linear-gradient(to right, transparent, #000b 10%, #000 24%, #000 87%, transparent);
 mask-image:linear-gradient(to right, transparent, #000b 10%, #000 24%, #000 87%, transparent);
}
@media(max-width:800px) {
 .client-nav-drip { width:28px; height:18px; }
}

/* Approved drippy home, promoted from review comparison. */

.honey-motion { transform-box:view-box; animation:honey-swell 9s ease-in-out infinite; --drip-stretch:1.16; }
.honey-motion--1 { animation-delay:-3s; animation-duration:10.5s; }
.honey-motion--2 { animation-delay:-6s; animation-duration:12s; }
.client-home-drip { height:96px; }
.client-nav-drip { height:21px; }
.client-nav-drip .honey-motion { --drip-stretch:1.28; }
@keyframes honey-swell { 0%,8%,100% { transform:scaleY(1); } 62%,70% { transform:scaleY(var(--drip-stretch)); } }
@media(max-width:800px) { .client-home-drip { height:46.8px; } .client-nav-drip { height:17.2px; } }
@media(max-width:360px) { .client-home-drip { height:34.8px; } }
@media(prefers-reduced-motion:reduce) { .honey-motion { animation:none; } }
.nav > a.is-current::after { top:calc(100% + 2px); bottom:auto; height:2px; background:linear-gradient(to right, #c6a26066, #ddbc7b 20%, #ddbc7b 80%, #c6a26066); border-radius:50%; }

/* Keep the floating invitation clear of an open Bed's mobile controls. */
@media (max-width: 960px) {
  body:has(.drawer.is-open) .thumb-cta { display: none; }
}

/* Join the bee tab cleanly to the selected Bed card. */
.hearth-inline .drawer__notch { top:2px; height:38px; z-index:1; background:inherit; border:2px solid var(--honey); border-bottom:0; place-items:center; padding:8px 0 0; }
.hearth-inline .drawer__notch .bee { margin:0; background:transparent; }