/* Editorial's editable cover shares the saved palette and portrait controls.
   The original editorial demo is outside this scope. */
.editorial-template .hero.editorial-hero {
  color:var(--palette-text);
  background:linear-gradient(112deg,color-mix(in srgb,var(--palette-bg) 92%,transparent),color-mix(in srgb,var(--palette-bg) 90%,transparent)),url('/acomply-websites/assets/fine-plaster-v3.webp') center/cover,var(--palette-bg);
}
.editorial-template .editorial-hero::after {
  background:radial-gradient(ellipse at 74% 45%,color-mix(in srgb,var(--palette-text) 4%,transparent),transparent 57%);
}
.editorial-template .editorial-hero .editorial-title {
  width:calc(100% - var(--editorial-gutter) * 2);
  max-width:none;
  color:var(--palette-text);
}
.editorial-template .editorial-hero .editorial-title-line { max-width:none; }
.editorial-template .editorial-hero .editorial-ghost {
  width:55%;
  overflow-wrap:anywhere;
  color:var(--palette-text);
  opacity:.13;
}
.editorial-template .editorial-hero .editorial-slogan {
  width:47%;
  max-width:47%;
  color:var(--palette-accent-ink);
}
.editorial-template .editorial-hero .editorial-slogan>span {
  width:max-content;
  max-width:none;
  white-space:nowrap;
}
.editorial-template .editorial-hero .editorial-slogan .slogan-ink {
  width:min(230px,65%);
  max-width:100%;
}
.editorial-template .hero .barber.editorial-portrait {
  top:calc(12% - var(--portrait-y) * 1%);
  bottom:auto;
  left:calc(36% + var(--portrait-x) * 1%);
  width:calc(65% * var(--portrait-scale));
  height:calc(101% * var(--portrait-scale));
}
.editorial-template .editorial-hero .editorial-lead {
  white-space:pre-line;
  overflow-wrap:anywhere;
}
.editorial-template .editorial-hero :is(.editorial-masthead,.editorial-description,.editorial-city>span,.editorial-footnote,.editorial-footnote button) {
  color:var(--palette-muted);
  overflow-wrap:anywhere;
}
.editorial-template .editorial-hero .editorial-masthead>span { min-width:0; }
.editorial-template .editorial-hero :is(.editorial-links,.editorial-links li,.editorial-book) { border-color:var(--palette-line); }
.editorial-template .editorial-hero :is(.editorial-links button,.editorial-link-number,.editorial-book) { color:var(--palette-text); }
.editorial-template .editorial-hero .editorial-links button:hover {
  background:var(--palette-surface);
  color:var(--palette-surface-text);
}
.editorial-template .editorial-hero .editorial-book { background:transparent; }
.editorial-template .editorial-hero .editorial-book:hover {
  background:var(--palette-accent);
  color:var(--palette-on-accent);
  border-color:var(--palette-accent);
}
.editorial-template .editorial-hero .editorial-footnote button:hover { color:var(--palette-text); }
.editorial-template .editorial-hero .editorial-city .city-signature {
  display:block;
  width:100%;
  height:auto;
  color:var(--palette-text);
}
.editorial-template .editorial-hero .editorial-city>span {
  max-width:100%;
  white-space:normal;
  text-align:center;
}
@media(min-width:701px) and (max-width:1100px) {
  .editorial-template .hero .barber.editorial-portrait {
    top:calc(235px - var(--portrait-y) * 8px);
    left:calc(36% + var(--portrait-x) * 1%);
    width:calc(71% * var(--portrait-scale));
    height:calc(760px * var(--portrait-scale));
  }
}
@media(min-width:901px) and (max-width:1100px) and (max-height:850px) {
  .editorial-template .hero .barber.editorial-portrait {
    top:calc(134px - var(--portrait-y) * 8px);
    left:calc(37% + var(--portrait-x) * 1%);
    width:calc(68% * var(--portrait-scale));
    height:calc(790px * var(--portrait-scale));
  }
}
@media(max-width:700px) {
  .editorial-template .editorial-hero .editorial-title { width:100%; }
  .editorial-template .editorial-hero .editorial-slogan {
    width:80%;
    max-width:80%;
  }
  .editorial-template .hero .barber.editorial-portrait {
    top:calc(var(--portrait-y) * -6px);
    bottom:auto;
    left:calc(26% + var(--portrait-x) * 1%);
    width:calc(114% * var(--portrait-scale));
    height:calc(400px * var(--portrait-scale));
  }
}
@media(min-width:431px) and (max-width:700px) {
  .editorial-template .hero .barber.editorial-portrait { height:calc(510px * var(--portrait-scale)); }
}