:root{
  --black:#0B0B0B;
  --gold:#b47e11; 
  --grad:  linear-gradient(160deg, #a54e07, #b47e11, #fef1a2, #bc881b, #a54e07 );
  --purple:#4B2E83;
  --white:#FFFFFF;
  --bg:#0f0f10;
  --text:#f5f5f6;
  --muted:#979798;
  --card:#131316;
  --radius:14px;
  --shadow:0 10px 30px rgba(0,0,0,.35);
}
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,"Helvetica Neue",Arial,sans-serif;
  color:var(--text); background:linear-gradient(180deg,#0b0b0c,#0f0f10 60%);
  line-height:1.7;
  letter-spacing:0.3px;
}
h1,h2,h3{ font-family:"Playfair Display", Georgia, serif; line-height:1.3; letter-spacing:0.5px; }
h1{ font-size:clamp(2rem, 4.5vw, 5rem); margin:0 0 .25em;
  background: linear-gradient(
    180deg, #fef1a2, #bc881b, #a54e07, #a54e07
  );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  font-weight: 700;
}
h2{ font-size:clamp(1.4rem,2.5vw,2rem); margin:0 0 .75em;
  color: #b47e11;
  font-weight: 700;
}
h3{ font-size:clamp(1rem,2vw,1.5rem); margin:.5em 0 .75em;
  color: #b47e11;
  font-weight: 600;
}
.mt0{ margin-top:0; } .mt24{ margin-top:24px; }
.wrap{ width:min(100% - 80px, 1200px); margin:0 auto; }
.section{ padding:40px 0; }
.section:first-of-type{ padding-top:48px; }
.hero.wrap{ width:100%; max-width:none; padding:0; }
.site-header{ position:sticky; top:0; z-index:1000; background:var(--black); border-bottom:1px solid rgba(255,255,255,.06); padding: 0px 40px; }
.header__inner{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:0; max-width:100%; margin:0 auto; }
.brand{ display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--white); flex-shrink:0; justify-content:center; }
.brand img{ height:60px; width:auto; display:block; }
.brand__name{ font-size: 36px; font-weight:700; letter-spacing:.5px;
  background: linear-gradient(
    180deg, #fef1a2, #bc881b, #a54e07, #a54e07
  );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.nav{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; justify-content:center; }
.nav__toggle{ display:none; }
.nav a{ color:var(--text); text-decoration:none; padding:0px 0; border-radius:10px; transition:all 0.3s ease; position:relative; font-size:12px; white-space:nowrap; }
.nav a::after{ content:''; position:absolute; bottom:-2px; left:0; right:0; height:2px; background:var(--gold); transform:scaleX(0); transform-origin:right; transition:transform 0.3s ease; }
.nav a:hover{ color: #fef1a2; text-decoration:none; }
.nav a:hover::after{ transform:scaleX(1); transform-origin:left; }

.nav a[aria-current="page"]{ color: #b47e11; }
.nav a[aria-current="page"]::after{ transform:scaleX(1); }
.nav__toggle{ display:none; }
.site-footer{ background:var(--black); border-top:1px solid rgba(255,255,255,.06); margin-top:32px; }
.footer__inner{ padding:24px 0; display:grid; gap:16px; }
.footer__license,
.footer__meta{ color:var(--muted); }
.footer__grid{ display:grid; gap:16px; grid-template-columns:2fr 1fr 2fr; }
.footer__social{ display:flex; gap:12px; text-align: right;}
.hero{ background:
    linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.55)),
    url("../assets/hero-bg.png") center/cover no-repeat;
    padding:80px 40px 48px; display:grid; align-items:center; }
.hero .wrap{ display:flex; flex-direction:column; }
.hero__title{ padding: 0 10vw; color:var(--white); width: min(100%, 1300px); font-size:clamp(2.5rem, 5vw, 4.5rem); }
.hero__subtitle{  padding: 0 10vw; color: #fef1a2; margin:.75em 0 1.5em; font-size:clamp(1rem, 2vw, 1.3rem); }
.btn-row{  padding: 0 10vw; display:flex; flex-wrap:wrap; gap:12px; width:fit-content; }
.btn{ display:inline-flex; align-items:center; justify-content:center; padding:12px 18px; border-radius:10px; text-decoration:none; font-weight:600; border:1px solid transparent; box-shadow:var(--shadow); white-space: nowrap; }
/*toast*/
.form__toast { font-weight: 600; }
.form__toast.is-pending { opacity: 0.85; }
.form__toast.is-success { color: #1a7f37; } /* green */
.form__toast.is-error { color: #b42318; }   /* red */

/*headshot*/
.headshot{
  width: 150px;
  height: 150px;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 999px;       /* circle */
  border: 4px solid var(--gold);     /* pops on the gradient */
  box-shadow: white;
  display: block;
  margin: 0 auto 12px;        /* centered above the text */
}
/* Skeuomorphic Gold Button */
.btn--primary,
.button-18 {
  touch-action: manipulation;
  display: inline-block;
  outline: none;
  font-family: inherit;
  font-size: 1em;
  font-weight: 700; /* Bold text */
  text-transform: uppercase;
  box-sizing: border-box;
  
  border-radius: .3em;
  height: 2.75em;
  line-height: 2.5em;
  padding: 0 1em;
  cursor: pointer;
  transition: all .2s ease-in-out;

  box-shadow: 0 3px 6px rgba(0,0,0,.16), 0 3px 6px rgba(110,80,20,.4),
              inset 0 -2px 5px 1px rgba(139,66,8,1),
              inset 0 -1px 1px 3px rgba(250,227,133,1);
  background-image: linear-gradient(
    160deg, #a54e07, #b47e11, #fef1a2, #bc881b, #a54e07
  );
  border: 1px solid #a55d07;
  color: rgb(120,50,5);
  text-shadow: 0 2px 2px rgba(250, 227, 133, 1);
  background-size: 100% 100%;
  background-position: center;
}

.btn--primary:hover,
.btn--primary:focus,
.button-18:hover,
.button-18:focus {
  background-size: 150% 150%;
  box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23),
              inset 0 -2px 5px 1px #b17d10,
              inset 0 -1px 1px 3px rgba(250,227,133,1);
  border: 1px solid rgba(165,93,7,.6);
  color: rgba(120,50,5,.8);
}

.btn--primary:active,
.button-18:active {
  box-shadow: 0 3px 6px rgba(0,0,0,.16), 0 3px 6px rgba(110,80,20,.4),
              inset 0 -2px 5px 1px #b17d10,
              inset 0 -1px 1px 3px rgba(250,227,133,1);
}

.btn--ghost{ background:transparent; color:var(--text); border-color:rgba(255,255,255,.14); }
.btn:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }
.link{ color:var(--gold); text-decoration:none; border-bottom:2px solid var(--gold); transition:all 0.3s ease; }
.link:hover{ opacity:0.8; border-bottom-color:#fef1a2; }
.grid{ display:grid; gap:32px; } .grid--2{ grid-template-columns:1fr; }
.cards{ display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
.cards--wide{ grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); }
.card{ background:linear-gradient(180deg,rgba(200,167,74,.08),rgba(255,255,255,0) 60%),var(--card); border:1px solid rgba(200,167,74,.15); border-radius:var(--radius); padding:28px; box-shadow:var(--shadow); transition:all 0.3s ease; }
.card:hover{ border-color:rgba(200,167,74,.3); transform:translateY(-2px); box-shadow:0 15px 40px rgba(0,0,0,.4); }
.card--accent{ border-color:rgba(200,167,74,.25); background:linear-gradient(180deg,rgba(200,167,74,.08),rgba(255,255,255,0) 60%); padding:28px; }
.price{ font-size:1.6rem; font-weight:700; color:var(--gold); margin:.25em 0 0; }
.muted{ color:var(--muted); }
.list{ padding-left:18px; } .list li{ margin:.25em 0; }
.contact-preview .map-card{ background:var(--card); border:1px solid rgba(200,167,74,.15); border-radius:var(--radius); overflow:hidden; transition:all 0.3s ease; }
.contact-preview .map-card:hover{ border-color:rgba(200,167,74,.3); }
.contact-preview img{ display:block; width:100%; height:auto; }
.form{ display:grid; gap:12px; }
.form__row{ display:grid; gap:6px; }
.form input, .form textarea{ width:100%; padding:14px 16px; border-radius:10px; border:1px solid rgba(200,167,74,.2); background:#17171a; color:var(--text); transition:all 0.3s ease; font-family:inherit; }
.form input:focus, .form textarea:focus{ outline:none; border-color:rgba(200,167,74,.5); box-shadow:0 0 0 3px rgba(180,126,17,.08); }
.form button{ width:max-content; }
.form__note{ color:var(--gold) !important; font-size:.95rem; }
.form__toast{ margin-top:10px; color:#b3f7c1; }
/*.hp{ display:none !important; }*/
.accordion{ display:grid; gap:8px; }
.accordion__trigger{ width:100%; text-align:left; border-radius:12px; font-weight:800; color: black !important; }
.accordion__panel{ background:#111114; border:1px solid rgba(200,167,74,.15); border-radius:12px; padding:20px 24px; }
.skip-link{ position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }
.skip-link:focus{ position:static; width:auto; height:auto; padding:8px; background:var(--gold); color:#111; }
.hp {
  position: absolute;
  left: -9999px;
  top: -9999px;
}

/* Licensure Dropdown */
.licensure-panel {
  margin-top: 24px;
  padding: 24px;
  background: var(--card);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius);
  animation: slideDown 0.3s ease-out;
}

.licensure-panel[hidden] {
  display: none;
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (min-width: 860px){
  .grid--2{ grid-template-columns:1.1fr 1fr; }
  .grid--3{ grid-template-columns:1fr 2fr; }
  .grid--2.about-split{
    grid-template-columns: 2fr 1fr;
    align-items: start; }
  /*.footer__grid{ grid-template-columns: 2fr 1fr; }*/
  .header__inner{ padding:16px 0; }
  .hero{ padding:96px 40px 56px; }
}

@media (max-width: 900px){
  .nav{ display:none; }
  .nav__toggle{ display:inline-flex; align-items:center; justify-content:center; padding:8px 12px; border-radius:10px; border:1px solid rgba(255,255,255,.18); background:transparent; color:var(--text); cursor:pointer; transition:all 0.3s ease; font-size:20px; }
  .nav__toggle:hover{ border-color:rgba(200,167,74,.3); color:#fef1a2; }
  .nav--open{ display:flex; flex-direction:column; position:fixed; left:50%; transform:translateX(-50%); top:100px; background:#111114; padding:16px 12px; border-radius:12px; border:1px solid rgba(255,255,255,.12); gap:4px; min-width:200px; box-shadow:0 10px 40px rgba(0,0,0,.5); z-index:999; }
  .nav--open a{ padding:10px 12px; border-radius:8px; transition:all 0.3s ease; white-space:nowrap; }
  .nav--open a:hover{ background:rgba(200,167,74,.1); color:#fef1a2; }
  .header__inner{ gap:6px; }
  .brand__name{ font-size:24px; }

}

@media (max-width: 768px){
  .nav a{ font-size:12px; gap:12px; }
  .site-header{ padding:8px 20px; }
  .brand img{ height:50px; }
  .brand__name{ font-size:20px; }
  .hero__title{ font-size:clamp(2.2rem, 4vw, 3.5rem); }
}

@media (max-width: 1040px){
  .footer__grid{ display:grid; gap:16px; grid-template-columns:2fr 1fr; }
  .hero__title{ padding: 0 5vw;  }
  .hero__subtitle{  padding: 0 5vw;}
  .btn-row{  padding: 0 5vw;}
}

@media (max-width: 768px){
  .footer__grid{ grid-template-columns:1fr; }
}
@media (max-width: 740px){
  .hero__title{ color:var(--white); width: 80vw; } 
}
@media (max-width: 640px){
  .site-header{ padding:0 20px; }
  .header__inner{ gap:16px; }
  .brand img{ height:60px; }
  .brand__name{ font-size:18px; }
}

@media (max-width: 500px){
  .hero__title{ color:var(--white); width: 90vw; }
  h1{ font-size:clamp(1.5rem, 4vw, 3rem); margin:0 0 .25em; }
  .hero{ padding:72px 20px 48px; }
}

@media (max-width: 475px){
  .site-header{
    padding: 0px 16px;
  }
  .brand img{
    height: 45px;
  }
  .brand__name{
    font-size: 16px;
    white-space: nowrap;
  }
}
.hero .hero__copy{
  position: relative;
  z-index: 1;
  padding: 20px;
}

/* === Skeuomorphic text color + shadow in hero === */
.hero__title{
  background: linear-gradient(
    180deg, #a54e07, #b47e11, #fef1a2, #bc881b, #a54e07
  );
  -webkit-background-clip: text; /* for Safari/Chrome */
  background-clip: text;
  -webkit-text-fill-color: transparent; /* hides the original font color */
  color: transparent; /* fallback */
  font-weight: 800; /* optional: make it bold to look more metallic */
  
}
.hero__subtitle{
  color: #fff;
  text-shadow: 0 1px 4px rgba(0,0,0,.85);
}



/* === Reviews Slider === */
.review-slider{ position:relative; overflow:hidden; }
.review-slide{ display:none; }
.review-slide.active{ display:block; }
.review-nav{
  background: linear-gradient(180deg, #F6E27A 0%, #E0C35B 35%, #C8A74A 60%, #A8892F 100%);
  position:absolute; top:50%; transform:translateY(-50%);
  color:#111; 
  border:1px solid #9c7d27; 
  border-radius:50%;
  width:40px; 
  height:40px; 
  display:flex; 
  align-items:center; 
  justify-content:center;
  cursor:pointer;
  box-shadow:
    inset 0 2px 0 rgba(255,255,255,.35),
    inset 0 -3px 6px rgba(0,0,0,.25),
    0 6px 14px rgba(0,0,0,.35);
}
.review-nav.prev{ left: -4px; }
.review-nav.next{ right: -4px; }

/* Skeuomorphic gold border around each review tile */
.review-card{
  position:relative;
  padding:30px 60px;
  background:var(--card);
  border-radius:16px;
  height: 200px;
  
  border:1px solid var(--gold);
  box-shadow:
    inset 0 2px 8px rgba(255,255,255,.06),
    inset 0 -3px 10px rgba(0,0,0,.35),
    0 10px 26px rgba(0,0,0,.35);
  
  display: flex;
  flex-direction: column;
  justify-content: center; /* vertically centers the content */

}
.review-card blockquote{ margin:0 0 .5rem; }
.review-card .reviewer{ color:var(--gold); margin:.25rem 0 0; }
.review-card .review-source{ color:var(--muted); font-size:.9rem; margin:.15rem 0 0; }

@media (max-width: 1024px){
  .review-card{
    line-height: 1.5;
  }
}

@media (max-width: 860px){
  .review-card{
    font-size: 0.9rem;
    padding: 24px 40px;
  }
  .review-card blockquote p{
    font-size: 0.9rem;
  }
}

@media (max-width: 768px){
  .review-card{
    height: 240px;
  }
}

@media (max-width: 425px){
  .review-card{
    height: 260px;
  }
}

/* keep buttons in front of content */
.review-slider .review-nav{ z-index:5; }



/* === Availability card skeuomorphic gold background === */
.card--accent.availability{
  background: linear-gradient(180deg, #F6E27A 0%, #E0C35B 35%, #C8A74A 60%, #A8892F 100%);
  
  border:2px solid var(--gold);
  box-shadow:
    inset 0 2px 0 rgba(255,255,255,.35),
    inset 0 -3px 6px rgba(0,0,0,.25),
    0 6px 14px rgba(0,0,0,.35);
}
.card--accent.availability h3,
.card--accent.availability ul{   color: black !important; }

.card--accent.availability a{   color: rgba(120,50,5,.8) !important; }

/* === Services & Pricing cards gold outline === */
.cards .card.service-card{
  border: 5px solid transparent; /* must set border width */
  border-radius: 14px; 
  border-image: linear-gradient(
    160deg,
    #a54e07,
    #b47e11,
    #fef1a2,
    #bc881b,
    #a54e07
  ) 1;  
  
  box-shadow:
    inset 0 2px 0 rgba(255,255,255,.25),
    inset 0 -2px 6px rgba(0,0,0,.25),
    0 6px 14px rgba(0,0,0,.35);
}



/* === Skeuomorphic solid gold panel (Availability) === */
.card--skeuo{
  color:#111;
  background: linear-gradient(180deg, #F6E27A 0%, #E0C35B 35%, #C8A74A 60%, #A8892F 100%);
  border:1px solid #9c7d27;
  box-shadow:
    inset 0 2px 0 rgba(255,255,255,.35),
    inset 0 -4px 8px rgba(0,0,0,.25),
    0 10px 24px rgba(0,0,0,.35);
}
.card--skeuo h3, .card--skeuo .list li { color:#111; }
.card--skeuo .btn{ box-shadow:none; }

/* === Thicker gold outline style for tiles (services) and map card === */
.card--gold-outline, .map-card{
  border:2.5px solid #9c7d27 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.28),
    0 8px 22px rgba(0,0,0,.35);
}
.card--gold-outline h2,
.card--gold-outline h3{
  color: #fff;
}
/* Ensure service cards use the gold outline */
.cards .card{ /* default card stays, we'll add a stronger border for services section below */ }
.services-tiles .card{ border-width:2.5px; border-color:#9c7d27; }

/* === Centered link list (Services page only) === */
/* === Centered link list (Services page only) === */
.centered-links{
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 14px;
}

.centered-links li{
  margin: 0;
}

/* FORCE gold link color */
.centered-links li a{
  color: var(--gold);
  text-decoration: none;
  font-weight: 500;
}

.centered-links li a:hover{
  color: var(--gold);
  text-decoration: underline;
  opacity: .9;
}

/* === Memberships page: Terms layout polish === */
.terms-grid{
  display: grid;
  gap: 18px;
}

.terms-block{
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px;
  padding: 14px;
  background: rgba(0,0,0,0.12);
}

.terms-list{
  margin-top: 10px;
}

/* On desktop, show side-by-side and keep height reasonable */
@media (min-width: 860px){
  .terms-grid{
    grid-template-columns: 1fr 1fr;
    align-items: start;
  }

  /* optional: make long terms feel less overwhelming */
  .terms-block{
    max-height: 420px;
    overflow: auto;
  }
}
