/* Layout for the North Wales design landing page. Shared site styles stay intact. */
.nw-design {
  --nw-green: #193b31;
  --nw-green-deep: #122c25;
  --nw-sage: #e8eee3;
  --nw-border: #cfd8cc;
}

.nw-design :is(section, form)[id] { scroll-margin-top: 7rem; }
.nw-design .nw-breadcrumbs { margin-block: 1.05rem 0; }
.nw-hero { padding-block: clamp(1.6rem, 4vw, 3.75rem) clamp(2.4rem, 5vw, 4.75rem); }
.nw-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  align-items: center;
  gap: clamp(1.75rem, 4.5vw, 4.2rem);
}
.nw-hero-copy, .nw-project, .nw-enquiry-grid > * { min-width: 0; }
.nw-hero h1 {
  max-width: 13ch;
  margin: .5rem 0 1.05rem;
  font-size: clamp(2.55rem, 4.9vw, 4.45rem);
  line-height: 1.01;
  letter-spacing: -.065em;
  text-wrap: balance;
}
.nw-hero-lead { max-width: 47ch; margin: 0; color: var(--muted); font-size: clamp(1rem, 1.45vw, 1.18rem); line-height: 1.6; }
.nw-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem 1.15rem; margin-top: 1.5rem; }
.nw-actions .button { white-space: normal; text-align: center; }
.nw-hero-note { margin: .9rem 0 0; font-size: .9rem; color: var(--muted); }
.nw-feature {
  margin: 0;
  padding: clamp(.7rem, 1.45vw, 1.1rem);
  color: #f8fbf7;
  background: var(--nw-green);
  border: 1px solid var(--nw-green-deep);
  border-radius: 1.3rem;
  box-shadow: 0 22px 55px rgb(19 44 37 / .17);
}
.nw-design .nw-feature-tag { display: flex; align-items: center; gap: .55rem; margin: .1rem .15rem .65rem; color: #d8e5db; font-size: .74rem; letter-spacing: .09em; text-transform: uppercase; }
.nw-feature-tag::before { content: ""; width: .48rem; height: .48rem; border-radius: 50%; background: var(--brand); flex: 0 0 auto; }
.nw-feature img, .nw-project img { display: block; width: 100%; height: auto; }
.nw-feature img { border-radius: .65rem; background: #e6ece3; }
.nw-feature figcaption { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .25rem .9rem; padding: .85rem .15rem .1rem; }
.nw-feature figcaption strong { font-size: clamp(1rem, 1.6vw, 1.23rem); }
.nw-feature figcaption a { color: #ffe08e; text-decoration: underline; text-underline-offset: .22em; font-weight: 650; }
.nw-feature figcaption a:focus-visible { outline-color: var(--brand); }

.nw-work { padding-block: clamp(2.9rem, 6vw, 5rem); background: var(--nw-sage); border-block: 1px solid var(--nw-border); }
.nw-section-intro { max-width: 55ch; margin-bottom: 1.55rem; }
.nw-design .nw-section-intro h2, .nw-design .nw-enquiry-copy h2 { margin: .35rem 0 .65rem; font-size: clamp(1.9rem, 3.6vw, 3.2rem); line-height: 1.08; letter-spacing: -.045em; text-wrap: balance; }
.nw-section-intro > p:last-child, .nw-enquiry-copy > p:not(.eyebrow) { margin: 0; color: var(--muted); }
.nw-work-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 1.25rem; align-items: start; }
.nw-project { margin: 0; overflow: hidden; border-radius: 1rem; background: var(--paper); border: 1px solid var(--nw-border); }
.nw-project img { aspect-ratio: 740 / 531; object-fit: cover; object-position: top; background: var(--nw-green); }
.nw-project figcaption { padding: 1.05rem 1.2rem 1.2rem; }
.nw-project figcaption h3, .nw-project-links h3 { margin: .22rem 0 .4rem; font-size: 1.3rem; line-height: 1.2; }
.nw-project figcaption p { margin: .2rem 0 .65rem; color: var(--muted); }
.nw-project figcaption .nw-project-type, .nw-project-type { font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: #495d46; font-weight: 700; }
.nw-project-links { padding: .3rem 1.15rem; border: 1px solid var(--nw-border); border-radius: 1rem; background: var(--paper); }
.nw-project-links > h3 { padding-top: .7rem; }
.nw-project-links ul { list-style: none; margin: 0; padding: 0; }
.nw-project-links li + li { border-top: 1px solid var(--nw-border); }
.nw-project-links a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .18rem .7rem; align-items: center; padding: .8rem 0; color: var(--ink); text-decoration: none; }
.nw-project-links a:hover strong { text-decoration: underline; text-underline-offset: .17em; }
.nw-project-links a span:first-child { color: var(--muted); font-size: .78rem; grid-column: 1 / -1; }
.nw-project-links .nw-link-arrow { font-size: 1.2rem; color: var(--brand-deep); }
.nw-project-links .nw-project-summary { grid-column: 1 / -1; font-size: .9rem; color: var(--muted); }

.nw-services, .nw-faq { padding-block: clamp(2.65rem, 5.4vw, 4.5rem); }
.nw-services-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .85rem; }
.nw-service { padding: 1.1rem 1.2rem 1.35rem; border-top: 3px solid var(--nw-green); background: var(--paper); border-radius: .2rem .2rem .8rem .8rem; }
.nw-service:nth-child(2) { border-color: #a86b11; }
.nw-service h3 { margin: .4rem 0 .45rem; font-size: 1.25rem; line-height: 1.2; }
.nw-service p { margin: 0 0 .65rem; color: var(--muted); }
.nw-service p:last-child { margin-bottom: 0; }
.nw-service .nw-project-type { color: #495d46; }
.nw-faq { padding-top: 0; }
.nw-faq-grid { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: 1rem 2rem; }
.nw-faq details { border-top: 1px solid var(--nw-border); }
.nw-faq details:last-child { border-bottom: 1px solid var(--nw-border); }
.nw-faq summary { cursor: pointer; padding: .8rem .2rem; font-weight: 700; color: var(--ink); }
.nw-faq details p { margin: 0 .2rem .95rem; max-width: 63ch; color: var(--muted); }

.nw-enquiry { padding-block: clamp(2.7rem, 6vw, 5rem); background: var(--nw-sage); border-top: 1px solid var(--nw-border); }
.nw-enquiry-grid { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); gap: clamp(1.4rem, 5vw, 4.2rem); align-items: start; }
.nw-enquiry-copy { max-width: 40ch; }
.nw-enquiry-copy ol { margin: 1.15rem 0; padding-left: 1.35rem; }
.nw-enquiry-copy li { margin-block: .65rem; padding-left: .2rem; }
.nw-enquiry-copy .nw-contact-links { margin-top: 1.3rem; }
.nw-design .nw-form { margin: 0; padding: clamp(1rem, 3vw, 1.75rem); background: var(--paper); border: 1px solid var(--nw-border); border-radius: 1rem; box-shadow: 0 14px 35px rgb(19 44 37 / .08); }
.nw-form h3 { margin: 0 0 .15rem; font-size: 1.45rem; }
.nw-form .nw-form-intro { margin: 0 0 .35rem; color: var(--muted); font-size: .92rem; }
.nw-form .contact-form-grid > label { min-width: 0; }
.nw-form .form-note { margin: 0; }

@media (max-width: 920px) {
  .nw-hero-grid { gap: 1.6rem; }
  .nw-hero h1 { font-size: clamp(2.4rem, 5.25vw, 3.4rem); }
}
@media (max-width: 720px) {
  .nw-hero-grid, .nw-work-grid, .nw-services-grid, .nw-faq-grid, .nw-enquiry-grid { grid-template-columns: minmax(0, 1fr); }
  .nw-hero h1 { max-width: 15ch; font-size: clamp(2.25rem, 8.5vw, 3.5rem); }
  .nw-hero { padding-block: 1.25rem 2.35rem; }
  .nw-hero-note { margin-top: .7rem; }
  .nw-feature { border-radius: .9rem; }
  .nw-work-grid { gap: .85rem; }
  .nw-design .nw-section-intro { margin-bottom: 1.15rem; }
  .nw-form .contact-form-grid { grid-template-columns: minmax(0, 1fr); }
}