/*
Theme Name:  Barriers and Gates Direct
Theme URI:   https://barriersandgatesdirect.co.uk
Author:      Greg Mac
Description: Custom theme for Barriers and Gates Direct – a UK supplier and installer of barriers, bollards and gates.
Version:     1.0.2
Requires at least: 6.4
Requires PHP: 8.0
License:     Private
Text Domain: bgd
*/

/* ============================================================
   CUSTOM PROPERTIES
   ============================================================ */
:root {
  --bgd-navy:       #111111;
  --bgd-navy-dark:  #0A0A0A;
  --bgd-orange:     #CC0000;
  --bgd-orange-dark:#A30000;
  --bgd-light:      #F4F6F8;
  --bgd-border:     #DDE2E8;
  --bgd-text:       #2C3E50;
  --bgd-text-muted: #6B7A8D;
  --bgd-white:      #FFFFFF;

  --bgd-font:       'Inter', sans-serif;
  --bgd-radius:     6px;
  --bgd-radius-lg:  12px;
  --bgd-shadow:     0 2px 12px rgba(0,0,0,.10);
  --bgd-shadow-lg:  0 6px 30px rgba(0,0,0,.16);

  --bgd-max-width:  1200px;
  --bgd-gap:        2rem;
}

/* ============================================================
   RESET & BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; font-size: 16px; }

body {
  font-family: var(--bgd-font);
  color: var(--bgd-text);
  background: var(--bgd-white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }
a  { color: var(--bgd-orange); text-decoration: none; }
a:hover { color: var(--bgd-orange-dark); }

ul, ol { list-style: none; }

/* ============================================================
   TYPOGRAPHY
   ============================================================ */
h1, h2, h3, h4, h5 {
  font-family: var(--bgd-font);
  color: var(--bgd-navy);
  line-height: 1.2;
  font-weight: 700;
}
h1 { font-size: clamp(2rem, 5vw, 3.5rem); }
h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); }
h3 { font-size: 1.4rem; }
h4 { font-size: 1.15rem; }
p  { margin-bottom: 1rem; }
p:last-child { margin-bottom: 0; }

/* ============================================================
   LAYOUT UTILITIES
   ============================================================ */
.container {
  max-width: var(--bgd-max-width);
  margin: 0 auto;
  padding: 0 1.5rem;
}
.section { padding: 5rem 0; }
.section--sm { padding: 3rem 0; }
.section--lg { padding: 7rem 0; }
.text-center { text-align: center; }
.text-white { color: var(--bgd-white) !important; }
.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .85rem 2rem;
  border-radius: var(--bgd-radius);
  font-family: var(--bgd-font);
  font-size: .95rem;
  font-weight: 600;
  cursor: pointer;
  transition: background .2s, transform .1s, box-shadow .2s;
  border: 2px solid transparent;
  text-decoration: none;
  white-space: nowrap;
}
.btn:hover { transform: translateY(-1px); text-decoration: none; }
.btn:active { transform: translateY(0); }

.btn--primary {
  background: var(--bgd-orange);
  color: var(--bgd-white);
  border-color: var(--bgd-orange);
}
.btn--primary:hover {
  background: var(--bgd-orange-dark);
  border-color: var(--bgd-orange-dark);
  color: var(--bgd-white);
  box-shadow: 0 4px 16px rgba(232,80,10,.35);
}

.btn--outline {
  background: transparent;
  color: var(--bgd-white);
  border-color: var(--bgd-white);
}
.btn--outline:hover {
  background: var(--bgd-white);
  color: var(--bgd-navy);
}

.btn--navy {
  background: var(--bgd-navy);
  color: var(--bgd-white);
  border-color: var(--bgd-navy);
}
.btn--navy:hover {
  background: var(--bgd-navy-dark);
  border-color: var(--bgd-navy-dark);
  color: var(--bgd-white);
}

.btn--quote {
  background: var(--bgd-orange);
  color: var(--bgd-white);
  border-color: var(--bgd-orange);
  width: 100%;
  justify-content: center;
}
.btn--quote:hover {
  background: var(--bgd-orange-dark);
  border-color: var(--bgd-orange-dark);
  color: var(--bgd-white);
}

.btn--sm {
  padding: .55rem 1.2rem;
  font-size: .85rem;
}

/* ============================================================
   SECTION HEADINGS
   ============================================================ */
.section-heading {
  text-align: center;
  margin-bottom: 3rem;
}
.section-heading__eyebrow {
  display: inline-block;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--bgd-orange);
  margin-bottom: .6rem;
}
.section-heading h2 { margin-bottom: .75rem; }
.section-heading p {
  color: var(--bgd-text-muted);
  max-width: 52ch;
  margin: 0 auto;
  font-size: 1.05rem;
}

/* ============================================================
   VALUE BAR
   ============================================================ */
.value-bar {
  background: var(--bgd-navy);
  color: var(--bgd-white);
  padding: .6rem 0;
  font-size: .85rem;
  overflow: hidden;
}
.value-bar__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2.5rem;
  flex-wrap: wrap;
}
.value-bar__item {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-weight: 500;
}
.value-bar__item svg {
  color: var(--bgd-orange);
  flex-shrink: 0;
}

/* ============================================================
   HEADER
   ============================================================ */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--bgd-white);
  border-bottom: 2px solid var(--bgd-border);
  box-shadow: var(--bgd-shadow);
}
.header__inner {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 1.5rem;
  padding: .9rem 1.5rem;
  max-width: var(--bgd-max-width);
  margin: 0 auto;
}

/* Logo */
.header__logo a {
  display: flex;
  align-items: center;
  gap: .75rem;
  text-decoration: none;
}
.header__logo img, .header__logo svg {
  height: 68px;
  width: auto;
}
.header__logo-text {
  display: flex;
  flex-direction: column;
  line-height: 1.1;
}
.header__logo-text strong {
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--bgd-navy);
}
.header__logo-text span {
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--bgd-orange);
  font-weight: 600;
}

/* Nav */
.header__nav { justify-self: center; }
.primary-nav__list {
  display: flex;
  align-items: center;
  gap: .25rem;
}
.primary-nav__list a {
  display: block;
  padding: .5rem .9rem;
  font-size: .9rem;
  font-weight: 600;
  color: var(--bgd-navy);
  border-radius: var(--bgd-radius);
  transition: background .15s, color .15s;
}
.primary-nav__list a:hover,
.primary-nav__list .current-menu-item > a {
  background: var(--bgd-light);
  color: var(--bgd-orange);
}

/* Actions */
.header__actions {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.header__phone {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-size: .85rem;
  font-weight: 600;
  color: var(--bgd-navy);
}
.header__phone svg { color: var(--bgd-orange); }
.header__phone span { white-space: nowrap; }

/* VAT toggle */
.vat-toggle {
  display: flex;
  align-items: center;
  gap: .3rem;
  background: var(--bgd-light);
  border-radius: 20px;
  padding: .2rem .25rem;
  font-size: .78rem;
  font-weight: 600;
}
.vat-toggle__btn {
  padding: .25rem .65rem;
  border-radius: 16px;
  cursor: pointer;
  transition: background .15s, color .15s;
  color: var(--bgd-text-muted);
  border: none;
  background: none;
  font-size: .78rem;
  font-weight: 600;
  font-family: var(--bgd-font);
}
.vat-toggle__btn.active {
  background: var(--bgd-navy);
  color: var(--bgd-white);
}

/* Cart */
.header__cart a {
  display: flex;
  align-items: center;
  gap: .4rem;
  color: var(--bgd-navy);
  font-size: .85rem;
  font-weight: 600;
  position: relative;
  padding: .4rem .5rem;
}
.header__cart a:hover { color: var(--bgd-orange); }
.cart-count {
  position: absolute;
  top: 0; right: 0;
  background: var(--bgd-orange);
  color: var(--bgd-white);
  font-size: .65rem;
  font-weight: 700;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

/* Mobile burger */
.header__burger {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: .4rem;
  color: var(--bgd-navy);
}
.mobile-nav {
  display: none;
  background: var(--bgd-white);
  border-top: 1px solid var(--bgd-border);
  padding: 1rem 1.5rem;
}
.mobile-nav.open { display: block; }
.mobile-nav__list { display: flex; flex-direction: column; gap: .25rem; }
.mobile-nav__list a {
  display: block;
  padding: .65rem .75rem;
  font-weight: 600;
  color: var(--bgd-navy);
  border-radius: var(--bgd-radius);
}
.mobile-nav__list a:hover { background: var(--bgd-light); color: var(--bgd-orange); }
.mobile-nav__footer {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--bgd-border);
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .9rem;
  font-weight: 600;
}

/* ============================================================
   HERO
   ============================================================ */
.hero {
  position: relative;
  overflow: hidden;
  background: var(--bgd-navy);
}
.hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-size: cover;
  background-position: center;
}
.hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgb(0 0 0 / 88%) 0%, rgb(0 0 0 / 78%) 45%, rgb(0 0 0 / 72%) 100%);
}

/* Intro on top, map + form below */
.hero__shell {
  position: relative;
  z-index: 2;
  padding: 3rem 0 3.5rem;
  width: 100%;
}
.hero__intro {
  color: var(--bgd-white);
  text-align: center;
  max-width: 52rem;
  margin: 0 auto 2.75rem;
  padding: 0 0.5rem;
}
.hero__intro .hero__sub {
  max-width: 42rem;
  margin-left: auto;
  margin-right: auto;
}
.hero__intro .hero__trust {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .65rem 1.75rem;
  margin-bottom: 1.5rem;
}
.hero__intro .hero__trust li {
  margin: 0;
}
.hero__split {
  display: grid;
  grid-template-columns: 1fr 400px;
  gap: 2rem;
  align-items: start;
}
.hero__map {
  display: flex;
  flex-direction: column;
}
.hero__map-label {
  color: rgba(255,255,255,.92);
  font-size: .88rem;
  font-weight: 600;
  margin: 0 0 .75rem;
  letter-spacing: .02em;
}
.hero__map-embed {
  height: 400px;
  border-radius: var(--bgd-radius-lg);
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(0,0,0,.35);
  border: 2px solid rgba(255,255,255,.15);
  background: #dde3e8;
}
.hero__map-embed .location-map__iframe {
  width: 100%;
  height: 400px;
  border: 0;
  display: block;
}
.hero__map-embed--google {
  background: #e8eaed;
}
.hero__map-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  min-height: 400px;
  margin: 0;
  padding: 1.5rem;
  text-align: center;
  color: var(--bgd-navy);
  font-size: .92rem;
  background: rgba(255,255,255,.92);
}
.hero__map-fallback a { font-weight: 600; }
.hero__map-areas-fallback {
  height: 100%;
  min-height: 400px;
  padding: 1.25rem 1.5rem;
  overflow-y: auto;
  background: rgba(255,255,255,.94);
  color: var(--bgd-navy);
}
.hero__map-areas-fallback > p:first-child {
  font-weight: 700;
  margin-bottom: .75rem;
}
.hero__map-areas-fallback ul {
  columns: 2;
  column-gap: 1.5rem;
  list-style: none;
  margin: 0 0 1rem;
  padding: 0;
}
.hero__map-areas-fallback li { margin-bottom: .35rem; break-inside: avoid; }
.hero__map-areas-fallback a { font-weight: 600; color: var(--bgd-navy); }
.hero__map-areas-fallback a:hover { color: var(--bgd-orange); }
.bgd-map-info { font-size: .9rem; line-height: 1.5; }
.bgd-map-info a { font-weight: 600; }

/* Legacy grid alias — kept for any cached references */
.hero__grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 400px;
  gap: 3rem;
  align-items: center;
  padding: 3rem 1.5rem;
  width: 100%;
}

/* Left column — copy */
.hero__copy { color: var(--bgd-white); }
.hero__eyebrow {
  display: inline-block;
  background: var(--bgd-orange);
  color: var(--bgd-white);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: .3rem .85rem;
  border-radius: 20px;
  margin-bottom: 1rem;
}
.hero h1 { color: var(--bgd-white); margin-bottom: .9rem; font-size: 2.4rem; }
.hero__sub {
  color: rgba(255,255,255,.82);
  font-size: 1.05rem;
  margin-bottom: 1.5rem;
  line-height: 1.65;
  max-width: 46ch;
}
.hero__trust {
  list-style: none;
  padding: 0;
  margin: 0 0 1.5rem;
  display: flex;
  flex-direction: column;
  gap: .45rem;
}
.hero__trust li {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .9rem;
  color: rgba(255,255,255,.88);
  font-weight: 500;
}
.hero__trust li svg { color: var(--bgd-orange); flex-shrink: 0; }
.hero__browse-link {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  color: rgba(255,255,255,.7);
  font-size: .88rem;
  font-weight: 600;
  border-bottom: 1px solid rgba(255,255,255,.3);
  padding-bottom: .1rem;
  transition: color .15s, border-color .15s;
}
.hero__browse-link:hover { color: var(--bgd-white); border-color: rgba(255,255,255,.7); text-decoration: none; }

/* Right column — form card */
.hero__form-card {
  background: rgba(255,255,255,.97);
  border-radius: var(--bgd-radius-lg);
  padding: 1.75rem;
  box-shadow: 0 12px 40px rgba(0,0,0,.3);
}
.hero__form-card__title {
  font-size: 1.2rem;
  color: var(--bgd-navy);
  margin-bottom: .25rem;
}
.hero__form-card__sub {
  font-size: .82rem;
  color: var(--bgd-text-muted);
  margin-bottom: 1.25rem;
}
.hero__form-error {
  background: #fff3cd;
  color: #856404;
  border: 1px solid #ffeeba;
  padding: .5rem .875rem;
  border-radius: var(--bgd-radius);
  font-size: .85rem;
  margin-bottom: 1rem;
}
.hero-form__row {
  margin-bottom: .875rem;
}
.hero-form__row label {
  display: block;
  font-size: .78rem;
  font-weight: 700;
  color: var(--bgd-navy);
  margin-bottom: .3rem;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.hero-form__row input,
.hero-form__row select {
  width: 100%;
  padding: .65rem .875rem;
  border: 1.5px solid var(--bgd-border);
  border-radius: var(--bgd-radius);
  font-family: var(--bgd-font);
  font-size: .9rem;
  color: var(--bgd-navy);
  background: var(--bgd-white);
  transition: border-color .15s;
}
.hero-form__row input:focus,
.hero-form__row select:focus {
  outline: none;
  border-color: var(--bgd-orange);
}
.hero-form__submit { width: 100%; justify-content: center; margin-top: .25rem; }
.hero-form__trust {
  text-align: center;
  font-size: .75rem;
  color: var(--bgd-text-muted);
  margin: .625rem 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .3rem;
}

/* ============================================================
   CATEGORIES GRID
   ============================================================ */
.categories { background: var(--bgd-light); }
.categories__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}
.category-card {
  background: var(--bgd-white);
  border-radius: var(--bgd-radius-lg);
  overflow: hidden;
  box-shadow: var(--bgd-shadow);
  transition: transform .2s, box-shadow .2s;
  text-decoration: none;
}
.category-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--bgd-shadow-lg);
}
.category-card__img {
  height: 200px;
  overflow: hidden;
}
.category-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s;
}
.category-card:hover .category-card__img img { transform: scale(1.06); }
.category-card__body {
  padding: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.category-card__name {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--bgd-navy);
}
.category-card__arrow {
  width: 32px;
  height: 32px;
  background: var(--bgd-orange);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background .2s;
}
.category-card:hover .category-card__arrow { background: var(--bgd-orange-dark); }
.category-card__arrow svg { color: var(--bgd-white); }

/* ============================================================
   ABOUT BAR
   ============================================================ */
.about-bar { background: var(--bgd-white); }
.about-bar__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
}
.about-bar__text h2 { margin-bottom: 1rem; }
.about-bar__text p { color: var(--bgd-text-muted); margin-bottom: 1.5rem; }
.about-bar__img {
  border-radius: var(--bgd-radius-lg);
  overflow: hidden;
  box-shadow: var(--bgd-shadow-lg);
}
.about-bar__img img { width: 100%; height: 380px; object-fit: cover; }

/* ============================================================
   WHY CHOOSE US
   ============================================================ */
.why-choose {
  position: relative;
  background: var(--bgd-navy);
  overflow: hidden;
}
.why-choose__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: .18;
}
.why-choose__inner {
  position: relative;
  z-index: 2;
  text-align: center;
}
.why-choose__slogan {
  font-size: .85rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--bgd-orange);
  margin-bottom: 3rem;
}
.why-choose__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin-bottom: 3rem;
}
.why-card {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: var(--bgd-radius-lg);
  padding: 2rem 1.5rem;
  text-align: center;
  backdrop-filter: blur(4px);
}
.why-card__icon {
  width: 60px;
  height: 60px;
  background: var(--bgd-orange);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.25rem;
}
.why-card__icon svg { color: var(--bgd-white); }
.why-card h3 { color: var(--bgd-white); margin-bottom: .6rem; }
.why-card p { color: rgba(255,255,255,.72); font-size: .95rem; margin: 0; }
.why-choose__trust {
  color: rgba(255,255,255,.5);
  font-size: .9rem;
  font-weight: 500;
}

/* ============================================================
   SERVICES BAR
   ============================================================ */
.services-bar { background: var(--bgd-light); }
.services-bar__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
.service-card {
  background: var(--bgd-white);
  border-radius: var(--bgd-radius-lg);
  padding: 2rem;
  box-shadow: var(--bgd-shadow);
  display: flex;
  flex-direction: column;
}
.service-card__icon {
  width: 52px;
  height: 52px;
  background: var(--bgd-light);
  border-radius: var(--bgd-radius);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.25rem;
  color: var(--bgd-orange);
}
.service-card h3 { margin-bottom: .6rem; }
.service-card p { color: var(--bgd-text-muted); font-size: .95rem; flex: 1; margin-bottom: 1.25rem; }
.service-card a { font-size: .88rem; font-weight: 600; color: var(--bgd-orange); }
.service-card a:hover { color: var(--bgd-orange-dark); }

/* ============================================================
   TESTIMONIALS
   ============================================================ */
.testimonials { background: var(--bgd-white); }
.testimonials__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
.testimonial-card {
  background: var(--bgd-light);
  border-radius: var(--bgd-radius-lg);
  padding: 2rem;
  position: relative;
}
.testimonial-card__stars {
  display: flex;
  gap: .2rem;
  margin-bottom: 1rem;
  color: #f5a623;
}
.testimonial-card blockquote {
  font-size: .97rem;
  color: var(--bgd-text);
  line-height: 1.65;
  margin-bottom: 1.25rem;
  font-style: italic;
}
.testimonial-card__author strong { font-size: .9rem; color: var(--bgd-navy); }
.testimonial-card__author span { font-size: .82rem; color: var(--bgd-text-muted); display: block; }

/* ============================================================
   ACCREDITATIONS
   ============================================================ */
.accreditations { background: var(--bgd-light); }
.accreditations__grid {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3rem;
  flex-wrap: wrap;
}
.accreditation-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .5rem;
  opacity: .7;
  transition: opacity .2s;
}
.accreditation-item:hover { opacity: 1; }
.accreditation-item__logo {
  width: 80px;
  height: 60px;
  background: var(--bgd-navy);
  border-radius: var(--bgd-radius);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--bgd-white);
  font-size: .7rem;
  font-weight: 700;
  text-align: center;
  padding: .5rem;
  line-height: 1.3;
}
.accreditation-item__label,
.accreditation-item span {
  font-size: .75rem;
  color: var(--bgd-text-muted);
  font-weight: 600;
  text-align: center;
  max-width: 120px;
  line-height: 1.35;
}

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer {
  background: var(--bgd-navy-dark);
  color: rgba(255,255,255,.75);
  padding: 4rem 0 0;
}
.footer__grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  gap: 3rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.footer-col h4 {
  color: var(--bgd-white);
  font-size: .85rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 1.2rem;
}
.footer__logo {
  display: flex;
  align-items: center;
  gap: .75rem;
  margin-bottom: 1rem;
}
.footer__logo img, .footer__logo svg { height: 40px; width: auto; }
.footer__logo-text strong {
  display: block;
  font-size: .95rem;
  font-weight: 800;
  color: var(--bgd-white);
}
.footer__logo-text span {
  font-size: .65rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--bgd-orange);
}
.footer__strapline { font-size: .9rem; line-height: 1.65; margin-bottom: 1.25rem; }
.footer__links { display: flex; flex-direction: column; gap: .5rem; }
.footer__links a {
  font-size: .88rem;
  color: rgba(255,255,255,.65);
  transition: color .15s;
}
.footer__links a:hover { color: var(--bgd-orange); }
.footer__contact-item {
  display: flex;
  align-items: center;
  gap: .65rem;
  font-size: .88rem;
  margin-bottom: .75rem;
}
.footer__contact-item svg { color: var(--bgd-orange); flex-shrink: 0; }
.footer__contact-item a { color: rgba(255,255,255,.75); }
.footer__contact-item a:hover { color: var(--bgd-orange); }
.footer__social {
  display: flex;
  gap: .75rem;
  margin-top: 1.25rem;
}
.footer__social a {
  width: 38px;
  height: 38px;
  background: rgba(255,255,255,.08);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,.7);
  transition: background .2s, color .2s;
}
.footer__social a:hover {
  background: var(--bgd-orange);
  color: var(--bgd-white);
}
.footer__bottom {
  padding: 1.25rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .75rem;
  font-size: .8rem;
  color: rgba(255,255,255,.4);
}
.footer__bottom a { color: rgba(255,255,255,.4); }
.footer__bottom a:hover { color: var(--bgd-white); }
.footer__bottom-links { display: flex; gap: 1.5rem; }

/* ============================================================
   WOOCOMMERCE — SHOP ARCHIVE
   ============================================================ */
.woo-archive { background: var(--bgd-light); }
.woo-archive__header {
  background: var(--bgd-navy);
  padding: 3rem 0;
  text-align: center;
}
.woo-archive__header h1 { color: var(--bgd-white); }
.woo-archive__header p { color: rgba(255,255,255,.72); margin: .5rem auto 0; max-width: 52ch; }
.woo-archive__header .woocommerce-breadcrumb {
  font-size: .8rem;
  color: rgba(255,255,255,.58);
  margin: 0 auto 1rem;
  max-width: 720px;
  line-height: 1.45;
}
.woo-archive__header .woocommerce-breadcrumb a { color: rgba(255,255,255,.85); text-decoration: none; }
.woo-archive__header .woocommerce-breadcrumb a:hover { color: var(--bgd-white); text-decoration: underline; }

/* Sorting / result count — keep out of the product grid */
.woo-archive__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
  padding: .25rem 0 0;
}
.woo-archive__toolbar .woocommerce-result-count {
  margin: 0;
  font-size: .88rem;
  color: var(--bgd-text-muted);
  line-height: 1.4;
}
.woo-archive__toolbar .woocommerce-ordering { margin: 0; }
.woo-archive__toolbar .woocommerce-ordering select {
  min-width: min(100%, 220px);
  max-width: 100%;
  padding: .55rem .75rem;
  border-radius: var(--bgd-radius);
  border: 1.5px solid var(--bgd-border);
  font-family: var(--bgd-font);
  font-size: .88rem;
  color: var(--bgd-navy);
  background: var(--bgd-white);
}

.product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1.5rem;
  padding: 1.25rem 0 2.75rem;
}
.product-card {
  background: var(--bgd-white);
  border-radius: var(--bgd-radius-lg);
  overflow: hidden;
  box-shadow: var(--bgd-shadow);
  transition: transform .2s, box-shadow .2s;
  display: flex;
  flex-direction: column;
}
.product-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--bgd-shadow-lg);
}
.product-card__img {
  height: 220px;
  overflow: hidden;
  background: var(--bgd-light);
  position: relative;
}
.product-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s;
}
.product-card:hover .product-card__img img { transform: scale(1.05); }
.product-card__badge {
  position: absolute;
  top: .75rem;
  left: .75rem;
  background: var(--bgd-orange);
  color: var(--bgd-white);
  font-size: .7rem;
  font-weight: 700;
  padding: .2rem .6rem;
  border-radius: 4px;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.product-card__body { padding: 1.25rem; flex: 1; display: flex; flex-direction: column; }
.product-card__cat {
  font-size: .75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--bgd-orange);
  margin-bottom: .4rem;
}
.product-card__name {
  font-size: 1rem;
  font-weight: 700;
  color: var(--bgd-navy);
  margin-bottom: .5rem;
  line-height: 1.3;
}
.product-card__price {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--bgd-navy);
  margin-bottom: 1rem;
  flex: 1;
}
.product-card__price .inc-vat,
.product-card__price .exc-vat { display: block; font-size: .75rem; font-weight: 500; color: var(--bgd-text-muted); }

/* ============================================================
   WOOCOMMERCE — SINGLE PRODUCT
   ============================================================ */
.single-product-layout { padding: 3rem 0; }
.single-product__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: start;
}
.product-gallery { position: relative; }
.product-gallery__main {
  border-radius: var(--bgd-radius-lg);
  overflow: hidden;
  margin-bottom: 1rem;
}
.product-gallery__main img { width: 100%; height: 420px; object-fit: cover; }
.product-gallery__thumbs { display: flex; gap: .75rem; }
.product-gallery__thumbs img {
  width: 80px;
  height: 70px;
  object-fit: cover;
  border-radius: var(--bgd-radius);
  cursor: pointer;
  border: 2px solid transparent;
  transition: border-color .15s;
}
.product-gallery__thumbs img:hover,
.product-gallery__thumbs img.active { border-color: var(--bgd-orange); }

.product-info__cat { font-size: .8rem; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; color: var(--bgd-orange); margin-bottom: .5rem; }
.product-info h1 { font-size: 2rem; margin-bottom: .75rem; }
.product-info__price {
  font-size: 1.8rem;
  font-weight: 800;
  color: var(--bgd-navy);
  margin-bottom: .25rem;
}
.product-info__vat-note { font-size: .82rem; color: var(--bgd-text-muted); margin-bottom: 1.5rem; }
.product-info__short-desc { color: var(--bgd-text-muted); margin-bottom: 1.5rem; }
/* ---- WooCommerce native add-to-cart form overrides ---- */

/* Variation table: remove default WC table styling */
.product-info .variations_form .variations { width: 100%; border-collapse: collapse; margin-bottom: 1.25rem; }
.product-info .variations_form .variations td,
.product-info .variations_form .variations th { padding: 0; border: none; }
.product-info .variations_form .variations label { display: block; font-weight: 600; font-size: .9rem; margin-bottom: .4rem; }
.product-info .variations_form .variations select {
  width: 100%;
  padding: .65rem .9rem;
  border: 1.5px solid var(--bgd-border);
  border-radius: var(--bgd-radius);
  font-family: var(--bgd-font);
  font-size: .9rem;
  background: var(--bgd-white);
  color: var(--bgd-navy);
  margin-bottom: 1rem;
}
.product-info .variations_form .variations select:focus { outline: none; border-color: var(--bgd-orange); }

/* Reset link */
.product-info .variations_form .reset_variations {
  display: inline-block;
  font-size: .8rem;
  color: var(--bgd-text-muted);
  margin-bottom: 1rem;
  text-decoration: underline;
  cursor: pointer;
}

/* Qty + add to cart row */
.product-info .woocommerce-variation-add-to-cart,
.product-info form.cart {
  display: flex;
  flex-direction: column;
  gap: .75rem;
}
.product-info .quantity {
  display: flex;
  align-items: center;
  border: 1.5px solid var(--bgd-border);
  border-radius: var(--bgd-radius);
  overflow: hidden;
  width: fit-content;
}
.product-info .quantity .qty {
  width: 64px;
  height: 44px;
  border: none;
  text-align: center;
  font-family: var(--bgd-font);
  font-size: .95rem;
  font-weight: 600;
  color: var(--bgd-navy);
  background: var(--bgd-white);
  -moz-appearance: textfield;
}
.product-info .quantity .qty::-webkit-inner-spin-button,
.product-info .quantity .qty::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

/* Native WC single_add_to_cart_button — beat WooCommerce .button.alt purple */
.woocommerce .product-info button.button.alt.single_add_to_cart_button,
.woocommerce .product-info .single_add_to_cart_button.button.alt {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  background: var(--bgd-orange);
  color: var(--bgd-white);
  border: none;
  border-radius: var(--bgd-radius);
  padding: .9rem 2rem;
  font-family: var(--bgd-font);
  font-size: .95rem;
  font-weight: 700;
  cursor: pointer;
  transition: background .2s, transform .15s;
  width: 100%;
  text-transform: none;
  letter-spacing: 0;
}
.woocommerce .product-info button.button.alt.single_add_to_cart_button:hover,
.woocommerce .product-info .single_add_to_cart_button.button.alt:hover {
  background: var(--bgd-orange-dark);
  color: var(--bgd-white);
}
.woocommerce .product-info button.button.alt.single_add_to_cart_button:focus,
.woocommerce .product-info .single_add_to_cart_button.button.alt:focus {
  background: var(--bgd-orange-dark);
  color: var(--bgd-white);
  outline: 2px solid var(--bgd-orange);
  outline-offset: 2px;
}
.woocommerce .product-info button.button.alt.single_add_to_cart_button:disabled,
.woocommerce .product-info button.button.alt.single_add_to_cart_button.disabled,
.woocommerce .product-info .single_add_to_cart_button.button.alt:disabled,
.woocommerce .product-info .single_add_to_cart_button.button.alt.disabled {
  background: var(--bgd-text-muted);
  color: var(--bgd-white);
  cursor: not-allowed;
}

/* Variation availability notice */
.product-info .woocommerce-variation-availability p { font-size: .88rem; color: var(--bgd-text-muted); margin: 0; }
.product-info .woocommerce-variation-price .price { font-size: 1.15rem; font-weight: 700; color: var(--bgd-navy); }
.product-info__meta { font-size: .82rem; color: var(--bgd-text-muted); border-top: 1px solid var(--bgd-border); padding-top: 1rem; margin-top: 1rem; }
.product-info__meta span { display: block; margin-bottom: .3rem; }
.product-info__meta strong { color: var(--bgd-text); }

.product-tabs { margin-top: 3rem; }
.product-tabs__nav { display: flex; gap: .5rem; border-bottom: 2px solid var(--bgd-border); margin-bottom: 1.5rem; }
.product-tabs__btn {
  padding: .75rem 1.5rem;
  font-family: var(--bgd-font);
  font-size: .9rem;
  font-weight: 600;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--bgd-text-muted);
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  transition: color .15s, border-color .15s;
}
.product-tabs__btn.active, .product-tabs__btn:hover { color: var(--bgd-navy); border-color: var(--bgd-orange); }
.product-tabs__panel { display: none; }
.product-tabs__panel.active { display: block; }
.product-tabs__panel p,
.product-tabs__panel li { color: var(--bgd-text-muted); font-size: .95rem; }
.product-tabs__panel h3 {
  color: var(--bgd-navy);
  font-size: 1.1rem;
  margin: 1.5rem 0 .75rem;
}
.product-tabs__panel h3:first-child { margin-top: 0; }
.product-tabs__panel ul {
  margin: 0 0 1rem 1.25rem;
  padding: 0;
  list-style: disc;
}
.product-tabs__panel ul li { margin-bottom: .35rem; }

/* ============================================================
   WOOCOMMERCE — CART / CHECKOUT
   ============================================================ */
.woo-page-header {
  background: var(--bgd-navy);
  padding: 2.5rem 0;
  text-align: center;
}
.woo-page-header h1 { color: var(--bgd-white); font-size: 2rem; }

.cart-layout, .checkout-layout { padding: 3rem 0; }
.cart-table { width: 100%; border-collapse: collapse; }
.cart-table th {
  background: var(--bgd-light);
  padding: .9rem 1rem;
  text-align: left;
  font-size: .82rem;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--bgd-text-muted);
  border-bottom: 2px solid var(--bgd-border);
}
.cart-table td { padding: 1rem; border-bottom: 1px solid var(--bgd-border); vertical-align: middle; }
.cart-item__img { width: 70px; height: 60px; object-fit: cover; border-radius: var(--bgd-radius); }
.cart-item__name { font-weight: 600; color: var(--bgd-navy); }
.cart-item__remove { color: var(--bgd-text-muted); font-size: 1.1rem; cursor: pointer; background: none; border: none; }
.cart-item__remove:hover { color: #e74c3c; }
.cart-totals {
  background: var(--bgd-light);
  border-radius: var(--bgd-radius-lg);
  padding: 1.5rem;
  margin-top: 1.5rem;
}
.cart-totals h3 { margin-bottom: 1rem; font-size: 1.1rem; }
.cart-totals__row { display: flex; justify-content: space-between; padding: .5rem 0; font-size: .95rem; }
.cart-totals__row--total { font-weight: 700; font-size: 1.1rem; border-top: 1px solid var(--bgd-border); padding-top: 1rem; margin-top: .5rem; }
.checkout-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 2.5rem; }
.checkout-form { background: var(--bgd-white); border-radius: var(--bgd-radius-lg); padding: 2rem; box-shadow: var(--bgd-shadow); }
.checkout-form h2 { font-size: 1.3rem; margin-bottom: 1.5rem; }
.form-row { margin-bottom: 1.1rem; }
.form-row--split { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.form-row label { display: block; font-size: .88rem; font-weight: 600; margin-bottom: .35rem; }
.form-row input,
.form-row select,
.form-row textarea {
  width: 100%;
  padding: .65rem .9rem;
  border: 1px solid var(--bgd-border);
  border-radius: var(--bgd-radius);
  font-family: var(--bgd-font);
  font-size: .9rem;
  transition: border-color .15s;
}
.form-row input:focus,
.form-row select:focus,
.form-row textarea:focus {
  outline: none;
  border-color: var(--bgd-orange);
}

/* ============================================================
   PAGE TEMPLATES (ABOUT, SERVICES, CONTACT)
   ============================================================ */
.page-hero {
  background: var(--bgd-navy);
  padding: 4rem 0;
  text-align: center;
}
.page-hero h1 { color: var(--bgd-white); margin-bottom: .75rem; }
.page-hero p { color: rgba(255,255,255,.72); max-width: 56ch; margin: 0 auto; }

.about-content { padding: 5rem 0; }
.about-content__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
.about-content__img { border-radius: var(--bgd-radius-lg); overflow: hidden; }
.about-content__img img { width: 100%; height: 420px; object-fit: cover; }
.about-values { background: var(--bgd-light); padding: 4rem 0; }
.values-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem; margin-top: 2rem; }
.value-item {
  background: var(--bgd-white);
  border-radius: var(--bgd-radius-lg);
  padding: 2rem;
  text-align: center;
  box-shadow: var(--bgd-shadow);
}
.value-item__icon { width: 52px; height: 52px; background: var(--bgd-orange); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 1rem; color: var(--bgd-white); }
.value-item h3 { margin-bottom: .5rem; }
.value-item p { color: var(--bgd-text-muted); font-size: .9rem; margin: 0; }

.services-list { padding: 5rem 0; }
.services-list__grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 2rem; }
.service-detail-card {
  background: var(--bgd-white);
  border-radius: var(--bgd-radius-lg);
  overflow: hidden;
  box-shadow: var(--bgd-shadow);
}
.service-detail-card__img { height: 220px; overflow: hidden; }
.service-detail-card__img img { width: 100%; height: 100%; object-fit: cover; }
.service-detail-card__body { padding: 1.75rem; }
.service-detail-card__icon { color: var(--bgd-orange); margin-bottom: 1rem; }
.service-detail-card h3 { margin-bottom: .75rem; }
.service-detail-card p { color: var(--bgd-text-muted); font-size: .92rem; margin-bottom: 1.25rem; }
.service-cta { background: var(--bgd-navy); padding: 5rem 0; text-align: center; }
.service-cta h2 { color: var(--bgd-white); margin-bottom: 1rem; }
.service-cta p { color: rgba(255,255,255,.72); margin-bottom: 2rem; }

/* Location / Areas pages */
.location-map { padding: 4rem 0 0; background: var(--bgd-light); }
.location-map .container { margin-bottom: 2rem; }
.location-map__full {
  width: 100%;
  height: clamp(320px, 42vw, 480px);
  background: #e8ecef;
  border-top: 1px solid rgba(0,0,0,.06);
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.location-map__full .location-map__iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
.location-map__embed {
  border-radius: var(--bgd-radius-lg);
  overflow: hidden;
  box-shadow: var(--bgd-shadow);
  aspect-ratio: 16 / 9;
  background: var(--bgd-light);
}
.location-map__iframe { width: 100%; height: 100%; border: 0; display: block; }
.location-nearby { padding: 6rem 0; background: var(--bgd-light); }
.location-nearby__links {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem 1.5rem;
  list-style: none;
  margin: 2rem 0 0;
  padding: 0;
  justify-content: center;
}
.location-nearby__links a {
  color: var(--bgd-navy);
  font-weight: 600;
  text-decoration: none;
}
.location-nearby__links a:hover { color: var(--bgd-orange); }
.location-uk-intro {
  max-width: 62ch;
  margin: 0 0 1.5rem;
  padding: 1rem 1.25rem;
  background: var(--bgd-light);
  border-left: 3px solid var(--bgd-orange);
  color: var(--bgd-text-muted);
  font-size: 1.05rem;
  line-height: 1.6;
}
.location-uk-intro strong { color: var(--bgd-text); }
.areas-hub { padding: 5rem 0; }
.areas-hub__intro { max-width: 62ch; margin: 1rem auto 0; color: var(--bgd-text-muted); }
.areas-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
  margin-top: 2.5rem;
}
.areas-card {
  display: block;
  background: var(--bgd-white);
  border-radius: var(--bgd-radius-lg);
  padding: 1.75rem;
  box-shadow: var(--bgd-shadow);
  text-decoration: none;
  color: inherit;
  transition: transform .15s ease, box-shadow .15s ease;
}
.areas-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--bgd-shadow-lg, 0 8px 24px rgba(0,0,0,.12));
}
.areas-card h3 { margin-bottom: .5rem; color: var(--bgd-navy); }
.areas-card p { color: var(--bgd-text-muted); font-size: .92rem; margin-bottom: 1rem; }
.areas-card__link {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  color: var(--bgd-orange);
  font-weight: 600;
  font-size: .9rem;
}

.contact-layout { padding: 5rem 0; }
.contact-grid { display: grid; grid-template-columns: 1fr 1.5fr; gap: 4rem; }
.contact-info h2 { margin-bottom: 1rem; }
.contact-info p { color: var(--bgd-text-muted); margin-bottom: 2rem; }
.contact-info__items { display: flex; flex-direction: column; gap: 1.25rem; margin-bottom: 2rem; }
.contact-info__item { display: flex; align-items: flex-start; gap: 1rem; }
.contact-info__item-icon {
  width: 42px;
  height: 42px;
  background: var(--bgd-light);
  border-radius: var(--bgd-radius);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--bgd-orange);
  flex-shrink: 0;
}
.contact-info__item-text strong { display: block; font-size: .88rem; color: var(--bgd-text-muted); text-transform: uppercase; letter-spacing: .07em; }
.contact-info__item-text span, .contact-info__item-text a { font-weight: 600; color: var(--bgd-navy); font-size: .95rem; }
.contact-form-wrap {
  background: var(--bgd-white);
  border-radius: var(--bgd-radius-lg);
  padding: 2.5rem;
  box-shadow: var(--bgd-shadow-lg);
}
.contact-form-wrap h2 { margin-bottom: .5rem; }
.contact-form-wrap > p { color: var(--bgd-text-muted); font-size: .9rem; margin-bottom: 1.75rem; }

/* ============================================================
   STANDARD PAGE
   ============================================================ */
.page-content { padding: 4rem 0; }
.page-content__inner { max-width: 720px; margin: 0 auto; }
.page-content__inner h2, .page-content__inner h3 { margin-top: 2rem; margin-bottom: .75rem; }
.page-content__inner p { color: var(--bgd-text-muted); }
.page-content__inner ul, .page-content__inner ol { list-style: disc; padding-left: 1.5rem; }
.page-content__inner li { color: var(--bgd-text-muted); margin-bottom: .4rem; }

/* ============================================================
   404
   ============================================================ */
.error-404 { padding: 8rem 0; text-align: center; }
.error-404 h1 { font-size: 6rem; color: var(--bgd-orange); line-height: 1; margin-bottom: .5rem; }
.error-404 h2 { margin-bottom: 1rem; }
.error-404 p { color: var(--bgd-text-muted); margin-bottom: 2rem; }

/* ============================================================
   CONTACT FORM 7 OVERRIDES
   ============================================================ */
.wpcf7 .wpcf7-form-control-wrap { display: block; margin-bottom: 1.1rem; }
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 select,
.wpcf7 textarea {
  width: 100%;
  padding: .7rem .9rem;
  border: 1px solid var(--bgd-border);
  border-radius: var(--bgd-radius);
  font-family: var(--bgd-font);
  font-size: .92rem;
  transition: border-color .15s;
  background: var(--bgd-white);
}
.wpcf7 input:focus,
.wpcf7 select:focus,
.wpcf7 textarea:focus { outline: none; border-color: var(--bgd-orange); box-shadow: 0 0 0 3px rgba(232,80,10,.1); }
.wpcf7 textarea { min-height: 120px; resize: vertical; }
.wpcf7 .wpcf7-submit {
  background: var(--bgd-orange);
  color: var(--bgd-white);
  border: none;
  padding: .85rem 2rem;
  border-radius: var(--bgd-radius);
  font-family: var(--bgd-font);
  font-size: .95rem;
  font-weight: 600;
  cursor: pointer;
  transition: background .2s;
}
.wpcf7 .wpcf7-submit:hover { background: var(--bgd-orange-dark); }
.wpcf7 .wpcf7-response-output { margin-top: 1rem; padding: .75rem 1rem; border-radius: var(--bgd-radius); font-size: .88rem; }
.wpcf7 .wpcf7-mail-sent-ok { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
.wpcf7 .wpcf7-validation-errors { background: #fff3cd; color: #856404; border: 1px solid #ffeeba; }

/* CF7 form — bgd-cf7-form class applied via shortcode html_class param */
.wpcf7-form.bgd-cf7-form { width: 100%; min-width: 0; }

/* Style each <p> field wrapper */
.wpcf7-form.bgd-cf7-form > p {
  margin: 0 0 1rem;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.grecaptcha-badge{
  display: none !important;
}

/* First two fields (name, phone) side by side on wider screens */
.contact-form-wrap .wpcf7-form.bgd-cf7-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 1rem;
}
.contact-form-wrap .wpcf7-form.bgd-cf7-form > p {
  grid-column: span 1;
}
/* Full-width fields: email, select, product, textarea, submit, response */
.contact-form-wrap .wpcf7-form.bgd-cf7-form > p:nth-child(n+4),
.contact-form-wrap .wpcf7-form.bgd-cf7-form > .wpcf7-response-output {
  grid-column: span 2;
}

/* Ensure control wraps fill width */
.wpcf7-form.bgd-cf7-form .wpcf7-form-control-wrap { display: block; width: 100%; }

/* ============================================================
   RESPONSIVE — TABLET
   ============================================================ */
@media (max-width: 1100px) {
  .hero__split { grid-template-columns: 1fr 360px; gap: 1.75rem; }
  .hero__grid { grid-template-columns: 1fr 360px; gap: 2rem; }
}

@media (max-width: 900px) {
  .hero__shell { padding: 2.5rem 0 3rem; }
  .hero__intro { margin-bottom: 2rem; }
  .hero__intro .hero__trust {
    flex-direction: column;
    align-items: center;
    gap: .45rem;
  }
  .hero__split,
  .hero__grid { grid-template-columns: 1fr; gap: 1.75rem; }
  .hero__map-embed,
  .hero__map-embed .location-map__iframe { height: 300px; }
  .hero__form-card { max-width: 480px; margin-left: auto; margin-right: auto; width: 100%; }
  .hero h1 { font-size: 2rem; }
}

@media (max-width: 1024px) {
  .categories__grid { grid-template-columns: repeat(2, 1fr); }
  .about-bar__grid { gap: 2.5rem; }
  .why-choose__grid { gap: 1rem; }
  .footer__grid { grid-template-columns: 1fr 1fr; }
  .footer-col:first-child { grid-column: 1 / -1; }
  .single-product__grid { gap: 2rem; }
  .checkout-grid { grid-template-columns: 1fr; }
  .contact-grid { grid-template-columns: 1fr; }
  .about-content__grid { grid-template-columns: 1fr; }
  .areas-grid { grid-template-columns: 1fr; }
  .services-list__grid { grid-template-columns: 1fr 1fr; }
}

/* ============================================================
   RESPONSIVE — MOBILE
   ============================================================ */
@media (max-width: 768px) {
  .header__inner { grid-template-columns: auto 1fr auto; padding: .65rem 1rem; }
  .header__nav { display: none; }
  .header__phone { display: none; } /* already in mobile nav footer */
  .header__burger { display: flex; margin-left: auto; }
  .vat-toggle { display: none; }
  /* Hide logo wordmark on mobile — icon alone is sufficient */
  .header__logo-text { display: none; }
  .header__logo svg, .header__logo img { height: 56px; }

  /* Value bar: compact single row, show only 2 of 4 items */
  .value-bar { padding: .3rem 0; font-size: .78rem; }
  .value-bar__inner { flex-wrap: nowrap; gap: 1.25rem; }
  .value-bar__item svg { width: 14px; height: 14px; }
  .value-bar__item:nth-child(2),
  .value-bar__item:nth-child(4) { display: none; }

  /* Hero: handled by 900px breakpoint; just tighten font further */
  .hero h1 { font-size: 1.85rem; }
  /* Form split-row and CF7 grid collapse to single column on mobile */
  .form-row--split { grid-template-columns: 1fr; }
  .contact-form-wrap .wpcf7-form.bgd-cf7-form {
    grid-template-columns: 1fr;
  }
  .contact-form-wrap .wpcf7-form.bgd-cf7-form > p,
  .contact-form-wrap .wpcf7-form.bgd-cf7-form > p:nth-child(n+4),
  .contact-form-wrap .wpcf7-form.bgd-cf7-form > .wpcf7-response-output {
    grid-column: span 1;
  }

  .categories__grid { grid-template-columns: 1fr 1fr; }
  .about-bar__grid { grid-template-columns: 1fr; }
  .about-bar__img { display: none; }
  .why-choose__grid { grid-template-columns: 1fr; }
  .services-bar__grid { grid-template-columns: 1fr; }
  .testimonials__grid { grid-template-columns: 1fr; }
  .single-product__grid { grid-template-columns: 1fr; }

  /* Product tabs: stack vertically on narrow screens */
  .product-tabs__nav {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    border-bottom: none;
  }
  .product-tabs__btn {
    width: 100%;
    text-align: left;
    padding: .85rem 1rem;
    border-bottom: 1px solid var(--bgd-border);
    border-left: 3px solid transparent;
    margin-bottom: 0;
  }
  .product-tabs__btn.active,
  .product-tabs__btn:hover {
    border-bottom-color: var(--bgd-border);
    border-left-color: var(--bgd-orange);
    background: var(--bgd-light);
  }

  .footer__grid { grid-template-columns: 1fr; }
  .values-grid { grid-template-columns: 1fr; }
  .services-list__grid { grid-template-columns: 1fr; }
  .section { padding: 3.5rem 0; }
  .section--lg { padding: 4rem 0; }
  .contact-form-wrap { padding: 1.75rem; }

  /* WooCommerce shop — toolbar + single-column product cards */
  .woo-archive__header { padding: 1.35rem 0 1.5rem; }
  .woo-archive__header h1 { font-size: 1.6rem; line-height: 1.25; }
  .woo-archive__toolbar {
    flex-direction: column;
    align-items: stretch;
    padding-top: 0;
    gap: .75rem;
  }
  .woo-archive__toolbar .woocommerce-ordering,
  .woo-archive__toolbar .woocommerce-ordering select { width: 100%; min-width: 0; }
  .woo-archive.section { padding: 0 0 2.5rem; }
  .woo-archive .product-grid {
    grid-template-columns: 1fr;
    gap: 1.1rem;
    padding: .75rem 0 2rem;
    max-width: 480px;
    margin: 0 auto;
  }
  .product-card__img { height: 200px; }
  .product-card__body { padding: 1rem 1rem 1.15rem; }
  .product-card__name { font-size: .98rem; margin-bottom: .4rem; line-height: 1.35; }
  .product-card__price {
    font-size: .98rem;
    margin-bottom: .85rem;
    line-height: 1.35;
  }
  .product-card__price .price {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .2rem;
  }
  .product-card__price .woocommerce-Price-amount { font-weight: 700; }
  /* Full-width buttons inside product cards */
  .product-card .btn {
    width: 100%;
    justify-content: center;
    font-size: .85rem;
    padding: .65rem .75rem;
    gap: .35rem;
  }
}

@media (max-width: 480px) {
  .categories__grid { grid-template-columns: 1fr; }
  .hero h1 { font-size: 1.75rem; }
  .accreditations__grid { gap: 1.5rem; }
  /* Value bar: slightly smaller text on very small screens */
  .value-bar { font-size: .73rem; }
  .value-bar__item { gap: .35rem; }
}

/* ============================================================
   CHATBOT
   ============================================================ */
.chatbot {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 1400;
}

.chatbot__trigger {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--bgd-navy);
  color: var(--bgd-white);
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--bgd-shadow-lg);
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.chatbot__trigger:hover {
  transform: scale(1.08);
  background: var(--bgd-orange);
}

.chatbot__trigger svg { width: 26px; height: 26px; }

.chatbot__panel {
  position: absolute;
  bottom: 68px;
  right: 0;
  width: 370px;
  max-height: 520px;
  background: var(--bgd-white);
  border-radius: var(--bgd-radius-lg);
  box-shadow: 0 12px 48px rgba(0, 0, 0, 0.18);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transform: scale(0.9) translateY(12px);
  opacity: 0;
  visibility: hidden;
  transform-origin: bottom right;
  transition: transform 0.25s ease, opacity 0.25s ease, visibility 0.25s ease;
}

.chatbot__panel.is-open {
  transform: scale(1) translateY(0);
  opacity: 1;
  visibility: visible;
}

.chatbot__header {
  background: var(--bgd-navy);
  color: var(--bgd-white);
  padding: 1rem 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
}

.chatbot__header-info { display: flex; align-items: center; gap: 0.75rem; }

.chatbot__avatar {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
}

.chatbot__name { font-weight: 700; font-size: 0.9rem; }
.chatbot__status { font-size: 0.7rem; opacity: 0.7; }

.chatbot__close {
  background: none;
  border: none;
  color: var(--bgd-white);
  font-size: 1.5rem;
  cursor: pointer;
  padding: 0 0.25rem;
  opacity: 0.7;
  transition: opacity 0.2s;
  line-height: 1;
}

.chatbot__close:hover { opacity: 1; }

.chatbot__messages {
  flex: 1;
  overflow-y: auto;
  padding: 1rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-height: 240px;
  max-height: 320px;
  background: var(--bgd-light);
}

.chatbot__msg { display: flex; max-width: 85%; }
.chatbot__msg--bot { align-self: flex-start; }
.chatbot__msg--user { align-self: flex-end; }

.chatbot__msg-text {
  padding: 0.5rem 0.85rem;
  border-radius: var(--bgd-radius);
  font-size: 0.875rem;
  line-height: 1.5;
}

.chatbot__msg--bot .chatbot__msg-text {
  background: var(--bgd-white);
  color: var(--bgd-text);
  border-bottom-left-radius: 4px;
  box-shadow: var(--bgd-shadow);
}

.chatbot__msg--bot .chatbot__msg-text a {
  color: var(--bgd-orange);
  text-decoration: underline;
}

.chatbot__msg--user .chatbot__msg-text {
  background: var(--bgd-navy);
  color: var(--bgd-white);
  border-bottom-right-radius: 4px;
}

.chatbot__msg--typing .chatbot__msg-text::after {
  content: '';
  display: inline-block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--bgd-text-muted);
  animation: chatbotDots 1.2s infinite;
  margin-left: 2px;
  box-shadow: 8px 0 0 var(--bgd-text-muted), 16px 0 0 var(--bgd-text-muted);
}

@keyframes chatbotDots {
  0%, 60%, 100% { opacity: 0.3; }
  30% { opacity: 1; }
}

.chatbot__quick-replies {
  padding: 0.35rem 1.25rem 0.65rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  background: var(--bgd-light);
  border-top: 1px solid var(--bgd-border);
}

.chatbot__quick-btn {
  background: var(--bgd-white);
  border: 1px solid var(--bgd-border);
  border-radius: 999px;
  padding: 5px 12px;
  font-size: 0.75rem;
  color: var(--bgd-navy);
  cursor: pointer;
  transition: all 0.2s ease;
  font-weight: 600;
  white-space: nowrap;
  font-family: inherit;
}

.chatbot__quick-btn:hover {
  background: var(--bgd-orange);
  color: var(--bgd-white);
  border-color: var(--bgd-orange);
}

.chatbot__input {
  display: flex;
  padding: 0.65rem 1rem;
  gap: 0.35rem;
  border-top: 1px solid var(--bgd-border);
  background: var(--bgd-white);
  flex-shrink: 0;
}

.chatbot__input input {
  flex: 1;
  border: 1px solid var(--bgd-border);
  border-radius: 999px;
  padding: 0.4rem 0.85rem;
  font-size: 0.875rem;
  outline: none;
  font-family: inherit;
  background: var(--bgd-light);
}

.chatbot__input input:focus { border-color: var(--bgd-orange); }

.chatbot__send {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--bgd-orange);
  color: var(--bgd-white);
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.2s ease;
  flex-shrink: 0;
}

.chatbot__send:hover { background: var(--bgd-orange-dark); }
.chatbot__send svg { width: 16px; height: 16px; }

@media (max-width: 768px) {
  .chatbot {
    bottom: 1rem;
    right: 1rem;
  }
  .chatbot__panel {
    width: calc(100vw - 2rem);
    right: 0;
    bottom: 64px;
    max-height: 65vh;
  }
}