.hero {
  --pb-x: 0px; --pb-y: 0px;
  --pm-x: 0px; --pm-y: 0px;
  --pf-x: 0px; --pf-y: 0px;
  position: relative;
  z-index: 1;
  min-height: clamp(720px, 40vw + 230px, 980px);
  display: flex;
  align-items: center;
  padding: calc(var(--hh) + clamp(36px, 3.4vw, 56px)) 0 clamp(130px, 12vw, 200px);
  overflow: clip;
  background: var(--bg);
  isolation: isolate;
}

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

.blob { position: absolute; border-radius: 50%; filter: blur(60px); }

.blob--a {
  width: 70vw;
  height: 70vw;
  max-width: 1000px;
  max-height: 1000px;
  left: -20vw;
  top: -24vw;
  background: radial-gradient(circle, #fffdfa 0%, rgba(247, 238, 229, .9) 45%, transparent 70%);
  transform: translate3d(var(--pb-x), var(--pb-y), 0);
}

.drape { position: absolute; pointer-events: none; }

.drape--left {
  inset: -5% auto -5% -4%;
  width: 60%;
  background: linear-gradient(103deg,
    transparent 0 6%, rgba(255, 255, 255, .7) 11%, transparent 18%,
    rgba(234, 220, 204, .38) 25%, transparent 31%, rgba(255, 255, 255, .62) 39%,
    transparent 47%, rgba(238, 226, 212, .32) 55%, transparent 63%,
    rgba(255, 255, 255, .5) 72%, transparent 82%);
  filter: blur(16px);
  -webkit-mask-image: linear-gradient(90deg, #000 35%, transparent 95%);
  mask-image: linear-gradient(90deg, #000 35%, transparent 95%);
  transform: translate3d(calc(var(--pm-x) * 1.6), 0, 0) skewX(-4deg);
  animation: drape-breathe 9s ease-in-out infinite alternate;
}

.drape--right {
  z-index: 2;
  top: -5%;
  bottom: -5%;
  right: -1%;
  width: 5.5%;
  opacity: .8;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .6) 40%, rgba(246, 236, 225, .45) 64%, rgba(255, 255, 255, .85) 90%);
  filter: blur(12px);
  transform: translate3d(calc(var(--pf-x) * .8), 0, 0);
}

.hero-visual {
  position: absolute;
  top: var(--hh);
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .06) 18%, rgba(0, 0, 0, .5) 36%, rgba(0, 0, 0, .92) 50%, #000 58%);
  mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .06) 18%, rgba(0, 0, 0, .5) 36%, rgba(0, 0, 0, .92) 50%, #000 58%);
  animation: visual-in 1.8s var(--ease) both;
}

.hero-frame {
  position: absolute;
  inset: -40px -3% -40px -3%;
  transform: translate3d(var(--pf-x), calc(var(--py, 0px) + var(--pf-y)), 0);
  will-change: transform;
}

.hero-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 100% 6%;
  filter: brightness(1.03) saturate(.94);
  transform: translate3d(var(--pb-x), var(--pb-y), 0) scale(1.06);
  will-change: transform;
}

.hero-visual::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(60% 70% at 30% 40%, rgba(253, 249, 244, .55), transparent 70%),
    linear-gradient(180deg, rgba(250, 246, 242, .35) 0%, transparent 18%);
  pointer-events: none;
}

.sparkle {
  position: absolute;
  z-index: 3;
  width: 20px;
  height: 20px;
  color: #fffaf2;
  filter: drop-shadow(0 0 6px rgba(255, 236, 205, .95)) drop-shadow(0 0 14px rgba(255, 226, 190, .6));
  transform: translate3d(var(--pf-x), var(--pf-y), 0);
  pointer-events: none;
}

.sparkle svg { width: 100%; height: 100%; opacity: 0; animation: twinkle 9s var(--ease) infinite; animation-delay: var(--sd, 3s); }

.sparkle--1 { top: 62%; left: 44%; --sd: 3.2s; }

.sparkle--2 { top: 74%; left: 52%; width: 15px; height: 15px; --sd: 6.6s; }

.hero-inner { position: relative; z-index: 3; }

.hero-copy { max-width: 660px; }

.hero-title {
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(3.1rem, 1.5rem + 4.6vw, 6.1rem);
  line-height: .98;
  letter-spacing: -.018em;
  color: var(--ink);
}

.hero-line { display: block; }

.hero-line--em { font-style: italic; letter-spacing: -.02em; }

.hero-copy .lead { margin-top: 1.5rem; max-width: 31em; }

.hero-in,
.hero-line { animation: rise-in 1.15s var(--ease) var(--d, 0s) both; }

.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 34px; margin-top: 2.1rem; }

.trust { display: flex; flex-wrap: wrap; gap: 14px 34px; margin-top: 2.6rem; }

.trust li { display: flex; align-items: center; gap: 12px; font-size: .86rem; line-height: 1.3; color: var(--text); }

.trust .ico { width: 30px; height: 30px; color: var(--taupe); }

.hero-note {
  position: absolute;
  z-index: 3;
  top: 33%;
  left: calc(50% - 4px);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  font: 400 clamp(2rem, 1.2rem + 1.4vw, 2.9rem)/.95 var(--script);
  color: var(--taupe-d);
  text-align: center;
  transform: translate3d(calc(var(--pf-x) * 1.5), calc(var(--pf-y) * 1.5), 0) rotate(-16deg);
  pointer-events: none;
}

.hero-note__text { display: inline-block; padding: .1em .2em; animation: write 2.4s var(--ease) 1.2s both; }

.hero-note__heart { width: .62em; height: .56em; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }

.hero-note__heart path { stroke-dasharray: 1; stroke-dashoffset: 1; animation: draw 1.4s var(--ease) 3.1s forwards; }

.side-mark {
  position: absolute;
  z-index: 3;
  right: clamp(14px, 2vw, 34px);
  top: 76%;
  display: flex;
  align-items: center;
  gap: 16px;
  writing-mode: vertical-rl;
  transform: translateY(-50%) rotate(180deg);
  font: 600 .62rem/1 var(--sans);
  letter-spacing: .38em;
  text-transform: uppercase;
  color: rgba(90, 78, 68, .7);
  animation: fade-in 1.4s var(--ease) 1s both;
}

.side-mark::after { content: ''; width: 1px; height: 64px; background: currentColor; opacity: .6; }

.services {
  position: relative;
  z-index: 4;
  margin-top: -36px;
  padding: 10px 0 0;
}

.silk--services { left: -6%; width: 112%; top: -40px; height: calc(100% + 80px); }

.services-grid {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.72fr);
  gap: clamp(32px, 4vw, 72px);
  align-items: start;
}

.services-intro { padding-top: clamp(4px, 1vw, 16px); }

.services .h2 { font-size: clamp(2.2rem, 1.3rem + 1.95vw, 3rem); }

.services-intro .lead { max-width: 26em; margin-top: 1rem; }

.services-intro .text-link { margin-top: 1.2rem; }

.life {
  --pb-x: 0px; --pb-y: 0px;
  --pm-x: 0px; --pm-y: 0px;
  --pf-x: 0px; --pf-y: 0px;
  position: relative;
  z-index: 3;
  height: clamp(780px, 59.7vw, 1020px);
  margin-top: calc(-1 * clamp(96px, 9.4vw, 150px));
  overflow-x: clip;
  overflow-y: visible;
}

.life__bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 860' preserveAspectRatio='none'%3E%3Cpath d='M0 40C200 30 380 66 580 104S960 156 1160 150S1380 118 1440 110V860H0Z' fill='%23fff'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 860' preserveAspectRatio='none'%3E%3Cpath d='M0 40C200 30 380 66 580 104S960 156 1160 150S1380 118 1440 110V860H0Z' fill='%23fff'/%3E%3C/svg%3E");
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

.life__bg-move {
  position: absolute;
  inset: -56px -40px;
  transform: translate3d(var(--pb-x), calc(var(--py, 0px) + var(--pb-y)), 0);
  will-change: transform;
}

.life__bg-move img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 40% 62%;
  filter: saturate(.86) brightness(1.06) contrast(.94);
}

.life__bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(250, 242, 233, .35) 0%, transparent 30%, transparent 70%, rgba(244, 233, 222, .4) 100%),
    radial-gradient(80% 60% at 90% 30%, rgba(255, 238, 214, .25), transparent 70%);
}

.life__waves {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.life__waves--back { z-index: 1; }

.life__waves--front { z-index: 5; }

.lw-veil { fill: rgba(230, 210, 184, .34); }

.lw-tint { fill: rgba(255, 251, 246, .42); }

.lw-sand { fill: rgba(226, 205, 178, .42); }

.lw-mist { fill: rgba(255, 251, 246, .62); }

.lw-front { fill: var(--bg); }

.lw-line { stroke-dasharray: 1; stroke-dashoffset: 0; }

.life__waves path[data-drift] { transform: translate3d(var(--dx, 0px), 0, 0); }

.life__veil {
  position: absolute;
  z-index: 2;
  top: 14%;
  bottom: 6%;
  left: 30%;
  right: -6%;
  background:
    radial-gradient(ellipse 58% 56% at 50% 54%, rgba(253, 249, 244, .93) 0%, rgba(252, 247, 241, .86) 40%, rgba(251, 245, 238, .55) 62%, rgba(250, 244, 238, 0) 82%);
  pointer-events: none;
}

.grass {
  position: absolute;
  z-index: 2;
  fill: none;
  stroke: rgba(150, 118, 86, .55);
  stroke-width: 1.6;
  stroke-linecap: round;
  transform-origin: 50% 100%;
  animation: sway 7s ease-in-out infinite alternate;
  pointer-events: none;
}

.grass--l { left: 1%; bottom: 96px; width: 170px; height: 150px; opacity: .7; animation-duration: 8s; }

.grass--r { right: 3%; bottom: 112px; width: 220px; height: 190px; }

.life__figure {
  position: absolute;
  z-index: 4;
  top: 3%;
  left: max(-44px, calc(50% - 784px));
  height: 88%;
  aspect-ratio: 1077 / 1448;
  pointer-events: none;
}

.life__figure-move {
  position: absolute;
  inset: 0;
  transform: translate3d(var(--pf-x), calc(var(--py, 0px) + var(--pf-y)), 0);
  will-change: transform;
}

.life__figure img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 30px 40px rgba(120, 82, 52, .18)) saturate(.95);
}

.life__inner {
  position: relative;
  z-index: 6;
  display: grid;
  grid-template-columns: minmax(0, 1.16fr) minmax(0, 1.22fr) minmax(0, .64fr);
  gap: clamp(28px, 2.8vw, 40px);
  align-items: center;
  height: 100%;
  padding: clamp(170px, 15.5vw, 250px) 0 clamp(110px, 10vw, 170px);
}

.life__copy { grid-column: 2; }

.life__copy .lead { max-width: 30em; }

.life__copy .btn { margin-top: 2rem; }

.life .check-list { grid-column: 3; }

.tech {
  position: relative;
  z-index: 2;
  margin-top: -80px;
  padding: clamp(80px, 8vw, 124px) 0 clamp(70px, 6vw, 100px);
  isolation: isolate;
}

.silk--tech { left: -6%; width: 112%; top: 0; height: 100%; }

.tech__arc {
  position: absolute;
  z-index: -1;
  top: 60%;
  right: max(-120px, calc(50% - 860px));
  width: min(740px, 56vw);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 50%, #f5ebe3 0%, #f1e5db 34%, rgba(241, 229, 219, .4) 52%, rgba(241, 229, 219, 0) 66%);
  transform: translate3d(0, calc(-50% + var(--py, 0px)), 0);
}

.tech__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(40px, 5vw, 96px);
  align-items: center;
}

.tech__copy .check-list { margin-top: 1.7rem; }

.tech__copy .btn { margin-top: 2.2rem; }

.tech__visual {
  position: relative;
  justify-self: center;
  width: min(100%, 470px);
  aspect-ratio: 5 / 5.5;
  margin-right: 6%;
}

.tech__ring,
.tech__plate,
.tech__frame { position: absolute; border-radius: 999px 999px 30px 30px; }

.tech__ring { box-shadow: inset 0 0 0 1px rgba(196, 168, 128, .55); pointer-events: none; }

.tech__ring--1 { inset: -26px -26px 40px -26px; border-radius: 999px 999px 0 0; -webkit-mask-image: linear-gradient(180deg, #000 70%, transparent); mask-image: linear-gradient(180deg, #000 70%, transparent); }

.tech__ring--2 { inset: -54px -58px 70px -58px; border-radius: 999px 999px 0 0; opacity: .6; transform: translate3d(0, var(--py, 0px), 0); -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent); mask-image: linear-gradient(180deg, #000 55%, transparent); }

.tech__plate {
  inset: 26px -22px -22px 26px;
  background: linear-gradient(160deg, rgba(236, 223, 207, .9) 0%, rgba(223, 201, 176, .9) 100%);
  transform: translate3d(0, var(--py, 0px), 0);
}

.tech__frame {
  inset: 0;
  overflow: hidden;
  background: var(--sand);
  box-shadow: 0 40px 70px -40px rgba(90, 62, 44, .55);
  transform: translate3d(0, var(--py, 0px), 0);
}

.tech__frame::after { content: ''; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .45); pointer-events: none; }

.tech__frame img {
  position: absolute;
  inset: -9% 0;
  width: 100%;
  height: 118%;
  object-fit: cover;
  object-position: 58% 50%;
  transform: translate3d(0, calc(var(--py, 0px) * -1.3), 0) scale(1.04);
}

.concept-badge {
  position: absolute;
  z-index: 3;
  top: 4%;
  right: -16%;
  display: grid;
  place-items: center;
  width: clamp(120px, 11vw, 168px);
  aspect-ratio: 1;
  border-radius: 50%;
  text-align: center;
  font: italic 500 clamp(1rem, .7rem + .55vw, 1.3rem)/1.1 var(--serif);
  color: var(--taupe-d);
  background: radial-gradient(circle at 35% 30%, #f8efe5, #ead9c4 70%);
  box-shadow: 0 18px 40px -20px rgba(110, 78, 58, .5), inset 0 0 0 1px rgba(255, 255, 255, .6);
  transform: translate3d(0, var(--py, 0px), 0);
}

.leaf--tech-blur {
  z-index: 3;
  right: 1%;
  bottom: -40px;
  width: 210px;
  height: 346px;
  color: rgba(150, 118, 90, .34);
  filter: blur(3px);
  transform: translate3d(0, var(--py, 0px), 0) rotate(-24deg);
}

.tv {
  position: relative;
  z-index: 1;
  margin-top: calc(-1 * clamp(70px, 7vw, 120px));
  padding: clamp(150px, 13vw, 210px) 0 clamp(130px, 11vw, 180px);
  overflow-x: clip;
  isolation: isolate;
}

.tv__bg {
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    radial-gradient(55% 70% at 24% 50%, rgba(255, 252, 247, .85), transparent 70%),
    radial-gradient(40% 60% at 90% 20%, rgba(255, 244, 228, .5), transparent 70%),
    linear-gradient(180deg, #f4ebe2 0%, #efe3d7 100%);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 800' preserveAspectRatio='none'%3E%3Cpath d='M0 70C260 20 520 40 760 80S1220 130 1440 60V720C1200 780 940 756 700 736S220 700 0 744Z' fill='%23fff'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 800' preserveAspectRatio='none'%3E%3Cpath d='M0 70C260 20 520 40 760 80S1220 130 1440 60V720C1200 780 940 756 700 736S220 700 0 744Z' fill='%23fff'/%3E%3C/svg%3E");
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}


.tv__arc {
  position: absolute;
  z-index: -1;
  top: 50%;
  left: max(-160px, calc(50% - 900px));
  width: min(820px, 62vw);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 253, 249, .9) 0%, rgba(250, 242, 233, .55) 45%, rgba(250, 242, 233, 0) 68%);
  transform: translate3d(0, calc(-50% + var(--py, 0px)), 0);
  pointer-events: none;
}

.tv__arc--line {
  width: min(700px, 54vw);
  left: max(-60px, calc(50% - 780px));
  background: none;
  box-shadow: inset 0 0 0 1px rgba(196, 168, 128, .45);
  -webkit-mask-image: linear-gradient(200deg, #000 30%, transparent 75%);
  mask-image: linear-gradient(200deg, #000 30%, transparent 75%);
}

.tv__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
  gap: clamp(40px, 5vw, 96px);
  align-items: center;
}

.tv__copy .lead { margin-top: 1rem; max-width: 32em; }

.tv__copy .h2 { max-width: 13em; }

.tv__copy .btn { margin-top: 2rem; }

.tv__media { position: relative; }

.tv__media::before {
  content: '';
  position: absolute;
  top: -16px;
  left: -16px;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 36px;
  box-shadow: inset 0 0 0 1px rgba(196, 168, 128, .55);
  pointer-events: none;
}

.guests {
  position: relative;
  z-index: 2;
  margin-top: calc(-1 * clamp(40px, 4vw, 70px));
  padding: clamp(40px, 4vw, 70px) 0 clamp(110px, 9vw, 150px);
  overflow-x: clip;
  isolation: isolate;
}

.silk--guests { left: -6%; width: 112%; top: 0; height: 100%; }

.guests__halo {
  position: absolute;
  z-index: -1;
  left: 50%;
  top: 50%;
  width: min(1100px, 86vw);
  aspect-ratio: 2 / 1;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(244, 233, 222, .9), rgba(244, 233, 222, 0));
  transform: translate3d(-50%, calc(-50% + var(--py, 0px)), 0);
  pointer-events: none;
}

.leaf--guests {
  z-index: -1;
  right: 2%;
  top: 30px;
  width: 150px;
  height: 248px;
  color: rgba(184, 157, 119, .2);
  transform: translate3d(0, var(--py, 0px), 0) rotate(-150deg);
}

.guests__title { font-size: clamp(2.5rem, 1.5rem + 2.8vw, 4rem); }

.guests__title::after {
  content: '';
  display: block;
  width: 120px;
  height: 1px;
  margin: 22px auto 0;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
}

.guest-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(24px, 3.4vw, 56px);
  margin-top: clamp(48px, 5vw, 76px);
  padding: 12px 12px 40px 12px;
}

.guest:nth-child(2) { margin-top: 44px; }

.guest:nth-child(3) { margin-top: 14px; }

.guest:nth-child(4) { margin-top: 58px; }

.guest figure { margin: 0; }

.guest__frame {
  position: relative;
  aspect-ratio: 640 / 840;
  border-radius: 999px 999px 26px 26px;
  transition: transform .55s var(--ease);
}

.guest__frame::before {
  content: '';
  position: absolute;
  inset: -12px 12px 12px -12px;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px rgba(196, 168, 128, .6);
  transition: transform .55s var(--ease);
  pointer-events: none;
}

.guest__clip {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border-radius: inherit;
  box-shadow: 0 30px 56px -32px rgba(96, 66, 44, .5), 0 0 0 1px rgba(255, 255, 255, .6);
  transition: box-shadow .55s var(--ease);
}

.guest__clip img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 0%;
  transition: transform .9s var(--ease);
}

.guest__name {
  margin-top: 22px;
  text-align: center;
  font: 500 clamp(1.4rem, 1.1rem + .6vw, 1.75rem)/1.15 var(--serif);
  color: var(--ink);
}

.guest__name::before {
  content: '';
  display: block;
  width: 28px;
  height: 1px;
  margin: 0 auto 12px;
  background: var(--gold);
  opacity: .7;
}

.modal--info .modal__inner {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
}

.info__media { position: relative; min-height: 420px; overflow: hidden; }

.info__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.modal--info[open] .info__media img { animation: kenburns 14s linear both; }

.info__body { padding: clamp(28px, 4vw, 52px); align-self: center; }

.info__body .lead { margin-top: 1rem; }

.info__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 1.8rem; }

.demo-note {
  margin-top: 1.4rem;
  padding: 12px 14px;
  border-radius: 14px;
  font-size: .82rem;
  line-height: 1.5;
  color: var(--mocha);
  background: rgba(239, 227, 218, .6);
}

.demo-note:empty { display: none; }

@media (hover: hover) and (pointer: fine) {
  .guest:hover .guest__frame { transform: translateY(-6px); }
  .guest:hover .guest__frame::before { transform: translate(-4px, 4px); }
  .guest:hover .guest__clip { box-shadow: 0 40px 66px -32px rgba(96, 66, 44, .6), 0 0 0 1px rgba(255, 255, 255, .7); }
  .guest:hover .guest__clip img { transform: scale(1.04); }
}

@media (min-width: 1700px) {
  .life__figure { height: 90%; }
}

@media (max-width: 1200px) {
  .services-grid { grid-template-columns: 1fr; gap: 36px; }
  .services-intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 48px; align-items: end; padding-top: 24px; }
  .services-intro .eyebrow,
  .services-intro .h2 { grid-column: 1; }
  .services-intro .lead { grid-column: 2; grid-row: 2; margin: 0; }
  .services-intro .text-link { grid-column: 2; grid-row: 3; justify-self: start; }
  .hero-visual {
    left: 26%;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .25) 16%, rgba(0, 0, 0, .8) 36%, #000 48%);
    mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .25) 16%, rgba(0, 0, 0, .8) 36%, #000 48%);
  }
  .hero-note { left: 52%; top: 30%; }
  .concept-badge { right: -7%; }
  .life { margin-top: -10px; height: clamp(820px, 84vw, 960px); }
  .life__figure { left: -96px; }
  .life__inner { grid-template-columns: minmax(0, .96fr) minmax(0, 1.04fr); row-gap: 28px; align-content: center; }
  .life__copy { grid-column: 2; }
  .life .check-list { grid-column: 2; }
  .tv__grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
  .guest-grid { gap: 24px; }
  .tech__visual { margin-right: 10%; }
  .concept-badge { right: -5%; }
}

@media (max-width: 820px) {
  .hero { flex-direction: column; align-items: stretch; min-height: 0; padding: 0 0 clamp(96px, 22vw, 130px); }
  .hero-visual {
    position: relative;
    inset: auto;
    top: 0;
    width: 100%;
    margin-top: var(--hh);
    height: clamp(400px, 64svh, 580px);
    -webkit-mask-image: linear-gradient(180deg, #000 64%, rgba(0, 0, 0, .55) 82%, transparent 100%);
    mask-image: linear-gradient(180deg, #000 64%, rgba(0, 0, 0, .55) 82%, transparent 100%);
  }
  .hero-frame { inset: 0; }
  .hero-img { object-position: 84% 20%; transform: none; }
  .drape { display: none; }
  .hero-inner { margin-top: -96px; }
  .hero-copy { max-width: 560px; }
  .hero-note { top: calc(var(--hh) + clamp(400px, 64svh, 580px) - 74px); left: auto; right: 5%; font-size: clamp(1.7rem, 6.4vw, 2.3rem); transform: rotate(-12deg); }
  .side-mark, .sparkle--2 { display: none; }
  .hero-actions { gap: 18px 26px; margin-top: 1.8rem; }
  .trust { margin-top: 2rem; gap: 12px 22px; }
  .services { margin-top: -20px; }
  .services-intro { display: block; }
  .services-intro .lead { margin-top: 1rem; }
  .services-intro .text-link { margin-top: 1.4rem; }
  .silk--services { left: -60%; width: 220%; }
  .silk--services .ribbon-line { display: none; }
  .life {
    --lifebg: clamp(520px, 136vw, 780px);
    height: auto;
    margin-top: 46px;
  }
  .life__bg {
    bottom: auto;
    height: var(--lifebg);
  }
  .life__bg-move { inset: -30px -20px; }
  .life__bg-move img { object-position: 30% 60%; }
  .life__waves--back { height: var(--lifebg); }
  .life__waves--front { top: calc(var(--lifebg) - 700px); bottom: auto; height: 760px; }
  .life__veil { display: none; }
  .life__figure { top: -34px; left: 50%; height: calc(var(--lifebg) * .86); translate: -61% 0; }
  .grass--l { display: none; }
  .grass--r { bottom: auto; top: calc(var(--lifebg) - 220px); width: 130px; height: 112px; right: 2%; }
  .life__inner {
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
    height: auto;
    padding: calc(var(--lifebg) + 10px) 0 30px;
  }
  .life__copy, .life .check-list { grid-column: 1; }
  .tech { margin-top: 0; padding-top: 60px; padding-bottom: 90px; }
  .tech__grid { grid-template-columns: 1fr; gap: 72px; }
  .tech__visual { width: min(100% - 70px, 420px); margin: 0 auto; }
  .concept-badge { right: -40px; top: -20px; width: 116px; }
  .tech__arc { top: 72%; right: -40%; width: 140vw; }
  .silk--tech { left: -60%; width: 220%; }
  .leaf--tech-blur { width: 140px; height: 230px; right: -30px; }
  .tv { margin-top: -40px; padding: 120px 0 120px; }
  .tv__grid { grid-template-columns: 1fr; gap: 44px; }
  .tv__media::before { inset: -10px 10px auto -10px; border-radius: 30px; }
  .tv__arc { top: 30%; width: 120vw; left: -40%; }
  .tv__arc--line { width: 96vw; left: -20%; }
  .guests { padding-bottom: 96px; }
  .guest-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 22px; }
  .guest:nth-child(2) { margin-top: 36px; }
  .guest:nth-child(3) { margin-top: 0; }
  .guest:nth-child(4) { margin-top: 36px; }
  .guest__frame::before { inset: -8px 8px 8px -8px; }
  .guest__name { margin-top: 16px; }
  .leaf--guests { width: 100px; height: 166px; right: -20px; }
  .silk--guests { left: -60%; width: 220%; }
  .modal--info .modal__inner { grid-template-columns: 1fr; }
  .info__media { min-height: 0; aspect-ratio: 16 / 10; }
}

@media (max-width: 560px) {
  .hero-title { font-size: clamp(2.9rem, 12.5vw, 3.6rem); }
  .hero-actions .btn { width: 100%; }
  .trust { display: grid; gap: 12px; }
}

.ribbon--hero { stroke-width: 34; opacity: .92; }

.ribbon--hero2 { stroke-width: 16; opacity: .7; }

.life__panel {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  max-width: none;
  overflow: visible;
  pointer-events: none;
}

.lp-fill { fill: rgba(252, 248, 243, .74); filter: url(#f-soft); }

.lp-ribbon {
  fill: none;
  stroke: url(#g-ribbon);
  stroke-width: 26;
  stroke-linecap: round;
  vector-effect: non-scaling-stroke;
  opacity: .85;
}

.lp-line { opacity: .9; }

@media (min-width: 821px) {
  .hero { min-height: clamp(680px, 34vw + 250px, 940px); }
  .hero-visual {
    top: var(--hh);
    left: auto;
    right: 0;
    bottom: auto;
    width: max(84vw, 860px);
    aspect-ratio: 1672 / 941;
    -webkit-mask-image:
      linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .18) 14%, rgba(0, 0, 0, .7) 30%, #000 42%),
      linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .65) 9%, #000 18%);
    -webkit-mask-composite: source-in;
    mask-image:
      linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .18) 14%, rgba(0, 0, 0, .7) 30%, #000 42%),
      linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .65) 9%, #000 18%);
    mask-composite: intersect;
  }
  .hero-frame { inset: -3% -2.5% -3% -2.5%; }
  .hero-img { object-position: 100% 0%; }
  .hero-title { font-size: clamp(3.1rem, 1.4rem + 4.25vw, 5.7rem); }
  .hero-note { left: calc(50% - 20px); top: 34%; }
  .services { margin-top: -54px; }
  .services-grid { grid-template-columns: minmax(0, .98fr) minmax(0, 1.9fr); gap: clamp(32px, 3.4vw, 56px); }
  .services .h2 { font-size: clamp(2.2rem, 1.2rem + 1.85vw, 2.85rem); }
  .life {
    height: clamp(760px, 53vw, 960px);
    margin-top: calc(-1 * clamp(110px, 10.5vw, 170px));
  }
  .life__figure { top: -3%; height: 97%; }
  .life__veil { opacity: .55; }
  .life__inner { padding: clamp(160px, 14vw, 230px) 0 clamp(90px, 8vw, 130px); }
  .tech { padding: clamp(80px, 7.5vw, 120px) 0 clamp(30px, 2.4vw, 44px); }
  .tech__grid { grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); }
  .tech__visual {
    width: min(100%, 590px);
    aspect-ratio: 5 / 5.8;
    margin-right: 5%;
    margin-bottom: calc(-1 * clamp(80px, 8vw, 140px));
    z-index: 2;
  }
  .tech__frame img { object-position: 60% 46%; transform: translate3d(0, calc(var(--py, 0px) * -1.3), 0) scale(1.2); }
  .tech__ring--1 { inset: -34px -34px 60px -34px; }
  .tech__ring--2 { inset: -76px -84px 110px -84px; }
  .concept-badge { width: clamp(140px, 12.5vw, 196px); right: -14%; top: 6%; font-size: clamp(1.05rem, .7rem + .65vw, 1.45rem); }
  .tv { margin-top: calc(-1 * clamp(40px, 4vw, 70px)); padding-top: clamp(170px, 15vw, 240px); }
}

@media (min-width: 821px) and (max-width: 1200px) {
  .hero-visual { width: max(92vw, 760px); }
  .services-grid { grid-template-columns: 1fr; }
  .life { height: clamp(860px, 86vw, 980px); margin-top: -10px; }
  .life__figure { top: 0; height: 90%; }
  .life__panel { display: none; }
  .life__veil { opacity: 1; }
  .tech__visual { margin-right: 10%; }
  .concept-badge { right: -5%; }
}

@media (max-width: 820px) {
  .ribbon--hero2 { display: none; }
  .sparkle { display: none; }
  .life__panel { display: none; }
  .tech__frame img { transform: translate3d(0, calc(var(--py, 0px) * -1.3), 0) scale(1.14); }
}

.hero-img { filter: brightness(1.07) saturate(.74) contrast(.94) sepia(.06); }

.life__bg-move img { filter: saturate(.7) brightness(1.13) contrast(.9) sepia(.05); }

.life__figure img { filter: drop-shadow(0 30px 40px rgba(120, 82, 52, .16)) brightness(1.04) saturate(.9); }

.tech__plate { display: none; }

.tech__machine {
  position: absolute;
  z-index: 2;
  left: 13%;
  bottom: -6%;
  width: 74%;
  aspect-ratio: 575 / 901;
  transform: translate3d(0, var(--py, 0px), 0);
  filter: drop-shadow(0 34px 34px rgba(60, 40, 28, .32)) drop-shadow(0 6px 10px rgba(60, 40, 28, .18));
}

.tech__machine img { width: 100%; height: 100%; object-fit: contain; }

.tech__machine {
  -webkit-mask-image: linear-gradient(180deg, #000 70%, rgba(0, 0, 0, .5) 84%, transparent 96%);
  mask-image: linear-gradient(180deg, #000 70%, rgba(0, 0, 0, .5) 84%, transparent 96%);
}

.tech__veil {
  position: absolute;
  z-index: 3;
  left: -30%;
  right: -30%;
  bottom: -4%;
  height: 34%;
  max-width: none;
  overflow: visible;
  pointer-events: none;
}

.drape--curtain {
  z-index: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 11vw;
  background:
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .6) 1.6vw, rgba(232, 219, 204, .3) 2.6vw, rgba(255, 255, 255, .8) 3.7vw, rgba(255, 255, 255, 0) 5vw),
    linear-gradient(90deg, rgba(251, 247, 242, 0) 0%, rgba(251, 247, 242, .88) 42%, #fbf7f2 100%);
  filter: blur(5px);
  -webkit-mask-image: linear-gradient(180deg, #000 72%, transparent 97%);
  mask-image: linear-gradient(180deg, #000 72%, transparent 97%);
}

@media (min-width: 821px) {
  .hero {
    min-height: max(680px, 48vw);
    align-items: flex-start;
    padding: calc(var(--hh) + clamp(40px, 4.4vw, 80px)) 0 clamp(120px, 11vw, 190px);
  }
  .hero-visual {
    top: calc(var(--hh) - 7.9vw);
    left: 4.3vw;
    right: auto;
    bottom: auto;
    width: 81.25vw;
    aspect-ratio: 1672 / 941;
    -webkit-mask-image:
      linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .1) 22%, rgba(0, 0, 0, .62) 40%, #000 52%, #000 96%, transparent 100%),
      linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .7) 10%, #000 18%, #000 80%, transparent 100%);
    -webkit-mask-composite: source-in;
    mask-image:
      linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .1) 22%, rgba(0, 0, 0, .62) 40%, #000 52%, #000 96%, transparent 100%),
      linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .7) 10%, #000 18%, #000 80%, transparent 100%);
    mask-composite: intersect;
  }
  .hero-visual::after {
    background:
      radial-gradient(55% 60% at 30% 25%, rgba(255, 253, 249, .55), transparent 70%),
      linear-gradient(180deg, rgba(255, 252, 248, .3) 0%, transparent 30%);
  }
  .hero-frame { inset: -3%; }
  .hero-img { object-position: 50% 50%; }
  .hero-copy { max-width: 720px; }
  .hero-title {
    font-size: clamp(3.3rem, 1.2rem + 5.4vw, 7rem);
    color: #2b2522;
    letter-spacing: -.02em;
  }
  .hero-copy .lead { font-size: clamp(1.02rem, .78rem + .42vw, 1.26rem); color: #4b443f; max-width: 29em; margin-top: 1.4rem; }
  .hero-actions { margin-top: 2rem; }
  .trust { margin-top: 2.2rem; }
  .hero-note { left: 45%; top: 31%; }
  .side-mark { top: 62%; }
  .services { margin-top: -30px; }
  .services-grid { grid-template-columns: minmax(0, .95fr) minmax(0, 1.62fr); gap: clamp(32px, 3.8vw, 56px); }
  .services .h2 { font-size: clamp(2.2rem, 1.25rem + 1.75vw, 2.75rem); }
  .life {
    height: clamp(700px, 48vw, 900px);
    margin-top: calc(-1 * clamp(90px, 8.5vw, 140px));
  }
  .life__figure { top: -1%; height: 92%; }
  .life__inner {
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.12fr) minmax(0, .72fr);
    padding: clamp(150px, 12.5vw, 200px) 0 clamp(80px, 7vw, 120px);
  }
  .life .h2--xl { font-size: clamp(2.6rem, 1.5rem + 2.4vw, 3.6rem); }
  .tech { z-index: 2; padding: clamp(70px, 6vw, 100px) 0 clamp(20px, 2vw, 30px); }
  .tech__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .tech .h2 { font-size: clamp(2.3rem, 1.2rem + 2vw, 3.1rem); }
  .tech__visual {
    width: min(100%, 540px);
    aspect-ratio: 1 / 1.05;
    justify-self: end;
    margin-right: 6%;
    margin-bottom: calc(-1 * clamp(70px, 6vw, 110px));
  }
  .tech__frame {
    inset: 0;
    border-radius: 999px 999px 0 0;
    box-shadow: none;
    -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent 96%);
    mask-image: linear-gradient(180deg, #000 55%, transparent 96%);
  }
  .tech__frame::after { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .6); }
  .tech__frame img { filter: blur(5px) brightness(1.14) saturate(.72); transform: translate3d(0, calc(var(--py, 0px) * -1.2), 0) scale(1.14); }
  .tech__ring--1 { inset: -26px -26px 30% -26px; }
  .tech__ring--2 { inset: -62px -70px 36% -70px; }
  .concept-badge { width: clamp(140px, 12.2vw, 190px); top: 4%; right: -12%; }
  .leaf--tech-blur { bottom: 40px; width: 230px; height: 380px; color: rgba(150, 118, 90, .32); }
  .tv { margin-top: calc(-1 * clamp(80px, 7.5vw, 130px)); padding-top: clamp(190px, 16vw, 260px); }
}

@media (min-width: 821px) and (max-width: 1200px) {
  .services-grid { grid-template-columns: 1fr; }
  .life { height: clamp(860px, 86vw, 980px); margin-top: -10px; }
  .life__inner { grid-template-columns: minmax(0, .96fr) minmax(0, 1.04fr); }
  .concept-badge { right: -4%; }
  .hero-visual { left: auto; right: -6vw; width: 94vw; top: calc(var(--hh) - 3vw); }
  .hero-img { object-position: 70% 30%; }
  .drape--curtain { display: none; }
  .hero-copy { max-width: 54%; }
  .hero-copy .lead { max-width: 24em; }
  .hero-note { left: 56%; top: 24%; }
  .tech { padding-top: clamp(110px, 11vw, 140px); }
}

@media (max-width: 820px) {
  .tech__visual { aspect-ratio: 1 / 1.05; width: min(100% - 60px, 400px); }
  .tech__frame { border-radius: 999px 999px 0 0; -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent 96%); mask-image: linear-gradient(180deg, #000 55%, transparent 96%); }
  .tech__frame img { filter: blur(4px) brightness(1.14) saturate(.72); }
  .tech__machine { bottom: 0; }
}

@media (min-width: 821px) {
  .tech__copy { align-self: start; padding-top: 0; }
  .tech { padding-bottom: clamp(90px, 7.5vw, 120px); }
}

.hero-img { filter: brightness(1.03) saturate(.94); }

@media (min-width: 821px) {
  .hero-visual {
    -webkit-mask-image:
      linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .08) 16%, rgba(0, 0, 0, .55) 32%, rgba(0, 0, 0, .94) 44%, #000 50%),
      linear-gradient(180deg, transparent 0%, #000 9%, #000 90%, transparent 100%);
    -webkit-mask-composite: source-in;
    mask-image:
      linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .08) 16%, rgba(0, 0, 0, .55) 32%, rgba(0, 0, 0, .94) 44%, #000 50%),
      linear-gradient(180deg, transparent 0%, #000 9%, #000 90%, transparent 100%);
    mask-composite: intersect;
  }
  .hero-visual::after {
    background: radial-gradient(45% 60% at 18% 40%, rgba(253, 249, 244, .45), transparent 70%); }
  .drape--curtain { display: none; }
}

@media (min-width: 1201px) {
  .hero-visual { left: auto; right: 0; width: 84vw; }
}

.guests:has(+ .gv) { padding-bottom: clamp(20px, 2vw, 36px); }
.gv--fooldal { padding: clamp(20px, 2.5vw, 40px) 0 clamp(110px, 9vw, 150px); }
.gv--fooldal .gv__head .h2 { font-size: clamp(2.3rem, 1.5rem + 2.2vw, 3.4rem); }
@media (max-width: 820px) {
  .gv--fooldal { padding-bottom: 96px; }
}

.tech__frame--feny {
  background:
    radial-gradient(70% 55% at 50% 30%, rgba(255, 252, 247, .95) 0%, rgba(250, 242, 233, .8) 45%, transparent 75%),
    linear-gradient(180deg, #f6ece2 0%, #efe2d5 70%, #ebdccd 100%);
}
.tech__machine--valodi { left: 27%; width: 46%; aspect-ratio: 900 / 2026; bottom: -6%; filter: none; }
.tech__machine--valodi::before {
  content: '';
  position: absolute;
  z-index: -1;
  left: -18%;
  right: -18%;
  bottom: 9%;
  height: 9%;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(60, 40, 28, .32), rgba(60, 40, 28, .12) 55%, transparent);
  filter: blur(6px);
}
.tech__machine--valodi img { position: relative; }
