
:root{
  --paper:#fff;
  --ink:#707880;
  --line:#dbe7ee;
}

*{box-sizing:border-box}

html,body{
  margin:0;
  min-height:100%;
  background:var(--paper);
}

body{
  min-height:100svh;
  color:var(--ink);
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}

.landing{
  min-height:calc(100svh - 58px);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#fff;
}

.identity{
  display:block;
  width:100%;
  height:100%;
}

.identity img{
  display:block;
  width:100%;
  height:calc(100svh - 58px);
  object-fit:contain;
  object-position:center center;
  background:#fff;
  animation:reveal .65s ease-out both;
}

.copyright{
  height:58px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 24px;
  border-top:1px solid rgba(219,231,238,.65);
  color:#9199a0;
  background:#fff;
  font-size:11px;
  font-weight:400;
  letter-spacing:.055em;
  text-align:center;
  white-space:nowrap;
}

@keyframes reveal{
  from{opacity:0}
  to{opacity:1}
}

@media (max-width:767px){
  .landing{
    min-height:calc(100svh - 52px);
  }

  .identity img{
    height:calc(100svh - 52px);
    padding:18px 14px 4px;
  }

  .copyright{
    height:52px;
    padding:0 16px;
    font-size:10px;
    letter-spacing:.04em;
  }
}

@media (prefers-reduced-motion:reduce){
  .identity img{animation:none}
}


/* V2 — full-screen feel without cropping the identity */
.landing{
  min-height:calc(100svh - 58px);
  position:relative;
  overflow:hidden;
  background:#fff;
}

.identity{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.identity img{
  width:auto !important;
  height:auto !important;
  max-width:none !important;
  max-height:none !important;

  /* Fill the viewport as much as possible while preserving the whole image.
     The image is scaled from both viewport dimensions, then capped so it
     never exceeds either axis. */
  --available-h: calc(100svh - 58px);
  width:min(100vw, calc(var(--available-h) * 1.6)) !important;
  height:auto !important;

  object-fit:unset !important;
  object-position:center center;
  padding:0 !important;
  background:#fff;
}

/* On screens whose height is the limiting factor, use height instead. */
@media (min-aspect-ratio: 8/5){
  .identity img{
    width:auto !important;
    height:min(calc(100svh - 58px), 62.5vw) !important;
  }
}

@media (max-width:767px){
  .landing{
    min-height:calc(100svh - 52px);
  }

  .identity img{
    --available-h: calc(100svh - 52px);
    width:min(100vw, var(--available-h)) !important;
    height:auto !important;
  }

  @media (min-aspect-ratio: 1/1){
    .identity img{
      width:auto !important;
      height:min(calc(100svh - 52px), 100vw) !important;
    }
  }
}
