/* Terrae Caravelli — Territories. One origin, three material expressions. */

html,
body {
  width: 100%;
  min-height: 100%;
  margin: 0;
  background: radial-gradient(ellipse at 47% 46%, #111510 0%, #0c100d 53%, #080907 100%);
}

body {
  overflow: hidden;
  color: var(--tc-craie, #e8e3d8);
  font-family: var(--cv-typo-current-ff, var(--tc-font-ui, Arial, sans-serif));
  font-synthesis: var(--cv-typo-synthesis, none);
}

.terrae-territories,
.terrae-territories * {
  box-sizing: border-box;
}

.terrae-territories {
  --territory-ink: rgba(142, 116, 88, .64);
  --territory-paper: rgba(232, 227, 216, .86);
  position: relative;
  isolation: isolate;
  width: 100%;
  height: 100vh;
  height: 100svh;
  min-height: 420px;
  overflow: hidden;
  background: radial-gradient(ellipse at 47% 46%, #111510 0%, #0c100d 53%, #080907 100%);
}

body[data-territory="napoli"] .terrae-territories {
  --territory-ink: rgba(142, 116, 88, .76);
  --territory-paper: rgba(232, 227, 216, .8);
}

body[data-territory="reims"] .terrae-territories {
  --territory-ink: rgba(232, 227, 216, .5);
  --territory-paper: rgba(244, 240, 232, .9);
}

.terrae-territories__canvas,
.terrae-territories__fallback,
.terrae-territories__light,
.terrae-territories__vignette {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.terrae-territories__canvas {
  z-index: 1;
  display: block;
  opacity: 0;
  transition: opacity 1200ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1));
}

.terrae-territories--webgl .terrae-territories__canvas {
  opacity: 1;
}

.terrae-territories__fallback {
  z-index: 0;
  overflow: hidden;
  opacity: 1;
  background: #0c100d;
  transition: opacity 1200ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1));
}

.terrae-territories--webgl .terrae-territories__fallback { opacity: 0; }

.terrae-territories__fallback-material {
  position: absolute;
  inset: -4%;
  background-color: var(--tc-terra-ombra, #2b211a);
  background-image:
    linear-gradient(116deg, rgba(8, 9, 7, .67) 4%, rgba(43, 33, 26, .46) 45%, rgba(142, 116, 88, .09) 59%, rgba(8, 9, 7, .78) 94%),
    url("/assets/prologue-caravelli/terrae/03_PATTERNS/TC_Texture_Brume_1800.jpg"),
    url("/assets/prologue-caravelli/terrae/03_PATTERNS/TC_Texture_Craie_1800.jpg"),
    url("/assets/prologue-caravelli/terrae/03_PATTERNS/TC_Texture_Terre_1800.jpg");
  background-position: center;
  background-size: cover;
  background-blend-mode: multiply, soft-light, soft-light, normal;
  filter: contrast(1.12) saturate(.54) brightness(.54);
  transform: scale(1.035);
}

.terrae-territories__fallback-topography {
  position: absolute;
  inset: -9% -7%;
  width: 114%;
  height: 118%;
  object-fit: cover;
  opacity: .24;
  filter: brightness(.72) saturate(.68);
  mix-blend-mode: screen;
}

.terrae-territories__fallback-roots {
  position: absolute;
  top: 45%;
  right: -8%;
  bottom: -18%;
  left: -8%;
  overflow: hidden;
  opacity: .28;
  mask-image: linear-gradient(180deg, transparent, #000 17%, #000);
}

.terrae-territories__fallback-roots img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 112vh;
  height: 150vw;
  max-width: none;
  object-fit: cover;
  filter: brightness(.66) saturate(.7);
  mix-blend-mode: screen;
  transform: translate(-50%, -50%) rotate(90deg) scale(.78, 1.12);
}

.terrae-territories__fallback-expression {
  position: absolute;
  inset: 0;
  opacity: .74;
  background: rgba(16, 36, 29, .08);
  mix-blend-mode: color;
  transition: background-color 2400ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1));
}

body[data-territory="firenze"] .terrae-territories__fallback-expression { background-color: rgba(16, 36, 29, .13); }
body[data-territory="napoli"] .terrae-territories__fallback-expression { background-color: rgba(58, 23, 34, .13); }
body[data-territory="reims"] .terrae-territories__fallback-expression { background-color: rgba(244, 240, 232, .08); }

.no-js .terrae-territories__fallback,
.terrae-territories--fallback .terrae-territories__fallback {
  opacity: 1;
}

.no-js .terrae-territories__fallback-material,
.terrae-territories--fallback.terrae-territories--running .terrae-territories__fallback-material {
  animation: terraeTerritoriesMatter 12s var(--tc-ease, cubic-bezier(.2, .65, .2, 1)) both;
}

.no-js .terrae-territories__fallback-expression,
.terrae-territories--fallback.terrae-territories--running .terrae-territories__fallback-expression {
  animation: terraeTerritoriesFallbackCycle 30s linear 4s infinite;
}

.terrae-territories__continuity {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: -4%;
  left: -4%;
  height: 1px;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(90deg, transparent, rgba(142, 116, 88, .24) 12%, rgba(142, 116, 88, .62) 50%, rgba(142, 116, 88, .24) 88%, transparent);
  box-shadow: 0 1px 12px rgba(142, 116, 88, .08);
  transform: rotate(-.35deg) scaleX(.82);
}

.terrae-territories--running .terrae-territories__continuity,
.no-js .terrae-territories__continuity {
  animation: terraeTerritoriesContinuity 12s var(--tc-ease, cubic-bezier(.2, .65, .2, 1)) 2.4s both;
}

.terrae-territories__light {
  z-index: 2;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(111deg, transparent 15%, rgba(232, 227, 216, .014) 31%, rgba(142, 116, 88, .12) 49%, rgba(232, 227, 216, .038) 58%, transparent 76%);
  mix-blend-mode: screen;
  transform: translate3d(-24%, 0, 0);
}

.terrae-territories--running .terrae-territories__light,
.no-js .terrae-territories__light {
  animation: terraeTerritoriesLight 30s var(--tc-ease, cubic-bezier(.2, .65, .2, 1)) 4s infinite;
}

.terrae-territories__vignette {
  z-index: 3;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 50% 48%, transparent 18%, rgba(8, 9, 7, .12) 59%, rgba(8, 9, 7, .8) 100%),
    linear-gradient(180deg, rgba(8, 9, 7, .43), transparent 23%, transparent 72%, rgba(8, 9, 7, .69));
}

.terrae-territories__historical {
  position: absolute;
  z-index: 4;
  top: 14%;
  bottom: 14%;
  left: clamp(52px, 7.2vw, 112px);
  width: min(49vw, 720px);
  overflow: hidden;
  pointer-events: none;
  opacity: 0;
  mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 88%, transparent 100%);
}

.terrae-territories--running .terrae-territories__historical,
.no-js .terrae-territories__historical {
  animation: terraeTerritoriesHistorical 2400ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1)) 3600ms both;
}

.terrae-territories__historical i {
  position: absolute;
  display: block;
  opacity: 0;
  transition: opacity 2600ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1));
}

.terrae-territories__historical-frame {
  inset: 7% 6% 9% 3%;
  border: 1px solid rgba(142, 116, 88, .11);
  box-shadow: inset 0 0 0 11px rgba(8, 9, 7, .05);
}

.terrae-territories__historical-frame::before,
.terrae-territories__historical-frame::after {
  content: "";
  position: absolute;
  background: rgba(142, 116, 88, .18);
}

.terrae-territories__historical-frame::before {
  top: 10%;
  bottom: 10%;
  left: 50%;
  width: 1px;
}

.terrae-territories__historical-frame::after {
  top: 50%;
  right: 7%;
  left: 7%;
  height: 1px;
}

.terrae-territories__historical-arc {
  top: 18%;
  left: 24%;
  width: 46%;
  aspect-ratio: 1;
  border: 1px solid rgba(232, 227, 216, .24);
  border-bottom-color: transparent;
  border-radius: 50% 50% 0 0;
  box-shadow:
    0 -18px 48px rgba(142, 116, 88, .04),
    inset 0 1px rgba(142, 116, 88, .13);
}

.terrae-territories__historical-arc::before,
.terrae-territories__historical-arc::after {
  content: "";
  position: absolute;
  top: 49%;
  bottom: -74%;
  width: 1px;
  background: linear-gradient(rgba(232, 227, 216, .24), rgba(142, 116, 88, .06));
}

.terrae-territories__historical-arc::before { left: 0; }
.terrae-territories__historical-arc::after { right: 0; }

.terrae-territories__historical-strata {
  inset: 16% 5% 12% 2%;
  background: repeating-linear-gradient(
    176deg,
    transparent 0 28px,
    rgba(142, 116, 88, .15) 29px,
    transparent 30px 47px
  );
  filter: drop-shadow(0 12px 24px rgba(58, 23, 34, .13));
  transform: perspective(620px) rotateX(7deg) rotateZ(-1.2deg);
}

.terrae-territories__historical-elevation {
  inset: 11% 9% 8% 5%;
  background:
    linear-gradient(90deg, transparent 19%, rgba(232, 227, 216, .14) 19.15%, transparent 19.3%),
    linear-gradient(90deg, transparent 37%, rgba(232, 227, 216, .2) 37.15%, transparent 37.3%),
    linear-gradient(90deg, transparent 50%, rgba(232, 227, 216, .28) 50.15%, transparent 50.3%),
    linear-gradient(90deg, transparent 63%, rgba(232, 227, 216, .2) 63.15%, transparent 63.3%),
    linear-gradient(90deg, transparent 81%, rgba(232, 227, 216, .14) 81.15%, transparent 81.3%);
  box-shadow: inset 0 28px 80px rgba(244, 240, 232, .025);
}

.terrae-territories__historical-ink {
  top: 47%;
  right: 1%;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--territory-ink) 18%, rgba(232, 227, 216, .3) 51%, var(--territory-ink) 82%, transparent);
  box-shadow: 0 0 24px rgba(142, 116, 88, .1);
}

body[data-territory="firenze"] .terrae-territories__historical-frame,
body[data-territory="firenze"] .terrae-territories__historical-arc,
body[data-territory="firenze"] .terrae-territories__historical-ink,
body[data-territory="napoli"] .terrae-territories__historical-strata,
body[data-territory="napoli"] .terrae-territories__historical-ink,
body[data-territory="reims"] .terrae-territories__historical-elevation,
body[data-territory="reims"] .terrae-territories__historical-ink {
  opacity: 1;
}

.terrae-territories__archive {
  position: absolute;
  z-index: 5;
  inset: 0;
  pointer-events: none;
}

.terrae-territories__archive-spine {
  position: absolute;
  z-index: 4;
  top: 50%;
  left: 50%;
  width: 106%;
  height: auto;
  opacity: 0;
  filter: drop-shadow(0 0 16px rgba(142, 116, 88, .18));
  transform: translate(-50%, -50%);
  transition: opacity 900ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1));
}

body[data-territory-phase="outro"] .terrae-territories__archive-spine { opacity: .68; }

.terrae-territories__chapter {
  position: absolute;
  inset: clamp(78px, 9vh, 104px) clamp(30px, 4.5vw, 72px) clamp(70px, 8vh, 92px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 520ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1));
}

body[data-territory="firenze"] [data-archive-city="firenze"],
body[data-territory="napoli"] [data-archive-city="napoli"],
body[data-territory="reims"] [data-archive-city="reims"] {
  opacity: 1;
  pointer-events: auto;
  transition-duration: 1300ms;
}

.terrae-territories__plate {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  margin: 0;
  overflow: hidden;
  opacity: 0;
  background: #d8cbb1;
  border: 1px solid rgba(142, 116, 88, .42);
  box-shadow:
    0 28px 80px rgba(8, 9, 7, .48),
    0 2px 0 rgba(244, 240, 232, .2) inset,
    0 0 0 10px rgba(8, 9, 7, .12);
  transition: opacity 520ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1));
}

.terrae-territories__plate::before,
.terrae-territories__plate::after {
  content: "";
  position: absolute;
  z-index: 3;
  pointer-events: none;
}

.terrae-territories__plate::before {
  inset: 0;
  border: 1px solid rgba(43, 33, 26, .22);
  box-shadow: inset 0 0 64px rgba(43, 33, 26, .17);
}

.terrae-territories__plate::after {
  inset: 0;
  background: linear-gradient(105deg, transparent 23%, rgba(244, 240, 232, .08) 48%, transparent 70%);
  mix-blend-mode: screen;
  opacity: .5;
}

.terrae-territories__plate picture {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
}

.terrae-territories__plate picture img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: 0;
  filter: contrast(1.035) saturate(.78) sepia(.08);
  transform: scale(1.006);
  transition: opacity 700ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1));
}

.terrae-territories__plate picture img[data-archive-ready="true"] { opacity: 1; }

.terrae-territories__chapter--firenze .terrae-territories__plate { background: #dacdb5; }
.terrae-territories__chapter--firenze .terrae-territories__plate picture img { filter: contrast(1.04) saturate(.73) sepia(.1); }
.terrae-territories__chapter--napoli .terrae-territories__plate { background: #c9b891; }
.terrae-territories__chapter--napoli .terrae-territories__plate picture img { filter: contrast(1.06) saturate(.86) sepia(.08); }
.terrae-territories__chapter--reims .terrae-territories__plate { background: #e0d7c7; }
.terrae-territories__chapter--reims .terrae-territories__plate picture img { filter: contrast(1.045) saturate(.44) sepia(.055); }

.terrae-territories__period-overlay {
  position: absolute;
  z-index: 2;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  opacity: .14;
  mix-blend-mode: multiply;
}

.terrae-territories__plate figcaption {
  position: absolute;
  z-index: 5;
  right: 16px;
  bottom: 14px;
  left: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 10px 12px;
  color: rgba(10, 15, 13, .78);
  background: rgba(244, 240, 232, .91);
  border-top: 1px solid rgba(43, 33, 26, .17);
  font-size: var(--cv-typo-current-fs, 8px);
  font-weight: var(--cv-typo-current-fw, 500);
  line-height: var(--cv-typo-current-lh, 1.4);
  letter-spacing: var(--cv-typo-current-ls, .09em);
  text-transform: var(--cv-typo-current-tt, uppercase);
  backdrop-filter: blur(6px);
}

.terrae-territories__plate figcaption a {
  flex: 0 0 auto;
  color: #594630;
  text-decoration: none;
  letter-spacing: var(--cv-typo-current-ls, .18em);
}

.terrae-territories__plate figcaption a::after {
  content: " ↗";
  font-size: var(--cv-typo-current-fs, .9em);
}

.terrae-territories__plate--view picture img {
  transform: scale(1.012);
}

.terrae-territories__plate--panorama picture img {
  width: calc(100% - 5vw);
  height: auto;
  max-height: calc(100% - 94px);
}

.terrae-territories__plate--portrait picture img {
  width: auto;
  max-width: calc(100% - 34px);
  height: calc(100% - 78px);
  margin-bottom: 34px;
}

body[data-territory-phase="title"] .terrae-territories__plate--map {
  opacity: .2;
  mask-image: url("/assets/prologue-caravelli/terrae/historical-cities/overlays/historical_map_reveal_mask.svg");
  mask-size: cover;
}

body[data-territory-phase="map"] .terrae-territories__plate--map,
body[data-territory-phase="sectors"] .terrae-territories__plate--map {
  opacity: 1;
  transition-duration: 1100ms;
}

body[data-territory-phase="view"] .terrae-territories__plate--view {
  opacity: 1;
  transition-duration: 1200ms;
}

body[data-territory-phase="outro"] .terrae-territories__plate--view { opacity: .22; }

.terrae-territories__sectors {
  position: absolute;
  z-index: 6;
  top: 50%;
  right: 2.4%;
  width: min(290px, 25vw);
  margin: 0;
  padding: 22px 24px;
  list-style: none;
  color: #171b17;
  background: rgba(244, 240, 232, .96);
  border: 1px solid rgba(89, 70, 48, .28);
  box-shadow: 0 22px 64px rgba(8, 9, 7, .3), inset 0 0 0 5px rgba(142, 116, 88, .07);
  opacity: 0;
  transform: translateY(-50%);
  transition: opacity 500ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1));
}

.terrae-territories__sectors::before {
  content: attr(data-terrae-sectors-label);
  display: block;
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(89, 70, 48, .2);
  color: rgba(89, 70, 48, .78);
  font-size: var(--cv-typo-current-fs, 7px);
  font-weight: var(--cv-typo-current-fw, 600);
  letter-spacing: var(--cv-typo-current-ls, .24em);
}

.terrae-territories__sectors li {
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 7px;
  padding: 6px 0;
  border-bottom: 1px solid rgba(89, 70, 48, .1);
  font-family: var(--cv-typo-current-ff, "Cormorant Garamond", var(--tc-font-editorial, Georgia, serif));
  font-size: var(--cv-typo-current-fs, 14px);
  line-height: var(--cv-typo-current-lh, 1.15);
}

.terrae-territories__sectors li:last-child { border-bottom: 0; }

.terrae-territories__sectors b {
  padding-top: 2px;
  color: #8e7458;
  font-family: var(--cv-typo-current-ff, var(--tc-font-ui, Arial, sans-serif));
  font-size: var(--cv-typo-current-fs, 7px);
  font-weight: var(--cv-typo-current-fw, 600);
  letter-spacing: var(--cv-typo-current-ls, .08em);
}

body[data-territory-phase="sectors"] .terrae-territories__sectors {
  opacity: 1;
  transition-duration: 1000ms;
}

.terrae-territories__header {
  position: absolute;
  z-index: 7;
  top: max(28px, env(safe-area-inset-top));
  right: max(30px, env(safe-area-inset-right));
  left: max(30px, env(safe-area-inset-left));
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 15px;
  border-bottom: 1px solid rgba(232, 227, 216, .15);
  opacity: 0;
  transform: translateY(-6px);
}

.terrae-territories__folio {
  position: absolute;
  z-index: 7;
  top: 50%;
  left: max(28px, env(safe-area-inset-left));
  display: flex;
  align-items: center;
  gap: 18px;
  color: rgba(232, 227, 216, .36);
  font-size: var(--cv-typo-current-fs, 7px);
  font-style: var(--cv-typo-current-fst, normal);
  font-weight: var(--cv-typo-current-fw, 500);
  letter-spacing: var(--cv-typo-current-ls, .28em);
  opacity: 0;
  transform: translate(-50%, -50%) rotate(-90deg);
  transform-origin: center;
}

.terrae-territories__folio::before {
  content: "";
  width: 44px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(142, 116, 88, .62));
}

.terrae-territories__folio b {
  color: rgba(142, 116, 88, .82);
  font-weight: var(--cv-typo-current-fw, 500);
}

.terrae-territories--running .terrae-territories__folio,
.no-js .terrae-territories__folio {
  animation: terraeTerritoriesFolio 1600ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1)) 3300ms both;
}

.terrae-territories--running .terrae-territories__header,
.no-js .terrae-territories__header {
  animation: terraeTerritoriesInterface 1200ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1)) 500ms both;
}

.terrae-territories__kicker,
.terrae-territories__index {
  margin: 0;
  color: rgba(232, 227, 216, .7);
  font-size: var(--cv-typo-current-fs, 10px);
  font-weight: var(--cv-typo-current-fw, 500);
  line-height: var(--cv-typo-current-lh, 1);
  letter-spacing: var(--cv-typo-current-ls, .31em);
  text-transform: var(--cv-typo-current-tt, uppercase);
}

.terrae-territories__index {
  color: rgba(142, 116, 88, .84);
  font-size: var(--cv-typo-current-fs, 9px);
  letter-spacing: var(--cv-typo-current-ls, .25em);
}

.terrae-territories__expression {
  position: absolute;
  z-index: 7;
  top: 50%;
  right: max(6.8vw, env(safe-area-inset-right));
  width: min(38vw, 520px);
  min-height: 188px;
  text-align: right;
  opacity: 1;
  transform: translateY(-50%);
  transition: opacity 520ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1));
}

body[data-territory-phase="map"] .terrae-territories__expression,
body[data-territory-phase="sectors"] .terrae-territories__expression,
body[data-territory-phase="view"] .terrae-territories__expression,
body[data-territory-phase="outro"] .terrae-territories__expression {
  opacity: 0;
}

.terrae-territories__expression section {
  position: absolute;
  inset: 0;
  opacity: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  opacity: 0;
  filter: blur(.55px);
  transition:
    opacity 520ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1)),
    filter 520ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1));
}

.terrae-territories__expression h2 {
  margin: 12px 0 0;
  color: var(--territory-paper);
  font-family: var(--cv-typo-current-ff, "Bodoni Moda", var(--tc-font-display, Didot, serif));
  font-size: var(--cv-typo-current-fs, clamp(44px, 5.35vw, 78px));
  font-weight: var(--cv-typo-current-fw, 500);
  line-height: var(--cv-typo-current-lh, .94);
  letter-spacing: var(--cv-typo-current-ls, .145em);
  text-shadow: 0 1px rgba(43, 33, 26, .72), 0 18px 44px rgba(8, 9, 7, .34);
}

.terrae-territories__eyebrow,
.terrae-territories__lexicon {
  margin: 0;
  color: rgba(142, 116, 88, .78);
  font-size: var(--cv-typo-current-fs, 8px);
  font-style: var(--cv-typo-current-fst, normal);
  font-weight: var(--cv-typo-current-fw, 500);
  line-height: var(--cv-typo-current-lh, 1.4);
  letter-spacing: var(--cv-typo-current-ls, .3em);
  text-transform: var(--cv-typo-current-tt, uppercase);
}

.terrae-territories__thesis {
  margin: 18px 0 0;
  color: rgba(232, 227, 216, .76);
  font-family: var(--cv-typo-current-ff, "Cormorant Garamond", var(--tc-font-editorial, Georgia, serif));
  font-size: var(--cv-typo-current-fs, clamp(18px, 1.55vw, 23px));
  font-style: var(--cv-typo-current-fst, normal);
  font-weight: var(--cv-typo-current-fw, 400);
  line-height: var(--cv-typo-current-lh, 1.25);
  letter-spacing: var(--cv-typo-current-ls, .018em);
}

.terrae-territories__lexicon {
  margin-top: 22px;
  padding-top: 12px;
  border-top: 1px solid rgba(142, 116, 88, .24);
  color: rgba(232, 227, 216, .42);
  font-size: var(--cv-typo-current-fs, 7px);
  letter-spacing: var(--cv-typo-current-ls, .24em);
}

body[data-territory="firenze"] [data-territory-id="firenze"],
body[data-territory="napoli"] [data-territory-id="napoli"],
body[data-territory="reims"] [data-territory-id="reims"] {
  opacity: 1;
  filter: none;
  transition-duration: 1800ms;
}

body[data-territory="firenze"] [data-territory-id="firenze"] h2 {
  letter-spacing: var(--cv-typo-current-ls, .17em);
}

body[data-territory="napoli"] [data-territory-id="napoli"] h2 {
  letter-spacing: var(--cv-typo-current-ls, .105em);
}

body[data-territory="napoli"] [data-territory-id="napoli"] .terrae-territories__eyebrow,
body[data-territory="napoli"] [data-territory-id="napoli"] .terrae-territories__lexicon {
  letter-spacing: var(--cv-typo-current-ls, .21em);
}

body[data-territory="reims"] [data-territory-id="reims"] h2 {
  letter-spacing: var(--cv-typo-current-ls, .225em);
}

body[data-territory="reims"] [data-territory-id="reims"] .terrae-territories__eyebrow,
body[data-territory="reims"] [data-territory-id="reims"] .terrae-territories__lexicon {
  letter-spacing: var(--cv-typo-current-ls, .34em);
}

.terrae-territories__seal {
  position: absolute;
  z-index: 6;
  inset: 0;
  display: grid;
  place-items: center;
  margin: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity 700ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1));
}

body[data-territory-phase="outro"] .terrae-territories__seal { opacity: 1; }

.terrae-territories__monogram {
  width: clamp(118px, 12vw, 176px);
  height: auto;
  opacity: 0;
  filter: saturate(.68) drop-shadow(0 1px 0 rgba(232, 227, 216, .07)) drop-shadow(0 18px 44px rgba(8, 9, 7, .58));
  transform: scale(.985);
}

.terrae-territories--running .terrae-territories__monogram,
.no-js .terrae-territories__monogram {
  animation: terraeTerritoriesSeal 5800ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1)) 11200ms both;
}

.terrae-territories__caption {
  position: absolute;
  right: max(30px, env(safe-area-inset-right));
  bottom: max(42px, calc(env(safe-area-inset-bottom) + 26px));
  left: max(30px, env(safe-area-inset-left));
  text-align: center;
  opacity: 0;
  transform: translateY(8px);
}

.terrae-territories--running .terrae-territories__caption,
.no-js .terrae-territories__caption {
  animation: terraeTerritoriesCaption 1800ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1)) 14300ms both;
}

.terrae-territories__caption h1 {
  margin: 0;
  color: rgba(232, 227, 216, .84);
  font-family: var(--cv-typo-current-ff, "Cormorant Garamond", var(--tc-font-editorial, Georgia, serif));
  font-size: var(--cv-typo-current-fs, clamp(19px, 2vw, 29px));
  font-style: var(--cv-typo-current-fst, normal);
  font-weight: var(--cv-typo-current-fw, 400);
  line-height: var(--cv-typo-current-lh, 1.24);
  letter-spacing: var(--cv-typo-current-ls, .025em);
  text-shadow: 0 1px 0 rgba(43, 33, 26, .5), 0 8px 28px rgba(8, 9, 7, .65);
}

.terrae-territories__caption p {
  margin: 11px 0 0;
  color: rgba(142, 116, 88, .84);
  font-size: var(--cv-typo-current-fs, 9px);
  font-weight: var(--cv-typo-current-fw, 500);
  line-height: var(--cv-typo-current-lh, 1.4);
  letter-spacing: var(--cv-typo-current-ls, .33em);
  text-transform: var(--cv-typo-current-tt, uppercase);
}

.terrae-territories__signature {
  position: absolute;
  z-index: 7;
  bottom: max(35px, calc(env(safe-area-inset-bottom) + 21px));
  left: max(30px, env(safe-area-inset-left));
  display: flex;
  align-items: center;
  gap: 12px;
  color: rgba(232, 227, 216, .4);
  font-size: var(--cv-typo-current-fs, 7px);
  letter-spacing: var(--cv-typo-current-ls, .23em);
  opacity: 0;
}

.terrae-territories__signature i {
  width: 36px;
  height: 1px;
  background: linear-gradient(90deg, rgba(142, 116, 88, .2), rgba(142, 116, 88, .65), rgba(142, 116, 88, .2));
}

.terrae-territories--running .terrae-territories__signature,
.no-js .terrae-territories__signature {
  animation: terraeTerritoriesInterface 1400ms var(--tc-ease, cubic-bezier(.2, .65, .2, 1)) 3500ms both;
}

@keyframes terraeTerritoriesMatter {
  from { opacity: .16; filter: contrast(1.15) saturate(.44) brightness(.2); transform: scale(1.035); }
  to { opacity: 1; filter: contrast(1.12) saturate(.54) brightness(.54); transform: scale(1); }
}

@keyframes terraeTerritoriesFallbackCycle {
  0%, 100% { background: rgba(16, 36, 29, .12); }
  33.333% { background: rgba(142, 116, 88, .15); }
  66.666% { background: rgba(244, 240, 232, .09); }
}

@keyframes terraeTerritoriesContinuity {
  from { opacity: 0; transform: rotate(-.35deg) scaleX(.2); }
  to { opacity: .48; transform: rotate(-.35deg) scaleX(1); }
}

@keyframes terraeTerritoriesLight {
  0%, 100% { opacity: .2; transform: translate3d(-24%, 4%, 0); }
  33.333% { opacity: .5; transform: translate3d(18%, -2%, 0); }
  66.666% { opacity: .18; transform: translate3d(-5%, 7%, 0); }
}

@keyframes terraeTerritoriesInterface {
  to { opacity: 1; transform: translateY(0); }
}

@keyframes terraeTerritoriesHistorical {
  from { opacity: 0; }
  to { opacity: .7; }
}

@keyframes terraeTerritoriesFolio {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes terraeTerritoriesSeal {
  0% { opacity: 0; transform: scale(.985); }
  66% { opacity: .52; }
  100% { opacity: .68; transform: scale(1); }
}

@keyframes terraeTerritoriesCaption {
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 700px) {
  .terrae-territories__header {
    top: max(22px, env(safe-area-inset-top));
    right: max(20px, env(safe-area-inset-right));
    left: max(20px, env(safe-area-inset-left));
    padding-bottom: 12px;
  }

  .terrae-territories__kicker { font-size: var(--cv-typo-current-fs, 9px); letter-spacing: var(--cv-typo-current-ls, .27em); }

  .terrae-territories__index {
    max-width: 132px;
    font-size: var(--cv-typo-current-fs, 8px);
    line-height: var(--cv-typo-current-lh, 1.35);
    text-align: right;
  }

  .terrae-territories__expression {
    top: 24%;
    right: max(20px, env(safe-area-inset-right));
    left: max(20px, env(safe-area-inset-left));
    width: auto;
    min-height: 150px;
  }

  .terrae-territories__expression section { align-items: center; text-align: center; }
  .terrae-territories__expression h2 { margin-top: 10px; font-size: var(--cv-typo-current-fs, clamp(40px, 13vw, 56px)); letter-spacing: var(--cv-typo-current-ls, .11em); }
  .terrae-territories__eyebrow { font-size: var(--cv-typo-current-fs, 7px); letter-spacing: var(--cv-typo-current-ls, .24em); }
  .terrae-territories__thesis { margin-top: 14px; font-size: var(--cv-typo-current-fs, 17px); }
  .terrae-territories__lexicon { margin-top: 15px; padding-top: 10px; font-size: var(--cv-typo-current-fs, 6px); }
  .terrae-territories__monogram { width: min(37vw, 164px); }

  .terrae-territories__historical {
    top: 40%;
    right: 8%;
    bottom: 17%;
    left: 8%;
    width: auto;
    mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent);
  }

  .terrae-territories__folio { display: none; }

  .terrae-territories__chapter {
    inset: 70px 12px 64px;
  }

  .terrae-territories__plate {
    box-shadow: 0 18px 50px rgba(8, 9, 7, .42), 0 0 0 5px rgba(8, 9, 7, .1);
  }

  .terrae-territories__plate figcaption {
    right: 7px;
    bottom: 7px;
    left: 7px;
    gap: 8px;
    padding: 7px 8px;
    font-size: var(--cv-typo-current-fs, 6px);
    line-height: var(--cv-typo-current-lh, 1.35);
    letter-spacing: var(--cv-typo-current-ls, .055em);
  }

  .terrae-territories__plate figcaption span { max-width: 74%; }
  .terrae-territories__plate figcaption a { letter-spacing: var(--cv-typo-current-ls, .1em); }

  .terrae-territories__plate--panorama picture img {
    width: 100%;
    height: 48%;
    max-height: none;
    object-fit: cover;
    object-position: 50% 52%;
  }

  .terrae-territories__plate--portrait picture img {
    max-width: calc(100% - 12px);
    height: calc(100% - 62px);
    margin-bottom: 26px;
  }

  .terrae-territories__sectors {
    top: auto;
    right: 10px;
    bottom: 58px;
    left: 10px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: auto;
    padding: 13px 14px;
    transform: none;
  }

  .terrae-territories__sectors::before {
    grid-column: 1 / -1;
    margin-bottom: 7px;
    padding-bottom: 7px;
    font-size: var(--cv-typo-current-fs, 6px);
  }

  .terrae-territories__sectors li {
    grid-template-columns: 17px 1fr;
    gap: 3px;
    padding: 4px 3px;
    font-size: var(--cv-typo-current-fs, 10px);
  }

  .terrae-territories__sectors b { font-size: var(--cv-typo-current-fs, 6px); }

  .terrae-territories__caption {
    right: max(20px, env(safe-area-inset-right));
    bottom: max(77px, calc(env(safe-area-inset-bottom) + 61px));
    left: max(20px, env(safe-area-inset-left));
  }

  .terrae-territories__caption h1 {
    max-width: 330px;
    margin-inline: auto;
    font-size: var(--cv-typo-current-fs, clamp(19px, 5.7vw, 24px));
  }

  .terrae-territories__signature {
    right: max(20px, env(safe-area-inset-right));
    bottom: max(26px, calc(env(safe-area-inset-bottom) + 13px));
    left: max(20px, env(safe-area-inset-left));
    justify-content: center;
    font-size: var(--cv-typo-current-fs, 6px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .terrae-territories *,
  .terrae-territories *::before,
  .terrae-territories *::after {
    animation-duration: 200ms !important;
    animation-delay: 0ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 200ms !important;
    scroll-behavior: auto !important;
  }

  .terrae-territories__fallback,
  .terrae-territories__fallback-material,
  .terrae-territories__fallback-topography,
  .terrae-territories__fallback-roots,
  .terrae-territories__header,
  .terrae-territories__continuity,
  .terrae-territories__monogram,
  .terrae-territories__caption,
  .terrae-territories__signature {
    opacity: 1;
  }

  .terrae-territories__header,
  .terrae-territories__monogram,
  .terrae-territories__caption {
    transform: none;
  }

  .terrae-territories__light { display: none; }

  .terrae-territories__plate picture img,
  .terrae-territories__plate--view picture img {
    transform: none;
  }
}
