/* Warm beige palette for the public website. */
:root {
  color-scheme: light;
  --bg: #e8e0d4;
  --bg-2: #ddd3c5;
  --surface: #f3ede3;
  --surface-2: #e9dfd0;
  --surface-strong: #f3ede3;
  --text: #302820;
  --muted: #65594d;
  --dim: #786b5c;
  --line: rgba(96, 72, 43, .18);
  --line-strong: rgba(96, 72, 43, .36);
  --gold: #bd9250;
  --gold-2: #805c28;
  --shadow: 0 24px 66px rgba(74, 55, 31, .1);
  --shadow-soft: 0 16px 38px rgba(74, 55, 31, .08);
}
body {
  background: radial-gradient(ellipse at 10% 0%, #dfd0b9 0%, transparent 38%), #e8e0d4;
}
body::before, body::after { opacity: .12; }
.noise { opacity: .02; mix-blend-mode: multiply; }
.header { background: rgba(243, 237, 227, .97); border-color: var(--line); }
.nav a, .hero-text, label, .world-card,
.booking-live-summary p:last-child, .meeting-detail-tags span,
.meeting-status-tabs button, .meetings-simple-grid .meeting-datetime.is-past {
  color: var(--muted);
}
.nav a:hover, .nav a:focus-visible, .nav a.is-active {
  color: var(--gold-2);
  background: #e6d7bf;
}
.logo, .burger, .btn-secondary, .carousel-arrow, .meetings-arrow,
.tarologists-arrow, .quick-booking {
  background: #f3ede3;
  color: var(--text);
  border-color: var(--line);
}
.btn-secondary:hover, .btn-secondary:focus-visible,
.carousel-arrow:hover, .carousel-arrow:focus-visible,
.quick-booking:hover, .quick-booking:focus-visible {
  background: #e6d7bf;
}
.btn-primary, .nav a.nav-hot,
.meaning-direction-button, .meaning-card-front .meaning-direction-button,
.meaning-service-tabs button.is-active,
.meaning-service-tabs button:hover, .meaning-service-tabs button:focus-visible,
.meeting-status-tabs button.is-active,
.meeting-status-tabs button:hover, .meeting-status-tabs button:focus-visible,
.timeline-item span, .schedule-card .day, .ritual-list article span,
.quick-booking span, .evening-glow-tag,
.slot-chip.active, .booking-time-panel .slot-chip.active,
.booking-category-tabs button.is-active, .booking-calendar-grid button.is-selected {
  color: #302312;
  background: linear-gradient(135deg, #f5e3bc, #ddba7d);
  border-color: #c69e62;
  text-shadow: none;
}
.hero-bg-layer {
  background: linear-gradient(90deg, rgba(20,15,12,.48), rgba(20,15,12,.28) 48%, rgba(20,15,12,.06));
}
.hero-bg-slideshow { background: #211b16; }
.hero-bg-slide { filter: saturate(.96) contrast(1.04); }
.hero h1, .hero-copy .eyebrow { color: #fff8ed; text-shadow: 0 2px 10px rgba(0,0,0,.55); }
.meaning-direction > .meaning-card-back,
.tarologist-card, .booking-card, .mystic-menu, .timeline, .contacts-panel,
.evening-card, .schedule-card, .ritual-list article, .privacy-card,
.privacy-summary, .evening-cta, .stats div,
.meaning-detail, .modal-window, .booking-window, .reader-window,
.meeting-detail-panel {
  background: #f3ede3;
  border-color: var(--line);
  box-shadow: var(--shadow-soft);
}
.tarologist-card:hover, .tarologist-card:focus-within {
  box-shadow: 0 24px 60px rgba(74,55,31,.16);
}
.kamchatka-menu[data-menu-world] {
  --world-ink: #65594d;
  --world-line: rgba(96,72,43,.2);
}
.mystic-menu { background: linear-gradient(145deg, #f3ede3, #e9dfd0); }
.world-card.is-active, .world-card:hover, .world-card:focus-visible {
  color: #75501e;
  border-color: #9d763e;
}
.mystic-drink-card, .mystic-drink-card.is-active,
.meaning-service-tabs button, .meeting-status-tabs button,
.tarologist-tags span, .reader-facts span, .evening-card .meta span,
.schedule-card .meta span, .slot-chip, .meaning-detail-mark,
.reader-services-list article, .meeting-detail-tags span,
.booking-live-summary, .booking-calendar, .booking-final-summary,
.booking-service-option, .booking-specialist-option, .slot-info {
  background-color: #e9dfd0;
  border-color: var(--line);
}
.mystic-drink-card:hover, .mystic-drink-card:focus-visible { background: #eee2ce; }
.meaning-detail-close, .modal-close {
  color: var(--text);
  background: #e9dfd0;
  border-color: var(--line);
}
input, select, textarea, .booking-client-fields input,
.booking-client-fields textarea, .booking-progress button span,
.booking-wizard-summary {
  color: var(--text);
  background: #faf7f1;
  border-color: var(--line-strong);
}
input::placeholder, textarea::placeholder { color: #827567; }
.booking-step-actions { background: linear-gradient(to top, #f3ede3 70%, rgba(243,237,227,.95)); }
.booking-calendar-grid button:disabled,
.booking-calendar-grid button.is-outside { color: #a99f93; }
.evening-card .btn.is-complete { color: var(--muted); background: #eee9e1; }
/* Keep captions readable on the original photographs and artwork. */
.meaning-card-front, .evenings-hero-card, .meeting-slot-card.has-event,
.tarologist-photo figcaption, .map-link, .evening-sticker {
  --text: #fffaf1;
  --muted: #eee5d6;
  --dim: #dfd1bc;
  --gold-2: #fff0bd;
  color: #fffaf1;
}
.evenings-hero-card .hero-text { color: #eee5d6; }
@media (max-width: 900px) {
  .nav { background: rgba(243,237,227,.98); border-color: var(--line); }
}
@media (max-width: 760px) {
  .hero-bg-layer {
    background: linear-gradient(90deg, rgba(20,15,12,.50), rgba(20,15,12,.28));
  }
}

.header { box-shadow: 0 8px 28px rgba(74,55,31,.1); }
.eyebrow { color: var(--gold-2); }
.support-caption { color: var(--muted); }

.hero-copy .hero-text { color: #fff8ed; text-shadow: 0 1px 8px rgba(0,0,0,.7); }
.hero-copy h1 { color: #fff8ed; }
.evening-card-content h3 { color: #49361f; }
.evening-card-content p { color: #51463b; }
.tarologists-grid.is-orbit-ready > .tarologist-card {
  opacity: 1 !important;
  filter: none !important;
}
.meaning-card-front h3 { color: #fffaf1; text-shadow: 0 2px 6px #000; }
.meaning-direction > .meaning-card-front::after {
  background: linear-gradient(180deg, rgba(8,4,3,.16), rgba(8,4,3,.68) 55%, rgba(8,4,3,.92));
}
:focus-visible { outline-color: #805c28; }
.nav a[aria-current="page"] { color: #654516; background: #e6d7bf; }
.cooperation-main {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.2fr);
  align-items: start;
  gap: clamp(28px, 5vw, 72px);
  padding-top: 150px;
}
.cooperation-intro h1 { font-size: clamp(36px, 4.2vw, 56px); overflow-wrap: anywhere; line-height: 1.08; margin: 16px 0 24px; }
.cooperation-intro > p { color: #51463b; line-height: 1.8; }
.cooperation-note { background: #e2d5c2; border-radius: 10px; padding: 22px; margin-top: 30px; }
.cooperation-note strong { color: #49361f; }
.cooperation-note p { color: #51463b; margin: 10px 0 0; line-height: 1.65; }
.cooperation-card { background: #f3ede3; border: 1px solid var(--line); border-radius: 16px; padding: clamp(20px, 3vw, 36px); box-shadow: var(--shadow-soft); }
.cooperation-card h2 { font-size: clamp(28px, 3vw, 38px); margin: 0 0 12px; }
.cooperation-help { color: #65594d; font-size: 14px; margin-bottom: 28px; }
.cooperation-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.cooperation-fields label { display: grid; align-content: start; gap: 9px; font-size: 14px; font-weight: 700; color: #302820; }
.cooperation-fields input, .cooperation-fields textarea, .cooperation-fields select { width: 100%; min-width: 0; min-height: 48px; background: #faf7f1; color: #302820; font-weight: 400; }
.cooperation-fields textarea { resize: vertical; }
.cooperation-fields small { font-size: 12px; font-weight: 400; color: #65594d; }
.cooperation-full { grid-column: 1 / -1; }
#checkCooperation { width: 100%; margin-top: 26px; }
.cooperation-status { color: #315b3a; font-size: 14px; line-height: 1.65; margin: 16px 0 0; }
.cooperation-status:empty { display: none; }
@media (min-width: 901px) {
  .nav { gap: 5px; }
  .nav a { font-size: 13px; padding-inline: 9px; }
}
@media (max-width: 900px) {
  .cooperation-main { grid-template-columns: minmax(0, 1fr); padding-top: 110px; }
  .cooperation-intro h1 br { display: none; }
}
@media (max-width: 560px) {
  .cooperation-fields { grid-template-columns: minmax(0, 1fr); }
}

.cooperation-phone {
  display: flex;
  align-items: center;
  min-width: 0;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  background: #faf7f1;
}
.cooperation-phone-prefix {
  padding-left: 14px;
  color: #302820;
  font-size: 16px;
  font-weight: 600;
}
.cooperation-fields .cooperation-phone input {
  border: 0;
  background: transparent;
  padding-left: 10px;
  box-shadow: none;
}
.cooperation-phone:focus-within {
  outline: 2px solid #805c28;
  outline-offset: 2px;
}
.cooperation-phone input:focus-visible { outline: none; }

/* Soft category colours echo the warm neutral site palette. */
.kamchatka-menu[data-menu-world="hot"], .world-card-hot {
  --menu-tint: #f1dfd1;
  --menu-paper: #f8eee5;
  --menu-accent: #85482d;
  --menu-line: #c29375;
  --world-rgb: 175, 108, 68;
}
.kamchatka-menu[data-menu-world="cold"], .world-card-cold {
  --menu-tint: #d9e7ec;
  --menu-paper: #eef4f5;
  --menu-accent: #365d70;
  --menu-line: #8eafb9;
  --world-rgb: 97, 150, 173;
}
.kamchatka-menu[data-menu-world="tea"], .world-card-tea {
  --menu-tint: #dfe7d6;
  --menu-paper: #f0f3e9;
  --menu-accent: #48603a;
  --menu-line: #9aad87;
  --world-rgb: 119, 149, 96;
}
.kamchatka-menu[data-menu-world="mystery"], .world-card-mystery {
  --menu-tint: #e5dced;
  --menu-paper: #f3edf6;
  --menu-accent: #654776;
  --menu-line: #ad94bd;
  --world-rgb: 143, 112, 164;
}
.kamchatka-menu[data-menu-world] {
  --world-accent: var(--menu-accent);
  --world-soft: rgba(var(--world-rgb), .1);
  --world-line: var(--menu-line);
}
.kamchatka-menu .mystic-menu {
  background: linear-gradient(145deg, var(--menu-paper), var(--menu-tint));
  border-color: var(--menu-line);
  box-shadow: 0 18px 48px rgba(var(--world-rgb), .12);
}
.kamchatka-menu .world-card {
  color: var(--menu-accent);
  background: var(--menu-paper);
  border: 1px solid var(--menu-line);
  border-radius: 10px;
  transition: background .2s ease, box-shadow .2s ease, transform .2s ease;
}
.kamchatka-menu .world-card.is-active,
.kamchatka-menu .world-card:hover,
.kamchatka-menu .world-card:focus-visible {
  color: var(--menu-accent);
  background: var(--menu-tint);
  border-color: var(--menu-accent);
}
.kamchatka-menu .world-card.is-active {
  box-shadow: inset 0 -3px 0 var(--menu-accent);
}
.kamchatka-menu .world-card:focus-visible {
  outline: 2px solid var(--menu-accent);
  outline-offset: 3px;
}
.kamchatka-menu .selected-drink-detail h3,
.kamchatka-menu .selected-drink-detail strong,
.kamchatka-menu .selected-drink-detail .eyebrow,
.kamchatka-menu .mystery-coffee-description h3,
.kamchatka-menu .mystery-coffee-description strong,
.kamchatka-menu .mystery-coffee-description .eyebrow {
  color: var(--menu-accent);
}
.kamchatka-menu .mystic-drink-card {
  background: var(--menu-paper);
  border-color: var(--menu-line);
}
.kamchatka-menu .mystic-drink-card.is-active,
.kamchatka-menu .mystic-drink-card:hover,
.kamchatka-menu .mystic-drink-card:focus-visible {
  background: var(--menu-tint);
  border-color: var(--menu-accent);
}

/* Centre the brand artwork within the header without a second frame. */
.header .logo {
  justify-content: center;
  align-self: center;
  height: calc(var(--header-h) - 16px);
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  border-radius: 7px;
}
.header .logo-image {
  width: auto;
  height: 100%;
  object-fit: contain;
  border-radius: 7px;
  filter: none;
}
.cooperation-card h2 { margin-bottom: 24px; }

.hero-bg-slide-3 {
  background-image: url("assets/hero-kamchatka-coffee.png");
  background-position: center 88%;
}
@media (max-width: 760px) {
  .hero-bg-slide-3 { background-position: center 70%; }
}

/* Coffee cup booking control. Its original Yclients behaviour is retained. */
.floating-booking {
  right: max(16px, env(safe-area-inset-right));
  bottom: max(14px, env(safe-area-inset-bottom));
  width: 126px;
  height: 136px;
  padding: 0;
  border: 0;
  border-radius: 18px;
  background: transparent;
  box-shadow: none;
  animation: none;
  filter: drop-shadow(0 5px 8px rgba(39,24,12,.28));
}
.floating-booking::before, .floating-booking::after { content: none; }
.floating-booking .booking-cup-art { width: 100%; height: 100%; overflow: visible; }
.floating-booking strong {
  position: absolute;
  left: 18%;
  top: 57%;
  width: 57%;
  max-width: none;
  color: #3f2816;
  font-size: 14px;
  line-height: 1.15;
  text-shadow: 0 1px 0 rgba(255,255,255,.4);
  pointer-events: none;
}
.floating-booking:hover, .floating-booking:focus-visible {
  right: max(16px, env(safe-area-inset-right));
  box-shadow: none;
  filter: drop-shadow(0 7px 10px rgba(39,24,12,.35));
  transform: translateY(-3px);
}
.floating-booking:focus-visible { outline: 2px solid #805c28; outline-offset: 4px; }
.booking-steam { filter: drop-shadow(0 1px 1px rgba(80,55,35,.45)); pointer-events: none; }
.booking-steam-wisp { animation: bookingCupSteam 3.6s ease-in-out infinite; }
.booking-steam-wisp:nth-child(2) { animation-delay: -1.2s; }
.booking-steam-wisp:nth-child(3) { animation-delay: -2.4s; }
@keyframes bookingCupSteam {
  0% { opacity: 0; transform: translate(0, 7px); }
  30% { opacity: .85; }
  70% { opacity: .45; }
  100% { opacity: 0; transform: translate(4px, -10px); }
}
@media (max-width: 760px) {
  .floating-booking { width: 104px; height: 112px; }
  .floating-booking strong { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .booking-steam-wisp { animation: none; opacity: .65; }
}
