/*
Theme Name: Sensophie
Theme URI: https://sensophie.de/
Author: Sensophie
Description: Individuelles WordPress-Theme für Sensophie.
Version: 2.1.0
Text Domain: sensophie
*/

@font-face {
  font-family: "Cormorant Garamond";
  src: url("fonts/cormorant-garamond-light.woff2") format("woff2");
  font-style: normal;
  font-weight: 300;
  font-display: swap;
}
@font-face {
  font-family: "Cormorant Garamond";
  src: url("fonts/cormorant-garamond-ligh-italic.woff2") format("woff2");
  font-style: italic;
  font-weight: 300;
  font-display: swap;
}
@font-face {
  font-family: "Cormorant Garamond";
  src: url("fonts/cormorant-garamond-regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Cormorant Garamond";
  src: url("fonts/cormorant-garamond-semiBold.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Montserrat";
  src: url("fonts/montserrat-thin.woff2") format("woff2");
  font-style: normal;
  font-weight: 100;
  font-display: swap;
}
@font-face {
  font-family: "Montserrat";
  src: url("fonts/montserrat-regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Montserrat";
  src: url("fonts/montserrat-semiBold.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Allura";
  src: url("fonts/Allura-Regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root {
  --stage: 1500px;
  --axis-outer: 1300px;
  --axis-copy: 1120px;
  --axis-text: 900px;
  --page-pad: clamp(24px, 4.7vw, 70px);
  --wine: #3d1e1e;
  --red: #4a1e1e;
  --brown: #825538;
  --blue: #8995a7;
  --rose: #dfd3d3;
  --dust: #b69e94;
  --stone: #d9d0cb;
  --cream: #f8f2ec;
  --cream-deep: #ebdfd3;
  --wesen-bg: #f1e7e7;
  --white: #fff;
  --serif: "Cormorant Garamond", Georgia, serif;
  --sans: "Montserrat", Arial, sans-serif;
  --script: "Allura", cursive;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: clip; }
body {
  margin: 0;
  color: var(--wine);
  background: var(--cream);
  font-family: var(--serif);
  font-size: clamp(18px, 1.35vw, 22px);
  font-weight: 300;
  line-height: 1.32;
  overflow-x: clip;
}
body.page-wesen { background: var(--wesen-bg); }
body.menu-is-open { overflow: hidden; }
img, picture, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
p { margin: 0 0 1em; }
ul { margin: .3em 0 1em; padding-left: 1.05em; }
h1, h2, h3 { margin: 0; font-weight: 400; line-height: 1.04; }
address { font-style: normal; }
.main { width: 100%; position: relative; }
.axis-stage,
.section-pad,
.content-row,
.stage {
  position: relative;
  width: min(100%, var(--stage));
  margin-inline: auto;
}
.mobile-only, .mobile-break { display: none; }

/* Header: the stage guides alignment but never clips artwork. */
.site-header { position: relative; z-index: 100; width: 100%; }
.site-header__stage {
  width: min(100%, 1250px);
  min-height: 92px;
  margin-inline: auto;
  padding: 19px 28px 14px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: start;
}
.site-brand {
  justify-self: start;
  color: #392323;
  font-family: var(--sans);
  font-size: 32px;
  letter-spacing: 0;
}
.site-nav { justify-self: center; align-self: center; }
.primary-menu, .footer-menu { list-style: none; padding: 0; margin: 0; }
.primary-menu { display: flex; gap: 32px; font-family: var(--sans); }
.primary-menu a {
  position: relative;
  font-size: 20px;
  white-space: nowrap;
}
.primary-menu a::after {
  content: "";
  position: absolute;
  height: 1px;
  inset: auto 50% -4px;
  background: currentColor;
  transition: inset .25s ease;
}
.primary-menu a:hover::after,
.primary-menu a:focus-visible::after,
.primary-menu a[aria-current="page"]::after { inset-inline: 0; }
.header-cta {
  justify-self: end;
  width: 235px;
  padding: 14px 20px 12px;
  border: 1px solid #392323;
  border-radius: 999px;
  text-align: center;
  font-family: var(--sans);
  font-size: 18px;
  letter-spacing: 0;
}
.header-cta:hover, .header-cta:focus-visible { background: rgba(255,255,255,.35); }
.menu-trigger { display: none; }
.mobile-menu-contact { display: none; }

/* Shared footer */
.site-footer { position: relative; width: 100%; }
.site-footer__stage {
  width: min(100%, 1250px);
  min-height: 510px;
  margin-inline: auto;
  padding: 120px var(--page-pad) 60px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 32px;
  font-family: var(--sans);
}
.footer-mark { width: 84px; }
.footer-menu { display: flex; flex-direction: column; align-items: center; gap: 20px; font-size: 18px; }
.footer-copy { margin: 0; font-size: 15px; }
.footer-top { width: 41px; margin-top: 16px; }
.footer-top img { width: 100%; }

/* Reusable editorial elements */
.page-hero { text-align: center; padding-inline: var(--page-pad); }
.page-hero h1 { font-size: clamp(52px, 5vw, 78px); }
.page-hero h1 span,
.bottom-cta h2 span { font-family: var(--script); font-weight: 400; }
.page-hero > p { max-width: 980px; margin: 70px auto 0; font-size: clamp(20px, 1.7vw, 27px); }
.graphic-cta { display: block; }
.graphic-cta img { width: 100%; }
.photo-blob img { width: 100%; height: 100%; object-fit: contain; }

/* Ankommen */
.home-hero {
  min-height: 1000px;
  padding: 40px var(--page-pad) 120px;
  text-align: center;
}
.hero-logo { width: min(390px, 34vw); margin: 0 auto 110px; }
.hero-title--home {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: clamp(50px, 5vw, 76px);
  font-weight: 600;
}
.hero-title--home em {
  color: #702323;
  font-family: var(--script);
  font-size: 1.38em;
  font-style: normal;
  font-weight: 400;
  margin-inline: .06em;
}
.hero-subline-wrap { margin-top: 38px; }
.hero-subline { font-size: clamp(22px, 2vw, 31px); }
.hero-subline span { color: var(--blue); }
.hero-note {
  width: 430px;
  margin: 105px 28% 0 auto;
  text-align: right;
  font-size: 18px;
}
.hero-note > span { display: block; width: 1px; height: 165px; margin-left: auto; background: var(--stone); }
.stage-home-intro { min-height: 1600px; }
.blob-card { position: absolute; }
.blob-card > picture > img { width: 100%; }
.blob-card > div {
  position: absolute;
  z-index: 2;
  inset: 20% 18%;
}
.blob-card h2 { margin-bottom: .7em; font-size: clamp(34px, 3vw, 48px); font-weight: 600; }
.home-card-design { width: 735px; left: 7%; top: 40px; }
.home-card-design > div { inset: 28% 19% 18%; }
.home-card-clarity { width: 485px; right: 8%; top: 200px; text-align: center; }
.home-card-clarity > div { inset: 49% 17% 12%; }
.home-card-clarity h2 { font-size: 38px; }
.cta-home-understand {
  position: absolute;
  z-index: 3;
  width: 215px;
  top: 28%;
  right: 8%;
}
.home-card-senso { width: 480px; left: 8%; top: 820px; color: var(--white); }
.home-card-senso > div { inset: 20% 18%; }
.home-card-sophie { width: 820px; right: 6%; top: 880px; color: var(--white); text-align: center; }
.home-card-sophie > div { inset: 23% 15%; }
.home-wordmark { font-size: clamp(55px, 5.5vw, 82px) !important; }
.home-wordmark span:last-child { font-weight: 300; }
.home-card-senso .mini { font-size: 17px; }
.home-card-shadow { position: absolute; width: 550px; right: 1%; top: 1090px; opacity: .26; z-index: -1; }

/* Eintauchen */
.page-hero--eintauchen { padding-top: 120px; min-height: 690px; }
.content-row {
  max-width: var(--axis-copy);
  padding-inline: 30px;
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  align-items: center;
  gap: 110px;
}
.photo-blob--drop { width: 430px; }
.eintauchen-perception article { max-width: 490px; }
.eintauchen-perception h2,
.clarify-copy h2,
.design-copy h2 { margin-bottom: 1em; font-style: italic; font-size: 31px; font-weight: 600; }
.stage-eintauchen-mid { min-height: 1080px; margin-top: 210px; }
.eintauchen-bg-left,
.eintauchen-bg-right { position: absolute; z-index: -1; pointer-events: none; }
.eintauchen-bg-left { width: 780px; left: -100px; top: 80px; opacity: .55; }
.eintauchen-bg-right { width: 600px; right: -30px; top: 350px; opacity: .54; }
.clarify-copy { position: absolute; width: 460px; left: 10%; top: 15px; }
.red-sentence { position: absolute; width: 410px; right: 12%; top: 90px; color: #fff; text-align: center; }
.red-sentence p {
  position: absolute;
  inset: 24% 14%;
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
  font-size: 24px;
  font-style: italic;
}
.red-sentence .rs-sans { font-family: var(--sans); font-size: .62em; font-style: normal; letter-spacing: .2em; }
.analysis-columns {
  position: absolute;
  left: 10%;
  top: 330px;
  width: 610px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 70px;
}
.analysis-columns h3 { font-family: var(--sans); font-size: 17px; letter-spacing: .19em; margin-bottom: 1.1em; }
.analysis-columns em { font-weight: 600; }
.eintauchen-design { min-height: 1160px; padding-inline: max(var(--page-pad), calc((100% - var(--axis-outer)) / 2)); }
.design-copy { display: grid; grid-template-columns: 1fr 1fr; gap: 180px; align-items: end; }
.design-copy__right { text-align: right; }
.large-whisper {
  position: relative;
  z-index: -1;
  margin: -30px auto 80px;
  color: #fff;
  text-align: center;
  font-size: clamp(48px, 5.4vw, 80px);
  font-style: italic;
  line-height: 1.08;
}
.center-text { max-width: 970px; margin: 0 auto 100px; text-align: center; }
.design-elements { width: 670px; margin: 0 auto; }
.bottom-cta--eintauchen {
  position: relative;
  width: min(100%, var(--stage));
  min-height: 560px;
  margin-inline: auto;
  padding: 145px 18%;
  overflow: visible;
  border-radius: 80px 0 80px 0;
  background: var(--red);
  color: #fff;
}
.bottom-cta h2 { font-size: clamp(52px, 5vw, 76px); }
.bottom-cta .graphic-cta { position: absolute; width: 375px; right: 9%; bottom: 95px; }

/* Wirken */
.page-hero--wirken { padding-top: 110px; min-height: 860px; }
.page-hero--wirken h1 span { color: var(--brown); font-size: 1.35em; }
.wirken-offers { min-height: 1330px; padding-top: 360px; }
.photo-blob--butterfly {
  position: absolute;
  z-index: 2;
  width: 590px;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
.offer-grid {
  width: min(calc(100% - 120px), var(--axis-outer));
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 36px;
}
.offer-card { min-height: 720px; padding: 215px 45px 65px; border-radius: 30px; }
.offer-card h2, .agreement h2, .process > h2 { margin-bottom: 1.5em; color: var(--brown); font-size: 31px; font-style: italic; font-weight: 600; }
.offer-card--rose { background: var(--cream-deep); }
.offer-card--white { background: #fff; }
.offer-card--beige { background: #e7e1df; }
.agreement { max-width: var(--axis-copy); padding: 210px var(--page-pad); text-align: center; }
.agreement p { font-size: 22px; }
.process { min-height: 1425px; padding: 80px var(--page-pad) 0; }
.process > h2 { text-align: center; }
.process-list-wrap { position: relative; z-index: 2; width: min(100%, 1120px); margin: 100px auto 0; }
.process-list article { display: grid; grid-template-columns: 110px 1fr; align-items: center; margin-bottom: 48px; }
.process-list article > span {
  width: 82px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 58% 42% 49% 51% / 48% 56% 44% 52%;
  background: var(--brown);
  color: #fff;
  font-style: italic;
  font-size: 25px;
}
.process-list h3 { font-family: var(--sans); font-size: 16px; letter-spacing: .17em; }
.process-photo-cta { position: absolute; z-index: 1; width: 930px; right: -70px; bottom: -120px; }
.process-photo-cta > picture img { width: 100%; }
.graphic-cta--on-photo { position: absolute; width: 310px; right: 14%; top: 45%; }

/* Wesen */
.page-hero--wesen { min-height: 1050px; padding-top: 120px; text-align: left; }
.page-hero--wesen h1 { width: 780px; margin: 0 auto; text-align: center; }
.page-hero--wesen h1 span { display: block; color: #702323; font-size: 1.25em; }
.page-hero--wesen > p { position: absolute; left: 15%; top: 560px; margin: 0; text-align: center; font-style: italic; }
.wesen-portrait { position: absolute; width: 680px; right: 4%; top: 330px; }
.wesen-portrait img { width: 100%; }
.wesen-blobs { min-height: 3545px; }
.text-blob { position: absolute; width: 720px; }
.text-blob picture img { width: 100%; }
.text-blob > div {
  position: absolute;
  z-index: 2;
  inset: 23% 15%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.text-blob--rose { top: 0; left: 3%; }
.text-blob--beige { top: 520px; right: 3%; text-align: right; }
.text-blob--altrosa { top: 1080px; left: 3%; }
.text-blob--brown { top: 1620px; right: 3%; color: #fff; text-align: center; }
.wesen-contact { top: 2220px; left: 3%; color: #fff; }
.wesen-contact h2 { margin-bottom: .7em; font-size: 34px; font-style: italic; font-weight: 600; }
.wesen-contact .graphic-cta { width: 220px; margin: 25px auto 0; }

/* Legal, generic and error pages */
.legal-page { position: relative; min-height: 1200px; padding: 120px var(--page-pad); }
.legal-content, .generic-content { position: relative; z-index: 2; width: min(100%, 900px); margin-inline: auto; }
.legal-content h1, .generic-content h1 { margin-bottom: 1.5em; font-size: clamp(48px, 5vw, 72px); }
.legal-content h2 { margin: 2.2em 0 .8em; font-size: 30px; font-style: italic; font-weight: 600; }
.legal-content a { text-decoration: underline; text-underline-offset: .15em; }
.legal-content address { margin: 2em 0; }
.legal-blob { position: absolute; z-index: 0; width: 700px; opacity: .12; pointer-events: none; }
.legal-blob--one { left: -100px; top: 180px; }
.legal-blob--two { right: -120px; top: 740px; }
.generic-page { min-height: 900px; padding: 120px var(--page-pad); }
.error-page { min-height: 900px; display: grid; place-items: center; padding: 100px var(--page-pad); }
.error-page__blob { position: absolute; width: min(78vw, 720px); aspect-ratio: 1.05; background: var(--rose); border-radius: 56% 44% 48% 52% / 45% 56% 44% 55%; }
.error-page__content { position: relative; z-index: 2; max-width: 520px; text-align: center; }
.error-page__code { font-family: var(--sans); letter-spacing: .2em; }
.error-page h1 { margin-bottom: .7em; font-size: 52px; }
.text-link { display: inline-block; margin-top: 25px; font-family: var(--sans); font-size: 13px; letter-spacing: .16em; }

/* Mid-sized windows: keep artwork complete and move it onto outer axes. */
@media (max-width: 1180px) and (min-width: 768px) {
  :root { --page-pad: clamp(35px, 5vw, 60px); }
  .site-header__stage { grid-template-columns: 1fr auto 1fr; }
  .header-cta { min-width: 170px; }
  .primary-menu { gap: 22px; }
  .home-card-design { width: 61vw; left: 3%; }
  .home-card-clarity { width: 41vw; right: 2%; }
  .home-card-senso { width: 41vw; left: 3%; }
  .home-card-sophie { width: 67vw; right: 1%; }
  .content-row { gap: 45px; }
  .photo-blob--drop { width: min(42vw, 430px); }
  .offer-grid { width: calc(100% - 60px); gap: 20px; }
  .offer-card { padding-inline: 28px; }
  .page-hero--wesen > p { left: 7%; }
  .wesen-portrait { width: 58vw; right: 1%; }
  .text-blob { width: 61vw; }
}

/* Mobile composition is intentionally distinct from desktop. */
@media (max-width: 699px) {
  .site-header__stage { min-height: 65px; padding: 23px 16px 12px; display: flex; justify-content: space-between; align-items: flex-start; }
  .site-brand { display: block; font-size: 18px; }
  .header-cta { display: none; }
  .menu-trigger {
    position: relative;
    z-index: 102;
    display: block;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font-family: var(--sans);
    font-size: 15px;
  }
  .menu-trigger__close { display: none; }
  .menu-trigger[aria-expanded="true"] .menu-trigger__open { display: none; }
  .menu-trigger[aria-expanded="true"] .menu-trigger__close { display: inline; }
  .site-nav {
    position: fixed;
    z-index: 101;
    inset: 0;
    padding: 120px 32px 60px;
    display: grid;
    place-items: center;
    background: rgba(248,242,236,.98);
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s ease, visibility .25s ease;
  }
  body.page-wesen .site-nav { background: rgba(241,231,231,.98); }
  .site-nav.is-open { opacity: 1; visibility: visible; }
  .primary-menu { flex-direction: column; align-items: center; gap: 32px; }
  .primary-menu a { font-size: 35px; }
  .mobile-menu-contact { display: block; margin-top: 40px; font-family: var(--sans); font-size: 22px; text-decoration: underline; text-underline-offset: .25em; }
}

@media (max-width: 767px) {
  :root { --page-pad: 23px; }
  body { font-size: clamp(16px, 4.15vw, 18px); }
  .mobile-only, .mobile-break { display: initial; }
  .page-hero h1 { font-size: clamp(41px, 12vw, 57px); }
  .page-hero > p { margin-top: 42px; font-size: 18px; }

  .home-hero { min-height: 1070px; padding: 5px 18px 60px; }
  .hero-logo { width: 75vw; margin-bottom: 75px; }
  .hero-title--home { font-size: clamp(40px, 11vw, 52px); line-height: .93; }
  .hero-title--home span { display: contents; }
  .hero-title--home em { display: block; margin: .05em 0 -.02em; font-size: 1.24em; }
  .hero-subline-wrap { margin-top: 85px; }
  .hero-subline { width: 82%; margin-inline: auto; font-size: 20px; line-height: 1.1; }
  .hero-note { width: 75%; margin: 80px 0 0 auto; padding-right: 18px; font-size: 16px; }
  .hero-note > span { height: 100px; }
  .stage-home-intro { min-height: 0; padding-top: 610px; display: flex; flex-direction: column; align-items: center; }
  .blob-card { position: relative; inset: auto !important; }
  .blob-card > div { font-size: 15px; }
  .blob-card h2 { font-size: 31px; }
  .home-card-design { width: 112%; margin-left: -8%; }
  .home-card-design > div { inset: 23% 20% 15% 22%; }
  .home-card-clarity { width: 118%; margin: 5% -8% 0 0; }
  .home-card-clarity > div { inset: 49% 26% 13% 18%; }
  .home-card-clarity h2 { font-size: 29px; }
  .cta-home-understand { width: 180px; top: 29%; right: 22%; }
  .home-card-senso { width: 112%; margin: 4% 0 0 -8%; }
  .home-card-senso > div { inset: 20% 22% 15% 23%; }
  .home-card-sophie { width: 112%; margin: 3% -6% 0 0; }
  .home-card-sophie > div { inset: 25% 20%; }
  .home-wordmark { font-size: 55px !important; }
  .home-card-shadow { display: none; }

  .page-hero--eintauchen { min-height: 640px; padding: 70px 30px 30px; }
  .page-hero--eintauchen h1 span { display: block; }
  .content-row { padding: 0 23px 260px; display: flex; flex-direction: column; gap: 90px; align-items: flex-start; }
  .photo-blob--drop { width: 78%; margin-inline: auto; }
  .eintauchen-perception article { max-width: 72%; }
  .eintauchen-perception h2, .clarify-copy h2, .design-copy h2 { font-size: 27px; }
  .stage-eintauchen-mid { min-height: 1608px; margin-top: 130px; }
  .eintauchen-bg-left { width: 145%; left: -65%; top: 280px; }
  .eintauchen-bg-right { width: 135%; right: -65%; top: 600px; }
  .clarify-copy { position: relative; inset: auto; width: 72%; margin-left: 23px; }
  .red-sentence { width: 58%; right: 8%; top: 190px; }
  .red-sentence p { font-size: 17px; }
  .analysis-columns { left: 23px; top: 500px; width: calc(100% - 46px); gap: 15px; }
  .analysis-columns article:last-child { margin-top: 160px; text-align: right; }
  .analysis-columns h3 { font-size: 13px; }
  .eintauchen-design { min-height: 1760px; padding: 80px 23px 0; }
  .design-copy { display: block; }
  .design-copy__left { max-width: 74%; }
  .design-copy__right { max-width: 64%; margin: 65px 0 0 auto; }
  .large-whisper { margin: -5px -25px 45px; font-size: 39px; }
  .center-text { max-width: 75%; margin-right: 0; font-size: 15px; }
  .design-elements { width: 180px; }
  .bottom-cta--eintauchen { min-height: 440px; padding: 100px 24px; border-radius: 54px 0 54px 0; }
  .bottom-cta h2 { font-size: 48px; }
  .bottom-cta .graphic-cta { width: 235px; right: 10%; bottom: 65px; }

  .page-hero--wirken { min-height: 720px; padding: 65px 35px 20px; }
  .page-hero--wirken > p { width: 78%; }
  .wirken-offers { min-height: 0; padding: 270px 16px 0; }
  .photo-blob--butterfly { width: 80%; }
  .offer-grid { width: 100%; display: block; }
  .offer-card { min-height: 590px; margin-bottom: 34px; padding: 155px 28px 65px; border-radius: 18px; }
  .offer-card h2 { font-size: 27px; }
  .agreement { padding: 185px 35px; }
  .agreement p { font-size: 16px; }
  .process { min-height: 1080px; padding: 45px 23px 0; }
  .process > h2 { width: 70%; text-align: left; font-size: 29px; }
  .process-list-wrap { margin-top: 70px; }
  .process-list article { grid-template-columns: 1fr 75px; align-items: start; margin-bottom: 60px; }
  .process-list article > span { grid-column: 2; grid-row: 1; width: 68px; }
  .process-list article > div { grid-column: 1; grid-row: 1; padding-top: 15px; }
  .process-list h3 { font-size: 12px; }
  .process-photo-cta { width: 120%; right: -22%; bottom: -40px; }
  .graphic-cta--on-photo { width: 210px; right: 26%; top: 38%; }

  .page-hero--wesen { min-height: 1155px; padding: 75px 0 0; }
  .page-hero--wesen h1 { width: 78%; }
  .page-hero--wesen > p { display: none; }
  .wesen-portrait { width: 135%; max-width: none; right: -18%; top: 330px; }
  .wesen-blobs { min-height: 0; padding-top: 180px; display: flex; flex-direction: column; align-items: center; }
  .text-blob { position: relative; inset: auto !important; width: 120%; }
  .text-blob > div { font-size: 15px; }
  .text-blob--rose { margin: 180px 0 180px -17%; }
  .text-blob--rose > div { inset: 21% 24% 16% 26%; }
  .wesen-mobile-centered {
    position: absolute;
    width: 70vw;
    left: 17vw;
    bottom: calc(100% + 115px);
    text-align: center;
    font-style: italic;
  }
  .text-blob--beige { margin: 30px -18% 430px 0; }
  .text-blob--beige > div { inset: 20% 25% 15% 23%; }
  .wesen-between {
    position: absolute;
    width: 72vw;
    top: calc(100% + 110px);
    right: 13vw;
    text-align: center;
  }
  .text-blob--altrosa { margin: 150px 0 160px -16%; }
  .text-blob--altrosa > div { inset: 19% 24% 16% 25%; }
  .text-blob--brown { margin: 130px -17% 150px 0; }
  .text-blob--brown > div { inset: 22% 22%; }
  .wesen-contact { margin: 150px 0 0 -15%; }
  .wesen-contact > div { inset: 18% 23%; }
  .wesen-contact h2 { font-size: 29px; }
  .wesen-contact .graphic-cta { width: 180px; }

  .site-footer__stage { min-height: 620px; padding: 150px 20px 45px; gap: 25px; }
  .main-wesen + .site-footer .site-footer__stage { min-height: 920px; }
  .footer-mark { width: 54px; }
  .footer-menu { display: flex; flex-direction: column; gap: 18px; text-align: center; }
  .footer-copy { margin-top: 45px; }
  .legal-page, .generic-page { padding-top: 80px; }
  .legal-content h1 { font-size: 46px; }
  .legal-content h2 { font-size: 25px; }
  .legal-blob { width: 130%; }
}

/* Ankommen 2026: layered artboard based on the five supplied references. */
body.page-ankommen {
  position: relative;
  background: #fbf2e8;
  color: #392323;
  font-weight: 400;
}
.page-ankommen .site-header {
  position: absolute;
  inset: 0 0 auto;
}
.ankommen-page {
  width: min(100%, 1250px);
  margin-inline: auto;
}
.ankommen-artboard {
  position: relative;
  width: 100%;
  height: min(279.76vw, 3497px);
  /* The content axis is capped at 1250px; the supplied background deliberately
     extends beyond it through its negative X origin. Only the vertical excess
     is clipped at the designed page height. */
  overflow-x: visible;
  overflow-y: clip;
  container-type: inline-size;
}
.ankommen-background,
.ankommen-logo,
.ankommen-block,
.ankommen-cloud,
.ankommen-understand,
.ankommen-glyph {
  position: absolute;
  z-index: 2;
}
.ankommen-background {
  z-index: 0;
  top: 0;
  left: -14.9194cqw;
  width: 134.1699cqw;
  max-width: none;
  pointer-events: none;
}
.ankommen-background img { width: 100%; max-width: none; }
.ankommen-logo {
  top: 13.6474cqw;
  left: 50%;
  width: 28cqw;
  max-width: none;
  transform: translateX(-50%);
}
.ankommen-block { margin: 0; white-space: nowrap; }
.ankommen-block p { margin: 0; white-space: nowrap; }
.ankommen-block p + p { margin-top: 1.2em; }
.ankommen-variant { display: none; }
.ankommen-variant--1250 { display: inline; }
.ankommen-title,
.ankommen-intro { left: 50%; transform: translateX(-50%); text-align: center; }
.ankommen-title {
  top: 51.8884cqw;
  width: 55.1931cqw;
  font-size: 4.16cqw;
  font-weight: 600;
  line-height: 5.4272cqw;
}
.ankommen-title em {
  color: #7d2f34;
  font-family: var(--script);
  font-size: 6cqw;
  font-style: normal;
  font-weight: 400;
  line-height: 0;
}
.ankommen-intro {
  top: 66.8421cqw;
  width: 56.352cqw;
  font-size: 2.24cqw;
  line-height: 3.3328cqw;
}
.ankommen-intro b {
  color: #898999;
  font-family: var(--sans);
  font-size: 1.76cqw;
  font-weight: 400;
}
.ankommen-design-heading {
  top: 85.3969cqw;
  left: 16.138cqw;
  width: 28.0679cqw;
  font-size: 2.88cqw;
  font-weight: 600;
  line-height: 3.456cqw;
}
.ankommen-design-copy {
  top: 94.0555cqw;
  left: 16.138cqw;
  width: 47.1616cqw;
  font-size: 2.08cqw;
  line-height: 2.496cqw;
}
.ankommen-quote {
  top: 119.4943cqw;
  right: 16.0378cqw;
  width: 61.4014cqw;
  color: #7986ad;
  font-size: 3.04cqw;
  font-style: italic;
  font-weight: 600;
  line-height: 3.648cqw;
  text-align: right;
}
.ankommen-start {
  top: 134.5341cqw;
  left: 16.138cqw;
  width: 36.4031cqw;
  font-size: 2.08cqw;
  line-height: 2.496cqw;
}
.ankommen-cloud {
  top: 150.3318cqw;
  left: 39.5262cqw;
  width: 52.8797cqw;
  max-width: none;
}
.ankommen-quiet,
.ankommen-guide { right: 18.919cqw; text-align: right; }
.ankommen-quiet {
  top: 163.3716cqw;
  font-size: 2.88cqw;
  font-weight: 600;
  line-height: 3.456cqw;
}
.ankommen-guide {
  top: 168.1235cqw;
  width: 16.7382cqw;
  font-size: 2.08cqw;
  line-height: 2.496cqw;
}
.ankommen-understand {
  top: 187.2117cqw;
  right: 18.4198cqw;
  width: 20.7674cqw;
}
.ankommen-understand img { width: 100%; }
.ankommen-senso,
.ankommen-sophie {
  font-size: 4.64cqw;
  font-weight: 600;
  line-height: 1;
}
.ankommen-senso span:last-child,
.ankommen-sophie span:first-child { color: #7d2f34; }
.ankommen-senso { top: 190.8834cqw; left: 16.138cqw; }
.ankommen-glyph {
  top: 197.7975cqw;
  left: 16.138cqw;
  width: 14.4528cqw;
}
.ankommen-senso-copy {
  top: 201.6777cqw;
  left: 16.138cqw;
  width: 31.2518cqw;
  font-size: 2.08cqw;
  line-height: 2.496cqw;
}
.ankommen-sophie {
  top: 222.6321cqw;
  right: 16.1846cqw;
  width: 36.1152cqw;
  text-align: right;
}
.ankommen-sophie-copy {
  top: 229.0169cqw;
  right: 16.1846cqw;
  width: 36.1152cqw;
  font-size: 2.08cqw;
  line-height: 2.496cqw;
  text-align: right;
}
.ankommen-sophie-line { display: block; }
/* Optical edge alignment for the differing right sidebearings of terminal glyphs. */
.ankommen-sophie-line--comma { transform: translateX(.07em); }
.ankommen-sophie-line--k { transform: translateX(.025em); }
.ankommen-sophie-line--e { transform: translateX(.055em); }
.ankommen-sophie-line--period { transform: translateX(.11em); }

/* The shared footer overlays the lower part of the supplied ankommen artboard. */
.page-ankommen .site-footer {
  position: absolute;
  z-index: 20;
  top: 0;
  left: 50%;
  width: min(100%, 1250px);
  height: min(279.76vw, 3497px);
  transform: translateX(-50%);
  container-type: inline-size;
  pointer-events: none;
}
.page-ankommen .site-footer__stage {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 0;
  display: block;
  font-family: var(--sans);
}
.page-ankommen .footer-mark,
.page-ankommen .footer-nav,
.page-ankommen .footer-copy,
.page-ankommen .footer-top { position: absolute; margin: 0; pointer-events: auto; }
.page-ankommen .footer-mark {
  top: 251.7856cqw;
  left: 50%;
  width: 6.7008cqw;
  transform: translateX(-50%);
}
.page-ankommen .footer-nav {
  top: 264.4662cqw;
  left: 50%;
  transform: translateX(-50%);
}
.page-ankommen .footer-menu {
  gap: 2.0963cqw;
  font-size: 1.44cqw;
  line-height: 1.2;
  white-space: nowrap;
}
.page-ankommen .footer-copy {
  top: 276.5997cqw;
  left: 5.681cqw;
  font-size: 1.2cqw;
}
.page-ankommen .footer-top {
  top: 272.3305cqw;
  left: 92.0692cqw;
  width: 3.2495cqw;
}

@media (min-width: 900px) and (max-width: 1124px) {
  .site-brand { font-size: 26px; }
  .primary-menu { gap: 25px; }
  .primary-menu a { font-size: 16px; }
  .header-cta { width: 190px; padding: 11px 18px 10px; font-size: 15px; }

  .ankommen-artboard { height: 282.0762vw; }
  .ankommen-variant { display: none; }
  .ankommen-variant--1024 { display: inline; }
  .ankommen-background { left: -14.8718cqw; width: 134.1227cqw; }
  .ankommen-logo { top: 13.6426cqw; width: 31.25cqw; }
  .ankommen-title { top: 53.5656cqw; width: 58.4738cqw; font-size: 4.3945cqw; line-height: 5.5664cqw; }
  .ankommen-title em { font-size: 6.3477cqw; }
  .ankommen-intro { top: 68.2922cqw; width: 68.3553cqw; font-size: 2.7344cqw; line-height: 3.418cqw; }
  .ankommen-intro b { font-size: 2.1484cqw; }
  .ankommen-design-heading { top: 90.2482cqw; left: 16.1747cqw; width: 28.0762cqw; font-size: 2.8809cqw; line-height: 3.457cqw; }
  .ankommen-design-copy { top: 98.9052cqw; left: 16.1747cqw; width: 47.7171cqw; font-size: 2.1484cqw; line-height: 2.5781cqw; }
  .ankommen-quote { top: 124.3352cqw; right: 16.025cqw; width: 50.5779cqw; font-size: 3.0273cqw; line-height: 3.6328cqw; }
  .ankommen-start { top: 139.1835cqw; left: 16.1747cqw; width: 32.5861cqw; font-size: 2.1484cqw; line-height: 2.5781cqw; }
  .ankommen-cloud { top: 154.1851cqw; left: 39.5546cqw; width: 52.8611cqw; }
  .ankommen-quiet, .ankommen-guide { right: 18.9052cqw; }
  .ankommen-quiet { top: 166.2422cqw; font-size: 2.8809cqw; line-height: 3.457cqw; }
  .ankommen-guide { top: 170.994cqw; width: 16.5036cqw; font-size: 2.1484cqw; line-height: 2.5781cqw; }
  .ankommen-understand { top: 189.0989cqw; right: 18.4061cqw; width: 20.7601cqw; }
  .ankommen-senso, .ankommen-sophie { font-size: 4.6387cqw; }
  .ankommen-senso { top: 193.7459cqw; left: 16.1747cqw; }
  .ankommen-glyph { top: 200.6576cqw; left: 16.1747cqw; width: 14.4478cqw; }
  .ankommen-senso-copy { top: 204.5363cqw; left: 16.1747cqw; width: 31.7896cqw; font-size: 2.1484cqw; line-height: 2.5781cqw; }
  .ankommen-sophie { top: 224.5068cqw; right: 16.025cqw; width: 37.3035cqw; }
  .ankommen-sophie-copy { top: 230.8893cqw; right: 16.025cqw; width: 37.3035cqw; font-size: 2.1484cqw; line-height: 2.5781cqw; }

  .page-ankommen .site-footer { height: 282.0762vw; }
  .page-ankommen .footer-mark { top: 253.6501cqw; width: 6.6985cqw; }
  .page-ankommen .footer-nav { top: 266.3464cqw; }
  .page-ankommen .footer-menu { gap: 2.316cqw; font-size: 1.416cqw; }
  .page-ankommen .footer-copy { top: 274.1878cqw; left: 5.7cqw; font-size: 1.1719cqw; }
  .page-ankommen .footer-top { top: 274.1878cqw; left: 92.0792cqw; width: 3.2484cqw; }
}

@media (min-width: 700px) and (max-width: 899px) {
  .site-header__stage { min-height: 66px; padding: 18px 24px 10px; }
  .site-brand { font-size: 20px; }
  .primary-menu { gap: 24px; }
  .primary-menu a { font-size: 13px; }
  .header-cta { width: 145px; padding: 8px 14px 7px; font-size: 13px; }

  .ankommen-artboard { height: 314.3959vw; }
  .ankommen-variant { display: none; }
  .ankommen-variant--778 { display: inline; }
  .ankommen-background { left: -14.9472cqw; width: 134.2024cqw; }
  .ankommen-logo { top: 14.1617cqw; width: 38.5604cqw; }
  .ankommen-title { top: 66.4022cqw; width: 63.5516cqw; font-size: 4.6272cqw; line-height: 4.8843cqw; }
  .ankommen-title em { font-size: 7.3907cqw; }
  .ankommen-intro { top: 81.9787cqw; width: 70.1199cqw; font-size: 2.8278cqw; line-height: 3.599cqw; }
  .ankommen-intro b { font-size: 2.1851cqw; }
  .ankommen-design-heading { top: 103.1617cqw; left: 14.9381cqw; width: 31.3168cqw; font-size: 3.2134cqw; line-height: 3.856cqw; }
  .ankommen-design-copy { top: 112.9465cqw; left: 14.9381cqw; width: 43.3438cqw; font-size: 2.5707cqw; line-height: 3.0848cqw; }
  .ankommen-quote { top: 147.3064cqw; right: 14.9414cqw; width: 51.9777cqw; font-size: 3.0848cqw; line-height: 3.7018cqw; }
  .ankommen-start { top: 163.6209cqw; left: 14.9381cqw; width: 38.9906cqw; font-size: 2.5707cqw; line-height: 3.0848cqw; }
  .ankommen-cloud { top: 178.6654cqw; left: 39.5115cqw; width: 52.8925cqw; }
  .ankommen-quiet, .ankommen-guide { right: 20.5656cqw; }
  .ankommen-quiet { top: 191.438cqw; font-size: 3.2134cqw; line-height: 3.856cqw; }
  .ankommen-guide { top: 196.1094cqw; width: 19.7473cqw; font-size: 2.5707cqw; line-height: 3.0848cqw; }
  .ankommen-understand { top: 215.5543cqw; right: 18.4242cqw; width: 20.6728cqw; }
  .ankommen-senso, .ankommen-sophie { font-size: 4.6272cqw; }
  .ankommen-senso { top: 222.4278cqw; left: 14.9381cqw; }
  .ankommen-glyph { top: 229.3436cqw; left: 14.9381cqw; width: 14.4564cqw; }
  .ankommen-senso-copy { top: 232.7471cqw; left: 14.9381cqw; width: 36.2473cqw; font-size: 2.5707cqw; line-height: 3.0848cqw; }
  .ankommen-sophie { top: 253.5652cqw; right: 14.9414cqw; width: 31.4577cqw; }
  .ankommen-sophie-copy { top: 260.1024cqw; right: 14.9414cqw; width: 31.4577cqw; font-size: 2.5707cqw; line-height: 3.0848cqw; }

  .page-ankommen .site-footer { height: 314.3959vw; }
  .page-ankommen .footer-mark { top: 286.5077cqw; width: 6.8342cqw; }
  .page-ankommen .footer-nav { top: 298.9006cqw; }
  .page-ankommen .footer-menu { gap: 2.3147cqw; font-size: 1.5424cqw; }
  .page-ankommen .footer-copy { top: 311.111cqw; left: 3.8052cqw; font-size: 1.2853cqw; }
  .page-ankommen .footer-top { top: 306.8866cqw; left: 90.6461cqw; width: 3.2665cqw; }
}

@media (min-width: 480px) and (max-width: 699px) {
  .ankommen-artboard { height: 414.3333vw; }
  .ankommen-variant { display: none; }
  .ankommen-variant--600 { display: inline; }
  .ankommen-background { left: -19.1702cqw; width: 154.2947cqw; }
  .ankommen-logo { top: 19.006cqw; width: 47.5cqw; }
  .ankommen-title { top: 85.9129cqw; width: 72.6911cqw; font-size: 5.3333cqw; line-height: 6.3333cqw; }
  .ankommen-title em { font-size: 8.3333cqw; }
  .ankommen-intro { top: 107.1097cqw; width: 65.1989cqw; font-size: 3.6667cqw; line-height: 4.6667cqw; }
  .ankommen-intro b { font-size: 2.8333cqw; }
  .ankommen-design-heading { top: 134.1842cqw; left: 8.9165cqw; width: 37.3589cqw; font-size: 3.8333cqw; line-height: 4.6cqw; }
  .ankommen-design-copy { top: 147.3658cqw; left: 8.9165cqw; width: 48.326cqw; font-size: 3cqw; line-height: 3.6cqw; }
  .ankommen-quote { top: 181.249cqw; right: 8.6667cqw; width: 36.3588cqw; font-size: 4cqw; line-height: 4.8cqw; }
  .ankommen-start { top: 206.3876cqw; left: 8.9165cqw; width: 45.5021cqw; font-size: 3cqw; line-height: 3.6cqw; }
  .ankommen-cloud { top: 233.7682cqw; left: 39.5606cqw; width: 54.4225cqw; }
  .ankommen-quiet, .ankommen-guide { right: 16.3333cqw; }
  .ankommen-quiet { top: 246.4821cqw; font-size: 3.8333cqw; line-height: 4.6cqw; }
  .ankommen-guide { top: 253.0267cqw; width: 23.0452cqw; font-size: 3cqw; line-height: 3.6cqw; }
  .ankommen-understand { top: 271.7242cqw; right: 17.1667cqw; width: 22.1966cqw; }
  .ankommen-senso, .ankommen-sophie { font-size: 6cqw; }
  .ankommen-senso { top: 285.8498cqw; left: 8.9165cqw; }
  .ankommen-glyph { top: 294.8997cqw; left: 8.9165cqw; width: 22.1437cqw; }
  .ankommen-senso-copy { top: 301.5192cqw; left: 8.9165cqw; width: 42.3739cqw; font-size: 3cqw; line-height: 3.6cqw; }
  .ankommen-sophie { top: 328.0296cqw; right: 8.6667cqw; width: 36.3961cqw; }
  .ankommen-sophie-copy { top: 337.7673cqw; right: 8.6667cqw; width: 36.3961cqw; font-size: 3cqw; line-height: 3.6cqw; }

  .page-ankommen .site-footer { height: 414.3333vw; }
  .page-ankommen .footer-mark { top: 373.126cqw; width: 8.9284cqw; }
  .page-ankommen .footer-nav { top: 389.2389cqw; }
  .page-ankommen .footer-menu { gap: 2.985cqw; font-size: 2cqw; }
  .page-ankommen .footer-copy { top: 408.4051cqw; left: 50%; transform: translateX(-50%); font-size: 1.6667cqw; white-space: nowrap; }
  .page-ankommen .footer-top { top: 401.5381cqw; left: 50%; width: 4.2356cqw; transform: translateX(-50%); }
}

@media (max-width: 479px) {
  .site-header__stage { padding: 18px 16px 10px; }
  .site-brand, .menu-trigger { font-size: 12px; }

  .ankommen-artboard { height: 734.1667vw; }
  .ankommen-variant { display: none; }
  .ankommen-variant--360 { display: inline; }
  .ankommen-background { left: -48.9189cqw; width: 212.3871cqw; }
  .ankommen-logo { top: 17.6983cqw; width: 72.2222cqw; }
  .ankommen-title { top: 109.6323cqw; width: 61.6433cqw; font-size: 7.7778cqw; line-height: 9.3333cqw; }
  .ankommen-title em { font-size: 11.9444cqw; }
  .ankommen-intro { top: 157.7219cqw; width: 57.5559cqw; font-size: 5.8333cqw; line-height: 7cqw; }
  .ankommen-intro b { font-size: 4.7222cqw; }
  .ankommen-design-heading { top: 218.4493cqw; left: 9.8629cqw; width: 62.2648cqw; font-size: 6.3889cqw; line-height: 7.6667cqw; }
  .ankommen-design-copy { top: 237.0854cqw; left: 9.8629cqw; width: 80.246cqw; font-size: 5cqw; line-height: 6cqw; }
  .ankommen-quote { top: 298.9153cqw; right: 9.7222cqw; width: 60.598cqw; font-size: 6.6667cqw; line-height: 8cqw; }
  .ankommen-start { top: 347.6093cqw; left: 9.8629cqw; width: 75.8369cqw; font-size: 5cqw; line-height: 6cqw; }
  .ankommen-cloud { top: 413.8629cqw; left: 5.9082cqw; width: 90.7042cqw; }
  .ankommen-quiet, .ankommen-guide { right: 18.8889cqw; }
  .ankommen-quiet { top: 435.0526cqw; font-size: 6.3889cqw; line-height: 7.6667cqw; }
  .ankommen-guide { top: 445.96cqw; width: 38.4085cqw; font-size: 5cqw; line-height: 6cqw; }
  .ankommen-understand { top: 477.1228cqw; right: 21.9567cqw; width: 35.8831cqw; }
  .ankommen-senso, .ankommen-sophie { font-size: 10cqw; }
  .ankommen-senso { top: 514.3492cqw; left: 9.8629cqw; }
  .ankommen-glyph { top: 529.5405cqw; left: 9.8629cqw; width: 31.2419cqw; }
  .ankommen-senso-copy { top: 539.3538cqw; left: 9.8629cqw; width: 70.6231cqw; font-size: 5cqw; line-height: 6cqw; }
  .ankommen-sophie { top: 595.2509cqw; right: 9.7222cqw; width: 61.1854cqw; }
  .ankommen-sophie-copy { top: 609.2584cqw; right: 9.7222cqw; width: 61.1854cqw; font-size: 5cqw; line-height: 6cqw; }

  .page-ankommen .site-footer { height: 734.1667vw; }
  .page-ankommen .footer-mark { top: 666.6261cqw; width: 14.8806cqw; }
  .page-ankommen .footer-nav { top: 693.481cqw; }
  .page-ankommen .footer-menu { gap: 4.9753cqw; font-size: 3.3333cqw; }
  .page-ankommen .footer-copy { top: 725.4245cqw; left: 50%; transform: translateX(-50%); font-size: 2.7778cqw; white-space: nowrap; }
  .page-ankommen .footer-top { top: 713.9796cqw; left: 50%; width: 7.0594cqw; transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; }
}