.santino {
  --sa-cream: #f6f1e7;
  --sa-sand: #efe7d8;
  --sa-dark2: #3a352e;
  --sa-gold: #ab8752;
  font-family: 'Manrope',sans-serif;
  background: var(--sa-cream);
  color: #2a251d;
  line-height: 1.7;
  overflow-x: clip;
  --bs-primary-rgb: 171,135,82;
  --bs-secondary-rgb: 138,128,101;
  --bs-light-rgb: 249,246,239;
  --bs-dark-rgb: 52,48,42;
  --bs-body-bg-rgb: 246,241,231;
  --bs-body-color-rgb: 42,37,29;
  --bs-secondary-color: #514936;
  --bs-emphasis-color: #16140f;
  --bs-border-radius: 6px;
}

.santino .btn-cta { 
background-color: var(--sa-gold);
  border-color: var(--sa-gold);
}
.santino a {
  color: var(--sa-gold);
  text-decoration: none;
}
.santino a:hover {
  color: #c9a26d;
}
.santino .sa-serif {
  font-family: 'Cormorant Garamond',serif;
}
.santino .sa-eyebrow {
  font-size: 0.75rem;
  letter-spacing: .28em;
}
.santino .sa-rule {
  width: 34px;
  height: 1px;
  background: currentColor;
  transform-origin: left;
}
.santino .sa-btn {
  color: #2b2620;
  letter-spacing: .12em;
  padding: 17px 38px;
  transition: letter-spacing .45s ease;
}
.santino .sa-btn:hover {
  color: #2b2620;
  letter-spacing: .18em;
}
.santino .sa-lift {
  transition: transform .7s cubic-bezier(.22,1,.36,1), box-shadow .7s ease;
}
.santino .sa-lift:hover {
  transform: translateY(-14px);
  box-shadow: 0 18px 34px rgba(42,37,29,.16);
}
.santino .sa-lift img {
  transition: transform 1.4s cubic-bezier(.22,1,.36,1);
}
.santino .sa-lift:hover img {
  transform: scale(1.05);
}
.santino .sa-track {
  width: max-content;
  align-items: stretch;
  padding-bottom: clamp(32px, 5vw, 64px);
}

.santino .sa-track > article {
  width: clamp(280px, 26vw, 360px);
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
}

.santino .sa-track > article > .p-4 {
  flex: 1 1 auto;
}
@media (min-width: 1200px) {
  .santino .sa-track {
    width: 100%;
    justify-content: center;
  }
}

.santino .sa-radar {
  aspect-ratio: 1/1;
  max-width: 1000px;
}

.santino .sa-map-placeholder {
  min-height: 420px;
  border: 1px solid rgba(42,37,29,.16);
  background: rgba(255,255,255,.28);
  color: #514936;
  font-size: .6875rem;
  letter-spacing: .2em;
  text-transform: uppercase;
}

.santino .sa-ring {
  border: 1px solid rgba(22,20,15,.12);
}
.santino .sa-zoom-frame {
  width: 44%;
  aspect-ratio: 16/10;
}
.santino .sa-video-frame {
  width: 58%;
  aspect-ratio: 16/9;
  background: #100e0a;
}
.santino .sa-hero-section {
  height: calc(100vh + 560px);
}
.santino .sa-hero-img {
  inset: -9% 0;
}
.santino .sa-hero-overlay {
  background: linear-gradient(180deg,rgba(40,36,30,.46) 0%,rgba(40,36,30,.10) 30%,rgba(40,36,30,.50) 66%,rgba(40,36,30,.86) 100%);
}
.santino .sa-hero-shade {
  height: 66%;
  background: linear-gradient(180deg,rgba(26,23,18,0) 0%,rgba(26,23,18,.44) 40%,rgba(26,23,18,.76) 100%);
}
.santino .sa-hero-content {
  padding: clamp(24px,3.6vw,52px) clamp(24px,5vw,72px);
}
.santino .sa-hero-logo {
  width: clamp(112px,12vw,172px);
}
.santino .sa-hero-location {
  font-size: clamp(0.75rem,1vw,0.875rem);
  letter-spacing: .32em;
  color: #f4ecdc;
}
.santino .sa-title-clip {
  padding-bottom: .1em;
}
.santino .sa-hero-title {
  font-size: clamp(2.5rem,7vw,7rem);
}
.santino .sa-hero-subtitle {
  font-size: clamp(1.0625rem,2vw,1.8125rem);
  color: #f6ecd8;
}
.santino .sa-hero-summary {
  font-size: clamp(0.6875rem,1vw,0.8125rem);
  letter-spacing: .16em;
  color: #e4dac4;
}
.santino .sa-hero-hint {
  right: clamp(24px,5vw,72px);
  bottom: clamp(24px,3.6vw,52px);
}
.santino .sa-scroll-label {
  letter-spacing: .28em;
  color: #e4dac4;
}
.santino .sa-scroll-rule {
  width: 40px;
  height: 1px;
  background: linear-gradient(90deg,rgba(228,218,196,.75),rgba(228,218,196,0));
}
.santino .sa-section--intro {
  padding-top: clamp(50px,7vw,140px);
  padding-bottom: clamp(50px,7vw,140px);
}
.santino .sa-intro-heading {
  font-size: clamp(1.625rem,3.6vw,3.125rem);
  line-height: 1.28;
  margin: 0 0 clamp(34px,5vw,58px);
  max-width: 50ch;
}
.santino .sa-intro-columns {
  max-width: 900px;
}
.santino .sa-zoom-section {
  height: calc(100vh + 620px);
}
.santino .sa-zoom-caption {
  bottom: 0;
  left: calc(50% - 50vw);
  padding-bottom: calc(3rem + clamp(48px,8vh,104px));
  background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.3) 50%, rgba(0,0,0,.35) 100%);
}
.santino .sa-architecture-title {
  font-size: clamp(2.25rem,2.2vw,2.875rem);
  color: white;
}
.santino .sa-architecture-copy {
  font-size: clamp(1.375rem,3.2vw,2.875rem);
  max-width: 24ch;
}
.santino .sa-subheading {
  font-size: clamp(1.625rem,3.2vw,2.75rem);
  line-height: 1.18;
}
.santino .sa-fact-num {
  font-size: clamp(1.75rem,3vw,2.5rem);
}
.santino .sa-fact-label {
  letter-spacing: .18em;
}
.santino .sa-image-portrait {
  aspect-ratio: 4/5;
}
.santino .sa-floors-section {
  padding: clamp(90px,12vw,150px) 0 clamp(70px,9vw,110px);
}
.santino .sa-floors-heading {
  max-width: 22ch;
}
.santino .sa-floors-intro {
  max-width: 56ch;
  color: #c3b9a3;
}
.santino .sa-floor-image {
  height: clamp(200px,26vh,270px);
}
.santino .sa-floor-label {
  letter-spacing: .24em;
}
.santino .sa-floor-heading {
  font-size: clamp(1.3125rem,1.9vw,1.6875rem);
  line-height: 1.16;
}
.santino .sa-floor-meta {
  letter-spacing: .08em;
}
.santino .sa-video-copy {
  font-size: clamp(1.25rem,2.8vw,2.5rem);
  max-width: 26ch;
}
.santino .sa-section-intro {
  margin-bottom: clamp(44px,6vw,76px);
}
.santino .sa-image-landscape {
  aspect-ratio: 3/2;
}
.santino .sa-amenity-number {
  font-size: 1.6rem;
  opacity: .6;
}
.santino .sa-amenity-heading {
  font-size: 1.75rem;
  line-height: 1.15;
}
.santino .sa-amenity-copy {
  font-size: 1rem;
  line-height: 1.6;
  color: #5a5140;
}
.santino .sa-quote {
  margin-bottom: clamp(50px,7vw,88px);
}
.santino .sa-quote-copy {
  font-size: clamp(1.5rem,3.4vw,2.875rem);
  line-height: 1.26;
  max-width: 858px;
}
.santino .sa-border-light-soft {
  --bs-border-color: rgba(249,246,239,.2);
}
.santino .sa-sustainability-heading {
  font-size: clamp(1.1875rem,1.7vw,1.5rem);
  line-height: 1.2;
}
.santino .sa-sustainability-copy {
  color: #b9af99;
}
.santino .sa-equipment-intro {
  max-width: 52ch;
}
.santino .sa-equip {
  color: #3d3729;
}
.santino .sa-equip-number {
  min-width: 22px;
}
.santino .sa-image-wide {
  aspect-ratio: 4/3;
}
.santino .sa-infrastructure-intro {
  max-width: 620px;
}
.santino .sa-infrastructure-heading {
  font-size: clamp(1.5rem,3vw,2.5rem);
  line-height: 1.16;
}
.santino .sa-small-copy {
  font-size: clamp(0.8125rem,1vw,0.9375rem);
}
.santino .sa-ring-inner {
  width: 28%;
  height: 28%;
  margin: -14% 0 0 -14%;
}
.santino .sa-ring-middle {
  width: 50%;
  height: 50%;
  margin: -25% 0 0 -25%;
}
.santino .sa-ring-outer {
  width: 74%;
  height: 74%;
  margin: -37% 0 0 -37%;
  border-style: dashed;
}
.santino .sa-sweep {
  width: 43%;
  height: 1px;
  transform-origin: left center;
  background: linear-gradient(90deg,rgba(171,135,82,.6),rgba(171,135,82,0));
}
.santino .sa-core {
  width: clamp(108px,14vw,158px);
  height: clamp(108px,14vw,158px);
}
.santino .sa-radar-logo {
  width: 62%;
  filter: brightness(0) invert(1) sepia(1) saturate(.4) brightness(1.2);
}
.santino .sa-poi-list {
  max-width: 640px;
}
.santino .sa-contact-section {
  padding: clamp(100px,14vw,190px) 0;
}
.santino .sa-kontakt-bg {
  inset: -8% 0;
  opacity: .3;
}
.santino .sa-contact-overlay {
  background: linear-gradient(180deg,rgba(52,48,42,.84),rgba(52,48,42,.92));
}
.santino .sa-contact-logo {
  width: clamp(120px,13vw,168px);
}
.santino .sa-contact-heading {
  font-size: clamp(1.75rem,4vw,3.375rem);
  line-height: 1.14;
}
.santino .sa-contact-copy {
  color: #bcb29c;
}
.santino .sa-contact-border {
  --bs-border-color: rgba(249,246,239,.16);
}
.santino .sa-contact-label {
  letter-spacing: .22em;
  color: #8d846e;
}
.santino .sa-legal-copy {
  color: #6f6858;
}
.santino .sa-poi-dot {
  width: 9px;
  height: 9px;
  margin-top: 4px;
  box-shadow: 0 0 0 4px rgba(171,135,82,.16);
}
.santino .sa-poi-label {
  line-height: 1.3;
}
.santino .sa-poi-value {
  line-height: 1.1;
}
.santino .sa-poi-distance {
  line-height: 1.1;
}
.santino .sa-poi .sa-poi-value {
  margin-top: 1px;
}
.santino .sa-heading {
  font-size: clamp(1.75rem,3.8vw,3.25rem);
  line-height: 1.14;
}
.santino .sa-contact-detail {
  color: #e7dfcd;
}
.santino .sa-hero-frame {
  height: 100vh;
}
.santino .sa-text-gold-light {
  color: #dcc7a0;
}
.santino .sa-text-button {
  font-size: 1.25rem;
  line-height: 1;
}
.santino .sa-logo-light {
  filter: brightness(0) invert(1) sepia(1) saturate(.42) brightness(1.22);
}
.santino .sa-label {
  font-size: 0.625rem;
}
.santino .sa-caption-leading {
  line-height: 1.24;
}
.santino .sa-copy {
  font-size: clamp(0.875rem,1.05vw,1rem);
}
.santino .sa-text-xs {
  font-size: 0.75rem;
}
.santino .sa-bg-sand {
  background: var(--sa-sand);
}
.santino .sa-section {
  padding: clamp(90px,12vw,170px) 0;
}
.santino .sa-content {
  max-width: 760px;
}
.santino .sa-bg-dark-soft {
  background: var(--sa-dark2);
}
.santino .sa-text-sm {
  font-size: 0.875rem;
}
.santino .sa-lead {
  font-size: clamp(0.875rem,1.1vw,1.0625rem);
}

.santino .sa-equipment-slider-wrap {
  position: relative;
}

.santino .sa-equipment-slider {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  isolation: isolate;
  touch-action: pan-y;
  cursor: grab;
  user-select: none;
}

.santino .sa-equipment-slider.is-dragging {
  cursor: grabbing;
}

.santino .sa-equipment-card {
  position: absolute;
  inset: 0;
  overflow: hidden;
  will-change: transform, opacity;
}

.santino .sa-equipment-card img {
  pointer-events: none;
}

.santino .sa-swipe-hint {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, -50%);
  font-size: 2rem;
  color: #f9f6ef;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.35));
}

.santino .sa-equipment-slider-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
  margin-top: 1.25rem;
}

.santino .sa-equipment-slider-indicators {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  height: 32px;
  position: relative;
  top: 3px;
  pointer-events: none;
}
@media (max-width: 767.98px) {
  .santino .sa-equipment-slider-indicators {
    top: 6px;
  }
}

.santino .sa-equipment-slider-indicators span {
  display: block;
  width: 28px;
  height: 2px;
  background: rgba(42, 37, 29, 0.22);
  transition: background-color 0.3s ease, width 0.3s ease;
}

.santino .sa-equipment-slider-indicators span.is-active {
  width: 42px;
  background: var(--sa-gold);
}

.santino .sa-equipment-slider-controls button {
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #514936;
  font-family: Georgia, serif;
  font-size: 2rem;
  line-height: 1;
  cursor: pointer;
}

.santino .sa-equipment-slider-controls button:hover {
  color: var(--sa-gold);
}



@media (max-width: 767.98px) {
  .santino .sa-wide {
    max-width: 100% !important;
  }

  /* Architektur-Image-Zoom */
  .santino #santino-architektur .sa-zoom-caption {
      bottom: 0;
      left: calc(50% - 50vw);
      width: 100vw;
      min-height: 180px;
      padding: 4rem 1.5rem 2rem;

      background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.25) 45%,
        rgba(0, 0, 0, 0.65) 100%
      );
    }

  .santino #santino-architektur .sa-architecture-copy {
    color: #f9f6ef !important;
  }

  /* Video-Section */
  .santino #santino-video.sa-zoom-section {
    height: auto;
  }

  .santino #santino-video.sa-zoom-section > .vh-100 {
    height: auto !important;
    min-height: 0;
    flex-direction: column;
    justify-content: flex-start !important;
  }

  .santino #santino-video .sa-zoom-caption {
    position: relative !important;
    order: -1;
    top: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    padding: 2.5rem 1.5rem 2rem;
    background: var(--sa-sand);
    text-align: left !important;
  }

  .santino #santino-video .sa-architecture-title {
    justify-content: flex-start !important;
    margin-bottom: 0.75rem !important;
    font-size: 0.75rem;
    letter-spacing: 0.28em;
    color: var(--sa-gold) !important;
  }

  .santino #santino-video .sa-video-copy {
    margin-left: 0 !important;
    font-size: clamp(1.75rem, 7vw, 2.5rem);
    line-height: 1.14;
    max-width: 22ch;
    color: #16140f !important;
  }

  .santino .sa-radar {
    width: 100vw !important;
    max-width: none;
  }

  .santino .sa-poi-card {
    max-width: 92px;
    gap: 0.35rem !important;
  }

  .santino .sa-poi-label {
    white-space: normal !important;
    overflow-wrap: anywhere;
    font-size: 0.625rem;
    line-height: 1.05;
  }

  .santino .sa-poi-value {
    font-size: 0.75rem !important;
    line-height: 1;
  }

  .santino .sa-poi-dot {
    width: 7px;
    height: 7px;
  }

}