/* Ko Kut Ao Phrao Beach Resort — Light Visual Effects
   Keeps motion and hierarchy while removing heavy/dark visual treatment. */

/* ===== Homepage hero: natural image, only a soft readability layer ===== */
.homepage-refresh .hero-shade{
  background:linear-gradient(90deg,rgba(3,38,32,.28) 0%,rgba(3,38,32,.13) 40%,rgba(3,38,32,.04) 70%,rgba(3,38,32,0) 100%)!important;
}
.homepage-refresh .hero-inner h1{color:#fff!important;text-shadow:0 2px 18px rgba(0,0,0,.18)!important}
.homepage-refresh .hero-inner>.kicker{color:#d9f1e9!important;text-shadow:0 1px 10px rgba(0,0,0,.15)!important}
.homepage-refresh .hero-inner>p:not(.kicker){color:rgba(255,255,255,.92)!important;text-shadow:0 1px 12px rgba(0,0,0,.16)!important}
.homepage-refresh .hero-actions .btn-white{
  background:#fff!important;
  border-color:#fff!important;
  color:#0b5d50!important;
  box-shadow:0 8px 20px rgba(0,0,0,.08)!important;
}
.homepage-refresh .hero-actions .btn-ghost{
  background:rgba(255,255,255,.10)!important;
  border-color:rgba(255,255,255,.70)!important;
  color:#fff!important;
  backdrop-filter:blur(5px);
  box-shadow:none!important;
}

/* ===== Room sales: keep prominent, but bright ===== */
.homepage-refresh .home-stays{
  background:
    radial-gradient(circle at 8% 0%,rgba(137,211,190,.20),transparent 28%),
    radial-gradient(circle at 92% 100%,rgba(225,241,234,.85),transparent 32%),
    linear-gradient(145deg,#fbf8f1,#f3f8f5 58%,#ffffff)!important;
}
.homepage-refresh .home-stays:before{
  background:linear-gradient(180deg,rgba(255,255,255,.45),rgba(255,255,255,0))!important;
}
.homepage-refresh .home-stays .home-kicker{color:#168368!important}
.homepage-refresh .home-stays .home-title{color:#153a33!important;text-shadow:none!important}
.homepage-refresh .home-stays .home-section-head .home-lead{
  color:#64766f!important;
  border-left-color:rgba(22,131,104,.24)!important;
}
.homepage-refresh .home-room-card{
  border-color:rgba(6,61,53,.10)!important;
  box-shadow:0 16px 38px rgba(5,45,38,.08)!important;
}
.homepage-refresh .home-room-image:after{background:none!important}
.homepage-refresh .home-room-arrow{box-shadow:none!important}

/* ===== Shared image effects: no darkening ===== */
body main .view-grid > .view-card,
body main .auto-gallery-grid > .auto-gallery-card,
body main .home-visual-grid > .home-visual-card,
body main .room-gallery > .room-gallery-item{
  background:#eef6f2!important;
  box-shadow:0 12px 28px rgba(5,45,38,.07)!important;
}
body main .view-grid > .view-card::before,
body main .auto-gallery-grid > .auto-gallery-card::before,
body main .home-visual-grid > .home-visual-card::before{
  background:linear-gradient(180deg,rgba(255,255,255,0) 58%,rgba(255,255,255,.12) 78%,rgba(255,255,255,.34) 100%)!important;
}
body main .view-grid img,
body main .auto-gallery-grid img,
body main .home-visual-grid img,
body main .room-gallery img{
  filter:none!important;
}
body main .view-grid > .view-card:hover img,
body main .auto-gallery-grid > .auto-gallery-card:hover img,
body main .home-visual-grid > .home-visual-card:hover img,
body main .room-gallery > .room-gallery-item:hover img,
body main .room-gallery > .room-gallery-item:focus-visible img{
  transform:scale(1.025)!important;
  filter:none!important;
}
body main .view-grid figcaption,
body main .auto-gallery-grid figcaption,
body main .home-visual-grid figcaption{
  left:12px!important;
  right:auto!important;
  bottom:12px!important;
  width:auto!important;
  padding:7px 10px!important;
  border:1px solid rgba(6,61,53,.08)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.90)!important;
  color:#0b5d50!important;
  text-shadow:none!important;
  box-shadow:0 5px 16px rgba(5,45,38,.06)!important;
  backdrop-filter:blur(7px)!important;
}
body main .home-visual-grid .visual-number,
body main .home-visual-grid .visual-caption-text{
  border-color:rgba(6,61,53,.08)!important;
  background:rgba(255,255,255,.90)!important;
  color:#0b5d50!important;
  text-shadow:none!important;
  box-shadow:0 5px 16px rgba(5,45,38,.06)!important;
}

/* ===== Interior heroes: natural image, no white wash ===== */
body:not(.homepage-refresh) .compact-hero{background:#dfeee9!important}
body:not(.homepage-refresh) .compact-hero-shade{
  background:linear-gradient(90deg,rgba(3,38,32,.24) 0%,rgba(3,38,32,.10) 42%,rgba(3,38,32,.02) 72%,rgba(3,38,32,0) 100%)!important;
}
body:not(.homepage-refresh) .compact-hero .breadcrumbs{color:rgba(255,255,255,.84)!important;text-shadow:0 1px 8px rgba(0,0,0,.14)!important}
body:not(.homepage-refresh) .compact-hero .breadcrumbs a{color:#fff!important;text-shadow:0 1px 8px rgba(0,0,0,.14)!important}
body:not(.homepage-refresh) .compact-hero .breadcrumbs span{color:rgba(255,255,255,.72)!important;text-shadow:0 1px 8px rgba(0,0,0,.14)!important}
body:not(.homepage-refresh) .compact-hero .kicker{color:#d9f1e9!important;text-shadow:0 1px 10px rgba(0,0,0,.15)!important}
body:not(.homepage-refresh) .compact-hero h1{color:#fff!important;text-shadow:0 2px 18px rgba(0,0,0,.18)!important}
body:not(.homepage-refresh) .compact-hero-inner>p:last-child{color:rgba(255,255,255,.92)!important;text-shadow:0 1px 12px rgba(0,0,0,.16)!important}

/* ===== Interior feature panels: replace dark blocks with airy surfaces ===== */
body:not(.homepage-refresh) .story-panel,
body:not(.homepage-refresh) .contact-box{
  border:1px solid rgba(6,61,53,.10)!important;
  background:linear-gradient(145deg,#f3f8f5,#fbf8f1)!important;
  box-shadow:0 14px 34px rgba(5,45,38,.07)!important;
}
body:not(.homepage-refresh) .story-panel .kicker,
body:not(.homepage-refresh) .contact-box .kicker{color:#168368!important}
body:not(.homepage-refresh) .story-panel h2,
body:not(.homepage-refresh) .contact-box h2{color:#153a33!important;text-shadow:none!important}
body:not(.homepage-refresh) .story-panel p,
body:not(.homepage-refresh) .contact-box>div:first-child>p:last-child{color:#64766f!important}
body:not(.homepage-refresh) .contact-list{
  border-color:rgba(6,61,53,.10)!important;
  background:rgba(255,255,255,.78)!important;
}
body:not(.homepage-refresh) .contact-list>a,
body:not(.homepage-refresh) .contact-list>div{color:#153a33!important;border-color:rgba(6,61,53,.08)!important}

/* ===== Gallery sections: light, not dark ===== */
body:not(.homepage-refresh) .auto-gallery-section,
body:not(.homepage-refresh) .viewpoints-section{
  background:linear-gradient(180deg,#f7f3eb,#ffffff)!important;
}
body:not(.homepage-refresh) .auto-gallery-section .section-head h2,
body:not(.homepage-refresh) .viewpoints-section .section-head h2{color:#153a33!important;text-shadow:none!important}
body:not(.homepage-refresh) .auto-gallery-section .section-head>p:last-child,
body:not(.homepage-refresh) .viewpoints-section .section-head>p:last-child{color:#64766f!important}

/* ===== General hover/shadow refinement ===== */
.homepage-refresh .home-room-card:hover,
body:not(.homepage-refresh) .wp-post-card:hover,
body:not(.homepage-refresh) .post-card:hover{
  box-shadow:0 18px 40px rgba(5,45,38,.09)!important;
}

@media(max-width:700px){
  .homepage-refresh .hero-shade,
  body:not(.homepage-refresh) .compact-hero-shade{
    background:linear-gradient(180deg,rgba(3,38,32,.16) 0%,rgba(3,38,32,.10) 55%,rgba(3,38,32,.20) 100%)!important;
  }
  .homepage-refresh .home-stays{background:linear-gradient(180deg,#fbf8f1,#f4f8f5)!important}
}

@media(prefers-reduced-motion:reduce){
  body main .view-grid img,
  body main .auto-gallery-grid img,
  body main .home-visual-grid img,
  body main .room-gallery img{transition:none!important}
}
