/* ============================================================
   Rise Somatic Therapy — design tokens
   Palette + type pulled directly from Marie's existing brochure:
   deep teal, warm cream, soft gold, an arch/circle motif.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400;1,9..144,500&family=Inter:wght@400;500;600&display=swap');

:root{
  --teal-900:#0e3a3d;
  --teal-800:#134548;
  --teal-700:#1c565a;
  --cream-50:#f4efe6;
  --cream-100:#ece3d3;
  --gold-500:#b3893f;
  --gold-300:#d8bd88;
  --ink-900:#1e2624;
  --ink-600:#4b5654;
  --white:#ffffff;

  --font-display:'Fraunces', Georgia, serif;
  --font-body:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --max-w:1120px;
  --radius-arch: 999px 999px 24px 24px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--cream-50);
  color:var(--ink-900);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;}
h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:500;
  line-height:1.15;
  margin:0 0 0.5em;
  color:var(--teal-900);
}
h1{font-size:clamp(2.4rem,4.2vw,3.6rem); font-weight:400;}
h2{font-size:clamp(1.7rem,2.8vw,2.3rem);}
h3{font-size:1.25rem;}
p{margin:0 0 1.1em; max-width:62ch;}
.eyebrow{
  font-family:var(--font-display);
  font-style:italic;
  color:var(--gold-500);
  font-size:1.05rem;
  margin:0 0 0.4em;
  display:block;
}
.container{max-width:var(--max-w); margin:0 auto; padding:0 28px;}
.visually-hidden{
  position:absolute; width:1px; height:1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap;
}
:focus-visible{outline:3px solid var(--gold-500); outline-offset:3px;}

/* ---------- header / nav ---------- */
.site-header{
  position:sticky; top:0; z-index:40;
  background:var(--cream-50);
  border-bottom:1px solid var(--cream-100);
}
.nav-row{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 28px;
  max-width:var(--max-w); margin:0 auto;
}
.logo{
  font-family:var(--font-display);
  font-style:italic;
  font-size:1.9rem;
  color:var(--teal-900);
  text-decoration:none;
  letter-spacing:0.5px;
}
.logo small{
  display:block;
  font-family:var(--font-body);
  font-style:normal;
  font-size:0.55rem;
  letter-spacing:3px;
  color:var(--gold-500);
  margin-top:-4px;
}
.logo-header{display:inline-flex; align-items:center;}
.logo-header img{height:52px; width:auto; display:block;}
.logo-footer img{height:66px;}
.nav-links{
  display:flex; align-items:center; list-style:none; margin:0; padding:0;
  font-size:0.95rem;
}
.nav-links li{margin-left:28px;}
.nav-links li:first-child{margin-left:0;}
.nav-links a{
  text-decoration:none;
  color:var(--ink-900);
  position:relative;
  padding-bottom:4px;
  transition:color .2s ease;
}
.nav-links a::after{
  content:"";
}
.nav-links a:not(.nav-cta)::after{
  position:absolute; left:0; right:100%; bottom:-2px; height:2px; background:var(--gold-500);
  transition:right .25s ease;
}
.nav-links a:not(.nav-cta):hover::after{right:0;}
.nav-links a[aria-current="page"]:not(.nav-cta){color:var(--teal-900); font-weight:600;}
.nav-links a[aria-current="page"]:not(.nav-cta)::after{right:0;}
.nav-cta{
  background:var(--teal-900); color:var(--white)!important;
  height:55px; padding:0 24px; border-radius:999px; text-decoration:none;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:0.9rem; font-weight:600; white-space:nowrap;
  transition:background .2s ease, transform .2s ease;
}
.nav-cta:hover{background:var(--teal-700); transform:translateY(-1px);}
.nav-toggle{display:none;}

@media (max-width:820px){
  .logo-header img{height:42px;}
  .nav-links{
    position:fixed; top:64px; left:0; right:0; bottom:0; background:var(--cream-50);
    flex-direction:column; align-items:flex-start; padding:32px 28px; font-size:1.1rem;
    transform:translateX(100%); transition:transform .3s ease;
  }
  .nav-links li{margin-left:0; margin-bottom:22px;}
  .nav-links.open{transform:translateX(0);}
  .nav-toggle{
    display:block; background:none; border:none; cursor:pointer;
    width:34px; height:24px; position:relative;
  }
  .nav-toggle span, .nav-toggle::before, .nav-toggle::after{
    content:""; position:absolute; left:0; right:0; height:2px; background:var(--teal-900);
  }
  .nav-toggle::before{top:0;}
  .nav-toggle span{top:11px;}
  .nav-toggle::after{bottom:0;}
}

/* ---------- hero ---------- */
.hero{
  padding:64px 0 80px;
}
.hero-grid{
  display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px; align-items:center;
}
.hero-copy p.lead{font-size:1.15rem; color:var(--ink-600);}
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:14px 28px; border-radius:999px;
  font-weight:600; font-size:0.98rem; text-decoration:none;
  border:1px solid transparent;
  transition:background .22s ease, color .22s ease, transform .22s ease, border-color .22s ease;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--teal-900); color:var(--white);}
.btn-primary:hover{background:var(--teal-700);}
.btn-ghost{border-color:var(--teal-900); color:var(--teal-900);}
.btn-ghost:hover{background:var(--teal-900); color:var(--white);}
.btn-row{display:flex; gap:16px; flex-wrap:wrap; margin-top:28px;}

.arch-frame{
  background:var(--teal-900);
  border-radius:var(--radius-arch);
  aspect-ratio:3/4;
  display:flex; align-items:center; justify-content:center;
  padding:36px;
  position:relative;
  overflow:hidden;
}
.arch-frame svg{width:100%; height:100%;}
.arch-frame img{width:100%; height:100%; object-fit:cover;}

.photo-frame{
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 24px 48px -24px rgba(14,58,61,0.35);
  height:480px;
}
.photo-frame img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 18%;
  border-radius:20px;
}
.story-grid{
  display:grid;
  grid-template-columns:1.35fr 0.85fr;
  gap:56px;
  align-items:start;
}
.story-grid .photo-frame{
  height:420px;
}

/* ---------- photo hero (homepage) ---------- */
.hero-photo{
  position:relative;
  height:min(760px, 86vh);
  min-height:420px;
  display:flex;
  align-items:center;
  overflow:hidden;
  color:var(--white);
}
.hero-photo-bg{
  position:absolute; top:0; left:0; right:0; bottom:0;
  width:100%; height:100%;
  object-fit:cover;
  object-position:center 40%;
  background:var(--teal-900);
}
.hero-photo-overlay{
  position:absolute; top:0; left:0; right:0; bottom:0;
  background:linear-gradient(100deg, rgba(9,26,28,.90) 0%, rgba(11,40,42,.82) 30%, rgba(14,58,61,.42) 56%, rgba(14,58,61,.12) 82%);
}
.hero-photo-content{position:relative; z-index:2; max-width:790px; padding-top:96px; padding-bottom:88px; text-align:left; margin-right:auto; margin-left:10%;}
.hero-photo-content p{max-width:none;}
.hero-photo .eyebrow{color:var(--gold-300);}
.hero-photo h1{color:var(--white); font-weight:400;}
.hero-photo p.lead{color:var(--cream-100); font-size:1.18rem;}
.hero-photo p{color:var(--cream-100);}
.hero-arch-edge{
  position:absolute; left:0; right:0; bottom:-2px; z-index:3; line-height:0;
}
.hero-arch-edge svg{width:100%; height:64px; display:block;}
.hero-scroll-cue{
  position:absolute; right:28px; bottom:34px; z-index:3;
  display:flex; align-items:center; gap:10px;
  font-size:0.78rem; letter-spacing:2px; color:var(--cream-100);
  writing-mode:vertical-rl;
}
.hero-scroll-cue::after{
  content:""; width:1px; height:46px; background:var(--gold-300);
}
@media (max-width:820px){
  .hero-scroll-cue{display:none;}
  .hero-photo{min-height:auto;}
  .hero-photo-content{padding-top:80px; padding-bottom:56px;}
}

/* ---------- sections ---------- */
section{padding:72px 0;}
.section-alt{background:var(--white);}
.section-teal{background:var(--teal-900); color:var(--cream-50);}
.section-teal h2, .section-teal h3{color:var(--white);}
.section-teal .eyebrow{color:var(--gold-300);}
.section-teal p{color:var(--cream-100);}

.two-col{display:grid; grid-template-columns:0.8fr 1.2fr; gap:56px;}
.center-head{text-align:center; max-width:640px; margin:0 auto 44px;}
.center-head p{margin-left:auto; margin-right:auto;}

.card{
  background:var(--white);
  border:1px solid var(--cream-100);
  border-radius:20px;
  padding:32px;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.card:hover{transform:translateY(-5px); box-shadow:0 18px 34px -22px rgba(14,58,61,0.35); border-color:var(--gold-300);}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.grid-2{display:grid; grid-template-columns:repeat(2,1fr); gap:24px;}

.approach-list{list-style:none; margin:0; padding:0; display:grid; gap:22px;}
.approach-list li{
  border-bottom:1px solid var(--cream-100);
  padding-bottom:22px;
}
.approach-list h3{margin-bottom:6px;}
.approach-list .tag{
  font-size:0.78rem; letter-spacing:1px; color:var(--gold-500); font-weight:600;
}

.focus-grid{display:grid; grid-template-columns:1fr 1fr; gap:48px;}
.focus-list{list-style:none; margin:0; padding:0; display:grid; gap:12px;}
.focus-list li{
  position:relative;
  padding:4px 0 4px 20px;
}
.focus-list li::before{
  content:"";
  position:absolute; left:0; top:12px;
  width:8px; height:8px;
  background:var(--gold-500); border-radius:50%;
}

.quote-card{
  position:relative;
  background:var(--white);
  border-radius:4px 24px 4px 24px;
  padding:38px 32px 28px;
  transition:transform .25s ease, box-shadow .25s ease;
}
.quote-card:hover{transform:translateY(-4px); box-shadow:0 18px 34px -22px rgba(14,58,61,0.3);}
.quote-card::before{
  content:"\201C";
  font-family:var(--font-display);
  font-style:italic;
  font-size:3.6rem;
  line-height:1;
  color:var(--gold-500);
  display:block;
  margin-bottom:4px;
}
.quote-card p{font-family:var(--font-display); font-size:1.12rem; font-style:italic; color:var(--teal-900); font-weight:400;}
.quote-card cite{
  font-style:normal; font-size:0.85rem; color:var(--ink-600); display:block;
  margin-top:16px; padding-top:14px; border-top:1px solid var(--cream-100);
}

/* dark variant used on teal-background sections so text stays legible */
.quote-card--dark{background:var(--teal-800);}
.quote-card--dark::before{color:var(--gold-300);}
.quote-card--dark p{color:var(--cream-50);}
.quote-card--dark cite{color:var(--gold-300); border-top-color:var(--teal-700);}

.disclaimer-note{
  font-size:0.85rem; color:var(--ink-600);
  border:1px dashed var(--gold-300);
  background:var(--cream-50);
  border-radius:12px; padding:16px 18px;
  max-width:none;
}

.cta-band{
  position:relative;
  background:var(--teal-900); color:var(--white);
  padding:88px 0 76px; text-align:center;
}
.cta-band h2{color:var(--white); max-width:520px; margin:0 auto 0.5em;}
.cta-band p{color:var(--cream-100); max-width:520px; margin:0 auto 1.1em;}
.cta-banner{ /* used for teal-section CTA content blocks */
  text-align:center;
}
.cta-banner h2{color:var(--white); max-width:520px; margin-left:auto; margin-right:auto;}
.cta-banner p{color:var(--cream-100); max-width:520px; margin-left:auto; margin-right:auto;}

/* reusable arch transition between a light section and a teal section */
.arch-divider{position:relative; line-height:0;}
.arch-divider svg{width:100%; height:48px; display:block; position:relative; top:1px;}
section.section-teal{position:relative;}

.contact-grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:56px;}
.contact-item{display:flex; gap:16px; align-items:flex-start; margin-bottom:22px;}
.contact-item .icon{
  width:42px; height:42px; border-radius:50%; background:var(--teal-900);
  display:flex; align-items:center; justify-content:center; flex:none;
}
.contact-item .icon svg{width:20px; height:20px; stroke:var(--white);}
.contact-item a{text-decoration:none; font-weight:600; color:var(--teal-900);}

.crisis-strip{
  background:var(--cream-100);
  border-top:1px solid var(--gold-300);
  border-bottom:1px solid var(--gold-300);
  padding:14px 0;
  font-size:0.88rem;
  text-align:center;
}
.crisis-strip strong{color:var(--teal-900);}
.crisis-strip a{color:var(--teal-900); text-decoration:underline;}

/* ---------- footer ---------- */
footer{
  background:var(--teal-900); color:var(--cream-100);
  padding:48px 0 28px; font-size:0.9rem;
}
.footer-grid{
  display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:32px;
  margin-bottom:32px;
}
footer h4{color:var(--white); font-family:var(--font-body); font-weight:600; font-size:0.85rem; letter-spacing:1px; margin-bottom:14px;}
footer ul{list-style:none; margin:0; padding:0; display:grid; gap:8px;}
footer a{text-decoration:none; color:var(--cream-100);}
footer a:hover{color:var(--gold-300);}
.footer-bottom{
  border-top:1px solid var(--teal-700);
  padding-top:20px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
  font-size:0.8rem; color:var(--gold-300);
}

/* ---------- policy pages ---------- */
.policy-body h2{margin-top:2em;}
.policy-body{max-width:74ch; margin:0 auto;}
.policy-body ul{padding-left:1.2em;}
.updated-note{color:var(--ink-600); font-size:0.9rem;}

@media (max-width:900px){
  .hero-grid, .two-col, .focus-grid, .contact-grid, .story-grid{grid-template-columns:1fr;}
  .photo-frame{height:340px;}
  .story-grid .photo-frame{height:320px; order:-1;}
  .grid-3{grid-template-columns:1fr 1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .cta-banner{margin:0 16px; padding:40px 24px;}
}
@media (max-width:560px){
  .grid-3, .grid-2{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;}
  section{padding:52px 0;}
}

/* ---------- animation: hero load-in ---------- */
@keyframes heroFadeUp{
  from{opacity:0; transform:translateY(22px);}
  to{opacity:1; transform:translateY(0);}
}
.hero-photo-content > *{
  opacity:0;
  animation:heroFadeUp .8s ease forwards;
}
.hero-photo-content > *:nth-child(1){animation-delay:.05s;}
.hero-photo-content > *:nth-child(2){animation-delay:.18s;}
.hero-photo-content > *:nth-child(3){animation-delay:.30s;}
.hero-photo-content > *:nth-child(4){animation-delay:.42s;}
.hero-photo-content > *:nth-child(5){animation-delay:.54s;}
.logo{transition:opacity .2s ease;}

/* ---------- animation: scroll reveal ---------- */
.reveal{
  opacity:0;
  transform:translateY(26px);
  transition:opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1);
}
.reveal.is-visible{opacity:1; transform:translateY(0);}

@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1!important; transform:none!important; transition:none!important;}
  .hero-photo-content > *{opacity:1!important; animation:none!important;}
  .btn:hover{transform:none;}
  .card:hover, .quote-card:hover{transform:none;}
  html{scroll-behavior:auto;}
}

/* ---------- cookie consent banner ---------- */
.cookie-banner{
  position:fixed; left:20px; right:20px; bottom:20px; z-index:60;
  max-width:520px; margin:0 auto;
  background:var(--teal-900); color:var(--cream-50);
  border-radius:16px; padding:22px 24px;
  box-shadow:0 20px 44px -18px rgba(0,0,0,0.45);
  transform:translateY(140%); transition:transform .45s ease;
}
.cookie-banner.is-visible{transform:translateY(0);}
.cookie-banner p{color:var(--cream-100); font-size:0.9rem; margin:0 0 14px;}
.cookie-banner a{color:var(--gold-300); text-decoration:underline;}
.cookie-actions{display:flex; gap:12px; flex-wrap:wrap;}
.cookie-actions button{
  border:none; cursor:pointer; font-family:var(--font-body); font-weight:600;
  font-size:0.86rem; padding:10px 18px; border-radius:999px;
  transition:transform .2s ease, opacity .2s ease;
}
.cookie-actions button:hover{transform:translateY(-1px);}
.cookie-accept{background:var(--gold-500); color:var(--teal-900);}
.cookie-decline{background:transparent; color:var(--cream-100); border:1px solid var(--teal-700)!important;}
@media (max-width:560px){
  .cookie-banner{left:12px; right:12px; bottom:12px; padding:18px 20px;}
}
