:root {
  --cream: #f7f1e8;
  --paper: #fdfaf4;
  --wall: #f3eadd;
  --wood: #ddc3a4;
  --wood-dark: #cfb190;
  --terra: #c8704e;
  --terra-dark: #a85a3c;
  --terra-soft: #e2a184;
  --sage: #8fa383;
  --sage-soft: #b7c4ac;
  --sand: #e5cfa6;
  --clay: #b98a5e;
  --sky: #cfe3da;
  --ink: #453a30;
  --ink-soft: #7d6f60;
  --line: #e5d9c8;
  --accent-glow: rgba(200, 112, 78, 0.14);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

.evening {
  --cream: #2b241d;
  --paper: #352d25;
  --wall: #3a3128;
  --wood: #4a3b2c;
  --wood-dark: #3f3225;
  --sky: #2a3440;
  --ink: #f0e6d8;
  --ink-soft: #b8a890;
  --line: #4d4234;
  --sand: #a3855a;
  --sage: #7d8f72;
  --accent-glow: rgba(242, 200, 121, 0.12);
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: "Inter", system-ui, sans-serif;
  background: var(--cream);
  color: var(--ink);
  line-height: 1.7;
  transition: background 0.8s var(--ease), color 0.8s var(--ease);
  overflow-x: hidden;
}

h1, h2, h3 { font-family: "Cormorant", Georgia, serif; font-weight: 500; line-height: 1.15; }
h2 { font-size: clamp(2rem, 4.5vw, 3.2rem); margin-bottom: 2.5rem; }
h2 em, h1 em { font-style: italic; color: var(--terra); }
.evening h2 em, .evening h1 em { color: var(--sand); }

/* ---------- NAV ---------- */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  display: flex; justify-content: space-between; align-items: center;
  padding: 0.9rem 4vw;
  background: color-mix(in srgb, var(--cream) 82%, transparent);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid transparent;
  transition: border-color 0.4s, background 0.8s;
}
.nav.scrolled { border-color: var(--line); }
.nav__logo {
  font-family: "Cormorant", serif; font-size: 1.9rem; font-weight: 600;
  color: var(--ink); text-decoration: none;
}
.nav__logo span { color: var(--terra); }
.nav__links { display: flex; gap: 1.8rem; align-items: center; }
.nav__links a {
  color: var(--ink-soft); text-decoration: none; font-size: 0.92rem; font-weight: 500;
  transition: color 0.3s;
}
.nav__links a:hover { color: var(--terra); }
.nav__cta {
  background: var(--terra); color: #fff !important;
  padding: 0.55rem 1.3rem; border-radius: 100px;
  transition: transform 0.3s var(--ease), background 0.3s !important;
}
.nav__cta:hover { transform: translateY(-2px); background: var(--terra-dark); }

/* ---------- HERO ---------- */
.hero {
  padding: 7.5rem 4vw 3rem;
  max-width: 1280px; margin: 0 auto;
  text-align: center;
}
.hero__eyebrow {
  text-transform: uppercase; letter-spacing: 0.25em; font-size: 0.78rem;
  color: var(--ink-soft); margin-bottom: 1.2rem;
}
.hero__title { font-size: clamp(2.6rem, 6vw, 4.6rem); margin-bottom: 1.4rem; }
.hero__sub {
  max-width: 640px; margin: 0 auto 1.4rem; color: var(--ink-soft);
  font-size: 1.02rem;
}
.hero__hint {
  display: inline-flex; align-items: center; gap: 0.6rem;
  font-size: 0.95rem; color: var(--ink-soft); margin-bottom: 2.5rem;
}
.hero__hint-dot {
  width: 9px; height: 9px; border-radius: 50%;
  background: var(--terra);
  animation: pulse 2s infinite;
}
@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 0 var(--accent-glow); }
  50% { box-shadow: 0 0 0 10px transparent; }
}

.room-wrap { position: relative; max-width: 1100px; margin: 0 auto; }
.room {
  width: 100%; height: auto; display: block;
  border-radius: 24px;
  box-shadow: 0 30px 60px -30px rgba(69, 58, 48, 0.35);
}

/* ---------- ROOM COLORS ---------- */
.r-wall { fill: var(--wall); transition: fill 0.8s; }
.r-floor { fill: var(--wood); transition: fill 0.8s; }
.r-baseboard { fill: var(--wood-dark); transition: fill 0.8s; }
.r-rug { fill: #e9d7be; transition: fill 0.8s; }
.r-rug2 { fill: #e2cbab; transition: fill 0.8s; }
.evening .r-rug { fill: #514231; }
.evening .r-rug2 { fill: #5c4a36; }

.r-window-frame { fill: #fdf8ef; }
.evening .r-window-frame { fill: #24201a; }
.r-sky { fill: var(--sky); transition: fill 0.8s; }
.r-sun { fill: #f2c879; transition: opacity 0.8s, transform 0.8s var(--ease); transform-origin: 160px 180px; }
.evening .r-sun { opacity: 0; transform: translateY(40px); }
.r-stars circle { fill: #f2e9c9; opacity: 0; transition: opacity 0.8s; }
.evening .r-stars circle { opacity: 0.9; }
.r-hill { fill: #a9c0a0; transition: fill 0.8s; }
.r-hill2 { fill: #8fa383; transition: fill 0.8s; }
.evening .r-hill { fill: #2f3b33; }
.evening .r-hill2 { fill: #27332b; }
.r-window-bar { fill: #fdf8ef; }
.evening .r-window-bar { fill: #24201a; }
.r-sill { fill: #efe3d0; }
.evening .r-sill { fill: #2e2822; }

.r-curtain { fill: #ecd9c0; opacity: 0.96; transition: fill 0.8s; transform-origin: top center; animation: sway 7s ease-in-out infinite alternate; }
.c-right { animation-delay: -3.5s; }
@keyframes sway { from { transform: rotate(-0.6deg); } to { transform: rotate(0.7deg); } }
.evening .r-curtain { fill: #4a3d2e; }
.r-cornice { fill: var(--clay); }

.r-frame { fill: #caa26e; transition: fill 0.8s; }
.evening .r-frame { fill: #6b563a; }
.r-frame-inner, .r-photo { fill: #fdf8ef; }
.evening .r-frame-inner, .evening .r-photo { fill: #d8cbb4; }
.r-frame-line { fill: #d9c8ac; }
.r-seal { fill: var(--terra-soft); }
.r-photo-face { fill: #e8b48f; }
.r-photo-body { fill: var(--sage-soft); }

.r-shelf-side, .r-shelf-board { fill: #b98a5e; transition: fill 0.8s; }
.evening .r-shelf-side, .evening .r-shelf-board { fill: #5d4930; }
.b1 { fill: #c8704e; } .b2 { fill: #8fa383; } .b3 { fill: #e5cfa6; } .b4 { fill: #a86e8e; }
.r-plant-s { fill: none; stroke: #6f8a63; stroke-width: 3; stroke-linecap: round; }
.r-pot-s { fill: var(--terra-soft); }

.r-chair { fill: var(--terra); transition: fill 0.8s; }
.r-chair-dark { fill: var(--terra-dark); transition: fill 0.8s; }
.r-chair-arm { fill: var(--terra-dark); transition: fill 0.8s; }
.evening .r-chair { fill: #9c5b40; }
.evening .r-chair-dark, .evening .r-chair-arm { fill: #7e4831; }
.r-cushion { fill: var(--sage-soft); }
.evening .r-cushion { fill: #71805f; }
.r-blanket { fill: var(--sand); }
.r-leg { fill: #8a6a48; }

.r-lamp-shade { fill: #e8b96b; }
.r-lamp-pole { fill: #8a6a48; }
.r-lamp-base { fill: #8a6a48; }
.r-lamp-bulb { fill: #fff3d6; opacity: 0; transition: opacity 0.6s; }
.r-lamp-glow { fill: #f2c879; opacity: 0; transition: opacity 1s; pointer-events: none; }
.evening .r-lamp-glow { opacity: 0.16; }
.evening .r-lamp-bulb { opacity: 1; }

.r-table-top, .r-table-foot { fill: #b98a5e; }
.evening .r-table-top, .evening .r-table-foot { fill: #5d4930; }
.r-table-leg { fill: #a1764c; }
.evening .r-table-leg { fill: #4d3c27; }
.r-cup { fill: #fdf8ef; }
.r-cup-handle { fill: none; stroke: #fdf8ef; stroke-width: 5; }
.evening .r-cup { fill: #d8cbb4; }
.evening .r-cup-handle { stroke: #d8cbb4; }
.r-saucer { fill: #efe3d0; }
.evening .r-saucer { fill: #b5a98f; }
.r-steam path {
  fill: none; stroke: #bfb2a0; stroke-width: 3.5; stroke-linecap: round;
  opacity: 0.7; animation: steam 3s ease-in-out infinite;
}
.r-steam path:nth-child(2) { animation-delay: -1.5s; }
@keyframes steam {
  0% { transform: translateY(0); opacity: 0; }
  30% { opacity: 0.7; }
  100% { transform: translateY(-14px); opacity: 0; }
}

.r-leaf { fill: #7c9670; } .r-leaf2 { fill: #93ab85; }
.evening .r-leaf { fill: #43543c; } .evening .r-leaf2 { fill: #52654a; }
.r-pot { fill: var(--terra-soft); } .r-pot-rim { fill: var(--terra); }
.evening .r-pot { fill: #8a5f47; } .evening .r-pot-rim { fill: #9c5b40; }

.r-cat-body, .r-cat-head { fill: #6e5d4e; }
.evening .r-cat-body, .evening .r-cat-head { fill: #57493d; }
.r-cat-ear { fill: #57493d; }
.r-cat-tail { fill: none; stroke: #6e5d4e; stroke-width: 12; stroke-linecap: round; animation: tail 4s ease-in-out infinite alternate; transform-origin: 830px 652px; }
.evening .r-cat-tail { stroke: #57493d; }
@keyframes tail { from { transform: rotate(0deg); } to { transform: rotate(6deg); } }
.r-cat-face { fill: none; stroke: #2e2620; stroke-width: 2; stroke-linecap: round; }
.r-cat-zzz { fill: none; stroke: #a99a88; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; opacity: 0.8; animation: zzz 3s infinite; }
@keyframes zzz { 0% { opacity: 0; transform: translateY(0); } 40% { opacity: 0.8; } 100% { opacity: 0; transform: translateY(-8px); } }

.r-shadow { fill: rgba(69, 58, 48, 0.08); }

.t-ball { fill: #d4537e; }
.t-ball-stripe { fill: none; stroke: #fdf8ef; stroke-width: 4; stroke-linecap: round; }
.t-cube1 { fill: #8fa383; }
.t-cube2 { fill: #e8b96b; }
.t-pyr-base { fill: #c8704e; }
.t-pyr-mid { fill: #e8b96b; }
.t-pyr-top { fill: #8fa383; }
.t-pyr-tip { fill: #d4537e; }
.evening .t-ball { fill: #a24263; }
.evening .t-cube1 { fill: #6b7c60; }
.evening .t-cube2 { fill: #b08c50; }
.evening .t-pyr-base { fill: #9c5b40; }
.evening .t-pyr-mid { fill: #b08c50; }
.evening .t-pyr-top { fill: #6b7c60; }
.evening .t-pyr-tip { fill: #a24263; }

/* ---------- HOTSPOTS ---------- */
.hotspot { cursor: pointer; outline: none; transition: transform 0.4s var(--ease), filter 0.4s; }
.hotspot:hover, .hotspot:focus-visible {
  transform: translateY(-6px);
  filter: drop-shadow(0 10px 18px var(--accent-glow)) brightness(1.05);
}
.hotspot--lamp:hover, .hotspot--lamp:focus-visible { transform: none; }

.tooltip {
  position: absolute; pointer-events: none;
  background: var(--ink); color: var(--cream);
  font-size: 0.85rem; font-weight: 500;
  padding: 0.5rem 0.95rem; border-radius: 100px;
  opacity: 0; transform: translate(-50%, 8px);
  transition: opacity 0.25s, transform 0.25s var(--ease);
  white-space: nowrap; z-index: 10;
}
.tooltip.visible { opacity: 1; transform: translate(-50%, 0); }

.hero__legend {
  display: flex; flex-wrap: wrap; gap: 0.6rem; justify-content: center;
  margin-top: 1.6rem;
}
.hero__legend button {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-family: inherit; font-size: 0.85rem; color: var(--ink-soft);
  background: var(--paper); border: 1px solid var(--line);
  padding: 0.5rem 1rem; border-radius: 100px; cursor: pointer;
  transition: transform 0.3s var(--ease), border-color 0.3s, color 0.3s, background 0.8s;
}
.hero__legend button:hover { transform: translateY(-2px); border-color: var(--terra); color: var(--ink); }
.dot { width: 9px; height: 9px; border-radius: 50%; }
.dot--terra { background: var(--terra); }
.dot--sand { background: #caa26e; }
.dot--sage { background: var(--sage); }
.dot--clay { background: #e8b96b; }
.dot--sky { background: #9dbfb2; }

/* ---------- SECTIONS ---------- */
.section { padding: 6.5rem 4vw; }
.section--alt { background: var(--paper); transition: background 0.8s; }
.section__inner { max-width: 1060px; margin: 0 auto; }
.section__inner--narrow { max-width: 720px; }
.section__eyebrow {
  text-transform: uppercase; letter-spacing: 0.22em; font-size: 0.75rem;
  color: var(--terra); margin-bottom: 1rem; font-weight: 600;
}
.evening .section__eyebrow { color: var(--sand); }

.reveal { opacity: 0; transform: translateY(28px); transition: opacity 0.8s var(--ease), transform 0.8s var(--ease); }
.reveal.in { opacity: 1; transform: none; }

.ph {
  font-size: 0.72rem; color: #b0a08c; background: rgba(202, 162, 110, 0.14);
  padding: 0.1rem 0.45rem; border-radius: 4px; font-style: normal; font-weight: 500;
  white-space: nowrap;
}

/* about */
.about-grid { display: grid; grid-template-columns: 300px 1fr; gap: 3.5rem; align-items: start; }
.about-portrait__photo {
  width: 100%; display: block; border-radius: 20px;
  box-shadow: 0 24px 48px -24px rgba(69, 58, 48, 0.45);
}
.about-portrait__ph {
  aspect-ratio: 5 / 6; border-radius: 20px; background: var(--paper);
  border: 1px dashed #cbb894;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.5rem;
  color: #b0a08c; font-size: 0.85rem;
  transition: background 0.8s;
}
.about-portrait__ph svg { width: 45%; }
.about-portrait__ph svg circle, .about-portrait__ph svg path { fill: #e3d5bd; }
.evening .about-portrait__ph svg circle, .evening .about-portrait__ph svg path { fill: #4d4234; }
.about-portrait__caption {
  text-align: center; margin-top: 0.9rem; font-family: "Cormorant", serif;
  font-style: italic; font-size: 1.1rem; color: var(--ink-soft);
}
.lead { font-size: 1.25rem; font-family: "Cormorant", serif; font-weight: 500; line-height: 1.5; margin-bottom: 1.2rem; }
.about-text p:not(.lead) { color: var(--ink-soft); margin-bottom: 1.1rem; }
.about-tags { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1.5rem; }
.about-tags span {
  font-size: 0.82rem; padding: 0.4rem 0.9rem; border-radius: 100px;
  background: var(--accent-glow); color: var(--terra-dark);
  font-weight: 500;
}
.evening .about-tags span { color: var(--sand); }

/* timeline */
.timeline { display: flex; flex-direction: column; gap: 0; position: relative; }
.timeline__item {
  display: grid; grid-template-columns: 110px 1fr; gap: 2rem;
  padding: 1.6rem 0; border-bottom: 1px solid var(--line);
}
.timeline__item:last-child { border-bottom: none; }
.timeline__year {
  font-family: "Cormorant", serif; font-size: 1.6rem; font-style: italic;
  color: var(--terra); line-height: 1.2;
}
.evening .timeline__year { color: var(--sand); }
.timeline__item h3 { font-size: 1.35rem; margin-bottom: 0.3rem; }
.timeline__item p { color: var(--ink-soft); font-size: 0.97rem; }

/* notes */
.notes { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.6rem; }
.note {
  background: var(--paper); border: 1px solid var(--line);
  border-radius: 4px 18px 18px 18px; padding: 1.8rem 1.7rem;
  box-shadow: 0 14px 30px -18px rgba(69, 58, 48, 0.25);
  transition: transform 0.4s var(--ease), background 0.8s;
}
.note:hover { transform: translateY(-5px) rotate(0.4deg); }
.note--tilt { transform: rotate(-0.8deg); }
.note--tilt2 { transform: rotate(0.7deg); }
.note__date {
  font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.18em;
  color: #b0a08c; margin-bottom: 0.7rem;
}
.note h3 { font-size: 1.35rem; margin-bottom: 0.6rem; }
.note p:last-child { color: var(--ink-soft); font-size: 0.95rem; }
.note__link {
  display: inline-block; margin-top: 0.9rem; font-size: 0.88rem; font-weight: 600;
  color: var(--terra); text-decoration: none;
}
.note__link:hover { text-decoration: underline; }
.evening .note__link { color: var(--sand); }
.notes__cta { margin-top: 2.4rem; text-align: center; }
.btn-outline {
  display: inline-block; font-size: 0.95rem; font-weight: 600; text-decoration: none;
  padding: 0.8rem 1.7rem; border-radius: 100px;
  border: 1.5px solid var(--terra); color: var(--terra-dark);
  transition: background 0.25s, color 0.25s, transform 0.25s var(--ease);
}
.btn-outline:hover { background: var(--terra); color: #fff; transform: translateY(-2px); }
.evening .btn-outline { color: var(--sand); border-color: var(--sand); }
.evening .btn-outline:hover { background: var(--sand); color: var(--cream); }

/* sessions */
.sessions-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1.5rem; margin-bottom: 3.5rem; }
.session-card {
  position: relative; background: var(--cream); border: 1px solid var(--line);
  border-radius: 20px; padding: 2rem 1.7rem;
  transition: transform 0.4s var(--ease), background 0.8s;
}
.session-card:hover { transform: translateY(-5px); }
.session-card--main { border: 2px solid var(--terra); }
.session-card__badge {
  position: absolute; top: -0.8rem; left: 1.4rem;
  background: var(--terra); color: #fff; font-size: 0.72rem; font-weight: 600;
  padding: 0.25rem 0.8rem; border-radius: 100px; letter-spacing: 0.05em;
}
.session-card__icon { color: var(--terra); margin-bottom: 1rem; }
.evening .session-card__icon { color: var(--sand); }
.session-card__icon svg { width: 40px; height: 40px; }
.session-card h3 { font-size: 1.45rem; margin-bottom: 0.5rem; }
.session-card p { color: var(--ink-soft); font-size: 0.94rem; }
.session-card__price {
  margin-top: 1.1rem; font-weight: 600; color: var(--ink) !important;
  font-size: 1rem !important;
}
.sessions-how h3 { font-size: 1.7rem; margin-bottom: 1.5rem; }
.steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.5rem; }
.step { display: flex; gap: 1rem; align-items: flex-start; }
.step span {
  flex-shrink: 0; width: 38px; height: 38px; border-radius: 50%;
  background: var(--accent-glow); color: var(--terra-dark);
  display: flex; align-items: center; justify-content: center;
  font-family: "Cormorant", serif; font-size: 1.25rem; font-weight: 600;
}
.evening .step span { color: var(--sand); }
.step p { color: var(--ink-soft); font-size: 0.94rem; }

/* reviews */
.reviews { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 1.6rem; }
.reviews blockquote {
  font-family: "Cormorant", serif; font-size: 1.25rem; font-style: italic; line-height: 1.5;
  background: var(--paper); border-left: 3px solid var(--terra);
  padding: 1.6rem 1.6rem 1.4rem; border-radius: 0 16px 16px 0;
  transition: background 0.8s;
}
.evening .reviews blockquote { border-left-color: var(--sand); }
.reviews footer {
  margin-top: 1rem; font-family: "Inter", sans-serif; font-size: 0.85rem;
  font-style: normal; color: var(--ink-soft);
}

/* booking chat */
.section--booking { background: var(--paper); transition: background 0.8s; }
.booking-sub { color: var(--ink-soft); margin: -1.4rem 0 2.2rem; }
.chat {
  background: var(--cream); border: 1px solid var(--line); border-radius: 24px;
  padding: 1.6rem; box-shadow: 0 24px 50px -30px rgba(69, 58, 48, 0.3);
  transition: background 0.8s;
}
.chat__log { display: flex; flex-direction: column; gap: 0.8rem; min-height: 120px; }
.msg {
  max-width: 82%; padding: 0.8rem 1.15rem; border-radius: 18px;
  font-size: 0.95rem; line-height: 1.55;
  animation: msgIn 0.45s var(--ease) both;
}
@keyframes msgIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.msg--bot { background: var(--paper); border: 1px solid var(--line); border-radius: 4px 18px 18px 18px; align-self: flex-start; }
.msg--user { background: var(--terra); color: #fff; border-radius: 18px 4px 18px 18px; align-self: flex-end; }
.msg--typing { display: inline-flex; gap: 5px; align-items: center; padding: 1rem 1.2rem; }
.msg--typing i {
  width: 7px; height: 7px; border-radius: 50%; background: var(--ink-soft);
  animation: blink 1.2s infinite;
}
.msg--typing i:nth-child(2) { animation-delay: 0.2s; }
.msg--typing i:nth-child(3) { animation-delay: 0.4s; }
@keyframes blink { 0%, 70%, 100% { opacity: 0.3; } 35% { opacity: 1; } }

.chat__input { margin-top: 1.1rem; display: flex; flex-wrap: wrap; gap: 0.6rem; }
.chip {
  font-family: inherit; font-size: 0.9rem; font-weight: 500;
  background: var(--paper); color: var(--ink); border: 1.5px solid var(--line);
  padding: 0.6rem 1.15rem; border-radius: 100px; cursor: pointer;
  transition: border-color 0.25s, transform 0.25s var(--ease);
  animation: msgIn 0.45s var(--ease) both;
}
.chip:hover { border-color: var(--terra); transform: translateY(-2px); }
.chat__field { display: flex; gap: 0.6rem; flex: 1; animation: msgIn 0.45s var(--ease) both; }
.chat__field input {
  flex: 1; font-family: inherit; font-size: 0.95rem;
  padding: 0.75rem 1.15rem; border-radius: 100px;
  border: 1.5px solid var(--line); background: var(--paper); color: var(--ink);
  outline: none; transition: border-color 0.25s;
}
.chat__field input:focus { border-color: var(--terra); }
.chat__field button {
  font-family: inherit; font-size: 0.95rem; font-weight: 600;
  background: var(--terra); color: #fff; border: none;
  padding: 0.75rem 1.4rem; border-radius: 100px; cursor: pointer;
  transition: background 0.25s, transform 0.25s var(--ease);
}
.chat__field button:hover { background: var(--terra-dark); transform: translateY(-2px); }

.chat-final { display: flex; flex-wrap: wrap; gap: 0.7rem; margin-top: 0.4rem; animation: msgIn 0.5s var(--ease) both; }
.chat-final a, .chat-final button {
  font-family: inherit; font-size: 0.92rem; font-weight: 600; text-decoration: none;
  display: inline-flex; align-items: center; gap: 0.45rem;
  padding: 0.7rem 1.3rem; border-radius: 100px; cursor: pointer;
  border: 1.5px solid var(--terra); color: var(--terra-dark); background: transparent;
  transition: background 0.25s, color 0.25s, transform 0.25s var(--ease);
}
.chat-final a:hover, .chat-final button:hover { background: var(--terra); color: #fff; transform: translateY(-2px); }
.evening .chat-final a, .evening .chat-final button { color: var(--sand); border-color: var(--sand); }
.evening .chat-final a:hover, .evening .chat-final button:hover { background: var(--sand); color: var(--cream); }

.booking-alt { margin-top: 1.8rem; font-size: 0.92rem; color: var(--ink-soft); text-align: center; }
.ph-link { color: var(--terra); font-weight: 600; }

/* footer */
.footer { background: var(--ink); color: #cfc4b4; padding: 3.5rem 4vw; text-align: center; transition: background 0.8s; }
.evening .footer { background: #201a14; }
.footer__logo { font-family: "Cormorant", serif; font-size: 1.9rem; color: #f7f1e8; }
.footer__logo span { color: var(--terra-soft); }
.footer p { font-size: 0.9rem; }
.footer__note { max-width: 480px; margin: 1.2rem auto 0; font-size: 0.82rem; opacity: 0.75; }
.footer__fine { margin-top: 1.6rem; font-size: 0.78rem; opacity: 0.5; }

/* toast */
.toast {
  position: fixed; left: 50%; bottom: 2rem; transform: translate(-50%, 20px);
  max-width: min(420px, 88vw);
  background: var(--ink); color: var(--cream);
  padding: 1rem 1.4rem; border-radius: 18px; font-size: 0.93rem; line-height: 1.5;
  opacity: 0; pointer-events: none; z-index: 60;
  transition: opacity 0.4s, transform 0.4s var(--ease);
  box-shadow: 0 20px 40px -20px rgba(0, 0, 0, 0.4);
}
.toast.visible { opacity: 1; transform: translate(-50%, 0); }

/* responsive */
@media (max-width: 820px) {
  .nav__links a:not(.nav__cta) { display: none; }
  .about-grid { grid-template-columns: 1fr; gap: 2rem; }
  .about-portrait { max-width: 260px; margin: 0 auto; }
  .timeline__item { grid-template-columns: 72px 1fr; gap: 1.1rem; }
  .section { padding: 4.5rem 5vw; }
  .hero { padding-top: 6rem; }
  .br-wide { display: none; }
}