/* Tokens — Figma frame Desktop / seção Início (1122px) */
:root {
  --color-bg: #1f1f1f;
  --color-bg-light: #f9f8f8;
  --color-text: #ffffff;
  --color-accent: #416191;
  --color-heading: #404040;
  --font-display: "Bebas Neue", sans-serif;
  --font-body: "Gothic A1", sans-serif;
  --header-height: 80px;
  --header-padding-x: 13px;
  /* Figma: Δ entre centros dos links 248–295px (média 273px); caixas bbox sobrepõem — gap flex uniforme */
  --header-nav-gap: clamp(32px, 3.75vw, 72px);
  --hero-height: 1122px;
  --timeline-height: 1037px;
  --timeline-track-width: 3750px;
  --timeline-scroll-step: 1830px;
  --estrutura-height: 800px;
  --numeros-height: 800px;
  --franqueado-height: 800px;
  --marcas-height: 840px;
  --posicionamento-height: 1080px;
  --publico-height: 3240px;
  --marketing-height: 800px;
  --marketing-personalidades-height: 800px;
  --marketing-social-height: 800px;
  --site-footer-amc-height: 495px;
  --section-design-w: 1920;
  --estrutura-design-w: 1920;
  --max-width: 1920px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-body);
  background: var(--color-bg);
  color: var(--color-text);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

a {
  color: inherit;
  text-decoration: none;
}

.site-main {
  max-width: var(--max-width);
  margin: 0 auto;
}

.site-main section {
  scroll-margin-top: var(--header-height);
}

/* ——— Header (Figma: Rectangle 6, 80px, opacity 50%) ——— */
.header {
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 100;
  width: 100%;
  max-width: var(--max-width);
  height: var(--header-height);
  background: rgba(31, 31, 31, 0.5);
}

.header__inner {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 var(--header-padding-x);
  gap: var(--header-nav-gap);
  box-sizing: border-box;
}

.header__logo {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  z-index: 2;
}

.header__logo img {
  width: 106px;
  height: 58px;
  object-fit: contain;
}

.header__menu-btn {
  display: none;
  flex-shrink: 0;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  width: 40px;
  height: 40px;
  margin-left: auto;
  padding: 0;
  background: none;
  border: none;
  cursor: pointer;
  z-index: 3;
}

.header__menu-btn span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--color-text);
  transition: transform 0.2s, opacity 0.2s;
}

.header__nav {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  gap: var(--header-nav-gap);
  min-width: 0;
}

.header__link {
  flex-shrink: 0;
  font-family: var(--font-body);
  font-weight: 800;
  font-size: clamp(11px, 0.89vw, 17px);
  letter-spacing: 2.55px;
  line-height: normal;
  white-space: nowrap;
  color: #ffffff;
  text-decoration: none;
  transition: opacity 0.2s;
}

.header__link:hover,
.header__link--active {
  opacity: 1;
}

/* ——— Hero Início (Figma: 1920×1122) ——— */
.hero {
  position: relative;
  background: var(--color-bg);
  overflow: hidden;
}

.hero__viewport {
  --hero-scale: 1;
  position: relative;
  container-type: inline-size;
  container-name: hero;
  width: 100%;
  max-width: var(--max-width);
  height: calc(var(--hero-height) * var(--hero-scale));
  margin: 0 auto;
  overflow: hidden;
}

.hero__canvas {
  position: absolute;
  top: 0;
  left: 50%;
  width: 1920px;
  height: var(--hero-height);
  margin: 0;
  transform: translateX(-50%) scale(var(--hero-scale));
  transform-origin: top center;
}

@supports (width: 100cqw) {
  @container hero (max-width: 1919px) {
    .hero__viewport {
      --hero-scale: calc(100cqw / 1920px);
      height: calc(var(--hero-height) * 100cqw / 1920px);
    }
  }
}

/* O GRUPO (Figma 1:6) */
.hero__eyebrow {
  position: absolute;
  left: 480px;
  top: 375px;
  z-index: 2;
  width: 511px;
  margin: 0;
  transform: translateX(-50%);
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 180px;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  color: #ffffff;
}

/* AMC LOGO 2 (Figma 1:7) */
.hero__logo-block {
  position: absolute;
  left: 480px;
  top: 484px;
  z-index: 2;
  width: 484px;
  height: 264px;
  transform: translateX(-50%);
  overflow: hidden;
}

.hero__logo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Imagem1 1 — glow (Figma 1:142) */
.hero__glow {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 0;
  width: 587px;
  height: 959px;
  overflow: hidden;
  pointer-events: none;
}

.hero__glow-img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: top right;
}

/* Texto institucional (Figma 1:143) */
.hero__intro {
  position: absolute;
  left: 960px;
  top: 370px;
  z-index: 1;
  width: 719px;
  font-size: 23px;
  line-height: normal;
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
  color: #ffffff;
}

.hero__intro p {
  margin: 0;
}

.hero__intro p + p {
  margin-top: 0.85em;
}

.hero__intro strong {
  font-weight: 700;
}

/* Faixa logos (Figma 1:5) */
.hero__brands {
  position: absolute;
  left: 33px;
  right: -11px;
  top: 1017px;
  z-index: 3;
  height: 48px;
  overflow: hidden;
}

.hero__brands-img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: left center;
  pointer-events: none;
  user-select: none;
}

.hero__brands-links {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.hero__brand-link {
  position: absolute;
  top: 0;
  left: var(--brand-left);
  width: var(--brand-width);
  height: 100%;
  cursor: pointer;
}

.hero__brand-link:hover,
.hero__brand-link:focus,
.hero__brand-link:focus-visible,
.hero__brand-link:active {
  background: transparent;
  outline: none;
  box-shadow: none;
}

/* ——— Marcos Históricos (Figma Ilustração: 3750×1037, viewport 1920) ——— */
.timeline {
  position: relative;
  background: var(--color-bg-light);
  color: #000000;
  overflow: hidden;
}

.timeline__viewport {
  --timeline-scale: 1;
  position: relative;
  container-type: inline-size;
  container-name: timeline;
  width: 100%;
  max-width: var(--max-width);
  height: calc(var(--timeline-height) * var(--timeline-scale));
  margin: 0 auto;
  overflow: hidden;
}

.timeline__canvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(var(--timeline-height) * var(--timeline-scale));
  margin: 0;
  transform: none;
  transform-origin: top left;
}

@supports (width: 100cqw) {
  @container timeline (max-width: 1919px) {
    .timeline__viewport {
      --timeline-scale: calc(100cqw / 1920px);
      height: calc(var(--timeline-height) * var(--timeline-scale));
    }
  }
}

/* Área rolável — sem barra visível (só botão Figma) */
.timeline__scroll {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
  z-index: 2;
}

.timeline__scroll::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.timeline__track {
  position: relative;
  width: calc(var(--timeline-track-width) * var(--timeline-scale));
  height: calc(var(--timeline-height) * var(--timeline-scale));
  flex-shrink: 0;
}

.timeline__content {
  position: relative;
  width: calc(var(--timeline-track-width) * var(--timeline-scale));
  height: calc(var(--timeline-height) * var(--timeline-scale));
}

/* Faixa (tecido) na frente dos conectores, atrás de anos/textos */
.timeline__ribbon-track {
  position: absolute;
  left: 24px;
  top: 325px;
  width: 3726px;
  height: 329px;
  overflow: hidden;
  z-index: 2;
  pointer-events: none;
}

.timeline__year {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 109px;
  height: 178px;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 85px;
  line-height: 0.865; /* Figma: 86,5% */
  letter-spacing: 4.25px; /* Figma: 5% de 85px */
  text-align: center;
  transform: translate(-50%, -50%);
  z-index: 3;
}

/* Caixas menores no Figma (73×148 / 118×148) — mesma tipografia 85px da Ilustração */
.timeline__year--sm {
  width: 73px;
  height: 148px;
  font-size: 85px;
  letter-spacing: 4.25px;
  line-height: 0.79;
}

.timeline__year--md {
  width: 118px;
  height: 148px;
  font-size: 85px;
  letter-spacing: 4.25px;
  line-height: 0.79;
}

/* Linha de cima (19/20): preenchimento fundo + contorno #416191 1,5px */
.timeline__year-part {
  display: block;
  color: var(--color-bg-light);
  -webkit-text-fill-color: var(--color-bg-light);
  -webkit-text-stroke: 1.5px var(--color-accent);
  paint-order: stroke fill;
}

/* Linha de baixo (80/00/08/…): azul sólido, sem traçado */
.timeline__year-part--accent {
  display: block;
  color: var(--color-accent);
  -webkit-text-fill-color: var(--color-accent);
  -webkit-text-stroke: 0;
}

.timeline__text {
  position: absolute;
  width: 234px;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 22px;
  line-height: 1;
  letter-spacing: 1.1px;
  color: #000000;
  z-index: 3;
}

.timeline__text--right {
  width: 243px;
  text-align: right;
}

.timeline__text--left {
  width: 260px;
  text-align: right;
  transform: translate(-100%, -50%);
}

.timeline__text strong {
  font-weight: 700;
}

.timeline__text--extrabold {
  font-weight: 800;
}

.timeline__text--stacked {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0;
  line-height: 1;
}

.timeline__text-line {
  display: block;
}

.timeline__text-line--gap {
  height: 22px;
  line-height: 0;
  overflow: hidden;
  visibility: hidden;
}

/* Conectores atrás da faixa azul (faixa1.png) */
.timeline__connector {
  position: absolute;
  width: 1px;
  background: #000000;
  z-index: 0;
}

.timeline__ribbon-part {
  display: block;
  height: 329px;
  width: auto;
  max-width: none;
  flex-shrink: 0;
  object-fit: contain;
  vertical-align: bottom;
}

.timeline__ribbon-part--mirror {
  display: none;
}

.timeline__text--multiline {
  line-height: 1.25;
  letter-spacing: 1.1px;
}

/* ——— Desktop: Group 2.png (3726×1037) — imagem única ——— */
.timeline__desk-img {
  display: none;
}

@media (min-width: 1081px) {
  .timeline__desk-img {
    display: block !important;
    position: absolute;
    left: 0;
    top: 0;
    width: calc(var(--timeline-track-width) * var(--timeline-scale));
    height: calc(var(--timeline-height) * var(--timeline-scale));
    max-width: none;
    object-fit: fill;
    z-index: 1;
    pointer-events: none;
  }

  .timeline__ribbon-track,
  .timeline__year,
  .timeline__heading,
  .timeline__text,
  .timeline__text-line,
  .timeline__connector,
  .timeline__item {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  .timeline__track,
  .timeline__content {
    width: calc(var(--timeline-track-width) * var(--timeline-scale));
    height: calc(var(--timeline-height) * var(--timeline-scale));
  }
}

.timeline__heading {
  position: absolute;
  left: 61px;
  top: 687px;
  bottom: auto;
  width: 823px;
  margin: 0;
  font-family: var(--font-display);
  font-size: 130px;
  line-height: 117px;
  color: var(--color-heading);
  z-index: 10;
  pointer-events: none;
  transition: opacity 0.2s ease, visibility 0.2s ease;
}

.timeline__heading span {
  display: block;
}

.timeline__heading.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

/* Um único botão — Figma Ellipse 8 + “>” (Ilustração Desk: 91×91, DM Mono 75px) */
.timeline__nav {
  position: absolute;
  left: 1762px;
  top: 652px;
  z-index: 11;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 91px;
  height: 91px;
  padding: 0;
  border: 2px solid var(--color-accent);
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  transition: background 0.2s;
}

.timeline__nav:hover {
  background: var(--color-accent);
}

.timeline__nav:hover .timeline__nav-icon {
  color: var(--color-bg-light);
}

/* Anel mobile (ellipse8) — no desktop o círculo vem do border do botão */
.timeline__nav-ring {
  display: none;
}

.timeline__nav-icon {
  display: block;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
  width: 52px;
  height: 52px;
  color: var(--color-accent);
  transition: transform 0.25s ease, color 0.2s;
}

.timeline__nav.is-back .timeline__nav-icon {
  transform: rotate(180deg);
}

.timeline__nav:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 3px;
}

/* Ilustração historico.json — conectores do fim do ano à linha (2004/2019 sobem) */
.timeline__item--1980 .timeline__year {
  left: 368.5px;
  top: 202px;
}

.timeline__item--1980 .timeline__text {
  left: 314px;
  top: 204px;
  width: 314px;
  transform: translate(-100%, -50%);
}

.timeline__item--1980 .timeline__connector {
  left: 402px;
  top: 291px;
  height: 139px;
}

.timeline__item--2000 .timeline__year {
  left: 699.5px;
  top: 89px;
}

.timeline__item--2000 .timeline__text {
  left: 760px;
  top: 83px;
  transform: translateY(-50%);
}

.timeline__item--2000 .timeline__connector {
  left: 733px;
  top: 178px;
  height: 189px;
}

.timeline__item--2008 .timeline__year {
  left: 1286.5px;
  top: 289px;
}

.timeline__item--2008 .timeline__text {
  left: 1231px;
  top: 289px;
  transform: translate(-100%, -50%);
}

.timeline__item--2008 .timeline__connector {
  left: 1321px;
  top: 378px;
  height: 112px;
}

.timeline__item--2016 .timeline__year {
  left: 1747.5px;
  top: 201px;
}

.timeline__item--2016 .timeline__text {
  left: 1692px;
  top: 201px;
  transform: translate(-100%, -50%);
}

.timeline__item--2016 .timeline__connector {
  left: 1782px;
  top: 275px;
  height: 222px;
}

.timeline__item--2004 .timeline__year {
  left: 981.5px;
  top: 747px;
}

.timeline__item--2004 .timeline__text {
  left: 1043px;
  top: 741px;
  width: 243px;
  transform: translateY(-50%);
}

.timeline__item--2004 .timeline__connector {
  left: 1016px;
  top: 519px;
  height: 139px;
}

/* Passada 2 — marcos x ≥ ~1830 (Ilustração) */
.timeline__item--2017 .timeline__year {
  left: 2090.5px;
  top: 112px;
}

.timeline__item--2017 .timeline__text {
  left: 2146px;
  top: 112px;
  width: 326px;
  line-height: 1.25;
  transform: translateY(-50%);
}

.timeline__item--2017 .timeline__connector {
  left: 2125px;
  top: 186px;
  height: 237px;
}

.timeline__item--2019-skazi .timeline__year {
  left: 2521.5px;
  top: 773px;
}

.timeline__item--2019-skazi .timeline__text {
  left: 2583px;
  top: 767px;
  width: 263px;
  transform: translateY(-50%);
}

.timeline__item--2019-skazi .timeline__connector {
  left: 2556px;
  top: 283px;
  height: 390px;
  clip-path: inset(42px 0 0 0);
}

.timeline__item--2019-oasis .timeline__year {
  left: 3115.5px;
  top: 673px;
}

.timeline__item--2019-oasis .timeline__text {
  left: 3177px;
  top: 667px;
  width: 290px;
  transform: translateY(-50%);
}

.timeline__item--2019-oasis .timeline__text--stacked {
  align-items: flex-start;
}

.timeline__item--2019-oasis .timeline__connector {
  left: 3150px;
  top: 320px;
  height: 121px;
}

.timeline__item--2020 .timeline__year {
  left: 2826px;
  top: 186px;
}

.timeline__item--2020 .timeline__text {
  left: 2767px;
  top: 179.5px;
  width: 237px;
  line-height: 1.25;
  transform: translate(-100%, -50%);
}

.timeline__item--2020 .timeline__connector {
  left: 2862px;
  top: 260px;
  height: 175px;
}

.timeline__item--2024 .timeline__year {
  left: 3331px;
  top: 134px;
}

.timeline__item--2024 .timeline__text {
  left: 3272px;
  top: 127.5px;
  width: 200px;
  transform: translate(-100%, -50%);
}

.timeline__item--2024 .timeline__connector {
  left: 3367px;
  top: 208px;
  height: 175px;
}

/* ——— Estrutura (Figma: Rectangle 19, 1920×800) ——— */
.estrutura {
  position: relative;
  background: var(--color-bg-light);
  color: #ffffff;
  overflow: hidden;
}

/* Viewport escala o canvas 1920×800 (container query + --estrutura-scale no JS) */
.estrutura__viewport {
  --estrutura-scale: 1;
  position: relative;
  container-type: inline-size;
  container-name: estrutura;
  width: 100%;
  max-width: var(--max-width);
  height: calc(var(--estrutura-height) * var(--estrutura-scale));
  margin: 0 auto;
  overflow: hidden;
}

.estrutura__canvas {
  position: absolute;
  top: 0;
  left: 50%;
  width: 1920px;
  height: var(--estrutura-height);
  margin: 0;
  transform: translateX(-50%) scale(var(--estrutura-scale));
  transform-origin: top center;
}

@supports (width: 100cqw) {
  @container estrutura (max-width: 1919px) {
    .estrutura__viewport {
      --estrutura-scale: calc(100cqw / 1920px);
      height: calc(var(--estrutura-height) * 100cqw / 1920px);
    }
  }
}

.estrutura__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

.estrutura__bg-img {
  width: 100%;
  height: 135%;
  max-width: none;
  object-fit: cover;
  object-position: center top;
  transform: translateY(-14.56%);
}

/* Mapa Brasil (Imagem2 1) — atrás do título ESTRUTURA/ */
.estrutura__imagem2 {
  position: absolute;
  left: 873px;
  top: 19px;
  width: 727px;
  height: 764px;
  z-index: 1;
  pointer-events: none;
  overflow: visible;
}

.estrutura__imagem2-map {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
  object-position: center;
}

.estrutura__title {
  position: absolute;
  left: 88px;
  top: 143px;
  z-index: 4;
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 225px;
  line-height: 1;
  color: #ffffff;
  pointer-events: none;
}

.estrutura__tabs {
  position: absolute;
  left: 98px;
  top: 394px;
  z-index: 5;
  pointer-events: auto;
}

.estrutura__tabs-panel {
  display: flex;
  flex-direction: column;
  gap: 11px;
  width: 511px;
  min-height: 119px;
  padding: 20px 20px 20px 69px;
  background: #000000;
  box-sizing: border-box;
}

.estrutura__tab {
  display: flex;
  align-items: flex-start;
  gap: 17px;
  padding: 0;
  border: none;
  background: none;
  color: #ffffff;
  font-family: var(--font-body);
  font-size: 25px;
  line-height: 1;
  text-align: left;
  cursor: pointer;
}

.estrutura__tab-radio {
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  margin-top: 2px;
  border-radius: 50%;
  background: center / contain no-repeat url("../public/images/figma/ellipse2.svg");
}

#estrutura-tab-industriais.estrutura__tab--active .estrutura__tab-radio {
  background-image: url("../public/images/figma/ellipse1.svg");
}

#estrutura-tab-desenvolvimento.estrutura__tab--active .estrutura__tab-radio {
  background-image: url("../public/images/figma/ellipse2.svg");
}

.estrutura__tab:not(.estrutura__tab--active) .estrutura__tab-radio {
  opacity: 0.5;
}

.estrutura__tab:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 4px;
}

.estrutura__tab-label {
  display: block;
}

/* Camadas do mapa — todas visíveis como no frame Figma (tabs = legenda/rádio) */
.estrutura__layer {
  opacity: 1;
}

.estrutura__map-area {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}

.estrutura__map-markers {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

/* Line 7 — Figma: x 1110, y 2706, w 143, rot 180 */
.estrutura__line7-wrap {
  position: absolute;
  left: 1110px;
  top: 546px;
  width: 143px;
  height: 1px;
  overflow: visible;
  pointer-events: none;
}

.estrutura__line7-rotate {
  width: 143px;
  transform: none;
}

.estrutura__line7 {
  display: block;
  width: 143px;
  height: 2px;
  max-width: none;
  filter: brightness(0) invert(1);
}

/* Line 6 — Figma: x 1253, y 2706, w 96.167, rot 135 */
.estrutura__line6-wrap {
  position: absolute;
  left: 1253px;
  top: 546px;
  width: 96.167px;
  height: 1px;
  overflow: visible;
  pointer-events: none;
}

.estrutura__line6-rotate {
  width: 96.167px;
  transform: rotate(45deg);
  transform-origin: left center;
}

.estrutura__line6 {
  display: block;
  width: 96.167px;
  height: 2px;
  max-width: none;
  filter: brightness(0) invert(1);
}

.estrutura__ellipse {
  position: absolute;
  width: 24px;
  height: 24px;
  transform: translateX(-50%);
}

/* Figma: -translate-x-1/2 no X; top = topo do nó 24×24 */
.estrutura__ellipse--4 {
  left: 1329px;
  top: 610px;
}

.estrutura__ellipse--5 {
  left: 1333px;
  top: 641px;
}

.estrutura__ellipse--3 {
  left: 1301px;
  top: 628px;
}

.estrutura__ellipse--rj {
  left: 1462px;
  top: 533px;
}

.estrutura__ellipse--bh {
  left: 1421px;
  top: 459px;
}

.estrutura__region,
.estrutura__unit,
.estrutura__city {
  z-index: 2;
}

.estrutura__region {
  position: absolute;
  margin: 0;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 25px;
  line-height: 1;
  color: #ffffff;
}

.estrutura__region--sc {
  left: 1104px;
  top: 629px;
  width: 179px;
}

.estrutura__unit {
  position: absolute;
  margin: 0;
  font-size: 22px;
  line-height: 1;
  color: #ffffff;
}

.estrutura__unit-name {
  margin: 0 0 10px;
  font-weight: 700;
  font-size: 25px;
}

.estrutura__unit-place,
.estrutura__unit-size,
.estrutura__unit-focus {
  margin: 0 0 10px;
  font-weight: 400;
}

.estrutura__unit-size {
  font-weight: 700;
}

.estrutura__unit-focus strong {
  font-weight: 700;
}

.estrutura__unit--amc {
  left: 894px;
  top: 489px;
  width: 202px;
  text-align: right;
}

.estrutura__unit--menegotti {
  left: 1354px;
  top: 643px;
  width: 221px;
}

.estrutura__city {
  position: absolute;
  margin: 0;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 25px;
  line-height: 1;
  color: #ffffff;
}

.estrutura__city--rj {
  left: 1482px;
  top: 534px;
  width: 176px;
}

.estrutura__city--bh {
  left: 1441px;
  top: 460px;
  width: 188px;
}

/* ——— Números (Figma: Imagem6 2, top 2960, 1920×800) ——— */
.numeros {
  position: relative;
  background: var(--color-bg-light);
  overflow: hidden;
}

.numeros__viewport {
  --numeros-scale: 1;
  position: relative;
  container-type: inline-size;
  container-name: numeros;
  width: 100%;
  max-width: var(--max-width);
  height: calc(var(--numeros-height) * var(--numeros-scale));
  margin: 0 auto;
  overflow: hidden;
}

.numeros__canvas {
  position: absolute;
  top: 0;
  left: 50%;
  width: 1920px;
  height: var(--numeros-height);
  margin: 0;
  transform: translateX(-50%) scale(var(--numeros-scale));
  transform-origin: top center;
}

@supports (width: 100cqw) {
  @container numeros (max-width: 1919px) {
    .numeros__viewport {
      --numeros-scale: calc(100cqw / 1920px);
      height: calc(var(--numeros-height) * 100cqw / 1920px);
    }
  }
}

.numeros__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

.numeros__bg-img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
}

.numeros__strip {
  position: absolute;
  top: 0;
  right: 0;
  width: 429px;
  height: 800px;
  z-index: 1;
  overflow: hidden;
  pointer-events: none;
}

.numeros__strip-img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
}

.numeros__value {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 125px;
  line-height: 1;
  color: var(--color-accent);
}

.numeros__label {
  margin: 0;
  font-family: var(--font-body);
  font-size: 25px;
  line-height: 1;
  letter-spacing: 2.5px;
  color: #000000;
}

.numeros__label strong {
  font-weight: 800;
}

.numeros__label--medium {
  font-weight: 500;
}

.numeros__label--venda {
  font-weight: 800;
}

.numeros__label--venda strong {
  font-weight: 800;
}

.numeros__label--segundos {
  font-weight: 800;
}

.numeros__stat {
  position: absolute;
  z-index: 2;
}

.numeros__stat--24mil {
  left: 85px;
  top: 93px;
  width: 494px;
}

.numeros__stat--24mil .numeros__label {
  margin-top: 11px;
  letter-spacing: 1.6px;
  line-height: 1.15;
}

.numeros__stat--10mio {
  left: 894px;
  top: 93px;
  width: 537px;
}

.numeros__stat--10mio .numeros__label {
  margin-top: 11px;
}

.numeros__stat--venda {
  left: 417px;
  top: 289px;
  width: 1065px;
  height: 123px;
}

.numeros__value--1 {
  position: absolute;
  left: 0;
  top: 37px;
  width: 537px;
}

.numeros__icon--cart {
  position: absolute;
  left: 54px;
  top: 0;
  width: 99px;
  height: 95px;
}

.numeros__stat--venda .numeros__label--venda {
  position: absolute;
  left: 54px;
  top: 117px;
  width: 585px;
}

.numeros__value--2 {
  position: absolute;
  left: 262px;
  top: 37px;
  width: 537px;
}

.numeros__icon--watch {
  position: absolute;
  left: 326px;
  top: 0;
  width: 95px;
  height: 95px;
}

.numeros__stat--venda .numeros__label--segundos {
  position: absolute;
  left: 326px;
  top: 117px;
  width: 585px;
}

.numeros__stat--114mio {
  left: 80px;
  top: 523px;
  width: 545px;
}

.numeros__stat--114mio .numeros__label {
  margin-top: 11px;
  line-height: 1.15;
}

.numeros__stat--2700 {
  left: 894px;
  top: 523px;
  width: 537px;
}

.numeros__stat--2700 .numeros__label {
  margin-top: 11px;
}

/* ——— Franqueado / Franquias (Figma top 3760, 1920×800) ——— */
.franqueado {
  position: relative;
  background: #f9f8f8;
  overflow: hidden;
}

.franqueado__viewport {
  --franqueado-scale: 1;
  position: relative;
  container-type: inline-size;
  container-name: franqueado;
  width: 100%;
  max-width: var(--max-width);
  height: calc(var(--franqueado-height) * var(--franqueado-scale));
  margin: 0 auto;
  overflow: hidden;
}

.franqueado__canvas {
  position: absolute;
  top: 0;
  left: 50%;
  width: 1920px;
  height: var(--franqueado-height);
  margin: 0;
  /* Fallback: metade clara / metade escura (imagem101 ≈ #1a1a1a) */
  background: linear-gradient(to right, var(--color-bg-light) 50%, #1a1a1a 50%);
  transform: translateX(-50%) scale(var(--franqueado-scale));
  transform-origin: top center;
}

@supports (width: 100cqw) {
  @container franqueado (max-width: 1919px) {
    .franqueado__viewport {
      --franqueado-scale: calc(100cqw / 1920px);
      height: calc(var(--franqueado-height) * 100cqw / 1920px);
    }
  }
}

/* Fotos (ordem de empilhamento Figma: 9 → 10 → 5 → 7) */
.franqueado__photos {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.franqueado__photo {
  position: absolute;
  overflow: hidden;
}

.franqueado__photo img {
  display: block;
  width: 100%;
  max-width: none;
  object-fit: cover;
}

.franqueado__photo--base {
  inset: 0;
  z-index: 0;
}

.franqueado__photo--base img {
  height: 135%;
  object-position: center top;
}

/* Figma: left calc(50% + 624px) + translateX(-50%) → centro em 1584px */
.franqueado__photo--center {
  left: calc(50% + 624px);
  top: 0;
  z-index: 1;
  width: 1248px;
  height: 800px;
  transform: translateX(-50%);
}

.franqueado__photo--center img {
  height: 175.55%;
  margin-top: -0.16px;
  object-position: center top;
}

.franqueado__photo--left {
  left: 1px;
  top: 0;
  z-index: 2;
  width: 287px;
  height: 800px;
}

.franqueado__photo--left img {
  height: 116.07%;
  margin-top: -0.32px;
  object-position: center top;
}

.franqueado__photo--right {
  right: 0;
  top: 0;
  z-index: 3;
  width: 340px;
  height: 800px;
}

.franqueado__photo--right img {
  height: 118.88%;
  object-position: center top;
}

/* Faixa preta central (Rectangle 3) */
.franqueado__banner {
  position: absolute;
  left: 50%;
  top: 73px;
  z-index: 4;
  width: 1312px;
  height: 108px;
  transform: translateX(-50%);
  background: #000000;
}

.franqueado__banner-text {
  position: absolute;
  z-index: 5;
  margin: 0;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 33px;
  line-height: 1;
  letter-spacing: 2px;
  color: #ffffff;
}

.franqueado__banner-text--paises {
  left: 885px;
  top: 130px;
  width: 585px;
  transform: translate(-100%, -50%);
  text-align: right;
}

.franqueado__banner-text--pontos {
  left: 1035px;
  top: 130px;
  width: 585px;
  transform: translateY(-50%);
}

.franqueado__banner-num {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 85px;
  line-height: 1;
  color: var(--color-accent);
  vertical-align: middle;
}

.franqueado__title {
  position: absolute;
  z-index: 5;
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 90px;
  line-height: 1;
  letter-spacing: 4.5px;
}

.franqueado__title--franquias {
  left: 885px;
  top: 232px;
  width: 683px;
  transform: translateX(-100%);
  text-align: right;
  color: var(--color-heading);
}

.franqueado__title--lojas {
  left: 1035px;
  top: 236px;
  width: 688px;
  color: #ffffff;
  line-height: 0.9;
}

.franqueado__value {
  position: absolute;
  z-index: 5;
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 80px;
  line-height: 1;
  color: var(--color-accent);
}

.franqueado__value--175 {
  left: 889px;
  top: 367px;
  width: 537px;
  transform: translateX(-100%);
  text-align: right;
}

.franqueado__value--lojas {
  left: 1030px;
  top: 367px;
  width: 537px;
}

.franqueado__value--150 {
  left: 1030px;
  top: 573px;
  width: 537px;
}

.franqueado__desc {
  position: absolute;
  z-index: 5;
  margin: 0;
  font-size: 27px;
  line-height: 1.15;
  letter-spacing: 2.7px;
}

.franqueado__desc--unidades {
  left: 885px;
  top: 456px;
  width: 585px;
  transform: translateX(-100%);
  text-align: right;
  font-weight: 800;
  color: #000000;
}

.franqueado__desc--cidades {
  left: 1035px;
  top: 456px;
  width: 585px;
  font-weight: 500;
  color: #ffffff;
}

.franqueado__desc--escritorios {
  left: 1035px;
  top: 659px;
  width: 466px;
  font-weight: 500;
  color: #ffffff;
}

/* Logos Figma: Logo Colcci 3 (1:228), Forum Branco 2 (1:227) */
.franqueado__logos {
  position: absolute;
  inset: 0;
  z-index: 5;
  pointer-events: none;
}

.franqueado__logo {
  position: absolute;
  display: block;
  object-fit: contain;
}

.franqueado__logo--colcci {
  left: 523px;
  top: 557px;
  width: 179px;
  height: 44px;
}

.franqueado__logo--forum {
  left: 748px;
  top: 556px;
  width: 137px;
  height: 47px;
  filter: brightness(0);
}

/* ——— Marcas (Figma top 4560, 1920×840) ——— */
.marcas {
  position: relative;
  background: #000000;
  overflow: hidden;
}

.marcas__viewport {
  --marcas-scale: 1;
  position: relative;
  container-type: inline-size;
  container-name: marcas;
  width: 100%;
  max-width: var(--max-width);
  height: calc(var(--marcas-height) * var(--marcas-scale));
  margin: 0 auto;
  overflow: hidden;
}

.marcas__canvas {
  position: absolute;
  top: 0;
  left: 50%;
  width: 1920px;
  height: var(--marcas-height);
  margin: 0;
  transform: translateX(-50%) scale(var(--marcas-scale));
  transform-origin: top center;
  display: flex;
  flex-direction: row;
}

.marcas__block {
  position: relative;
  flex: 0 0 960px;
  width: 960px;
  height: 100%;
}

.marcas__block .marcas__lateral {
  position: absolute;
  inset: 0;
  width: 100%;
  height: var(--marcas-height);
  left: 0;
  right: auto;
}

.marcas__block .marcas__brand {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  left: 0;
  right: auto;
}

@supports (width: 100cqw) {
  @container marcas (max-width: 1919px) {
    .marcas__viewport {
      --marcas-scale: calc(100cqw / 1920px);
      height: calc(var(--marcas-height) * 100cqw / 1920px);
    }
  }
}

.marcas__lateral {
  position: absolute;
  top: 0;
  width: 960px;
  height: var(--marcas-height);
  overflow: hidden;
  pointer-events: none;
}

.marcas__lateral img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

/* Figma: opacity 50% na foto = 50% preto por cima (fundo da seção é preto) */
.marcas__lateral::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: rgba(0, 0, 0, 0.5);
  pointer-events: none;
}

/* Aproxima o tom frio do Forum ao sepia do Colcci na costura central */
.marcas__lateral--forum img {
  filter: sepia(0.14) saturate(1.08) brightness(1.03);
}

.marcas__lateral--colcci {
  left: 0;
  z-index: 0;
}

.marcas__lateral--forum {
  right: 0;
  z-index: 0;
}

.marcas__brand {
  position: absolute;
  top: 0;
  z-index: 2;
  width: 960px;
  height: var(--marcas-height);
  pointer-events: none;
}

.marcas__brand--colcci {
  left: 0;
}

.marcas__brand--forum {
  right: 0;
}

.marcas__logo {
  position: absolute;
  display: block;
  object-fit: contain;
  pointer-events: none;
}

.marcas__brand--colcci .marcas__logo {
  left: 293px;
  top: 373px;
  width: 374px;
  height: 91px;
}

.marcas__brand--forum .marcas__logo {
  left: 331px;
  top: 369px;
  width: 299px;
  height: 102px;
}

.marcas__cta {
  position: absolute;
  left: 322px;
  top: 594px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 315px;
  height: 49px;
  border: 2px solid #ffffff;
  border-radius: 7px;
  background: rgba(0, 0, 0, 0.2);
  font-family: var(--font-body);
  font-weight: 800;
  font-size: 15px;
  line-height: 1;
  letter-spacing: 3.75px;
  color: #ffffff;
  text-decoration: none;
  pointer-events: auto;
}

.marcas__brand--forum .marcas__cta {
  left: 323px;
}

.marcas__badge {
  position: absolute;
  left: 440px;
  top: 706px;
  width: 80px;
  height: 80px;
  object-fit: contain;
  pointer-events: none;
}

.marcas__brand--forum .marcas__badge {
  left: 441px;
}

/* ——— Posicionamento de marca (Figma top 5400, 1920×1080) ——— */
.posicionamento {
  position: relative;
  background: #000000;
  overflow: hidden;
}

.posicionamento__viewport {
  --posicionamento-scale: 1;
  position: relative;
  container-type: inline-size;
  container-name: posicionamento;
  width: 100%;
  max-width: var(--max-width);
  height: calc(var(--posicionamento-height) * var(--posicionamento-scale));
  margin: 0 auto;
  overflow: hidden;
}

.posicionamento__canvas {
  position: absolute;
  top: 0;
  left: 50%;
  width: 1920px;
  height: var(--posicionamento-height);
  margin: 0;
  transform: translateX(-50%) scale(var(--posicionamento-scale));
  transform-origin: top center;
}

@supports (width: 100cqw) {
  @container posicionamento (max-width: 1919px) {
    .posicionamento__viewport {
      --posicionamento-scale: calc(100cqw / 1920px);
      height: calc(var(--posicionamento-height) * 100cqw / 1920px);
    }
  }
}

/* Imagem14 1 — cena (parede + modelo na foto) */
.posicionamento__hero {
  display: none;
}

.posicionamento__scene {
  position: absolute;
  inset: 0;
  z-index: 1;
  overflow: hidden;
  pointer-events: none;
}

.posicionamento__scene img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

/* Imagem15 4 — brilho azul sobre a cena (screen), atrás do título/modelo */
.posicionamento__glow {
  position: absolute;
  left: 0;
  top: 18px;
  z-index: 2;
  width: 899px;
  height: 1062px;
  overflow: hidden;
  pointer-events: none;
}

.posicionamento__glow img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: left center;
  mix-blend-mode: screen;
}

/* Imagem13 1 — recorte da modelo (só pixels opacos; alpha 0 no título) */
.posicionamento__model {
  position: absolute;
  inset: 0;
  z-index: 4;
  overflow: hidden;
  pointer-events: none;
}

.posicionamento__model img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.posicionamento__title {
  position: absolute;
  left: 745px;
  top: 211px;
  z-index: 3;
  margin: 0;
  width: 1175px;
  max-width: calc(1920px - 745px);
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 180px;
  line-height: 0.95;
  letter-spacing: 4.25px;
  pointer-events: none;
}

.posicionamento__title-line {
  display: block;
  white-space: nowrap;
}

.posicionamento__title-line--heading {
  color: var(--color-heading);
}

.posicionamento__title-line--accent {
  color: var(--color-accent);
  padding-left: 0.65em;
}

.posicionamento__lead {
  position: absolute;
  left: 1149px;
  top: 604px;
  z-index: 5;
  width: 540px;
  margin: 0;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 23px;
  line-height: 1.15;
  letter-spacing: 1.15px;
  color: var(--color-heading);
}

/* ——— Público + Tendências (Figma top 6480, 1920×3240) ——— */
.publico {
  position: relative;
  background: var(--color-bg-light);
  overflow: hidden;
}

.publico__viewport {
  --publico-scale: 1;
  position: relative;
  container-type: inline-size;
  container-name: publico;
  width: 100%;
  max-width: var(--max-width);
  height: calc(var(--publico-height) * var(--publico-scale));
  margin: 0 auto;
  overflow: hidden;
}

.publico__canvas {
  position: absolute;
  top: 0;
  left: 50%;
  width: 1920px;
  height: var(--publico-height);
  margin: 0;
  transform: translateX(-50%) scale(var(--publico-scale));
  transform-origin: top center;
}

@supports (width: 100cqw) {
  @container publico (max-width: 1919px) {
    .publico__viewport {
      --publico-scale: calc(100cqw / 1920px);
      height: calc(var(--publico-height) * 100cqw / 1920px);
    }
  }
}

.publico__bg {
  position: absolute;
  left: 0;
  right: 0;
  z-index: 0;
  background: var(--color-bg-light);
  pointer-events: none;
}

.publico__bg--1 {
  top: 0;
  height: 1081px;
}

.publico__bg--2 {
  top: 1080px;
  height: 1081px;
}

.publico__bg--3 {
  top: 2160px;
  height: 1080px;
}

/* Imagem19 2 (Figma 1:148) — brilho lateral direita */
.publico__glow--side {
  position: absolute;
  top: 0;
  right: -2px;
  z-index: 1;
  width: 682.47px;
  height: 1309px;
  overflow: visible;
  pointer-events: none;
}

.publico__glow--side img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: fill;
  object-position: right top;
}

/* Imagem19 — faixa superior direita */
.publico__glow--top {
  position: absolute;
  top: 551px;
  right: 0;
  z-index: 1;
  width: 1014px;
  height: 529px;
  overflow: hidden;
  pointer-events: none;
}

.publico__glow--top img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.publico__photo {
  position: absolute;
  z-index: 2;
  overflow: hidden;
  pointer-events: none;
}

.publico__photo img {
  display: block;
  width: 100%;
  max-width: none;
  object-fit: cover;
}

.publico__photo--man {
  left: 0;
  top: 351px;
  width: 461px;
  height: 800px;
}

.publico__photo--man img {
  height: 117.5%;
  margin-top: -13%;
}

.publico__photo--woman {
  right: 100px;
  top: 85px;
  width: 572px;
  height: 800px;
}

.publico__photo--woman img {
  height: 145.72%;
  margin-top: -10.67%;
}

/* Imagem20 1 — modelo boné / denim (Figma 1:239) */
.publico__photo--cap {
  right: 100px;
  top: 884px;
  width: 572px;
  height: 710px;
}

.publico__photo--cap img {
  width: 100%;
  height: 100%;
}

.publico__title {
  position: absolute;
  z-index: 4;
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 250px;
  line-height: 1;
  color: var(--color-heading);
  pointer-events: none;
}

.publico__title--publico {
  left: 382px;
  top: 63px;
  width: 1272px;
  transform: translateX(-50%);
  text-align: center;
}

.publico__title--tendencias {
  right: 94px;
  top: 1656px;
  width: 937px;
  height: 183px;
  font-size: 215px;
  line-height: 1;
  letter-spacing: 0;
  text-align: right;
}

.publico__block {
  position: absolute;
  z-index: 3;
  margin: 0;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 25px;
  line-height: 1.15;
  letter-spacing: 1.35px;
  color: #000000;
}

.publico__label {
  margin: 0 0 5px;
  font-family: inherit;
  font-weight: 800;
  font-size: 29px;
  line-height: 1.15;
  letter-spacing: 1.45px;
  color: var(--color-accent);
}

.publico__copy {
  margin: 0;
  font: inherit;
  line-height: 1.15;
}

.publico__block--segmentacao {
  left: 511px;
  top: 396px;
  width: 435px;
}

.publico__block--marcas {
  right: 721px;
  top: 669px;
  width: 435px;
  text-align: right;
}

.publico__block--engajamento {
  left: 511px;
  top: 962px;
  width: 537px;
}

.publico__block--percepcao {
  left: 1199px;
  top: 1254px;
  width: 607px;
  transform: translateX(-100%);
  text-align: right;
}

.publico__accent {
  position: absolute;
  z-index: 1;
  width: 619px;
  height: 732px;
  overflow: hidden;
  pointer-events: none;
}

.publico__accent img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.publico__accent--tl {
  left: 0;
  top: 1645px;
}

.publico__accent--bl {
  left: 0;
  top: 2377px;
  transform: scaleY(-1);
}

.publico__photo--denim {
  left: 100px;
  top: 1552px;
  width: 550px;
  height: 825px;
}

.publico__photo--red {
  left: 100px;
  top: 2375px;
  width: 550px;
  height: 764px;
}

.publico__photo--dress {
  right: 0;
  top: 2628px;
  width: 910px;
  height: 511px;
}

.publico__lead {
  position: absolute;
  z-index: 3;
  margin: 0;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 25px;
  line-height: 1.15;
  color: #000000;
}

.publico__lead-line {
  display: block;
}

.publico__lead--market {
  right: 100px;
  top: 2032px;
  width: 522px;
  text-align: right;
  letter-spacing: 1.25px;
}

.publico__lead--market .publico__lead-line {
  white-space: nowrap;
}

.publico__lead--styles {
  left: 722px;
  top: 2274px;
  width: 651px;
  letter-spacing: 1.25px;
}

/* ——— Marketing (Figma top 9720, 1920×800) ——— */
.marketing {
  position: relative;
  background: #000000;
  overflow: hidden;
}

.marketing__viewport {
  --marketing-scale: 1;
  position: relative;
  container-type: inline-size;
  container-name: marketing;
  width: 100%;
  max-width: var(--max-width);
  height: calc(var(--marketing-height) * var(--marketing-scale));
  margin: 0 auto;
  overflow: hidden;
}

.marketing__canvas {
  position: absolute;
  top: 0;
  left: 50%;
  width: 1920px;
  height: var(--marketing-height);
  margin: 0;
  transform: translateX(-50%) scale(var(--marketing-scale));
  transform-origin: top center;
}

@supports (width: 100cqw) {
  @container marketing (max-width: 1919px) {
    .marketing__viewport {
      --marketing-scale: calc(100cqw / 1920px);
      height: calc(var(--marketing-height) * 100cqw / 1920px);
    }
  }
}

.marketing__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.marketing__bg img {
  display: block;
  width: 100%;
  max-width: none;
  object-fit: cover;
}

.marketing__canvas > img.marketing__bg {
  display: block;
  width: 100%;
  max-width: none;
  object-fit: cover;
}

.marketing__bg--28 {
  left: -10px;
  right: -9px;
  width: auto;
}

.marketing__bg--28 img {
  height: 100%;
}

.marketing__canvas > img.marketing__bg--28 {
  height: 100%;
}

.marketing__bg--30 {
  left: 1px;
  right: 1px;
  width: auto;
}

.marketing__bg--30 img {
  height: 298.02%;
  margin-top: -151.45%;
  object-position: center top;
}

.marketing__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: rgba(0, 0, 0, 0.35);
  pointer-events: none;
}

.marketing__title {
  position: absolute;
  left: 161px;
  top: 243px;
  z-index: 3;
  margin: 0;
  width: 937px;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 175px;
  line-height: 1;
  color: #ffffff;
  pointer-events: none;
}

.marketing__strategy {
  position: absolute;
  left: 161px;
  top: 426px;
  z-index: 3;
  width: 515px;
  margin: 0;
  color: #ffffff;
  pointer-events: none;
}

.marketing__strategy-label {
  margin: 0 0 5px;
  font-family: var(--font-body);
  font-weight: 800;
  font-size: 27px;
  line-height: 1.15;
  letter-spacing: 1.35px;
}

.marketing__strategy-text {
  margin: 0;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 23px;
  line-height: 1.15;
}

.marketing__campaigns {
  position: absolute;
  left: 1418px;
  top: 399px;
  z-index: 3;
  width: 355px;
  min-height: 206px;
  margin: 0;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 20px;
  line-height: 1.15;
  letter-spacing: 1px;
  text-align: center;
  word-break: normal;
  color: #ffffff;
  pointer-events: none;
}

.marketing__hub {
  position: absolute;
  right: 248px;
  top: 145px;
  z-index: 2;
  width: 508px;
  height: 508px;
  pointer-events: none;
}

.marketing__ring {
  position: absolute;
  display: block;
  max-width: none;
}

.marketing__ring--inner {
  right: 14px;
  top: 14px;
  width: 480px;
  height: 480px;
}

.marketing__ring--outer {
  right: 0;
  top: 0;
  width: 508px;
  height: 508px;
}

.marketing__channels {
  position: absolute;
  inset: 0;
  z-index: 4;
  margin: 0;
  padding: 0;
  list-style: none;
  pointer-events: none;
}

.marketing__channel {
  position: absolute;
  width: 114px;
  height: 114px;
  margin: 0;
  padding: 0;
}

.marketing__channel img {
  display: block;
  width: 114px;
  height: 114px;
}

/* Desktop — oculta variantes mobile (mobile.css usa !important no ≤1024px) */
.marketing__hub img.marketing__asset--mob,
.marketing__channel img.marketing__asset--mob,
.marketing__bg-foto {
  display: none !important;
}

.marketing__channel-label {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 129px;
  transform: translate(-50%, -50%);
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 17px;
  line-height: 1.15;
  letter-spacing: 0.85px;
  text-align: center;
  color: #000000;
}

.marketing__channel-label--site {
  font-size: 18px;
  letter-spacing: 0.9px;
}

.marketing__channel-label--stack {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.marketing__channel-line + .marketing__channel-line {
  margin-top: 5px;
}

.marketing__channel--site {
  right: 542px;
  top: 120px;
}

.marketing__channel--tv {
  right: 348px;
  top: 120px;
}

.marketing__channel--magazines {
  left: 1637.5px;
  top: 245.5px;
  transform: translateX(-50%);
}

.marketing__channel--trade {
  right: 225px;
  top: 437.5px;
}

.marketing__channel--email {
  right: 542px;
  top: 559px;
}

.marketing__channel--events {
  right: 348px;
  top: 559px;
}

.marketing__channel--social {
  right: 664px;
  top: 245.5px;
}

.marketing__channel--creators {
  right: 664px;
  top: 437.5px;
}

/* ——— Marketing Personalidades (Figma top 10520, 1920×800) ——— */
.marketing-personalidades {
  position: relative;
  background: #5977a8;
  overflow: hidden;
}

.marketing-personalidades__viewport {
  --marketing-personalidades-scale: 1;
  position: relative;
  container-type: inline-size;
  container-name: marketing-personalidades;
  width: 100%;
  max-width: var(--max-width);
  height: calc(
    var(--marketing-personalidades-height) * var(--marketing-personalidades-scale)
  );
  margin: 0 auto;
  overflow: hidden;
}

.marketing-personalidades__canvas {
  position: absolute;
  top: 0;
  left: 50%;
  width: 1920px;
  height: var(--marketing-personalidades-height);
  transform: translateX(-50%) scale(var(--marketing-personalidades-scale));
  transform-origin: top center;
}

@supports (width: 100cqw) {
  @container marketing-personalidades (max-width: 1919px) {
    .marketing-personalidades__viewport {
      --marketing-personalidades-scale: calc(100cqw / 1920px);
      height: calc(var(--marketing-personalidades-height) * 100cqw / 1920px);
    }
  }
}

.marketing-personalidades__bg,
.marketing-personalidades__photo {
  position: absolute;
  pointer-events: none;
}

.marketing-personalidades__bg {
  inset: 0;
  z-index: 0;
}

.marketing-personalidades__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.marketing-personalidades__photo {
  z-index: 2;
}

.marketing-personalidades__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.marketing-personalidades__photo--26 {
  left: -72px;
  top: 281px;
  width: 938px;
  height: 519px;
}

.marketing-personalidades__photo--35 {
  left: 1048px;
  top: 0;
  width: 404px;
  height: 606px;
}

.marketing-personalidades__photo--33 {
  left: 758px;
  top: 321px;
  width: 718px;
  height: 479px;
}

.marketing-personalidades__photo--34 {
  left: 1435px;
  top: 119px;
  width: 484px;
  height: 604px;
}

.marketing-personalidades__title {
  position: absolute;
  left: 156px;
  top: 238px;
  z-index: 3;
  width: 937px;
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 175px;
  line-height: 1;
  color: #ffffff;
}

.marketing-personalidades__text {
  position: absolute;
  left: 160px;
  top: 421px;
  z-index: 3;
  width: 515px;
  color: #ffffff;
}

.marketing-personalidades__label {
  margin: 0 0 5px;
  font-family: var(--font-body);
  font-weight: 800;
  font-size: 27px;
  line-height: 1.15;
  letter-spacing: 1.35px;
}

.marketing-personalidades__body {
  margin: 0;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 23px;
  line-height: 1.15;
}

/* ——— Marketing Social (Figma top 11320, 1920×800) ——— */
.marketing-social {
  position: relative;
  background: #f3f3f3;
  overflow: hidden;
}

.marketing-social__viewport {
  --marketing-social-scale: 1;
  position: relative;
  container-type: inline-size;
  container-name: marketing-social;
  width: 100%;
  max-width: var(--max-width);
  height: calc(var(--marketing-social-height) * var(--marketing-social-scale));
  margin: 0 auto;
  overflow: hidden;
}

.marketing-social__canvas {
  position: absolute;
  top: 0;
  left: 50%;
  width: 1920px;
  height: var(--marketing-social-height);
  transform: translateX(-50%) scale(var(--marketing-social-scale));
  transform-origin: top center;
}

@supports (width: 100cqw) {
  @container marketing-social (max-width: 1919px) {
    .marketing-social__viewport {
      --marketing-social-scale: calc(100cqw / 1920px);
      height: calc(var(--marketing-social-height) * 100cqw / 1920px);
    }
  }
}

.marketing-social__bg,
.marketing-social__phone {
  position: absolute;
  pointer-events: none;
}

.marketing-social__bg {
  inset: 0;
  z-index: 0;
}

.marketing-social__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.marketing-social__presence {
  position: absolute;
  left: 160px;
  top: 218px;
  z-index: 2;
  width: 515px;
  margin: 0;
  font-family: var(--font-body);
  font-weight: 800;
  font-size: 30px;
  line-height: 1.15;
  letter-spacing: 1.5px;
  color: #404040;
}

.marketing-social__plus14 {
  position: absolute;
  left: 156px;
  top: 281px;
  z-index: 2;
  width: 466px;
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 300px;
  line-height: 1;
  color: #404040;
}

.marketing-social__followers {
  position: absolute;
  left: 543px;
  top: 391px;
  z-index: 2;
  width: 515px;
  margin: 0;
  color: #404040;
}

.marketing-social__followers-line {
  display: block;
  font-family: var(--font-display);
  font-weight: 400;
  line-height: 1;
}

.marketing-social__followers-line--1 {
  margin-bottom: 5px;
  font-size: 85px;
}

.marketing-social__followers-line--2 {
  font-size: 50px;
}

.marketing-social__phone {
  z-index: 1;
}

.marketing-social__phone img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.marketing-social__phone--37 {
  left: 942px;
  top: 0;
  width: 241px;
  height: 800px;
}

.marketing-social__phone--36 {
  left: 1154px;
  top: 0;
  width: 238px;
  height: 800px;
}

.marketing-social__phone--38 {
  left: 1363px;
  top: 0;
  width: 238px;
  height: 800px;
}

.marketing-social__phone--39-1 {
  left: 1572px;
  top: 0;
  width: 238px;
  height: 644px;
}

.marketing-social__phone--39-2 {
  left: 1575px;
  top: 597px;
  width: 238px;
  height: 203px;
}

/* ——— Footer AMC (Figma top 12225→12615, 1920×390) ——— */
.site-footer-amc {
  position: relative;
  background: #1f1f1f;
  overflow: hidden;
}

.site-footer-amc__viewport {
  --site-footer-amc-scale: 1;
  position: relative;
  container-type: inline-size;
  container-name: site-footer-amc;
  width: 100%;
  max-width: var(--max-width);
  height: calc(var(--site-footer-amc-height) * var(--site-footer-amc-scale));
  margin: 0 auto;
  overflow: hidden;
}

.site-footer-amc__canvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 1920px;
  height: var(--site-footer-amc-height);
  transform: scale(var(--site-footer-amc-scale));
  transform-origin: top left;
}

@supports (width: 100cqw) {
  @container site-footer-amc (max-width: 1919px) {
    .site-footer-amc__viewport {
      --site-footer-amc-scale: calc(100cqw / 1920px);
      height: calc(var(--site-footer-amc-height) * 100cqw / 1920px);
    }
  }
}

.site-footer-amc__top-bg {
  position: absolute;
  inset: 0 0 85px;
  z-index: 0;
  pointer-events: none;
  background: #1f1f1f;
}

.site-footer-amc__logo {
  position: absolute;
  left: 776.29px;
  top: 105px;
  width: 367.42px;
  height: 200px;
  z-index: 2;
  pointer-events: none;
}

.site-footer-amc__logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.site-footer-amc__links {
  position: absolute;
  left: 80px;
  top: 138px;
  z-index: 3;
  width: 478px;
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.site-footer-amc__menu {
  position: relative;
}

.site-footer-amc__link {
  display: block;
  width: 100%;
  min-height: 48px;
  padding: 8px 0;
  border: 0;
  background: transparent;
  text-align: left;
  font-family: var(--font-body);
  font-weight: 800;
  font-size: 17px;
  line-height: normal;
  letter-spacing: 2.55px;
  color: #ffffff;
  cursor: pointer;
}

.site-footer-amc__link--toggle[aria-expanded="true"] {
  text-decoration: underline;
  text-underline-offset: 4px;
}

.site-footer-amc__submenu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 5;
  min-width: 360px;
  margin: 0;
  padding: 18px 22px;
  list-style: none;
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
  isolation: isolate;
}

.site-footer-amc__submenu[hidden] {
  display: none;
}

.site-footer-amc__submenu li + li {
  margin-top: 14px;
}

.site-footer-amc__submenu-link {
  display: block;
  font-family: var(--font-body);
  font-weight: 800;
  font-size: 13px;
  line-height: 1.35;
  letter-spacing: 1.95px;
  color: #1f1f1f;
  text-transform: uppercase;
}

.site-footer-amc__submenu-link:hover,
.site-footer-amc__submenu-link:focus-visible {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.site-footer-amc.is-submenu-open {
  position: relative;
  z-index: 9999;
  overflow: visible;
}

.site-footer-amc__viewport.is-submenu-open {
  overflow: visible;
}

.site-footer-amc.is-submenu-open .site-footer-amc__canvas {
  overflow: visible;
}

.site-footer-amc.is-submenu-open .site-footer-amc__links {
  z-index: 200;
}

.site-footer-amc.is-submenu-open .site-footer-amc__menu {
  z-index: 201;
}

.site-footer-amc.is-submenu-open .site-footer-amc__submenu {
  z-index: 9999;
}

.site-footer-amc__legal {
  position: absolute;
  left: 392px;
  top: 349px;
  z-index: 2;
  width: 1136px;
  height: 40px;
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 15px;
  line-height: 20px;
  letter-spacing: 1.5px;
  text-align: center;
  color: #ffffff;
}

.site-footer-amc__legal span + span {
  margin-top: 0;
}

.site-footer-amc__brand-strip {
  position: absolute;
  left: 0;
  top: 410px;
  width: 1920px;
  height: 85px;
  z-index: 3;
  overflow: hidden;
  background: #000000;
}

.site-footer-amc__brand-strip img {
  position: absolute;
  top: 0;
  height: 85px;
  max-width: none;
}

.site-footer-amc__strip-inst {
  left: 286px;
  width: 663px;
}

.site-footer-amc__strip-finep {
  left: 949px;
  width: 685px;
}

/* ——— Escala proporcional abaixo de 1920px ——— */
@media (max-width: 1919px) {
  .timeline__heading {
    font-size: clamp(64px, 6.8vw, 130px);
    line-height: 0.9;
    width: 42.86%;
  }

}

/* Notebook: seção em largura total do browser */
@media (min-width: 769px) and (max-width: 1919px) {
  .hero,
  .timeline,
  .estrutura,
  .numeros,
  .franqueado,
  .marcas,
  .posicionamento,
  .publico,
  .marketing,
  .marketing-personalidades,
  .marketing-social,
  .site-footer-amc {
    width: 100%;
    max-width: var(--max-width);
    margin-left: auto;
    margin-right: auto;
  }

  .hero__viewport,
  .timeline__viewport,
  .estrutura__viewport,
  .numeros__viewport,
  .franqueado__viewport,
  .marcas__viewport,
  .posicionamento__viewport,
  .publico__viewport,
  .marketing__viewport,
  .marketing-personalidades__viewport,
  .marketing-social__viewport,
  .site-footer-amc__viewport {
    width: 100%;
    max-width: var(--max-width);
    margin-left: auto;
    margin-right: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .header__nav,
  .header__menu-btn span,
  .estrutura__layer {
    transition: none;
  }
}