/* Kabul House — Coming Soon. Self-hosted and dependency-free. */
:root {
  color-scheme: light;
  --ink: #171717;
  --taupe: #B9AFA3;
  --ivory: #F7F3EC;
  --muted: #69645E;
}
* { box-sizing: border-box; }
html { min-width: 280px; }
body { margin: 0; background: var(--ivory); color: var(--ink); -webkit-font-smoothing: antialiased; }
.page { min-height: 100svh; display: flex; flex-direction: column; max-width: 1700px; margin: 0 auto; padding: 32px clamp(22px, 5.2vw, 86px) 26px; }
.masthead, .footer { display: flex; align-items: center; justify-content: space-between; gap: 22px; }
.masthead-label, .footer {
  font-family: Arial, Helvetica, sans-serif; font-size: 10px; font-weight: 600;
  letter-spacing: .20em; line-height: 1.5;
}
.masthead-line { flex: 1; height: 1px; max-width: 116px; background: var(--taupe); opacity: .78; }
.masthead-label:last-child { margin-left: auto; text-align: right; }
.main-content { display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 1; padding: 44px 0 74px; text-align: center; }
.brand-lockup { display: flex; align-items: center; justify-content: center; width: 100%; }
.brand-logo { display: block; width: clamp(264px, 30vw, 354px); height: auto; }
.accent { width: 44px; height: 1.5px; background: var(--taupe); margin: 20px auto 22px; }
h1 { font-family: Georgia, 'Times New Roman', serif; font-weight: 400; font-size: clamp(51px, 6.8vw, 86px); line-height: 1.1; letter-spacing: -.062em; margin: 0; }
.intro { color: var(--muted); font-family: Arial, Helvetica, sans-serif; font-weight: 400; font-size: clamp(15px, 1.4vw, 17px); line-height: 1.7; margin: 22px 0 0; max-width: 490px; }
.footer { padding-top: 18px; border-top: 1px solid #ddd5ca; color: var(--muted); font-size: 9px; letter-spacing: .16em; }
.footer span:last-child { text-align: right; }
@media (max-width: 600px) {
  .page { padding: 24px 24px 22px; }
  .masthead { gap: 11px; }
  .masthead-label { font-size: 9px; letter-spacing: .10em; }
  .masthead-line { max-width: 18px; }
  .main-content { padding: 40px 0 70px; }
  .brand-logo { width: min(290px, 85vw); }
  .accent { margin: 18px auto 25px; }
  h1 { font-size: clamp(52px, 13vw, 68px); }
  .intro { font-size: 15px; max-width: 320px; }
  .desktop-only { display: none; }
  .footer { flex-direction: column; gap: 8px; text-align: center; font-size: 8px; }
  .footer span:last-child { text-align: center; }
}
@media (max-height: 570px) and (min-width: 601px) { .main-content { padding: 14px 0 28px; } .brand-logo { width: min(240px, 22vw); } .accent { margin: 8px auto 12px; } h1 { font-size: 54px; } .intro { margin-top: 10px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; } }