/* Kave Builders - static site styles */
:root {
  --bone: #f5f1ea;
  --stone: #dfd8cb;
  --ink: #1a1712;
  --ink-90: rgba(26,23,18,0.9);
  --ink-75: rgba(26,23,18,0.75);
  --ink-70: rgba(26,23,18,0.7);
  --ink-60: rgba(26,23,18,0.6);
  --ink-55: rgba(26,23,18,0.55);
  --ink-50: rgba(26,23,18,0.5);
  --ink-40: rgba(26,23,18,0.4);
  --ink-15: rgba(26,23,18,0.15);
  --bone-85: rgba(245,241,234,0.85);
  --bone-80: rgba(245,241,234,0.8);
  --bone-70: rgba(245,241,234,0.7);
  --bone-60: rgba(245,241,234,0.6);
  --bone-55: rgba(245,241,234,0.55);
  --bone-15: rgba(245,241,234,0.15);
  --brass: #c9a34a;
  --brass-deep: #9a7b30;
  --border: #cabfa8;
  --muted-bg: #ede7db;

  --font-display: "Cormorant Garamond", "Times New Roman", Georgia, serif;
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-sans);
  background: var(--bone);
  color: var(--ink);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; border: none; background: none; }
ul, ol { list-style: none; }
h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 400;
  font-style: normal;
  letter-spacing: -0.02em;
  line-height: 1.05;
}

/* ---------- Utilities ---------- */
.container { max-width: 1400px; margin: 0 auto; padding: 0 24px; }
.eyebrow {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--ink-70);
  display: inline-flex;
  align-items: center;
}
.eyebrow.on-dark { color: var(--brass); }
.rule {
  display: inline-block;
  width: 42px;
  height: 1px;
  background: var(--brass);
  margin-right: 14px;
}
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 18px 32px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  border: 1px solid var(--ink);
  transition: all 200ms ease;
  cursor: pointer;
}
.btn-primary { background: var(--ink); color: var(--bone); }
.btn-primary:hover { background: var(--brass-deep); border-color: var(--brass-deep); }
.btn-brass { background: var(--brass); color: var(--ink); border-color: var(--brass); }
.btn-brass:hover { background: var(--bone); border-color: var(--bone); }
.btn-ghost { background: transparent; color: var(--bone); border-color: rgba(255,255,255,0.5); }
.btn-ghost:hover { background: var(--bone); color: var(--ink); border-color: var(--bone); }
.btn-outline-dark { background: transparent; color: var(--ink); border-color: var(--ink); }
.btn-outline-dark:hover { background: var(--ink); color: var(--bone); }

/* ---------- Top bar ---------- */
.topbar { background: var(--ink); color: var(--bone); }
.topbar-inner {
  max-width: 1400px; margin: 0 auto; padding: 10px 24px;
  display: flex; align-items: center; justify-content: space-between;
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
}
.topbar-inner .locale { opacity: 0.7; }
.topbar-inner .booking { opacity: 0.85; }
.topbar-contacts { display: none; gap: 20px; align-items: center; }
.topbar-contacts a:hover { color: var(--brass); }
.topbar-contacts .email { text-transform: none; letter-spacing: 0; }
@media (max-width: 780px) { .topbar-inner .locale { display: none; } }
@media (min-width: 900px) { .topbar-contacts { display: flex; } }

/* ---------- Nav ---------- */
.nav {
  position: sticky; top: 0; z-index: 50;
  background: var(--bone);
  border-bottom: 1px solid transparent;
  transition: background 200ms ease, border-color 200ms ease;
}
.nav.scrolled { background: rgba(245,241,234,0.95); backdrop-filter: blur(8px); border-bottom-color: var(--border); }
.nav-inner {
  max-width: 1400px; margin: 0 auto; padding: 16px 24px;
  display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 24px;
}
@media (min-width: 900px) { .nav-inner { grid-template-columns: 1fr auto 1fr; } }
.nav-logo img { height: 44px; width: auto; }
@media (min-width: 768px) { .nav-logo img { height: 48px; } }
.nav-links { display: none; justify-content: center; gap: 36px; font-size: 12px; text-transform: uppercase; letter-spacing: 0.22em; }
@media (min-width: 900px) { .nav-links { display: flex; } }
.nav-links a { transition: color 200ms ease; }
.nav-links a:hover { color: var(--brass-deep); }
.nav-right { display: flex; align-items: center; justify-content: flex-end; gap: 12px; }
.nav-right .btn { padding: 14px 20px; }
@media (min-width: 640px) { .nav-right .btn { padding: 18px 32px; } }

/* Socials */
.socials { display: flex; align-items: center; gap: 4px; }
.socials a { padding: 8px; color: var(--ink-60); transition: color 200ms ease; display: inline-flex; }
.socials a:hover { color: var(--brass-deep); }
.socials.on-dark a { color: var(--bone-70); }
.socials.on-dark a:hover { color: var(--brass); }
.socials svg { width: 20px; height: 20px; }
.nav .socials { display: none; }
@media (min-width: 640px) { .nav .socials { display: flex; } }

/* ---------- Hero ---------- */
.hero {
  position: relative; isolate: isolate; overflow: hidden;
  background: var(--ink); color: var(--bone);
}
.hero-bg { position: absolute; inset: 0; }
.hero-bg img { width: 100%; height: 100%; object-fit: cover; opacity: 0.8; }
.hero-bg .overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(26,23,18,0.5), rgba(26,23,18,0.3), rgba(26,23,18,0.95));
}
.hero-inner {
  position: relative; max-width: 1400px; margin: 0 auto; padding: 128px 24px 64px;
  display: flex; flex-direction: column; justify-content: flex-end;
  min-height: 92vh;
}
@media (min-width: 768px) { .hero-inner { padding: 160px 24px 96px; } }
.hero h1 {
  margin-top: 24px;
  font-size: clamp(3rem, 8vw, 9rem);
  line-height: 0.95;
  letter-spacing: -0.03em;
}
.hero h1 .brass { color: var(--brass); }
.hero-copy-row {
  margin-top: 40px; display: grid; gap: 32px;
}
@media (min-width: 768px) { .hero-copy-row { grid-template-columns: 1fr auto; align-items: end; } }
.hero-copy { max-width: 36rem; color: var(--bone-85); font-size: 16px; line-height: 1.7; }
@media (min-width: 768px) { .hero-copy { font-size: 18px; } }
.hero-buttons { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.hero-stats {
  margin-top: 64px; padding-top: 32px;
  border-top: 1px solid var(--bone-15);
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px;
}
@media (min-width: 640px) { .hero-stats { grid-template-columns: repeat(4, 1fr); } }
.hero-stats .k { font-family: var(--font-display); color: var(--brass); font-size: 30px; }
@media (min-width: 768px) { .hero-stats .k { font-size: 36px; } }
.hero-stats .v { margin-top: 4px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.2em; color: var(--bone-70); }

/* ---------- Marquee ---------- */
.marquee-section { border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); overflow: hidden; }
.marquee { display: flex; width: max-content; animation: marquee 45s linear infinite; padding: 20px 0; }
.marquee span.item { display: inline-flex; align-items: center; gap: 32px; padding-right: 32px; font-family: var(--font-display); font-size: 24px; color: var(--ink-75); white-space: nowrap; }
.marquee span.item .star { color: var(--brass); }
@media (min-width: 768px) { .marquee span.item { font-size: 30px; } }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ---------- Intro (studio) ---------- */
.studio { border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--ink); color: var(--bone); }
.studio-grid { max-width: 1400px; margin: 0 auto; display: grid; grid-template-columns: 1fr; }
@media (min-width: 900px) { .studio-grid { grid-template-columns: 0.85fr 1.15fr; } }
.studio-visual { position: relative; min-height: 520px; }
@media (min-width: 900px) { .studio-visual { min-height: 720px; } }
.studio-visual > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.studio-visual .grad { position: absolute; inset: 0; background: linear-gradient(to top right, rgba(26,23,18,0.85), rgba(26,23,18,0.25), transparent); }
.studio-visual .badge {
  position: absolute; top: 0; left: 0;
  display: flex; align-items: center; gap: 12px;
  background: var(--brass); color: var(--ink);
  padding: 12px 20px; font-size: 11px; font-weight: 500;
  letter-spacing: 0.24em; text-transform: uppercase;
}
.studio-visual .badge .dot { width: 8px; height: 8px; background: var(--ink); display: inline-block; }
.studio-visual .quote-card {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: 24px; background: rgba(26,23,18,0.85); backdrop-filter: blur(8px);
  border-top: 1px solid var(--bone-15);
}
@media (min-width: 768px) { .studio-visual .quote-card { padding: 32px; } }
.studio-visual .quote-card p.q { font-family: var(--font-display); font-size: 22px; line-height: 1.25; color: var(--bone); }
@media (min-width: 768px) { .studio-visual .quote-card p.q { font-size: 28px; } }
.studio-visual .quote-card p.a { margin-top: 16px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.24em; color: var(--brass); }
.studio-content { padding: 80px 24px; display: flex; flex-direction: column; justify-content: center; }
@media (min-width: 900px) { .studio-content { padding: 112px 64px; } }
.studio-content h2 { margin-top: 32px; font-size: clamp(2.5rem, 5.4vw, 4.5rem); font-weight: 500; color: var(--bone); }
.studio-content .copy-grid { margin-top: 40px; padding-top: 40px; border-top: 1px solid var(--bone-15); display: grid; gap: 32px; }
@media (min-width: 640px) { .studio-content .copy-grid { grid-template-columns: 1fr 1fr; } }
.studio-content .copy-grid p { font-size: 15px; line-height: 1.75; color: var(--bone-85); }
.studio-badges { margin-top: 40px; padding-top: 32px; border-top: 1px solid var(--bone-15); display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.studio-badges .b { border-left: 2px solid var(--brass); padding-left: 16px; }
.studio-badges .b .k { font-family: var(--font-display); color: var(--bone); font-size: 24px; }
@media (min-width: 768px) { .studio-badges .b .k { font-size: 30px; } }
.studio-badges .b .v { margin-top: 4px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.22em; color: var(--bone-60); }
.studio-content .ctas { margin-top: 40px; display: flex; flex-wrap: wrap; gap: 16px; }

/* ---------- Services ---------- */
.services { border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--muted-bg); }
.services-inner { max-width: 1400px; margin: 0 auto; padding: 96px 24px; }
.services-header { display: flex; flex-direction: column; gap: 24px; justify-content: space-between; align-items: flex-start; }
@media (min-width: 768px) { .services-header { flex-direction: row; align-items: flex-end; } }
.services-header h2 { margin-top: 24px; font-size: clamp(2.25rem, 5vw, 3.75rem); }
.services-header p { max-width: 28rem; color: var(--ink-70); }
.services-grid { margin-top: 56px; border-top: 1px solid var(--border); border-left: 1px solid var(--border); display: grid; grid-template-columns: 1fr; }
@media (min-width: 640px) { .services-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .services-grid { grid-template-columns: repeat(3, 1fr); } }
.service-card { border-bottom: 1px solid var(--border); border-right: 1px solid var(--border); background: var(--bone); padding: 32px; transition: background 200ms ease, color 200ms ease; }
@media (min-width: 768px) { .service-card { padding: 40px; } }
.service-card .top { display: flex; align-items: baseline; justify-content: space-between; }
.service-card .num { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.2em; color: var(--brass-deep); }
.service-card .arrow { font-size: 18px; opacity: 0.4; transition: opacity 200ms ease, color 200ms ease; }
.service-card h3 { margin-top: 32px; font-size: 28px; }
@media (min-width: 768px) { .service-card h3 { font-size: 34px; } }
.service-card p { margin-top: 20px; font-size: 14px; line-height: 1.7; color: var(--ink-70); }
.service-card:hover { background: var(--ink); color: var(--bone); }
.service-card:hover .num, .service-card:hover .arrow { color: var(--brass); opacity: 1; }
.service-card:hover p { color: var(--bone-80); }

/* ---------- Featured project ---------- */
.project { border-bottom: 1px solid var(--border); }
.project figure { position: relative; width: 100%; }
.project figure > img { height: 54vh; width: 100%; object-fit: cover; }
@media (min-width: 768px) { .project figure > img { height: 74vh; } }
.project figcaption {
  position: absolute; inset: auto 0 0 0;
  background: linear-gradient(to top, rgba(26,23,18,0.85), transparent);
  padding: 96px 24px 24px;
}
@media (min-width: 768px) { .project figcaption { padding: 128px 24px 40px; } }
.project figcaption .cap-inner { max-width: 1400px; margin: 0 auto; }
.project figcaption h3 { color: var(--bone); font-size: clamp(1.75rem, 4.5vw, 3.75rem); margin-top: 16px; }
.project figcaption .row {
  margin-top: 16px; display: grid; gap: 32px;
}
@media (min-width: 768px) { .project figcaption .row { grid-template-columns: 1.6fr 1fr; align-items: end; } }
.project.reverse figcaption .row > *:first-child { order: 2; }
.project figcaption .loc { font-size: 11px; text-transform: uppercase; letter-spacing: 0.24em; color: var(--brass); }
.project figcaption p.copy { margin-top: 12px; font-size: 14px; line-height: 1.7; color: var(--bone-85); }
@media (min-width: 768px) { .project figcaption p.copy { font-size: 16px; } }
.project .caption-footer {
  max-width: 1400px; margin: 0 auto; padding: 24px;
  display: flex; flex-wrap: wrap; gap: 16px; justify-content: space-between; align-items: center;
  font-size: 11px; text-transform: uppercase; letter-spacing: 0.22em; color: var(--ink-60);
}
.project .caption-footer .tags { display: flex; flex-wrap: wrap; gap: 32px 32px; }
.project .caption-footer a { color: var(--ink); transition: color 200ms ease; }
.project .caption-footer a:hover { color: var(--brass-deep); }

/* ---------- Craft ---------- */
.craft { background: var(--ink); color: var(--bone); }
.craft-grid { display: grid; grid-template-columns: 1fr; }
@media (min-width: 768px) { .craft-grid { grid-template-columns: 1fr 1fr; } }
.craft-img { position: relative; height: 60vh; }
@media (min-width: 768px) { .craft-img { height: auto; } }
.craft-img img { width: 100%; height: 100%; object-fit: cover; }
.craft-content { display: flex; flex-direction: column; justify-content: center; gap: 32px; padding: 80px 24px; }
@media (min-width: 768px) { .craft-content { padding: 128px 64px; } }
.craft-content h2 { font-size: clamp(2.25rem, 5vw, 3.75rem); line-height: 1.05; }
.craft-content p { max-width: 32rem; color: var(--bone-80); line-height: 1.7; }
.craft-list { display: grid; gap: 12px; }
@media (min-width: 640px) { .craft-list { grid-template-columns: 1fr 1fr; } }
.craft-list li { display: flex; align-items: flex-start; gap: 12px; border-top: 1px solid var(--bone-15); padding-top: 12px; font-size: 14px; color: var(--bone-75); }
.craft-list li .b { margin-top: 6px; width: 16px; height: 4px; background: var(--brass); flex-shrink: 0; }

/* ---------- Process ---------- */
.process { max-width: 1400px; margin: 0 auto; padding: 96px 24px; }
@media (min-width: 768px) { .process { padding: 144px 24px; } }
.process-grid { display: grid; gap: 48px; }
@media (min-width: 768px) { .process-grid { grid-template-columns: 1fr 2fr; gap: 80px; } }
.process h2 { margin-top: 24px; font-size: clamp(2.25rem, 5vw, 3.75rem); }
.process .lead { margin-top: 24px; max-width: 22rem; color: var(--ink-70); }
.process ol { border-top: 1px solid var(--border); }
.process ol li {
  display: grid; grid-template-columns: 64px 1fr auto; gap: 24px;
  border-bottom: 1px solid var(--border); padding: 32px 0;
  transition: background 200ms ease;
}
@media (min-width: 768px) { .process ol li { grid-template-columns: 96px 1fr auto; gap: 40px; padding: 40px 0 40px 16px; margin: 0 -16px; } }
.process ol li:hover { background: var(--muted-bg); }
.process ol li .num { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.2em; color: var(--brass-deep); }
.process ol li h3 { font-size: 24px; }
@media (min-width: 768px) { .process ol li h3 { font-size: 32px; } }
.process ol li p { margin-top: 12px; max-width: 40rem; color: var(--ink-70); }
.process ol li .arrow { display: none; color: var(--brass-deep); margin-top: 8px; }
@media (min-width: 768px) { .process ol li .arrow { display: inline; } }

/* ---------- Numbers ---------- */
.numbers { background: var(--ink); color: var(--bone); }
.numbers-grid { max-width: 1400px; margin: 0 auto; padding: 64px 24px; display: grid; gap: 40px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .numbers-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px) { .numbers-grid { grid-template-columns: repeat(4, 1fr); padding: 80px 24px; } }
.numbers-grid .item { border-left: 1px solid rgba(201,163,74,0.4); padding-left: 24px; }
.numbers-grid .item .k { font-family: var(--font-display); color: var(--brass); font-size: 40px; }
@media (min-width: 768px) { .numbers-grid .item .k { font-size: 46px; } }
.numbers-grid .item .v { margin-top: 8px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.22em; color: var(--bone-70); }

/* ---------- Testimonials ---------- */
.testimonials { border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--muted-bg); }
.testimonials-inner { max-width: 1400px; margin: 0 auto; padding: 96px 24px; }
@media (min-width: 768px) { .testimonials-inner { padding: 128px 24px; } }
.testimonials-header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 24px; }
.testimonials-header h2 { margin-top: 24px; font-size: clamp(2.25rem, 5vw, 3.75rem); }
.testimonials-header .stars { color: var(--brass-deep); display: flex; align-items: center; gap: 8px; }
.testimonials-header .stars .s { font-size: 24px; }
.testimonials-header .stars .lbl { margin-left: 8px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.22em; color: var(--ink-60); }
.testimonials-grid { margin-top: 56px; display: grid; gap: 1px; background: var(--border); }
@media (min-width: 900px) { .testimonials-grid { grid-template-columns: repeat(3, 1fr); } }
.testimonials-grid figure { background: var(--bone); padding: 32px; display: flex; flex-direction: column; justify-content: space-between; gap: 32px; }
@media (min-width: 768px) { .testimonials-grid figure { padding: 40px; } }
.testimonials-grid .mark { font-family: var(--font-display); font-size: 60px; line-height: 1; color: var(--brass); }
.testimonials-grid blockquote { margin-top: 16px; font-family: var(--font-display); font-size: 22px; line-height: 1.3; }
@media (min-width: 768px) { .testimonials-grid blockquote { font-size: 26px; } }
.testimonials-grid figcaption .name { font-size: 14px; font-weight: 500; }
.testimonials-grid figcaption .loc { margin-top: 4px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.22em; color: var(--ink-55); }

/* ---------- FAQ ---------- */
.faq { max-width: 1400px; margin: 0 auto; padding: 96px 24px; }
@media (min-width: 768px) { .faq { padding: 144px 24px; } }
.faq-grid { display: grid; gap: 48px; }
@media (min-width: 768px) { .faq-grid { grid-template-columns: 1fr 2fr; gap: 80px; } }
.faq h2 { margin-top: 24px; font-size: clamp(2.25rem, 5vw, 3.75rem); }
.faq .lead { margin-top: 24px; max-width: 22rem; color: var(--ink-70); }
.faq .lead a { text-decoration: underline; text-underline-offset: 4px; }
.faq .lead a:hover { color: var(--brass-deep); }
.faq details { border-bottom: 1px solid var(--border); padding: 24px 0; }
.faq details:first-of-type { border-top: 1px solid var(--border); }
.faq summary { display: flex; align-items: center; justify-content: space-between; gap: 24px; cursor: pointer; list-style: none; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary span.q { font-family: var(--font-display); font-size: 22px; }
@media (min-width: 768px) { .faq summary span.q { font-size: 28px; } }
.faq summary .plus { font-family: var(--font-mono); font-size: 24px; color: var(--brass-deep); transition: transform 200ms ease; }
.faq details[open] summary .plus { transform: rotate(45deg); }
.faq details p { margin-top: 16px; max-width: 48rem; color: var(--ink-70); line-height: 1.7; }

/* ---------- CTA ---------- */
.cta { position: relative; isolate: isolate; overflow: hidden; background: var(--ink); color: var(--bone); }
.cta-bg { position: absolute; inset: 0; }
.cta-bg img { width: 100%; height: 100%; object-fit: cover; opacity: 0.45; }
.cta-bg .grad { position: absolute; inset: 0; background: linear-gradient(to top, var(--ink), rgba(26,23,18,0.8), rgba(26,23,18,0.4)); }
.cta-inner { position: relative; max-width: 1400px; margin: 0 auto; padding: 96px 24px; display: grid; gap: 56px; }
@media (min-width: 900px) { .cta-inner { grid-template-columns: 1.4fr 1fr; padding: 144px 24px; } }
.cta h2 { margin-top: 24px; font-size: clamp(3rem, 8vw, 8rem); line-height: 0.95; }
.cta .lead { margin-top: 32px; max-width: 36rem; color: var(--bone-80); font-size: 18px; line-height: 1.7; }
.cta .ctas { margin-top: 40px; display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }

/* Form */
.quote-form { background: var(--bone); color: var(--ink); padding: 32px; }
@media (min-width: 768px) { .quote-form { padding: 40px; } }
.quote-form .form-head { display: flex; align-items: center; justify-content: space-between; }
.quote-form .form-head h3 { font-size: 30px; }
.quote-form .form-head .meta { font-size: 11px; text-transform: uppercase; letter-spacing: 0.22em; color: var(--ink-50); }
.quote-form .fields { margin-top: 32px; display: grid; gap: 20px; }
.quote-form .row { display: grid; gap: 20px; }
@media (min-width: 640px) { .quote-form .row { grid-template-columns: 1fr 1fr; } }
.quote-form label { display: block; }
.quote-form label .lbl { font-size: 11px; text-transform: uppercase; letter-spacing: 0.22em; color: var(--ink-60); }
.quote-form label .lbl .req { color: var(--brass-deep); }
.quote-form input, .quote-form select, .quote-form textarea {
  margin-top: 8px; width: 100%; padding: 12px 16px;
  background: var(--bone); color: var(--ink);
  border: 1px solid var(--border); font: inherit; font-size: 14px;
  outline: none; transition: border-color 200ms ease;
}
.quote-form input:focus, .quote-form select:focus, .quote-form textarea:focus { border-color: var(--brass-deep); }
.quote-form textarea { resize: vertical; min-height: 100px; }
.quote-form button { margin-top: 8px; width: 100%; }
.quote-form .disclaimer { font-size: 11px; color: var(--ink-50); }

/* ---------- Contact ---------- */
.contact { border-bottom: 1px solid var(--border); background: var(--bone); }
.contact-inner { max-width: 1400px; margin: 0 auto; padding: 80px 24px; display: grid; gap: 40px; }
@media (min-width: 900px) { .contact-inner { grid-template-columns: repeat(4, 1fr); padding: 96px 24px; } }
.contact h3 { margin-top: 24px; font-size: 28px; }
.contact-card { border-left: 1px solid var(--border); padding-left: 24px; transition: color 200ms ease; }
.contact-card:hover { color: var(--brass-deep); }
.contact-card .lbl { font-size: 11px; text-transform: uppercase; letter-spacing: 0.22em; color: var(--brass-deep); }
.contact-card .primary { margin-top: 12px; font-family: var(--font-display); font-size: 24px; }
@media (min-width: 768px) { .contact-card .primary { font-size: 30px; } }
.contact-card .sub { margin-top: 8px; font-size: 14px; color: var(--ink-60); }

/* ---------- Footer ---------- */
footer { background: var(--ink); color: var(--bone); }
.footer-top { max-width: 1400px; margin: 0 auto; padding: 64px 24px; display: grid; gap: 48px; }
@media (min-width: 768px) { .footer-top { grid-template-columns: 2fr 1fr 1fr 1fr; padding: 80px 24px; } }
.footer-brand img { height: 56px; filter: brightness(0) invert(1); }
.footer-brand p { margin-top: 24px; max-width: 24rem; color: var(--bone-70); }
.footer-brand .socials { margin-top: 24px; }
.footer-col .head { font-family: var(--font-sans); font-size: 11px; letter-spacing: 0.28em; text-transform: uppercase; color: var(--brass); font-weight: 500; }
.footer-col ul { margin-top: 20px; display: grid; gap: 12px; font-size: 14px; }
.footer-col a { transition: color 200ms ease; }
.footer-col a:hover { color: var(--brass); }
.footer-bottom { border-top: 1px solid var(--bone-15); }
.footer-bottom-inner { max-width: 1400px; margin: 0 auto; padding: 24px; display: flex; flex-direction: column; gap: 12px; justify-content: space-between; font-size: 11px; text-transform: uppercase; letter-spacing: 0.22em; color: var(--bone-55); }
@media (min-width: 640px) { .footer-bottom-inner { flex-direction: row; align-items: center; } }
