.univers-page { min-width: 320px; background: var(--paper); }

.univers-canvas {
  position: relative;
  isolation: isolate;
  container-type: inline-size;
  width: min(100%, var(--page-max-width));
  margin-inline: auto;
  overflow: hidden;
  background: var(--paper) url("assets/papier-ivoire.webp") center / cover no-repeat;
}

.univers-section { position: relative; width: 100%; overflow: hidden; }
.univers-section::after {
  position: absolute;
  z-index: 4;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  content: "";
  background: rgba(150, 48, 19, .38);
}
.univers-art { position: absolute; z-index: 0; top: 0; left: 0; display: block; width: 100%; height: auto; max-width: none; pointer-events: none; }
.univers-hero { height: 44.9306cqw; }
.univers-past { height: 30.1389cqw; }
.univers-mind { height: 32.8472cqw; }
.univers-society { height: 32.3611cqw; }
.univers-explore { height: 30.4861cqw; }
.univers-past .univers-art { top: -6.3889cqw; }
.univers-mind .univers-art { top: -5cqw; }
.univers-society .univers-art { top: -5.2778cqw; }
.univers-explore .univers-art { top: -6.1806cqw; }

.univers-header { position: absolute; z-index: 5; inset: 0 0 auto; height: 7.5cqw; pointer-events: none; }
.univers-wordmark {
  position: absolute;
  top: 1.5278cqw;
  left: 4.6528cqw;
  display: flex;
  flex-direction: column;
  color: var(--ink);
  font-family: var(--signature);
  font-weight: 400;
  text-decoration: none;
  pointer-events: auto;
}
.univers-wordmark span { font-size: 1.875cqw; line-height: .78; letter-spacing: .02em; }
.univers-wordmark strong { font-size: 3.2639cqw; font-weight: 400; line-height: .85; letter-spacing: -.5px; }
.univers-signature-rule { position: absolute; top: 4.3056cqw; left: 22.5694cqw; width: 4.5833cqw; height: 1px; background: rgba(158, 117, 82, .55); }
.univers-nav {
  position: absolute;
  top: 2.7083cqw;
  left: 29.0972cqw;
  display: flex;
  align-items: flex-start;
  gap: 1.7cqw;
  color: var(--ink);
  font-family: var(--display);
  font-size: clamp(16px, 1.3194cqw, 19px);
  font-weight: 500;
  line-height: 1.35;
  white-space: nowrap;
  pointer-events: auto;
}
.univers-nav a, .univers-nav span { position: relative; text-decoration: none; }
.univers-nav .current { color: var(--rust); }
.univers-nav .current::after { position: absolute; right: 0; bottom: -.52em; left: 0; height: 1.5px; content: ""; background: currentColor; }
.univers-nav a:focus-visible, .univers-wordmark:focus-visible, .univers-footer a:focus-visible { outline: 2px solid var(--rust); outline-offset: 5px; }

.univers-hero-copy { position: absolute; z-index: 2; inset: 0; pointer-events: none; }
.univers-hero-copy > * { position: absolute; margin: 0; }
.univers-kicker, .univers-themes {
  color: var(--rust);
  font-family: "DM Sans", Arial, sans-serif;
  font-size: .9028cqw;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.univers-kicker { top: 10.3472cqw; left: 9.7917cqw; }
.univers-kicker::before { position: absolute; top: 50%; right: calc(100% + 1.3194cqw); width: 3.75cqw; height: 1.5px; content: ""; background: var(--copper); }
.univers-hero-copy h1 {
  top: 12.7083cqw;
  left: 4.5139cqw;
  color: var(--ink);
  font-family: var(--display);
  font-size: 8.75cqw;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -.025em;
}
.univers-hero-copy h1 span, .univers-chapter h2 span, .univers-explore h2 span { color: var(--rust); }
.univers-hero-first, .univers-hero-second {
  left: 4.6528cqw;
  width: 43cqw;
  color: var(--ink);
  font-family: var(--serif);
  font-size: 1.5278cqw;
  line-height: 1.36;
}
.univers-hero-first { top: 23.75cqw; }
.univers-hero-second { top: 30.6944cqw; }
.univers-themes { top: 40.6944cqw; left: 4.6528cqw; white-space: nowrap; }
.univers-themes::before { position: absolute; top: -1.3889cqw; left: 0; width: 3.8194cqw; height: 1px; content: ""; background: var(--copper); }
.univers-themes span { padding: 0 1em; }

.univers-chapter::before, .univers-explore::before {
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 0;
  left: 0;
  width: 47.9167cqw;
  content: "";
  background: linear-gradient(90deg, rgba(248, 243, 235, .96), rgba(248, 243, 235, .82) 50%, rgba(248, 243, 235, 0));
  pointer-events: none;
}
.univers-chapter-copy, .univers-explore-copy { position: absolute; z-index: 2; inset: 0; }
.univers-button { width: 376px; max-width: 100%; min-height: 56px; }
.univers-chapter-copy > *, .univers-explore-copy > * { position: absolute; margin: 0; }
.univers-number { top: 1.7361cqw; left: 5cqw; color: var(--rust); font-family: var(--display); font-size: 1.6667cqw; font-weight: 600; line-height: 1.45; }
.univers-number::after { position: absolute; top: 1.5278cqw; left: 3.8889cqw; width: 5.2083cqw; height: 1px; content: ""; background: rgba(150, 48, 19, .74); }
.univers-chapter h2, .univers-explore h2 {
  left: 5cqw;
  color: var(--ink);
  font-family: var(--display);
  font-size: 3.8889cqw;
  font-weight: 600;
  line-height: 1.035;
  letter-spacing: -.018em;
}
.univers-chapter h2 { top: 5.1389cqw; width: 43cqw; }
.univers-body, .univers-explore-copy p {
  left: 5cqw;
  width: 38.0556cqw;
  color: var(--ink);
  font-family: var(--serif);
  font-size: 1.4583cqw;
  line-height: 1.286;
}
.univers-past .univers-body { top: 10.4861cqw; }
.univers-mind .univers-body { top: 14.375cqw; }
.univers-society .univers-body { top: 14.0278cqw; }
.univers-past .univers-button { top: 20.4167cqw; left: 5cqw; }
.univers-mind .univers-button { top: 24.3056cqw; left: 5cqw; }
.univers-society .univers-button { top: 24.2361cqw; left: 5cqw; }

.univers-explore::before { width: 54.1667cqw; background: linear-gradient(90deg, rgba(248, 243, 235, .94), rgba(248, 243, 235, .84) 72%, rgba(248, 243, 235, 0)); }
.univers-explore h2 { top: 3.0556cqw; width: 48cqw; font-size: 3.9583cqw; }
.univers-explore-copy p { top: 8.75cqw; width: 37.1528cqw; }
.univers-explore .univers-button { top: 19.5833cqw; left: 5cqw; }

.univers-footer {
  position: relative;
  display: grid;
  min-height: 7.2222cqw;
  grid-template-columns: 30% 22% 26% 22%;
  align-items: center;
  padding: 0 3.75cqw;
  color: var(--ink);
  background: rgba(250, 245, 236, .55);
  font-family: var(--serif);
  font-size: .8333cqw;
  line-height: 1.4;
}
.univers-footer p { margin: 0; }
.univers-footer a { position: relative; display: flex; align-items: center; justify-content: space-between; min-height: 3.0556cqw; padding-left: 4.8611cqw; color: var(--ink); font-weight: 600; letter-spacing: .05em; text-decoration: none; text-transform: uppercase; white-space: nowrap; }
.univers-footer a::before { position: absolute; top: 0; bottom: 0; left: 0; width: 1px; content: ""; background: rgba(158, 117, 82, .25); }
.univers-footer a img:last-child { flex: 0 0 14px; margin-left: 1em; }
.univers-footer-facebook { gap: .65em; }
.univers-footer .facebook-disc { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; transform: none; }
.univers-footer .facebook-disc b { transform: translate(-1px, -1px); color: var(--paper); font-family: "DM Sans", Arial, sans-serif; font-size: 23px; }

@media (max-width: 1100px) {
  .univers-canvas { width: 100%; }
  .univers-section { display: flex; height: auto; flex-direction: column; }
  .univers-section::after { background: rgba(150, 48, 19, .38); }
  .univers-header { position: relative; order: 0; inset: auto; display: flex; min-height: 105px; align-items: flex-start; padding: 17px clamp(20px, 5vw, 54px) 14px; }
  .univers-wordmark { position: relative; top: auto; left: auto; flex: 0 0 auto; }
  .univers-wordmark span { font-size: 16px; }.univers-wordmark strong { font-size: 30px; }
  .univers-signature-rule { display: none; }
  .univers-nav { position: relative; top: auto; left: auto; max-width: calc(100% - 260px); gap: clamp(17px, 2.4vw, 30px); margin: 13px 0 0 auto; overflow-x: auto; padding: 0 1px 9px; font-size: 16px; scrollbar-width: thin; scrollbar-color: rgba(150, 48, 19, .35) transparent; }
  .univers-art, .univers-past .univers-art, .univers-mind .univers-art, .univers-society .univers-art, .univers-explore .univers-art { position: relative; order: 2; top: auto; left: auto; width: 100%; height: clamp(270px, 45vw, 480px); object-fit: cover; object-position: right center; }
  .univers-hero .univers-art { object-position: 68% center; }
  .univers-chapter::before, .univers-explore::before { display: none; }
  .univers-hero-copy, .univers-chapter-copy, .univers-explore-copy { position: relative; order: 1; inset: auto; padding: 34px clamp(24px, 6vw, 68px) 40px; background: rgba(250, 245, 236, .92); }
  .univers-section .univers-hero-copy > *,
  .univers-section .univers-chapter-copy > *,
  .univers-section .univers-explore-copy > * { position: relative; inset: auto; }
  .univers-kicker, .univers-themes { font-size: 11px; }
  .univers-kicker { margin-left: 54px; }
  .univers-kicker::before { right: calc(100% + 12px); width: 42px; }
  .univers-hero-copy h1 { margin: 19px 0 10px; font-size: clamp(80px, 10vw, 120px); }
  .univers-hero-first, .univers-hero-second { width: min(650px, 100%); margin-top: 13px; font-size: clamp(19px, 2.3vw, 24px); line-height: 1.35; }
  .univers-themes { margin-top: 34px; line-height: 1.8; white-space: normal; }
  .univers-themes::before { top: -17px; width: 50px; }
  .univers-desktop-break { display: none; }
  .univers-number { font-size: 24px; }
  .univers-number::after { top: 22px; left: 56px; width: 75px; }
  .univers-chapter h2, .univers-explore h2 { width: min(760px, 100%); margin-top: 12px; font-size: clamp(48px, 6vw, 70px); line-height: 1; }
  .univers-body, .univers-explore-copy p { width: min(610px, 100%); margin-top: 18px; font-size: clamp(19px, 2.2vw, 23px); line-height: 1.34; }
  .univers-past .univers-button, .univers-mind .univers-button, .univers-society .univers-button, .univers-explore .univers-button { margin-top: 22px; }
  .univers-explore h2 { margin-top: 0; }
  .univers-explore-copy p { margin-top: 18px; }
  .univers-footer { min-height: 110px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 24px; padding: 24px clamp(24px, 6vw, 68px); font-size: 13px; }
  .univers-footer p { grid-column: 1 / -1; }
  .univers-footer a { min-height: 30px; padding-left: 0; }
  .univers-footer a::before { display: none; }
}

@media (max-width: 620px) {
  .univers-header { display: block; min-height: 112px; padding: 15px 20px 0; }
  .univers-wordmark span { font-size: 14px; }.univers-wordmark strong { font-size: 27px; }
  .univers-nav { width: calc(100vw - 40px); max-width: none; gap: 21px; margin: 14px 0 0; font-size: 15px; }
  .univers-hero-copy, .univers-chapter-copy, .univers-explore-copy { padding: 25px 22px 32px; }
  .univers-hero-copy h1 { font-size: clamp(72px, 18vw, 105px); }
  .univers-hero-first, .univers-hero-second { font-size: 19px; }
  .univers-hero-first { min-height: 5.4em; }
  .univers-hero-second { min-height: 6.75em; }
  .univers-themes { font-size: 10px; letter-spacing: .08em; }
  .univers-themes span { padding: 0 .4em; }
  .univers-chapter h2, .univers-explore h2 { font-size: clamp(43px, 12vw, 58px); }
  .univers-body, .univers-explore-copy p { font-size: 19px; }
  .univers-art, .univers-past .univers-art, .univers-mind .univers-art, .univers-society .univers-art, .univers-explore .univers-art { height: 300px; }
  .univers-hero .univers-art { height: 310px; }
  .univers-footer { grid-template-columns: 1fr; gap: 15px; padding: 24px 22px 30px; font-size: 12px; }
  .univers-footer p { grid-column: auto; order: 4; }
  .univers-footer-facebook { order: 1; }
  .univers-footer a:nth-of-type(2) { order: 2; }
  .univers-footer a:nth-of-type(3) { order: 3; }
}

@media(min-width:1101px) {
 .univers-canvas > main { padding-top:5.6011cqw; }
 .univers-hero-copy h1 { font-size:9.9306cqw; }
 .univers-hero-first,.univers-hero-second { font-size:1.5972cqw; }
 .univers-number { font-size:2.1528cqw; }
}
.univers-hero::after { background:rgba(150,48,19,.62); }

@media (max-width: 400px) {
  .univers-button { min-height: 72px; }
}
