.welcome {
  min-height: 100svh;
  padding: 40px 16px;
  overflow: clip;
  display: grid;
  place-items: center;
  background: #fcfcfa;
  scroll-margin-top: 0;
}
.welcome h2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0;
  font-family: "Tel Aviv Modernist", sans-serif;
  font-size: 144px;
  line-height: .9;
  font-weight: 700;
  letter-spacing: 0;
}
.welcome h2 strong { font-weight: 700; color: var(--coral); }
.welcome h2 > * { display: block; white-space: nowrap; }
.welcome.is-animated h2 > * {
  opacity: 0;
  transform: translateX(100vw);
}
.welcome.is-animated h2 > :nth-child(even) { transform: translateX(-100vw); }
.welcome.is-animated.is-visible h2 > * {
  opacity: 1;
  transform: translateX(0);
  transition: transform 950ms cubic-bezier(.16, 1, .3, 1), opacity 350ms ease;
  transition-delay: var(--line-delay, 0ms);
}
@media (prefers-reduced-motion: reduce) {
  .welcome.is-animated h2 > :nth-child(n) { opacity: 1; transform: none; transition: none; }
}
.promise { padding: 96px var(--gutter); background: #e8eee9; }
.promise-inner { max-width: 1080px; margin: auto; text-align: center; }
.promise h2 { max-width: 780px; font: 700 72px/1.08 "Tel Aviv Modernist", sans-serif; letter-spacing: 0; margin: 0 auto 64px; }
.promise-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; }
.promise-steps p { border-top: 1px solid #a8b7ac; padding-top: 24px; font-size: 27px; line-height: 1.5; font-weight: 650; }
.promise-steps span { display: block; margin-top: 16px; font-size: 20px; font-weight: 400; color: #48594e; }
.promise-finish { max-width: 850px; margin: 48px auto 32px; font: 500 48px/1.2 "Tel Aviv Modernist", sans-serif; }
.explore-links { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 48px; }
.explore-link { min-width: 0; border: 1px solid #a8b7ac; border-radius: 8px; padding: 20px; background: #fcfcfa; transition: border-color .25s, background .25s; }
.explore-link:hover, .explore-link:focus-visible { border-color: var(--coral); background: #fff; }
.explore-label { display: flex; justify-content: space-between; align-items: center; gap: 8px; font: 700 25px/1.2 "Tel Aviv Modernist", sans-serif; }
.explore-label > span { font: 400 24px/1 "Tel Aviv Modernist", sans-serif; transition: transform .25s; }
.explore-link:hover .explore-label > span { transform: translateX(-4px); }
.explore-art { position: relative; display: flex; align-items: center; justify-content: center; height: 116px; margin-bottom: 24px; overflow: hidden; color: var(--coral); }
.type-composition { position: relative; display: grid; width: min(100%, 148px); gap: 12px; }
.type-composition b { display: block; color: var(--ink); font: 700 58px/1 "Tel Aviv Modernist", sans-serif; animation: type-compose 6s cubic-bezier(.22, 1, .36, 1) infinite; }
.type-baseline { height: 1px; background: var(--coral); transform-origin: right; animation: type-rule 6s cubic-bezier(.22, 1, .36, 1) infinite; }
.type-copy { display: grid; gap: 5px; }
.type-copy i { height: 2px; width: 78%; background: #a8b7ac; transform-origin: right; animation: type-rule 6s cubic-bezier(.22, 1, .36, 1) infinite; }
.type-copy i:last-child { width: 48%; animation-delay: .12s; }
.art-process { gap: 12px; }
.art-process::before { content: ""; position: absolute; width: 140px; height: 1px; background: #a8b7ac; }
.art-process i { z-index: 1; width: 30px; height: 30px; border: 2px solid var(--coral); border-radius: 50%; background: #fcfcfa; animation: process-beat 3s ease-in-out infinite; }
.art-process i:nth-child(2) { animation-delay: .35s; }
.art-process i:nth-child(3) { animation-delay: .7s; }
.price-composition { display: grid; width: min(100%, 168px); }
.price-line { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 32px; border-bottom: 1px solid #d8dfd9; animation: quote-row 6s cubic-bezier(.22, 1, .36, 1) infinite; }
.price-line:nth-child(2) { animation-delay: .18s; }
.price-line:nth-child(3) { animation-delay: .36s; border-color: var(--coral); }
.price-line > i { width: 26px; height: 2px; flex-shrink: 0; background: #a8b7ac; }
.price-line b { display: flex; align-items: baseline; gap: 5px; direction: ltr; color: var(--ink); font: 500 19px/1.2 "Tel Aviv Modernist", sans-serif; font-variant-numeric: tabular-nums; }
.price-line small { color: var(--coral); font-size: 11px; }
.art-pages i { position: absolute; width: 68px; height: 78px; border: 1px solid #5c7063; border-radius: 4px; background: #e8eee9; transform: translate(-18px, 6px) rotate(-12deg); }
.art-pages i:nth-child(2) { transform: translate(18px, 6px) rotate(12deg); }
.art-pages i:last-child { background: #fcfcfa; transform: none; animation: page-tilt 4s ease-in-out infinite; }
.art-pages i::before { content: ""; position: absolute; inset: 12px 10px auto; height: 24px; background: #b84f2a; }
.art-pages i::after { content: ""; position: absolute; inset: 44px 10px auto; height: 12px; border-block: 2px solid #a8b7ac; }
@keyframes type-compose { 0%, 8% { opacity: .25; transform: translateY(8px); clip-path: inset(0 0 0 55%); } 30%, 82% { opacity: 1; transform: none; clip-path: inset(0); } 100% { opacity: .25; transform: translateY(8px); clip-path: inset(0 0 0 55%); } }
@keyframes type-rule { 0%, 12% { transform: scaleX(.2); opacity: .3; } 38%, 82% { transform: scaleX(1); opacity: 1; } 100% { transform: scaleX(.2); opacity: .3; } }
@keyframes process-beat { 0%, 65%, 100% { transform: scale(1); background: #fcfcfa; } 30% { transform: scale(1.18); background: var(--coral); } }
@keyframes quote-row { 0%, 8% { opacity: .15; transform: translateY(5px); } 28%, 80% { opacity: 1; transform: none; } 100% { opacity: .15; transform: translateY(5px); } }
@keyframes page-tilt { 0%, 100% { transform: rotate(-4deg) translateY(2px); } 50% { transform: rotate(4deg) translateY(-5px); } }
@media (prefers-reduced-motion: reduce) { .explore-art * { animation: none; } }
.page-links { display: flex; justify-content: center; flex-wrap: wrap; gap: 24px 48px; padding: 36px var(--gutter); border-bottom: 1px solid var(--line); }
.page-links a { padding: 8px 0; }
.page-links a:hover { color: var(--coral-dark); }
.inner-heading { padding: 140px var(--gutter) 48px; max-width: 1464px; margin: auto; }
.inner-heading > a { text-decoration: underline; text-underline-offset: 5px; }
.inner-heading h1 { font: 700 72px/1.1 "Tel Aviv Modernist", sans-serif; margin: 24px 0 0; }
.inner-cta { padding: 48px var(--gutter); text-align: center; }
@media (min-height: 900px) and (min-width: 701px) { .welcome h2 { font-size: 176px; } }
@media (max-width: 1100px) {
  .site-header { grid-template-columns: 1fr auto; row-gap: 4px; border-radius: 24px; }
  .site-header nav { display: flex; grid-column: 1 / -1; grid-row: 2; justify-content: center; flex-wrap: wrap; gap: 8px 20px; padding-bottom: 6px; }
  .site-header nav a { font-size: 14px; }
  .promise-steps { gap: 24px; }
}
@media (max-width: 700px) {
  .welcome { padding-top: 48px; padding-bottom: 48px; }
  .welcome h2 { font-size: 108px; }
  .promise { padding: 64px 24px; }
  .promise h2 { font-size: 48px; margin-bottom: 40px; }
  .promise-steps { grid-template-columns: 1fr; gap: 16px; }
  .promise-steps p { font-size: 25px; margin-bottom: 16px; }
  .promise-steps span { font-size: 19px; margin-top: 8px; }
  .promise-finish { font-size: 36px; margin-top: 32px; }
  .explore-links { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 32px; }
  .explore-link { padding: 16px 12px; }
  .explore-art { height: 96px; margin-bottom: 16px; }
  .explore-label { font-size: 22px; }
  .art-process { gap: 8px; }
  .art-process i { width: 24px; height: 24px; }
  .art-process::before { width: 88px; }
  .inner-heading h1 { font-size: 52px; }
  .site-header nav { gap: 5px 10px; flex-wrap: nowrap; }
  .site-header nav a { font-size: 12px; white-space: nowrap; }
  .inner-heading { padding-top: 160px; }
}
@media (max-width: 360px) {
  .welcome h2 { font-size: 92px; }
  .explore-label { font-size: 18px; gap: 4px; }
  .explore-label > span { font-size: 20px; }
  .price-line { gap: 6px; }
  .price-line > i { width: 16px; }
  .price-line b { font-size: 16px; }
  .type-composition b { font-size: 46px; }
}
@media (max-height: 700px) and (min-width: 701px) { .welcome h2 { font-size: 124px; } }
@media (max-height: 520px) { .welcome h2 { font-size: 88px; } }
.intro-vav { position: relative; }
.intro-vav::after { content: ""; position: absolute; left: 60%; top: 44%; width: .095em; height: .095em; border-radius: 50%; background: var(--paper-soft); transform: translate(-50%, -50%); }