.editorial-section .section-intro {max-width: 48rem;}
.editorial-section .section-intro > p:last-of-type {max-width: 63ch;}
.editorial-visual {margin-top: clamp(1.35rem, 3.5vw, 2.6rem); min-width: 0;}
.editorial-visual img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid #e7daec;
  border-radius: clamp(.85rem, 2vw, 1.65rem);
  box-shadow: 0 16px 34px #34235616;
}
.editorial-visual figcaption {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .35rem 1rem;
  margin-top: .35rem;
  color: #505975;
}
.editorial-visual figcaption a {
  padding: .45rem 0;
  font-size: .76rem;
  letter-spacing: normal;
  color: #553191;
  text-underline-offset: .18em;
}
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.section-conclusion {font-weight: 700; color: var(--ink); margin-top: 1.25rem;}
.journey .editorial-visual {max-width: 64rem; margin-inline: auto;}
.journey > .section-conclusion, .history-editorial > .section-conclusion {text-align: center;}
.family-editorial {display: grid; gap: 1.25rem; align-items: center;}
.family-editorial .editorial-visual {margin-top: 0;}
.family-editorial .section-intro h2 {font-size: clamp(2rem, 3.6vw, 3.4rem);}
.history-editorial .section-intro {margin-inline: auto; text-align: center;}
.history-editorial .section-intro p {margin-inline: auto;}
.history-editorial h2 em {color: #6231ad;}
.history-editorial .editorial-visual {max-width: 65rem; margin-inline: auto;}
.evolution-layout {
  display: grid;
  grid-template-areas: "intro" "visual" "summary";
  gap: 1.25rem;
}
.evolution-layout .section-intro {grid-area: intro;}
.evolution-layout .editorial-visual {grid-area: visual; margin-top: 0;}
.evolution-layout figcaption, .evolution-layout figcaption a {color: #e2d8f6;}
.evolution-summary {
  grid-area: summary;
  padding-inline-start: 1rem;
  border-inline-start: 3px solid #bca3e4;
  color: #e1e4f4;
}
@media (min-width: 1000px) {
  .evolution-layout {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.65fr);
    grid-template-areas: "intro visual" "summary visual";
    grid-template-rows: 1fr auto;
    column-gap: clamp(2rem, 4vw, 3.5rem);
  }
  .evolution-layout .section-intro {align-self: end;}
  .evolution-layout .editorial-visual {align-self: center;}
  .evolution-layout h2 {font-size: clamp(2.55rem, 3.5vw, 3.75rem);}
}
@media (min-width: 880px) {
  .family-editorial {grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3.6rem);}
  .family-editorial .editorial-visual {grid-area: 1 / 1;}
}

.modo-sessao {background: linear-gradient(135deg, #f7f4ff, #fbf9ff);}
.modo-layout {display: grid; align-items: center; gap: clamp(1.6rem, 3.5vw, 3rem);}
.modo-intro h2 {
  font-family: Georgia, serif;
  font-weight: 500;
  line-height: 1.06;
  color: var(--navy);
}
.modo-intro h2 em {color: #6231ad;}
.modo-intro > p {max-width: 53ch;}
.modo-carousel {min-width: 0;}
.modo-frame {
  aspect-ratio: 1672 / 941;
  overflow: hidden;
  border-radius: clamp(.85rem, 2vw, 1.5rem);
  background: #ede5fc;
  box-shadow: 0 18px 45px rgba(42, 20, 90, .13);
}
.modo-slide {display: block; width: 100%; height: 100%; object-fit: contain;}
.modo-slide[hidden] {display: none;}
.modo-slide:not([hidden]) {animation: modo-enter 500ms ease both;}
@keyframes modo-enter {
  from {opacity: .15; transform: translateX(9px);}
  to {opacity: 1; transform: translateX(0);}
}
.modo-controls, .modo-dots {display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .35rem;}
.modo-controls {margin-top: .75rem;}
.modo-controls button {
  min-height: 44px;
  padding: .35rem .55rem;
  border: 1px solid transparent;
  border-radius: .65rem;
  background: transparent;
  color: #4f327c;
  cursor: pointer;
  font-size: .78rem;
}
.modo-controls button:hover {background: #eee5fc;}
.modo-dots button[aria-current="true"] {background: #e9ddfa; border-color: #cdb7ef; font-weight: 700;}
.modo-controls .modo-arrow {min-width: 44px; font-size: 1.5rem; line-height: 1;}
.modo-zoom {padding: .45rem .55rem; font-size: .76rem; color: #553191; text-underline-offset: .18em;}
.modo-examples {display: grid; gap: 1rem; align-items: center;}
.modo-examples img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: clamp(.6rem, 1.7vw, 1.2rem);
  box-shadow: 0 18px 45px rgba(42, 20, 90, .12);
}
.modo-examples span {display: none; color: #6845a0; text-align: center;}
.modo-conclusion {margin: 0 auto; max-width: 60ch; text-align: center; font-size: clamp(1.1rem, 2vw, 1.35rem); font-weight: 700;}
@media (min-width: 760px) {
  .modo-examples {grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);}
  .modo-examples span {display: block;}
}
@media (min-width: 980px) {
  .modo-layout {grid-template-columns: minmax(0, 1fr) minmax(0, 1.29fr);}
  .modo-examples, .modo-conclusion {grid-column: 1 / -1;}
}
@media (max-width: 600px) {
  .modo-carousel {margin-inline: -.55rem;}
  .modo-controls .modo-arrow {display: none;}
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .modo-examples img {transition: transform 200ms ease;}
  .modo-examples img:hover {transform: translateY(-3px);}
}
@media (prefers-reduced-motion: reduce) {
  .modo-slide:not([hidden]) {animation: none;}
}