/* ==========================================================================
   Epoxy Floors Townsville — Bold Component Library
   Industry: Epoxy flooring & floor coatings (industrial, commercial, garage,
   driveway, overlays) | Location: Townsville, QLD, AU
   Palette rationale: "Tropic Resin". The logo is two stacked downward
   chevrons — a cobalt blue triangle over a deep rainforest-green chevron.
   The primary deepens that cobalt into a Coral Sea blue (dark bands drop to
   a night-harbour navy), the logo green becomes the secondary used for
   badges and tinted bands, and the CTA accent is a high-vis safety amber —
   the colour of epoxy line-marking on warehouse floors and of Townsville's
   300-days-a-year sun. Amber always carries dark ink for AA.
   Paper is a cool sealed-concrete grey; surfaces stay crisp white like a
   fresh gloss coat.
   Signature motifs: (1) the logo's stacked chevron as the eyebrow mark and
   card-top notch; (2) a decorative-flake speckle texture on dark bands;
   (3) a diagonal gloss sheen across the hero, like light on wet resin.
   Type: Archivo (heavy, slightly expanded industrial grotesk) headings +
   Public Sans body — sturdy, plain-spoken, highly legible.
   ========================================================================== */

:root {
  /* ---- Brand palette ---- */
  --bc-primary: #0f4c86;          /* Coral Sea cobalt — primary buttons, headers */
  --bc-primary-dark: #0a2540;     /* night-harbour navy — hero, footer, dark bands */
  --bc-primary-light: #145da0;    /* logo cobalt — hover on primary */
  --bc-secondary: #095d40;        /* logo rainforest green — badges, icons */
  --bc-secondary-light: #7fd3ad;  /* green on dark */
  --bc-accent: #f2a516;           /* safety amber — CTA fill (dark ink) */
  --bc-accent-dark: #8a5800;      /* amber text on light surfaces */
  --bc-accent-light: #ffc94d;     /* amber text on dark */
  --bc-on-accent: #1a1200;        /* ink on amber */
  --bc-link: #0f4c86;
  --bc-link-on-dark: #9ccbff;
  --bc-signal: #8a5800;           /* stars on light */

  /* ---- Surfaces / ink ---- */
  --bc-paper: #f2f5f4;            /* sealed concrete */
  --bc-surface: #ffffff;          /* fresh gloss coat */
  --bc-surface-alt: #e4eaea;      /* grey epoxy */
  --bc-tint: #e2f1ea;             /* green wash for has-color */
  --bc-ink: #0e1a24;
  --bc-ink-soft: #45535f;
  --bc-on-dark: #f2f5f4;
  --bc-on-dark-soft: #b6c6d5;
  --bc-border: #cdd7d8;
  --bc-border-dark: #24415e;

  /* ---- Type ---- */
  --bc-font-head: 'Archivo', 'Archivo Black', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  --bc-font-body: 'Public Sans', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  --bc-fw-head: 800;
  --bc-fw-bold: 700;
  --bc-fs-eyebrow: 0.8125rem;
  --bc-fs-sm: 0.9375rem;
  --bc-fs-base: 1.0625rem;
  --bc-fs-lg: 1.25rem;
  --bc-fs-h4: 1.1875rem;
  --bc-fs-h3: 1.4375rem;
  --bc-fs-h2: clamp(1.75rem, 1.3rem + 1.9vw, 2.5rem);
  --bc-fs-h1: clamp(2.125rem, 1.4rem + 3.4vw, 3.75rem);
  --bc-lh-tight: 1.05;
  --bc-lh-head: 1.15;
  --bc-lh-body: 1.65;
  --bc-ls-head: -0.015em;
  --bc-ls-eyebrow: 0.18em;

  /* ---- Spacing ---- */
  --bc-sp-1: 0.5rem;
  --bc-sp-2: 0.75rem;
  --bc-sp-3: 1rem;
  --bc-sp-4: 1.5rem;
  --bc-sp-5: 2rem;
  --bc-sp-6: 3rem;
  --bc-sp-7: 4.5rem;
  --bc-sp-8: 6rem;

  /* ---- Shape / depth ---- */
  --bc-radius: 6px;
  --bc-radius-lg: 14px;
  --bc-shadow: 0 18px 40px rgba(10, 37, 64, 0.18);
  --bc-shadow-sm: 0 2px 10px rgba(10, 37, 64, 0.08);
  --bc-container: 1200px;
  --bc-header-h: 76px;
  --bc-transition: 170ms ease;

  /* ---- Motifs ---- */
  --bc-flake: radial-gradient(rgba(255,255,255,0.07) 1px, transparent 1.6px) 0 0 / 14px 14px,
              radial-gradient(rgba(127,211,173,0.07) 1px, transparent 1.6px) 7px 9px / 19px 19px;
  --bc-sheen: linear-gradient(115deg, rgba(255,255,255,0) 30%, rgba(255,255,255,0.07) 46%, rgba(255,255,255,0) 60%);
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bc-paper);
  color: var(--bc-ink);
  font-family: var(--bc-font-body);
  font-size: var(--bc-fs-base);
  line-height: var(--bc-lh-body);
  overflow-x: hidden;
}
img, svg, video, iframe { max-width: 100%; display: block; }
img { height: auto; }
h1, h2, h3, h4 {
  font-family: var(--bc-font-head);
  font-weight: var(--bc-fw-head);
  font-stretch: 112%;
  line-height: var(--bc-lh-head);
  letter-spacing: var(--bc-ls-head);
  margin: 0 0 var(--bc-sp-3);
  color: inherit;
  overflow-wrap: break-word;
}
h1 { font-size: var(--bc-fs-h1); line-height: var(--bc-lh-tight); }
h2 { font-size: var(--bc-fs-h2); }
h3 { font-size: var(--bc-fs-h3); }
h4 { font-size: var(--bc-fs-h4); }
p { margin: 0 0 var(--bc-sp-3); }
a { color: var(--bc-link); text-underline-offset: 3px; }
a:hover { color: var(--bc-primary-light); }
:focus-visible { outline: 3px solid var(--bc-accent); outline-offset: 2px; }
ul, ol { padding-left: 1.25rem; }

.bc-container {
  width: 100%;
  max-width: var(--bc-container);
  margin: 0 auto;
  padding: 0 var(--bc-sp-4);
}
@media (max-width: 480px) { .bc-container { padding: 0 var(--bc-sp-3); } }

/* ---------- Eyebrow (stacked-chevron mark) ---------- */
.bc-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.6em;
  font-family: var(--bc-font-body);
  font-size: var(--bc-fs-eyebrow);
  font-weight: var(--bc-fw-bold);
  letter-spacing: var(--bc-ls-eyebrow);
  text-transform: uppercase;
  color: var(--bc-secondary);
  margin-bottom: var(--bc-sp-2);
}
.bc-eyebrow::before {
  content: "";
  flex: none;
  width: 14px;
  height: 12px;
  background:
    linear-gradient(var(--bc-primary-light), var(--bc-primary-light)) top / 100% 55% no-repeat,
    linear-gradient(var(--bc-secondary), var(--bc-secondary)) bottom / 100% 100% no-repeat;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.bc-eyebrow--on-dark,
.bc-hero .bc-eyebrow,
.bc-prose--dark .bc-eyebrow,
.bc-grid--dark .bc-eyebrow,
.bc-formband--final .bc-eyebrow,
.bc-video .bc-eyebrow { color: var(--bc-accent-light); }
.bc-eyebrow--on-dark::before,
.bc-hero .bc-eyebrow::before,
.bc-prose--dark .bc-eyebrow::before,
.bc-grid--dark .bc-eyebrow::before,
.bc-formband--final .bc-eyebrow::before,
.bc-video .bc-eyebrow::before {
  background:
    linear-gradient(var(--bc-accent), var(--bc-accent)) top / 100% 55% no-repeat,
    linear-gradient(var(--bc-secondary-light), var(--bc-secondary-light)) bottom / 100% 100% no-repeat;
}

/* ---------- Buttons ---------- */
.bc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  min-height: 48px;
  padding: 0.8rem 1.6rem;
  border: 2px solid transparent;
  border-radius: var(--bc-radius);
  font-family: var(--bc-font-head);
  font-weight: var(--bc-fw-head);
  font-stretch: 108%;
  font-size: 1rem;
  letter-spacing: 0.02em;
  line-height: 1.2;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  transition: background-color var(--bc-transition), color var(--bc-transition), border-color var(--bc-transition), transform var(--bc-transition);
}
.bc-btn:hover { transform: translateY(-1px); }
.bc-btn--primary { background: var(--bc-primary); color: #ffffff; border-color: var(--bc-primary); }
.bc-btn--primary:hover { background: var(--bc-primary-light); border-color: var(--bc-primary-light); color: #ffffff; }
.bc-btn--accent { background: var(--bc-accent); color: var(--bc-on-accent); border-color: var(--bc-accent); box-shadow: 0 6px 18px rgba(242,165,22,0.28); }
.bc-btn--accent:hover { background: var(--bc-accent-light); border-color: var(--bc-accent-light); color: var(--bc-on-accent); }
.bc-btn--ghost { background: rgba(255,255,255,0.06); color: var(--bc-on-dark); border-color: rgba(242,245,244,0.55); }
.bc-btn--ghost:hover { background: var(--bc-on-dark); color: var(--bc-primary-dark); border-color: var(--bc-on-dark); }
.bc-btn--outline { background: transparent; color: var(--bc-primary); border-color: var(--bc-primary); }
.bc-btn--outline:hover { background: var(--bc-primary); color: #ffffff; }
.bc-prose--dark .bc-btn--outline,
.bc-grid--dark .bc-btn--outline,
.bc-hero .bc-btn--outline,
.bc-formband--final .bc-btn--outline { color: var(--bc-on-dark); border-color: var(--bc-on-dark); }
.bc-hero--light .bc-btn--outline { color: var(--bc-primary); border-color: var(--bc-primary); }
.bc-prose--dark .bc-btn--outline:hover,
.bc-grid--dark .bc-btn--outline:hover,
.bc-hero .bc-btn--outline:hover,
.bc-formband--final .bc-btn--outline:hover { background: var(--bc-on-dark); color: var(--bc-primary-dark); }
/* Ghost on light surfaces falls back to a legible tinted style */
.bc-prose:not(.bc-prose--dark) .bc-btn--ghost,
.bc-grid:not(.bc-grid--dark) .bc-btn--ghost,
.bc-faq .bc-btn--ghost,
.bc-formband--intro .bc-btn--ghost { background: var(--bc-surface-alt); color: var(--bc-primary-dark); border-color: var(--bc-surface-alt); }

/* ---------- Site header / nav ---------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--bc-primary-dark);
  color: var(--bc-on-dark);
  border-bottom: 3px solid var(--bc-accent);
}
.site-header__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--bc-sp-3);
  min-height: var(--bc-header-h);
}
.site-header__logo {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  color: var(--bc-on-dark);
  text-decoration: none;
  font-family: var(--bc-font-head);
  font-weight: var(--bc-fw-head);
  font-stretch: 112%;
  font-size: 1.125rem;
  line-height: 1.1;
}
.site-header__logo:hover { color: #ffffff; }
.site-header__logo img { height: 46px; width: auto; }
.site-header__logo small { display: block; font-family: var(--bc-font-body); font-weight: 600; font-size: 0.6875rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--bc-on-dark-soft); }
.site-header__actions { display: flex; align-items: center; gap: var(--bc-sp-2); }
.site-header__phone { color: var(--bc-accent-light); font-weight: var(--bc-fw-bold); text-decoration: none; white-space: nowrap; }
.site-header__phone:hover { color: #ffffff; }
.site-header__hamburger {
  display: none;
  width: 46px;
  height: 46px;
  border: 2px solid var(--bc-border-dark);
  border-radius: var(--bc-radius);
  background: transparent;
  color: var(--bc-on-dark);
  cursor: pointer;
  padding: 0;
  align-items: center;
  justify-content: center;
}
.site-header__hamburger span:not(.bc-visually-hidden),
.site-header__hamburger span:not(.bc-visually-hidden)::before,
.site-header__hamburger span:not(.bc-visually-hidden)::after {
  display: block; width: 20px; height: 2px; background: currentColor; position: relative; content: "";
}
.site-header__hamburger span::before { position: absolute; top: -6px; }
.site-header__hamburger span::after { position: absolute; top: 6px; }

.site-nav__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
.site-nav__list > li { position: relative; }
.site-nav__list a,
.site-nav__toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.6rem 0.8rem;
  color: var(--bc-on-dark);
  text-decoration: none;
  font-weight: 600;
  font-size: var(--bc-fs-sm);
  background: none;
  border: 0;
  font-family: inherit;
  cursor: pointer;
  border-radius: var(--bc-radius);
}
.site-nav__list a:hover,
.site-nav__toggle:hover,
.site-nav__list a[aria-current="page"] { color: var(--bc-accent-light); }
.site-nav__toggle::after {
  content: "";
  width: 7px; height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
}
.site-nav__dropdown {
  list-style: none;
  margin: 0;
  padding: 0.5rem;
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 240px;
  background: var(--bc-surface);
  border-radius: var(--bc-radius);
  border-top: 3px solid var(--bc-accent);
  box-shadow: var(--bc-shadow);
  display: none;
}
.site-nav__dropdown a { color: var(--bc-ink); display: block; width: 100%; }
.site-nav__dropdown a:hover { color: var(--bc-primary); background: var(--bc-paper); }
.site-nav__list > li:hover > .site-nav__dropdown,
.site-nav__list > li:focus-within > .site-nav__dropdown,
.site-nav__list > li.is-open > .site-nav__dropdown { display: block; }

@media (max-width: 960px) {
  .site-header__hamburger { display: inline-flex; }
  .site-header__phone { display: none; }
  .site-nav {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--bc-primary-dark);
    border-bottom: 3px solid var(--bc-accent);
    padding: var(--bc-sp-2) var(--bc-sp-3) var(--bc-sp-4);
    max-height: calc(100vh - var(--bc-header-h));
    overflow-y: auto;
  }
  .site-nav.is-open { display: block; }
  .site-nav__list { flex-direction: column; align-items: stretch; }
  .site-nav__list a, .site-nav__toggle { width: 100%; padding: 0.8rem 0.5rem; font-size: 1rem; }
  .site-nav__dropdown { position: static; box-shadow: none; background: transparent; border: 0; border-left: 2px solid var(--bc-border-dark); border-radius: 0; margin-left: 0.5rem; min-width: 0; }
  .site-nav__dropdown a { color: var(--bc-on-dark-soft); }
  .site-nav__dropdown a:hover { color: var(--bc-accent-light); background: transparent; }
  .site-nav__list > li:hover > .site-nav__dropdown { display: none; }
  .site-nav__list > li.is-open > .site-nav__dropdown,
  .site-nav__list > li:focus-within > .site-nav__dropdown { display: block; }
}
@media (max-width: 560px) {
  .site-header__actions .bc-btn { display: none; }
  .site-header__logo { font-size: 1rem; }
  .site-header__logo img { height: 38px; }
}

/* ---------- Hero ---------- */
.bc-hero {
  position: relative;
  background-color: var(--bc-primary-dark);
  background-image: var(--bc-sheen), var(--bc-flake), linear-gradient(160deg, #0d3157 0%, var(--bc-primary-dark) 65%);
  color: var(--bc-on-dark);
  padding: var(--bc-sp-8) 0 var(--bc-sp-7);
  overflow: hidden;
}
.bc-hero::after {
  /* stacked chevron watermark from the logo */
  content: "";
  position: absolute;
  right: -60px;
  bottom: -90px;
  width: 360px;
  height: 300px;
  background:
    linear-gradient(rgba(20,93,160,0.35), rgba(20,93,160,0.35)) top / 100% 58% no-repeat,
    linear-gradient(rgba(9,93,64,0.45), rgba(9,93,64,0.45)) bottom / 100% 100% no-repeat;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  pointer-events: none;
}
.bc-hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: var(--bc-sp-6);
  align-items: center;
}
.bc-hero__title { font-size: var(--bc-fs-h1); margin-bottom: var(--bc-sp-3); }
.bc-hero__title em { font-style: normal; color: var(--bc-accent-light); }
.bc-hero__lede { font-size: var(--bc-fs-lg); color: var(--bc-on-dark-soft); max-width: 38em; margin-bottom: var(--bc-sp-5); }
.bc-hero__cta { display: flex; flex-wrap: wrap; gap: var(--bc-sp-2); }
.bc-hero__badges { list-style: none; padding: 0; margin: var(--bc-sp-5) 0 0; display: flex; flex-wrap: wrap; gap: var(--bc-sp-2) var(--bc-sp-4); font-size: var(--bc-fs-sm); color: var(--bc-on-dark); font-weight: 600; }
.bc-hero__badges li::before { content: "\2713"; color: var(--bc-secondary-light); margin-right: 0.4em; font-weight: 800; }
.bc-hero__media { position: relative; }
.bc-hero__media img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--bc-radius-lg);
  box-shadow: var(--bc-shadow);
  border: 4px solid rgba(242,245,244,0.12);
}
.bc-hero--compact { padding: var(--bc-sp-7) 0 var(--bc-sp-6); }
.bc-hero--compact .bc-hero__grid { grid-template-columns: 1fr; }
.bc-hero--light { background: var(--bc-tint); color: var(--bc-ink); }
.bc-hero--light .bc-hero__lede { color: var(--bc-ink-soft); }
.bc-hero--light .bc-hero__title em { color: var(--bc-primary); }
.bc-hero--light .bc-eyebrow { color: var(--bc-secondary); }
.bc-hero--light .bc-hero__badges { color: var(--bc-ink); }
.bc-hero--light .bc-hero__badges li::before { color: var(--bc-secondary); }
@media (max-width: 900px) {
  .bc-hero { padding: var(--bc-sp-7) 0 var(--bc-sp-6); }
  .bc-hero__grid { grid-template-columns: 1fr; gap: var(--bc-sp-5); }
  .bc-hero::after { width: 220px; height: 180px; right: -50px; bottom: -60px; }
}

/* ---------- Section rhythm ---------- */
.bc-prose, .bc-grid, .bc-faq, .bc-gallery, .bc-video, .bc-map, .bc-testimonial, .bc-formband {
  padding: var(--bc-sp-7) 0;
}
@media (max-width: 600px) {
  .bc-prose, .bc-grid, .bc-faq, .bc-gallery, .bc-video, .bc-map, .bc-testimonial, .bc-formband { padding: var(--bc-sp-6) 0; }
}
.bc-grid__head, .bc-faq__head, .bc-gallery__head, .bc-testimonial__head {
  max-width: 760px;
  margin: 0 auto var(--bc-sp-6);
  text-align: center;
}
.bc-grid__head p, .bc-faq__head p, .bc-gallery__head p, .bc-testimonial__head p { color: var(--bc-ink-soft); font-size: var(--bc-fs-lg); }

/* ---------- Prose ---------- */
.bc-prose { background: var(--bc-surface); }
.bc-prose__inner { max-width: 780px; }
.bc-prose__inner > :last-child { margin-bottom: 0; }
.bc-prose h2 { margin-top: 0; }
.bc-prose h3 { margin-top: var(--bc-sp-5); }
.bc-prose ul li, .bc-prose ol li { margin-bottom: 0.4rem; }
.bc-prose ul { list-style: none; padding-left: 0; }
.bc-prose ul li { position: relative; padding-left: 1.6rem; }
.bc-prose ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 11px;
  height: 9px;
  background: var(--bc-secondary);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.bc-prose blockquote {
  margin: var(--bc-sp-5) 0;
  padding: var(--bc-sp-3) var(--bc-sp-4);
  border-left: 4px solid var(--bc-accent);
  background: var(--bc-paper);
  font-size: var(--bc-fs-lg);
  border-radius: 0 var(--bc-radius) var(--bc-radius) 0;
}
.bc-prose__cta { display: flex; flex-wrap: wrap; gap: var(--bc-sp-2); margin-top: var(--bc-sp-4); }
.bc-prose--has-color { background: var(--bc-tint); }
.bc-prose--has-color blockquote { background: var(--bc-surface); }
.bc-prose--dark {
  background-color: var(--bc-primary-dark);
  background-image: var(--bc-flake);
  color: var(--bc-on-dark);
}
.bc-prose--dark p, .bc-prose--dark li { color: var(--bc-on-dark); }
.bc-prose--dark a:not(.bc-btn) { color: var(--bc-link-on-dark); }
.bc-prose--dark ul li::before { background: var(--bc-accent); }
.bc-prose--dark blockquote { background: rgba(255,255,255,0.06); color: var(--bc-on-dark); }
.bc-prose--with-image .bc-prose__inner { max-width: none; display: grid; grid-template-columns: 1fr 1fr; gap: var(--bc-sp-6); align-items: center; }
.bc-prose--with-image.bc-prose--img-left .bc-prose__img { order: -1; }
.bc-prose__img img {
  width: 100%;
  aspect-ratio: 5 / 4;
  object-fit: cover;
  border-radius: var(--bc-radius-lg);
  box-shadow: var(--bc-shadow);
}
@media (max-width: 900px) {
  .bc-prose--with-image .bc-prose__inner { grid-template-columns: 1fr; gap: var(--bc-sp-5); }
  .bc-prose--with-image.bc-prose--img-left .bc-prose__img { order: 0; }
}

/* ---------- Grid / cards ---------- */
.bc-grid { background: var(--bc-paper); }
.bc-grid__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--bc-sp-4);
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.bc-grid--2col .bc-grid__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.bc-grid--3col .bc-grid__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bc-grid--4col .bc-grid__list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.bc-grid__card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--bc-surface);
  border: 1px solid var(--bc-border);
  border-radius: var(--bc-radius-lg);
  padding: var(--bc-sp-5) var(--bc-sp-4) var(--bc-sp-4);
  box-shadow: var(--bc-shadow-sm);
  transition: transform var(--bc-transition), box-shadow var(--bc-transition);
  overflow: hidden;
}
.bc-grid__card::before {
  /* chevron notch at card top */
  content: "";
  position: absolute;
  top: 0;
  left: var(--bc-sp-4);
  width: 34px;
  height: 14px;
  background: var(--bc-primary-light);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.bc-grid__card:hover { transform: translateY(-3px); box-shadow: var(--bc-shadow); }
.bc-grid__card h3 { font-size: var(--bc-fs-h4); margin-bottom: var(--bc-sp-2); }
.bc-grid__card p { color: var(--bc-ink-soft); margin-bottom: var(--bc-sp-3); }
.bc-grid__card > :last-child { margin-bottom: 0; }
.bc-grid__card a.bc-grid__link { margin-top: auto; font-weight: var(--bc-fw-bold); color: var(--bc-primary); text-decoration: none; }
.bc-grid__card a.bc-grid__link::after { content: " \2192"; }
.bc-grid__card a.bc-grid__link:hover { color: var(--bc-secondary); text-decoration: underline; }
.bc-grid__icon {
  width: 52px;
  height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--bc-radius);
  background: var(--bc-tint);
  color: var(--bc-secondary);
  margin-bottom: var(--bc-sp-3);
}
.bc-grid__icon svg { width: 28px; height: 28px; }
.bc-grid--imaged .bc-grid__card { padding: 0; }
.bc-grid--imaged .bc-grid__card::before { z-index: 1; background: var(--bc-accent); }
.bc-grid__card-img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.bc-grid--imaged .bc-grid__body { padding: var(--bc-sp-4); display: flex; flex-direction: column; flex: 1; }
.bc-grid--text-only .bc-grid__card { background: transparent; box-shadow: none; border: 0; border-top: 3px solid var(--bc-primary); border-radius: 0; padding: var(--bc-sp-4) 0 0; }
.bc-grid--text-only .bc-grid__card::before { display: none; }
.bc-grid--text-only .bc-grid__card:hover { transform: none; box-shadow: none; }
.bc-grid--text-only .bc-grid__num { font-family: var(--bc-font-head); font-weight: var(--bc-fw-head); font-size: 2rem; color: var(--bc-secondary); line-height: 1; margin-bottom: var(--bc-sp-2); }
.bc-grid--dark {
  background-color: var(--bc-primary-dark);
  background-image: var(--bc-flake);
  color: var(--bc-on-dark);
}
.bc-grid--dark .bc-grid__head p { color: var(--bc-on-dark-soft); }
.bc-grid--dark .bc-grid__card { background: #0f3051; border-color: var(--bc-border-dark); }
.bc-grid--dark .bc-grid__card p { color: var(--bc-on-dark-soft); }
.bc-grid--dark .bc-grid__card a.bc-grid__link { color: var(--bc-accent-light); }
.bc-grid--dark .bc-grid__icon { background: rgba(127,211,173,0.14); color: var(--bc-secondary-light); }
.bc-grid--dark.bc-grid--text-only .bc-grid__card { background: transparent; border-top-color: var(--bc-accent); }
.bc-grid--dark .bc-grid__num { color: var(--bc-accent-light); }
.bc-grid__foot { text-align: center; margin-top: var(--bc-sp-6); }
@media (max-width: 1024px) {
  .bc-grid--4col .bc-grid__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  .bc-grid__list, .bc-grid--3col .bc-grid__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .bc-grid__list, .bc-grid--2col .bc-grid__list, .bc-grid--3col .bc-grid__list, .bc-grid--4col .bc-grid__list { grid-template-columns: 1fr; }
}

/* ---------- FAQ ---------- */
.bc-faq { background: var(--bc-surface); }
.bc-faq__list { max-width: 860px; margin: 0 auto; display: grid; gap: var(--bc-sp-2); }
.bc-faq__item {
  background: var(--bc-paper);
  border: 1px solid var(--bc-border);
  border-radius: var(--bc-radius);
  overflow: hidden;
}
.bc-faq__item[open] { border-color: var(--bc-primary); background: var(--bc-surface); box-shadow: var(--bc-shadow-sm); }
.bc-faq__q {
  list-style: none;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--bc-sp-3);
  padding: var(--bc-sp-3) var(--bc-sp-4);
  font-family: var(--bc-font-head);
  font-weight: 700;
  font-stretch: 106%;
  font-size: 1.0625rem;
  line-height: 1.35;
  color: var(--bc-ink);
}
.bc-faq__q::-webkit-details-marker { display: none; }
.bc-faq__q::after {
  content: "";
  flex: none;
  width: 14px;
  height: 10px;
  background: var(--bc-primary);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  transition: transform var(--bc-transition);
}
.bc-faq__item[open] .bc-faq__q::after { transform: rotate(180deg); background: var(--bc-secondary); }
.bc-faq__q:hover { color: var(--bc-primary); }
.bc-faq__a { padding: 0 var(--bc-sp-4) var(--bc-sp-4); color: var(--bc-ink-soft); }
.bc-faq__a > :last-child { margin-bottom: 0; }

/* ---------- Gallery ---------- */
.bc-gallery { background: var(--bc-paper); }
.bc-gallery__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--bc-sp-3);
}
.bc-gallery__cell { position: relative; margin: 0; border-radius: var(--bc-radius-lg); overflow: hidden; background: var(--bc-primary-dark); }
.bc-gallery__cell img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform 400ms ease; }
.bc-gallery__cell:hover img { transform: scale(1.04); }
.bc-gallery__cell--wide { grid-column: span 2; }
.bc-gallery__cell--wide img { aspect-ratio: auto; height: 100%; }
.bc-gallery__caption {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: var(--bc-sp-4) var(--bc-sp-3) var(--bc-sp-2);
  background: linear-gradient(180deg, rgba(10,37,64,0) 0%, rgba(10,37,64,0.92) 55%);
  color: #ffffff;
  font-size: var(--bc-fs-sm);
  font-weight: 600;
}
@media (max-width: 860px) { .bc-gallery__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) {
  .bc-gallery__grid { grid-template-columns: 1fr; }
  .bc-gallery__cell--wide { grid-column: auto; }
  .bc-gallery__cell--wide img { aspect-ratio: 4 / 3; height: auto; }
}

/* ---------- Video ---------- */
.bc-video {
  background-color: var(--bc-primary);
  background-image: var(--bc-sheen), var(--bc-flake);
  color: var(--bc-on-dark);
}
.bc-video__grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: var(--bc-sp-6); align-items: center; }
.bc-video__copy p { color: var(--bc-on-dark); }
.bc-video__copy a:not(.bc-btn) { color: var(--bc-link-on-dark); }
.bc-video__player { position: relative; border-radius: var(--bc-radius-lg); overflow: hidden; box-shadow: var(--bc-shadow); background: var(--bc-primary-dark); }
.bc-video__frame { position: relative; aspect-ratio: 16 / 9; width: 100%; }
.bc-video__frame iframe, .bc-video__frame video, .bc-video__frame img { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; object-fit: cover; }
.bc-video__play {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 76px; height: 76px;
  border-radius: 50%;
  border: 0;
  background: var(--bc-accent);
  color: var(--bc-on-accent);
  cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 0 0 10px rgba(242,165,22,0.25);
}
.bc-video__play::before { content: ""; border-left: 22px solid currentColor; border-top: 13px solid transparent; border-bottom: 13px solid transparent; margin-left: 6px; }
@media (max-width: 900px) { .bc-video__grid { grid-template-columns: 1fr; gap: var(--bc-sp-5); } }

/* ---------- Map ---------- */
.bc-map { background: var(--bc-surface); }
.bc-map__grid { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: var(--bc-sp-5); align-items: stretch; }
.bc-map__info {
  background: var(--bc-paper);
  border: 1px solid var(--bc-border);
  border-left: 5px solid var(--bc-secondary);
  border-radius: var(--bc-radius-lg);
  padding: var(--bc-sp-5);
}
.bc-map__addr { font-style: normal; margin: 0 0 var(--bc-sp-4); line-height: 1.7; }
.bc-map__addr strong { display: block; font-family: var(--bc-font-head); font-weight: var(--bc-fw-head); font-size: var(--bc-fs-lg); }
.bc-map__meta { list-style: none; padding: 0; margin: 0 0 var(--bc-sp-4); display: grid; gap: 0.35rem; color: var(--bc-ink-soft); }
.bc-map__meta strong { color: var(--bc-ink); }
.bc-map__areas { display: flex; flex-wrap: wrap; gap: 0.4rem; list-style: none; padding: 0; margin: 0 0 var(--bc-sp-4); }
.bc-map__areas li { background: var(--bc-tint); color: var(--bc-secondary); font-size: 0.875rem; font-weight: 600; padding: 0.2rem 0.65rem; border-radius: 999px; }
.bc-map__frame { position: relative; min-height: 360px; border-radius: var(--bc-radius-lg); overflow: hidden; border: 1px solid var(--bc-border); background: var(--bc-surface-alt); }
.bc-map__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
@media (max-width: 900px) { .bc-map__grid { grid-template-columns: 1fr; } .bc-map__frame { min-height: 300px; } }

/* ---------- Testimonial ---------- */
.bc-testimonial { background: var(--bc-tint); }
.bc-testimonial__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--bc-sp-4); }
.bc-testimonial__card {
  margin: 0;
  background: var(--bc-surface);
  border-radius: var(--bc-radius-lg);
  padding: var(--bc-sp-5) var(--bc-sp-4) var(--bc-sp-4);
  box-shadow: var(--bc-shadow-sm);
  border-bottom: 4px solid var(--bc-primary-light);
  display: flex;
  flex-direction: column;
}
.bc-testimonial__stars { color: var(--bc-signal); letter-spacing: 0.15em; font-size: 1.1rem; margin-bottom: var(--bc-sp-2); }
.bc-testimonial__quote { margin: 0 0 var(--bc-sp-4); font-size: 1.0625rem; color: var(--bc-ink); }
.bc-testimonial__quote p:last-child { margin-bottom: 0; }
.bc-testimonial__author { margin-top: auto; display: flex; align-items: center; gap: var(--bc-sp-2); }
.bc-testimonial__avatar {
  width: 46px; height: 46px; border-radius: 50%;
  background: var(--bc-primary); color: #ffffff;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--bc-font-head); font-weight: var(--bc-fw-head);
  flex: none; object-fit: cover;
}
.bc-testimonial__name { display: block; font-weight: var(--bc-fw-bold); color: var(--bc-ink); font-style: normal; }
.bc-testimonial__role { display: block; font-size: var(--bc-fs-sm); color: var(--bc-ink-soft); }
.bc-testimonial--single .bc-testimonial__grid { grid-template-columns: 1fr; max-width: 820px; margin: 0 auto; }
.bc-testimonial--single .bc-testimonial__quote { font-size: var(--bc-fs-lg); }
@media (max-width: 900px) { .bc-testimonial__grid { grid-template-columns: 1fr; } }

/* ---------- Form band ---------- */
.bc-formband__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--bc-sp-6); align-items: center; }
.bc-formband__title { font-size: var(--bc-fs-h2); }
.bc-formband__lede { font-size: var(--bc-fs-lg); }
.bc-formband__points { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.5rem; font-weight: 600; }
.bc-formband__points li::before { content: "\2713"; margin-right: 0.5em; font-weight: 800; }
.bc-formband__form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--bc-sp-3);
  background: var(--bc-surface);
  color: var(--bc-ink);
  padding: var(--bc-sp-5);
  border-radius: var(--bc-radius-lg);
  box-shadow: var(--bc-shadow);
  border-top: 5px solid var(--bc-accent);
}
.bc-formband__form .bc-form-field--full,
.bc-formband__form .bc-btn,
.bc-formband__form .bc-formband__note { grid-column: 1 / -1; }
.bc-formband__note { font-size: 0.875rem; color: var(--bc-ink-soft); margin: 0; }
.bc-form-field { display: flex; flex-direction: column; gap: 0.35rem; min-width: 0; }
.bc-form-field label { font-weight: var(--bc-fw-bold); font-size: var(--bc-fs-sm); color: var(--bc-ink); }
.bc-form-field--required label::after { content: " *"; color: #b3261e; }
.bc-form-field input,
.bc-form-field select,
.bc-form-field textarea {
  width: 100%;
  min-height: 48px;
  padding: 0.7rem 0.85rem;
  border: 1.5px solid #8a979f;
  border-radius: var(--bc-radius);
  background: var(--bc-surface);
  color: var(--bc-ink);
  font: inherit;
  font-size: 1rem;
}
.bc-form-field textarea { min-height: 120px; resize: vertical; }
.bc-form-field input:focus,
.bc-form-field select:focus,
.bc-form-field textarea:focus { outline: 3px solid rgba(20,93,160,0.35); outline-offset: 0; border-color: var(--bc-primary); }
.bc-formband--intro { background: var(--bc-surface-alt); }
.bc-formband--intro .bc-formband__lede { color: var(--bc-ink-soft); }
.bc-formband--intro .bc-formband__points li::before { color: var(--bc-secondary); }
.bc-formband--final {
  background-color: var(--bc-primary-dark);
  background-image: var(--bc-sheen), var(--bc-flake);
  color: var(--bc-on-dark);
}
.bc-formband--final .bc-formband__lede { color: var(--bc-on-dark-soft); }
.bc-formband--final .bc-formband__points li::before { color: var(--bc-accent-light); }
.bc-formband--final a:not(.bc-btn) { color: var(--bc-link-on-dark); }
@media (max-width: 900px) { .bc-formband__grid { grid-template-columns: 1fr; gap: var(--bc-sp-5); } }
@media (max-width: 520px) {
  .bc-formband__form { grid-template-columns: 1fr; padding: var(--bc-sp-4); }
}

/* ---------- Footer ---------- */
.site-footer {
  background-color: #071b30;
  background-image: var(--bc-flake);
  color: var(--bc-on-dark-soft);
  padding: var(--bc-sp-7) 0 0;
  border-top: 4px solid var(--bc-secondary);
  font-size: var(--bc-fs-sm);
}
.site-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: var(--bc-sp-5); padding-bottom: var(--bc-sp-6); }
.site-footer__brand p { max-width: 34ch; }
.site-footer__heading { font-family: var(--bc-font-head); font-size: 1rem; font-weight: var(--bc-fw-head); color: #ffffff; margin: 0 0 var(--bc-sp-3); letter-spacing: 0.04em; text-transform: uppercase; }
.site-footer__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.5rem; }
.site-footer a { color: var(--bc-on-dark); text-decoration: none; }
.site-footer a:hover { color: var(--bc-accent-light); text-decoration: underline; }
.site-footer__bottom {
  border-top: 1px solid var(--bc-border-dark);
  padding: var(--bc-sp-3) 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--bc-sp-2);
  font-size: 0.875rem;
}
@media (max-width: 900px) { .site-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .site-footer__grid { grid-template-columns: 1fr; } }

/* ---------- Utilities ---------- */
.bc-visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}