/* ============================================================
   COASTAL BLOOM v6 — bedroom & kitchen scene, wider-region
   highlights and the active band (golf · cycling · hiking).
   Loads after styles.css + v2 + v3 + v4.
   ============================================================ */

/* ===== 03 · ROOMS — bedroom alcove + kitchen print ===== */
.s-rooms{ background:linear-gradient(180deg, #f8f1e2 0%, #efe4cd 100%); }
.s-rooms .shaft2{
  right:-14%; top:-24%; width:58%; height:150%;
  background:linear-gradient(260deg, transparent 12%, rgba(255,219,160,.5) 48%, transparent 84%);
  transform:rotate(-9deg);
}
.s-rooms .alcove{
  right:18%; bottom:0; width:44vmin; height:64vmin;
  border-radius:22vmin 22vmin 0 0;
  background:linear-gradient(180deg, #ecdfc6, #e2d2b3);
  box-shadow:inset 0 0 0 1.4vmin #f6efe0;
}
.s-rooms .floor2{
  left:0; right:0; bottom:0; height:12%;
  background:
    repeating-linear-gradient(90deg, rgba(44,40,32,.05) 0 1px, transparent 1px 12vmin),
    #e3d4b4;
}
.s-rooms .frame--bed{
  width:34vmin; height:48vmin;
  right:23%; bottom:14%;
}
.s-rooms .frame--kitchen{
  width:23vmin; height:29vmin;
  right:5%; bottom:9%;
  transform:rotate(1.8deg);
}

/* included-amenities chips in the caption */
.cap .amenities{
  display:flex; flex-wrap:wrap; gap:10px;
  list-style:none; margin:26px 0 0; padding:0;
}
.cap.right .amenities{ justify-content:flex-end; }
.cap .amenities li{
  font-family:var(--mono); font-size:10px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--ink-soft);
  border:1px solid color-mix(in srgb, var(--ink) 22%, transparent);
  background:color-mix(in srgb, #fbf7ee 70%, transparent);
  padding:9px 16px; border-radius:999px;
  display:inline-flex; align-items:center; gap:9px;
}
.cap .amenities li::before{
  content:''; width:5px; height:5px; border-radius:50%;
  background:var(--clay); flex:none;
}

/* ===== highlights: photo slots for the new region cards ===== */
.hl-card image-slot{ display:block; width:100%; }

.hl-card:nth-child(6){ grid-column:span 2; transform:rotate(-1deg); }
.hl-card:nth-child(6) img, .hl-card:nth-child(6) image-slot{ aspect-ratio:4/3.2; }
.hl-card:nth-child(7){ grid-column:span 4; }
.hl-card:nth-child(7) img, .hl-card:nth-child(7) image-slot{ aspect-ratio:16/9; }
.hl-card:nth-child(8){ grid-column:span 3; transform:rotate(.9deg); }
.hl-card:nth-child(8) img, .hl-card:nth-child(8) image-slot{ aspect-ratio:3/1.9; }
.hl-card:nth-child(9){ grid-column:span 3; transform:rotate(-.8deg); }
.hl-card:nth-child(9) img, .hl-card:nth-child(9) image-slot{ aspect-ratio:3/1.9; }

.hl-grid.reveal.in > .hl-card:nth-child(6){ transform:rotate(-1deg); transition-delay:.42s; }
.hl-grid.reveal.in > .hl-card:nth-child(7){ transition-delay:.5s; }
.hl-grid.reveal.in > .hl-card:nth-child(8){ transform:rotate(.9deg); transition-delay:.58s; }
.hl-grid.reveal.in > .hl-card:nth-child(9){ transform:rotate(-.8deg); transition-delay:.66s; }

/* ===== active band — golf · cycling · hiking ===== */
.hl-active{
  max-width:1240px; margin:clamp(70px,10vh,120px) auto 0;
  border-top:1px solid var(--line);
  padding-top:clamp(44px,6vh,70px);
}
.hl-active .ac-head{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:24px; flex-wrap:wrap; margin-bottom:clamp(34px,5vh,56px);
}
.hl-active .ac-head h3{
  font-family:var(--serif); font-weight:500;
  font-size:clamp(28px,3.6vw,46px); line-height:1.1; letter-spacing:-.01em;
  margin:0; text-wrap:balance;
}
.hl-active .ac-head h3 em{ font-style:italic; color:var(--clay); }
.hl-active .ac-head .eyebrow{
  font-family:var(--mono); font-size:11px; letter-spacing:.3em;
  text-transform:uppercase; color:var(--clay); margin:0;
}
.ac-grid{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(24px,4vw,56px);
  align-items:start;
}
.ac-item{
  border-top:2px solid color-mix(in srgb, var(--ink) 80%, transparent);
}
.ac-item summary{
  list-style:none; cursor:pointer;
  position:relative;
  padding:18px 44px 16px 0;
  -webkit-tap-highlight-color:transparent;
}
.ac-item summary::-webkit-details-marker{ display:none; }
.ac-item summary::after{
  content:''; position:absolute; right:4px; top:50%;
  width:14px; height:14px; transform:translateY(-50%);
  background:
    linear-gradient(var(--ink), var(--ink)) center/14px 1.5px no-repeat,
    linear-gradient(var(--ink), var(--ink)) center/1.5px 14px no-repeat;
  transition:transform .35s var(--ease), opacity .35s var(--ease);
}
.ac-item[open] summary::after{
  transform:translateY(-50%) rotate(45deg);
}
.ac-item summary:hover .ac-name{ color:var(--clay); }
.ac-item .ac-num{
  display:block;
  font-family:var(--mono); font-size:10px; letter-spacing:.22em;
  text-transform:uppercase; color:var(--ink-soft);
}
.ac-item .ac-name{
  display:block;
  font-family:var(--serif); font-style:italic; font-weight:500;
  font-size:clamp(22px,2.3vw,30px); margin-top:10px; color:var(--ink);
  transition:color .3s var(--ease);
}
.ac-item p{
  font-weight:300; font-size:clamp(14px,1.4vw,16px); line-height:1.65;
  color:var(--ink-soft); margin:2px 0 22px; text-wrap:pretty;
  max-width:38ch;
}
.ac-item[open] p{
  animation:acReveal .45s var(--ease) both;
}
@keyframes acReveal{
  from{ opacity:0; transform:translateY(-6px); }
  to{ opacity:1; transform:none; }
}

/* ===== responsive ===== */
@media (max-width:860px){
  .ac-grid{ grid-template-columns:1fr; gap:28px; }
  .hl-card:nth-child(6), .hl-card:nth-child(7),
  .hl-card:nth-child(8), .hl-card:nth-child(9){ grid-column:span 1; }
  .hl-card:nth-child(7){ grid-column:span 2; }
}
@media (max-width:720px){
  .s-rooms .alcove{ right:50%; transform:translateX(50%); width:52vmin; height:58vmin; }
  .s-rooms .frame--bed{ width:40vmin; height:46vmin; right:50%; transform:translateX(36%); bottom:18%; }
  .s-rooms .frame--kitchen{ width:27vmin; height:33vmin; right:6%; bottom:8%; }
  .cap .amenities{ gap:8px; }
  .cap .amenities li{ padding:8px 12px; }
}
@media (max-width:560px){
  .hl-card:nth-child(n){ transform:none; }
}

/* ============================================================
   LIVE TEMPERATURE METER — hero ("Nu in Dénia")
   ============================================================ */
.weather{
  margin-top:30px;
  display:inline-flex; flex-direction:column; gap:9px;
  padding:15px 18px 16px;
  background:color-mix(in srgb, var(--paper) 72%, transparent);
  border:1px solid var(--line);
  border-radius:3px;
  backdrop-filter:blur(7px) saturate(1.05);
  -webkit-backdrop-filter:blur(7px) saturate(1.05);
  box-shadow:0 10px 30px -22px rgba(44,40,32,.6);
  opacity:0; transform:translateY(12px);
  transition:opacity .7s var(--ease), transform .7s var(--ease);
}
.weather.in{ opacity:1; transform:none; }
.weather[hidden]{ display:none; }

.w-label{
  font-family:var(--mono);
  font-size:10.5px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--ink-soft);
}
.w-read{ display:flex; align-items:center; gap:14px; }
.w-temp{
  font-family:var(--serif);
  font-size:38px; line-height:.9; font-weight:500;
  color:var(--ink);
  font-variant-numeric:tabular-nums;
  min-width:1.7em;
}
.w-meter{
  position:relative;
  width:124px; height:7px;
  border-radius:99px;
  background:color-mix(in srgb, var(--ink) 9%, transparent);
  overflow:hidden;
}
.w-fill{
  position:absolute; inset:0 auto 0 0; width:0;
  border-radius:99px;
  background:linear-gradient(90deg, var(--sea), var(--olive) 42%, var(--clay));
  transition:width 1.1s var(--ease);
}
.w-cond{
  font-family:var(--sans);
  font-size:12.5px; font-weight:400; letter-spacing:.01em;
  color:var(--ink-soft);
}

@media (max-width:560px){
  .weather{ margin-top:24px; padding:13px 15px 14px; }
  .w-temp{ font-size:33px; }
  .w-meter{ width:104px; }
}