/* v10: Higgsfield-generated key visual, concern banners and price plates.
   Loaded after luxury.css. Only the blocks that became artwork are touched. */

/* ---------- Key visual ---------- */
.hero.kv-hero { min-height:0; background:#fff7f8; overflow:visible; }
.hero.kv-hero:after { content:none; }
.kv-frame { position:relative; margin:0; }
.kv-art { display:block; width:100%; height:auto; }
/* Top-right: the price cards cover the artwork's lower area, and below 600px
   the frame extends past the image, so a bottom anchor would drift away. */
.kv-frame .image-note { top:22px; right:22px; bottom:auto; background:#ffffffb8; }

.hero.kv-hero .hero-bottom {
  position:static; width:auto; z-index:auto;
  padding:16px 7% 34px;
  background:linear-gradient(180deg,#fff5f6,#f7dfe8);
}
/* The price cards sit in the key visual's empty lower area. On narrow screens
   they stack under it instead, on the same #fff5f6 the strip below starts from. */
.hero.kv-hero .hero-offers {
  position:absolute; left:7%; right:7%; bottom:8%; z-index:3;
  grid-template-columns:1fr 1fr; gap:16px;
}
.hero.kv-hero .hero-offers>a {
  display:block; padding:0; background:none; border:0;
  box-shadow:0 14px 32px #7b485933; border-radius:4px; overflow:hidden;
  transition:transform .2s, box-shadow .2s;
}
.hero.kv-hero .hero-offers>a img { display:block; width:100%; height:auto; }
.hero.kv-hero .hero-offers>a:hover { transform:translateY(-2px); box-shadow:0 18px 38px #7b48593d; }
.hero.kv-hero .hero-offer-note { margin:0 0 20px; }

/* ---------- Concern banners ---------- */
.concern-art {
  position:relative; border:1px solid #d2b98c; border-radius:8px; overflow:hidden;
  box-shadow:0 8px 24px #84415a0f; line-height:0;
}
.concern-art>img { display:block; width:100%; height:auto; }

/* ---------- Chapter editorial banners ---------- */
.editorial-art {
  line-height:0; border-bottom:4px solid #d1b47b; background:#f7eef0;
}
.editorial-art > img { display:block; width:100%; height:auto; }

/* ---------- Price plates ---------- */
.price-art { margin:16px 0 0; line-height:0; }
.price-art img {
  display:block; width:100%; height:auto;
  border-radius:4px; box-shadow:0 6px 18px #91655914;
}

.mini-offer.mini-offer-art {
  display:block; padding:0; border:0; box-shadow:0 8px 22px #9165591f;
  background:none; border-radius:5px; overflow:hidden; margin-top:38px;
}
.mini-offer.mini-offer-art img { display:block; width:100%; height:auto; }
.mini-offer-note {
  margin:0; padding:9px 12px; text-align:center;
  background:#f7e6ee; color:#7a3f59; font-size:11px; letter-spacing:.04em; line-height:1.7;
}

/* ---------- Narrow screens: give the artwork full width ---------- */
@media(max-width:600px) {
  .hero.kv-hero .hero-bottom { padding:14px 6% 28px; }
  .hero.kv-hero .hero-offers {
    position:static; padding:22px 6% 0; background:#fff5f6;
    grid-template-columns:1fr; gap:12px;
  }
  .hero.kv-hero .hero-offers>a { box-shadow:0 10px 26px #91655924; }
  .hero.kv-hero .hero-offer-note { margin:0 0 17px; }

  .plan-grid { grid-template-columns:1fr; gap:20px; }
  .plan { max-width:100%; }
  .plan-photo { height:210px; min-height:210px; }
  .plan-title h3 { font-size:30px; }
  .plan-title small { font-size:16px; }
  .plan-description { min-height:0; font-size:14px; }
  .conditions { min-height:0; font-size:12px; }
  .plan-medal { width:100px; height:100px; top:-86px; right:4px; }
}

@media(max-width:360px) {
  .plan-photo { height:180px; min-height:180px; }
  .plan-title h3 { font-size:27px; }
  .plan-medal { width:88px; height:88px; top:-76px; }
}