/* CTA + Footer — polished closing sections */

/* ——— Call to Action ——— */
.cta {
  background: linear-gradient(135deg, #1a3355 0%, #1F3A5F 48%, #142a47 100%);
  padding: 56px 0;
  position: relative;
  overflow: hidden;
}
.cta::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 80% 60% at 85% 50%, rgba(201, 162, 39, .08), transparent 60%);
  pointer-events: none;
}
.cta::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent 5%, #d4af37 35%, #c9a227 50%, #d4af37 65%, transparent 95%);
}
.cta .container,
.cta-inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 48px;
  flex-wrap: wrap;
}
.cta-copy {
  flex: 1 1 320px;
  max-width: 540px;
}
.cta-eyebrow {
  margin: 0 0 10px;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #d4af37;
}
.cta h2 {
  margin: 0 0 12px;
  font-size: clamp(1.65rem, 2.8vw, 2.15rem);
  font-weight: 700;
  line-height: 1.2;
  color: #fff;
}
.cta-desc,
.cta p.cta-desc,
.cta-copy > p:not(.cta-eyebrow) {
  margin: 0 0 18px;
  font-size: 1.0625rem;
  line-height: 1.65;
  color: rgba(236, 242, 248, .92);
}
.cta-call {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 1rem;
  font-weight: 600;
  color: #e8c96a;
  text-decoration: none;
  transition: color .2s ease;
}
.cta-call:hover {
  color: #fff;
  text-decoration: underline;
}
.cta-call .icon-img {
  width: 18px;
  height: 18px;
}
.cta-actions {
  flex: 0 1 320px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  align-items: stretch;
}
.cta-actions .btn {
  width: 100%;
  justify-content: center;
  padding: 16px 24px;
}
.cta-actions .cta-call {
  display: none;
}

/* ——— Footer ——— */
.footer {
  background: linear-gradient(180deg, #142a47 0%, #0f2038 100%);
  padding: 0;
  color: #fff;
}
.footer-main {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 40px 36px;
  padding: 48px 0 40px;
}
.footer-brand {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.footer-brand img {
  width: 72px;
  height: 72px;
  object-fit: contain;
  flex-shrink: 0;
}
.footer-brand strong {
  display: block;
  font-family: var(--serif);
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.15;
  text-transform: uppercase;
  color: #fff;
}
.footer-brand .small {
  font-family: var(--sans);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1.4;
  text-transform: uppercase;
  margin-top: 5px;
  color: #b8c9db;
}
.footer-tag {
  margin-top: 16px;
  font-size: 0.9375rem;
  line-height: 1.65;
  color: #c5d3e3;
  max-width: 280px;
}
.footer-col h4 {
  margin: 0 0 16px;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #d4af37;
}
.footer h4 {
  margin: 0 0 16px;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #d4af37;
}
.footer ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.footer li {
  margin: 0 0 12px;
  font-size: 0.9375rem;
  line-height: 1.45;
  color: #d7e3ef;
}
.footer li:last-child {
  margin-bottom: 0;
}
.footer a {
  color: #d7e3ef;
  transition: color .2s ease;
}
.footer a:hover {
  color: #e8c96a;
}
.footer .contact-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.footer .contact-row .icon-img {
  width: 17px;
  height: 17px;
  margin-top: 2px;
  flex-shrink: 0;
}
.socials {
  display: flex;
  gap: 12px;
  margin-bottom: 14px;
}
.social {
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 50%;
  display: grid;
  place-items: center;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.social:hover {
  background: #c9a227;
  border-color: #c9a227;
  transform: translateY(-2px);
}
.social .icon-img {
  width: 16px;
  height: 16px;
}
.footer-connect-note {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #9eb0c4;
}
.footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, .12);
  padding: 22px 0 28px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 10px;
}
.footer-bottom span {
  font-size: 0.8125rem;
  line-height: 1.65;
  color: #a8bccc;
  max-width: 920px;
}
.footer-bottom span:first-child {
  color: #c5d3e3;
  font-weight: 500;
}

/* Privacy Policy / Terms & Conditions. Sits in the bottom bar so the legal
   pages are reachable from every page of the site. */
.footer-legal-links {
  list-style: none;
  margin: 2px 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 10px 22px;
}
.footer-legal-links li {
  margin: 0;
  position: relative;
}
.footer-legal-links li + li::before {
  content: "";
  position: absolute;
  left: -11px;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 12px;
  background: rgba(255, 255, 255, 0.28);
}
.footer-legal-links a {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #d7e3f1;
  text-decoration: none;
  border-bottom: 1px solid rgba(201, 162, 39, 0.5);
  padding-bottom: 1px;
  transition: color .2s ease, border-color .2s ease;
}
.footer-legal-links a:hover,
.footer-legal-links a:focus-visible {
  color: #fff;
  border-bottom-color: #C9A227;
}

/* Comfortable tap targets on touch screens. */
@media (max-width: 900px) {
  /* Contact rows are top-aligned above so a long value can wrap under its own
     icon. On mobile the links become 44px tap targets that centre their text,
     which dropped the linked rows (phone, email) ~20px below their icons while
     the unlinked ones (fax, location) stayed put. Centring the row and removing
     the icon's optical nudge puts them all back on one baseline.

     This lives here rather than in pages.css because that file loads first, and
     the base `align-items: flex-start` in this file would otherwise win. */
  .footer .contact-row {
    align-items: center;
  }
  .footer .contact-row .icon-img {
    margin-top: 0;
  }

  .footer-legal-links {
    gap: 4px 22px;
  }
  .footer-legal-links a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
  .footer-legal-links li + li::before {
    height: 14px;
  }
}

@media (max-width: 900px) {
  .cta {
    padding: 44px 0;
  }
  .cta .container,
  .cta-inner {
    flex-direction: column;
    align-items: stretch;
    gap: 28px;
  }
  .cta-copy {
    max-width: none;
    text-align: center;
  }
  .cta-call {
    justify-content: center;
  }
  .cta-actions {
    flex: 1 1 auto;
    max-width: 400px;
    margin: 0 auto;
    width: 100%;
  }
  .footer-main {
    grid-template-columns: 1fr 1fr;
    gap: 32px 24px;
    padding: 40px 0 32px;
  }
  .footer-brand-wrap {
    grid-column: 1 / -1;
  }
}

@media (max-width: 600px) {
  .cta {
    padding: 36px 0;
  }
  .footer-main {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .footer-brand {
    max-width: 100%;
  }
  .footer-tag {
    max-width: none;
  }
}

/* ── About section — premium photo card ── */
.about-photo {
  padding-left: 0;
  max-width: 400px;
}

.about-photo::before {
  display: none;
}

.about-photo-frame {
  position: relative;
  padding: 0 0 1.5rem 1.5rem;
}

.about-photo-frame::before {
  content: "";
  position: absolute;
  top: 1.5rem;
  left: 0;
  right: 1.5rem;
  bottom: 0;
  border: 3px solid #c9a227;
  z-index: 0;
  pointer-events: none;
  opacity: 0.92;
}

.about-photo-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(145deg, rgba(201, 162, 39, 0.06) 0%, transparent 45%);
  pointer-events: none;
  z-index: 2;
}

.about-photo-frame img {
  position: relative;
  z-index: 1;
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: 50% 25%;
  border-radius: 2px;
  box-shadow:
    0 24px 48px rgba(31, 58, 95, 0.2),
    0 8px 16px rgba(31, 58, 95, 0.1);
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.about-photo:hover .about-photo-frame img {
  transform: translateY(-4px);
  box-shadow:
    0 32px 56px rgba(31, 58, 95, 0.24),
    0 12px 24px rgba(31, 58, 95, 0.12);
}

.about-photo-badge {
  position: absolute;
  bottom: 2rem;
  left: -0.5rem;
  z-index: 3;
  padding: 0.5rem 0.875rem;
  background: linear-gradient(180deg, #2a4d78 0%, #1f3a5f 50%, #152a47 100%);
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border-left: 3px solid #c9a227;
  box-shadow: 0 4px 14px rgba(21, 42, 71, 0.35);
}

.about-features {
  margin-top: 1.75rem;
  border: 1px solid #e7eaee;
  border-radius: 10px;
  overflow: hidden;
  background: #fafbfc;
  box-shadow: 0 4px 18px rgba(12, 45, 80, 0.05);
}

.about-feature {
  gap: 0.75rem;
  background: #fff;
  transition: background 0.2s ease;
}

.about-feature:hover {
  background: #f8f9fc;
}

.about-feature-icon {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 2.625rem;
  height: 2.625rem;
  border-radius: 50%;
  background: linear-gradient(180deg, #ffffff 0%, #f0f3f8 100%);
  border: 1px solid #e0e5ec;
  box-shadow: 0 2px 8px rgba(31, 58, 95, 0.08);
}

.about-feature .icon-img {
  width: 1.375rem;
  height: 1.375rem;
}

@media (max-width: 900px) {
  .about-photo {
    max-width: 340px;
    margin: 0 auto 1.5rem;
  }
}

@media (max-width: 600px) {
  .about-photo {
    max-width: 300px;
  }

  .about-photo-badge {
    left: 0;
    bottom: 1.5rem;
    font-size: 0.625rem;
    padding: 0.4375rem 0.75rem;
  }
}

/* ── Specialized Services (home) ── */
.specialized {
  padding: clamp(3rem, 6vw, 4.5rem) 0;
  background: linear-gradient(180deg, #f5f7fa 0%, #ffffff 55%, #f8f9fc 100%);
  border-top: 1px solid #e7eaee;
  border-bottom: 1px solid #e7eaee;
}

.special-header {
  max-width: 42rem;
  margin-bottom: clamp(2rem, 4vw, 2.75rem);
}

.specialized .eyebrow {
  margin-bottom: 0.5rem;
  color: var(--gold, #c9a227);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.special-title {
  margin: 0 0 1rem;
  color: var(--navy, #1f3a5f);
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(1.75rem, 3.5vw, 2.25rem);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.01em;
}

.special-desc {
  margin: 0 0 1.5rem;
  color: #4a5568;
  font-size: 1.0625rem;
  line-height: 1.65;
}

.special-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1rem;
}

.special-actions .btn {
  padding: 0.75rem 1.375rem;
  font-size: 0.8125rem;
}

.special-cards {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1rem;
}

.special-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1.5rem 1rem;
  text-align: center;
  background: #fff;
  border: 1px solid #e7eaee;
  border-radius: 12px;
  box-shadow: 0 4px 18px rgba(12, 45, 80, 0.06);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.special-card:hover {
  transform: translateY(-4px);
  border-color: rgba(201, 162, 39, 0.45);
  box-shadow: 0 10px 28px rgba(12, 45, 80, 0.1);
}

.special-card-icon {
  display: grid;
  place-items: center;
  width: 3.5rem;
  height: 3.5rem;
  margin-bottom: 0.875rem;
  border-radius: 50%;
  background: linear-gradient(180deg, #ffffff 0%, #f0f3f8 100%);
  border: 1px solid #e0e5ec;
  box-shadow: 0 2px 10px rgba(31, 58, 95, 0.08);
}

.special-card .icon-img {
  width: 1.75rem;
  height: 1.75rem;
}

.special-card h4 {
  margin: 0;
  color: var(--navy, #1f3a5f);
  font-family: "Source Sans 3", sans-serif;
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.35;
}

@media (max-width: 1100px) {
  .special-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  .special-header {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }

  .special-actions {
    justify-content: center;
  }

  .special-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.875rem;
  }
}

@media (max-width: 480px) {
  .special-cards {
    grid-template-columns: 1fr;
  }

  .special-card {
    flex-direction: row;
    gap: 1rem;
    padding: 1.125rem 1.25rem;
    text-align: left;
  }

  .special-card-icon {
    flex-shrink: 0;
    margin-bottom: 0;
  }

  .special-card h4 {
    text-align: left;
  }
}