@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=DM+Serif+Display:ital@0;1&display=swap');
:root{--navy:#253C50;--navy2:#172f42;--ivory:#faf3e6;--cream:#f3e7d3;--gold:#e9b54f;--wine:#813d4d;--green:#426f5a;--coral:#e39530;--ink:#243947}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ivory);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;line-height:1.6}h1,h2,h3,blockquote{font-family:'DM Serif Display',Georgia,serif;font-weight:400;line-height:1.08}h1{font-size:clamp(3rem, 5vw, 4.5rem);letter-spacing:-.045em;margin:20px 0 28px}h2{font-size:clamp(2.8rem,5vw,5.2rem);letter-spacing:-.035em;margin:12px 0 25px}h3{font-size:1.85rem;margin:0 0 10px}em{font-weight:400}a{color:inherit}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:4px}.skip{position:absolute;top:-100px;left:20px;background:white;z-index:20}.skip:focus{top:10px}.site-header{background:var(--ivory);display:flex;align-items:center;justify-content:space-between;padding:20px clamp(22px,5vw,90px);position:relative;z-index:10;border-bottom:1px solid #dfd4c3}.brand{font-family:'DM Serif Display',Georgia,serif;font-size:1.65rem;text-decoration:none;line-height:1}.brand span{display:block;font:600 .65rem 'DM Sans',sans-serif;text-transform:uppercase;letter-spacing:.18em;margin-top:8px}.site-header nav{display:flex;align-items:center;gap:clamp(15px,2vw,35px)}nav a{font-size:.85rem;text-decoration:none;font-weight:700}nav a:hover,.text-link:hover,.quiet-link:hover{text-decoration:underline}.nav-cta{background:var(--wine);color:white;padding:12px 20px;border-radius:4px}.menu-toggle{display:none}.hero{min-height:680px;background:var(--navy);color:var(--ivory);display:grid;grid-template-columns:1.1fr .9fr;overflow:hidden}.hero-copy{padding:clamp(60px,7vw,130px) 5vw 90px max(5vw,calc((100vw - 1450px)/2));position:relative;z-index:2}.eyebrow,.section-number{font-size:.73rem;font-weight:700;letter-spacing:.19em;text-transform:uppercase}.hero .eyebrow{color:var(--gold)}.lead{max-width:580px;font-size:1.17rem;line-height:1.8}.actions{display:flex;align-items:center;gap:28px;flex-wrap:wrap;margin-top:35px}.button{display:inline-flex;gap:25px;align-items:center;text-decoration:none;font-size:.86rem;font-weight:700;padding:17px 23px;border-radius:3px}.gold{background:var(--gold);color:var(--navy2)}.button:hover{filter:brightness(1.07);transform:translateY(-2px)}.quiet-link{font-size:.85rem;text-decoration:none;font-weight:700}.hero-art{position:relative;background:#2c5260;min-height:610px;overflow:hidden;border-left:10px solid #d0a65b}.hero-art:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0,transparent 90px,#ffffff08 91px,#ffffff08 92px)}.sun{position:absolute;width:250px;height:250px;border-radius:50%;background:#efbd68;top:7%;right:4%;filter:blur(1px)}.frame{position:absolute;border:12px solid #b88d52;box-shadow:5px 8px 0 #132f39;z-index:1}.frame-one{width:155px;height:200px;top:13%;left:10%;background:#ead7ae;transform:rotate(-7deg);display:grid;place-items:center}.flower{font-size:115px;color:#ad4f4b}.frame-two{width:155px;height:150px;top:20%;right:9%;background:#a3bd9d;transform:rotate(7deg);overflow:hidden}.hill{background:#4b7961;border-radius:50% 50% 0 0;position:absolute;width:190px;height:100px;bottom:-20px;left:-20px}.chair{position:absolute;bottom:12%;left:26%;width:270px;height:310px;z-index:3}.chair-back{position:absolute;width:235px;height:215px;background:#873c51;border-radius:105px 105px 30px 30px;left:17px;top:0;box-shadow:inset -25px -14px 0 #6e2f45,7px 10px 0 #2b2632}.chair-seat{position:absolute;top:180px;width:270px;height:76px;background:#9b4a5b;border-radius:30px;box-shadow:inset -10px -12px 0 #713347}.chair-leg{position:absolute;top:248px;width:15px;height:70px;background:#c89a55}.chair-leg.left{left:30px;transform:rotate(8deg)}.chair-leg.right{right:35px;transform:rotate(-8deg)}.rug{position:absolute;bottom:-65px;left:8%;width:90%;height:180px;background:#d69c70;border-radius:50%;transform:rotate(-8deg);z-index:1;border:15px solid #e2b68a}.table{position:absolute;bottom:13%;right:9%;width:100px;height:12px;background:#c69a60;z-index:4;box-shadow:0 55px 0 -2px #a27b4e}.table:after{content:'';position:absolute;width:11px;height:100px;left:44px;background:#c69a60}.plant{position:absolute;bottom:20%;right:6%;height:240px;width:120px;z-index:5}.plant:after{content:'';position:absolute;bottom:-35px;left:36px;width:80px;height:85px;background:#c98857;clip-path:polygon(0 0,100% 0,80% 100%,20% 100%)}.plant i{position:absolute;bottom:50px;left:75px;width:35px;height:110px;background:#477c56;border-radius:100% 0 100% 0;transform-origin:bottom left}.plant i:nth-child(1){transform:rotate(-70deg)}.plant i:nth-child(2){transform:rotate(-42deg)}.plant i:nth-child(3){transform:rotate(-18deg)}.plant i:nth-child(4){transform:rotate(12deg)}.plant i:nth-child(5){transform:rotate(35deg)}.plant i:nth-child(6){transform:rotate(60deg)}.plant i:nth-child(7){transform:rotate(85deg)}.art-caption{position:absolute;bottom:15px;right:20px;font-size:.67rem;letter-spacing:.08em;color:white;z-index:6}.section{padding:110px max(5vw,calc((100vw - 1450px)/2))}.intro{display:grid;grid-template-columns:.45fr 1.5fr 1fr;gap:60px;align-items:start}.intro p,.section-heading p{font-size:1.05rem;max-width:670px}.section-number{color:#B75E37;;padding-top:25px}.text-link{display:inline-block;margin-top:16px;color:var(--wine);font-weight:700;text-decoration:none}.intro-quote{background:#41624B;;color:white;padding:35px;transform:rotate(2deg);margin-top:55px}.intro-quote blockquote{font-size:2rem;margin:15px 0}.asterisk{font-size:3rem;color:var(--gold)}.approach{background:var(--cream)}.section-heading{max-width:800px;margin-bottom:40px}.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.tile{min-height:300px;padding:35px;display:flex;flex-direction:column;justify-content:end}.tile p{margin:0}.tile-icon{font-size:3rem;margin-bottom:auto}.tile.green{background:var(--green);color:white}.tile.cream{background:#f8efdf;color:var(--ink)}.tile.coral{background:var(--coral);color:#2d3033}.services{background:var(--ivory)}.service-list{border-top:2px solid var(--navy)}.service-list>div{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 5px;border-bottom:1px solid #cfc5b7}.service-list h3{font-size:1.6rem;margin-bottom:3px}.service-list p{margin:0;color:#53616a;font-size:.9rem}.service-list strong{font-family:'DM Serif Display',serif;font-size:2rem;font-weight:400}.service-note,.small-note{font-size:.82rem;color:#52626b}.faq{background:#D9DFC9}.questions{max-width:900px}.questions details{border-top:1px solid #a9b6aa;padding:18px 0}.questions details:last-child{border-bottom:1px solid #a9b6aa}.questions summary{font-family:'DM Serif Display',serif;font-size:1.65rem;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px}.questions summary:after{content:'+';font-family:'DM Sans',sans-serif}.questions details[open] summary:after{content:'−'}.questions details p{max-width:650px}.contact{background:var(--wine);color:white;position:relative;overflow:hidden}.contact h2{font-size:clamp(3rem,6vw,6rem);max-width:900px}.contact>p:not(.eyebrow){max-width:600px}.contact .small-note{color:#f4dce0;margin-top:28px}.contact-spark{position:absolute;right:10%;top:40px;font-size:16rem;color:#ffffff15}footer{background:var(--navy2);color:white;padding:50px 5vw;display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;font-size:.85rem}footer p{margin:5px 0;color:#d0dce0}footer a{color:white}.footer-note{width:100%;border-top:1px solid #ffffff3b;padding-top:20px;font-size:.73rem}@media(max-width:1000px){.hero{grid-template-columns:1fr}.hero-copy{padding:65px 6vw}.hero-art{min-height:440px;border-left:0;border-top:8px solid #d0a65b}.intro{grid-template-columns:1fr 2fr}.intro-quote{grid-column:2;margin-top:0}.tiles{grid-template-columns:1fr 1fr}.tile:last-child{grid-column:1/-1}}@media(max-width:700px){.site-header{padding:18px 22px}.menu-toggle{display:block;border:0;background:none;color:var(--navy);font-size:1.7rem;cursor:pointer}.site-header nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--ivory);padding:20px 25px;flex-direction:column;align-items:stretch;box-shadow:0 8px 15px #0002}.site-header nav.open{display:flex}.hero-copy{padding:65px 25px}h1{font-size:clamp(3.5rem,12vw,5rem)}.hero-art{min-height:390px}.section{padding:75px 25px}.intro{grid-template-columns:1fr;gap:15px}.intro-quote{grid-column:auto;margin-top:20px}.tiles{grid-template-columns:1fr}.tile:last-child{grid-column:auto}.tile{min-height:260px}.service-list h3{font-size:1.3rem}.service-list strong{font-size:1.55rem}.art-caption{display:none}}

/* Homepage photo booth portrait */

.hero-photo-container {
  background-color: #41624B;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 24px;
}

.hero-photo {
  display: block;
  width: 100%;
  max-width: 550px;
  height: auto;
  object-fit: contain;
}
/* WALK-AND-TALK THERAPY SECTION */

.walk-talk {
  background-color: #f7f1e6;
  padding: 55px 6% 25px;
}

.walk-talk-content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 60px;
  max-width: 1200px;
  margin: 0 auto;
}

.walk-talk-text h2 {
  color: #203d50;
  font-size: clamp(2rem, 3.5vw, 3.5rem);
  line-height: 1.15;
}

.walk-talk-text p {
  color: #385650;
  line-height: 1.8;
}

.walk-talk-image img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  border: 12px solid #fffaf2;
  box-shadow: 12px 12px 0 #d7a64d;
}

/* Make it fit on phones */
@media (max-width: 768px) {
  .walk-talk-content {
    grid-template-columns: 1fr;
    gap: 35px;
  }

  .walk-talk-image img {
    height: auto;
  }
}/* Large decorative cempasúchil on About section */

#about {
  position: relative;
  overflow: hidden;
}

#about::before {
  content: "";
  position: absolute;

  width: 420px;
  height: 670px;

  left: 0;
  top: 160px;

  background-image: url("images/cempasuchil.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;

  transform: translateX(-35%);

  pointer-events: none;
  z-index: 0;
}
#about > * {
  position: relative;
  z-index: 1;
  }
  /* ECLECTIC CALIFORNIA COLOR PALETTE */

/* About Me background */
#about {
  background-color: #FAF1DD;
}/* Eclectic California - About Me quote card */
/* Botanical green About Me quote card */
#about .intro-quote {
  background: #41624B;
}/* MY APPROACH TO THERAPY - PHOTO LAYOUT */

.therapy-approach-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 35px;
  align-items: start;
  width: 140%;
}

.therapy-approach-photo img {
  display: block;
  width: 100%;
  height: auto;
  border: 10px solid #fffaf2;
  box-shadow: 10px 10px 0 #d7a64d;
}

@media (max-width: 768px) {
  .therapy-approach-layout {
    grid-template-columns: 1fr;
    width: 100%;
  }
}


/* Keep the About Me quote card in the right column */
@media (min-width: 769px) {
  #about .intro-quote {
    grid-column: 3;
    grid-row: 1;
  }
}
/* Position About Me quote card on the right */
@media (min-width: 769px) {
  #about .intro-quote {
    grid-column: 3;
    grid-row: 1;
    align-self: start;
  }
}