/* A single viewport: typography and the original landscape share the stage. */
html[data-design=landscape] .site-home { background: #eeeee5; }
.zondo-home {
  --site-ink: #303624;
  --site-paper: #f7f4ed;
  min-height: 100svh;
  padding: 14px 26px;
  color: var(--site-ink);
  background: #eeeee5;
}
.home-edition-frame {
  min-height: max(630px, calc(100svh - 28px - var(--review-height, 0px)));
  padding: 0 26px;
  border: 1px solid #bdc2b1;
  display: grid;
  grid-template-rows: 88px minmax(min-content, 1fr) 44px;
}
.site-masthead { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.site-wordmark { display: inline-flex; align-items: center; gap: 6px; font: 44px/1 'Instrument Serif', Georgia, serif; letter-spacing: -1.4px; }
.site-wordmark .design-mark { width: 28px; height: 34px; }
.site-masthead > p { font-size: 11px; margin-left: -40px; }
.site-start { display: flex; align-items: center; justify-content: space-between; min-height: 44px; width: 112px; border-bottom: 1px solid #727a62; font-size: 12px; }
.site-start svg { width: 17px; height: 17px; }
.site-landscape {
  position: relative;
  isolation: isolate;
  border-radius: 24px;
  overflow: hidden;
  padding: clamp(22px, 3.4svh, 36px);
  background: #9a9e80;
}
.site-landscape .welcome-scene { position: absolute; }
.site-landscape::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, transparent 40%, #26321d60); pointer-events: none; }
.site-sheet {
  width: min(43%, 464px);
  padding: clamp(24px, 3.4svh, 36px);
  border-radius: 18px;
  background: #f7f4edf5;
}
.site-eyebrow { font: 400 9px/1.6 'Manrope', sans-serif; text-transform: uppercase; letter-spacing: .09em; }
.site-sheet h1 { margin-top: clamp(17px, 2.5svh, 26px); font: 400 clamp(54px, 8.4svh, 88px)/.94 'Instrument Serif', Georgia, serif; letter-spacing: -.035em; }
.site-sheet h1 em { display: block; margin-top: 4px; color: #6d7751; font-weight: 400; }
.site-description { max-width: 352px; margin-top: clamp(22px, 3.5svh, 34px); font-size: 12px; line-height: 1.85; text-wrap: pretty; }
.site-cta { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 24px; padding: 16px 22px; min-height: 54px; border-radius: 30px; background: #333e27; color: #f7f4ed; font-size: 13px; transition: background .2s; }
.site-cta:hover { background: #4b5935; }
.site-cta svg { width: 19px; height: 19px; }
.site-micro { margin-top: 12px; text-align: center; font-size: 9px; line-height: 1.5; color: #626b55; }
.site-inscription { position: absolute; right: 6%; top: 31%; width: 43%; color: #39432d; text-align: center; }
.site-inscription > p { font: italic 400 clamp(35px, 3.8vw, 60px)/1.1 'Instrument Serif', Georgia, serif; letter-spacing: -.025em; }
.site-inscription > span { display: block; margin-top: 14px; font-size: 11px; line-height: 1.6; }
.site-capabilities { position: absolute; left: 53%; bottom: 36px; right: 4%; color: #f9f6e9; }
.site-capabilities > p { font: 400 clamp(26px, 2.4vw, 38px)/1.06 'Instrument Serif', Georgia, serif; letter-spacing: -.015em; }
.site-capabilities ul { display: flex; flex-wrap: wrap; gap: 7px; margin: 20px 0 0; padding: 0; list-style: none; }
.site-capabilities li { border: 1px solid #f5f1df7a; border-radius: 24px; padding: 9px 15px; font-size: 10px; line-height: 1.4; background: #26321d22; }
.site-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 8px; color: #58604a; }
@media (min-width: 901px) and (max-height: 760px) {
  .home-edition-frame { min-height: max(590px, calc(100svh - 28px - var(--review-height, 0px))); grid-template-rows: 70px minmax(min-content, 1fr) 44px; }
  .site-landscape { padding: 22px; }
  .site-sheet { padding: 24px; }
  .site-sheet h1 { font-size: 58px; margin-top: 17px; }
  .site-description { margin-top: 22px; font-size: 11px; }
  .site-cta { margin-top: 19px; min-height: 50px; padding-top: 13px; padding-bottom: 13px; }
  .site-micro { margin-top: 9px; }
}
@media (max-width: 1100px) and (min-width: 701px) {
  .zondo-home { padding: 12px 16px; }
  .home-edition-frame { min-height: max(630px, calc(100svh - 24px - var(--review-height, 0px))); padding: 0 20px; }
  .site-landscape { padding: 24px; }
  .site-sheet { width: 50%; padding: 26px; }
  .site-sheet h1 { font-size: clamp(54px, 6.4vw, 70px); }
  .site-inscription { right: 3%; width: 41%; }
  .site-capabilities { left: 57%; bottom: 28px; right: 24px; }
  .site-capabilities ul { gap: 5px; }
  .site-capabilities li { padding: 7px 11px; font-size: 9px; }
}
@media (max-width: 700px) {
  .zondo-home { padding: 10px; }
  .home-edition-frame { min-height: max(590px, calc(100svh - 20px - var(--review-height, 0px))); padding: 0 10px; grid-template-rows: 65px minmax(min-content, 1fr) 44px; }
  .site-masthead { gap: 12px; padding: 0 3px; }
  .site-wordmark { font-size: 34px; gap: 3px; }
  .site-wordmark .design-mark { width: 23px; height: 28px; }
  .site-masthead > p { display: none; }
  .site-start { width: 98px; font-size: 10px; }
  .site-landscape { padding: 120px 12px 12px; border-radius: 18px; display: flex; align-items: flex-end; }
  .site-landscape .welcome-scene img { object-position: 64% center; }
  .site-sheet { width: 100%; padding: 26px 22px 23px; border-radius: 13px; text-align: center; background: #f7f4edf7; }
  .site-eyebrow { font-size: 8px; }
  .site-sheet h1 { margin-top: 17px; font-size: clamp(46px, 13.2vw, 70px); line-height: .98; letter-spacing: -.035em; }
  .site-sheet h1 em { margin-top: 9px; font-size: .65em; white-space: nowrap; letter-spacing: -.025em; }
  .site-desktop-break { display: none; }
  .site-description { max-width: 360px; margin: 21px auto 0; font-size: 11px; line-height: 1.8; }
  .site-cta { min-height: 50px; margin-top: 23px; padding: 14px 19px; text-align: left; }
  .site-micro { font-size: 8px; margin-top: 10px; }
  .site-inscription { top: 8%; right: 0; width: 100%; padding: 0 12px; }
  .site-inscription > p { font-size: 34px; }
  .site-inscription > span { font-size: 9px; margin-top: 7px; }
  .site-capabilities { display: none; }
  .site-footer { gap: 7px; font-size: 7px; }
}
@media (max-width: 700px) and (max-height: 740px) {
  .home-edition-frame { grid-template-rows: 54px minmax(min-content, 1fr) 44px; }
  .site-sheet { padding: 20px 18px 19px; }
  .site-sheet h1 { font-size: clamp(44px, 12.8vw, 58px); margin-top: 14px; }
  .site-description { margin-top: 17px; font-size: 10px; }
  .site-cta { margin-top: 18px; }
  .site-inscription { top: 7%; }
  .site-inscription > p { font-size: 28px; }
  .site-inscription > span { display: none; }
}
@media (prefers-reduced-motion: reduce) { .site-cta { transition: none; } }