/* Casa Kambanda selected atmosphere layer — Style 1, seam-safe edition.
   Rule: normal website photos stay normal; decorative imagery must be continuous/faded and never show section cut lines. */

@media (max-width: 700px) {
  html,
  body:not(.mock-exact) {
    background: #efe9e1 !important;
  }

  body:not(.mock-exact) {
    position: relative;
    overflow-x: hidden;
  }

  /* One continuous oversized/faded background layer for the whole mobile viewport.
     This replaces section-by-section image washes, which created visible cut lines. */
  body:not(.mock-exact)::before {
    content: "";
    position: fixed;
    inset: -16vh -18vw;
    z-index: 0;
    pointer-events: none;
    background:
      linear-gradient(180deg, rgba(239,233,225,.48), rgba(239,233,225,.62) 48%, rgba(239,233,225,.52)),
      radial-gradient(circle at 18% 16%, rgba(246,242,236,.18), transparent 28%),
      radial-gradient(circle at 84% 38%, rgba(239,233,225,.20), transparent 31%),
      radial-gradient(circle at 28% 78%, rgba(246,242,236,.20), transparent 30%),
      url("casa-living.jpg") center 16% / 132% auto no-repeat,
      url("casa-yard.jpg") center 58% / 145% auto no-repeat,
      url("casa-exterior.jpg") center 102% / 155% auto no-repeat,
      #efe9e1;
    opacity: 1;
    filter: blur(4px) sepia(.08) saturate(.98);
    transform: scale(1.04);
  }

  body:not(.mock-exact)::after {
    content: "";
    position: fixed;
    inset: 34vh -20vw -16vh -20vw;
    z-index: 0;
    pointer-events: none;
    background:
      linear-gradient(180deg, rgba(239,233,225,.64), rgba(239,233,225,.46) 42%, rgba(239,233,225,.70)),
      url("casa-yard.jpg") center / 185% auto no-repeat;
    opacity: .68;
    filter: blur(8px) sepia(.08) saturate(.96);
    transform: scale(1.08);
  }

  body:not(.mock-exact) > * {
    position: relative;
    z-index: 1;
  }

  /* Normal hero/media photos must stay clean. The atmosphere belongs behind content only. */
  .hero,
  .page {
    background: rgba(239,233,225,.40) !important;
  }

  .hero .wrap {
    background: rgba(246,242,236,.80) !important;
    border: 1px solid rgba(26,25,22,.08) !important;
    border-top-color: rgba(169,142,111,.16) !important;
    box-shadow: 0 -20px 44px rgba(26,25,22,.09) !important;
    backdrop-filter: blur(8px);
  }

  /* Sections/cards use translucent cream panels so the one continuous background can breathe through.
     No section-level background images: this prevents hard horizontal seams. */
  .approach,
  .projects,
  .services,
  .contact,
  .rooms-intro,
  .room,
  .room-cta,
  .contact-section,
  .page-hero,
  .hero-strip,
  .calendar-shell {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background-color: rgba(239,233,225,.24) !important;
  }

  .approach::before,
  .projects::before,
  .services::before,
  .contact::before,
  .rooms-intro::before,
  .room::before,
  .room-cta::before,
  .contact-section::before,
  .page-hero::before,
  .hero-strip::before,
  .calendar-shell::before,
  .approach::after,
  .projects::after,
  .services::after,
  .contact::after,
  .rooms-intro::after,
  .room::after,
  .room-cta::after,
  .contact-section::after,
  .page-hero::after,
  .hero-strip::after,
  .calendar-shell::after,
  .hero-media::before,
  .hero-media::after,
  .frame::after,
  .proj-card .frame::after,
  .room-media .frame::after,
  .photo-card::after {
    content: none !important;
    display: none !important;
    background: none !important;
  }

  .stat,
  .svc,
  .contact article,
  .side-card,
  .contact-section form,
  .mini,
  .room-text,
  .calendar-shell .panel {
    background: rgba(246,242,236,.80) !important;
    backdrop-filter: blur(7px);
    border-color: rgba(26,25,22,.12) !important;
  }

  /* Ensure cards no longer carry their own photo backgrounds/edges. */
  .stat:nth-child(1),
  .stat:nth-child(2),
  .stat:nth-child(3),
  .stat:nth-child(4),
  .svc:nth-child(1),
  .svc:nth-child(2),
  .svc:nth-child(3),
  .svc:nth-child(4),
  .contact article:nth-child(1),
  .contact article:nth-child(2) {
    background: rgba(246,242,236,.80) !important;
  }

  .frame,
  .proj-card .frame,
  .room-media .frame,
  .photo-card,
  .hero-media {
    background: transparent !important;
    filter: none !important;
    opacity: 1 !important;
  }

  .frame img,
  .proj-card .frame img,
  .room-media .frame img,
  .photo-card img,
  .hero-media img,
  .hero-strip img {
    filter: none !important;
    opacity: 1 !important;
    mix-blend-mode: normal !important;
  }

  .hero-strip::after {
    background: linear-gradient(180deg, rgba(10,9,7,.06), rgba(239,233,225,.72)) !important;
  }

  .calendar,
  .day,
  .day-name,
  #reserveForm,
  #reserveForm * {
    backdrop-filter: none !important;
  }

  footer {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: #1a1916 !important;
  }

  footer::before,
  footer::after {
    content: none !important;
    display: none !important;
    background: none !important;
  }

  /* Redirect/availability tiny page: cream card only; no image crop edge. */
  body > main:only-child {
    position: relative;
    z-index: 1;
    background: rgba(246,242,236,.80) !important;
    border: 1px solid rgba(26,25,22,.10);
    padding: 1.35rem;
    box-shadow: 0 22px 60px rgba(26,25,22,.10);
    backdrop-filter: blur(7px);
  }
}