/* =============================================================================
   AA-CHAPEL — Components
   Buttons, cards, dividers, motifs (arch, rope, compass), header, footer.
   All scoped under .aa-chapel.
   ============================================================================= */

/* ---------- Buttons ---------- */

.aa-chapel .aa-btn,
.aa-chapel a.aa-btn,
.aa-chapel button.aa-btn,
.aa-chapel input[type="submit"].aa-btn {
  --bg: var(--aa-brass-500);
  --fg: var(--aa-navy-900);
  display: inline-flex;
  gap: 0.5rem;
  align-items: center;
  justify-content: center;
  padding: 0.85rem 1.5rem;
  background: var(--bg);
  color: var(--fg);
  font-family: var(--aa-font-body);
  font-weight: 600;
  font-size: 0.95rem;
  letter-spacing: 0.02em;
  border: 1px solid var(--bg);
  border-radius: var(--aa-radius);
  text-decoration: none;
  cursor: pointer;
  transition: background-color var(--aa-dur) var(--aa-ease),
              border-color var(--aa-dur) var(--aa-ease),
              transform 80ms var(--aa-ease);
  user-select: none;
}
.aa-chapel .aa-btn:hover {
  --bg: var(--aa-brass-400);
  text-decoration: none;
}
.aa-chapel .aa-btn:active { transform: translateY(1px); }
.aa-chapel .aa-btn:focus-visible {
  outline: 2px solid var(--aa-navy-700);
  outline-offset: 2px;
}

.aa-chapel .aa-btn--ghost {
  --bg: transparent;
  --fg: var(--aa-navy-700);
  border-color: var(--aa-navy-700);
}
.aa-chapel .aa-btn--ghost:hover {
  --bg: var(--aa-navy-700);
  --fg: var(--aa-stone-50);
}

/* Ghost on a DARK background (hero, footer) — stone outline + stone text */
.aa-chapel .aa-btn--ghost-light {
  --bg: transparent;
  --fg: var(--aa-stone-50);
  border-color: var(--aa-stone-50);
}
.aa-chapel .aa-btn--ghost-light:hover {
  --bg: var(--aa-stone-50);
  --fg: var(--aa-navy-900);
}

.aa-chapel .aa-btn--dark {
  --bg: var(--aa-navy-700);
  --fg: var(--aa-stone-50);
  border-color: var(--aa-navy-700);
}
.aa-chapel .aa-btn--dark:hover {
  --bg: var(--aa-navy-500);
}

/* ---------- Cards ---------- */

.aa-chapel .aa-card {
  background: var(--aa-paper);
  border: 1px solid var(--aa-stone-200);
  border-radius: var(--aa-radius-soft);
  overflow: hidden;
  box-shadow: var(--aa-shadow-sm);
  text-align: center;          /* every card centered for visual cohesion */
  transition: box-shadow var(--aa-dur) var(--aa-ease),
              border-color var(--aa-dur) var(--aa-ease),
              transform var(--aa-dur) var(--aa-ease);
  display: flex;
  flex-direction: column;
}
.aa-chapel .aa-card__body {
  padding: clamp(1.25rem, 2vw, 1.75rem);
  display: flex;
  flex-direction: column;
  flex: 1;
}
.aa-chapel .aa-card p { margin-left: auto; margin-right: auto; }
.aa-chapel .aa-card:hover {
  box-shadow: var(--aa-shadow-md);
  border-color: var(--aa-brass-500);
}

/* Card image — photographic top, slightly desaturated for a tasteful
   editorial feel; saturates on hover. */
.aa-chapel .aa-card__image {
  display: block;
  width: 100%;
  height: clamp(160px, 24vw, 220px);
  object-fit: cover;
  filter: saturate(0.85) brightness(0.97);
  transition: filter var(--aa-dur) var(--aa-ease),
              transform 400ms var(--aa-ease);
}
.aa-chapel .aa-card:hover .aa-card__image {
  filter: saturate(1.05) brightness(1);
  transform: scale(1.02);
}

/* Card icon — small brass mark above the title */
.aa-chapel .aa-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px; height: 48px;
  margin: 0 auto 1rem;
  border-radius: 50%;
  background: var(--aa-stone-100);
  border: 1px solid var(--aa-stone-200);
  color: var(--aa-brass-500);
  transition: background var(--aa-dur) var(--aa-ease),
              border-color var(--aa-dur) var(--aa-ease);
}
.aa-chapel .aa-card:hover .aa-card__icon {
  background: var(--aa-brass-500);
  border-color: var(--aa-brass-500);
  color: var(--aa-navy-900);
}
.aa-chapel .aa-card__icon svg {
  width: 22px; height: 22px;
  stroke: currentColor;
  stroke-width: 1.6;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* ---------- Arch motif — for hero & lot images ---------- */

.aa-chapel .aa-arch,
.aa-chapel .aa-arch img {
  border-top-left-radius:  50% 18%;
  border-top-right-radius: 50% 18%;
  overflow: hidden;
}

/* ---------- Rope divider — replaces <hr> ---------- */

.aa-chapel .aa-rope,
.aa-chapel hr.aa-rope {
  border: 0;
  height: 12px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 12'><path d='M0 6 Q10 0 20 6 T40 6 T60 6 T80 6' fill='none' stroke='%23B08D57' stroke-width='1.5'/></svg>");
  background-repeat: repeat-x;
  background-position: center;
  background-size: 80px 12px;
  margin: 3rem auto;
  width: min(420px, 60%);
  opacity: 0.65;
}

/* ---------- Arched window divider — chapel motif, used between sections ---------- */
/* A delicate brass-stroked arched window. Used in place of .aa-rope where we
   want to lean into the Old Chapel narrative. Centered, subtle, never
   gimmicky. */

.aa-chapel .aa-arch-divider {
  display: block;
  width: 56px; height: 64px;
  margin: 2.5rem auto;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 56 64' fill='none' stroke='%23B08D57' stroke-width='1.2'><path d='M8 60 V32 a20 20 0 0 1 40 0 V60 Z'/><path d='M28 32 V60'/><path d='M28 12 v40 M22 22 a8 8 0 0 1 12 0'/></svg>") no-repeat center / contain;
  opacity: 0.7;
}

/* ---------- Subtle coastal wave — Morecambe Bay nod ---------- */
/* A single, very low-amplitude wave line. Used as a delicate underline accent
   on the prefooter address or near a coastal-flavoured eyebrow. */

.aa-chapel .aa-wave {
  display: block;
  width: 100px; height: 14px;
  margin: 1rem auto;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 14' fill='none' stroke='%23B08D57' stroke-width='1.4'><path d='M0 7 Q12.5 0 25 7 T50 7 T75 7 T100 7'/></svg>") no-repeat center / contain;
  opacity: 0.55;
}

/* ---------- Compass mark — inline brand glyph ---------- */

.aa-chapel .aa-compass {
  display: inline-block;
  width: 22px; height: 22px;
  vertical-align: -3px;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B08D57' stroke-width='1.2'><circle cx='12' cy='12' r='10'/><path d='M12 2 L13.5 12 L12 22 L10.5 12 Z M2 12 L12 13.5 L22 12 L12 10.5 Z'/></svg>") no-repeat center / contain;
}

/* ---------- Hero ---------- */
/* Photographic hero: full-bleed image with a charcoal overlay + light text.
   Keeps the black/white feel (dark overlay, not navy), brass as accent only.
   The background image is set inline on the .aa-hero element via the page
   markup so the image is editable in WP without touching CSS. */

.aa-chapel .aa-hero {
  position: relative;
  padding: clamp(4rem, 10vw, 7rem) var(--aa-gutter);
  background-color: var(--aa-charcoal);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: var(--aa-stone-50);
  text-align: center;
  isolation: isolate;
  overflow: hidden;
}
.aa-chapel .aa-hero::before {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(180deg,
    rgba(18, 18, 18, 0.55) 0%,
    rgba(18, 18, 18, 0.78) 100%);
  z-index: 0;
}
.aa-chapel .aa-hero__inner {
  max-width: var(--aa-container-narrow);
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.aa-chapel .aa-hero h1 {
  color: var(--aa-stone-50);
  margin: 0 auto 1rem;
  max-width: 22ch;
  position: relative;
  padding-bottom: 0.6rem;
}
.aa-chapel .aa-hero h1::after {
  content: "";
  display: block;
  width: 56px; height: 2px;
  background: var(--aa-brass-500);
  margin: 0.8rem auto 0;
}
.aa-chapel .aa-hero p {
  color: var(--aa-stone-100);
  max-width: 56ch;
  margin: 0 auto 1rem;
  font-size: clamp(1rem, 1.6vw, 1.15rem);
}
.aa-chapel .aa-hero .aa-eyebrow { color: var(--aa-brass-400); }

/* Mobile: shrink padding, allow full-width buttons */
@media (max-width: 640px) {
  .aa-chapel .aa-hero { padding-block: 2.75rem; }
  .aa-chapel .aa-hero h1 { font-size: clamp(2rem, 8vw, 2.5rem); }
}

/* =============================================================================
   Layout utilities — consistent centering, mobile-friendly stacking
   ============================================================================= */

/* Section header (eyebrow + h2 + optional intro) — always centred */
.aa-chapel .aa-section-head {
  text-align: center;
  max-width: 56ch;
  margin: 0 auto 2rem;
}
.aa-chapel .aa-section-head h2 {
  display: inline-block;
  padding-bottom: 0.6rem;
  margin-bottom: 0;
  position: relative;
}
.aa-chapel .aa-section-head h2::after {
  content: "";
  display: block;
  width: 48px; height: 2px;
  background: var(--aa-brass-500);
  margin: 0.6rem auto 0;
}
.aa-chapel .aa-section-head p {
  margin: 0.8rem auto 0;
  color: var(--aa-ink-soft);
}

/* CTA row — buttons side-by-side, wraps to stack on mobile */
.aa-chapel .aa-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: center;
  align-items: center;
  margin: 1.6rem 0 0;
}
@media (max-width: 480px) {
  .aa-chapel .aa-cta-row { flex-direction: column; align-items: stretch; }
  .aa-chapel .aa-cta-row .aa-btn { width: 100%; }
}

/* Section padding helper — uniform vertical rhythm */
.aa-chapel .aa-section,
.aa-chapel section.aa-section {
  padding-top: clamp(2.5rem, 6vw, 4rem);
  padding-bottom: clamp(2.5rem, 6vw, 4rem);
}

/* 3-card responsive grid (auto-fit, but with a sensible minimum) */
.aa-chapel .aa-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: clamp(1rem, 2vw, 1.5rem);
}
.aa-chapel .aa-cards .aa-card {
  display: flex;
  flex-direction: column;
}
.aa-chapel .aa-cards .aa-card h3 { margin-top: 0; }
.aa-chapel .aa-cards .aa-card p:last-child { margin-bottom: 0; margin-top: auto; padding-top: 0.6rem; }

/* Centre helper used inside narrow containers */
.aa-chapel .aa-center { text-align: center; }
.aa-chapel .aa-center p { margin-left: auto; margin-right: auto; }

/* Pull-quote inside a narrow container — keep left bar but centre block */
.aa-chapel .aa-center > blockquote,
.aa-chapel .aa-section-narrow > blockquote {
  margin-left: auto;
  margin-right: auto;
  max-width: 56ch;
}

/* Compass mark in eyebrows — leave a tiny gap */
.aa-chapel .aa-eyebrow .aa-compass { margin-right: 0.4rem; }

/* ---------- Trust strip — light cream band, immediately under the hero ---------- */

.aa-chapel .aa-trust {
  background: var(--aa-stone-100);
  color: var(--aa-ink);
  padding: 1.25rem var(--aa-gutter);
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  max-width: 100vw;
  border-top: 1px solid var(--aa-stone-200);
  border-bottom: 1px solid var(--aa-stone-200);
}
.aa-chapel .aa-trust__inner {
  max-width: var(--aa-container);
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.5rem 2.5rem;
  text-align: center;
  font-size: 0.85rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 500;
}
.aa-chapel .aa-trust__item {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--aa-ink-soft);
}
.aa-chapel .aa-trust__item svg {
  width: 18px; height: 18px;
  stroke: var(--aa-brass-500);
  stroke-width: 1.6;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex-shrink: 0;
}

/* ---------- Pre-footer / contact strip ---------- */
/* Charcoal-near-black to mirror the original site's #121212 dark surface,
   not navy. Brass remains the small accent. */

.aa-chapel .aa-prefooter {
  background: var(--aa-charcoal);
  color: var(--aa-stone-50);
  padding: clamp(2.5rem, 5vw, 3.5rem) var(--aa-gutter);
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  max-width: 100vw;
  text-align: center;
  border-top: 1px solid rgba(176, 141, 87, 0.25);
}
.aa-chapel .aa-prefooter h2 { color: var(--aa-stone-50); }
.aa-chapel .aa-prefooter p  { color: var(--aa-stone-100); margin-left: auto; margin-right: auto; }
.aa-chapel .aa-prefooter h2.aa-section::after,
.aa-chapel .aa-prefooter .aa-section-head h2::after {
  background: var(--aa-brass-500);
}
.aa-chapel .aa-prefooter .aa-eyebrow { color: var(--aa-brass-400); }

/* =============================================================================
   Mobile-first responsive polish
   ============================================================================= */

@media (max-width: 768px) {
  .aa-chapel .aa-section {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  .aa-chapel .aa-section-head { margin-bottom: 1.5rem; }
  .aa-chapel .aa-rope { margin: 2rem auto; }
  .aa-chapel blockquote { font-size: 1.15rem; padding-left: 1rem; }
}

@media (max-width: 480px) {
  .aa-chapel .aa-hero { padding-block: 2.25rem; }
  .aa-chapel .aa-hero h1 { font-size: clamp(1.75rem, 8.5vw, 2.25rem); line-height: 1.15; }
  .aa-chapel .aa-hero p  { font-size: 0.95rem; }
  .aa-chapel .aa-section { padding-top: 1.75rem; padding-bottom: 1.75rem; }
  .aa-chapel .aa-trust__inner { gap: 0.75rem 1.25rem; font-size: 0.7rem; }
  .aa-chapel .aa-card { padding: 1.1rem; }
  .aa-chapel .aa-eyebrow { font-size: 0.7rem; }
}

/* Stop overflow nightmare on iPhone safari with full-bleed sections */
@supports (overflow: clip) {
  .aa-chapel { overflow-x: clip; }
}

/* ---------- Heritage section: side-by-side text + image ---------- */

.aa-chapel .aa-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: center;
  max-width: var(--aa-container);
  margin: 0 auto;
}
.aa-chapel .aa-split__media img {
  display: block;
  width: 100%;
  height: 100%;
  max-height: 540px;
  object-fit: cover;
  border-radius: var(--aa-radius-soft);
  filter: saturate(0.9) brightness(0.97);
  /* Subtle arched-window evocation on the top edge */
  border-top-left-radius: 50% 12%;
  border-top-right-radius: 50% 12%;
}
.aa-chapel .aa-split__body { text-align: left; }
.aa-chapel .aa-split__body .aa-section-head {
  text-align: left;
  margin-left: 0;
}
.aa-chapel .aa-split__body .aa-section-head h2::after {
  margin-left: 0;
}

@media (max-width: 768px) {
  .aa-chapel .aa-split { grid-template-columns: 1fr; }
  .aa-chapel .aa-split__body { text-align: center; }
  .aa-chapel .aa-split__body .aa-section-head { text-align: center; margin-left: auto; }
  .aa-chapel .aa-split__body .aa-section-head h2::after { margin-left: auto; margin-right: auto; }
  .aa-chapel .aa-split__media img { max-height: 320px; }
}

/* =============================================================================
   Elementor Pro Theme Builder — header & footer overrides
   The footer / header on this site are rendered by Elementor Theme Builder
   (data-elementor-type="footer|header"), not by the parent theme's
   header.php / footer.php. Elementor widgets carry their own inline + section
   styles set when the template was originally authored — many of those
   pre-date the new brand palette and produce poor contrast on our dark
   surfaces. These overrides force readable colours under the
   navy-on-stone scheme. Scoped under .aa-chapel so they only fire on
   front-end pages, never in wp-admin / Elementor editor.
   ============================================================================= */

/* ---------- Footer wrapper ---------- */
/* Charcoal #1F1F1F — matches original site's near-black dark surface,
   not navy. Brass remains the only accent. */

.aa-chapel footer.elementor-location-footer,
.aa-chapel footer[data-elementor-type="footer"] {
  background: var(--aa-charcoal) !important;
  color: var(--aa-stone-100) !important;
  font-family: var(--aa-font-body) !important;
}

/* Strip out per-section / per-column backgrounds inside the footer so the
   parent navy shows through consistently. (Elementor adds background colours
   on the .elementor-section / .elementor-column level — those produce the
   "lighter grey strip" effect at the bottom of the screenshot.) */
.aa-chapel footer.elementor-location-footer .elementor-section,
.aa-chapel footer.elementor-location-footer .elementor-column,
.aa-chapel footer.elementor-location-footer .elementor-widget-wrap,
.aa-chapel footer.elementor-location-footer .elementor-element {
  background-color: transparent !important;
}

/* Add a faint brass hairline above the footer */
.aa-chapel footer.elementor-location-footer {
  border-top: 1px solid rgba(176, 141, 87, 0.30) !important;
}

/* ---------- Text colour inside the footer (everything light) ---------- */

.aa-chapel footer.elementor-location-footer,
.aa-chapel footer.elementor-location-footer p,
.aa-chapel footer.elementor-location-footer span,
.aa-chapel footer.elementor-location-footer li,
.aa-chapel footer.elementor-location-footer label,
.aa-chapel footer.elementor-location-footer small,
.aa-chapel footer.elementor-location-footer .elementor-text-editor,
.aa-chapel footer.elementor-location-footer .elementor-icon-list-text,
.aa-chapel footer.elementor-location-footer .elementor-icon-box-description,
.aa-chapel footer.elementor-location-footer .elementor-widget-container,
.aa-chapel footer.elementor-location-footer .elementor-widget-heading .elementor-heading-title {
  color: var(--aa-stone-100) !important;
}

/* Headings — Cormorant on stone-50 */
.aa-chapel footer.elementor-location-footer h1,
.aa-chapel footer.elementor-location-footer h2,
.aa-chapel footer.elementor-location-footer h3,
.aa-chapel footer.elementor-location-footer h4,
.aa-chapel footer.elementor-location-footer h5,
.aa-chapel footer.elementor-location-footer h6,
.aa-chapel footer.elementor-location-footer .elementor-heading-title {
  font-family: var(--aa-font-display) !important;
  color: var(--aa-stone-50) !important;
  font-weight: 500 !important;
}

/* ---------- Links inside the footer ---------- */

.aa-chapel footer.elementor-location-footer a,
.aa-chapel footer.elementor-location-footer .elementor-item,
.aa-chapel footer.elementor-location-footer .elementor-icon-list-item a,
.aa-chapel footer.elementor-location-footer p a,
.aa-chapel footer.elementor-location-footer .elementor-text-editor a {
  color: var(--aa-stone-50) !important;
  text-decoration: underline !important;
  text-decoration-color: var(--aa-brass-500) !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 0.2em !important;
  transition: color 200ms ease, text-decoration-color 200ms ease !important;
}

.aa-chapel footer.elementor-location-footer a:hover,
.aa-chapel footer.elementor-location-footer .elementor-item:hover,
.aa-chapel footer.elementor-location-footer .elementor-item.elementor-item-active,
.aa-chapel footer.elementor-location-footer .elementor-item:focus,
.aa-chapel footer.elementor-location-footer .elementor-icon-list-item a:hover {
  color: var(--aa-brass-400) !important;
  text-decoration-color: var(--aa-stone-50) !important;
}

/* Nav menu items in the footer — usually have decoration:none from Elementor;
   force a subtle brass-on-hover state so they feel link-y */
.aa-chapel footer.elementor-location-footer .elementor-nav-menu .elementor-item {
  text-decoration: none !important;
}
.aa-chapel footer.elementor-location-footer .elementor-nav-menu .elementor-item:hover,
.aa-chapel footer.elementor-location-footer .elementor-nav-menu .elementor-item.elementor-item-active {
  color: var(--aa-brass-400) !important;
}

/* ---------- Social icons in footer ---------- */

.aa-chapel footer.elementor-location-footer .elementor-social-icon,
.aa-chapel footer.elementor-location-footer .elementor-icon {
  background-color: transparent !important;
  color: var(--aa-stone-50) !important;
  border: 1px solid var(--aa-brass-500) !important;
}
.aa-chapel footer.elementor-location-footer .elementor-social-icon:hover,
.aa-chapel footer.elementor-location-footer .elementor-icon:hover {
  background-color: var(--aa-brass-500) !important;
  color: var(--aa-navy-900) !important;
}

/* ---------- Header (Elementor Theme Builder) — leave Elementor's own styling
   intact. The original header was authored as cream/light with dark links and
   a working dropdown; previous overrides forced navy + light text and made the
   dropdown menu unreadable on its white panel. The only adjustment we make is
   a subtle Cormorant-on-headings hint, and only if Elementor's existing colour
   choices already match the brand. Otherwise: don't touch. */

.aa-chapel header.elementor-location-header .elementor-heading-title {
  font-family: var(--aa-font-display) !important;
  font-weight: 500 !important;
}

/* ---------- "Live now" badge ---------- */

.aa-chapel .aa-live-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.25rem 0.6rem;
  background: var(--aa-live);
  color: var(--aa-stone-50);
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.aa-chapel .aa-live-badge::before {
  content: "";
  width: 6px; height: 6px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 0 currentColor;
  animation: aa-pulse 2s infinite;
}
@keyframes aa-pulse {
  0%   { box-shadow: 0 0 0 0   rgba(255,255,255,0.65); }
  70%  { box-shadow: 0 0 0 6px rgba(255,255,255,0);    }
  100% { box-shadow: 0 0 0 0   rgba(255,255,255,0);    }
}

/* ---------- Inputs / forms ---------- */

.aa-chapel input[type="text"],
.aa-chapel input[type="email"],
.aa-chapel input[type="tel"],
.aa-chapel input[type="search"],
.aa-chapel input[type="number"],
.aa-chapel input[type="password"],
.aa-chapel select,
.aa-chapel textarea {
  background: var(--aa-stone-50);
  border: 1px solid var(--aa-stone-200);
  border-radius: var(--aa-radius);
  padding: 0.7rem 0.9rem;
  font-family: var(--aa-font-body);
  font-size: 1rem;
  color: var(--aa-ink);
  transition: border-color var(--aa-dur) var(--aa-ease),
              box-shadow   var(--aa-dur) var(--aa-ease);
}
.aa-chapel input:focus,
.aa-chapel select:focus,
.aa-chapel textarea:focus {
  outline: none;
  border-color: var(--aa-brass-500);
  box-shadow: 0 0 0 3px rgba(176,141,87,0.20);
}

/* ---------- Footer styling for parent theme's footer.php ---------- */

.aa-chapel .site-footer,
.aa-chapel #colophon,
.aa-chapel footer.bt-site-footer {
  background: var(--aa-navy-900);
  color: var(--aa-stone-200);
  padding: 3rem 0 1.5rem;
}
.aa-chapel .site-footer a,
.aa-chapel #colophon a,
.aa-chapel footer.bt-site-footer a {
  color: var(--aa-stone-50);
  text-decoration-color: var(--aa-brass-500);
}

/* ---------- Header styling for parent theme's header.php ---------- */

.aa-chapel #masthead,
.aa-chapel header.site-header,
.aa-chapel header.bt-site-header {
  background: var(--aa-navy-700);
  color: var(--aa-stone-50);
  border-bottom: 1px solid var(--aa-brass-500);
}
.aa-chapel #masthead a,
.aa-chapel header.site-header a,
.aa-chapel header.bt-site-header a { color: var(--aa-stone-50); }

.aa-chapel .site-title,
.aa-chapel .bt-site-title {
  font-family: var(--aa-font-display);
  font-weight: 500;
  letter-spacing: 0.005em;
  font-size: 1.6rem;
}

/* ---------- Tag, pill ---------- */

.aa-chapel .aa-pill {
  display: inline-block;
  padding: 0.15rem 0.55rem;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  background: var(--aa-stone-200);
  color: var(--aa-navy-700);
  border-radius: 999px;
}
.aa-chapel .aa-pill--brass { background: var(--aa-brass-500); color: var(--aa-navy-900); }
.aa-chapel .aa-pill--navy  { background: var(--aa-navy-700);  color: var(--aa-stone-50);  }