:root{
  --bg:#ffffff;
  --fg:#111111;
  --muted:#666666;
  --accent:#111111;
  --radius:18px;
  --shadow:0 8px 28px rgba(0,0,0,.08);
}

*{box-sizing:border-box}
html,body{height:100%}

body.page{
  margin:0;
  min-height:100dvh;            /* full viewport height */
  display:flex;                  /* column layout: main + footer */
  flex-direction:column;
  font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
  background:var(--bg);
  color:var(--fg);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* Center the card in the remaining space */
.wrap{
  flex:1;                        /* take available space */
  display:flex;
  align-items:center;
  justify-content:center;
  padding:8vw 6vw;
}

.card{
  width:clamp(280px, 90vw, 840px);
  text-align:center;
  background:#fff;
  border:1px solid #eee;
  border-radius:var(--radius);
  padding:clamp(24px, 5vw, 56px);
  box-shadow:var(--shadow);
}

.logo img{
  width:min(220px, 50vw);
  height:auto;
  display:block;
  margin:0 auto 1rem;
}

.headline{
  font-size:clamp(28px, 6vw, 56px);
  line-height:1.05;
  letter-spacing:-0.02em;
  margin:0.2rem 0 0.5rem;
}

.tagline{
  font-size:clamp(16px, 2.8vw, 22px);
  margin:0 0 0.25rem;
}

.subtle{
  color:var(--muted);
  margin:0.1rem 0 0;
}

/* Footer pinned to bottom when content is short */
.site-footer{
  text-align:center;
  color:var(--muted);
  font-size:14px;
  padding:20px 0 28px;           /* breathing room */
}