/** Reusable pattern and Spectra-compatible component styling. */
.vc-hero { background: var(--vc-navy); color: var(--vc-white); overflow: hidden; position: relative; }
.vc-hero::after { border: 1px solid rgba(232, 215, 181, 0.28); content: ""; height: 24rem; position: absolute; right: -10rem; top: -9rem; transform: rotate(35deg); width: 24rem; }
.vc-hero__inner { display: grid; gap: var(--vc-space-lg); grid-template-columns: minmax(0, 1fr) minmax(15rem, 0.45fr); padding-block: var(--vc-space-xl); position: relative; z-index: 1; }
.vc-hero h1, .vc-hero p { color: inherit; }
.vc-hero__rule { border-left: 1px solid rgba(232, 215, 181, 0.5); display: flex; flex-direction: column; justify-content: end; padding-left: var(--vc-space-md); }

.vc-actions, .vc-actions.wp-block-buttons { align-items: center; display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: var(--vc-space-md); }
.vc-button .wp-block-button__link, a.vc-button, .vc-button > a, a.vc-button--outline {
  background: var(--vc-gold); border: 2px solid var(--vc-gold); border-radius: var(--vc-radius); color: var(--vc-navy); display: inline-block; font-weight: 800; padding: 0.8rem 1.2rem; text-decoration: none;
}
.vc-button--outline .wp-block-button__link, a.vc-button--outline, .vc-button--outline > a { background: transparent; border-color: var(--vc-gold-light); color: var(--vc-white); }

.vc-trust { background: var(--vc-white); border-bottom: 1px solid var(--vc-border); }
.vc-trust__grid { display: grid; gap: 1px; grid-template-columns: repeat(4, 1fr); }
.vc-trust__item { border-right: 1px solid var(--vc-border); padding: var(--vc-space-sm); }
.vc-trust__item:last-child { border-right: 0; }
.vc-trust__item strong { color: var(--vc-navy); display: block; font-family: var(--vc-serif); font-size: 1.12rem; }

.vc-grid { display: grid; gap: var(--vc-space-sm); }
.vc-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.vc-card { background: var(--vc-white); border: 1px solid var(--vc-border); border-top: 3px solid var(--vc-gold); padding: var(--vc-space-md); }
.vc-card h3 { margin-top: 0; }
.vc-card a { font-weight: 750; }

.vc-cta { background: var(--vc-navy); color: var(--vc-white); padding-block: var(--vc-space-lg); }
.vc-cta__inner { align-items: center; display: flex; gap: var(--vc-space-md); justify-content: space-between; }
.vc-cta :is(h2, p) { color: inherit; margin-block: 0; }

.vc-author { align-items: center; display: grid; gap: var(--vc-space-md); grid-template-columns: minmax(10rem, 0.35fr) minmax(0, 1fr); }
.vc-author__mark { align-items: center; aspect-ratio: 1; background: var(--vc-navy); color: var(--vc-gold-light); display: flex; font-family: var(--vc-serif); font-size: clamp(2.5rem, 7vw, 5rem); justify-content: center; max-width: 18rem; }

.vc-contact { display: grid; gap: var(--vc-space-lg); grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); }
.vc-contact__details { border-left: 3px solid var(--vc-gold); padding-left: var(--vc-space-sm); }

/* Spectra/UAGB blocks can opt into the same system by adding these classes. */
.wp-block-uagb-container.vc-section { max-width: none; }
.wp-block-uagb-container.vc-card { height: 100%; }

@media (max-width: 800px) {
  .vc-hero__inner, .vc-contact, .vc-author { grid-template-columns: 1fr; }
  .vc-grid--3 { grid-template-columns: 1fr 1fr; }
  .vc-trust__grid { grid-template-columns: 1fr 1fr; }
  .vc-trust__item:nth-child(2) { border-right: 0; }
  .vc-cta__inner { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 520px) {
  .vc-grid--3, .vc-trust__grid { grid-template-columns: 1fr; }
  .vc-trust__item { border-bottom: 1px solid var(--vc-border); border-right: 0; }
}