/*
Theme Name: heal-restore-sanctuary
Text Domain: heal-restore-sanctuary
Description: Editorial practice theme for Heal & Restore PLLC.
Version: 1.3.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
WPVibe: yes
*/

html { scroll-behavior: smooth; }

.hr-social { display: inline-flex; align-items: center; gap: .65rem; }
.hr-social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  color: #1488c4;
  border: 1px solid #d7e6ef;
  text-decoration: none;
  transition: transform .2s ease, background .2s ease, color .2s ease;
}
.hr-social-link:hover {
  background: #1488c4;
  color: #fff;
  transform: translateY(-2px);
}
.primary-nav .hr-social { margin-left: .25rem; }

.meet-annette {
  align-items: start;
}
.annette-photo {
  position: relative;
}
.annette-photo img {
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: top center;
  border-radius: 8px;
  box-shadow: 0 18px 40px rgba(12,49,68,.18);
}
@media (max-width: 800px) {
  .meet-annette { grid-template-columns: 1fr !important; }
}

.band-moss .state-card { color: #1c1914 !important; }
.band-moss .state-card h3 { color: #1c1914 !important; }
.band-moss .state-card p { color: #3f3a32 !important; }
.band-moss .state-card .hr-kicker { color: #c9a227 !important; }

.hero {
  background-size: cover !important;
  background-position: center !important;
  min-height: 92vh !important;
}
@media (max-width: 800px) {
  .hero {
    min-height: 0 !important;
    height: auto !important;
    place-items: start stretch !important;
  }
  .hero-copy {
    padding: 1.4rem 0 1.6rem !important;
    max-width: 100% !important;
  }
  .hero-copy h1,
  .hero-copy .hr-display {
    font-size: 2.05rem !important;
    margin: .35rem 0 .7rem !important;
  }
  .hero-actions {
    margin-top: 1rem !important;
  }
  .brand-logo img,
  .brand-logo .hr-logo-img {
    height: 52px !important;
  }
}
.hero::after {
  background: linear-gradient(180deg, rgba(12,49,68,0.18) 0%, rgba(12,49,68,0.72) 100%) !important;
}
.trust-bar {
  background: #0c3144;
  color: #fff;
  padding: .95rem 0;
}
.trust-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .7rem 1.1rem;
  font-size: .86rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.trust-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #c9a227;
  display: inline-block;
}
.pic-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.1rem;
}
.pic-card {
  display: block;
  text-decoration: none !important;
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 12px 30px rgba(12,49,68,.1);
}
.pic-card img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  display: block;
  transform: scale(1.04);
  transition: transform 8s ease;
}
.pic-card.is-in img {
  animation: hr-pic-drift 14s ease-in-out infinite alternate;
}
@keyframes hr-pic-drift {
  from { transform: scale(1.04) translate3d(0,0,0); }
  to { transform: scale(1.14) translate3d(-2%, -1%, 0); }
}
.pic-card:hover img {
  animation: none;
  transform: scale(1.12);
  transition: transform .6s ease;
}
.pic-card {
  transition: transform .4s ease, box-shadow .4s ease;
}
.pic-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 18px 40px rgba(12,49,68,.16);
}
.pic-card-copy {
  padding: 1rem 1.1rem 1.2rem;
}
.pic-card-copy h3 {
  margin: 0 0 .35rem;
  font-family: Fraunces, Georgia, serif;
  font-size: 1.25rem;
}
.pic-card-copy p {
  margin: 0;
  color: #3a3a3a;
}
@media (max-width: 800px) {
  .pic-grid { grid-template-columns: 1fr; }
}
.home-portrait img {
  width: 100%;
  height: 520px;
  object-fit: cover;
  object-position: top center;
  border-radius: 22px;
  box-shadow: 0 24px 50px rgba(12,49,68,.22);
}
.cta-band {
  background:
    radial-gradient(circle at 20% 20%, rgba(201,162,39,.22), transparent 28%),
    radial-gradient(circle at 80% 80%, rgba(20,136,196,.28), transparent 32%),
    #0c3144 !important;
  color: #fff;
}
.hr-btn-gold {
  background: #c9a227 !important;
  color: #111 !important;
}
.hr-btn-gold:hover {
  background: #e0ba3a !important;
}
.pay-priority {
  border-color: #c9a227 !important;
  box-shadow: 0 10px 30px rgba(201,162,39,.18);
}
.page-hero {
  background:
    linear-gradient(180deg, rgba(12,49,68,.55), rgba(12,49,68,.55)),
    url('https://healrestore-pllc.com/wp-content/uploads/2026/09/Warm-therapy-room.jpg') center/cover !important;
  color: #fff !important;
  min-height: 280px;
  display: flex;
  align-items: end;
}
.page-hero .hr-kicker { color: #e8c96a !important; }
.page-hero .hr-display { color: #fff !important; }
.hero::before {
  content: "";
  position: absolute;
  inset: -8%;
  background-image: inherit;
  background-size: cover;
  background-position: center;
  animation: hr-ken 22s ease-in-out infinite alternate;
  z-index: 0;
}
@keyframes hr-ken {
  from { transform: scale(1) translate3d(0,0,0); }
  to { transform: scale(1.08) translate3d(-1.5%, -1%, 0); }
}

.site-header {
  animation: hr-drop .7s ease both;
}
@keyframes hr-drop {
  from { opacity: 0; transform: translateY(-16px); }
  to { opacity: 1; transform: none; }
}

.hr-reveal {
  opacity: 0;
  transform: translateY(28px);
  animation: none;
  transition: opacity .85s ease, transform .85s ease;
  transition-delay: var(--hr-delay, 0ms);
}
.hr-reveal.is-in {
  opacity: 1;
  transform: none;
}

.hero-copy h1 {
  text-decoration: none;
  background-image: linear-gradient(#1488c4, #1488c4);
  background-repeat: no-repeat;
  background-position: 0 92%;
  background-size: 0 4px;
}
.hero-copy.is-in h1 {
  animation: hr-underline 1.1s .25s ease forwards;
}
@keyframes hr-underline {
  to { background-size: 100% 4px; }
}

.service-card, .pay-card, .state-card {
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.service-card:hover, .pay-card:hover, .state-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 18px 40px rgba(12,49,68,.16);
  border-color: #1488c4;
}

.hr-btn, .wpcf7-submit, a.hr-btn {
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.hr-btn:hover, .wpcf7-submit:hover, a.hr-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(20,136,196,.28);
}

.brand-logo img {
  transition: transform .35s ease;
}
.brand-logo:hover img {
  transform: scale(1.06);
}

@media (prefers-reduced-motion: reduce) {
  .hero::before, .site-header, .hr-reveal, .hero-copy h1 {
    animation: none !important;
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
    background-size: 100% 4px;
  }
}