/* ═══════════════════════════════════════════
   MOBILE FIRST FIXES — max 767px
   Balanced: not cramped, not endlessly stacked
   ═══════════════════════════════════════════ */

@media (max-width: 767px) {
  :root {
    --container: 100%;
    --container-narrow: 100%;
    --nav-height: 60px;
    --space-2xl: clamp(2.5rem, 7vw, 3.25rem);
    --space-xl: clamp(1.75rem, 5vw, 2.25rem);
    --space-lg: clamp(1.25rem, 4vw, 1.75rem);
    --text-hero: clamp(2.5rem, 12vw, 3.75rem);
    --text-2xl: clamp(1.75rem, 7vw, 2.25rem);
  }

  /* Global page padding for sticky bar */
  body {
    padding-bottom: calc(52px + env(safe-area-inset-bottom, 0px));
  }

  /* Containers — full width with consistent side padding */
  .container,
  .container--narrow {
    width: 100%;
    padding-inline: 1.25rem;
  }

  .nav__inner {
    width: 100%;
    padding-inline: 1.25rem;
  }

  .hero__content {
    width: 100%;
    padding-inline: 1.25rem;
    padding-bottom: calc(var(--space-xl) + 48px);
  }

  .booking-cta__content {
    width: 100%;
    padding-inline: 1.25rem;
  }

  /* Nav — hide duplicate CTA, keep menu toggle */
  .nav__actions .btn--primary {
    display: none;
  }

  .nav__logo {
    font-size: 1.125rem;
  }

  /* Sections — tighter but breathable */
  .section {
    padding-block: var(--space-xl);
  }

  .section--lg {
    padding-block: var(--space-2xl);
  }

  .section__header,
  .section__header--center {
    margin-bottom: var(--space-lg);
  }

  /* Hero */
  .hero {
    min-height: 100svh;
    min-height: 100dvh;
  }

  .hero__tagline {
    font-size: var(--text-base);
    margin-bottom: var(--space-md);
  }

  .hero__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.625rem;
  }

  .hero__actions .btn {
    justify-content: center;
    padding-inline: 0.75em;
    font-size: 0.6875rem;
    letter-spacing: 0.04em;
  }

  .hero__scroll {
    display: none;
  }

  /* Story — clean stack, no overlapping offset image */
  .grid-asym {
    gap: var(--space-lg);
  }

  .story__text-col {
    max-width: none;
  }

  .story__image-offset {
    display: none;
  }

  .story__image-main {
    aspect-ratio: 4 / 3;
    max-height: 280px;
  }

  /* Rooms — horizontal scroll instead of 4 tall stacks */
  .rooms__cards {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: min(72vw, 280px);
    gap: var(--space-md);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin-inline: -1.25rem;
    padding-inline: 1.25rem;
    padding-bottom: 0.25rem;
  }

  .rooms__cards::-webkit-scrollbar {
    display: none;
  }

  .rooms__cards article {
    scroll-snap-align: start;
  }

  .rooms__card-image {
    aspect-ratio: 4 / 3;
    max-height: 200px;
    margin-bottom: var(--space-sm);
  }

  .rooms__cards h3 {
    font-size: var(--text-lg);
    margin-bottom: 0.25rem;
  }

  .rooms__cards p {
    font-size: var(--text-sm);
    line-height: 1.5;
  }

  /* Architecture — 2-up image grid */
  .arch .split {
    gap: var(--space-lg);
  }

  .arch .grid-2 {
    gap: var(--space-sm);
    margin-top: var(--space-lg) !important;
  }

  .shutter-reveal {
    aspect-ratio: 4 / 3;
    max-height: 280px;
  }

  /* Alaçatı — text + image with controlled height */
  #alacati .split {
    gap: var(--space-lg);
  }

  .nearby__image {
    aspect-ratio: 4 / 3;
    max-height: 260px;
    object-position: center;
  }

  .nearby-item {
    padding: var(--space-sm) 0;
    gap: 0.25rem 0.75rem;
  }

  .nearby-item__name {
    font-size: var(--text-base);
  }

  /* Location block */
  .location-block {
    padding: var(--space-lg);
    gap: var(--space-md);
  }

  .location-block__address {
    font-size: var(--text-lg);
  }

  /* Gallery */
  .gallery-grid {
    gap: 5px;
  }

  .gallery-item--hero {
    aspect-ratio: 16 / 9;
    max-height: 240px;
  }

  /* Reviews */
  .reviews .split {
    gap: var(--space-lg);
  }

  .review-quote__text {
    font-size: var(--text-lg);
  }

  .rating-display__score {
    font-size: clamp(2.5rem, 10vw, 3.5rem);
  }

  /* Booking CTA */
  .booking-cta {
    min-height: 45vh;
  }

  .booking-cta__title {
    font-size: var(--text-2xl);
  }

  .booking-cta__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.625rem;
    width: 100%;
    max-width: 360px;
    margin-inline: auto;
  }

  .booking-cta__actions .btn {
    justify-content: center;
    font-size: 0.6875rem;
  }

  /* Contact — 2 column grid, not 4 stacked rows */
  .contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-md) var(--space-lg);
  }

  .contact-item__value {
    font-size: var(--text-base);
  }

  /* Footer */
  .footer {
    padding-block: var(--space-lg);
  }

  .footer__inner {
    gap: var(--space-sm);
  }

  /* Amenities — 2 column feel */
  .amenities {
    gap: var(--space-xs) var(--space-md);
  }

  /* Sticky booking bar */
  .sticky-booking {
    padding: 0.625rem 1.25rem;
    padding-bottom: calc(0.625rem + env(safe-area-inset-bottom, 0px));
  }

  .sticky-booking__name {
    font-size: 0.9375rem;
  }

  .sticky-booking__cta {
    font-size: 0.6875rem;
  }

  /* Mobile menu */
  .mobile-menu__link {
    font-size: clamp(1.75rem, 9vw, 2.5rem);
    min-height: auto;
    padding-block: 0.35rem;
  }

  .mobile-menu__links {
    gap: 0.5rem;
  }

  /* Room scroll hint */
  .rooms__scroll-hint {
    display: block;
    margin-top: -0.25rem;
    margin-bottom: var(--space-sm);
    color: var(--muted);
  }

  /* Room features wrap tighter */
  .rooms__features {
    gap: 0.35rem 0.5rem;
  }

  .rooms__feature {
    font-size: 0.625rem;
    padding: 0.3em 0.6em;
  }
}

/* Very small phones */
@media (max-width: 359px) {
  .container,
  .container--narrow,
  .nav__inner,
  .hero__content {
    padding-inline: 1rem;
  }

  .hero__actions,
  .booking-cta__actions {
    grid-template-columns: 1fr;
  }

  .contact-grid {
    grid-template-columns: 1fr;
  }

  .rooms__cards {
    margin-inline: -1rem;
    padding-inline: 1rem;
    grid-auto-columns: min(85vw, 280px);
  }
}

/* Tablet — 768–1023 */
@media (min-width: 768px) and (max-width: 1023px) {
  .rooms__cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-lg);
  }

  .contact-grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-lg);
  }
}

/* Large screens */
@media (min-width: 1440px) {
  :root {
    --container: min(88vw, 1400px);
  }
}

/* Prevent horizontal overflow */
html, body {
  overflow-x: hidden;
  max-width: 100vw;
}

/* Touch targets */
.nav__link,
.mobile-menu__link,
.rooms__tab,
.gallery-item,
.lightbox__close,
.lightbox__prev,
.lightbox__next,
.nav__toggle {
  min-height: 44px;
}

/* Nav desktop CTA on hero */
@media (min-width: 1024px) {
  .nav:not(.is-scrolled) .btn--primary {
    background: var(--white);
    color: var(--text);
  }

  .nav:not(.is-scrolled) .btn--primary:hover {
    background: rgba(250, 249, 246, 0.9);
  }
}