/* Mila Stays v128 — cache-safe final visual refinements.
   Scope: articles, Boutique Brand card alignment, My Story / homepage typography.
   No article wording is changed by this stylesheet. */

/* 1) ARTICLES — return to the calm vertical reading rhythm on all breakpoints:
      text -> image -> text -> image. Keep photography larger, centred, uncropped. */
.article-page.article-editorial-v127 .article-editorial-row{
  display:block!important;
  width:auto!important;
  max-width:none!important;
  margin:42px 0 48px!important;
  transform:none!important;
}
.article-page.article-editorial-v127 .article-editorial-copy{
  display:block!important;
  width:auto!important;
}
.article-page.article-editorial-v127 .article-editorial-media-stack{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  gap:24px!important;
  margin-top:28px!important;
}
.article-page.article-editorial-v127 .article-editorial-media-stack figure.article-inline-media{
  margin:0!important;
  background:transparent!important;
  overflow:visible!important;
  height:auto!important;
  max-height:none!important;
}
.article-page.article-editorial-v127 .article-editorial-media-stack img,
.article-page.article-editorial-v127 figure.article-hero-media img{
  display:block!important;
  height:auto!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

@media (min-width:981px){
  .article-page.article-editorial-v127 .article-editorial-row.media-standard figure.article-inline-media,
  .article-page.article-editorial-v127 .article-editorial-row.media-standard figure.article-inline-media img{
    width:600px!important;max-width:min(100%,600px)!important;
  }
  .article-page.article-editorial-v127 .article-editorial-row.media-tall figure.article-inline-media,
  .article-page.article-editorial-v127 .article-editorial-row.media-tall figure.article-inline-media img{
    width:420px!important;max-width:min(100%,420px)!important;
  }
  .article-page.article-editorial-v127 .article-editorial-row.media-mixed figure.article-inline-media,
  .article-page.article-editorial-v127 .article-editorial-row.media-mixed figure.article-inline-media img{
    width:540px!important;max-width:min(100%,540px)!important;
  }
  .article-page figure.article-hero-media.article-media-standard{
    width:min(46vw,620px)!important;max-width:620px!important;
  }
  .article-page figure.article-hero-media.article-media-standard img{
    width:100%!important;max-width:100%!important;
  }
  .article-page figure.article-hero-media.article-media-tall{
    width:min(38vw,470px)!important;max-width:470px!important;
  }
  .article-page figure.article-hero-media.article-media-tall img{
    width:100%!important;max-width:100%!important;
  }
}

@media (min-width:621px) and (max-width:980px){
  .article-page.article-editorial-v127 .article-editorial-row{margin:38px 0 44px!important;}
  .article-page.article-editorial-v127 .article-editorial-media-stack{margin-top:26px!important;}
  .article-page.article-editorial-v127 .article-editorial-row.media-standard figure.article-inline-media,
  .article-page.article-editorial-v127 .article-editorial-row.media-standard figure.article-inline-media img{
    width:min(82vw,540px)!important;max-width:540px!important;
  }
  .article-page.article-editorial-v127 .article-editorial-row.media-tall figure.article-inline-media,
  .article-page.article-editorial-v127 .article-editorial-row.media-tall figure.article-inline-media img{
    width:min(72vw,400px)!important;max-width:400px!important;
  }
  .article-page.article-editorial-v127 .article-editorial-row.media-mixed figure.article-inline-media,
  .article-page.article-editorial-v127 .article-editorial-row.media-mixed figure.article-inline-media img{
    width:min(78vw,500px)!important;max-width:500px!important;
  }
  .article-page figure.article-hero-media.article-media-standard,
  .article-page figure.article-hero-media.article-media-standard img{
    width:min(90vw,560px)!important;max-width:560px!important;
  }
  .article-page figure.article-hero-media.article-media-tall,
  .article-page figure.article-hero-media.article-media-tall img{
    width:min(76vw,420px)!important;max-width:420px!important;
  }
}

@media (max-width:620px){
  .article-page.article-editorial-v127 .article-editorial-row{margin:32px 0 38px!important;}
  .article-page.article-editorial-v127 .article-editorial-media-stack{margin-top:23px!important;gap:20px!important;}
  .article-page.article-editorial-v127 .article-editorial-row.media-standard figure.article-inline-media,
  .article-page.article-editorial-v127 .article-editorial-row.media-standard figure.article-inline-media img,
  .article-page.article-editorial-v127 .article-editorial-row.media-mixed figure.article-inline-media,
  .article-page.article-editorial-v127 .article-editorial-row.media-mixed figure.article-inline-media img{
    width:min(92vw,390px)!important;max-width:390px!important;
  }
  .article-page.article-editorial-v127 .article-editorial-row.media-tall figure.article-inline-media,
  .article-page.article-editorial-v127 .article-editorial-row.media-tall figure.article-inline-media img{
    width:min(86vw,360px)!important;max-width:360px!important;
  }
  .article-page figure.article-hero-media.article-media-standard,
  .article-page figure.article-hero-media.article-media-standard img{
    width:min(92vw,390px)!important;max-width:390px!important;
  }
  .article-page figure.article-hero-media.article-media-tall,
  .article-page figure.article-hero-media.article-media-tall img{
    width:min(88vw,370px)!important;max-width:370px!important;
  }
}

/* 2) BOUTIQUE BRAND — same image-frame geometry and the three closed-card actions
      on one horizontal line. Opening one card does not stretch the other cards. */
@media (min-width:980px){
  /* When all cards are closed, let the grid equalise their real card height. */
  .brand-live-page .brand-level-grid:not(:has(details[open])){align-items:stretch!important;}
  .brand-live-page .brand-level-grid:not(:has(details[open])) details.brand-level-card{height:100%!important;}
  .brand-live-page .brand-level-grid:not(:has(details[open])) .brand-level-card>summary{
    display:flex!important;flex-direction:column!important;height:100%!important;min-height:0!important;
  }
  .brand-live-page .brand-level-grid:not(:has(details[open])) .brand-level-summary{
    display:flex!important;flex-direction:column!important;flex:1!important;
  }
  .brand-live-page .brand-level-grid:not(:has(details[open])) .brand-level-more{
    margin-top:auto!important;padding-top:16px!important;
  }
  /* As soon as one accordion is opened, stop grid stretching completely so the
     other two cards never appear open. */
  .brand-live-page .brand-level-grid:has(details[open]){align-items:start!important;}
  .brand-live-page .brand-level-grid:has(details[open]) details.brand-level-card{height:auto!important;align-self:start!important;}
  .brand-live-page .brand-level-grid:has(details[open]) .brand-level-card>summary{
    display:block!important;height:auto!important;min-height:0!important;
  }
  .brand-live-page .brand-level-grid:has(details[open]) .brand-level-summary{display:block!important;flex:none!important;}
}

/* The first identity artwork has more built-in blurred margin than the other two.
   A gentle zoom balances its visual scale while keeping the central panel intact. */
.brand-live-page .brand-level-card:nth-child(1) .brand-level-visual img{
  transform:scale(1.10)!important;
  transform-origin:center center!important;
}

/* Preserve the v125 middle-card balancing mat. */
.brand-live-page .brand-level-card:nth-child(2) .brand-level-visual img{
  transform:none!important;
}

/* 3) CACHE-SAFE TYPOGRAPHY — make BG and EN use the same approved handwritten accents. */
.about-page .about-soft-copy h1,
.about-page .about-soft-copy .about-final,
.about-page .about-soft-copy .about-final strong{
  font-family:var(--font-script)!important;
  font-weight:400!important;
  font-style:normal!important;
}
.hero-place-tagline,
html[lang="bg"] .hero-place-tagline,
html[lang="en"] .hero-place-tagline{
  font-family:var(--font-script)!important;
  font-weight:400!important;
  font-style:normal!important;
}
