/* Beyond App Studios — "Meadow" theme. Loaded after beyond.css and overrides it.
   Each page opens on its own painted landscape with the name set huge across the horizon,
   then continues on warm paper with soft, rounded surfaces. Inter Tight + Geist Mono. */
@font-face{font-family:"Inter Tight";font-weight:400;font-display:swap;src:url(fonts/it-400.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215}
@font-face{font-family:"Inter Tight";font-weight:400;font-display:swap;src:url(fonts/it-400-ext.woff2) format("woff2");unicode-range:U+0100-02AF,U+1E00-1EFF,U+20A0-20AB,U+20AD-20CF,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Inter Tight";font-weight:500;font-display:swap;src:url(fonts/it-500.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215}
@font-face{font-family:"Inter Tight";font-weight:500;font-display:swap;src:url(fonts/it-500-ext.woff2) format("woff2");unicode-range:U+0100-02AF,U+1E00-1EFF,U+20A0-20AB,U+20AD-20CF,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Inter Tight";font-weight:600;font-display:swap;src:url(fonts/it-600.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215}
@font-face{font-family:"Inter Tight";font-weight:600;font-display:swap;src:url(fonts/it-600-ext.woff2) format("woff2");unicode-range:U+0100-02AF,U+1E00-1EFF,U+20A0-20AB,U+20AD-20CF,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Inter Tight";font-weight:800;font-display:swap;src:url(fonts/it-800.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215}
@font-face{font-family:"Inter Tight";font-weight:800;font-display:swap;src:url(fonts/it-800-ext.woff2) format("woff2");unicode-range:U+0100-02AF,U+1E00-1EFF,U+20A0-20AB,U+20AD-20CF,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Geist Mono";font-weight:500;font-display:swap;src:url(fonts/gm-500.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+2000-206F,U+2191,U+2193}
@font-face{font-family:"Geist Mono";font-weight:500;font-display:swap;src:url(fonts/gm-500-ext.woff2) format("woff2");unicode-range:U+0100-02AF}

:root{
  --bg:#f4f1ea; --surface:#ebe6dc; --paper:#fbf9f5; --ink:#161512; --muted:#615c55;
  --display:"Inter Tight",system-ui,-apple-system,sans-serif;
  --text:"Inter Tight",system-ui,-apple-system,sans-serif;
  --mono:"Geist Mono",ui-monospace,Menlo,monospace;
  --step-head:clamp(2.4rem,1.2rem + 4.2vw,5rem);
  --step-big:clamp(3rem,1rem + 7vw,8rem);
  --step-huge:clamp(4.2rem,.5rem + 13vw,15rem);
  --r-card:28px; --r-ctrl:999px;
}
body{font-feature-settings:"ss01","cv11";letter-spacing:-.006em}
h1,h2,h3,h4{text-transform:none;font-weight:800;letter-spacing:-.045em;line-height:.95}
h3{letter-spacing:-.03em}
.lead{letter-spacing:-.012em}
.micro{font:500 11px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase}

/* ---------- announcement ticker above the nav */
.ticker{position:relative;z-index:60;background:var(--ink);color:#efe9dd;height:30px;overflow:hidden;display:flex;align-items:center}
.ticker-track{display:flex;gap:28px;white-space:nowrap;width:max-content;animation:tick 48s linear infinite;padding-left:28px}
.ticker-track span{font:500 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;display:inline-flex;align-items:center;gap:10px}
.ticker-track span::before{content:"";width:6px;height:6px;border-radius:50%;background:#ff7a3d}
.ticker-track b{font-weight:500;color:#ffb38a}
@keyframes tick{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.ticker-track{animation:none}}

/* ---------- nav floats over the landscape, turns to paper once you scroll */
.nav{background:transparent;transition:background-color .35s,box-shadow .35s,color .35s}
.nav.solid{background:rgba(244,241,234,.94);box-shadow:0 1px 0 rgba(22,21,18,.06)}
.nav .brand b{font:800 1.35rem/1 var(--display);text-transform:none;letter-spacing:-.04em}
.links a{font-weight:500}
.lang-btn{border-radius:999px;background:var(--ink)}
.menu-btn{border-radius:999px}
.scene-dark .nav:not(.solid){color:#fff}
.scene-dark .nav:not(.solid) .brand svg path,.scene-dark .nav:not(.solid) .brand svg g{stroke:#fff}
.scene-dark .nav:not(.solid) .menu-btn{color:#fff;box-shadow:inset 0 0 0 2px #fff}
@media (max-width:960px){.links{background:var(--ink)}}

/* ---------- the landscape opening */
.scene{position:relative;height:calc(100vh - 30px);height:calc(100svh - 30px);min-height:600px;margin-top:-64px;overflow:hidden;color:var(--ink);isolation:isolate}
.scene-art{position:absolute;inset:-4% 0 0 0;z-index:-1;transform:translateY(calc(var(--sp,0) * 14%)) scale(calc(1.06 - var(--sp,0) * .02))}
.scene-art img{width:100%;height:100%;object-fit:cover;object-position:center 72%}
.motion .scene-art img{animation:drift 26s ease-in-out infinite alternate}
@keyframes drift{from{transform:scale(1)}to{transform:scale(1.05) translateX(-1.2%)}}
.scene-in{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 var(--gut);padding-top:clamp(120px,24vh,260px);transform:translateY(calc(var(--sp,0) * -18%));opacity:calc(1 - var(--sp,0) * 1.4)}
.scene .kicker{display:inline-flex;align-items:center;gap:8px;margin-bottom:clamp(14px,2vw,22px)}
.scene .kicker::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.scene h1{font-size:var(--step-huge);letter-spacing:-.06em;line-height:.86;margin:0;max-width:16ch;text-wrap:balance}
.scene h1 small{display:block;font:500 clamp(.8rem,.6rem + .5vw,1rem)/1.2 var(--mono);letter-spacing:.18em;text-transform:uppercase;margin-top:clamp(14px,1.6vw,22px)}
.scene .tagline{font:600 clamp(1.15rem,.9rem + 1vw,1.75rem)/1.2 var(--text);letter-spacing:-.025em;margin-top:clamp(14px,1.8vw,24px);max-width:30ch}
.scene .btns{justify-content:center;margin-top:auto;margin-bottom:clamp(72px,11vh,120px)}
.scene .btn{background:#fff;color:var(--ink);border-radius:999px;box-shadow:0 10px 30px -12px rgba(0,0,0,.35)}
.scene .btn:hover{background:var(--ink);color:#fff}
.scene .btn.alt{background:rgba(255,255,255,.18);color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.85)}
.scene .btn.alt:hover{background:#fff;color:var(--ink)}
.scene .btn[aria-disabled="true"]:hover{background:#fff;color:var(--ink)}
.scene-foot{position:absolute;left:0;right:0;bottom:22px;display:flex;justify-content:center;color:#fff;opacity:calc(.9 - var(--sp,0) * 2)}
.scene-foot span{display:inline-flex;align-items:center;gap:8px}
.scene-foot span::before{content:"";width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-3px)}
.motion .scene-foot span{animation:bob 2.2s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(5px)}}
.scene-credit{position:absolute;right:var(--gut);bottom:22px;color:#fff;opacity:.7}
.scene.short{height:56vh;min-height:420px}
.scene.short .scene-in{padding-top:clamp(120px,20vh,200px)}
@media (max-width:640px){
  .scene-art img{object-position:center 62%}
  .scene-in{padding-top:clamp(110px,20vh,170px)}
  .scene .btns{flex-direction:column;align-items:stretch;width:min(100%,340px)}
  .scene-credit{display:none}
}
/* the opening motion: the name rises out of the field */
.motion .scene h1,.motion .scene .kicker,.motion .scene .tagline,.motion .scene .btns{animation:rise 1.1s cubic-bezier(.2,.7,.1,1) both}
.motion .scene .kicker{animation-delay:.05s}.motion .scene h1{animation-delay:.12s}.motion .scene .tagline{animation-delay:.32s}.motion .scene .btns{animation-delay:.48s}
@keyframes rise{from{opacity:0;transform:translateY(34px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}

/* ---------- the old coloured hero becomes a calm intro under the landscape */
.ahero{background:var(--bg);color:var(--ink)}
.ahero .wrap{min-height:0;padding-block:clamp(56px,8vw,120px) clamp(40px,6vw,80px)}
.ahero .mark{color:var(--muted)}
.ahero .mark img{border-radius:14px}
.ahero .lead{font-size:var(--step-lead);max-width:34ch;color:var(--ink)}
.ahero .note{color:var(--muted);opacity:1}
.ahero.wide .head-row{grid-template-columns:minmax(0,1fr);gap:20px;max-width:900px}
.ahero.wide .ahero-pic{margin-top:clamp(32px,4vw,64px)}
.home .ahero .wrap{grid-template-columns:1fr;max-width:1100px}
.home .ahero .lead{max-width:40ch;font-size:clamp(1.5rem,1rem + 1.6vw,2.4rem);line-height:1.25;letter-spacing:-.03em}
.phone{border-radius:44px;box-shadow:0 40px 80px -40px rgba(30,25,15,.45)}
.mac{border-radius:28px;overflow:hidden;box-shadow:0 40px 80px -40px rgba(30,25,15,.45)}

/* ---------- surfaces, buttons, fields: rounded and soft */
.btn{border-radius:999px;font-weight:600;letter-spacing:-.01em}
.btn.alt{box-shadow:inset 0 0 0 1.5px currentColor}
.sec{position:relative}
.on-ink{background:var(--ink);color:#f1ece3;border-radius:var(--r-card);margin:0 clamp(8px,1.4vw,20px)}
.on-ink + .on-ink{margin-top:12px}
.field{border-radius:var(--r-card)}
.plain-note{border-radius:22px}
.row{border-radius:20px}
.faq details{border-radius:20px}
.tl li{border-radius:16px}
.exh-pic{border-radius:var(--r-card);overflow:hidden}
.wk-pic,.stage,.stage .wk-pic{border-radius:var(--r-card)}
.idx-row{border-radius:16px}
.idx-row b{text-transform:none;letter-spacing:-.04em;font-weight:800}
.wk-name,.wk-hl{text-transform:none}
.stage-name{text-transform:none;letter-spacing:-.05em}
.state{text-transform:none;letter-spacing:-.045em}
.verbs h3{letter-spacing:-.05em}
.close h2{letter-spacing:-.06em}
.mailbig{text-transform:none;letter-spacing:-.045em}
.pref-tab{border-radius:18px}
.pref-tab b,.cap h3,.exh h3,.rule h3,.why3 h3,.points h3,.loop{text-transform:none}
.sp,.parkdemo,.island-demo,.wing,.glass-demo,.vid,.island-demo{border-radius:var(--r-card);overflow:hidden}
.portrait img{border-radius:var(--r-card)}
.person img{border-radius:22px}
.tour-count{border-radius:999px}
.cap-img,.tour-phone{border-radius:44px}
.loop span+span::before{border-radius:4px}

/* ---------- footer: the page's landscape on one side, the menu on the other */
.foot{background:var(--surface);border-radius:var(--r-card) var(--r-card) 0 0;overflow:hidden;margin-top:clamp(8px,1.4vw,20px)}
.foot-pic img{object-position:center 75%}
.foot-menu nav a{text-transform:none;letter-spacing:-.04em}
.scene-dark .nav:not(.solid) .links a,.scene-dark .nav:not(.solid) .brand b{text-shadow:0 1px 10px rgba(20,24,60,.35)}

/* app icon set beside the name, like a mark on the horizon */
.scene h1 .app-ic{display:inline-block;height:.74em;width:auto;aspect-ratio:1;border-radius:22.5%;vertical-align:-.02em;margin-right:.14em;
  box-shadow:0 .08em .22em -.06em rgba(20,15,10,.45)}
@media (max-width:640px){.scene h1 .app-ic{display:block;height:auto;width:clamp(72px,22vw,96px);margin:0 auto 14px;vertical-align:0}}
.motion .scene h1 .app-ic{animation:pop 1s cubic-bezier(.2,.8,.2,1.2) .25s both}
@keyframes pop{from{opacity:0;transform:scale(.6) rotate(-8deg)}to{opacity:1;transform:none}}