/* VentWise shared styles: tokens, type, buttons, header, sections, footer and the phone call bar.
   Linked by index.html and gallery.html; each page keeps its own section styles inline. */
:root {
  --bg: #F2F5FA;
  --surface: #FFFFFF;
  --surface-2: #E2E9F3;
  --ink: #0D2350;
  --muted: #4F5F7C;
  --line: #CDD7E6;
  --band: #0D2350;
  --band-fg: #EAF0FA;
  --band-muted: #A4B3CE;
  --cta: #1F6ED4;
  --cta-ink: #FFFFFF;
  --air: #1F6ED4;
  --ember: #E0561C;
  --lint: #A99F93;
  --steel: #8E9DB5;
  --display: "Archivo", "Arial Black", "Helvetica Neue", sans-serif;
  --body: "Instrument Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --gutter-l: max(16px, env(safe-area-inset-left, 0px));
  --gutter-r: max(16px, env(safe-area-inset-right, 0px));
  color-scheme: light;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 80px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { background: var(--bg); color: var(--ink); font-family: var(--body); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 10; background: var(--surface); }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--air); outline-offset: 3px; border-radius: 4px; }

.wrap { max-width: 1160px; margin: 0 auto; padding-left: var(--gutter-l); padding-right: var(--gutter-r); }
h1, h2, h3 { font-family: var(--display); font-weight: 800; line-height: 1.02; letter-spacing: -0.02em; text-wrap: balance; margin: 0; }
h2 { font-size: clamp(2rem, 4.2vw, 3rem); }
h3 { font-size: 1.25rem; font-weight: 700; letter-spacing: -0.01em; }
p { margin: 0; }
.eyebrow { font-family: var(--mono); font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); font-weight: 500; }
.lede { color: var(--muted); font-size: 1.08rem; max-width: 58ch; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.5em; font: 600 1rem/1 var(--body); padding: 0.95em 1.4em; border-radius: 8px; text-decoration: none; border: 2px solid transparent; cursor: pointer; transition: transform .15s ease, background .15s ease; }
.btn:hover { transform: translateY(-1px); }
.btn:disabled { opacity: .6; cursor: default; transform: none; }
.btn-primary { background: var(--cta); color: var(--cta-ink); }
.btn-ghost { border-color: var(--line); color: var(--ink); background: transparent; }
.btn-ghost:hover { border-color: var(--ink); }

/* Wordmark: shield mark + VENTWISE in caps (logo option C, Safe Shield) */
.wordmark { font-family: var(--display); font-weight: 900; letter-spacing: -0.01em; line-height: .85; }

/* Header */
header.site { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 20; background: var(--surface); border-bottom: 1px solid var(--line); }
header.site .wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 12px; }
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.brand svg { flex: none; }
.brand .wordmark { font-size: 1.45rem; }
.brand small { display: block; font-family: var(--mono); font-weight: 400; font-size: 0.6rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); margin-top: 4px; }
nav.main { display: flex; gap: 26px; align-items: center; }
nav.main a { text-decoration: none; font-weight: 500; font-size: 0.95rem; color: var(--muted); }
nav.main a:hover { color: var(--ink); }
@media (max-width: 820px) { nav.main a:not(.btn) { display: none; } }

/* Sections */
section.block .wrap { padding-block: 84px; }
.sec-head { display: flex; flex-direction: column; gap: 14px; margin-bottom: 44px; max-width: 760px; }

/* Footer */
footer.site { background: var(--band); color: var(--band-muted); }
footer.site .wrap { padding-block: 44px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 24px; align-items: flex-end; font-size: 0.9rem; }
footer.site .wordmark { font-size: 1.8rem; color: var(--band-fg); }
.foot-brand { display: flex; align-items: center; gap: 12px; }
.foot-brand svg { flex: none; }
footer.site .tag { display: block; margin-top: 8px; font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; }
footer.site .credit { font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.04em; }

/* Sticky mobile call bar */
.mobile-bar { display: none; }
@media (max-width: 640px) {
  .mobile-bar { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; background: var(--surface); border-top: 1px solid var(--line);
    padding: 10px var(--gutter-r) calc(10px + env(safe-area-inset-bottom, 0px)) var(--gutter-l); }
  .mobile-bar .btn { padding: 0.85em 0.6em; font-size: 0.95rem; }
  footer.site .wrap { padding-bottom: 110px; }
}
