/* Give the portrait hero a taller scene and bring the village nearer the sky. */
@media(max-width:760px){
 .story [data-chapter="0"] .intro-actions{display:none}
}
@media(max-width:760px) and (min-height:501px){
 html .story section[data-chapter="0"] .professional{font-size:14px!important;line-height:1.45!important;font-weight:500}
 html .story section[data-chapter="0"] p.intro-description{font-size:16px;line-height:1.5;font-weight:500}
 html .story section[data-chapter]:not([data-chapter="0"]) p:not(.eyebrow){font-size:15px;line-height:1.5;font-weight:500}
 html:not([data-night="true"]) .story section[data-chapter] p:not(.eyebrow){color:#171717}
 html[data-night="true"] .story section[data-chapter] p:not(.eyebrow){color:#f7faf8}
 .stage:has([data-chapter="0"].active) #world{top:0}
 .stage:has([data-chapter="0"].active) .scene-poster img{width:200vw;height:auto;top:calc(var(--story-end,390px) - 120px)}
 /* Keep the full sky behind both the service copy and its illustrated card. */
 .stage #world[data-chapter="bottega"],.stage #world[data-chapter="osservatorio"],.stage #world[data-chapter="piazza"],
 .stage.service-selected #world,.stage.service-selected:has([data-chapter].active) #world{top:0}
 .stage:has(.story section[data-chapter="0"].active)::before,
 .stage:has(.story section[data-chapter="1"].active)::before,
 .stage:has(.story section[data-chapter="2"].active)::before,
 .stage:has(.story section[data-chapter="3"].active)::before{
  content:"";position:absolute;inset:0 0 auto;height:calc(var(--story-end,300px) + 42px);z-index:2;pointer-events:none;
  background:linear-gradient(to bottom,color-mix(in srgb,var(--paper) 91%,transparent) 0%,color-mix(in srgb,var(--paper) 87%,transparent) 62%,color-mix(in srgb,var(--paper) 70%,transparent) 83%,transparent 100%)
 }
 .stage.service-selected::before{display:none}
}
@media(max-width:350px) and (min-height:501px){
 .stage:has([data-chapter="0"].active) .scene-poster img{width:175vw;top:calc(var(--story-end,390px) - 110px)}
}