/* Cream, forest and five grounded colour notes. The welcome is not a slider. */
html.welcome-open{overflow:hidden}
.welcome-entry{position:fixed;inset:0;width:100%;max-width:none;height:100vh;height:100dvh;max-height:none;margin:0;border:0;padding:clamp(1.25rem,4vw,4rem);overflow:auto;color:var(--forest);background:radial-gradient(ellipse at 22% 45%,#7e977916,transparent 55%),var(--cream);direction:ltr;animation:entry-appear .5s var(--ease) both}
.welcome-entry[open]{display:grid;place-items:center}
.welcome-entry::backdrop{background:var(--cream)}
.welcome-entry:focus{outline:none}
.entry-shell{position:relative;isolation:isolate;width:min(100%,1100px);margin:auto}
.entry-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(3rem,8vw,8rem);align-items:center}
.entry-tagline{font-size:.75rem;font-weight:600;letter-spacing:.22em;color:var(--sage-deep);margin-bottom:2rem}
.entry-story h1{font-family:var(--display);color:var(--sage-deep);font-size:clamp(2rem,3.2vw,3.1rem);line-height:1.15;letter-spacing:-.02em;outline:none}
.entry-brand{display:block;font-size:clamp(6rem,12vw,11rem);letter-spacing:-.055em;line-height:1.1;margin:.1em 0 .12em;color:var(--forest)}
.entry-local-welcomes{display:flex;flex-wrap:wrap;gap:.3rem 1.4rem;align-items:baseline;color:var(--muted);font-size:1rem}
.entry-local-welcomes [lang=ar]{font-family:var(--arabic);font-size:1.3rem}
.welcome-entry .welcome-greetings{justify-content:flex-start;margin-top:2rem;max-width:30rem;gap:.5rem}
.welcome-entry .welcome-greetings span{background:transparent;border-color:var(--line);color:var(--sage-deep)}
.entry-language{border-inline-start:1px solid var(--line);padding-inline-start:clamp(1.5rem,3vw,2.5rem)}
.entry-instructions{color:var(--muted);font-size:.85rem;line-height:1.7;margin-bottom:1.3rem}
.entry-instructions p:first-child{color:var(--forest);font-weight:600}
.entry-instructions [lang=ar]{font-family:var(--arabic);font-size:1.15rem}
.entry-options{display:grid;gap:.8rem}
.entry-options button{position:relative;display:grid;grid-template-columns:1fr auto;gap:.15rem 1rem;text-align:start;padding:1rem 1.3rem;min-height:88px;border:1px solid var(--line);border-radius:7px;background:var(--paper);transition:transform .25s var(--ease),background .25s,border-color .25s,box-shadow .25s}
.entry-options button:hover,.entry-options button:focus-visible{transform:translateY(-3px);border-color:var(--sage-deep);background:#E0E5DA;box-shadow:0 6px 0 #1f2b220d}
.entry-options strong{font-family:var(--display);font-weight:400;font-size:1.8rem;line-height:1.2}
.entry-options small{grid-column:1;color:var(--muted);font-size:.75rem}
.entry-options button>span{grid-column:2;grid-row:1/3;align-self:center;font-size:1.4rem;color:var(--sage-deep)}
.entry-options [lang=ar] strong{font-family:var(--arabic);font-size:1.85rem}
.entry-options [lang=ar] small{font-family:var(--arabic);font-size:1rem}
.entry-options button:disabled{cursor:default}
.entry-palette{display:flex;justify-content:center;gap:.6rem;margin:3.5rem auto 0}
.entry-palette span{width:30px;height:6px;border-radius:3px;background:#7A9685}
.entry-palette span:nth-child(2){background:#B8A987}
.entry-palette span:nth-child(3){background:#64734F}
.entry-palette span:nth-child(4){background:#9C6645}
.entry-palette span:nth-child(5){background:#335282}
.welcome-entry.is-leaving{animation:entry-leave .4s var(--ease) forwards}
.welcome-entry.is-launching{background:transparent;animation:none;overflow:hidden}
.welcome-entry.is-launching::backdrop{background:transparent;transition:background .35s}
.welcome-entry.is-launching .entry-shell{opacity:0;transform:translateY(-12px);transition:opacity .2s,transform .3s}
.entry-flight{position:fixed;left:50%;top:50%;width:min(78vw,340px);height:min(74vh,580px);transform:translate(-50%,-50%);perspective:1000px;pointer-events:none}
.entry-flight-bottle{width:100%;height:100%;transform-style:preserve-3d;filter:drop-shadow(12px 24px 16px #1f2b2230)}
.entry-flight-bottle svg{display:block;width:100%;height:100%}
@keyframes entry-appear{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes entry-leave{to{opacity:0;transform:translateY(-18px)}}
@media(max-width:760px){
  .entry-layout{grid-template-columns:1fr;gap:1.5rem}
  .entry-tagline{margin-bottom:1.3rem}
  .entry-brand{font-size:clamp(6rem,20vw,8rem)}
  .entry-language{border-inline-start:0;border-top:1px solid var(--line);padding:1.5rem 0 0}
  .entry-instructions{margin-bottom:1rem}
  .entry-options{gap:.65rem}
  .entry-options button{min-height:74px;padding:.8rem 1.1rem}
  .entry-options strong{font-size:1.6rem}
  .entry-palette{margin-top:1rem}
  .welcome-entry .welcome-greetings{margin-top:1rem}
}
@media(max-width:380px){
  .entry-layout{gap:1.3rem}
  .entry-local-welcomes{font-size:.85rem;gap:.15rem 1rem}
  .entry-local-welcomes [lang=ar]{font-size:1.15rem}
  .welcome-entry .welcome-greetings{gap:.35rem;margin-top:1rem}
  .entry-tagline{margin-bottom:1rem}
}
@media(max-height:600px) and (min-width:761px){
  .entry-tagline{margin-bottom:1rem}
  .entry-brand{font-size:7rem}
  .entry-options button{min-height:72px;padding:.7rem 1rem}
  .entry-palette{margin-top:1.5rem}
}
@media(max-height:700px) and (max-width:760px){
  .welcome-entry .welcome-greetings,.entry-palette{display:none}
  .entry-layout{gap:1rem}
  .entry-tagline{font-size:.65rem;margin-bottom:.7rem}
  .entry-story h1{font-size:1.65rem}
  .entry-brand{font-size:4.8rem;margin:.05em 0 .08em}
  .entry-local-welcomes{font-size:.8rem;line-height:1.4}
  .entry-local-welcomes [lang=ar]{font-size:1.1rem}
  .entry-language{padding-top:1rem}
  .entry-instructions{font-size:.75rem;line-height:1.4;margin-bottom:.8rem}
  .entry-instructions [lang=ar]{font-size:1rem}
  .entry-options{gap:.5rem}
  .entry-options button{min-height:62px;padding:.6rem .85rem}
  .entry-options strong{font-size:1.4rem}
  .entry-options small{font-size:.7rem}
  .entry-options [lang=ar] strong{font-size:1.65rem}
  .entry-options [lang=ar] small{font-size:.9rem}
}
@media(prefers-reduced-motion:reduce){
  .welcome-entry,.welcome-entry.is-leaving{animation:none}
  .entry-options button{transition:none}
  .entry-options button:hover,.entry-options button:focus-visible{transform:none}
}