:root{
    --teal:#19B8B0;
    --teal-deep:#0B5F59;
    --teal-2:#239DA7;
    --teal-darker:#08403C;
    --cream:#FCF8F5;
    --white:#FFFFFF;
    --ink:#4A3B39;
    --taupe:#6F5A58;
    --taupe-light:#8B736C;
    --gold:#C9A15C;
    --gold-light:#E4CFA0;
    --line: rgba(111,90,88,0.14);
    --shadow: 0 20px 50px -25px rgba(11,95,89,0.4);
  }
  *{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  body{
    margin:0;
    font-family:'Jost', sans-serif;
    color:var(--ink);
    background:var(--white);
    font-weight:300;
    line-height:1.7;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,h4{ font-family:'Cormorant Garamond', serif; font-weight:500; color:var(--teal-deep); margin:0; line-height:1.15; }
  p{ margin:0; }
  a{ color:inherit; text-decoration:none; }
  img{ max-width:100%; display:block; }
  .eyebrow{
    font-family:'Jost', sans-serif; font-size:0.75rem; letter-spacing:0.25em; text-transform:uppercase;
    color:var(--gold); font-weight:600; display:block; margin-bottom:10px;
  }
  .wrap{ max-width:1180px; margin:0 auto; padding:0 32px; }
  section{ position:relative; }

  /* ---------- top bar ---------- */
  .topbar{ background:linear-gradient(90deg, var(--teal-deep), var(--teal-2)); color:#fff; }
  .topbar .wrap{ display:flex; justify-content:space-between; align-items:center; padding:9px 32px; font-size:0.76rem; }
  .topbar .tb-left{ display:flex; gap:24px; flex-wrap:wrap; }
  .topbar a:hover{ color:var(--gold-light); }
  .topbar .tb-social{ display:flex; gap:12px; }
  .topbar .tb-social a{ width:24px; height:24px; border-radius:50%; border:1px solid rgba(255,255,255,0.4); display:flex; align-items:center; justify-content:center; color:#fff; }
  .topbar .tb-social a svg{ display:block; }

  /* ---------- header ---------- */
  header{ background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:100; }
  .header-row{
    display:grid; grid-template-columns:1fr auto 1fr; align-items:center;
    gap:24px; padding:14px 32px; max-width:1400px; margin:0 auto;
  }
  .header-logo{ display:flex; align-items:center; justify-self:start; }
  .header-logo img{ height:56px; width:auto; }
  nav.links{ display:flex; align-items:center; gap:30px; justify-self:center; flex-wrap:wrap; justify-content:center; }
  nav.links a{ font-size:0.85rem; letter-spacing:0.03em; color:var(--teal-deep); font-weight:500; position:relative; padding:4px 0; white-space:nowrap; }
  nav.links a::after{ content:''; position:absolute; left:0; bottom:-2px; width:0; height:2px; background:var(--gold); transition:width .25s ease; }
  nav.links a:hover::after{ width:100%; }
  .header-btns{ display:flex; align-items:center; gap:12px; justify-self:end; }
  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:12px 26px; border-radius:999px;
    font-size:0.8rem; letter-spacing:0.05em; font-weight:600; cursor:pointer; border:1.5px solid transparent;
    transition:transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease; white-space:nowrap;
  }
  .btn-teal{ background:linear-gradient(135deg, var(--teal), var(--teal-deep)); color:#fff; box-shadow:0 14px 26px -12px rgba(11,95,89,0.55); }
  .btn-teal:hover{ transform:translateY(-2px); }
  .btn-dark{ background:var(--ink); color:#fff; }
  .btn-dark:hover{ transform:translateY(-2px); }
  .btn-gold{ background:linear-gradient(135deg, var(--gold), #b8894a); color:#fff; box-shadow:0 12px 24px -12px rgba(201,161,92,0.65); }
  .btn-gold:hover{ transform:translateY(-2px); }
  .btn-outline{ border-color:var(--teal-deep); color:var(--teal-deep); background:transparent; }
  .btn-outline:hover{ background:var(--teal-deep); color:#fff; }
  .menu-toggle{ display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px; }
  .menu-toggle span{ width:24px; height:2px; background:var(--teal-deep); display:block; }

  /* ---------- hero (photo bg like reference) ---------- */
  .hero{
    position:relative; min-height:520px; display:flex; align-items:center; justify-content:center; text-align:center;
    background-image: linear-gradient(180deg, rgba(8,64,60,0.55), rgba(8,64,60,0.72)), url('../images/hero-bg.jpg');
    background-size:cover; background-position:center 30%; padding:90px 24px 60px; color:#fff;
  }
  .hero h1{
    font-size:clamp(2.4rem, 5vw, 3.8rem); font-style:italic; color:#fff; max-width:820px; margin:0 auto;
  }
  .hero .crumb{ margin-top:26px; font-size:0.85rem; color:rgba(255,255,255,0.85); }
  .hero .crumb a{ text-decoration:underline; }
  .hero-actions{ margin-top:30px; }

  /* ---------- quick links trio (like Virtual Tour / Event Inquiry / Gift Cards) ---------- */
  .quick-trio{ background:var(--white); }
  .quick-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; border-bottom:1px solid var(--line); }
  .quick-item{ padding:38px 32px; text-align:center; border-right:1px solid var(--line); }
  .quick-item:last-child{ border-right:none; }
  .quick-item h3{ font-size:1.3rem; font-style:italic; margin-bottom:8px; }
  .quick-item p{ color:var(--taupe); font-size:0.9rem; margin-bottom:16px; }
  .quick-item a{ font-size:0.78rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--teal-deep); font-weight:600; border-bottom:1px solid var(--teal-deep); padding-bottom:2px; }

  /* ---------- welcome section (photo + centered text like reference) ---------- */
  .welcome{ background:var(--cream); }
  .welcome-photo{ width:100%; height:340px; object-fit:cover; }
  .welcome-copy{ max-width:820px; margin:0 auto; text-align:center; padding:56px 32px 64px; }
  .welcome-copy h2{ font-size:clamp(1.9rem,3vw,2.6rem); font-style:italic; margin-bottom:20px; }
  .welcome-copy p{ color:var(--taupe); font-size:1.02rem; margin-bottom:24px; }

  /* ---------- alternating feature blocks (Programs, like Massage/Nail Bar sections) ---------- */
  .feature-block{ padding:80px 0; }
  .feature-grid{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
  .feature-block.reverse .feature-grid{ direction:rtl; }
  .feature-block.reverse .feature-grid > *{ direction:ltr; }
  .feature-photo{ width:100%; height:380px; object-fit:cover; border-radius:6px; box-shadow:var(--shadow); }
  .feature-text h2{ font-size:clamp(1.8rem,3vw,2.4rem); font-style:italic; margin-bottom:20px; }
  .feature-text p{ color:var(--taupe); font-size:1rem; margin-bottom:26px; }
  .feature-block:nth-child(odd){ background:var(--white); }
  .feature-block:nth-child(even){ background:var(--cream); }

  /* ---------- impact stat strip ---------- */
  #impact{
    background:linear-gradient(150deg, var(--teal-darker), var(--teal-deep) 60%, var(--teal-2));
    color:#fff; padding:80px 0; text-align:center;
  }
  #impact .eyebrow{ color:var(--gold-light); }
  #impact h2{ color:#fff; font-size:clamp(1.9rem,3vw,2.6rem); font-style:italic; margin-bottom:44px; }
  .impact-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; max-width:960px; margin:0 auto; }
  .impact-stat{ padding:28px 16px; border-radius:16px; background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.18); }
  .impact-stat b{ font-family:'Cormorant Garamond', serif; font-size:2.4rem; font-style:italic; color:var(--gold-light); display:block; }
  .impact-stat span{ font-size:0.7rem; letter-spacing:0.08em; text-transform:uppercase; color:rgba(255,255,255,0.8); margin-top:6px; display:block; }

  /* ---------- amenities-style icon grid (Ways to Give) ---------- */
  .amenities{ background:var(--white); padding:80px 0; text-align:center; }
  .amenities .section-head{ max-width:640px; margin:0 auto 50px; }
  .amenities h2{ font-size:clamp(1.9rem,3vw,2.6rem); font-style:italic; }
  .amenities p.sub{ color:var(--taupe); margin-top:14px; }
  .amen-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:20px; align-items:center; max-width:1000px; margin:0 auto; }
  .amen-item{ display:flex; flex-direction:column; align-items:center; gap:10px; }
  .amen-icon{ font-size:1.8rem; color:var(--teal-deep); }
  .amen-item h4{ font-family:'Jost',sans-serif; font-weight:600; font-size:0.85rem; color:var(--ink); }
  .amen-logo{ width:70px; height:auto; margin:0 auto; }
  @media (max-width:900px){ .amen-grid{ grid-template-columns:repeat(3,1fr); } .amen-logo{ grid-column:1/-1; order:-1; margin-bottom:10px; } }

  /* ---------- get involved cards ---------- */
  #get-involved{ background:var(--cream); padding:80px 0; }
  .section-head.center{ max-width:660px; margin:0 auto 50px; text-align:center; }
  .section-head.center h2{ font-size:clamp(1.9rem,3vw,2.6rem); font-style:italic; }
  .give-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
  .give-card{ background:#fff; border-radius:10px; padding:36px 30px; border:1px solid var(--line); display:flex; flex-direction:column; height:100%; }
  .give-card.featured{ background:linear-gradient(160deg, var(--teal), var(--teal-darker)); color:#fff; border:none; box-shadow:var(--shadow); }
  .give-card.featured h3{ color:#fff; }
  .give-card.featured p, .give-card.featured ul{ color:rgba(255,255,255,0.9); }
  .give-card h3{ font-size:1.35rem; font-style:italic; margin-bottom:12px; color:var(--teal-deep); }
  .give-card p{ color:var(--taupe); font-size:0.94rem; flex-grow:1; }
  .give-card .btn{ margin-top:24px; align-self:flex-start; }
  .give-card ul{ margin:16px 0 0; padding:0; list-style:none; font-size:0.88rem; color:var(--taupe); }
  .give-card ul li{ padding-left:20px; position:relative; margin-bottom:8px; }
  .give-card ul li::before{ content:''; position:absolute; left:0; top:9px; width:6px; height:6px; border-radius:50%; background:var(--gold); }

  /* ---------- FAQ accordion ---------- */
  #faq{ background:var(--white); padding:80px 0; }
  .faq-item{ border-bottom:1px solid var(--line); }
  .faq-q{
    width:100%; text-align:left; background:none; border:none; padding:22px 4px; cursor:pointer;
    display:flex; justify-content:space-between; align-items:center; gap:20px;
    font-family:'Jost',sans-serif; font-size:1.02rem; font-weight:500; color:var(--ink);
  }
  .faq-q .plus{ font-size:1.4rem; color:var(--teal-deep); flex-shrink:0; transition:transform .25s ease; }
  .faq-item.open .faq-q .plus{ transform:rotate(45deg); }
  .faq-a{ max-height:0; overflow:hidden; transition:max-height .3s ease; }
  .faq-a p{ padding:0 4px 22px; color:var(--taupe); font-size:0.94rem; }
  .faq-item.open .faq-a{ max-height:300px; }

  /* ---------- CTA banner ---------- */
  .cta-banner{
    background:linear-gradient(135deg, var(--teal-darker), var(--teal-deep));
    color:#fff; text-align:center; padding:64px 32px;
  }
  .cta-banner h2{ color:#fff; font-style:italic; font-size:clamp(1.8rem,3vw,2.4rem); margin-bottom:14px; }
  .cta-banner p{ color:rgba(255,255,255,0.85); margin-bottom:28px; }

  /* ---------- embedded forms (collapsible tabs) ---------- */
  .form-section{ padding:80px 0; background:var(--cream); }
  .form-section .wrap{ max-width:760px; }
  .give-tabs{
    background:#fff; border-radius:14px; border:1px solid var(--line); box-shadow:var(--shadow);
    overflow:hidden;
  }
  .give-tab-item{ border-bottom:1px solid var(--line); scroll-margin-top:110px; }
  .give-tab-item:last-child{ border-bottom:none; }
  .give-tab-q{
    width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px;
    padding:26px 28px; background:none; border:none; cursor:pointer; text-align:left;
    font-family:'Cormorant Garamond', serif; font-size:1.3rem; font-style:italic; color:var(--teal-deep); font-weight:500;
  }
  .give-tab-q .give-tab-sub{
    display:block; font-family:'Jost', sans-serif; font-style:normal; font-size:0.82rem;
    color:var(--taupe); font-weight:300; margin-top:4px; letter-spacing:0;
  }
  .give-tab-q .plus{ font-size:1.6rem; color:var(--gold); flex-shrink:0; transition:transform .25s ease; }
  .give-tab-item.open .give-tab-q .plus{ transform:rotate(45deg); }
  .give-tab-item.open .give-tab-q{ background:var(--cream); }
  .give-tab-a{ max-height:0; overflow:hidden; transition:max-height .35s ease; }
  .give-tab-item.open .give-tab-a{ max-height:1400px; }
  .give-tab-inner{ padding:0 28px 30px; }
  .give-tab-inner iframe{ display:block; width:100%; border:none; border-radius:8px; }

  /* ---------- footer ---------- */
  footer{ background:linear-gradient(160deg, var(--teal-darker), var(--teal-deep)); color:rgba(255,255,255,0.82); padding:60px 0 0; }
  .foot-top{ display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:40px; padding-bottom:40px; border-bottom:1px solid rgba(255,255,255,0.14); }
  .foot-logo img{ height:60px; width:auto; filter:brightness(0) invert(1); margin-bottom:16px; }
  .foot-disclaimer{ font-size:0.74rem; color:rgba(255,255,255,0.55); line-height:1.6; }
  .foot-disclaimer strong{ color:rgba(255,255,255,0.8); display:block; margin-top:10px; }
  footer h4{ color:#fff; font-family:'Jost', sans-serif; font-size:0.78rem; letter-spacing:0.1em; text-transform:uppercase; font-weight:600; margin-bottom:18px; }
  footer ul{ list-style:none; margin:0; padding:0; }
  footer ul li{ margin-bottom:12px; font-size:0.9rem; }
  footer ul li a:hover{ color:var(--gold-light); }
  .foot-social{ display:flex; gap:12px; flex-wrap:wrap; }
  .foot-social a{ width:32px; height:32px; border-radius:50%; border:1px solid rgba(255,255,255,0.35); display:flex; align-items:center; justify-content:center; color:#fff; }
  .foot-bottom{ display:flex; justify-content:space-between; align-items:center; padding:24px 0; font-size:0.8rem; color:rgba(255,255,255,0.55); flex-wrap:wrap; gap:10px; border-top:1px solid rgba(255,255,255,0.08); margin-top:24px; }
  .foot-bottom a:hover{ color:var(--gold-light); }

  @media (max-width: 900px){
    .header-row{ grid-template-columns:auto 1fr auto; padding:12px 20px; gap:12px; }
    .header-logo img{ height:44px; }
    nav.links{ display:none; }
    .menu-toggle{ display:flex; }
    .header-btns{ gap:10px; }
    .header-btns .btn{ padding:9px 16px; font-size:0.72rem; }
    .quick-grid{ grid-template-columns:1fr; }
    .quick-item{ border-right:none; border-bottom:1px solid var(--line); }
    .feature-grid{ grid-template-columns:1fr; }
    .feature-block.reverse .feature-grid{ direction:ltr; }
    .impact-stats{ grid-template-columns:repeat(2,1fr); }
    .amen-grid{ grid-template-columns:repeat(2,1fr); }
    .give-grid{ grid-template-columns:1fr; }
    .foot-top{ grid-template-columns:1fr; gap:32px; }
  }
  nav.links.open{
    display:flex; position:absolute; top:100%; left:0; right:0; background:#fff; flex-direction:column;
    padding:24px 32px; gap:18px; border-bottom:1px solid var(--line); z-index:50;
  }