/*
Theme Name: Lancashire Damp Proofing
Theme URI: https://lancashiredampproofing.com
Author: W Web Design & Hosting
Author URI: https://wwebdesign.co.uk
Description: Lean custom theme for Lancashire Damp Proofing — code-registered ACF blocks, no page builder, no build step. Rebuilt like-for-like from the original Elementor/Kadence site.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: lancashiredampproofing
*/

/* ==========================================================================
   Design tokens
   ========================================================================== */
:root {
  --ldp-navy:        #1f2d3a;  /* primary dark / hero panel / footer      */
  --ldp-navy-dark:   #16222c;  /* top utility bar                          */
  --ldp-gold:        #fbc214;  /* brand accent / nav bar / buttons         */
  --ldp-gold-dark:   #e3ac06;  /* button hover                             */
  --ldp-ink:         #212121;  /* body text                                */
  --ldp-slate:       #4e4b66;  /* muted text                               */
  --ldp-bg:          #ffffff;  /* page background                          */
  --ldp-muted:       #f4f4f4;  /* alt section background / cards           */
  --ldp-border:      #ebebeb;  /* hairlines                                */
  --ldp-card-bg:     #ffffff;

  --ldp-content-max: 1200px;
  --ldp-header-height: 92px;

  --ldp-font: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* ==========================================================================
   Base
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--ldp-font);
  font-size: 17px;
  line-height: 1.6;
  color: var(--ldp-ink);
  background: var(--ldp-bg);
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }

a { color: var(--ldp-navy); text-decoration: none; }
a:hover { color: var(--ldp-gold-dark); }

h1, h2, h3, h4 {
  font-family: var(--ldp-font);
  color: var(--ldp-navy);
  line-height: 1.2;
  margin: 0 0 .5em;
  font-weight: 700;
}
h1 { font-size: clamp(2rem, 4vw, 3rem); }
h2 { font-size: clamp(1.6rem, 3vw, 2.25rem); }
h3 { font-size: clamp(1.2rem, 2vw, 1.5rem); }

p { margin: 0 0 1rem; }

/* ==========================================================================
   Layout helpers
   ========================================================================== */
.ldp-container {
  width: 100%;
  max-width: var(--ldp-content-max);
  margin-inline: auto;
  padding-inline: 24px;
}

.ldp-section { padding-block: clamp(48px, 6vw, 88px); }
.ldp-section--muted { background: var(--ldp-muted); }
.ldp-section--navy { background: var(--ldp-navy); color: #fff; }
.ldp-section--navy h1,
.ldp-section--navy h2,
.ldp-section--navy h3 { color: #fff; }

/* ==========================================================================
   Buttons
   ========================================================================== */
.ldp-btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: 14px 30px;
  font-weight: 700;
  font-size: .95rem;
  border-radius: 4px;
  border: 2px solid transparent;
  cursor: pointer;
  transition: background .2s ease, color .2s ease, border-color .2s ease;
  line-height: 1;
}
.ldp-btn--gold { background: var(--ldp-gold); color: var(--ldp-navy); }
.ldp-btn--gold:hover { background: var(--ldp-gold-dark); color: var(--ldp-navy); }
.ldp-btn--navy { background: var(--ldp-navy); color: #fff; }
.ldp-btn--navy:hover { background: var(--ldp-navy-dark); color: #fff; }
.ldp-btn--outline { background: transparent; border-color: var(--ldp-gold); color: var(--ldp-navy); }
.ldp-btn--outline:hover { background: var(--ldp-gold); color: var(--ldp-navy); }
.ldp-section--navy .ldp-btn--outline { color: #fff; }
.ldp-section--navy .ldp-btn--outline:hover { color: var(--ldp-navy); }

.ldp-eyebrow {
  display: inline-block;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ldp-gold-dark);
  margin-bottom: .6rem;
}

/* ==========================================================================
   Page header / breadcrumb banner (block + plain fallback share these)
   ========================================================================== */
.ldp-page-header {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: 340px;
  padding-block: 40px;
  background: var(--ldp-navy);
  background-size: cover;
  background-position: center;
  color: #fff;
}
.ldp-page-header--plain { min-height: 220px; }
.ldp-page-header__title { color: #fff; margin: 0 0 8px; }
.ldp-page-header__crumbs { font-weight: 600; font-size: .9rem; color: rgba(255,255,255,.9); }
.ldp-page-header__crumbs a { color: rgba(255,255,255,.9); }
.ldp-page-header__crumbs a:hover { color: var(--ldp-gold); }
.ldp-page-header__crumbs span span { color: var(--ldp-gold); }
.ldp-crumb-sep { color: rgba(255,255,255,.6); }

/* ==========================================================================
   Prose (rich text / legal pages / single post body)
   ========================================================================== */
.ldp-prose { max-width: 820px; }
.ldp-prose h2 { margin-top: 1.6em; }
.ldp-prose h3 { margin-top: 1.4em; }
.ldp-prose ul, .ldp-prose ol { padding-left: 1.3em; margin: 0 0 1.2em; }
.ldp-prose li { margin-bottom: .5em; }
.ldp-prose a { color: var(--ldp-gold-dark); text-decoration: underline; }
.ldp-prose img { border-radius: 6px; margin: 1.2em 0; }

/* Photo grid (e.g. service-page galleries) */
.ldp-photo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 18px;
}
.ldp-photo-grid img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 8px;
  display: block;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .10);
}

/* Screen-reader only */
.screen-reader-text {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.ldp-icon { width: 1em; height: 1em; display: inline-block; vertical-align: middle; }