/*
  All American Buildings shared design layer
  Keeps legacy HTML pages and landing subfolders visually aligned.
*/
:root {
  --aab-red: #7d1a2e;
  --aab-red-dark: #5b0d1c;
  --aab-navy: #1a2e56;
  --aab-navy-dark: #071a35;
  --aab-gold: #c9a227;
  --aab-text: #202936;
  --aab-muted: #687386;
  --aab-light: #f4f5f8;
  --aab-border: #dfe4eb;
  --aab-radius: 0.75rem;
  --aab-radius-sm: 0.5rem;
  --aab-shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.1);
  --aab-shadow-md: 0 10px 24px rgba(15, 23, 42, 0.14);
}

html {
  scroll-behavior: smooth;
}

body {
  color: var(--aab-text);
  font-family: "Inter", Arial, sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6,
.section-title h2,
.section-heading h2,
.shop-top h2,
.shop-top-index h2,
.shop-top-index-blog h2,
.column-index h2,
.column-index2 h2,
.benefits-left h2,
.contact-quote-wrap h2,
.image-title,
.titleicons,
.popup-title {
  font-family: "Inter", Arial, sans-serif !important;
}

h1,
h2,
h3,
.section-title h2,
.section-heading h2,
.shop-top h2,
.shop-top-index h2,
.shop-top-index-blog h2,
.column-index h2,
.column-index2 h2,
.benefits-left h2,
.contact-quote-wrap h2 {
  color: var(--aab-navy) !important;
  letter-spacing: -0.035em;
}

h1 {
  font-size: clamp(2.75rem, 5vw, 4.8rem) !important;
  line-height: 1.02 !important;
  font-weight: 800 !important;
}

h2 {
  font-size: clamp(5rem, 4vw, 3.25rem) !important;
  line-height: 1.12 !important;
  font-weight: 800 !important;
}

h3,
.benefit-card h3,
.card-content h3,
.feature-grid h3,
.condition-grid h3,
.project-grid h3,
.image-title,
.titleicons,
.popup-title {
  color: var(--aab-navy);
  font-size: clamp(1.05rem, 1.8vw, 1.25rem) !important;
  line-height: 1.35 !important;
  font-weight: 800 !important;
}

.home-message h1,
.tagline-message h1,
.event-title.tagline-message h1,
.bigsize h1,
.hero h1,
.final-cta h2,
.cta-section h2,
.cta-content h2,
.dark-section h2,
.dark-section h3,
.shared-footer h2,
.shared-footer h3,
.aab-footer-scope h4 {
  color: #fff !important;
}

.hero h1 span,
.final-cta h2 span {
  color: var(--aab-gold) !important;
}

.section-title,
.section-heading {
  max-width: 760px;
  margin: 0 auto 3rem;
  text-align: center;
}

.section-title p,
.section-heading p,
.shop-top p,
.shop-top-index p,
.shop-top-index-blog p {
  color: var(--aab-muted);
  font-size: 1rem;
  line-height: 1.7;
}

.eyebrow,
.section-eyebrow,
.aab-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0 0 1rem;
  color: var(--aab-gold);
  font-family: "Inter", Arial, sans-serif;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1.3;
  text-transform: uppercase;
}

.eyebrow::before,
.section-eyebrow::before,
.aab-eyebrow::before {
  content: "";
  display: inline-block;
  width: 2rem;
  height: 2px;
  flex: 0 0 2rem;
  background: currentColor;
}

.section,
.section-soft-gray,
.aab-section {
  padding-top: 5rem;
  padding-bottom: 5rem;
}

.section-soft-gray,
.aab-section--soft,
.service-area,
.conditions,
.faq,
.product-nav {
  background: var(--aab-light);
}

.btn,
button.btn,
a.btn,
.special,
.card-content .card-button,
.submit-button,
.top-header-phone,
.buttons a,
.buttons-thanks a,
.cta-button a.btn.btn-primary,
.productsSwiper .fusion-button {
  border-radius: var(--aab-radius-sm) !important;
  font-family: "Inter", Arial, sans-serif !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  transition:
    color 0.25s ease,
    background-color 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.35s ease,
    transform 0.25s ease !important;
}

.btn-primary,
.special,
.submit-button,
.cta-button a.btn.btn-primary {
  background-color: var(--aab-red) !important;
  border-color: var(--aab-red) !important;
  color: #fff !important;
  box-shadow: inset 0 0 0 0 var(--aab-red-dark) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.special:hover,
.special:focus,
.submit-button:hover,
.submit-button:focus,
.cta-button a.btn.btn-primary:hover,
.cta-button a.btn.btn-primary:focus {
  background-color: var(--aab-red) !important;
  border-color: var(--aab-red-dark) !important;
  color: #fff !important;
  box-shadow: inset 0 100px 0 0 var(--aab-red-dark) !important;
  transform: translateY(-1px);
}

.btn-outline,
.btn-transparent,
.btn-outline-dark,
.card-content .card-button {
  background: transparent !important;
  color: var(--aab-navy) !important;
  border-color: var(--aab-navy) !important;
  box-shadow: inset 0 0 0 0 var(--aab-navy) !important;
}

.hero .btn-outline,
.final-cta .btn-outline,
.dark-section .btn-outline {
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.75) !important;
  box-shadow: inset 0 0 0 0 rgba(255, 255, 255, 0.14) !important;
}

.btn-outline:hover,
.btn-transparent:hover,
.btn-outline-dark:hover,
.card-content .card-button:hover {
  color: #fff !important;
  background: var(--aab-navy) !important;
  border-color: var(--aab-navy) !important;
  box-shadow: inset 0 100px 0 0 var(--aab-navy) !important;
  transform: translateY(-1px);
}

.hero .btn-outline:hover,
.final-cta .btn-outline:hover,
.dark-section .btn-outline:hover {
  background: rgba(255, 255, 255, 0.14) !important;
  border-color: #fff !important;
  box-shadow: inset 0 100px 0 0 rgba(255, 255, 255, 0.12) !important;
}

.btn[disabled],
button[disabled] {
  cursor: not-allowed !important;
  opacity: 0.55 !important;
  transform: none !important;
}

.building-card,
.feature-grid article,
.condition-grid article,
.project-grid article,
.benefit-card,
.card,
.small-box,
.image-container,
.user-details-card-american,
.shop-item,
.service-box,
.map-card,
.quote-wrap,
.contact-quote-wrap form,
.productsSwiper .sw-slide-container {
  border-radius: var(--aab-radius) !important;
  border-color: var(--aab-border);
  box-shadow: var(--aab-shadow-sm);
  overflow: hidden;
  transition:
    box-shadow 0.3s ease,
    transform 0.3s ease,
    border-color 0.3s ease !important;
}

.building-card:hover,
.feature-grid article:hover,
.condition-grid article:hover,
.project-grid article:hover,
.benefit-card:hover,
.card:hover,
.small-box:hover,
.image-container:hover,
.user-details-card-american:hover,
.shop-item:hover,
.service-box:hover,
.productsSwiper .swiper-slide:hover .sw-slide-container {
  box-shadow: var(--aab-shadow-md) !important;
  transform: translateY(-4px);
}

.building-card__image,
.project-image,
.card > img,
.card img,
.benefit-card img,
.image-container,
.shop-item .image-wrap,
.shop-item img,
.productsSwiper .sw-slide-container {
  overflow: hidden;
}

.building-card__image img,
.project-image img,
.building-card img,
.card > img,
.card img,
.benefit-card img,
.image-container img,
.shop-item img {
  transition: transform 0.5s ease !important;
}

.building-card:hover .building-card__image img,
.project-grid article:hover .project-image img,
.building-card:hover img,
.card:hover img,
.benefit-card:hover img,
.image-container:hover img,
.shop-item:hover img {
  transform: scale(1.05);
}

.feature-icon,
.condition-icon {
  border-radius: 0.625rem;
}

.stats-grid strong,
.stat-value,
.counter,
.count-number {
  color: var(--aab-navy) !important;
}

.quote-wrap .field input,
.quote-wrap .field select,
.quote-wrap .field textarea,
.row-form-contact input,
.row-form-contact textarea,
.row-form-contact select,
.contact-quote-wrap input,
.contact-quote-wrap select,
.contact-quote-wrap textarea {
  border-radius: var(--aab-radius-sm) !important;
}

.success-modal .modal-content,
#successModal .modal-content {
  border-radius: 1rem !important;
}

@media (max-width: 768px) {
  h1 {
    font-size: clamp(2.35rem, 11vw, 3.4rem) !important;
  }

  h2,
  .section-title h2,
  .section-heading h2,
  .shop-top h2,
  .shop-top-index h2,
  .shop-top-index-blog h2,
  .column-index h2,
  .column-index2 h2,
  .benefits-left h2,
  .contact-quote-wrap h2 {
    font-size: clamp(1.75rem, 8vw, 2.35rem) !important;
  }

  .section,
  .section-soft-gray,
  .aab-section {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}