/* Premium CNC Cut & Design - post-migration enhancement layer.
   Every token below was lifted from the site's OWN computed styles on the live
   staging render (scripts/render-profile.json), not inferred from source CSS.
   Astra + Elementor fight injected rules, so typography and colour are set in
   explicit px with !important. Loaded with ?v=N because /wp-content/ is served
   immutable for one year. */

:root {
  --pcd-accent: #ffbc28;
  --pcd-ink: #000000;
  --pcd-body: #727272;
  --pcd-page: #edeeef;
  --pcd-surface: #ffffff;
  --pcd-band: #f5f5f5;
  --pcd-display: "EB Garamond", Georgia, serif;
  --pcd-text: "IBM Plex Sans", -apple-system, "Segoe UI", sans-serif;
  --pcd-btn: Manrope, -apple-system, "Segoe UI", sans-serif;
}

/* 48px scroll anchor so in-page jumps clear the header */
.pcd-section { scroll-margin-top: 48px; }

/* The donor hero container carries 250px/350px padding because a Trustindex
   badge overlaps it on the mirrored service page. Generated pages have no badge,
   so the padding is retuned while the image, overlay and type stay untouched. */
.elementor .elementor-element.pcd-hero {
  --padding-top: 190px !important;
  --padding-bottom: 120px !important;
}
@media (max-width: 767px) {
  .elementor .elementor-element.pcd-hero {
    --padding-top: 130px !important;
    --padding-bottom: 70px !important;
  }
}

.pcd-band {
  background: var(--pcd-surface);
  padding: 80px 40px;
}
.pcd-band--grey { background: var(--pcd-band); }
.pcd-band--ink { background: var(--pcd-ink); }
.pcd-inner { max-width: 1140px; margin: 0 auto; }

.pcd-band h2.pcd-h2 {
  font-family: var(--pcd-display) !important;
  font-size: 44px !important;
  line-height: 48.4px !important;
  font-weight: 600 !important;
  color: var(--pcd-ink) !important;
  margin: 0 0 20px !important;
}
.pcd-band--ink h2.pcd-h2 { color: #ffffff !important; }
.pcd-band--ink .pcd-p { color: #e9e9e9 !important; }
.pcd-band h3.pcd-h3 {
  font-family: var(--pcd-display) !important;
  font-size: 28px !important;
  line-height: 39.2px !important;
  font-weight: 600 !important;
  color: var(--pcd-ink) !important;
  margin: 5px 0 10px !important;
}
.pcd-kicker {
  font-family: var(--pcd-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 1.4px !important;
  text-transform: uppercase !important;
  color: #7a5c00 !important;
  margin: 0 0 10px !important;
}
.pcd-band--ink .pcd-kicker { color: #ffbc28 !important; }
.pcd-p {
  font-family: var(--pcd-text) !important;
  font-size: 16px !important;
  line-height: 27.2px !important;
  font-weight: 400 !important;
  color: #444444 !important;
  margin: 0 0 18px !important;
}

/* Buttons: pill, Manrope 600 16px, 16px 36px - the site's own button tokens */
.pcd-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--pcd-btn) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  padding: 16px 36px !important;
  border-radius: 50px !important;
  border: 2px solid var(--pcd-accent) !important;
  background: var(--pcd-accent) !important;
  color: #000000 !important;
  text-decoration: none !important;
  transition: transform .18s ease, background .18s ease, color .18s ease;
}
.pcd-btn:hover, .pcd-btn:focus-visible {
  transform: translateY(-2px);
  background: #000000 !important;
  color: #ffbc28 !important;
}
.pcd-btn--ink {
  background: #000000 !important;
  color: #ffbc28 !important;
  border-color: #000000 !important;
}
.pcd-btn--ink:hover, .pcd-btn--ink:focus-visible {
  background: #ffbc28 !important;
  color: #000000 !important;
  border-color: #ffbc28 !important;
}
.pcd-btn:focus-visible { outline: 3px solid #0b5cab; outline-offset: 3px; }
/* A long label such as "Bespoke Stairs & CNC Panels in Portadown" must never be
   the thing that pushes a narrow viewport into horizontal scroll. */
.pcd-btn { max-width: 100%; box-sizing: border-box; text-align: center; }
.pcd-cta-row { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 26px; }

/* Above-fold CTA strip, sits directly under the mirrored hero */
.pcd-abovefold { background: #000000; padding: 22px 40px; }
.pcd-abovefold .pcd-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  justify-content: space-between;
}
.pcd-abovefold .pcd-p { color: #ffffff !important; margin: 0 !important; }
.pcd-abovefold .pcd-cta-row { margin-top: 0; }

/* Breadcrumbs */
.pcd-crumbs {
  font-family: var(--pcd-text) !important;
  font-size: 13px !important;
  color: #444444 !important;
  background: var(--pcd-page);
  padding: 14px 40px;
}
.pcd-crumbs a { color: #6b4e00 !important; text-decoration: underline !important; }
.pcd-crumbs .pcd-inner { max-width: 1140px; margin: 0 auto; }

/* Town cards: pin icon plus hover lift. Never plain outline pills. */
.pcd-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 20px;
  margin-top: 28px;
}
.pcd-card {
  display: block;
  background: #ffffff;
  border: 1px solid #e2e2e2;
  border-left: 5px solid var(--pcd-accent);
  padding: 24px 26px;
  text-decoration: none !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.05);
  transition: transform .2s ease, box-shadow .2s ease;
}
.pcd-card:hover, .pcd-card:focus-visible {
  transform: translateY(-4px);
  box-shadow: 0 12px 26px rgba(0,0,0,.12);
}
.pcd-card:focus-visible { outline: 3px solid #0b5cab; outline-offset: 2px; }
.pcd-pin {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #7a5c00 !important;
  font-family: var(--pcd-text) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 1.2px !important;
  text-transform: uppercase !important;
}
.pcd-card-title {
  display: block;
  font-family: var(--pcd-display) !important;
  font-size: 26px !important;
  line-height: 32px !important;
  font-weight: 600 !important;
  color: #000000 !important;
  margin: 8px 0 6px !important;
}
.pcd-card-note {
  display: block;
  font-family: var(--pcd-text) !important;
  font-size: 15px !important;
  line-height: 24px !important;
  color: #444444 !important;
  margin: 0 !important;
}

.pcd-svc-row { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 24px; }

/* FAQ accordion, built off the site's own .elementor-tab-title tokens */
.pcd-faq { margin-top: 28px; border-top: 1px solid #e2e2e2; }
.pcd-faq details { border-bottom: 1px solid #e2e2e2; background: #ffffff; }
.pcd-faq summary {
  list-style: none;
  cursor: pointer;
  font-family: var(--pcd-text) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 26px !important;
  color: #333333 !important;
  padding: 20px 44px 20px 20px !important;
  position: relative;
}
.pcd-faq summary::-webkit-details-marker { display: none; }
.pcd-faq summary::after {
  content: "+";
  position: absolute;
  right: 20px;
  top: 16px;
  font-size: 22px;
  font-weight: 600;
  color: #7a5c00;
}
.pcd-faq details[open] summary::after { content: "\2212"; }
.pcd-faq summary:focus-visible { outline: 3px solid #0b5cab; outline-offset: -3px; }
.pcd-faq .pcd-a {
  font-family: var(--pcd-text) !important;
  font-size: 16px !important;
  line-height: 27.2px !important;
  color: #444444 !important;
  margin: 0 !important;
  padding: 0 20px 22px !important;
}

/* Local considerations prose */
.pcd-prose { display: grid; grid-template-columns: 1fr; gap: 0 40px; }
@media (min-width: 900px) { .pcd-prose { grid-template-columns: 1fr 1fr; } }

.pcd-list { list-style: none; margin: 22px 0 0; padding: 0; }
.pcd-list li {
  font-family: var(--pcd-text) !important;
  font-size: 16px !important;
  line-height: 27.2px !important;
  color: #444444 !important;
  padding: 0 0 12px 30px;
  position: relative;
}
.pcd-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 12px;
  height: 12px;
  background: var(--pcd-accent);
}
.pcd-list li strong { color: #000000 !important; }

/* Homepage coverage strip */
.pcd-coverage { background: var(--pcd-band); padding: 70px 40px; }

@media (max-width: 767px) {
  .pcd-band, .pcd-coverage { padding: 52px 22px; }
  .pcd-band h2.pcd-h2 { font-size: 32px !important; line-height: 36px !important; }
  .pcd-band h3.pcd-h3 { font-size: 24px !important; line-height: 32px !important; }
  .pcd-abovefold { padding: 18px 22px; }
  .pcd-crumbs { padding: 12px 22px; }
  .pcd-btn { padding: 14px 22px !important; font-size: 15px !important; }
  .pcd-svc-row .pcd-btn, .pcd-cta-row .pcd-btn { width: 100%; }
  .pcd-grid { grid-template-columns: 1fr; }
}
@media (max-width: 360px) {
  .pcd-band, .pcd-coverage { padding: 44px 16px; }
  .pcd-btn { padding: 13px 16px !important; font-size: 14px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .pcd-btn, .pcd-card { transition: none !important; }
  .pcd-btn:hover, .pcd-card:hover { transform: none !important; }
}