/* Compact layout overrides — v2 (tighter hero) */

/* 1) Global rhythm */
html { scroll-behavior: smooth; }
body { line-height: 1.45; }

h1, h2, h3, h4, h5, h6 { margin: 0 0 .6em; line-height: 1.15; }
p { margin: 0 0 .75rem; }
ul, ol { margin: .5rem 0 .75rem; padding-left: 1.1rem; }

/* 2) Containers & grids */
.container { padding-left: 1rem; padding-right: 1rem; }
.grid, .grid-3 { gap: 1rem; }

/* 3) Sections */
.section { padding: 2rem 0; }
.section-title { margin-bottom: .75rem; }

/* 4) Header */
.header .header-inner { padding-top: .5rem; padding-bottom: .5rem; }

/* 5) Hero (tighter) */
.hero picture img { object-fit: cover; width: 100%; height: auto; }
.hero .hero-content { padding-top: 1rem; padding-bottom: 1rem; }
.hero .subtle { margin-bottom: .2rem; }
.hero .hero-content p { max-width: 46ch; }
@media (min-width: 768px) { .hero { min-height: 42vh; } }
@media (max-width: 767px) { .hero { min-height: 38vh; } }

/* 6) Cards */
.card { padding: 1rem; }

/* 7) Process */
.process li { margin-bottom: .4rem; }

/* 8) Contact box */
.contact-box { border: 1px solid #e2e8f0; border-radius: .5rem; padding: 1rem; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.contact-grid .full { grid-column: 1 / -1; }
.contact-box label { display:block; font-size: .9rem; margin-bottom: .25rem; }
.contact-box input, .contact-box textarea { width:100%; padding:.6rem .7rem; border:1px solid #cbd5e1; border-radius:.375rem; font: inherit; }
.contact-box textarea { min-height: 120px; }

/* 9) Footer */
.footer .container { padding-top: .75rem; padding-bottom: .75rem; }

/* 10) Small screens tighten a bit more */
@media (max-width: 767px) {
  .section { padding: 1.5rem 0; }
  .grid, .grid-3 { gap: .75rem; }
}