/* ------------------------------------------------------------------
   Cozy Corner — Cinematic layer
   1. Cinematic hero (index)          .cozy-cinematic
   2. Slideshow hero for inner pages  .cozy-common-hero
   3. Unified gallery slideshow       .cozy-gallery-slider
   4. WebGL gold-dust canvas          .cozy-webgl-canvas
------------------------------------------------------------------- */

/* ============ 1. CINEMATIC HERO (index.html) ============ */

.ak-hero.cozy-cinematic {
  position: relative;
  overflow: hidden;
}

/* ScrollSmoother pins the page content to the top of the viewport, so a
   plain 100vh hero starts underneath the opaque header and loses its top
   ~166px behind the nav bar. Offset the hero by the live header height
   (kept in --cozy-header-h by cozy-enhancements.js) and take that height
   off again, so the whole photo sits in the space below the nav. This is
   the same treatment the Brandwag / Woodland Hills video heroes get in
   section 8 -- the min-height is what overrides `min-height: 100vh` from
   style.css, so it must stay. */
.ak-hero.ak-style2.cozy-cinematic {
  margin-top: var(--cozy-header-h, 168px);
  /* min-height rather than a fixed height: the hero carries the check-
     availability form, which stacks below the photo on narrow or short
     windows. Because the hero is `overflow: hidden`, a fixed height would
     silently cut that form off -- min-height lets it grow instead. It also
     overrides `min-height: 100vh` from style.css, which is what pushed the
     photo up behind the nav in the first place. */
  min-height: calc(100vh - var(--cozy-header-h, 168px));
}
@media (max-width: 768px) {
  .ak-hero.ak-style2.cozy-cinematic {
    /* svh so mobile browser chrome is not counted twice */
    min-height: calc(100svh - var(--cozy-header-h, 148px));
  }
}

/* The theme sizes the slideshow at `height: 100vh` and places the hero copy
   with viewport units (55vh, or 35vh under 1200px). Measured against the
   viewport rather than the hero, that now hangs the bottom of the photo and
   the booking bar below the fold by exactly the header height. Re-base both
   on the hero's own box. Below 768px the theme already drops the slider to
   70vh to make room for the stacked booking form, so leave that alone. */
@media (min-width: 768px) {
  .cozy-cinematic .ak-slider-6 {
    height: calc(100vh - var(--cozy-header-h, 168px));
  }
  /* 55% of the slider == the original 55vh, since the slider used to be
     exactly 100vh tall -- so the copy keeps its designed position. */
  .cozy-cinematic .ak-slider-6 .swiper-slide .slider-text-info {
    top: 55%;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .cozy-cinematic .ak-slider-6 .swiper-slide .slider-text-info {
    top: 35%;
  }
}

/* Slow, deep Ken Burns drift on the active slide */
.cozy-cinematic .ak-slider-6 .swiper-slide .slider-6-img {
  opacity: 0.35;
  transform: scale(1.02);
  transition: opacity 1.4s ease-in-out, transform 9s cubic-bezier(0.22, 0.61, 0.36, 1);
  filter: saturate(0.92) contrast(1.06);
}
.cozy-cinematic .ak-slider-6 .swiper-slide-active .slider-6-img {
  opacity: 1;
  transform: scale(1.14) translate3d(0, -1.2%, 0);
}

/* Cinematic grade: bottom anchor gradient + vignette */
.cozy-cinematic .ak-slider-6 .swiper-slide::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(180deg,
      rgba(0, 0, 0, 0.55) 0%,
      rgba(0, 0, 0, 0.05) 30%,
      rgba(0, 0, 0, 0.05) 55%,
      rgba(0, 0, 0, 0.78) 100%),
    radial-gradient(120% 90% at 50% 45%,
      rgba(0, 0, 0, 0) 55%,
      rgba(0, 0, 0, 0.45) 100%);
}

/* Letterbox bars — the "film frame" */
.cozy-cinematic::before,
.cozy-cinematic::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: clamp(14px, 2.4vh, 26px);
  background: #000;
  z-index: 6;
  pointer-events: none;
}
.cozy-cinematic::before { top: 0; box-shadow: 0 1px 0 rgba(232, 184, 0, 0.28); }
.cozy-cinematic::after  { bottom: 0; box-shadow: 0 -1px 0 rgba(232, 184, 0, 0.28); }

/* Title treatment: gold glow + slow tracking-in */
.cozy-cinematic .slider-text-info { z-index: 3; }
.cozy-cinematic .slider-text-info .slider-title,
.cozy-cinematic .slider-text-info .slider-title-two {
  text-shadow: 0 2px 30px rgba(0, 0, 0, 0.75), 0 0 60px rgba(232, 184, 0, 0.14);
}
.cozy-cinematic .swiper-slide-active .slider-text-info .slider-title,
.cozy-cinematic .swiper-slide-active .slider-text-info .slider-title-two {
  animation: cozyTrackIn 2.2s cubic-bezier(0.19, 1, 0.22, 1) both;
}
.cozy-cinematic .swiper-slide-active .slider-text-info .slider-title-two {
  animation-delay: 0.25s;
}
.cozy-cinematic .swiper-slide-active .slider-text-info .slider-mini-title {
  animation: cozyFadeUp 1.4s ease 0.15s both;
}
@keyframes cozyTrackIn {
  from { letter-spacing: 0.35em; opacity: 0; filter: blur(6px); }
  to   { letter-spacing: normal; opacity: 1; filter: blur(0); }
}
@keyframes cozyFadeUp {
  from { transform: translateY(18px); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}

/* Booking bar reads like a film credit strip */
.cozy-cinematic .hero-checkig-from-section .checkig-from {
  background: rgba(6, 6, 6, 0.72);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(232, 184, 0, 0.25);
}

/* ============ 2. SLIDESHOW HERO — inner pages (room/singleRoom) ============ */

.ak-commmon-hero.cozy-common-hero {
  position: relative;
  overflow: hidden;
}
.cozy-common-hero .cozy-common-hero-slider {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.cozy-common-hero .cozy-common-hero-slider .swiper-slide {
  overflow: hidden;
}
.cozy-common-hero .cozy-common-hero-slider .cozy-hero-slide-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.02);
  filter: saturate(0.92) contrast(1.06) brightness(0.55);
  transition: transform 9s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.cozy-common-hero .swiper-slide-active .cozy-hero-slide-img {
  transform: scale(1.12);
}
.cozy-common-hero .cozy-common-hero-slider .swiper-slide::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
    rgba(0, 0, 0, 0.55) 0%,
    rgba(0, 0, 0, 0.25) 50%,
    rgba(0, 0, 0, 0.7) 100%);
}
.cozy-common-hero .ak-commmon-heading {
  z-index: 4;
}

/* ============ 3. UNIFIED GALLERY SLIDESHOW ============ */

.cozy-gallery-slider {
  width: 100%;
  overflow: hidden;
  padding-bottom: 58px; /* room for pagination */
}
.cozy-gallery-slider .swiper-slide {
  width: min(620px, 82vw);
  height: 420px;
  border-radius: 6px;
  overflow: hidden;
  position: relative;
  border: 1px solid rgba(232, 184, 0, 0.18);
  transition: border-color 0.5s ease, transform 0.6s ease, opacity 0.6s ease;
  opacity: 0.45;
  transform: scale(0.94);
}
.cozy-gallery-slider .swiper-slide-active {
  opacity: 1;
  transform: scale(1);
  border-color: rgba(232, 184, 0, 0.65);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.6), 0 0 40px rgba(232, 184, 0, 0.08);
}
.cozy-gallery-slider .swiper-slide img.card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.01);
  transition: transform 6s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.cozy-gallery-slider .swiper-slide-active img.card-img {
  transform: scale(1.1);
}
.cozy-gallery-pagination {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 14px;
  display: flex;
  justify-content: center;
  gap: 10px;
  z-index: 3;
}
.cozy-gallery-pagination .swiper-pagination-bullet {
  width: 26px;
  height: 3px;
  border-radius: 0;
  background: rgba(232, 184, 0, 0.28);
  opacity: 1;
  transition: background 0.4s ease, width 0.4s ease;
}
.cozy-gallery-pagination .swiper-pagination-bullet-active {
  width: 44px;
  background: #E8B800;
}
@media (max-width: 767px) {
  .cozy-gallery-slider .swiper-slide {
    width: 88vw;
    height: 280px;
  }
}

/* ============ 4. WEBGL GOLD DUST ============ */

.cozy-webgl-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  pointer-events: none;
  mix-blend-mode: screen;
}

/* ============ Reduced motion ============ */
@media (prefers-reduced-motion: reduce) {
  .cozy-cinematic .ak-slider-6 .swiper-slide .slider-6-img,
  .cozy-common-hero .cozy-hero-slide-img,
  .cozy-gallery-slider .swiper-slide img.card-img {
    transition: none !important;
    transform: none !important;
    animation: none !important;
  }
  .cozy-cinematic .swiper-slide-active .slider-text-info .slider-title,
  .cozy-cinematic .swiper-slide-active .slider-text-info .slider-title-two,
  .cozy-cinematic .swiper-slide-active .slider-text-info .slider-mini-title {
    animation: none !important;
  }
  .cozy-webgl-canvas { display: none; }
}

/* ============ 5. SOLID BLACK HEADER ============ */

.ak-site_header.ak-style1 {
  background-color: #000000;
  border-bottom: 1px solid rgba(232, 184, 0, 0.28);
}
.ak-site_header.ak-style1.ak-sticky-active,
.ak-site_header.ak-style1.ak-gescout_sticky,
.ak-site_header.ak-style1.ak-gescout_show {
  background-color: #000000;
}

/* ============ 6. SCROLL-REVEAL SYSTEM (2026) ============ */

/* Pre-states are set from JS so content stays visible without JS.
   These classes only define will-change hints. */
.cozy-reveal,
.cozy-reveal-img,
.cozy-reveal-stagger > * {
  will-change: transform, opacity;
}

/* Gold progress hairline along the top of the viewport */
.cozy-scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 2px;
  width: 100%;
  transform-origin: 0 50%;
  transform: scaleX(0);
  background: linear-gradient(90deg, #E8B800, #F8D000);
  z-index: 1002;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .cozy-scroll-progress { display: none; }
}

/* ============ 7. HEADER IN FLOW — hero sits below the nav bar ============ */

/* Header participates in normal layout at the top of the page… */
.ak-site_header.ak-sticky_header {
  position: relative !important;
}
/* …and only becomes fixed for the scroll-reveal sticky behaviour */
.ak-site_header.ak-sticky_header.ak-gescout_sticky {
  position: fixed !important;
}

/* Taller top bar so the 88px logo sits fully inside it —
   no more overflow across the divider line */
.ak-site_header.ak-style1 .header-top {
  height: 104px;
  display: flex;
  align-items: center;
}
.ak-site_header.ak-style1 .header-top .wrapper .header-logo {
  height: 100%;
}
@media screen and (max-width: 768px) {
  .ak-site_header.ak-style1 .header-top {
    height: 84px;
  }
  .center-log img,
  .ak-site_branding img {
    max-height: 68px;
  }
}

/* Clean single divider between the logo bar and the nav bar */
.ak-site_header.ak-style1 .nav-bar-border {
  opacity: 0.35;
  border-bottom: 1px solid #E8B800;
}

/* Header already frames the top of the page now — drop the hero's
   top letterbox bar so there's one clean line, keep the bottom one */
.cozy-cinematic::before {
  display: none;
}

/* ============ 8. TGCSA GRADING SECTION ============ */

.cozy-grading-wrap {
  position: relative;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid rgba(232, 184, 0, 0.22);
  display: flex;
  flex-wrap: wrap;
}
.cozy-grading-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(0.5) saturate(0.9);
}
.cozy-grading-wrap::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.55) 55%, rgba(0,0,0,0.8) 100%);
}
.cozy-grading-card,
.cozy-grading-info {
  position: relative;
  z-index: 1;
  flex: 1 1 340px;
  padding: 56px 44px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 14px;
}
.cozy-grading-card {
  background: rgba(6, 6, 6, 0.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border-right: 1px solid rgba(232, 184, 0, 0.18);
}
.cozy-grading-stars {
  max-width: 300px;
  width: 70%;
  height: auto;
}
.cozy-tgcsa-caption {
  font-family: Baskervville, serif;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: #ffffff;
  font-size: 13px;
  line-height: 1.9;
}
.cozy-tgcsa-caption span {
  display: block;
  font-size: 10px;
  color: rgba(255, 255, 255, 0.65);
}
.cozy-grading-label {
  color: #E8B800;
  font-style: italic;
  font-family: Baskervville, serif;
  font-size: 18px;
  margin: 0;
}
.cozy-grading-actions {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 10px;
}
.cozy-grading-btn {
  display: inline-block;
  padding: 14px 38px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  font-size: 13px;
  color: #000;
  background: #E8B800;
  border: 1px solid #E8B800;
  transition: all 0.35s ease;
}
.cozy-grading-btn:hover {
  background: transparent;
  color: #E8B800;
}
.cozy-grading-btn.ghost {
  background: transparent;
  color: #E8B800;
}
.cozy-grading-btn.ghost:hover {
  background: #E8B800;
  color: #000;
}
.cozy-grading-info .cozy-grading-logo {
  max-height: 110px;
  width: auto;
}
.cozy-grading-info p {
  margin: 0;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.9;
}
.cozy-grading-info a {
  color: #E8B800;
}
.cozy-grading-info .label {
  color: #ffffff;
}
@media (max-width: 767px) {
  .cozy-grading-card { border-right: none; border-bottom: 1px solid rgba(232,184,0,0.18); }
  .cozy-grading-card, .cozy-grading-info { padding: 40px 22px; }
}

/* ============ 9. LOCATION / NEARBY SECTION ============ */

.cozy-loc-tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  border-bottom: 1px solid rgba(232, 184, 0, 0.2);
}
.cozy-loc-tab {
  background: transparent;
  border: none;
  color: rgba(255, 255, 255, 0.65);
  font-size: 17px;
  font-family: Baskervville, serif;
  letter-spacing: 0.06em;
  padding: 14px 22px;
  cursor: pointer;
  position: relative;
  transition: color 0.3s ease;
}
.cozy-loc-tab::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: -1px;
  height: 2px;
  background: #E8B800;
  transition: right 0.4s ease;
}
.cozy-loc-tab.active { color: #E8B800; }
.cozy-loc-tab.active::after { right: 0; }

.cozy-loc-panel { display: none; padding-top: 34px; }
.cozy-loc-panel.active { display: block; animation: cozyFadeUp 0.7s ease both; }

.cozy-loc-group-title {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #ffffff;
  font-size: 19px;
  font-family: Baskervville, serif;
  margin: 26px 0 6px;
}
.cozy-loc-group-title svg { flex: 0 0 auto; }
.cozy-loc-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.cozy-loc-list li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 18px;
  padding: 13px 2px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  color: rgba(255, 255, 255, 0.88);
  font-size: 16px;
}
.cozy-loc-list li .place small {
  display: block;
  color: rgba(255, 255, 255, 0.45);
  font-size: 13px;
}
.cozy-loc-meta {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: #E8B800;
  white-space: nowrap;
  font-size: 15px;
}
.cozy-loc-note {
  margin-top: 26px;
  color: rgba(255, 255, 255, 0.4);
  font-size: 13px;
  line-height: 1.7;
  font-style: italic;
}

/* ============ 8. CINEMATIC VIDEO HERO (brandwag / woodlands) ============ */

.ak-hero.ak-style2.cozy-video-hero,
.ak-hero.ak-style3.cozy-video-hero {
  position: relative;
  overflow: hidden;
  margin-top: var(--cozy-header-h, 168px);
  height: calc(100vh - var(--cozy-header-h, 168px));
  min-height: 540px;
  max-height: 1000px;
}
@media (max-width: 768px) {
  .ak-hero.ak-style2.cozy-video-hero,
  .ak-hero.ak-style3.cozy-video-hero {
    /* Track the live header height rather than a fixed 148px, which was
       leaving the hero overhanging the fold by the difference. */
    height: calc(100svh - var(--cozy-header-h, 148px));
    min-height: 480px;
  }
}

/* Media layer with the 105% -> 100% settling zoom */
.cozy-vh-media {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}
.cozy-vh-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1.05);
  animation: cozyVhZoom 8s cubic-bezier(0.16, 1, 0.3, 1) 0.2s forwards;
  filter: saturate(0.94) contrast(1.05);
}
@keyframes cozyVhZoom {
  to { transform: scale(1); }
}

/* Cinematic grade: anchor gradients + vignette over the footage */
.cozy-vh-grade {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(180deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0.12) 28%,
      rgba(0, 0, 0, 0.12) 52%,
      rgba(0, 0, 0, 0.8) 100%),
    radial-gradient(120% 90% at 50% 45%,
      rgba(0, 0, 0, 0) 52%,
      rgba(0, 0, 0, 0.5) 100%);
}

/* Bottom letterbox bar with gold hairline */
.cozy-video-hero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: clamp(12px, 2.2vh, 22px);
  background: #000;
  z-index: 6;
  pointer-events: none;
  box-shadow: 0 -1px 0 rgba(232, 184, 0, 0.28);
}

/* ---------------- Elegant text reveal ---------------- */
.cozy-vh-text {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 24px clamp(110px, 16vh, 160px);
  pointer-events: none;
}
.cozy-vh-mini {
  font-family: Baskervville, serif;
  font-style: italic;
  color: #E8B800;
  font-size: clamp(15px, 1.6vw, 20px);
  margin-bottom: 18px;
  opacity: 0;
  letter-spacing: 0.42em;
  animation: cozyVhTrack 1.6s cubic-bezier(0.19, 1, 0.22, 1) 0.55s forwards;
}
.cozy-vh-mini .hero-stars { letter-spacing: 0.18em; margin-left: 8px; }
@keyframes cozyVhTrack {
  to { opacity: 1; letter-spacing: 0.12em; }
}

.cozy-vh-title {
  margin: 0 0 22px;
  color: #fff;
  text-transform: uppercase;
  font-size: clamp(34px, 5.6vw, 68px);
  line-height: 1.12;
  text-shadow: 0 2px 30px rgba(0, 0, 0, 0.75), 0 0 70px rgba(232, 184, 0, 0.12);
}
.cozy-vh-title em {
  font-style: italic;
  color: #E8B800;
  text-transform: none;
}
.cozy-vh-line {
  display: block;
  overflow: hidden;
  padding-bottom: 0.08em;
}
.cozy-vh-line-inner {
  display: inline-block;
  transform: translateY(115%);
  filter: blur(5px);
  animation: cozyVhRise 1.35s cubic-bezier(0.19, 1, 0.22, 1) forwards;
}
.cozy-vh-line:nth-child(1) .cozy-vh-line-inner { animation-delay: 0.85s; }
.cozy-vh-line:nth-child(2) .cozy-vh-line-inner { animation-delay: 1.05s; }
.cozy-vh-line:nth-child(3) .cozy-vh-line-inner { animation-delay: 1.25s; }
@keyframes cozyVhRise {
  to { transform: translateY(0); filter: blur(0); }
}

.cozy-vh-sub {
  color: rgba(255, 255, 255, 0.88);
  font-size: clamp(14px, 1.4vw, 17px);
  line-height: 1.75;
  max-width: 640px;
  margin: 0;
  opacity: 0;
  transform: translateY(22px);
  animation: cozyVhFade 1.2s ease 1.75s forwards;
}
@keyframes cozyVhFade {
  to { opacity: 1; transform: translateY(0); }
}

.cozy-vh-rule {
  width: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, #E8B800, transparent);
  margin-top: 26px;
  animation: cozyVhRule 1.4s cubic-bezier(0.19, 1, 0.22, 1) 2s forwards;
}
@keyframes cozyVhRule {
  to { width: 180px; }
}

/* ---------------- Reduced motion ---------------- */
@media (prefers-reduced-motion: reduce) {
  .cozy-vh-video { animation: none; transform: none; }
  .cozy-vh-mini,
  .cozy-vh-line-inner,
  .cozy-vh-sub,
  .cozy-vh-rule {
    animation: none;
    opacity: 1;
    transform: none;
    filter: none;
    letter-spacing: 0.12em;
  }
  .cozy-vh-rule { width: 180px; }
}

/* Booking bar pinned to the base of the video hero */
.cozy-video-hero .hero-checkig-from-section {
  position: absolute;
  left: 0;
  right: 0;
  bottom: clamp(30px, 5.5vh, 52px);
  z-index: 5;
  padding: 0 20px;
}

/* Height-constrained windows: compact hero type, clear the booking bar */
@media (min-width: 769px) and (max-height: 720px) {
  .cozy-vh-text { padding-bottom: 205px; }
  .cozy-vh-title { font-size: clamp(26px, 4.4vw, 46px); }
  .cozy-vh-mini { margin-bottom: 10px; font-size: 15px; }
  .cozy-vh-sub { font-size: 13px; line-height: 1.6; }
  .cozy-vh-rule { margin-top: 16px; }
}

/* ============ 9. RESTAURANTS & DINING ============ */

.cozy-dine-feature {
  position: relative;
  border: 1px solid rgba(232, 184, 0, 0.22);
  border-radius: 6px;
  overflow: hidden;
  height: 100%;
  min-height: 380px;
  display: flex;
  align-items: flex-end;
}
.cozy-dine-feature > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 6s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.cozy-dine-feature:hover > img { transform: scale(1.08); }
.cozy-dine-feature::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.05) 30%, rgba(0,0,0,0.88) 100%);
}
.cozy-dine-feature .cozy-dine-body {
  position: relative;
  padding: 28px;
}
.cozy-dine-tag {
  display: inline-block;
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #E8B800;
  border: 1px solid rgba(232, 184, 0, 0.45);
  padding: 5px 12px;
  margin-bottom: 14px;
}
.cozy-dine-feature h4 {
  color: #fff;
  margin-bottom: 10px;
}
.cozy-dine-feature p {
  color: rgba(255, 255, 255, 0.82);
  margin: 0;
  line-height: 1.7;
}

.cozy-dine-card {
  border: 1px solid rgba(232, 184, 0, 0.16);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.02);
  padding: 26px 24px;
  height: 100%;
  transition: border-color 0.4s ease, transform 0.4s ease, box-shadow 0.4s ease;
}
.cozy-dine-card:hover {
  border-color: rgba(232, 184, 0, 0.55);
  transform: translateY(-5px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5);
}
.cozy-dine-card .cozy-dine-icon {
  color: #E8B800;
  margin-bottom: 16px;
}
.cozy-dine-card h5 {
  color: #fff;
  font-size: 19px;
  margin-bottom: 6px;
}
.cozy-dine-card .cozy-dine-cuisine {
  color: rgba(255, 255, 255, 0.65);
  font-size: 14px;
  margin-bottom: 14px;
}
.cozy-dine-card .cozy-dine-dist {
  font-family: Baskervville, serif;
  font-style: italic;
  color: #E8B800;
  font-size: 14px;
}
.cozy-dine-note {
  color: rgba(255, 255, 255, 0.45);
  font-size: 13px;
  text-align: center;
  margin-top: 26px;
}

/* ============ 10. FOOD SHOWCASE (restaurant section, Elegencia style) ============ */

.cozy-food-slider {
  width: 100%;
  overflow: hidden;
}
.cozy-food-slider .swiper-slide {
  width: min(430px, 78vw);
  height: 560px;
  position: relative;
  overflow: hidden;
  opacity: 0.45;
  filter: grayscale(35%);
  transition: opacity 0.6s ease, filter 0.6s ease;
}
.cozy-food-slider .swiper-slide-active {
  opacity: 1;
  filter: none;
}
.cozy-food-slider .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.01);
  transition: transform 6s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.cozy-food-slider .swiper-slide-active img { transform: scale(1.08); }

/* Info box on the active slide, like the reference design */
.cozy-food-info {
  position: absolute;
  left: 26px;
  bottom: 48px;
  background: #050505;
  border: 1px solid rgba(232, 184, 0, 0.25);
  padding: 26px 30px;
  max-width: 78%;
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.7s ease 0.15s, transform 0.7s ease 0.15s;
}
.cozy-food-slider .swiper-slide-active .cozy-food-info {
  opacity: 1;
  transform: translateY(0);
}
.cozy-food-info h4 {
  font-family: Baskervville, serif;
  font-weight: 400;
  color: #E8B800;
  font-size: 26px;
  line-height: 1.25;
  margin: 0 0 8px;
}
.cozy-food-info span {
  color: #fff;
  font-size: 15px;
}

/* Controls row: circular arrows flanking dot pagination */
.cozy-food-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 34px;
  margin-top: 40px;
}
.cozy-food-prev,
.cozy-food-next {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  border: 1px solid rgba(232, 184, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background: transparent;
  transition: background 0.4s ease, border-color 0.4s ease;
}
.cozy-food-prev:hover,
.cozy-food-next:hover {
  background: rgba(232, 184, 0, 0.12);
  border-color: #E8B800;
}
.cozy-food-prev svg,
.cozy-food-next svg { stroke: #E8B800; }
.cozy-food-pagination {
  display: flex;
  gap: 12px;
}
.cozy-food-pagination .swiper-pagination-bullet {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: transparent;
  border: 1px solid rgba(232, 184, 0, 0.55);
  opacity: 1;
  transition: background 0.35s ease;
}
.cozy-food-pagination .swiper-pagination-bullet-active {
  background: #E8B800;
}

/* Menu button block */
.cozy-menu-cta {
  text-align: center;
  margin-top: 46px;
}
.cozy-menu-cta p {
  color: rgba(255, 255, 255, 0.65);
  margin-bottom: 20px;
}
.cozy-menu-btn {
  display: inline-block;
  background: #E8B800;
  color: #000;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 14px;
  padding: 17px 44px;
  border: 1px solid #E8B800;
  transition: background 0.35s ease, color 0.35s ease;
}
.cozy-menu-btn:hover {
  background: transparent;
  color: #E8B800;
}

@media (max-width: 767px) {
  .cozy-food-slider .swiper-slide { height: 430px; }
  .cozy-food-info { padding: 18px 20px; }
  .cozy-food-info h4 { font-size: 20px; }
  .cozy-food-prev, .cozy-food-next { width: 52px; height: 52px; }
}

/* ============ 11. LOCAL EXPERIENCES tab grid ============ */

.cozy-loc-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 48px;
}
@media (max-width: 767px) {
  .cozy-loc-grid { grid-template-columns: 1fr; }
}

/* Neutralise Swiper's injected pagination positioning on the food dots */
.cozy-food-controls .cozy-food-pagination {
  position: static !important;
  width: auto !important;
  left: auto !important;
  bottom: auto !important;
  transform: none !important;
  display: flex;
  justify-content: center;
}

/* ============ 12. ROOM DETAIL PAGES ============ */

/* Room photo slideshow (replaces the static room image) */
.cozy-room-slider {
  position: relative;
  width: 100%;
  height: 470px;
  overflow: hidden;
  border: 1px solid rgba(232, 184, 0, 0.2);
  border-radius: 4px;
}
@media (max-width: 767px) {
  .cozy-room-slider { height: 300px; }
}
.cozy-room-slider .swiper-slide { overflow: hidden; }
.cozy-room-slider .cozy-room-slide-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.01);
  transition: transform 6s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.cozy-room-slider .swiper-slide-active .cozy-room-slide-img { transform: scale(1.07); }
.cozy-room-prev,
.cozy-room-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 1px solid rgba(232, 184, 0, 0.6);
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.35s ease;
}
.cozy-room-prev { left: 18px; }
.cozy-room-next { right: 18px; }
.cozy-room-prev:hover, .cozy-room-next:hover { background: #E8B800; }
.cozy-room-prev svg, .cozy-room-next svg { stroke: #E8B800; }
.cozy-room-prev:hover svg, .cozy-room-next:hover svg { stroke: #000; }
.cozy-room-pagination {
  position: absolute;
  left: 0; right: 0; bottom: 14px;
  z-index: 5;
  display: flex;
  justify-content: center;
  gap: 9px;
  width: auto !important;
}
.cozy-room-pagination .swiper-pagination-bullet {
  width: 24px; height: 3px; border-radius: 0;
  background: rgba(232, 184, 0, 0.35);
  opacity: 1;
  transition: background 0.35s ease, width 0.35s ease;
}
.cozy-room-pagination .swiper-pagination-bullet-active { width: 40px; background: #E8B800; }

/* All actionable buttons on room pages render gold */
.cozy-room-page button[type="submit"],
.cozy-room-page .btn-input {
  background: #E8B800 !important;
  color: #000 !important;
  border: 1px solid #E8B800 !important;
  transition: background 0.3s ease, color 0.3s ease;
}
.cozy-room-page button[type="submit"]:hover,
.cozy-room-page .btn-input:hover {
  background: transparent !important;
  color: #E8B800 !important;
}
.cozy-room-page .btn-input svg path { fill: currentColor; }
.cozy-room-page .value-button {
  color: #E8B800;
  border-color: rgba(232, 184, 0, 0.5) !important;
}
.cozy-room-page .text-btn1 { color: #E8B800; }

/* ============ 12. ALL BUTTONS GOLD ============ */

/* Default style-5 buttons (footer BOOKING, Book Now widget) were white */
.ak-btn.style-5::before {
  background-color: #E8B800;
}
.ak-btn.style-5 button,
.ak-btn.style-5 a {
  color: #000;
}
.ak-btn.style-5:hover button,
.ak-btn.style-5:hover a {
  color: #E8B800;
}

/* Footer newsletter send button */
.footer-main .footer-info .footer-email .email-input .btn-input {
  border-color: #E8B800;
  background-color: #E8B800;
}

/* Booking widget +/- steppers */
.booking-widget .value-button {
  color: #E8B800;
}