:root{
  --bg:#f8f4ec;
  --brown:#6f5d50;
  --orange:#d98552;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{
  background:var(--bg);
  font-family:-apple-system,BlinkMacSystemFont,"Avenir Next","Helvetica Neue",Arial,sans-serif;
}
.page{
  min-height:100svh;
  display:grid;
  grid-template-rows:1fr auto;
  padding:
    max(28px,env(safe-area-inset-top))
    24px
    max(34px,env(safe-area-inset-bottom));
}
.hero{
  align-self:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
.puff{
  display:block;
  width:min(72vw,430px);
  max-height:43svh;
  object-fit:contain;
}
.coming{
  margin:46px 0 0;
  color:#8a786b;
  font-size:clamp(22px,4.6vw,32px);
  letter-spacing:.38em;
  text-indent:.38em;
  font-weight:400;
}
.brand-block{
  text-align:center;
}
.brand{
  color:var(--brown);
  font-size:clamp(24px,4vw,30px);
  letter-spacing:.08em;
}
.tagline{
  margin-top:8px;
  color:var(--orange);
  font-size:clamp(14px,2.6vw,18px);
  letter-spacing:.20em;
}