/* ============================================================
   Casa Alpina — Main Stylesheet
   Fonts: Playfair Display (serif) + Source Sans 3 (sans)
   Color scheme: black/white minimal with primary = #1a1a1a
   ============================================================ */

/* ── Reset & Base ────────────────────────────────────────── */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  overflow-x: hidden;
}

:root {
  --font-serif: 'Playfair Display', Georgia, serif;
  --font-sans: 'Source Sans 3', system-ui, sans-serif;

  --bg: #ffffff;
  --fg: #111111;
  --primary: #111111;
  --primary-fg: #ffffff;
  --accent: #00a4d6;
  --secondary: oklch(0.96 0.01 220);
  --secondary-fg: oklch(0.30 0.02 220);
  --muted: #f5f5f5;
  --muted-fg: #6b7280;
  --border: #e5e7eb;
  --input: #e5e7eb;
  --card-bg: #ffffff;
  --radius: 0.625rem;
  --radius-sm: 0.375rem;
  --radius-lg: 1rem;
  --radius-xl: 1.25rem;
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, .08), 0 1px 2px rgba(0, 0, 0, .05);
  --shadow: 0 4px 12px rgba(0, 0, 0, .08);
  --shadow-lg: 0 10px 30px rgba(0, 0, 0, .12);
  --shadow-xl: 0 20px 50px rgba(0, 0, 0, .15);
  --transition: .2s ease;
  --container: 1280px;
  --casa-green: #00b497;
  --header-h: 4rem;
  --header-full-h: 6rem;
  /* header-main + topbar on desktop */
}

html {
  scroll-behavior: smooth;
  font-size: 17.5px;
}

/* +1.5px для основного текста (16→17.5), заголовки компенсированы ниже */

body {
  font-family: var(--font-sans);
  color: var(--fg);
  background: var(--bg);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  width: 100%;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  cursor: pointer;
  font-family: inherit;
}

ul,
ol {
  list-style: none;
}

/* ── Container ───────────────────────────────────────────── */
.container {
  max-width: var(--container);
  margin: 0 auto;
  padding-left: max(1rem, env(safe-area-inset-left));
  padding-right: max(1rem, env(safe-area-inset-right));
  width: 100%;
  box-sizing: border-box;
}

@media (min-width: 640px) {
  .container {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}

@media (min-width: 1024px) {
  .container {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

/* ── Typography ──────────────────────────────────────────── */
.font-serif {
  font-family: var(--font-serif);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-serif);
  line-height: 1.25;
}

h1 {
  font-size: clamp(1.83rem, 4.57vw, 3.43rem);
  font-weight: 600;
}

/* компенсация: 32/60px при base 17.5 */
h2 {
  font-size: clamp(1.37rem, 2.74vw, 2.29rem);
  font-weight: 600;
}

/* компенсация: 24/40px */
h3 {
  font-size: clamp(1.03rem, 1.83vw, 1.37rem);
  font-weight: 600;
}

/* компенсация: 18/24px */

.text-muted {
  color: var(--muted-fg);
}

.text-primary {
  color: var(--primary);
}

.text-sm {
  font-size: .875rem;
}

.text-xs {
  font-size: .75rem;
}

.text-lg {
  font-size: 1.125rem;
}

.text-xl {
  font-size: 1.25rem;
}

.text-2xl {
  font-size: 1.5rem;
}

.text-3xl {
  font-size: 1.875rem;
}

.text-4xl {
  font-size: 2.25rem;
}

.text-5xl {
  font-size: 3rem;
}

.text-center {
  text-align: center;
}

.font-semibold {
  font-weight: 600;
}

.font-medium {
  font-weight: 500;
}

.leading-relaxed {
  line-height: 1.75;
}

/* ── Buttons ─────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: .625rem 1.25rem;
  font-family: var(--font-sans);
  font-size: .9375rem;
  font-weight: 500;
  border-radius: var(--radius);
  border: 1.5px solid transparent;
  transition: background var(--transition), color var(--transition), border-color var(--transition), box-shadow var(--transition);
  cursor: pointer;
  white-space: nowrap;
  text-decoration: none;
}

.btn-primary {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}

.btn-primary:hover {
  background: #008bb8;
  border-color: #008bb8;
}

.btn-secondary {
  background: var(--secondary);
  color: var(--secondary-fg);
  border-color: var(--secondary);
}

.btn-secondary:hover {
  background: #e8e8e8;
}

.btn-outline {
  background: transparent;
  color: var(--fg);
  border-color: var(--border);
}

.btn-outline:hover {
  background: var(--secondary);
}

.btn-outline-white {
  background: transparent;
  color: #fff;
  border-color: rgba(255, 255, 255, .4);
}

.btn-outline-white:hover {
  background: rgba(255, 255, 255, .1);
}

.btn-lg {
  padding: .875rem 2rem;
  font-size: 1rem;
}

.btn-sm {
  padding: .375rem .875rem;
  font-size: .8125rem;
}

.btn-full {
  width: 100%;
}

.btn .icon,
.btn svg {
  width: 1.1em;
  height: 1.1em;
  flex-shrink: 0;
}

/* ── Icons ───────────────────────────────────────────────── */
.icon {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
}

.icon-sm {
  width: .875rem;
  height: .875rem;
  flex-shrink: 0;
}

.icon-lg {
  width: 1.5rem;
  height: 1.5rem;
  flex-shrink: 0;
}

.icon-xl {
  width: 2rem;
  height: 2rem;
  flex-shrink: 0;
}

.icon--accent {
  color: var(--accent);
}

/* ── Badge ───────────────────────────────────────────────── */
.badge {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  padding: .25rem .75rem;
  border-radius: 9999px;
  font-size: .8rem;
  font-weight: 500;
  line-height: 1.4;
}

.badge--secondary {
  background: var(--secondary);
  color: var(--secondary-fg);
}

.badge--outline {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--secondary-fg);
}

.badge--primary {
  background: var(--primary);
  color: var(--primary-fg);
}

.badge--accent {
  background: var(--accent);
  color: #fff;
}

.badge--white {
  background: rgba(255, 255, 255, .9);
  color: var(--fg);
}

.badge--colored {
  color: #fff;
  border: none;
}

/* ── Card ────────────────────────────────────────────────── */
.card {
  background: var(--card-bg);
  border: 1.5px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: box-shadow var(--transition), border-color var(--transition);
}

.card:hover {
  box-shadow: var(--shadow-lg);
}

.card--featured {
  border-color: var(--primary);
  border-width: 2px;
}

.card-body {
  padding: 1.5rem;
}

.card-img {
  position: relative;
  overflow: hidden;
}

.card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}

.card:hover .card-img img {
  transform: scale(1.05);
}

/* ── Separator ───────────────────────────────────────────── */
.separator {
  height: 1px;
  background: var(--border);
  border: none;
  margin: 2rem 0;
}

/* ── Forms ───────────────────────────────────────────────── */
.form-group {
  margin-bottom: 1.25rem;
}

.form-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

@media (max-width: 640px) {
  .form-grid-2 {
    grid-template-columns: 1fr;
  }
}

label {
  display: block;
  font-size: .875rem;
  font-weight: 500;
  margin-bottom: .35rem;
}

.form-required::after {
  content: ' *';
  color: #e53e3e;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="number"],
input[type="date"],
input[type="password"],
select,
textarea {
  width: 100%;
  padding: .625rem .875rem;
  border: 1.5px solid var(--input);
  border-radius: var(--radius);
  font-family: var(--font-sans);
  font-size: .9375rem;
  color: var(--fg);
  background: var(--bg);
  transition: border-color var(--transition), box-shadow var(--transition);
  outline: none;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(17, 17, 17, .08);
}

textarea {
  resize: vertical;
  min-height: 120px;
}

select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .75rem center;
  background-size: 1rem;
  padding-right: 2.5rem;
}

/* ── Alert ───────────────────────────────────────────────── */
.alert {
  padding: 1rem 1.25rem;
  border-radius: var(--radius);
  margin-bottom: 1rem;
  font-size: .9375rem;
}

.alert-success {
  background: #f0fdf4;
  color: #166534;
  border: 1px solid #bbf7d0;
}

.alert-error {
  background: #fef2f2;
  color: #991b1b;
  border: 1px solid #fecaca;
}

/* ── Utilities ───────────────────────────────────────────── */
.mt-4 {
  margin-top: 1rem;
}

.mt-6 {
  margin-top: 1.5rem;
}

.mt-8 {
  margin-top: 2rem;
}

.mb-4 {
  margin-bottom: 1rem;
}

.mb-6 {
  margin-bottom: 1.5rem;
}

.mb-8 {
  margin-bottom: 2rem;
}

.mb-12 {
  margin-bottom: 3rem;
}

.gap-2 {
  gap: .5rem;
}

.gap-3 {
  gap: .75rem;
}

.gap-4 {
  gap: 1rem;
}

.flex {
  display: flex;
}

.flex-col {
  flex-direction: column;
}

.items-center {
  align-items: center;
}

.justify-center {
  justify-content: center;
}

.justify-between {
  justify-content: space-between;
}

.flex-wrap {
  flex-wrap: wrap;
}

.flex-1 {
  flex: 1;
}

.grid {
  display: grid;
}

.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

.overflow-hidden {
  overflow: hidden;
}

.rounded {
  border-radius: var(--radius);
}

.rounded-full {
  border-radius: 9999px;
}

.w-full {
  width: 100%;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.animate-bounce {
  animation: bounce 1.5s infinite;
}

@keyframes bounce {

  0%,
  100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  50% {
    transform: translateY(0);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }
}

/* ─────────────────────────────────────────────────────────
   HEADER
   ───────────────────────────────────────────────────────── */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(255, 255, 255, .95);
  border-bottom: 1px solid var(--border);
}

@media (max-width: 1023px) {
  .site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
  }

  body {
    padding-top: var(--header-h);
  }
}

@supports (backdrop-filter: blur(8px)) or (-webkit-backdrop-filter: blur(8px)) {
  .site-header {
    background: rgba(255, 255, 255, .6);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }
}

.header-topbar {
  background: var(--accent);
  color: #fff;
  font-size: .8125rem;
  display: none;
}

@media (min-width: 768px) {
  .header-topbar {
    display: block;
  }
}

.header-topbar .container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: .5rem;
  padding-bottom: .5rem;
}

.topbar-left {
  display: flex;
  gap: 1.5rem;
  align-items: center;
}

.topbar-right {
  opacity: .75;
}

.topbar-link {
  display: inline-flex;
  align-items: center;
  gap: .375rem;
  color: #fff;
  opacity: .9;
  transition: opacity var(--transition);
}

.topbar-link:hover {
  opacity: 1;
}

.header-main {
  padding: 0;
  overflow: hidden;
}

.header-inner {
  display: flex;
  align-items: center;
  height: var(--header-h);
  gap: 1rem;
  min-width: 0;
}

.header-logo {
  flex-shrink: 0;
}

.header-logo img {
  height: 2.5rem;
  width: auto;
}

.header-nav {
  display: none;
  flex: 1;
  justify-content: center;
  gap: .1rem;
}

@media (min-width: 1024px) {
  .header-nav {
    display: flex;
  }
}

.nav-link {
  padding: .5rem 1rem;
  font-size: .9rem;
  font-weight: 500;
  color: rgba(17, 17, 17, .75);
  border-radius: var(--radius);
  transition: color var(--transition), background var(--transition);
}

.nav-link:hover,
.nav-link--active {
  color: var(--fg);
  background: var(--secondary);
}

.lang-switcher {
  display: none;
  align-items: center;
  gap: .25rem;
}

@media (min-width: 768px) {
  .lang-switcher {
    display: flex;
  }
}

.lang-btn {
  padding: .2rem .5rem;
  font-size: .75rem;
  font-weight: 600;
  color: var(--muted-fg);
  border-radius: var(--radius-sm);
  border: 1px solid transparent;
  transition: all var(--transition);
  letter-spacing: .03em;
}

.lang-btn:hover {
  color: var(--fg);
  border-color: var(--border);
}

.lang-btn--active {
  color: var(--accent);
  border-color: var(--accent);
  background: var(--secondary);
}

.header-cta {
  display: none;
}

@media (min-width: 1024px) {
  .header-cta {
    display: inline-flex;
  }
}

.burger {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border: none;
  background: transparent;
  color: var(--fg);
  border-radius: var(--radius);
  transition: background var(--transition);
  margin-left: auto;
}

.burger svg {
  width: 1.5rem;
  height: 1.5rem;
}

.burger:hover {
  background: var(--secondary);
}

@media (min-width: 1024px) {
  .burger {
    display: none;
  }
}

/* Mobile drawer */
.mobile-drawer {
  position: fixed;
  inset: 0 0 0 auto;
  width: min(320px, 90vw);
  background: var(--bg);
  z-index: 10000;
  transform: translateX(100%);
  transition: transform .3s cubic-bezier(.4, 0, .2, 1);
  box-shadow: var(--shadow-xl);
  overflow-y: auto;
  visibility: hidden;
  pointer-events: none;
}

.mobile-drawer.is-open {
  transform: translateX(0);
  visibility: visible;
  pointer-events: auto;
}

.drawer-overlay {
  display: none;
  position: fixed;
  inset: 0;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, .4);
  z-index: 9999;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

.drawer-overlay.is-visible {
  display: block;
}

.mobile-drawer__inner {
  padding: 1rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-height: 100%;
}

.mobile-drawer__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.drawer-close {
  width: 2rem;
  height: 2rem;
  border: none;
  background: transparent;
  color: var(--muted-fg);
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
}

.drawer-close svg {
  width: 1.25rem;
  height: 1.25rem;
}

.mobile-nav {
  display: flex;
  flex-direction: column;
  gap: .125rem;
}

.mobile-nav__link {
  padding: .5rem .75rem;
  font-size: .9375rem;
  font-weight: 500;
  color: rgba(17, 17, 17, .75);
  border-radius: var(--radius);
  transition: all var(--transition);
}

.mobile-nav__link:hover,
.mobile-nav__link--active {
  color: var(--fg);
  background: var(--secondary);
}

.mobile-contacts {
  border-top: 1px solid var(--border);
  padding-top: .875rem;
  display: flex;
  flex-direction: column;
  gap: .5rem;
}

.mobile-contacts__label {
  font-size: .75rem;
  color: var(--muted-fg);
}

.mobile-contacts__link {
  display: flex;
  align-items: center;
  gap: .5rem;
  color: var(--muted-fg);
  font-size: .875rem;
  transition: color var(--transition);
}

.mobile-contacts__link:hover {
  color: var(--fg);
}

.mobile-langs {
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
}

.mobile-drawer__inner .btn.mt-4 {
  margin-top: .75rem;
}

/* ─────────────────────────────────────────────────────────
   HERO SECTION
   ───────────────────────────────────────────────────────── */
.hero {
  position: relative;
  min-height: 90vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.hero-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, rgba(17, 17, 17, .8) 0%, rgba(17, 17, 17, .5) 50%, rgba(17, 17, 17, .2) 100%);
}

.hero .container {
  display: flex;
  justify-content: center;
  width: 100%;
}

.hero-content {
  position: relative;
  z-index: 1;
  padding: 5rem 0;
  max-width: 50rem;
  text-align: center;
}

.hero-badge {
  margin-bottom: 1.5rem;
}

.hero h1 {
  color: #fff;
  margin-bottom: 1.5rem;
  white-space: pre-line;
  line-height: 0.7;
  letter-spacing: -0.02em;
}

.hero h1 span {
  color: rgba(255, 255, 255, .85);
}

.hero-desc {
  font-size: 1.125rem;
  color: rgba(255, 255, 255, .8);
  margin-bottom: 2rem;
  max-width: 36rem;
  line-height: 1.75;
  margin-left: auto;
  margin-right: auto;
}

.hero-ctas {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 3rem;
  justify-content: center;
}

.hero-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
  max-width: 36rem;
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 640px) {
  .hero-stats {
    grid-template-columns: repeat(4, 1fr);
  }
}

.hero-stat-value {
  font-size: 1.75rem;
  font-weight: 600;
  color: #fff;
}

.hero-stat-label {
  font-size: .8125rem;
  color: rgba(255, 255, 255, .65);
  white-space: nowrap;
}

.hero-scroll-hint {
  position: absolute;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
  color: rgba(255, 255, 255, .6);
  background: none;
  border: none;
  transition: color var(--transition);
}

.hero-scroll-hint:hover {
  color: #fff;
}

.hero-scroll-hint svg {
  width: 2rem;
  height: 2rem;
}

/* ─────────────────────────────────────────────────────────
   SECTION COMMON
   ───────────────────────────────────────────────────────── */
.section {
  padding: 4rem 0;
}

@media (min-width: 768px) {
  .section {
    padding: 6rem 0;
  }
}

.section--compact-top {
  padding-top: 2rem;
}

@media (min-width: 768px) {
  .section--compact-top {
    padding-top: 2.5rem;
  }
}

.section-header {
  text-align: center;
  margin-bottom: 3rem;
}

.section-header h2 {
  margin-bottom: 1rem;
}

.section-header p {
  color: var(--muted-fg);
  max-width: 48rem;
  margin: 0 auto;
  font-size: 1.0625rem;
}

.section--secondary {
  background: var(--secondary);
}

.section--dark {
  background: var(--primary);
  color: var(--primary-fg);
}

.section--dark .section-header h2 {
  color: var(--primary-fg);
}

.section--dark .section-header p {
  color: rgba(255, 255, 255, .75);
}

.section--cta {
  background: var(--accent);
  color: #fff;
}

.section--cta .cta-section h2 {
  color: #fff;
}

.section--cta .cta-section p {
  color: rgba(255, 255, 255, .85);
}

/* ─────────────────────────────────────────────────────────
   PROPERTY CARD (home page grouped list)
   ───────────────────────────────────────────────────────── */
.property-card {
  display: grid;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-xl);
  overflow: hidden;
  transition: border-color var(--transition), box-shadow var(--transition);
  background: var(--card-bg);
}

@media (min-width: 768px) {
  .property-card {
    grid-template-columns: 1fr 2fr;
  }
}

.property-card:hover {
  border-color: var(--accent);
  box-shadow: var(--shadow);
}

.property-card__img {
  position: relative;
  aspect-ratio: 4/3;
}

@media (min-width: 768px) {
  .property-card__img {
    aspect-ratio: auto;
    min-height: 200px;
  }
}

.property-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.property-card__badge {
  position: absolute;
  top: 1rem;
  left: 1rem;
}

.property-card__body {
  padding: 1.25rem 1.5rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.property-card__location {
  display: flex;
  align-items: center;
  gap: .375rem;
  color: var(--muted-fg);
  font-size: .875rem;
  margin-bottom: .35rem;
}

.property-card__title {
  font-size: 1.375rem;
  margin-bottom: .5rem;
}

.property-card__desc {
  color: var(--muted-fg);
  margin-bottom: 1rem;
  line-height: 1.6;
  font-size: .9rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.apt-mini-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: .6rem;
  margin-bottom: 1rem;
}

@media (min-width: 480px) {
  .apt-mini-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 640px) {
  .apt-mini-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.apt-mini {
  padding: .6rem .75rem;
  border-radius: var(--radius);
  background: rgba(242, 247, 250, 0.9);
  transition: background var(--transition);
  display: block;
}

.apt-mini:hover {
  background: rgba(235, 243, 248, 0.95);
}

.apt-mini__name {
  font-weight: 600;
  font-size: .875rem;
  transition: color var(--transition);
}

.apt-mini:hover .apt-mini__name {
  color: var(--accent);
}

.apt-mini__meta {
  display: flex;
  align-items: center;
  gap: .6rem;
  margin-top: .35rem;
  color: var(--muted-fg);
  font-size: .875rem;
  font-weight: 500;
}

.apt-mini__meta span {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
}

.apt-mini__price {
  font-weight: 600;
  color: var(--accent);
}

.property-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: .5rem;
}

.property-card__capacity {
  display: flex;
  align-items: center;
  gap: .375rem;
  color: var(--muted-fg);
  font-size: .875rem;
}

/* ─────────────────────────────────────────────────────────
   APARTMENT CARD
   ───────────────────────────────────────────────────────── */
.apartments-grid {
  display: grid;
  gap: 1.5rem;
}

@media (min-width: 640px) {
  .apartments-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .apartments-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.apt-card {
  background: var(--card-bg);
  border: 1.5px solid var(--border);
  border-radius: var(--radius-xl);
  overflow: hidden;
  transition: all var(--transition);
  display: flex;
  flex-direction: column;
}

.apt-card:hover {
  box-shadow: var(--shadow-xl);
  transform: translateY(-2px);
}

.apt-card--featured {
  border-color: var(--accent);
  border-width: 2px;
}

.apt-card__img {
  position: relative;
  aspect-ratio: 4/3;
  overflow: hidden;
}

.apt-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}

.apt-card:hover .apt-card__img img {
  transform: scale(1.05);
}

.apt-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0, 0, 0, .6) 0%, transparent 60%);
}

.apt-card__location {
  position: absolute;
  bottom: 1rem;
  left: 1rem;
  right: 1rem;
  display: flex;
  align-items: center;
  gap: .35rem;
  color: #fff;
  font-size: .85rem;
}

.apt-card__featured-badge {
  position: absolute;
  top: 1rem;
  left: 1rem;
}

.apt-card__body {
  padding: 1.25rem 1.5rem;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.apt-card__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: .5rem;
}

.apt-card__title {
  font-size: 1.125rem;
  transition: color var(--transition);
}

.apt-card:hover .apt-card__title {
  color: var(--accent);
}

.apt-card__rating {
  display: flex;
  align-items: center;
  gap: .25rem;
  font-size: .875rem;
  font-weight: 500;
  white-space: nowrap;
}

.apt-card__desc {
  color: var(--muted-fg);
  font-size: .875rem;
  margin-bottom: 1rem;
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.5;
}

.apt-card__meta {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: .875rem;
  color: var(--muted-fg);
  margin-bottom: .875rem;
}

.apt-card__meta-item {
  display: flex;
  align-items: center;
  gap: .35rem;
}

.apt-card__features {
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}

.apt-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 1rem;
  border-top: 1px solid var(--border);
  margin-top: auto;
}

.apt-card__footer .btn {
  transition: background var(--transition), color var(--transition), border-color var(--transition);
}

.apt-card:hover .apt-card__footer .btn {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}

.apt-card__price {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--accent);
}

.apt-card__price-label {
  font-size: .8125rem;
  color: var(--muted-fg);
}

/* ─────────────────────────────────────────────────────────
   FEATURES SECTION
   ───────────────────────────────────────────────────────── */
.features-grid {
  display: grid;
  gap: 1.5rem;
}

@media (min-width: 640px) {
  .features-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .features-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.feature-card {
  padding: 1.5rem;
  border-radius: var(--radius-lg);
  background: rgba(0, 164, 214, .06);
  transition: background var(--transition), box-shadow var(--transition);
}

.feature-card:hover {
  background: rgba(0, 164, 214, .1);
  box-shadow: var(--shadow-sm);
}

.feature-card__icon {
  width: 3rem;
  height: 3rem;
  border-radius: .75rem;
  background: rgba(0, 164, 214, .1);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1rem;
  transition: background var(--transition);
}

.feature-card:hover .feature-card__icon {
  background: rgba(0, 164, 214, .2);
}

.feature-card__icon svg {
  width: 1.5rem;
  height: 1.5rem;
  color: var(--accent);
}

.feature-card h3 {
  font-size: 0.914rem;
  font-family: var(--font-sans);
  margin-bottom: .375rem;
}

.feature-card p {
  font-size: .875rem;
  color: var(--muted-fg);
  line-height: 1.6;
}

/* ─────────────────────────────────────────────────────────
   LOCATION SECTION
   ───────────────────────────────────────────────────────── */
.location-section {
  background: color-mix(in oklch, var(--secondary) 30%, transparent);
}

.location-grid {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  align-items: stretch;
}

@media (min-width: 1024px) {
  .location-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 3rem;
    align-items: start;
  }

  .location-grid__text {
    grid-column: 1;
    grid-row: 1;
  }

  .location-grid__map {
    grid-column: 2;
    grid-row: 1 / -1;
    align-self: center;
  }

  .location-grid__destinations {
    grid-column: 1;
    grid-row: 2;
  }
}

.destinations-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-top: 2rem;
}

@media (max-width: 767px) {
  .destinations-grid {
    grid-template-columns: 1fr;
    margin-top: 0;
  }
}

.destination-item {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  border-radius: var(--radius);
  background: oklch(0.985 0.005 220);
  box-shadow: var(--shadow-sm);
}

.destination-item__icon {
  width: 2.5rem;
  height: 2.5rem;
  flex-shrink: 0;
  border-radius: 9999px;
  background: rgba(0, 164, 214, .1);
  display: flex;
  align-items: center;
  justify-content: center;
}

.destination-item__icon svg {
  color: var(--accent);
}

.destination-item__name {
  font-weight: 600;
  font-size: .9375rem;
}

.destination-item__meta {
  font-size: .8125rem;
  color: var(--muted-fg);
  display: flex;
  align-items: center;
  gap: .35rem;
}

/* Detail page map block */
.detail-map-section {
  margin-top: 2rem;
}

.detail-map-card {
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--border);
  background: var(--card-bg);
}

.detail-map {
  width: 100%;
  height: 320px;
  min-height: 280px;
  background: color-mix(in oklch, var(--accent) 8%, var(--bg));
}

.detail-map.leaflet-container {
  background: #e8e8e8;
}

.detail-map-address {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: 1rem 1.5rem;
  font-size: .9375rem;
  color: var(--fg);
  border-top: 1px solid var(--border);
}

.detail-map-address .icon {
  color: var(--accent);
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
}

.detail-map-address span {
  flex: 1;
}

.detail-map-link {
  font-weight: 500;
  color: var(--accent);
  text-decoration: none;
  white-space: nowrap;
}

.detail-map-link:hover {
  text-decoration: underline;
}

.map-wrapper {
  position: relative;
}

.map-card {
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow-xl);
  border: 1px solid var(--border);
}

.map-card .aspect-sq {
  aspect-ratio: 1/1;
  position: relative;
}

.map-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 767px) {
  .location-grid__map .map-card .aspect-sq {
    aspect-ratio: auto;
    height: auto;
  }

  .location-grid__map .map-card img {
    width: 100%;
    height: auto;
    max-width: 100%;
    object-fit: contain;
  }
}

.map-float {
  position: absolute;
  bottom: -1.5rem;
  left: -1.5rem;
  background: var(--bg);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-xl);
  padding: 1rem 1.25rem;
  max-width: 12rem;
}

.map-float__inner {
  display: flex;
  align-items: center;
  gap: .75rem;
}

.map-float__icon {
  width: 2.5rem;
  height: 2.5rem;
  flex-shrink: 0;
  border-radius: 9999px;
  background: var(--accent);
  display: flex;
  align-items: center;
  justify-content: center;
}

.map-float__icon svg {
  color: #fff;
  width: 1.25rem;
  height: 1.25rem;
}

.map-float__title {
  font-weight: 600;
  font-size: .875rem;
}

.map-float__desc {
  font-size: .75rem;
  color: var(--muted-fg);
}

/* ─────────────────────────────────────────────────────────
   CTA SECTION
   ───────────────────────────────────────────────────────── */
.cta-section {
  text-align: center;
}

.cta-section h2 {
  margin-bottom: 1rem;
}

.cta-section p {
  max-width: 40rem;
  margin: 0 auto 2rem;
  opacity: .8;
  font-size: 1.0625rem;
}

.cta-btns {
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
}

/* ─────────────────────────────────────────────────────────
   AVAILABILITY CALENDAR (home page) — React-style
   ───────────────────────────────────────────────────────── */
.avail-section .section-header {
  text-align: center;
  margin-bottom: 2rem;
}

.avail-section .section-header p {
  max-width: 36rem;
  margin-left: auto;
  margin-right: auto;
}

.avail-calendar-grid {
  display: grid;
  gap: 2rem;
  align-items: start;
}

@media (min-width: 1024px) {
  .avail-calendar-grid {
    grid-template-columns: 2fr 1fr;
  }
}

.apt-booking-dates {
  margin-bottom: 1rem;
  padding: .75rem 1rem;
  background: rgba(0, 164, 214, .06);
  border-radius: var(--radius);
  font-size: .875rem;
}

.apt-booking-dates div+div {
  margin-top: .25rem;
}

.apt-booking-form .form-group label {
  display: block;
  font-size: .8125rem;
  font-weight: 500;
  margin-bottom: .25rem;
}

.apt-booking-form input,
.apt-booking-form textarea {
  width: 100%;
  padding: .5rem .75rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-size: .9375rem;
}

.apt-booking-success {
  text-align: center;
  padding: 1.5rem 0;
}

.apt-booking-success .icon-xl {
  width: 3rem;
  height: 3rem;
  color: #10b981;
  margin-bottom: .75rem;
}

.apt-booking-success h3 {
  margin-bottom: .5rem;
}

.apt-booking-success p {
  color: var(--muted-fg);
  font-size: .9375rem;
}

.apt-booking-busy {
  text-align: center;
  padding: 1rem 0;
}

.apt-booking-busy h3 {
  margin-bottom: .5rem;
}

.apt-booking-busy p {
  color: var(--muted-fg);
  font-size: .9375rem;
  margin-bottom: 1rem;
}

.avail-calendar-card,
.avail-panel-card {
  background: var(--card-bg);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}

/* На мобильном скрываем блок с доступными апартаментами по умолчанию */
.avail-calendar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.5rem;
  border-bottom: 1px solid var(--border);
}

.avail-cal-title {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-weight: 600;
  margin: 0;
}

.avail-cal-btn {
  width: 2.5rem;
  height: 2.5rem;
  border: none;
  border-radius: var(--radius);
  background: transparent;
  color: var(--fg);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background var(--transition);
}

.avail-cal-btn:hover {
  background: var(--secondary);
}

.avail-cal-btn svg {
  width: 1.25rem;
  height: 1.25rem;
}

.avail-cal-body {
  padding: 1.5rem;
}

.avail-cal-weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: .25rem;
  margin-bottom: .5rem;
  text-align: center;
  font-size: .75rem;
  font-weight: 500;
  color: var(--muted-fg);
}

.avail-cal-weekdays span {
  padding: .5rem 0;
}

.avail-cal-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: .25rem;
}

.avail-cal-day {
  min-height: 3rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius);
  font-size: .875rem;
  cursor: pointer;
  transition: all var(--transition);
  background: transparent;
  border: none;
}

.avail-cal-day--past {
  opacity: .4;
  cursor: not-allowed;
  color: var(--muted-fg);
}

.avail-cal-day:hover:not(.avail-cal-day--past) {
  background: var(--secondary);
}

.avail-cal-day--selected {
  background: rgba(0, 164, 214, .08);
  box-shadow: 0 0 0 2px var(--accent);
}

.avail-cal-day--today {
  font-weight: 600;
  color: var(--accent);
}

.avail-cal-day__dot {
  width: .5rem;
  height: .5rem;
  border-radius: 50%;
  margin-top: .25rem;
}

.avail-cal-day--available .avail-cal-day__dot {
  background: #10b981;
}

.avail-cal-day--booked .avail-cal-day__dot {
  background: #ef4444;
}

/* Chinon Manager (admin manual calendar) */
.chinon-manager-layout {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 1.5rem;
  align-items: start;
}

.chinon-apt-list {
  display: flex;
  flex-direction: column;
  gap: .5rem;
}

.chinon-apt-item {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: .75rem;
  padding: .75rem .85rem;
  background: rgba(17, 17, 17, .03);
  border: 1.5px solid var(--border);
  border-radius: var(--radius);
  color: var(--fg);
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, transform .05s ease;
}

.chinon-apt-item:hover {
  background: rgba(17, 17, 17, .06);
}

.chinon-apt-item:active {
  transform: translateY(1px);
}

.chinon-apt-item.is-active {
  border-color: var(--primary);
  background: rgba(0, 164, 214, .08);
}

.chinon-calendar .avail-cal-days {
  padding-top: .25rem;
}

.chinon-manager .chinon-calendar .avail-cal-days {
  grid-template-columns: repeat(7, 1fr);
  column-gap: .25rem;
  row-gap: .25rem;
  max-width: 40rem;
  margin-left: 0;
  width: 100%;
}

.chinon-manager .chinon-calendar .avail-cal-days.chinon-cal--view-all {
  max-width: none;
}

.chinon-weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: .25rem;
  margin-bottom: .25rem;
  color: var(--muted-fg);
  font-size: .8125rem;
}

.chinon-manager .chinon-weekdays {
  grid-template-columns: repeat(7, 1fr);
  column-gap: .25rem;
  row-gap: .25rem;
  max-width: 40rem;
  margin-left: 0;
  width: 100%;
}

.chinon-weekdays span {
  text-align: center;
  padding: .35rem 0;
  border-radius: var(--radius-sm);
}

.chinon-manager .avail-cal-day {
  aspect-ratio: 1/1;
  padding: .25rem 0;
}

/* Pastel apartment color (left list) */
.chinon-apt-color-dot {
  flex: 0 0 auto;
  display: inline-block;
}

/* "All apartments" calendar stripes */
.chinon-stripes {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0;
  align-items: stretch;
  margin: 0;
}

.chinon-stripe {
  flex: 1 1 auto;
  min-height: 0;
  border-radius: 0;
}

/* Лёгкий объём без бокового inset — боковой inset на стыке ячеек давал «серую щель» */
.chinon-stripe--occupied {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), inset 0 -1px 0 rgba(0, 0, 0, .04);
}

/* Вместо border: на скруглении border выглядит толще; линия края — inset box-shadow */
.chinon-stripe--start {
  border: 0;
  border-top-left-radius: 999px;
  border-bottom-left-radius: 999px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .35),
    inset 0 -1px 0 rgba(0, 0, 0, .04),
    inset 1px 0 0 rgba(0, 0, 0, .16);
}

.chinon-stripe--end {
  border: 0;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .35),
    inset 0 -1px 0 rgba(0, 0, 0, .04),
    inset -1px 0 0 rgba(0, 0, 0, .16);
}

/* Начало и конец в один день — объединяем тени */
.chinon-stripe--occupied.chinon-stripe--start.chinon-stripe--end {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .35),
    inset 0 -1px 0 rgba(0, 0, 0, .04),
    inset 1px 0 0 rgba(0, 0, 0, .16),
    inset -1px 0 0 rgba(0, 0, 0, .16);
}

.chinon-stripe--slot {
  flex: 1 1 0;
  min-height: 0;
  background: transparent;
  pointer-events: none;
}

/* «Все апартаменты»: компактная ячейка (как раньше ~4rem), полоски снизу; высота дорожек — фикс. px (без 1fr, не раздувает сетку) */
.chinon-cal-day--all.avail-cal-day {
  position: relative;
  aspect-ratio: 1/1;
  padding: 0 !important;
  overflow: visible;
  box-sizing: border-box;
  display: block;
}

.chinon-cal-day__inner {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.chinon-cal-day__num {
  position: absolute;
  top: 0.15rem;
  left: 0;
  width: 100%;
  line-height: 1;
  text-align: center;
  font-weight: 600;
  font-size: 0.8rem;
  z-index: 5;
}

.chinon-cal-day__stripe-wrap {
  position: absolute;
  top: 1.15rem;
  bottom: 0.15rem;
  left: 0;
  right: 0;
  display: block;
}

.chinon-cal-day--all .chinon-stripes {
  display: grid;
  grid-template-rows: repeat(var(--chinon-tracks, 1), 1fr);
  gap: 1px;
  align-content: stretch;
  width: 100%;
  height: 100%;
  margin: 0;
  position: relative;
  z-index: 1;
  box-sizing: border-box;
}

.chinon-cal-day--all .chinon-stripe,
.chinon-cal-day--all .chinon-stripe--slot {
  min-height: 0;
  width: 100%;
  margin: 0;
  padding: 0;
  border: none;
  opacity: 1;
}

.chinon-cal-day--all .chinon-stripe--occupied {
  display: flex;
  align-items: center;
}

.chinon-stripe__label {
  display: block;
  font-size: 0.55rem;
  line-height: 1;
  color: rgba(0, 0, 0, .55);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0 0.2rem;
  pointer-events: none;
}

/* Extend occupied strips to cover the row gaps, if they continue next day */
.chinon-cal-day--all .chinon-stripe--occupied:not(.chinon-stripe--end) {
  width: calc(100% + 0.25rem);
  z-index: 2;
}

.chinon-manager .chinon-calendar .avail-cal-day:nth-child(7n) .chinon-stripe--occupied:not(.chinon-stripe--end) {
  width: 100%;
}

/* ======================== GANTT CHART (All Apartments) ======================== */

.chinon-gantt-container {
  width: 100%;
  padding: 0;
}

.chinon-gantt {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--bg);
}

.chinon-gantt__scroll {
  overflow-x: auto;
  overflow-y: auto;
  max-height: 70vh;
  scrollbar-width: thin;
}

.chinon-gantt__table {
  display: grid;
  grid-template-columns: 10rem repeat(var(--gantt-days, 31), 2.2rem);
  min-width: max-content;
}

/* Header cells */
.chinon-gantt__corner {
  position: sticky;
  left: 0;
  top: 0;
  z-index: 10;
  background: var(--card-bg, #fff);
  border-bottom: 2px solid var(--border);
  border-right: 1px solid var(--border);
  padding: .5rem .6rem;
  font-weight: 700;
  font-size: .8125rem;
  color: var(--muted-fg);
  display: flex;
  align-items: flex-end;
}

.chinon-gantt__date {
  position: sticky;
  top: 0;
  z-index: 5;
  background: var(--card-bg, #fff);
  border-bottom: 2px solid var(--border);
  border-right: 1px solid rgba(0, 0, 0, .04);
  padding: .3rem .15rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .1rem;
}

.chinon-gantt__dow {
  font-size: .625rem;
  color: var(--muted-fg);
  text-transform: uppercase;
  letter-spacing: .02em;
}

.chinon-gantt__day-num {
  font-size: .8125rem;
  font-weight: 600;
  color: var(--fg);
  line-height: 1.3;
}

.chinon-gantt__date--today {
  background: rgba(0, 164, 214, .06);
  box-shadow: inset 1.5px 0 0 rgba(0, 164, 214, .3), inset -1.5px 0 0 rgba(0, 164, 214, .3);
}

.chinon-gantt__date--today .chinon-gantt__day-num {
  color: #fff;
  background: rgba(0, 164, 214, .7);
  border-radius: 50%;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Today vertical stripe on body cells */
.chinon-gantt__cell--today:not(.chinon-gantt__cell--occupied) {
  background: rgba(0, 164, 214, .04);
  box-shadow: inset 1.5px 0 0 rgba(0, 164, 214, .15), inset -1.5px 0 0 rgba(0, 164, 214, .15);
}

.chinon-gantt__date--weekend {
  background: rgba(0, 0, 0, .02);
}

.chinon-gantt__date--weekend .chinon-gantt__dow {
  color: var(--danger, #e74c3c);
}

/* Apartment name cells (left sidebar) */
.chinon-gantt__apt {
  position: sticky;
  left: 0;
  z-index: 6;
  background: var(--card-bg, #fff);
  border-bottom: 1px solid var(--border);
  border-right: 1px solid var(--border);
  padding: .35rem .5rem;
  font-size: .75rem;
  font-weight: 600;
  color: var(--fg);
  display: flex;
  align-items: center;
  gap: .4rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-height: 2.2rem;
}

.chinon-gantt__apt-dot {
  flex: 0 0 .55rem;
  width: .55rem;
  height: .55rem;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, .08);
}

/* Day cells */
.chinon-gantt__cell {
  border-bottom: 1px solid var(--border);
  border-right: 1px solid rgba(0, 0, 0, .04);
  padding: 0;
  min-height: 2.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .15s;
  position: relative;
}

.chinon-gantt__cell:hover {
  background: rgba(0, 164, 214, .06);
}

.chinon-gantt__cell--selected {
  z-index: 1;
}

/* Occupied cells (booking bars) */
.chinon-gantt__cell--occupied {
  position: relative;
  z-index: 2;
  border-radius: 0;
  border-right-color: transparent;
  background: transparent !important;
}

.chinon-gantt__cell--occupied::after {
  content: '';
  position: absolute;
  top: 4px;
  bottom: 4px;
  left: -1px;
  right: -1px;
  background: var(--bar-color);
  border-radius: 0;
  transition: filter .15s;
}

.chinon-gantt__cell--end::after {
  right: 66.67%;
}

.chinon-gantt__cell--occupied:hover::after,
.chinon-gantt__cell--hover::after {
  filter: brightness(.85);
}

.chinon-gantt__cell--start {
  padding-left: 0;
  justify-content: center;
  z-index: 5;
  overflow: visible;
}

.chinon-gantt__cell--start::after {
  left: 33.33%;
  border-top-left-radius: 999px;
  border-bottom-left-radius: 999px;
}

.chinon-gantt__cell--end::after {
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
}

.chinon-gantt__cell--start.chinon-gantt__cell--end::after {
  left: 10%;
  right: 10%;
  border-radius: 999px;
}

.chinon-gantt__cell--start.chinon-gantt__cell--end {
  border-radius: 999px;
}

/* Booking label */
.chinon-gantt__label {
  font-size: .75rem;
  font-weight: 600;
  color: rgba(0, 0, 0, .6);
  white-space: nowrap;
  overflow: visible;
  position: absolute;
  z-index: 10;
  pointer-events: none;
  padding-left: 0.5rem;
}

.chinon-gantt__cell--start>.chinon-gantt__label {
  left: 33.33%;
}

.chinon-gantt__half--start>.chinon-gantt__label {
  left: 0;
}

/* Split cell: checkout + checkin on the same day */
.chinon-gantt__cell--split {
  position: relative;
  display: flex !important;
  flex-direction: row;
  align-items: stretch;
  justify-content: flex-start;
  padding: 0 !important;
  gap: 0;
}

.chinon-gantt__half {
  position: relative;
  min-height: 100%;
  display: flex;
  align-items: center;
}

.chinon-gantt__half::after {
  content: '';
  position: absolute;
  top: 4px;
  bottom: 4px;
  left: 0;
  right: 0;
  background: var(--bar-color);
  border-radius: 0;
}

.chinon-gantt__half--end {
  width: 33.33%;
}

.chinon-gantt__half--end::after {
  left: -1px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
}

.chinon-gantt__half--start::after {
  right: -1px;
  border-top-left-radius: 999px;
  border-bottom-left-radius: 999px;
}

.chinon-gantt__half--start {
  width: 66.67%;
  overflow: visible;
  z-index: 5;
  justify-content: center;
}

.chinon-gantt__half--start .chinon-gantt__label {
  padding-left: 0;
  text-align: center;
}

/* Price in empty cells */
.chinon-gantt__price {
  font-size: .625rem;
  color: var(--muted-fg);
  pointer-events: none;
}

/* Середина диапазона — строго прямоугольник (без «таблетки» из-за микровысоты) */
.chinon-cal-day--all .chinon-stripe--occupied:not(.chinon-stripe--start):not(.chinon-stripe--end) {
  border-radius: 0 !important;
}

.chinon-cal-day--occupied.avail-cal-day--booked {
  background: rgba(239, 68, 68, .08);
}

.chinon-cal-day--available.avail-cal-day--available {
  background: rgba(16, 185, 129, .06);
}

.chinon-cal-day__price {
  font-size: .75rem;
  font-weight: 700;
  color: var(--accent);
  margin-top: -.05rem;
  line-height: 1.1;
}

.chinon-cal-day__who {
  font-size: .7rem;
  color: var(--muted-fg);
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 1.1;
  margin-top: .15rem;
}

/* Range selection */
.avail-cal-day--range,
.avail-cal-day--range-start,
.avail-cal-day--range-end {
  background: rgba(0, 164, 214, .1);
}

.avail-cal-day--range-start,
.avail-cal-day--range-end {
  box-shadow: 0 0 0 2px var(--accent);
}

.avail-cal-legend {
  display: flex;
  gap: 1.5rem;
  justify-content: center;
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--border);
  font-size: .8125rem;
  color: var(--muted-fg);
}

.avail-cal-legend span {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
}

.legend-dot {
  width: .75rem;
  height: .75rem;
  border-radius: 50%;
  display: inline-block;
}

.legend-available {
  background: #10b981;
}

.legend-booked {
  background: #ef4444;
}

.avail-panel-card {
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-height: 0;
  width: 100%;
}

@media (max-width: 1023px) {
  .avail-panel-card {
    display: none !important;
  }

  .avail-panel-card.avail-panel-card--visible {
    display: flex !important;
  }

  .apt-cal-panel-wrap {
    display: none !important;
    scroll-margin-top: calc(var(--header-h) + 1rem);
  }

  .apt-cal-panel-wrap.apt-cal-panel-wrap--visible {
    display: block !important;
  }
}

.avail-panel-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--accent) rgba(0, 164, 214, .08);
}

.avail-panel-body::-webkit-scrollbar {
  width: 6px;
}

.avail-panel-body::-webkit-scrollbar-track {
  background: rgba(0, 164, 214, .06);
  border-radius: 3px;
}

.avail-panel-body::-webkit-scrollbar-thumb {
  background: var(--accent);
  border-radius: 3px;
}

.avail-panel-body::-webkit-scrollbar-thumb:hover {
  background: #008bb8;
}

.avail-panel-title {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-family: var(--font-serif);
  font-size: 1.125rem;
  font-weight: 600;
  margin: 0;
}

.avail-panel-title svg {
  color: var(--accent);
  flex-shrink: 0;
}

.avail-panel-hint {
  font-size: .875rem;
  color: var(--muted-fg);
  margin: 0;
}

.avail-panel-list {
  display: flex;
  flex-direction: column;
  gap: .75rem;
}

.avail-panel-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .75rem 1rem;
  border-radius: var(--radius);
  background: rgba(242, 247, 250, .9);
  text-decoration: none;
  color: inherit;
  transition: background var(--transition);
}

.avail-panel-item:hover {
  background: var(--secondary);
}

.avail-panel-item:hover .avail-panel-item__name {
  color: var(--accent);
}

.avail-panel-item__left {
  display: flex;
  align-items: center;
  gap: .75rem;
}

.avail-panel-item__bar {
  width: .25rem;
  height: 2rem;
  border-radius: 2px;
  flex-shrink: 0;
}

.avail-panel-item__name {
  font-weight: 600;
  font-size: .875rem;
  transition: color var(--transition);
}

.avail-panel-item__meta {
  font-size: .75rem;
  color: var(--muted-fg);
  margin-top: .125rem;
}

.avail-panel-item__right {
  display: flex;
  align-items: center;
  gap: .5rem;
}

.avail-panel-item__price {
  font-weight: 600;
  color: var(--accent);
  font-size: .875rem;
}

.avail-panel-empty {
  text-align: center;
  padding: 2rem 1rem;
  color: var(--muted-fg);
}

.avail-panel-empty svg {
  width: 3rem;
  height: 3rem;
  color: #ef4444;
  margin-bottom: .75rem;
  opacity: .7;
}

/* Calendar CTA block */
.avail-cta-block {
  margin-top: 2.5rem;
  padding: 1.75rem 2rem;
  background: linear-gradient(135deg, rgba(0, 164, 214, .06) 0%, rgba(0, 164, 214, .02) 100%);
  border: 1px solid rgba(0, 164, 214, .2);
  border-radius: var(--radius-xl);
  text-align: center;
}

.avail-cta-block--in-calendar {
  margin: 1.25rem 1.5rem 1.5rem;
  padding: 1.25rem 1.5rem;
}

.avail-cta-block__text {
  font-size: 1.0625rem;
  font-weight: 500;
  color: var(--fg);
  margin: 0 0 .5rem;
}

.avail-cta-block__discount {
  font-size: .9375rem;
  color: var(--accent);
  font-weight: 600;
  margin: 0 0 1.25rem;
}

.avail-cta-block__links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
}

.avail-cta-block__link {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .625rem 1.25rem;
  background: var(--bg);
  border: 1.5px solid var(--border);
  border-radius: var(--radius);
  font-size: .9375rem;
  font-weight: 500;
  color: var(--fg);
  transition: all var(--transition);
}

.avail-cta-block__link:hover {
  border-color: var(--accent);
  color: var(--accent);
  background: rgba(0, 164, 214, .04);
}

.avail-cta-block__link .icon {
  width: 1.125rem;
  height: 1.125rem;
}

/* Legacy calendar (apartment detail page) */
.calendar-widget {
  max-width: 56rem;
  margin: 0 auto;
}

.calendar-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.calendar-controls select {
  width: auto;
  min-width: 8rem;
}

.calendar-btn {
  width: 2rem;
  height: 2rem;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--fg);
  transition: all var(--transition);
  flex-shrink: 0;
}

.calendar-btn:hover {
  background: var(--secondary);
}

.calendar-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}

@media (max-width: 640px) {
  .calendar-grid {
    grid-template-columns: 1fr;
  }
}

.calendar-month-title {
  font-weight: 600;
  text-align: center;
  margin-bottom: 1rem;
  font-size: .9375rem;
}

.cal-days-header {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  text-align: center;
  font-size: .75rem;
  color: var(--muted-fg);
  font-weight: 600;
  margin-bottom: .5rem;
}

.cal-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: .125rem;
}

.cal-day {
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .8125rem;
  border-radius: var(--radius-sm);
  cursor: default;
}

.cal-day--available {
  background: #f0fdf4;
  color: #166534;
}

.cal-day--booked {
  background: #fef2f2;
  color: #991b1b;
  text-decoration: line-through;
}

.cal-day--today {
  font-weight: 700;
  border: 1.5px solid var(--primary);
}

.cal-day--past {
  color: var(--muted-fg);
  opacity: .4;
}

.calendar-legend {
  display: flex;
  gap: 1.5rem;
  justify-content: center;
  margin-top: 1.25rem;
  font-size: .8125rem;
}

/* ─────────────────────────────────────────────────────────
   PAGE HERO (internal pages)
   ───────────────────────────────────────────────────────── */
.page-hero {
  background: var(--secondary);
  padding: 3rem 0;
  /* Reduced from 4rem 0 3rem */
  min-height: 450px;
  display: flex;
  flex-direction: column;
}

@media (min-width: 768px) {
  .page-hero {
    padding: 4rem 0;
    /* Reduced from 6rem 0 4rem */
    min-height: 480px;
  }
}

.page-hero .badge {
  margin-bottom: 1rem;
  background: rgba(0, 164, 214, 0.12);
  color: var(--accent);
  box-shadow: var(--shadow-sm);
  border: 1px solid rgba(0, 164, 214, 0.25);
}

.page-hero h1 {
  margin-bottom: 1rem;
}

.page-hero p {
  color: var(--muted-fg);
  max-width: 40rem;
  font-size: 1.0625rem;
  line-height: 1.75;
}

.page-hero--compact {
  padding: 3rem 0 2rem;
  min-height: 220px;
  display: flex;
  align-items: center;
}

@media (min-width: 768px) {
  .page-hero--compact {
    padding: 4rem 0 2.5rem;
    min-height: 220px;
  }
}

.page-hero--compact .container {
  text-align: center;
}

.page-hero--compact h1 {
  margin-left: auto;
  margin-right: auto;
}

/* Content page (pet policy, etc.) */
.content-page {
  max-width: 52rem;
  margin: 0 auto;
}

.content-page h2 {
  font-family: var(--font-serif);
  font-size: 1.37rem;
  font-weight: 600;
  margin: 2.5rem 0 1rem;
  color: var(--fg);
  padding-bottom: .5rem;
  border-bottom: 1px solid var(--border);
}

.content-page h2:first-child {
  margin-top: 0;
}

.content-page h3 {
  font-size: 1.14rem;
  font-weight: 600;
  margin: 2rem 0 .75rem;
  color: var(--fg);
}

.content-page h4 {
  font-size: 0.97rem;
  font-weight: 600;
  margin: 1.25rem 0 .5rem;
  color: var(--fg);
}

.content-page p,
.content-page li {
  color: var(--secondary-fg);
  line-height: 1.8;
  margin-bottom: .875rem;
}

.content-page ul,
.content-page ol {
  margin: 0 0 1.25rem 1.75rem;
}

.content-page li {
  margin-bottom: .35rem;
}

.content-page a {
  color: var(--accent);
  text-decoration: none;
  font-weight: 500;
}

.content-page a:hover {
  text-decoration: underline;
}

.content-page--pet-policy {
  padding: 0 .5rem;
}

.content-page--pet-policy strong {
  color: var(--fg);
  font-weight: 600;
}

.content-page--terms {
  padding: 0 .5rem;
}

.content-page--terms strong {
  color: var(--fg);
  font-weight: 600;
}

.amenity-item--link {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
  transition: background var(--transition), color var(--transition);
}

.amenity-item--link:hover {
  background: color-mix(in oklab, var(--accent) 12%, var(--secondary));
}

.amenity-item--link:hover .icon,
.amenity-item--link:hover .amenity-item__arrow {
  color: var(--accent);
}

.amenity-item__arrow {
  margin-left: auto;
  opacity: .6;
  transition: opacity var(--transition);
}

.amenity-item--link:hover .amenity-item__arrow {
  opacity: 1;
}

.amenity-item__icon--dog {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.amenity-item__icon--dog svg {
  width: 1rem;
  height: 1rem;
  color: var(--accent);
}

/* ─────────────────────────────────────────────────────────
   APARTMENT DETAIL
   ───────────────────────────────────────────────────────── */
.apt-detail-page {
  background: color-mix(in oklch, var(--secondary) 30%, transparent);
  overflow-x: hidden;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding-left: max(1rem, env(safe-area-inset-left)) !important;
  padding-right: max(1rem, env(safe-area-inset-right)) !important;
}

@media (min-width: 640px) {
  .apt-detail-page {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
  }
}

@media (min-width: 1024px) {
  .apt-detail-page {
    padding-left: 2rem !important;
    padding-right: 2rem !important;
  }
}

.apt-detail-page__inner {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Контейнеры на странице апартамента — padding на main, здесь только max-width */
.apt-detail-page .container {
  max-width: min(var(--container), 100%);
  padding-left: 0;
  padding-right: 0;
}

.breadcrumb {
  padding: 1rem 0;
  background: transparent;
}

.breadcrumb a {
  display: inline-flex;
  align-items: center;
  gap: .375rem;
  color: var(--muted-fg);
  font-size: .9rem;
  transition: color var(--transition);
}

.breadcrumb a:hover {
  color: var(--fg);
}

/* Gallery */
.gallery-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: repeat(3, auto);
  gap: .5rem;
  min-width: 0;
  width: 100%;
}

@media (min-width: 640px) {
  .gallery-grid {
    grid-template-columns: 2fr 1fr 1fr;
    grid-template-rows: auto auto;
  }

  .gallery-grid .gallery-thumb:nth-child(6) {
    display: none;
  }

  /* 6-я картинка только на мобильных */
}

.gallery-main {
  aspect-ratio: 4/3;
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-lg) 0 0 0;
  cursor: pointer;
}

@media (min-width: 640px) {
  .gallery-main {
    grid-row: span 2;
    border-radius: var(--radius-lg) 0 0 var(--radius-lg);
  }
}

.gallery-thumb {
  aspect-ratio: 4/3;
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.gallery-thumb:nth-child(2) {
  border-radius: 0 var(--radius-lg) 0 0;
}

.gallery-thumb:nth-child(3) {
  border-radius: 0;
}

@media (min-width: 640px) {
  .gallery-thumb:nth-child(3) {
    border-radius: 0 var(--radius-lg) 0 0;
  }
}

.gallery-thumb:nth-child(4) {
  border-radius: 0;
}

.gallery-thumb:nth-child(5) {
  border-radius: 0 0 0 var(--radius-lg);
  position: relative;
}

.gallery-thumb:nth-child(5) .gallery-more--desktop {
  border-radius: 0 0 0 var(--radius-lg);
}

.gallery-thumb:nth-child(6) {
  border-radius: 0 0 var(--radius-lg) 0;
  position: relative;
}

.gallery-more {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .5);
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 1.25rem;
  gap: .25rem;
  border-radius: 0 0 var(--radius-lg) 0;
}

.gallery-more--desktop {
  display: none;
}

.gallery-more--mobile {
  display: flex;
}

@media (min-width: 640px) {
  .gallery-more--desktop {
    display: flex;
  }

  .gallery-more--mobile {
    display: none;
  }
}

.gallery-main img,
.gallery-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}

.gallery-main:hover img,
.gallery-thumb:hover img {
  transform: scale(1.04);
}

.gallery-badge {
  position: absolute;
  bottom: 1rem;
  left: 1rem;
  padding: .25rem .75rem;
  font-size: .8rem;
  font-weight: 500;
  background: rgba(255, 255, 255, .9);
  color: var(--fg);
  border-radius: 9999px;
}

.gallery-badge--sm {
  bottom: .5rem;
  left: .5rem;
  padding: .2rem .5rem;
  font-size: .7rem;
}

/* Lightbox */
.lightbox {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 500;
  background: rgba(0, 0, 0, .95);
  align-items: center;
  justify-content: center;
}

.lightbox.is-open {
  display: flex;
}

.lightbox-img {
  max-width: 90vw;
  max-height: 85vh;
  border-radius: var(--radius);
  object-fit: contain;
}

.lightbox-counter {
  position: absolute;
  bottom: 1.5rem;
  left: 50%;
  transform: translateX(-50%);
  padding: .4rem 1rem;
  background: rgba(0, 0, 0, .6);
  color: #fff;
  font-size: .9rem;
  font-weight: 500;
  border-radius: 9999px;
}

.lightbox-close {
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  background: rgba(255, 255, 255, .1);
  border: none;
  color: #fff;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background var(--transition);
}

.lightbox-close:hover {
  background: rgba(255, 255, 255, .2);
}

.lightbox-prev,
.lightbox-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, .1);
  border: none;
  color: #fff;
  width: 3rem;
  height: 3rem;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background var(--transition);
}

.lightbox-prev:hover,
.lightbox-next:hover {
  background: rgba(255, 255, 255, .2);
}

.lightbox-prev {
  left: 1.5rem;
}

.lightbox-next {
  right: 1.5rem;
}

/* Detail layout */
.detail-layout {
  display: grid;
  gap: 3rem;
  padding: 3rem 0;
  align-items: start;
  min-width: 0;
}

@media (min-width: 1024px) {
  .detail-layout {
    grid-template-columns: 1fr 22rem;
  }
}

.detail-upper-grid {
  display: grid;
  gap: 3rem;
  align-items: start;
}

@media (min-width: 1024px) {
  .detail-upper-grid {
    grid-template-columns: 1fr 22rem;
    grid-column: 1 / -1;
  }
}

.detail-main {
  min-width: 0;
}

.detail-main>*+* {
  margin-top: 2rem;
}

/* Lower grid: amenities, features, calendar | sidebar(availability), reviews, faq */
.detail-lower-grid {
  display: grid;
  gap: 3rem;
  align-items: start;
  min-width: 0;
}

.detail-lower-item {
  min-width: 0;
}

@media (min-width: 1024px) {
  .detail-lower-grid {
    grid-template-columns: 1fr 22rem;
    grid-column: 1 / -1;
  }

  .detail-lower-item--calendar {
    grid-column: 1;
    grid-row: 1;
  }

  .detail-sidebar--lower {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    margin-top: 3.5rem;
    align-self: start;
  }

  .detail-lower-item--amenities {
    grid-column: 1;
    grid-row: 2;
  }

  .detail-lower-item--features {
    grid-column: 1;
    grid-row: 3;
  }

  .detail-lower-item--guest-features {
    grid-column: 1;
    grid-row: 4;
  }

  .detail-lower-item--video {
    grid-column: 1;
    grid-row: 5;
  }

  .detail-lower-item--map {
    grid-column: 1;
    grid-row: 6;
  }

  .detail-lower-item--reviews {
    grid-column: 1;
    grid-row: 7;
  }

  .detail-lower-item--faq {
    grid-column: 1;
    grid-row: 8;
  }
}

.detail-lower-item+.detail-lower-item {
  margin-top: 0;
}

.detail-lower-item>*+* {
  margin-top: 2rem;
}

.detail-sidebar--lower .booking-card {
  margin: 0;
}

/* Блок доступности на странице апартамента: высота как у календаря, прокрутка как на главной */
.apt-cal-panel {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.apt-cal-panel .booking-card__body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--accent) rgba(0, 164, 214, .08);
}

.apt-cal-panel .booking-card__body::-webkit-scrollbar {
  width: 6px;
}

.apt-cal-panel .booking-card__body::-webkit-scrollbar-track {
  background: rgba(0, 164, 214, .06);
  border-radius: 3px;
}

.apt-cal-panel .booking-card__body::-webkit-scrollbar-thumb {
  background: var(--accent);
  border-radius: 3px;
}

.apt-cal-panel .booking-card__body::-webkit-scrollbar-thumb:hover {
  background: #008bb8;
}

.detail-meta {
  display: flex;
  align-items: center;
  gap: .5rem;
  color: var(--muted-fg);
  font-size: .875rem;
  margin-bottom: .5rem;
}

.detail-meta .dot {
  color: var(--primary);
}

.detail-title {
  margin-bottom: .5rem;
}

.detail-subtitle {
  color: var(--muted-fg);
  font-size: 1.0625rem;
  margin-bottom: 1rem;
}

.detail-stats {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
}

.detail-stats .sep {
  width: 1px;
  height: 1.25rem;
  background: var(--border);
}

.detail-stats .stat-item {
  display: flex;
  align-items: center;
  gap: .375rem;
  color: var(--muted-fg);
  font-size: .9rem;
}

.detail-stats .rating {
  display: flex;
  align-items: center;
  gap: .25rem;
  font-weight: 500;
}

.detail-section-title {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  gap: .5rem;
}

.rooms-grid {
  display: grid;
  gap: 1rem;
  min-width: 0;
}

@media (min-width: 640px) {
  .rooms-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.room-card {
  background: color-mix(in oklch, var(--secondary) 30%, transparent);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1rem;
  box-shadow: var(--shadow-sm);
  min-width: 0;
}

.room-card__inner {
  display: flex;
  align-items: flex-start;
  gap: .875rem;
}

.room-icon {
  padding: .5rem;
  border-radius: .5rem;
  background: color-mix(in oklab, var(--accent) 10%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.room-icon svg {
  width: 1.25rem;
  height: 1.25rem;
  color: var(--accent);
}

.room-name {
  font-weight: 600;
  font-size: .9375rem;
  margin-bottom: .25rem;
}

.room-desc {
  font-size: .8125rem;
  color: var(--muted-fg);
  line-height: 1.5;
}

.amenities-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: .75rem;
  min-width: 0;
}

@media (min-width: 640px) {
  .amenities-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.amenity-item {
  display: flex;
  align-items: center;
  gap: .75rem;
  min-width: 0;
  padding: .75rem;
  border-radius: var(--radius);
  background: color-mix(in oklab, var(--accent) 4%, transparent);
  font-size: .875rem;
}

.amenity-item svg {
  color: var(--accent);
  flex-shrink: 0;
}

.features-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
  min-width: 0;
}

.feature-item {
  display: flex;
  align-items: center;
  gap: .5rem;
  min-width: 0;
  color: var(--muted-fg);
  font-size: .9rem;
}

.feature-item svg {
  color: var(--accent);
  flex-shrink: 0;
}

/* Guest features (bike, motorcycle, ski) */
.guest-features-intro {
  color: var(--muted-fg);
  line-height: 1.65;
  margin-bottom: 1.5rem;
  font-size: .9375rem;
}

.guest-features-grid {
  display: grid;
  gap: 1.25rem;
}

@media (min-width: 640px) {
  .guest-features-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .guest-features-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Две фишки — рядом на всю ширину */
.guest-features-grid--double {
  grid-template-columns: 1fr 1fr;
}

@media (min-width: 1024px) {
  .guest-features-grid--double {
    grid-template-columns: 1fr 1fr;
  }
}

.guest-features-grid--double .guest-feature-card {
  min-width: 0;
}

/* Одна фишка — горизонтальный layout на всю ширину */
.guest-features-grid--single {
  display: block;
}

.guest-features-grid--single .guest-feature-card {
  display: grid;
  grid-template-columns: auto 1fr auto;
  grid-template-rows: auto 1fr;
  gap: 1.25rem 1.5rem;
  align-items: start;
  padding: 2rem;
}

.guest-features-grid--single .guest-feature-card__icon {
  grid-row: 1 / -1;
  width: 4rem;
  height: 4rem;
}

.guest-features-grid--single .guest-feature-card__icon svg,
.guest-features-grid--single .guest-feature-card__icon .guest-feature-icon-motorcycle {
  width: 2rem;
  height: 2rem;
}

.guest-features-grid--single .guest-feature-card__title {
  grid-column: 2;
  font-size: 1.25rem;
  margin: 0;
}

.guest-features-grid--single .guest-feature-card__list {
  grid-column: 2;
  margin: 0;
  padding-left: 1.25rem;
}

.guest-features-grid--single .guest-feature-card__btn {
  grid-column: 3;
  grid-row: 1 / -1;
  align-self: center;
  margin: 0;
}

@media (max-width: 639px) {
  .guest-features-grid--single .guest-feature-card {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto auto;
  }

  .guest-features-grid--single .guest-feature-card__icon {
    grid-row: auto;
  }

  .guest-features-grid--single .guest-feature-card__btn {
    grid-column: 1;
    grid-row: auto;
  }
}

.guest-feature-card {
  background: color-mix(in oklch, var(--accent) 6%, transparent);
  border: 1.5px solid color-mix(in oklch, var(--accent) 20%, transparent);
  border-radius: var(--radius-lg);
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: .75rem;
  transition: border-color var(--transition), box-shadow var(--transition);
}

.guest-feature-card:hover {
  border-color: color-mix(in oklch, var(--accent) 35%, transparent);
  box-shadow: var(--shadow-md);
}

.guest-feature-card__icon {
  width: 3rem;
  height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in oklch, var(--accent) 15%, transparent);
  border-radius: var(--radius);
}

.guest-feature-card__icon svg {
  width: 1.5rem;
  height: 1.5rem;
  color: var(--accent);
}

.guest-feature-card__icon .guest-feature-icon-motorcycle {
  width: 1.5rem;
  height: 1.5rem;
}

.guest-feature-card__title {
  font-family: var(--font-serif);
  font-size: 1.1rem;
  font-weight: 600;
  margin: 0;
}

.guest-feature-card__list {
  margin: 0;
  padding-left: 1.25rem;
  font-size: .875rem;
  color: var(--muted-fg);
  line-height: 1.6;
  list-style-type: disc;
  list-style-position: outside;
}

.guest-feature-card__list li {
  margin-bottom: .35rem;
}

.guest-feature-card__list li:last-child {
  margin-bottom: 0;
}

.guest-feature-card__btn {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  width: fit-content;
  border-color: color-mix(in oklch, var(--accent) 50%, transparent);
  color: var(--accent);
}

.guest-feature-card__btn:hover {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

/* Guest feature detail page */
.guest-feature-detail-hero {
  text-align: center;
  margin-bottom: 2rem;
}

.guest-feature-detail-icon {
  width: 4rem;
  height: 4rem;
  margin: 0 auto 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in oklch, var(--accent) 12%, transparent);
  border-radius: var(--radius-lg);
}

.guest-feature-detail-icon svg {
  width: 2rem;
  height: 2rem;
  color: var(--accent);
}

.guest-feature-detail-hero h1 {
  font-family: var(--font-serif);
  font-size: 1.6rem;
  margin: 0;
}

.guest-feature-detail-icon .guest-feature-icon-motorcycle {
  width: 2rem;
  height: 2rem;
}

.guest-feature-detail-list {
  padding-left: 1.5rem;
  line-height: 1.8;
  color: var(--muted-fg);
  list-style-type: disc;
  list-style-position: outside;
}

.guest-feature-detail-list li {
  margin-bottom: .5rem;
}

/* Sidebar / Booking card */
.detail-sidebar {
  min-width: 0;
}

@media (min-width: 1024px) {
  .detail-sidebar {
    position: sticky;
    top: calc(var(--header-full-h) + 1.5rem);
  }
}

.booking-card {
  background: var(--bg);
  border: 1.5px solid var(--border);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-lg);
  overflow: hidden;
}

@media (min-width: 1024px) {
  .detail-sidebar .booking-card {
    position: static;
  }
}

.booking-card__header {
  padding: 1.5rem 1.5rem 0;
}

.booking-card__price {
  font-size: 2rem;
  font-weight: 600;
  color: var(--accent);
}

.booking-card__per-night {
  font-size: .9rem;
  color: var(--muted-fg);
}

.booking-card__body {
  padding: 1.25rem 1.5rem 1.5rem;
}

.pricing-table {
  font-size: .875rem;
}

.pricing-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.2rem;
  padding: .5rem 0;
  border-bottom: 1px solid var(--border);
}

.pricing-row:last-child {
  border: none;
}

.pricing-row .label {
  color: var(--muted-fg);
}

.pricing-row .value {
  font-weight: 500;
  flex-shrink: 0;
  min-width: calc(4rem + 0px);
  text-align: right;
}

.booking-notice {
  font-size: .8125rem;
  color: var(--muted-fg);
  line-height: 1.6;
  margin-bottom: 1rem;
  padding: 1rem;
  background: rgba(0, 164, 214, .06);
  border-radius: var(--radius);
  border-left: 3px solid var(--accent);
}

.booking-notice p {
  margin: 0 0 .5rem;
}

.booking-notice p:last-child {
  margin-bottom: 0;
}

.booking-notice a {
  color: var(--accent);
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.booking-notice a:hover {
  color: var(--primary);
}

.booking-contact {
  background: rgba(17, 17, 17, .04);
  border-radius: var(--radius);
  padding: 1rem;
  margin-top: 1rem;
}

.booking-contact p {
  font-size: .875rem;
  font-weight: 500;
  text-align: center;
  margin-bottom: .75rem;
}

.booking-contact .btn+.btn {
  margin-top: .5rem;
}

.booking-location {
  padding: 1rem;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-lg);
  display: flex;
  align-items: flex-start;
  gap: .75rem;
}

.booking-location svg {
  color: var(--primary);
  margin-top: .125rem;
  flex-shrink: 0;
}

.booking-location p:first-child {
  font-weight: 500;
  font-size: .875rem;
}

.booking-location p:last-child {
  font-size: .75rem;
  color: var(--muted-fg);
}

/* FAQ Accordion */
.faq-list {
  display: flex;
  flex-direction: column;
  gap: .5rem;
}

.faq-item {
  border: 1.5px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}

.faq-question {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 1.25rem;
  font-weight: 500;
  cursor: pointer;
  background: none;
  border: none;
  width: 100%;
  text-align: left;
  font-family: var(--font-sans);
  font-size: .9375rem;
  color: var(--fg);
  transition: background var(--transition);
}

.faq-question:hover {
  background: var(--secondary);
}

.faq-question svg {
  flex-shrink: 0;
  transition: transform .25s ease;
}

.faq-item.is-open .faq-question svg {
  transform: rotate(180deg);
}

.faq-answer {
  display: none;
  padding: 0 1.25rem 1rem;
  color: var(--muted-fg);
  line-height: 1.7;
  font-size: .9375rem;
}

.faq-item.is-open .faq-answer {
  display: block;
}

.faq-answer a {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  color: var(--accent);
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color var(--transition);
}

.faq-answer a:hover {
  color: var(--primary);
}

/* Reviews */
.reviews-grid {
  display: grid;
  gap: 1.5rem;
}

@media (min-width: 768px) {
  .reviews-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .reviews-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.reviews-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.reviews-section-header .detail-section-title {
  margin-bottom: 0;
}

.reviews-section-header .detail-section-title .icon--star-lg {
  width: 1.5rem;
  height: 1.5rem;
  color: #fbbf24;
  fill: #fbbf24;
}

.reviews-section-rating {
  display: flex;
  align-items: center;
  gap: .5rem;
}

.reviews-stars-inline {
  display: flex;
  gap: .125rem;
}

.reviews-rating-value {
  font-weight: 600;
}

.reviews-count {
  color: var(--muted-fg);
  font-size: .9375rem;
}

.reviews-grid--detail {
  grid-template-columns: 1fr 1fr;
}

@media (max-width: 640px) {
  .reviews-grid--detail {
    grid-template-columns: 1fr;
  }
}

/* Reviews slider (apartment detail) */
.reviews-slider-nav {
  display: flex;
  align-items: center;
  gap: .5rem;
}

.reviews-slider-btn {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: var(--card-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background var(--transition), border-color var(--transition);
}

.reviews-slider-btn:hover {
  background: var(--secondary);
  border-color: var(--accent);
}

.reviews-slider-btn svg {
  width: 1.25rem;
  height: 1.25rem;
  color: var(--accent);
}

.reviews-slider {
  position: relative;
  min-width: 0;
}

.reviews-slider__wrap {
  position: relative;
  overflow: hidden;
}

.reviews-slider__track {
  display: flex;
  gap: 1rem;
  overflow-x: scroll;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: .25rem;
  min-width: 0;
}

.reviews-slider__track::-webkit-scrollbar {
  display: none;
}

.reviews-slider__wrap::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: .25rem;
  width: 3rem;
  background: linear-gradient(to left, var(--bg) 20%, transparent);
  pointer-events: none;
  opacity: 0;
  transition: opacity .3s;
}

.reviews-slider.reviews-slider--has-more .reviews-slider__wrap::after {
  opacity: 1;
}

.reviews-slider.reviews-slider--at-end .reviews-slider__wrap::after {
  opacity: 0;
}

.reviews-slider-dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: .5rem;
  margin-top: 1rem;
  padding: .25rem 0 .5rem;
}

.reviews-slider-dot {
  width: .5rem;
  height: .5rem;
  border-radius: 50%;
  background: var(--border);
  transition: background var(--transition), transform var(--transition);
  flex-shrink: 0;
}

.reviews-slider-dot.is-active {
  background: var(--accent);
  transform: scale(1.2);
}

.review-card--slider {
  flex: 0 0 auto;
  min-width: 17rem;
  width: 17rem;
  scroll-snap-align: start;
}

@media (min-width: 640px) {
  .review-card--slider {
    min-width: 20rem;
    width: 20rem;
  }
}

@media (min-width: 1024px) {
  .review-card--slider {
    min-width: 18rem;
    width: min(18rem, calc(33.333% - .67rem));
  }
}

.review-card {
  background: var(--card-bg);
  border: 1.5px solid var(--border);
  border-radius: var(--radius-xl);
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  transition: box-shadow var(--transition);
}

.review-card:hover {
  box-shadow: var(--shadow);
}

.review-card--detail {
  background: color-mix(in oklch, var(--secondary) 30%, transparent);
  border: 1px solid var(--border);
  padding: 1.25rem;
}

.review-quote-icon {
  width: 1.5rem;
  height: 1.5rem;
  color: var(--accent);
  opacity: 0.25;
  margin-bottom: .75rem;
  flex-shrink: 0;
}

.review-text {
  color: var(--muted-fg);
  font-size: .9375rem;
  line-height: 1.65;
  margin-bottom: 1rem;
  flex: 1;
}

.review-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: auto;
}

.review-footer .reviewer-name {
  font-weight: 500;
  font-size: .875rem;
  margin-bottom: .125rem;
}

.review-footer .reviewer-date {
  font-size: .75rem;
  color: var(--muted-fg);
}

.review-footer .review-stars {
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

.review-footer .review-stars .star {
  width: 0.75rem;
  height: 0.75rem;
}

.review-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 1rem;
}

.reviewer-info {
  display: flex;
  align-items: center;
  gap: .75rem;
}

.reviewer-avatar {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 9999px;
  background: var(--primary);
  color: var(--primary-fg);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  flex-shrink: 0;
}

.reviewer-name {
  font-weight: 500;
  font-size: .9375rem;
}

.reviewer-date {
  font-size: .75rem;
  color: var(--muted-fg);
  display: flex;
  align-items: center;
  gap: .25rem;
  margin-top: .125rem;
}

.review-stars {
  display: flex;
  gap: .125rem;
}

.review-apt {
  margin-bottom: .75rem;
}

.review-quote {
  flex: 1;
}

.review-original {
  color: var(--muted-fg);
  font-size: .875rem;
  font-style: italic;
  line-height: 1.65;
  margin-bottom: .75rem;
}

.review-translation {
  font-size: .875rem;
  color: rgba(17, 17, 17, .65);
  padding-left: .75rem;
  border-left: 2px solid rgba(17, 17, 17, .15);
  line-height: 1.65;
}

/* Stars */
.stars {
  display: inline-flex;
  gap: .125rem;
}

.star {
  width: 1rem;
  height: 1rem;
}

.star--filled {
  fill: #fbbf24;
  color: #fbbf24;
}

.star--empty {
  fill: none;
  stroke: #d1d5db;
  stroke-width: 1.5;
}

/* Reviews stats */
.reviews-stats {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 2rem 4rem;
  padding: 3rem 0;
  border-bottom: 1px solid var(--border);
}

.reviews-stat {
  text-align: center;
}

.reviews-stat__value {
  font-size: 3.5rem;
  font-weight: 600;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
}

.reviews-stat__label {
  font-size: .9rem;
  color: var(--muted-fg);
  margin-top: .5rem;
}

.reviews-sep {
  width: 1px;
  height: 4rem;
  background: var(--border);
}

@media (max-width: 640px) {
  .reviews-sep {
    display: none;
  }
}

/* ─────────────────────────────────────────────────────────
   ACTIVITIES PAGE
   ───────────────────────────────────────────────────────── */
.activities-section-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 2rem;
}

.activities-section-header__icon {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.activities-section-header__title {
  font-size: 1.5rem;
  margin-bottom: 0;
}

.activities-section-header__period {
  font-size: .875rem;
  color: var(--muted-fg);
  margin-top: .125rem;
}

.activity-card {
  background: var(--card-bg);
  border: 1.5px solid var(--border);
  border-radius: var(--radius-xl);
  overflow: hidden;
  transition: all var(--transition);
}

.activity-card:hover {
  box-shadow: var(--shadow-xl);
  transform: translateY(-2px);
}

.activity-card__img {
  position: relative;
  aspect-ratio: 4/3;
  overflow: hidden;
}

.activity-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}

.activity-card:hover .activity-card__img img {
  transform: scale(1.05);
}

.activity-card__img-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0, 0, 0, .55) 0%, transparent 55%);
}

.activity-card__icon-wrap {
  position: absolute;
  bottom: 1rem;
  left: 1rem;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: .625rem;
  background: rgba(255, 255, 255, .9);
  display: flex;
  align-items: center;
  justify-content: center;
}

.activity-card__icon-wrap svg {
  width: 1.25rem;
  height: 1.25rem;
  color: var(--accent);
}

.activity-card__body {
  padding: 1.25rem 1.5rem;
}

.activity-card__body .btn {
  transition: background var(--transition), color var(--transition), border-color var(--transition);
}

.activity-card:hover .activity-card__body .btn {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}

.activity-card__title {
  font-size: 1.125rem;
  margin-bottom: .5rem;
}

.activity-card__desc {
  color: var(--muted-fg);
  font-size: .875rem;
  line-height: 1.6;
  margin-bottom: 1rem;
}

/* Activity detail page */
.act-detail-page {
  min-height: 100vh;
}

.act-detail-hero {
  position: relative;
  height: 22rem;
  overflow: hidden;
}

@media (min-width: 768px) {
  .act-detail-hero {
    height: 28rem;
  }
}

.act-detail-hero__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.act-detail-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0, 0, 0, .8) 0%, rgba(0, 0, 0, .4) 40%, rgba(0, 0, 0, .2) 100%);
}

.act-detail-hero__back {
  position: absolute;
  top: 1rem;
  left: 1rem;
  z-index: 2;
}

@media (min-width: 768px) {
  .act-detail-hero__back {
    top: 1.5rem;
    left: 1.5rem;
  }
}

.act-detail-hero__back .btn {
  background: rgba(255, 255, 255, .9);
  box-shadow: var(--shadow);
}

.act-detail-hero__content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
  padding: 2rem 0 2rem;
}

.act-detail-hero__meta {
  display: flex;
  align-items: center;
  gap: .75rem;
  margin-bottom: 1rem;
}

.act-detail-hero__icon {
  width: 3rem;
  height: 3rem;
  border-radius: var(--radius);
  background: rgba(255, 255, 255, .95);
  box-shadow: var(--shadow);
  display: flex;
  align-items: center;
  justify-content: center;
}

.act-detail-hero__icon svg {
  width: 1.5rem;
  height: 1.5rem;
  color: var(--accent);
}

.act-detail-badge {
  padding: .35rem .75rem;
  border-radius: var(--radius);
  font-size: .8125rem;
  font-weight: 600;
}

.act-detail-badge--winter {
  background: #dbeafe;
  color: #1d4ed8;
}

.act-detail-badge--summer {
  background: rgba(245, 158, 11, .2);
  color: #d97706;
}

.act-detail-badge--year {
  background: rgba(17, 17, 17, .15);
  color: var(--primary);
}

.act-detail-hero__title {
  font-family: var(--font-serif);
  font-size: 1.75rem;
  font-weight: 700;
  color: #fff;
  margin: 0 0 .5rem;
}

@media (min-width: 768px) {
  .act-detail-hero__title {
    font-size: 2.5rem;
  }
}

.act-detail-hero__subtitle {
  color: rgba(255, 255, 255, .9);
  font-size: 1rem;
  margin: 0;
  max-width: 36rem;
}

@media (min-width: 768px) {
  .act-detail-hero__subtitle {
    font-size: 1.125rem;
  }
}

.act-detail-grid {
  display: grid;
  gap: 2.5rem;
}

@media (min-width: 1024px) {
  .act-detail-grid {
    grid-template-columns: 1fr 22rem;
    align-items: start;
  }
}

.act-detail-main {
  min-width: 0;
}

.act-detail-block {
  margin-bottom: 2.5rem;
}

.act-detail-h2 {
  font-family: var(--font-serif);
  font-size: 1.37rem;
  font-weight: 600;
  margin: 0 0 1rem;
}

.act-detail-desc {
  color: var(--secondary-fg);
  line-height: 1.8;
  margin: 0;
}

.act-detail-highlights {
  display: grid;
  gap: .75rem;
}

@media (min-width: 640px) {
  .act-detail-highlights {
    grid-template-columns: 1fr 1fr;
  }
}

.act-detail-highlight {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  padding: 1rem;
  background: rgba(0, 164, 214, .05);
  border: 1px solid rgba(0, 164, 214, .1);
  border-radius: var(--radius-xl);
}

.act-detail-highlight__icon {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 9999px;
  background: rgba(0, 164, 214, .1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: .125rem;
}

.act-detail-highlight__icon svg {
  width: 1rem;
  height: 1rem;
  color: var(--accent);
}

.act-detail-services-wrap {
  background: #fff;
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-lg);
  overflow: hidden;
}

.act-detail-services {
  display: grid;
  gap: 0;
  padding: 1.5rem;
}

@media (min-width: 640px) {
  .act-detail-services {
    grid-template-columns: 1fr 1fr;
  }
}

.act-detail-service {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .75rem 1rem;
  transition: background var(--transition);
}

.act-detail-service:hover {
  background: color-mix(in oklab, var(--secondary) 50%, transparent);
}

.act-detail-service__icon {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: var(--radius);
  background: color-mix(in oklab, var(--accent) 12%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.act-detail-service__icon svg {
  width: 1rem;
  height: 1rem;
  color: var(--accent);
}

.act-detail-tips {
  display: flex;
  flex-direction: column;
  gap: .75rem;
}

.act-detail-tip {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  padding: 1rem;
  background: rgba(245, 158, 11, .08);
  border: 1px solid rgba(245, 158, 11, .2);
  border-radius: var(--radius-xl);
}

.act-detail-tip__icon {
  width: 1.25rem;
  height: 1.25rem;
  color: #d97706;
  flex-shrink: 0;
  margin-top: .125rem;
}

.act-detail-distances {
  display: grid;
  gap: .75rem;
}

@media (min-width: 640px) {
  .act-detail-distances {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .act-detail-distances {
    grid-template-columns: repeat(3, 1fr);
  }
}

.act-detail-distance {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}

.act-detail-distance__icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--radius);
  background: color-mix(in oklab, var(--secondary) 40%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.act-detail-distance__icon svg {
  width: 1.25rem;
  height: 1.25rem;
  color: var(--accent);
}

.act-detail-distance__name {
  font-weight: 600;
  margin: 0 0 .25rem;
}

.act-detail-distance__val {
  font-size: .875rem;
  color: var(--muted-fg);
  margin: 0;
}

.act-detail-sidebar {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

@media (min-width: 1024px) {
  .act-detail-sidebar {
    position: sticky;
    top: calc(var(--header-h) + 1.5rem);
  }
}

.act-detail-cta {
  background: linear-gradient(135deg, var(--accent), #008bb8);
  color: #fff;
  padding: 1.5rem;
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-lg);
}

.act-detail-cta h3 {
  font-family: var(--font-serif);
  font-size: 1.125rem;
  margin: 0 0 .5rem;
}

.act-detail-cta p {
  font-size: .875rem;
  opacity: .9;
  margin: 0 0 1rem;
}

.act-detail-cta .btn {
  width: 100%;
  justify-content: center;
}

.act-detail-cta .btn-secondary {
  background: rgba(255, 255, 255, .95);
  color: var(--primary);
}

.act-detail-cta .btn-outline {
  border-color: rgba(255, 255, 255, .4);
  color: #fff;
}

.act-detail-cta .btn-outline:hover {
  background: rgba(255, 255, 255, .15);
}

.act-detail-related h3 {
  font-family: var(--font-serif);
  font-size: 1rem;
  font-weight: 600;
  margin: 0 0 1rem;
}

.act-detail-related__list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.act-detail-related__item {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  text-decoration: none;
  color: inherit;
  transition: transform var(--transition), box-shadow var(--transition);
}

.act-detail-related__item:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg);
}

.act-detail-related__item:hover .act-detail-related__title {
  color: var(--accent);
}

.act-detail-related__img {
  width: 4rem;
  height: 4rem;
  border-radius: var(--radius-sm);
  overflow: hidden;
  flex-shrink: 0;
}

.act-detail-related__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.act-detail-related__text {
  flex: 1;
  min-width: 0;
}

.act-detail-related__title {
  font-weight: 600;
  font-size: .875rem;
  margin: 0 0 .125rem;
  transition: color var(--transition);
}

.act-detail-related__sub {
  font-size: .75rem;
  color: var(--muted-fg);
  margin: 0;
}

.act-detail-related__item>svg {
  color: var(--muted-fg);
  flex-shrink: 0;
}

.act-detail-cta-bottom__title {
  font-family: var(--font-serif);
  font-size: 1.5rem;
  font-weight: 600;
  margin: 0 0 .5rem;
}

.act-detail-cta-bottom__desc {
  color: var(--muted-fg);
  max-width: 32rem;
  margin: 0 auto;
}

/* ─────────────────────────────────────────────────────────
   ABOUT PAGE
   ───────────────────────────────────────────────────────── */
.about-story {
  display: grid;
  gap: 3rem;
  align-items: center;
}

@media (min-width: 1024px) {
  .about-story {
    grid-template-columns: 1fr 1fr;
  }
}

.about-photo-wrap {
  position: relative;
}

.about-photo {
  border-radius: var(--radius-xl);
  overflow: hidden;
  aspect-ratio: 4/3;
  position: relative;
}

.about-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.about-float-card {
  position: absolute;
  background: var(--bg);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-xl);
  padding: .875rem 1rem;
}

.about-float-card--br {
  bottom: -1.5rem;
  right: -1.5rem;
}

.about-float-card--tl {
  top: -1rem;
  left: -1rem;
}

.about-float-inner {
  display: flex;
  align-items: center;
  gap: .75rem;
}

.about-float-icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 9999px;
  background: color-mix(in oklab, var(--accent) 10%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.about-float-icon svg {
  width: 1.25rem;
  height: 1.25rem;
  color: var(--accent);
}

.about-float-title {
  font-weight: 600;
  font-size: .875rem;
}

.about-float-sub {
  font-size: .75rem;
  color: var(--muted-fg);
}

.about-text h2 {
  margin-bottom: 1.5rem;
}

.about-text p {
  color: var(--muted-fg);
  line-height: 1.75;
  margin-bottom: 1rem;
}

.about-btns {
  display: flex;
  gap: 1rem;
  margin-top: 2rem;
}

.stats-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
  text-align: center;
}

@media (min-width: 768px) {
  .stats-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.stat-box__icon {
  width: 3rem;
  height: 3rem;
  border-radius: 9999px;
  background: rgba(255, 255, 255, .12);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1rem;
}

.stat-box__value {
  font-size: 2.5rem;
  font-weight: 600;
  margin-bottom: .25rem;
}

.stat-box__label {
  opacity: .7;
  font-size: .875rem;
}

.values-grid {
  display: grid;
  gap: 2rem;
  text-align: center;
}

@media (min-width: 768px) {
  .values-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.value-card {
  background: color-mix(in oklch, var(--secondary) 30%, transparent);
  border-radius: var(--radius-xl);
  padding: 2rem;
  border: 0;
  box-shadow: var(--shadow-sm);
}

.value-card__icon {
  width: 4rem;
  height: 4rem;
  border-radius: var(--radius-xl);
  background: color-mix(in oklab, var(--accent) 10%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.5rem;
}

.value-card__icon svg {
  width: 2rem;
  height: 2rem;
  color: var(--accent);
}

.value-card h3 {
  margin-bottom: .75rem;
  font-size: 1.03rem;
}

.value-card p {
  color: var(--muted-fg);
  font-size: .9375rem;
  line-height: 1.7;
}

.props-grid {
  display: grid;
  gap: 1.5rem;
}

@media (min-width: 640px) {
  .props-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .props-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.prop-thumb {
  border: 1.5px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: box-shadow var(--transition);
}

.prop-thumb:hover {
  box-shadow: var(--shadow);
}

.prop-thumb--link {
  display: block;
  color: inherit;
  text-decoration: none;
}

.prop-thumb--link:hover {
  color: inherit;
}

.prop-thumb__img {
  aspect-ratio: 4/3;
  overflow: hidden;
}

.prop-thumb__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}

.prop-thumb:hover .prop-thumb__img img {
  transform: scale(1.05);
}

.prop-thumb__body {
  padding: .875rem 1rem;
}

.prop-thumb__name {
  font-weight: 600;
  font-size: .9375rem;
}

.prop-thumb__desc {
  font-size: .8125rem;
  color: var(--muted-fg);
  margin-top: .125rem;
}

.about-props-cta {
  text-align: center;
  margin-top: 2rem;
}

.about-props-cta .btn {
  transition: background var(--transition), color var(--transition), border-color var(--transition);
}

.about-props-cta .btn:hover {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}

/* ─────────────────────────────────────────────────────────
   CONTACT PAGE
   ───────────────────────────────────────────────────────── */
.contact-methods {
  display: grid;
  gap: 1.5rem;
  margin-bottom: 4rem;
}

@media (min-width: 640px) {
  .contact-methods {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .contact-methods {
    grid-template-columns: repeat(4, 1fr);
  }
}

.section--contact {
  background: color-mix(in oklch, var(--secondary) 30%, transparent);
}

.contact-method {
  padding: 1.5rem;
  border: 1px solid var(--border);
  border-radius: var(--radius-xl);
  transition: box-shadow var(--transition);
  box-shadow: var(--shadow-sm);
  background: var(--card-bg);
}

.contact-method:hover {
  box-shadow: var(--shadow-lg);
}

.contact-method__icon {
  width: 3rem;
  height: 3rem;
  border-radius: .75rem;
  background: color-mix(in oklab, var(--accent) 10%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1rem;
  transition: background var(--transition);
}

.contact-method__icon svg {
  color: var(--accent);
}

.contact-method:hover .contact-method__icon {
  background: color-mix(in oklab, var(--accent) 15%, transparent);
}

.contact-method__title {
  font-weight: 600;
  margin-bottom: .25rem;
}

.contact-method__value {
  color: var(--accent);
  font-weight: 500;
  display: block;
  margin-bottom: .25rem;
  word-break: break-all;
  transition: color var(--transition);
}

a.contact-method__value:hover {
  color: #008bb8;
}

.contact-method__desc {
  font-size: .875rem;
  color: var(--muted-fg);
}

.contact-layout {
  display: grid;
  gap: 3rem;
  align-items: start;
}

@media (min-width: 1024px) {
  .contact-layout {
    grid-template-columns: 1fr 1fr;
  }
}

.contact-form-card {
  background: var(--bg);
  border: 1.5px solid var(--border);
  border-radius: var(--radius-xl);
  padding: 2rem;
  box-shadow: var(--shadow-xl);
}

.contact-form-card h2 {
  margin-bottom: 1.5rem;
}

.contact-form-success {
  text-align: center;
  padding: 3rem 0;
}

.contact-form-success__icon {
  width: 4rem;
  height: 4rem;
  border-radius: 9999px;
  background: rgba(17, 17, 17, .07);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.25rem;
}

.contact-form-success__icon svg {
  width: 2rem;
  height: 2rem;
}

.contact-form-success h3 {
  margin-bottom: .75rem;
}

.contact-form-success p {
  color: var(--muted-fg);
  margin-bottom: 1.5rem;
}

.why-direct h2 {
  margin-bottom: 1.5rem;
}

.why-list {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  margin-bottom: 2rem;
}

.why-item {
  display: flex;
  align-items: flex-start;
  gap: .875rem;
}

.why-item__icon {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 9999px;
  background: color-mix(in oklab, var(--accent) 10%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: .125rem;
}

.why-item__icon svg {
  width: 1rem;
  height: 1rem;
  color: var(--accent);
}

.why-item__title {
  font-weight: 600;
  font-size: .9375rem;
  margin-bottom: .125rem;
}

.why-item__desc {
  font-size: .875rem;
  color: var(--muted-fg);
}

.urgent-card {
  background: var(--accent);
  color: #fff;
  border-radius: var(--radius-xl);
  padding: 1.5rem;
}

.urgent-card h3 {
  margin-bottom: .75rem;
}

.urgent-card p {
  opacity: .8;
  margin-bottom: 1.25rem;
  font-size: .9375rem;
  line-height: 1.6;
}

.urgent-card .btn-row {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}

/* ─────────────────────────────────────────────────────────
   FOOTER
   ───────────────────────────────────────────────────────── */
.site-footer {
  background: var(--fg);
  color: var(--bg);
}

.footer-grid {
  display: grid;
  gap: 1.5rem;
  padding: 4rem 0 0 0;
}

@media (min-width: 640px) {
  .footer-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .footer-grid {
    grid-template-columns: 2fr 1fr 1.25fr 1.25fr 1.1fr;
  }
}



.footer-tagline {
  color: rgba(255, 255, 255, .65);
  font-size: .9rem;
  line-height: 1.7;
  margin: 1.25rem 0;
}

.footer-contacts {
  background: rgba(255, 255, 255, .08);
  border-radius: var(--radius);
  padding: 1rem 1.25rem;
  margin-bottom: 1rem;
}

.footer-contacts__label {
  font-size: .8125rem;
  font-weight: 500;
  margin-bottom: .75rem;
}

.footer-contact-link {
  display: flex;
  align-items: center;
  gap: .75rem;
  color: rgba(255, 255, 255, .75);
  font-size: .875rem;
  transition: color var(--transition);
  padding: .25rem 0;
}

.footer-contact-link:hover {
  color: #fff;
}

.footer-social-link {
  color: rgba(255, 255, 255, 0.65);
  transition: color var(--transition);
}

.footer-social-link:hover {
  color: #fff;
}

.footer-address {
  display: flex;
  align-items: center;
  gap: .5rem;
  color: rgba(255, 255, 255, .5);
  font-size: .8125rem;
  margin-top: .75rem;
}

.footer-heading {
  font-family: var(--font-serif);
  font-size: 1.125rem;
  font-weight: 600;
  margin-bottom: 1.5rem;
}

.footer-list li {
  margin-bottom: 0;
}

.footer-link {
  color: rgba(255, 255, 255, .65);
  font-size: .875rem;
  transition: color var(--transition);
}

.footer-link:hover {
  color: #fff;
}

.footer-resort {
  color: rgba(255, 255, 255, .65);
  font-size: .875rem;
}

.footer-discount {
  margin-top: 2rem;
  padding: 1rem;
  background: rgba(255, 255, 255, .08);
  border-radius: var(--radius);
}

.footer-discount__value {
  font-size: 1.5rem;
  font-weight: 700;
}

.footer-discount__label {
  font-size: .8125rem;
  opacity: .65;
  margin-top: .125rem;
}

.footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, .1);
}

.footer-bottom__inner {
  padding: 1.5rem 0;
  display: flex;
  flex-direction: column;
  gap: .75rem;
  align-items: center;
  justify-content: space-between;
  font-size: .8125rem;
  color: rgba(255, 255, 255, .5);
}

@media (min-width: 768px) {
  .footer-bottom__inner {
    flex-direction: row;
  }
}

.footer-bottom__links {
  display: flex;
  gap: 1.5rem;
}

/* ─────────────────────────────────────────────────────────
   VIDEO (YouTube embed)
   ───────────────────────────────────────────────────────── */
.video-wrapper {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  border-radius: var(--radius-xl);
  overflow: hidden;
  background: var(--secondary);
  min-height: 180px;
}

.video-wrapper iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: none;
}

/* ─────────────────────────────────────────────────────────
   404
   ───────────────────────────────────────────────────────── */
.page-404 {
  text-align: center;
  padding: 8rem 1rem;
}

.page-404 h1 {
  font-size: 5.49rem;
  line-height: 1;
  margin-bottom: .5rem;
}

.page-404 h2 {
  margin-bottom: 1rem;
}

.page-404 p {
  color: var(--muted-fg);
  margin-bottom: 2rem;
}

/* ─────────────────────────────────────────────────────────
   ADMIN PANEL
   ───────────────────────────────────────────────────────── */
.admin-layout {
  display: flex;
  min-height: 100vh;
}

.admin-sidebar {
  width: 260px;
  flex-shrink: 0;
  align-self: stretch;
  background: #1a1a1a;
  color: #fff;
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  min-height: 100vh;
  overflow-y: auto;
}

.admin-sidebar__logo {
  padding: 1.5rem;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.admin-sidebar__logo img {
  height: 2rem;
  filter: brightness(0) invert(1);
}

.admin-nav {
  padding: 1rem .75rem;
  flex: 1;
}

.admin-nav-group {
  margin-bottom: 1.5rem;
}

.admin-nav-group__label {
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .4);
  padding: 0 .75rem .5rem;
}

.admin-nav-link {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .625rem .875rem;
  border-radius: var(--radius);
  color: rgba(255, 255, 255, .7);
  font-size: .9rem;
  transition: all var(--transition);
  margin-bottom: .125rem;
}

.admin-nav-link:hover {
  color: #fff;
  background: rgba(255, 255, 255, .08);
}

.admin-nav-link.active {
  color: #fff;
  background: rgba(255, 255, 255, .12);
}

.admin-nav-link svg {
  width: 1.125rem;
  height: 1.125rem;
  flex-shrink: 0;
}

.admin-nav-icon--dog {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.admin-nav-icon--dog svg {
  width: 1.125rem;
  height: auto;
  color: inherit;
}

.admin-nav-badge {
  margin-left: auto;
  background: #e53e3e;
  color: #fff;
  font-size: .7rem;
  font-weight: 700;
  padding: .1rem .45rem;
  border-radius: 9999px;
}

.admin-main {
  flex: 1;
  overflow-x: auto;
}

.admin-topbar {
  background: var(--bg);
  border-bottom: 1px solid var(--border);
  padding: 0 2rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 3.5rem;
  position: sticky;
  top: 0;
  z-index: 50;
}

.admin-topbar__title {
  font-weight: 600;
  font-size: 1.0625rem;
}

.admin-topbar__right {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.admin-user {
  font-size: .875rem;
  color: var(--muted-fg);
}

.admin-logout {
  font-size: .8125rem;
  color: var(--muted-fg);
  padding: .35rem .75rem;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  transition: all var(--transition);
}

.admin-logout:hover {
  color: var(--fg);
  border-color: var(--fg);
}

.admin-content {
  padding: 2rem;
}

.admin-page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 2rem;
  gap: 1rem;
  flex-wrap: wrap;
}

.admin-page-header h1 {
  font-size: 1.37rem;
}

.admin-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.25rem;
  margin-bottom: 2rem;
}

@media (min-width: 1024px) {
  .admin-stats {
    grid-template-columns: repeat(4, 1fr);
  }
}

.admin-stat {
  background: var(--bg);
  border: 1.5px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 1.25rem 1.5rem;
  display: flex;
  align-items: flex-start;
  gap: 1rem;
}

.admin-stat__icon {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: .75rem;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(17, 17, 17, .07);
}

.admin-stat__value {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1;
}

.admin-stat__label {
  font-size: .8125rem;
  color: var(--muted-fg);
  margin-top: .25rem;
}

.admin-card {
  background: var(--bg);
  border: 1.5px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  margin-bottom: 1.5rem;
}

.admin-card__header {
  padding: 1rem 1.5rem;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: 600;
}

.admin-card__body {
  padding: 1.5rem;
}

/* Сворачиваемые секции в админке (длинные формы, напр. настройки) */
.admin-form--collapsible-sections>.admin-card>.admin-card__header {
  cursor: pointer;
  user-select: none;
  gap: 0.75rem;
  transition: background .15s ease;
}

.admin-form--collapsible-sections>.admin-card>.admin-card__header:hover {
  background: rgba(17, 17, 17, .04);
}

/* Без outline — рамка с острыми углами плохо смотрится на скруглённой карточке */
.admin-form--collapsible-sections>.admin-card>.admin-card__header:focus {
  outline: none;
}

.admin-form--collapsible-sections>.admin-card>.admin-card__header:focus-visible {
  background: rgba(17, 17, 17, .07);
}

.admin-form--collapsible-sections .admin-card__collapse-chevron {
  flex-shrink: 0;
  margin-left: auto;
  display: flex;
  align-items: center;
  color: var(--muted-fg);
  transition: transform .2s ease;
}

.admin-form--collapsible-sections>.admin-card.is-collapsed .admin-card__collapse-chevron {
  transform: rotate(-90deg);
}

.admin-form--collapsible-sections>.admin-card.is-collapsed .admin-card__body {
  display: none;
}

.admin-form--collapsible-sections>.admin-card.is-collapsed .admin-card__header {
  border-bottom: none;
}

.admin-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .875rem;
}

.admin-table th {
  background: var(--secondary);
  text-align: left;
  padding: .625rem 1rem;
  font-weight: 600;
  font-size: .8125rem;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}

.admin-table td {
  padding: .75rem 1rem;
  border-bottom: 1px solid var(--border);
  vertical-align: middle;
}

.admin-table tr:last-child td {
  border-bottom: none;
}

.admin-table tr:hover td {
  background: rgba(245, 245, 245, .5);
}

.admin-form {
  max-width: 60rem;
}

.admin-form-section {
  margin-bottom: 2rem;
}

.admin-form-section h3 {
  font-size: 0.914rem;
  font-weight: 600;
  margin-bottom: 1rem;
  padding-bottom: .5rem;
  border-bottom: 1px solid var(--border);
}

.admin-form-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

@media (max-width: 640px) {
  .admin-form-grid-2 {
    grid-template-columns: 1fr;
  }
}

.admin-image-preview {
  margin-bottom: .75rem;
}

.admin-image-preview__img {
  display: block;
  max-width: 200px;
  max-height: 120px;
  object-fit: cover;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  box-shadow: var(--shadow-sm);
}

.admin-image-preview__label {
  display: block;
  font-size: .8125rem;
  color: var(--muted-fg);
  margin-top: .25rem;
}

.admin-file-input {
  display: flex;
  flex-direction: column;
  gap: .5rem;
}

.admin-file-input__native {
  position: absolute;
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

.admin-file-input__btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  cursor: pointer;
  width: fit-content;
}

.admin-file-input__btn:hover {
  background: var(--secondary);
}

.admin-file-input__hint {
  font-size: .8125rem;
  color: var(--muted-fg);
}

.admin-lang-tabs {
  display: flex;
  border-bottom: 1px solid var(--border);
  margin-bottom: 1.5rem;
  gap: .25rem;
}

.admin-lang-tab {
  padding: .5rem 1rem;
  font-size: .875rem;
  font-weight: 500;
  border-bottom: 2px solid transparent;
  color: var(--muted-fg);
  cursor: pointer;
  transition: all var(--transition);
  background: none;
  border-top: none;
  border-left: none;
  border-right: none;
  font-family: var(--font-sans);
}

.admin-lang-tab:hover {
  color: var(--fg);
}

.admin-lang-tab.active {
  color: var(--primary);
  border-bottom-color: var(--primary);
}

.admin-lang-panel {
  display: none;
}

.admin-lang-panel.active {
  display: block;
}

/* Confirm modal */
.confirm-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  opacity: 0;
  visibility: hidden;
  transition: opacity .25s ease, visibility .25s ease;
}

.confirm-modal.is-open {
  opacity: 1;
  visibility: visible;
}

.confirm-modal[hidden] {
  display: none !important;
}

.confirm-modal:not([hidden]).is-open {
  display: flex;
}

.confirm-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .45);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.confirm-modal__box {
  position: relative;
  background: var(--bg);
  border: 1.5px solid var(--border);
  border-radius: var(--radius-xl);
  padding: 2rem;
  max-width: 28rem;
  width: 100%;
  box-shadow: var(--shadow-xl);
  transform: scale(0.95);
  transition: transform .25s ease;
}

.confirm-modal.is-open .confirm-modal__box {
  transform: scale(1);
}

.confirm-modal__icon {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: var(--radius-lg);
  background: rgba(220, 38, 38, .1);
  color: #dc2626;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.25rem;
}

.confirm-modal__icon svg {
  width: 1.75rem;
  height: 1.75rem;
}

.confirm-modal__title {
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: .5rem;
}

.confirm-modal__text {
  color: var(--muted-fg);
  font-size: .9375rem;
  line-height: 1.6;
  margin-bottom: 1.5rem;
}

.confirm-modal__actions {
  display: flex;
  gap: .75rem;
  justify-content: flex-end;
}

.confirm-modal__cancel {
  flex: 0 0 auto;
}

.confirm-modal__confirm {
  flex: 0 0 auto;
}

.status-badge {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  padding: .2rem .6rem;
  border-radius: 9999px;
  font-size: .75rem;
  font-weight: 500;
}

.status-new {
  background: #dbeafe;
  color: #1d4ed8;
}

.status-confirmed {
  background: #d1fae5;
  color: #065f46;
}

.status-cancelled {
  background: #fee2e2;
  color: #991b1b;
}

.status-completed {
  background: #e5e7eb;
  color: #374151;
}

.action-btns {
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
}

.btn-icon {
  width: 2rem;
  height: 2rem;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-sm);
}

.btn-danger {
  background: #fef2f2;
  color: #dc2626;
  border-color: #fecaca;
}

.btn-danger:hover {
  background: #fee2e2;
}

/* Login page */
.admin-login {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--secondary);
}

.admin-login__card {
  background: var(--bg);
  border: 1.5px solid var(--border);
  border-radius: var(--radius-xl);
  padding: 2.5rem;
  width: 100%;
  max-width: 28rem;
  box-shadow: var(--shadow-xl);
}

.admin-login__logo {
  text-align: center;
  margin-bottom: 2rem;
}

.admin-login__logo img {
  height: 3rem;
  margin: 0 auto;
}

.admin-login h1 {
  text-align: center;
  font-size: 1.37rem;
  margin-bottom: .5rem;
}

.admin-login__sub {
  text-align: center;
  color: var(--muted-fg);
  font-size: .9rem;
  margin-bottom: 2rem;
}

/* Pagination */
.pagination {
  display: flex;
  gap: .375rem;
  align-items: center;
  justify-content: center;
  margin-top: 1.5rem;
}

.page-btn {
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 .5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid var(--border);
  border-radius: var(--radius);
  font-size: .875rem;
  font-weight: 500;
  color: var(--fg);
  transition: all var(--transition);
  background: var(--bg);
}

.page-btn:hover {
  background: var(--secondary);
}

.page-btn.active {
  background: var(--primary);
  color: var(--primary-fg);
  border-color: var(--primary);
}

/* Responsive admin */
@media (max-width: 1024px) {
  .admin-sidebar {
    display: none;
  }

  .admin-layout {
    flex-direction: column;
  }
}

/* ─────────────────────────────────────────────────────────
   GUEST FEATURE PAGES (ski-instructors, bike-friendly, motorcycle)
   ───────────────────────────────────────────────────────── */
.guest-feature-page {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* Hero with badge */
.gfp-hero {
  background: color-mix(in oklch, var(--secondary) 50%, transparent);
  padding: 4rem 0 3rem;
}

@media (min-width: 768px) {
  .gfp-hero {
    padding: 6rem 0 4rem;
  }
}

.gfp-hero__grid {
  display: grid;
  gap: 3rem;
  align-items: center;
}

@media (min-width: 1024px) {
  .gfp-hero__grid {
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
  }
}

.gfp-hero__badge {
  margin-bottom: 1rem;
}

.gfp-hero__title {
  font-family: var(--font-serif);
  font-size: clamp(2rem, 5vw, 3rem);
  font-weight: 600;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.gfp-hero__desc {
  color: var(--muted-fg);
  font-size: 1.125rem;
  line-height: 1.75;
  margin-bottom: 1.5rem;
}

.gfp-hero__btns {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

.gfp-hero__media {
  position: relative;
}

.gfp-hero__img-wrap {
  aspect-ratio: 4/3;
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.gfp-hero__img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Floating badge */
.gfp-floating-badge {
  position: absolute;
  bottom: -1.5rem;
  left: -1.5rem;
  background: var(--bg);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-xl);
  padding: 1rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.gfp-floating-badge__icon {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: color-mix(in oklch, var(--primary) 20%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary);
}

.gfp-floating-badge__icon svg {
  width: 1.5rem;
  height: 1.5rem;
}

.gfp-floating-badge__label {
  font-size: 1.125rem;
  font-weight: 600;
}

.gfp-floating-badge__sublabel {
  font-size: 0.875rem;
  color: var(--muted-fg);
}

.gfp-floating-badge--green .gfp-floating-badge__icon {
  background: color-mix(in oklch, var(--casa-green) 20%, transparent);
  color: var(--casa-green);
}

/* Section secondary light */
.section--secondary-light {
  background: color-mix(in oklch, var(--secondary) 30%, transparent);
}

/* Description block */
.gfp-description {
  max-width: 64rem;
  margin: 0 auto;
  display: grid;
  gap: 2rem;
  align-items: center;
}

@media (min-width: 768px) {
  .gfp-description {
    grid-template-columns: 1fr 1fr;
  }
}

.gfp-description .badge {
  margin-bottom: 1rem;
}

.gfp-section-title {
  font-family: var(--font-serif);
  font-size: clamp(1.5rem, 3vw, 2.5rem);
  font-weight: 600;
  margin-bottom: 1rem;
}

.gfp-img-square {
  aspect-ratio: 1;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--secondary);
}

.gfp-img-square img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Section header */
.gfp-section-header {
  text-align: center;
  margin-bottom: 3rem;
}

.gfp-section-header .badge {
  margin-bottom: 1rem;
}

.gfp-section-header .gfp-section-title {
  margin-bottom: 0.5rem;
}

.gfp-section-subtitle {
  color: var(--muted-fg);
  max-width: 42rem;
  margin: 0 auto;
}

/* Service cards */
.gfp-services-grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1fr;
}

@media (min-width: 768px) {
  .gfp-services-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .gfp-services-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.gfp-service-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  padding: 1.5rem;
  text-align: center;
  transition: box-shadow var(--transition);
}

.gfp-service-card:hover {
  box-shadow: var(--shadow-lg);
}

.gfp-service-card__icon {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: var(--radius-lg);
  background: color-mix(in oklch, var(--primary) 10%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1rem;
  color: var(--primary);
}

.gfp-service-card__icon svg {
  width: 1.75rem;
  height: 1.75rem;
}

.gfp-service-card__title {
  font-family: var(--font-serif);
  font-size: 1.125rem;
  font-weight: 600;
  margin-bottom: 0.5rem;
}

.gfp-service-card__desc {
  color: var(--muted-fg);
  font-size: 0.875rem;
}

/* Checklist */
.gfp-checklist-card {
  margin-top: 3rem;
  max-width: 48rem;
  margin-left: auto;
  margin-right: auto;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  padding: 2rem;
}

.gfp-checklist-title {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-weight: 600;
  text-align: center;
  margin-bottom: 1.5rem;
}

.gfp-checklist-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr;
}

@media (min-width: 640px) {
  .gfp-checklist-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.gfp-checklist-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.gfp-checklist-icon {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 0.75rem;
  font-weight: 700;
}

.gfp-checklist-icon--green {
  background: color-mix(in oklch, var(--casa-green) 20%, transparent);
  color: var(--casa-green);
}

/* Lesson types */
.gfp-lesson-types {
  display: grid;
  gap: 1.5rem;
  max-width: 64rem;
  margin: 0 auto;
  grid-template-columns: 1fr;
}

@media (min-width: 768px) {
  .gfp-lesson-types {
    grid-template-columns: repeat(3, 1fr);
  }
}

.gfp-lesson-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.5rem;
  box-shadow: var(--shadow-sm);
  transition: transform var(--transition), box-shadow var(--transition);
}

.gfp-lesson-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
}

.gfp-lesson-card .badge {
  margin-bottom: 1rem;
}

.gfp-lesson-card__title {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: 0.75rem;
}

.gfp-lesson-card__desc {
  color: var(--muted-fg);
  font-size: 0.875rem;
}

/* Resort cards */
.gfp-resorts-grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1fr 1fr;
}

@media (min-width: 1024px) {
  .gfp-resorts-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.gfp-resort-card {
  overflow: hidden;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  transition: transform var(--transition), box-shadow var(--transition);
}

.gfp-resort-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
}

.gfp-resort-card__img {
  aspect-ratio: 4/3;
  position: relative;
  overflow: hidden;
}

.gfp-resort-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.gfp-resort-card:hover .gfp-resort-card__img img {
  transform: scale(1.05);
}

.gfp-resort-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0, 0, 0, .6), transparent);
}

.gfp-resort-card__name {
  position: absolute;
  bottom: 1rem;
  left: 1rem;
  right: 1rem;
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-weight: 600;
  color: #fff;
}

.gfp-resort-card__body {
  padding: 1rem;
}

.gfp-resort-card__body p {
  margin: 0;
}

/* Route cards (bike/moto) */
.gfp-routes-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr 1fr;
}

@media (min-width: 1024px) {
  .gfp-routes-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1280px) {
  .gfp-routes-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.gfp-route-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  padding: 1.25rem;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  transition: transform var(--transition), box-shadow var(--transition);
}

.gfp-route-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
}

.gfp-route-card__link {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--radius);
  background: var(--secondary);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background var(--transition), color var(--transition);
}

.gfp-route-card:hover .gfp-route-card__link {
  background: var(--accent);
  color: #fff;
}

.gfp-route-card__title {
  font-weight: 600;
  margin-bottom: 0.25rem;
}

.gfp-route-card__desc {
  font-size: 0.875rem;
  color: var(--muted-fg);
}

/* Note section */
.gfp-note-section {
  background: color-mix(in oklch, var(--primary) 10%, transparent);
}

.gfp-note {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  max-width: 48rem;
  margin: 0 auto;
}

.gfp-note__icon {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: color-mix(in oklch, var(--primary) 20%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--primary);
}

.gfp-note__icon svg {
  width: 1.5rem;
  height: 1.5rem;
}

.gfp-note__title {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: 0.5rem;
}

.gfp-note-section .text-muted {
  margin: 0;
}

.gfp-note-section--green {
  background: color-mix(in oklch, var(--casa-green) 10%, transparent);
}

.gfp-note__icon--green {
  background: color-mix(in oklch, var(--casa-green) 20%, transparent);
  color: var(--casa-green);
}

.gfp-note-section--blue {
  background: color-mix(in oklch, var(--accent) 10%, transparent);
}

.gfp-note__icon--blue {
  background: color-mix(in oklch, var(--accent) 20%, transparent);
  color: var(--accent);
}

.gfp-checklist-list {
  list-style: none;
  margin: 1.5rem 0 0;
  padding: 0;
}

.gfp-checklist-list li {
  margin-bottom: 0.75rem;
}

.gfp-services-grid--bike .gfp-service-card {
  background: color-mix(in oklch, var(--secondary) 30%, transparent);
}

.gfp-services-grid--bike .gfp-service-card__icon {
  background: color-mix(in oklch, var(--accent) 20%, transparent);
  color: var(--accent);
}

.gfp-services-grid--moto .gfp-service-card__icon {
  background: color-mix(in oklch, var(--accent) 20%, transparent);
  color: var(--accent);
}

.gfp-routes-grid--moto {
  grid-template-columns: 1fr 1fr;
}

@media (min-width: 1024px) {
  .gfp-routes-grid--moto {
    grid-template-columns: repeat(4, 1fr);
  }
}

.gfp-routes-section--moto {
  background: var(--bg);
}

.gfp-route-card--moto {
  flex-direction: column;
  align-items: stretch;
}

.gfp-route-card--moto .gfp-route-card__content {
  flex: 1;
}

.gfp-route-card--moto .gfp-route-card__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.25rem;
}

.gfp-route-card--moto .gfp-route-card__title {
  font-size: 0.9375rem;
  font-weight: 600;
  margin-bottom: 0;
  flex: 1;
  min-width: 0;
}

.gfp-route-card--moto .badge {
  display: inline-block;
  margin-bottom: 0.75rem;
}

@media (min-width: 768px) {
  .gfp-description--reverse {
    direction: rtl;
  }

  .gfp-description--reverse>* {
    direction: ltr;
  }

  .gfp-description--reverse .gfp-description__content {
    order: 2;
  }

  .gfp-description--reverse .gfp-description__media {
    order: 1;
  }
}

.gfp-location-distances {
  margin-top: 1.5rem;
}

.gfp-location-item {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  background: var(--bg);
  border-radius: var(--radius-lg);
  margin-bottom: 1rem;
}

.gfp-location-item__icon {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: color-mix(in oklch, var(--accent) 20%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--accent);
}

.gfp-location-item__icon svg {
  width: 1.5rem;
  height: 1.5rem;
}

.gfp-location-item__name {
  font-weight: 600;
  margin-bottom: 0.25rem;
}

.gfp-location-item__dist {
  font-size: 0.875rem;
  color: var(--muted-fg);
  margin: 0;
}

/* CTA contacts */
.cta-section__desc {
  max-width: 36rem;
  margin: 0 auto 2rem;
}

.gfp-cta-contacts {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  justify-content: center;
  align-items: center;
  font-size: 0.875rem;
  margin-top: 1.5rem;
}

.gfp-cta-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: inherit;
  opacity: 0.9;
  transition: opacity var(--transition);
}

.gfp-cta-link:hover {
  opacity: 1;
}

/* Leading relaxed utility */
.leading-relaxed {
  line-height: 1.75;
}

/* Restaurants page */
.rest-price-legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  margin-top: 1.5rem;
}

.rest-price-legend__label {
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--muted-fg);
  line-height: 1.4;
  display: inline-flex;
  align-items: center;
  min-height: 1.75rem;
}

.rest-price-legend__badges {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.rest-price-legend__badges .badge {
  gap: 0.25rem;
  margin-bottom: 0;
}

.rest-price-icon {
  width: 0.75rem;
  height: 0.75rem;
  flex-shrink: 0;
}

/* Переопределяем .page-hero .badge — зелёный, жёлтый, розовый */
.rest-price-legend__badges .badge.rest-price--budget {
  background: #dcfce7 !important;
  color: #166534 !important;
  border-color: transparent !important;
}

.rest-price-legend__badges .badge.rest-price--mid {
  background: #fef3c7 !important;
  color: #92400e !important;
  border-color: transparent !important;
}

.rest-price-legend__badges .badge.rest-price--expensive {
  background: #ffe4e6 !important;
  color: #9f1239 !important;
  border-color: transparent !important;
}

/* Цветные бейджи цен в карточках ресторанов */
.rest-card .badge.rest-price--budget {
  background: #dcfce7;
  color: #166534;
  border-color: transparent;
}

.rest-card .badge.rest-price--mid {
  background: #fef3c7;
  color: #92400e;
  border-color: transparent;
}

.rest-card .badge.rest-price--expensive {
  background: #ffe4e6;
  color: #9f1239;
  border-color: transparent;
}

.rest-location-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 2rem;
}

.rest-location-icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: color-mix(in oklch, var(--accent) 20%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--accent);
}

.rest-location-icon svg {
  width: 1.25rem;
  height: 1.25rem;
}

.rest-location-title {
  font-family: var(--font-serif);
  font-size: 1.5rem;
  font-weight: 600;
  margin: 0;
}

.rest-grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1fr;
}

@media (min-width: 768px) {
  .rest-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .rest-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.rest-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition: box-shadow var(--transition);
}

.rest-card:hover {
  box-shadow: var(--shadow-lg);
}

.rest-card__img {
  aspect-ratio: 16/10;
  overflow: hidden;
  background: var(--secondary);
}

.rest-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.rest-card__header {
  padding: 1.25rem 1.25rem 0;
}

.rest-card__body {
  padding: 1rem 1.25rem 1.25rem;
}

.rest-card:not(:has(.rest-card__img)) .rest-card__header {
  padding-top: 1.25rem;
}

.rest-card:not(:has(.rest-card__img)) .rest-card__body {
  padding-top: 0;
}

.rest-card__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.rest-card__title-wrap {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  flex: 1;
  min-width: 0;
}

.rest-card__icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--radius);
  background: color-mix(in oklch, var(--accent) 15%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--accent);
}

.rest-card__icon svg {
  width: 1.25rem;
  height: 1.25rem;
}

.rest-card__title {
  font-family: var(--font-serif);
  font-size: 1.125rem;
  font-weight: 600;
  margin: 0 0 0.25rem;
}

.rest-card__sub {
  font-size: 0.875rem;
  color: var(--accent);
  font-weight: 500;
  margin: 0;
}

.rest-card__desc {
  font-size: 0.875rem;
  color: var(--muted-fg);
  line-height: 1.6;
  margin-bottom: 1rem;
}

.rest-card__meta {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  font-size: 0.875rem;
  color: var(--muted-fg);
}

.rest-card__meta-item {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}

.rest-card__meta-item svg {
  flex-shrink: 0;
  margin-top: 0.125rem;
}

.rest-card__meta-item a {
  color: inherit;
}

.rest-card__meta-item a:hover {
  color: var(--accent);
}

.rest-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  margin-top: 1rem;
}

.rest-tips {
  max-width: 42rem;
  margin: 1.5rem auto 0;
  text-align: center;
}

.rest-tips p {
  margin-bottom: 1rem;
  opacity: 0.9;
}

.rest-tips p:last-child {
  margin-bottom: 0;
}

/* ─────────────────────────────────────────────────────────
   WEATHER PAGE
   ───────────────────────────────────────────────────────── */
.weather-page {
  background: oklch(0.985 0.005 220);
  min-height: 100vh;
}

.weather-page .page-hero {
  padding-bottom: 2rem;
}

.weather-hero-actions {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 1rem;
  flex-wrap: wrap;
}

.weather-updated {
  font-size: 0.875rem;
  color: var(--muted-fg);
}

.weather-tabs-wrap {
  display: flex;
  justify-content: center;
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.weather-tabs {
  display: inline-flex;
  align-items: center;
  height: 2.25rem;
  min-width: 24rem;
  padding: 3px;
  border-radius: 9999px;
  background: var(--secondary);
}

@media (max-width: 480px) {
  .weather-tabs {
    min-width: 20rem;
  }
}

.weather-tab {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  height: calc(100% - 2px);
  min-width: 0;
  padding: 0 1.5rem;
  border: none;
  border-radius: 9999px;
  background: transparent;
  color: var(--muted-fg);
  font-size: 0.875rem;
  font-weight: 500;
  white-space: nowrap;
  cursor: pointer;
  transition: color var(--transition), background var(--transition), box-shadow var(--transition);
}

.weather-tab:hover {
  color: var(--fg);
}

.weather-tab.is-active {
  background: var(--bg);
  color: var(--fg);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.weather-refresh-icon {
  margin-right: 0.5rem;
}

.weather-refresh-icon.is-loading {
  animation: weather-spin 0.8s linear infinite;
}

@keyframes weather-spin {
  to {
    transform: rotate(360deg);
  }
}

.weather-error {
  text-align: center;
  padding: 3rem 2rem;
}

.weather-error p {
  margin-bottom: 1rem;
  color: var(--muted-fg);
}

.weather-container {
  padding-bottom: 3rem;
}

.weather-section {
  padding: 2rem 0;
}

.weather-section-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--font-serif);
  font-size: 1.5rem;
  font-weight: 600;
  margin-bottom: 1.5rem;
}

.weather-section-title .icon {
  width: 1.5rem;
  height: 1.5rem;
  color: var(--accent);
}

.weather-section-title .icon--section {
  width: 1.5rem;
  height: 1.5rem;
  color: var(--accent);
  flex-shrink: 0;
}

.weather-aosta-section {
  padding: 2rem 0;
}

.weather-aosta-anim-wrap {
  overflow: visible;
  transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.weather-aosta-grid {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

@media (min-width: 768px) {
  .weather-aosta-grid {
    flex-direction: row;
    align-items: stretch;
    gap: 2rem;
  }

  .weather-aosta-card-wrap {
    flex: 0.9 1 0;
    min-width: 0;
  }

  .weather-aosta-banner {
    flex: 1.1 1 0;
    min-width: 0;
  }
}

.weather-aosta-card-wrap {
  min-height: 0;
  padding: 0 0 1rem 1rem;
}

@media (max-width: 767px) {
  .weather-aosta-card-wrap {
    padding: 0;
    min-width: 0;
  }

  .weather-aosta-section .weather-card {
    min-width: 0;
    overflow: hidden;
  }
}

.weather-aosta-card-wrap--full {
  flex: 1 1 100%;
}

.weather-aosta-banner {
  position: relative;
  border-radius: var(--radius);
  overflow: hidden;
  min-height: 200px;
}

@media (min-width: 768px) {
  .weather-aosta-banner {
    min-height: 0;
    align-self: stretch;
  }
}

.weather-aosta-banner img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.weather-banner-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.2) 40%, transparent 70%);
}

.weather-banner-content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1.5rem;
}

.weather-banner-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.weather-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.25rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 500;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.95);
  color: var(--fg);
}

.weather-badge .icon-sm {
  width: 0.875rem;
  height: 0.875rem;
  flex-shrink: 0;
}

.weather-badge--capital {
  background: var(--accent);
  color: #fff;
}

.weather-badge--resort {
  background: rgba(0, 164, 214, 0.12);
  color: var(--accent);
}

.weather-badge--city {
  background: transparent;
  border: 1px solid var(--border);
}

.weather-banner-content p {
  color: #fff;
  font-size: 0.875rem;
  margin: 0;
  max-width: 28rem;
}

.weather-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.5rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.weather-card--large {
  padding: 1.5rem;
}

@media (min-width: 640px) {
  .weather-card--large {
    padding: 1.5rem 2rem;
  }
}

.weather-card--large {
  background: linear-gradient(135deg, rgba(0, 164, 214, 0.08) 0%, rgba(0, 164, 214, 0.03) 50%, transparent 100%);
  border-color: rgba(0, 164, 214, 0.2);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 164, 214, 0.08);
}

.weather-card-skeleton .skeleton-line {
  background: var(--border);
  border-radius: 4px;
  height: 1rem;
}

.weather-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 1rem;
}

.weather-card-title-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.weather-card-title-row h3 {
  font-family: var(--font-serif);
  font-size: 1.14rem;
  font-weight: 700;
  margin: 0;
}

.weather-card-elevation {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.8125rem;
  color: var(--muted-fg);
  margin-top: 0.25rem;
}

.weather-card-icon {
  padding: 0.5rem;
  border-radius: 0.75rem;
  background: rgba(0, 164, 214, 0.1);
}

.weather-card-icon svg {
  width: 2rem;
  height: 2rem;
  color: var(--accent);
}

.weather-card-icon--sun {
  width: 4rem;
  height: 4rem;
  min-width: 4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem;
  box-sizing: border-box;
}

.weather-card-icon--sun svg {
  width: 3rem;
  height: 3rem;
}

.weather-card-icon--sm {
  width: 2.5rem;
  height: 2.5rem;
  min-width: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem;
  box-sizing: border-box;
  flex-shrink: 0;
}

.weather-card-icon--sm svg {
  width: 1.5rem;
  height: 1.5rem;
}

.weather-card-temp {
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.weather-card-temp--sm {
  flex-direction: column;
  align-items: flex-start;
  gap: 0.25rem;
  margin-bottom: 0.75rem;
}

.weather-temp-value {
  font-size: 2.5rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.weather-card-temp--sm .weather-temp-value {
  font-size: 1.75rem;
}

.weather-desc {
  font-size: 1rem;
  text-transform: capitalize;
}

.weather-feels {
  display: block;
  font-size: 0.8125rem;
  color: var(--muted-fg);
}

.weather-card-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
}

.weather-card-stats--sm {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  font-size: 0.8125rem;
  color: var(--muted-fg);
}

.weather-stat-sm {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
}

.weather-stat-sm .icon-sm {
  flex-shrink: 0;
}

.weather-icon-wind-sm {
  color: #3b82f6;
}

.weather-icon-humidity-sm {
  color: #06b6d4;
}

.weather-stat {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem;
  border-radius: 0.75rem;
  background: rgba(255, 255, 255, 0.6);
}

.weather-stat-icon {
  width: 2.5rem;
  height: 2.5rem;
  min-width: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem;
  flex-shrink: 0;
}

.weather-stat-icon--wind {
  background: rgba(59, 130, 246, 0.1);
}

.weather-stat-icon svg {
  width: 1.25rem;
  height: 1.25rem;
}

.weather-stat-icon--wind svg {
  color: #3b82f6;
}

.weather-stat-icon--humidity {
  background: rgba(6, 182, 212, 0.1);
}

.weather-stat-icon--humidity svg {
  color: #06b6d4;
}

.weather-stat-icon--sunrise {
  background: rgba(245, 158, 11, 0.1);
}

.weather-stat-icon--sunrise svg {
  color: #f59e0b;
}

.weather-stat-icon--sunset {
  background: rgba(249, 115, 22, 0.1);
}

.weather-stat-icon--sunset svg {
  color: #f97316;
}

.weather-stat-label {
  display: block;
  font-size: 0.75rem;
  color: var(--muted-fg);
}

.weather-stat-value {
  font-size: 0.875rem;
  font-weight: 600;
}

.weather-icon-thermometer {
  color: #f87171;
}

.weather-cards-grid {
  display: grid;
  gap: 1.25rem;
}

@media (min-width: 640px) {
  .weather-cards-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .weather-cards-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.weather-card:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.weather-forecast-days {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.weather-forecast-day {
  display: grid;
  grid-template-columns: 6rem 2.5rem 1fr auto;
  align-items: center;
  gap: 0.75rem;
  padding: 0.5rem 0.75rem;
  border-radius: 0.75rem;
  background: rgba(255, 255, 255, 0.6);
}

.weather-forecast-day.is-today {
  background: rgba(0, 164, 214, 0.1);
  border: 1px solid rgba(0, 164, 214, 0.2);
}

.weather-forecast-day-name {
  display: flex;
  flex-direction: column;
}

.weather-forecast-day-date {
  font-size: 0.75rem;
  color: var(--muted-fg);
}

.weather-forecast-day-icon svg {
  width: 1.5rem;
  height: 1.5rem;
  color: var(--accent);
}

.weather-forecast-day-temp {
  display: flex;
  align-items: baseline;
  gap: 0.25rem;
}

.weather-temp-max {
  font-size: 1.25rem;
  font-weight: 700;
}

.weather-temp-min {
  font-size: 1rem;
  color: var(--muted-fg);
}

.weather-forecast-day-desc {
  font-size: 0.875rem;
  color: var(--muted-fg);
  text-transform: capitalize;
}

.weather-forecast-day-extra {
  display: flex;
  gap: 1rem;
  font-size: 0.75rem;
  color: var(--muted-fg);
}

.weather-forecast-days--aosta {
  gap: 0.75rem;
}

.weather-forecast-day-aosta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  border-radius: 1rem;
  background: rgba(255, 255, 255, 0.6);
}

.weather-forecast-day-top {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-shrink: 0;
}

.weather-forecast-day-left {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}

.weather-forecast-day-aosta .weather-forecast-day-name {
  min-width: 6rem;
  flex-shrink: 0;
}

@media (max-width: 767px) {
  .weather-forecast-day-aosta {
    flex-direction: column;
    align-items: stretch;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    min-width: 0;
  }

  .weather-forecast-day-top {
    flex-wrap: nowrap;
  }

  .weather-forecast-day-top .weather-forecast-day-temp-block {
    order: 1;
  }

  .weather-forecast-day-top .weather-forecast-day-icon-aosta {
    order: 2;
  }

  .weather-forecast-day-aosta .weather-forecast-day-name {
    min-width: 4rem;
    font-size: 0.875rem;
  }

  .weather-forecast-day-temp-block {
    flex: 1 1 auto;
    min-width: 0;
  }

  .weather-forecast-day-aosta .weather-forecast-day-desc {
    text-align: center;
    font-size: 0.875rem;
  }

  .weather-forecast-day-aosta .weather-forecast-day-stats {
    justify-content: center;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 1rem;
  }
}

.weather-forecast-day-aosta.is-today {
  background: rgba(0, 164, 214, 0.1);
  border: 1px solid rgba(0, 164, 214, 0.2);
}

@media (max-width: 767px) {

  .weather-forecast-day-aosta.is-tomorrow,
  .weather-forecast-day-aosta.is-day-after {
    background: rgba(0, 164, 214, 0.06);
    border: 1px solid rgba(0, 164, 214, 0.12);
  }
}

.weather-forecast-day-temp-block {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  min-width: 0;
}

.weather-forecast-day-icon-aosta {
  width: 2.5rem;
  height: 2.5rem;
  min-width: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem;
  background: rgba(0, 164, 214, 0.12);
  flex-shrink: 0;
}

.weather-forecast-day-icon-aosta svg {
  width: 1.5rem;
  height: 1.5rem;
  color: var(--accent);
  flex-shrink: 0;
}

.weather-forecast-day-aosta .weather-forecast-day-temp {
  margin: 0;
}

.weather-forecast-day-aosta .weather-forecast-day-desc {
  font-size: 0.875rem;
  color: var(--muted-fg);
  text-transform: capitalize;
  text-align: center;
  flex: 1;
  min-width: 0;
}

.weather-forecast-day-stats {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  flex-shrink: 0;
}

.weather-forecast-stat {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  color: var(--muted-fg);
}

.weather-forecast-stat-icon {
  display: inline-flex;
}

.weather-forecast-stat-icon--wind svg {
  width: 1rem;
  height: 1rem;
  color: #3b82f6;
}

.weather-forecast-stat-icon--humidity svg {
  width: 1rem;
  height: 1rem;
  color: #06b6d4;
}

.weather-forecast-days--compact .weather-forecast-day-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.25rem 0;
}

.weather-forecast-day-name-sm {
  min-width: 5rem;
  font-size: 0.875rem;
  font-weight: 500;
}

.weather-forecast-day-icon-sm {
  width: 2.25rem;
  height: 2.25rem;
  min-width: 2.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border-radius: 0.5rem;
  background: rgba(0, 164, 214, 0.1);
}

.weather-forecast-day-icon-sm svg {
  width: 1.25rem;
  height: 1.25rem;
  color: var(--accent);
}

.weather-forecast-day-temp-sm {
  font-weight: 600;
}

.weather-forecast-day-temp-extra-wrap {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex: 1;
  min-width: 0;
}

.weather-forecast-day-desc-sm {
  font-size: 0.75rem;
  color: var(--muted-fg);
  text-transform: capitalize;
  flex: 1;
}

.weather-card-header--with-toggle {
  flex-wrap: wrap;
  gap: 0.5rem;
}

.weather-forecast-toggle-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.25rem 0.5rem;
  font-size: 0.75rem;
  color: var(--muted-fg);
  background: none;
  border: none;
  cursor: pointer;
  border-radius: 0.375rem;
  transition: color 0.2s, background 0.2s;
  flex-shrink: 0;
}

.weather-forecast-toggle-btn:hover {
  color: var(--accent);
  background: rgba(0, 164, 214, 0.08);
}

.weather-forecast-toggle-icon {
  width: 0.875rem;
  height: 0.875rem;
  transition: transform 0.2s;
}

.weather-card.is-expanded .weather-forecast-toggle-icon {
  transform: rotate(90deg);
}

.weather-forecast-day-extra-sm {
  display: none;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.75rem;
  color: var(--muted-fg);
  flex: 1;
}

.weather-forecast-day-extra-sm span {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  white-space: nowrap;
}

.weather-forecast-day-extra-sm .icon-sm {
  width: 0.75rem;
  height: 0.75rem;
  flex-shrink: 0;
}

.weather-card.is-expanded .weather-forecast-day-desc--default {
  display: none;
}

.weather-card.is-expanded .weather-forecast-day-extra--expanded {
  display: flex;
}

.weather-card.is-expanded .weather-forecast-day-row {
  gap: 0.5rem;
}

.weather-card.is-expanded .weather-forecast-day-name-sm {
  min-width: 4rem;
}

.weather-card.is-expanded .weather-forecast-day-extra-sm {
  gap: 0.5rem;
}

@media (max-width: 767px) {
  .weather-card.is-expanded .weather-forecast-day-temp-extra-wrap {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.375rem;
  }
}

.weather-info-card {
  max-width: 48rem;
  margin: 0 auto;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 2rem;
}

.weather-info-card h3 {
  font-family: var(--font-serif);
  font-size: 1.14rem;
  font-weight: 600;
  margin-bottom: 1rem;
}

.weather-info-text p {
  margin-bottom: 1rem;
  color: var(--muted-fg);
  line-height: 1.7;
}

.weather-info-text p:last-child {
  margin-bottom: 0;
}

/* ─────────────────────────────────────────────────────────
   PRINT
   ───────────────────────────────────────────────────────── */
@media print {

  .site-header,
  .site-footer,
  .booking-card,
  .admin-sidebar {
    display: none !important;
  }

  body {
    font-size: 11pt;
  }

  a {
    color: inherit;
  }
}

/* Privacy consent checkbox */
.privacy-consent {
  text-align: left;
  font-size: .8125rem;
  line-height: 1.5;
  margin-bottom: .75rem;
}

.privacy-consent label {
  display: inline !important;
  font-weight: normal;
  cursor: pointer;
}

.privacy-consent input[type="checkbox"] {
  display: inline !important;
  width: auto !important;
  height: auto !important;
  margin-right: .4rem;
  vertical-align: middle;
}

/* ==========================================================================
   GDPR Cookie Consent
   ========================================================================== */

/* Banner */
.cb {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background: rgba(244, 250, 255, 0.96);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 -4px 32px rgba(0, 164, 214, 0.12);
  padding: 1.5rem;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.4s ease;
  transform: translateY(100%);
  opacity: 0;
  z-index: 9999;
  border-top: 1px solid rgba(0, 164, 214, 0.15);
}

.cb--visible {
  transform: translateY(0);
  opacity: 1;
}

.cb__inner {
  max-width: var(--container-width, 1200px);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

@media (min-width: 992px) {
  .cb__inner {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }

  .cb__content {
    flex: 1;
    padding-right: 2rem;
  }

  .cb__actions {
    flex-shrink: 0;
  }
}

.cb__content {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}

.cb__icon {
  flex-shrink: 0;
  color: var(--accent);
  opacity: 0.9;
}

.cb__title {
  margin: 0 0 0.5rem;
  font-weight: 600;
  font-size: 1.125rem;
  color: var(--fg);
}

.cb__text {
  margin: 0;
  font-size: 0.875rem;
  color: var(--fg-light, #555);
  line-height: 1.5;
}

.cb__link {
  color: var(--accent);
  text-decoration: underline;
  white-space: nowrap;
}

.cb__link:hover {
  text-decoration: none;
}

.cb__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.cb__btn {
  padding: 0.5rem 1rem;
  border-radius: 6px;
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid transparent;
  transition: all 0.2s ease;
  white-space: nowrap;
  font-family: inherit;
}

.cb__btn--accept {
  background: var(--accent);
  color: #fff;
}

.cb__btn--accept:hover {
  background: #008cb5;
}

.cb__btn--reject,
.cb__btn--customize {
  background: transparent;
  color: var(--fg);
  border-color: rgba(0, 0, 0, 0.15);
}

.cb__btn--reject:hover,
.cb__btn--customize:hover {
  background: rgba(0, 0, 0, 0.05);
}

/* Settings Modal */
.cs {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

.cs--visible {
  opacity: 1;
  pointer-events: auto;
}

.cs__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.cs__modal {
  position: relative;
  width: 100%;
  max-width: 560px;
  max-height: calc(100vh - 3rem);
  background: linear-gradient(145deg, #ffffff 0%, #f0f9ff 100%);
  border-radius: 12px;
  box-shadow: 0 32px 64px rgba(0, 164, 214, 0.18), 0 0 40px rgba(0, 164, 214, 0.12);
  border: 1px solid rgba(0, 164, 214, 0.15);
  display: flex;
  flex-direction: column;
  transform: translateY(20px) scale(0.98);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.cs--visible .cs__modal {
  transform: translateY(0) scale(1);
}

.cs__header {
  padding: 1.5rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
}

.cs__title {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 600;
}

.cs__close {
  background: none;
  border: none;
  font-size: 1.5rem;
  line-height: 1;
  color: var(--fg-light, #666);
  cursor: pointer;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: -0.5rem;
  border-radius: 50%;
  transition: background 0.2s ease;
}

.cs__close:hover {
  background: rgba(0, 0, 0, 0.05);
}

.cs__body {
  padding: 1.5rem;
  overflow-y: auto;
}

.cs__cat {
  margin-bottom: 1.5rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.cs__cat:last-of-type {
  border-bottom: none;
  margin-bottom: 1rem;
  padding-bottom: 0;
}

.cs__cat-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
}

.cs__cat-title {
  margin: 0 0 0.4rem;
  font-weight: 600;
  font-size: 1rem;
  color: var(--fg);
}

.cs__cat-desc {
  margin: 0;
  font-size: 0.875rem;
  color: var(--fg-light, #555);
  line-height: 1.5;
}

.cs__privacy-link {
  display: inline-block;
  margin-top: 1rem;
  font-size: 0.875rem;
  color: var(--accent);
  text-decoration: none;
  font-weight: 500;
}

.cs__privacy-link:hover {
  text-decoration: underline;
}

.cs__footer {
  padding: 1.5rem;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  display: flex;
  gap: 0.75rem;
  justify-content: flex-end;
  flex-shrink: 0;
}

/* Custom Toggle Switch for CSS */
.cs__toggle {
  position: relative;
  display: inline-flex;
  cursor: pointer;
  flex-shrink: 0;
}

.cs__toggle input {
  opacity: 0;
  width: 0;
  height: 0;
  position: absolute;
}

.cs__toggle-track {
  position: relative;
  display: inline-block;
  width: 44px;
  height: 24px;
  background: rgba(0, 0, 0, 0.15);
  border-radius: 24px;
  transition: background 0.2s ease;
}

.cs__toggle-thumb {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 20px;
  height: 20px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.cs__toggle input:checked+.cs__toggle-track {
  background: var(--accent);
}

.cs__toggle input:checked+.cs__toggle-track .cs__toggle-thumb {
  transform: translateX(20px);
}

.cs__toggle--locked {
  cursor: not-allowed;
  opacity: 0.7;
}

.cs__toggle--locked input:checked+.cs__toggle-track {
  background: #aab2bd;
  /* disabled color */
}

/* Floating Cookie Icon (FAB) */
.cookie-fab {
  position: fixed;
  bottom: 1.5rem;
  left: 1.5rem;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #fff;
  color: var(--accent);
  border: none;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 9998;
  opacity: 0;
  transform: scale(0.8);
  pointer-events: none;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.cookie-fab--visible {
  opacity: 1;
  transform: scale(1);
  pointer-events: auto;
}

.cookie-fab:hover {
  transform: scale(1.1);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
}

@media (max-width: 575px) {
  .cb__actions {
    flex-direction: column;
    width: 100%;
  }

  .cb__btn {
    width: 100%;
  }

  .cs__footer {
    flex-direction: column;
  }
}