@font-face {
      font-family: Geulah;
      src: url('../assets/geulah.ttf') format('truetype');
      font-weight: 500;
      font-style: normal;
      font-display: swap;
    }
    :root { color-scheme: light; --ink:#071eb0; }
    * { box-sizing:border-box; }
    html,body { width:100%; min-height:100%; margin:0; }
    body { background:#fff07c; font-family:Arial,Helvetica,sans-serif; }
    .landing { position:relative; width:100%; height:100vh; height:100svh; min-height:320px; isolation:isolate; overflow:hidden; }
    .scene { position:absolute; inset:0; overflow:hidden; pointer-events:none; user-select:none; }
    .world { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 50%; animation:horizon 22s ease-in-out infinite alternate; }
    .light { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; mix-blend-mode:screen; opacity:.16; transform-origin:50% 80%; animation:light 12s ease-in-out infinite alternate; }
    .brand { position:absolute; z-index:2; top:7.1%; left:0; right:0; margin:0; color:var(--ink); text-align:center; font-family:Geulah,Arial,Helvetica,sans-serif; font-size:clamp(48px,7.65vw,160px); font-weight:500; line-height:1.12; letter-spacing:-.015em; white-space:nowrap; }
    .blessing { position:absolute; z-index:2; top:max(4.5%,env(safe-area-inset-top)); right:max(2.8%,env(safe-area-inset-right)); margin:0; color:var(--ink); font-family:Arial,Helvetica,sans-serif; font-size:clamp(17px,1.8vw,30px); line-height:1; font-weight:400; }
    @keyframes horizon {
      from { filter:hue-rotate(-.65deg) saturate(.99); }
      to { filter:hue-rotate(.65deg) saturate(1.025); }
    }
    @keyframes light {
      from { opacity:.055; transform:scale(.98); }
      to { opacity:.14; transform:scale(1.055); }
    }
    @media (max-aspect-ratio:1/1) {
      .brand { top:13%; font-size:clamp(42px,12.2vw,100px); letter-spacing:-.015em; }
      .blessing { top:max(25px,env(safe-area-inset-top)); right:max(22px,env(safe-area-inset-right)); font-size:19px; }
      .world { object-position:center center; }
      .light { height:70%; top:auto; bottom:-8%; }
    }
    @media (max-height:420px) and (min-aspect-ratio:1/1) {
      .brand { top:5%; font-size:clamp(42px,7.25vw,80px); }
      .blessing { top:18px; right:22px; font-size:18px; }
    }
    @media (prefers-reduced-motion:reduce) {
      .world,.light { animation:none; }
      .light { opacity:.09; }
    }
    html[data-hidden] .world,html[data-hidden] .light { animation-play-state:paused; }