:root {
  --cream: #fbf4e9;
  --cream-2: #fffaf3;
  --peach-light: #f8d7c8;
  --orange: #db744d;
  --pink: #d987a2;
  --green: #173f3a;
  --green-2: #29584f;
  --ink: #243a36;
  --muted: #66736f;
  --shadow: 0 18px 50px rgba(23, 63, 58, 0.10);
  --radius: 28px;
  --shell: min(1120px, calc(100% - 40px));
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--cream-2);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
  text-rendering: optimizeLegibility;
}
a { color: inherit; }
[id] { scroll-margin-top: 110px; }
img, svg { display: block; max-width: 100%; }
button, input, textarea { font: inherit; }
.shell { width: var(--shell); margin-inline: auto; }
.skip-link {
  position: fixed; left: 16px; top: -80px; z-index: 999;
  background: var(--green); color: white; padding: 10px 14px; border-radius: 10px;
}
.skip-link:focus { top: 16px; }

.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255, 250, 243, .92);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(23,63,58,.08);
}
.nav-wrap { min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { text-decoration: none; display: inline-flex; flex-direction: column; line-height: .88; }
.brand-main {
  color: var(--orange);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: -.045em;
}
.brand-sub { color: var(--orange); font-size: .63rem; letter-spacing: .23em; font-weight: 800; margin-top: 7px; }
.top-nav { display: flex; gap: 24px; }
.top-nav a { text-decoration: none; font-size: .82rem; text-transform: uppercase; letter-spacing: .12em; font-weight: 800; color: var(--green); }
.top-nav a:hover, .top-nav a:focus-visible { color: var(--orange); }

.hero {
  min-height: 680px;
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 70px;
  align-items: center;
  padding-block: 78px 92px;
}
.eyebrow { margin: 0 0 14px; color: var(--orange); font-size: .77rem; font-weight: 900; letter-spacing: .18em; }
.hero h1, .section-heading h2, .credential-panel h2, .contact-section h2 {
  font-family: Georgia, "Times New Roman", serif;
  color: var(--green);
  letter-spacing: -.035em;
  line-height: .98;
  margin: 0;
}
.hero h1 { font-size: clamp(3.5rem, 7vw, 6.7rem); max-width: 800px; }
.hero h1 span { color: var(--pink); }
.hero-intro { max-width: 650px; margin: 28px 0 0; font-size: clamp(1.08rem, 2vw, 1.35rem); color: #40524e; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.button {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 50px; padding: 0 22px; border-radius: 999px;
  text-decoration: none; font-weight: 850; transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--green); color: white; box-shadow: 0 10px 24px rgba(23,63,58,.17); }
.button-primary:hover { background: var(--green-2); }
.button-secondary { border: 1px solid rgba(23,63,58,.28); color: var(--green); background: transparent; }
.button-secondary:hover { background: rgba(23,63,58,.05); }
.location-line { margin-top: 24px; font-size: .84rem; font-weight: 750; color: var(--muted); }

.hero-mark { position: relative; min-height: 390px; display: grid; place-items: center; color: var(--pink); }
.hero-heart { width: min(240px, 60vw); filter: drop-shadow(0 24px 35px rgba(217,135,162,.22)); }
.heart-orbit { position: absolute; border: 2px solid rgba(219,116,77,.20); border-radius: 50%; transform: rotate(-13deg); }
.heart-orbit-one { width: 360px; height: 230px; }
.heart-orbit-two { width: 260px; height: 390px; border-color: rgba(23,63,58,.14); transform: rotate(35deg); }

.quick-links { background: var(--green); color: white; padding: 28px 0; }
.quick-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.quick-card { min-height: 92px; text-decoration: none; display: flex; align-items: center; gap: 14px; padding: 16px; border-radius: 18px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.10); }
.quick-card:hover { background: rgba(255,255,255,.12); }
.quick-card.primary-card { background: var(--pink); color: #173f3a; border-color: transparent; }
.quick-icon { width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,.16); display: grid; place-items: center; flex: none; }
.quick-card span:last-child { display: grid; }
.quick-card strong { line-height: 1.2; }
.quick-card small { opacity: .72; margin-top: 3px; }

.section { padding-block: 96px; }
.section-heading { max-width: 760px; margin-bottom: 42px; }
.section-heading.narrow { max-width: 850px; margin-bottom: 0; }
.section-heading h2, .credential-panel h2 { font-size: clamp(2.4rem, 5vw, 4.4rem); }
.section-heading p { font-size: 1.1rem; color: var(--muted); max-width: 700px; }
.service-section { background: var(--cream); border-radius: 56px 56px 0 0; }

.service-feature { background: white; border-radius: var(--radius); padding: clamp(26px, 5vw, 48px); box-shadow: var(--shadow); }
.feature-top { display: flex; gap: 24px; align-items: flex-start; justify-content: space-between; }
.service-kicker { margin: 0 0 10px; color: var(--orange); font-weight: 900; letter-spacing: .15em; font-size: .75rem; }
.feature-top h3 { margin: 0; color: var(--green); font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 4vw, 3.1rem); line-height: 1; }
.feature-top p:last-child { color: var(--muted); max-width: 700px; }
.service-badge { flex: none; border-radius: 999px; background: var(--peach-light); color: var(--green); padding: 8px 14px; font-weight: 850; font-size: .85rem; }
.strength-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 28px; }
.strength-card { min-height: 165px; padding: 22px; border-radius: 22px; display: flex; flex-direction: column; justify-content: space-between; gap: 22px; }
.strength-card strong { color: var(--green); font-size: 1rem; line-height: 1.28; }
.line-icon { width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(23,63,58,.22); display: grid; place-items: center; color: var(--green); font-weight: 900; font-size: 1.1rem; }
.tone-peach { background: #f7d7c9; }
.tone-pink { background: #f0c5d2; }
.tone-sage { background: #d7dfc9; }
.tone-lilac { background: #dfd4e2; }
.tone-orange { background: #f6c18f; }
.tone-mint { background: #d4e6dc; }

.service-stack { display: grid; gap: 12px; margin-top: 18px; }
.expand-card { background: white; border: 1px solid rgba(23,63,58,.10); border-radius: 22px; overflow: hidden; }
.expand-card summary { cursor: pointer; user-select: none; list-style: none; min-height: 108px; padding: 20px 24px; display: grid; grid-template-columns: 56px 1fr 40px; gap: 18px; align-items: center; }
.expand-card summary::-webkit-details-marker { display: none; }
.expand-card summary:hover { background: rgba(23,63,58,.025); }
.number { font-family: Georgia, "Times New Roman", serif; color: var(--pink); font-size: 1.4rem; }
.summary-copy { display: grid; }
.summary-copy strong { color: var(--green); font-size: 1.2rem; }
.summary-copy small { color: var(--muted); font-size: .95rem; }
.plus { width: 36px; height: 36px; border-radius: 50%; background: var(--cream); display: grid; place-items: center; color: var(--green); font-size: 1.25rem; transition: transform .18s ease; }
details[open] .plus { transform: rotate(45deg); }
.detail-copy { padding: 0 80px 24px 98px; color: var(--muted); max-width: 850px; }
.detail-copy a { color: var(--green); font-weight: 850; }

.credentials { padding-block: 82px; }
.credential-panel { display: grid; grid-template-columns: 1fr .8fr; gap: 60px; align-items: center; background: #dfe8d7; border-radius: var(--radius); padding: clamp(28px, 5vw, 54px); }
.check-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.check-list li { background: rgba(255,255,255,.58); border-radius: 14px; padding: 14px 16px 14px 46px; position: relative; font-weight: 750; color: var(--green); }
.check-list li::before { content: "✓"; position: absolute; left: 16px; top: 13px; color: var(--orange); font-weight: 1000; }

.contact-section { background: var(--green); color: white; padding-block: 88px; }
.contact-grid { display: grid; grid-template-columns: 1.3fr .7fr; gap: 60px; align-items: center; }
.eyebrow.light { color: var(--peach); }
.contact-section h2 { color: white; font-size: clamp(2.5rem, 5vw, 4.7rem); max-width: 760px; }
.contact-section p { color: rgba(255,255,255,.72); max-width: 650px; }
.contact-actions { display: grid; gap: 12px; justify-items: start; }
.button-pink { background: var(--pink); color: var(--green); }
.button-pink:hover { background: #e49ab1; }
.email-link { color: white; font-weight: 850; text-underline-offset: 4px; }
.contact-actions span { color: rgba(255,255,255,.65); font-size: .9rem; }

.site-footer { background: #0f302c; color: rgba(255,255,255,.70); padding: 32px 0; }
.footer-wrap { display: grid; grid-template-columns: auto 1fr auto; align-items: end; gap: 28px; }
.footer-brand .brand-main, .footer-brand .brand-sub { color: var(--peach); }
.footer-wrap p { margin: 0; font-size: .82rem; }

:focus-visible { outline: 3px solid var(--orange); outline-offset: 4px; border-radius: 6px; }

@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; min-height: auto; gap: 30px; padding-block: 64px 70px; }
  .hero-mark { min-height: 280px; }
  .heart-orbit-one { width: 290px; height: 180px; }
  .heart-orbit-two { width: 210px; height: 310px; }
  .quick-grid { grid-template-columns: repeat(2, 1fr); }
  .strength-grid { grid-template-columns: repeat(2, 1fr); }
  .credential-panel, .contact-grid { grid-template-columns: 1fr; gap: 30px; }
  .footer-wrap { grid-template-columns: 1fr; align-items: start; }
}

@media (max-width: 620px) {
  :root { --shell: min(100% - 28px, 1120px); }
  .site-header { position: static; }
  .nav-wrap { min-height: 76px; }
  .top-nav a:not(:last-child) { display: none; }
  .top-nav { gap: 10px; }
  .hero { padding-block: 50px 56px; }
  .hero h1 { font-size: clamp(3.25rem, 16vw, 5rem); }
  .hero-mark { min-height: 220px; }
  .hero-heart { width: 170px; }
  .heart-orbit-one { width: 220px; height: 145px; }
  .heart-orbit-two { width: 160px; height: 235px; }
  .quick-grid { grid-template-columns: 1fr; }
  .section { padding-block: 70px; }
  .service-section { border-radius: 34px 34px 0 0; }
  .feature-top { display: grid; }
  .service-badge { justify-self: start; }
  .strength-grid { grid-template-columns: 1fr; }
  .strength-card { min-height: 125px; }
  .expand-card summary { grid-template-columns: 38px 1fr 36px; padding: 16px; gap: 10px; }
  .detail-copy { padding: 0 18px 20px 64px; }
  .credential-panel { border-radius: 22px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; }
}

/* Fast-scroll Easter egg: a playful dizzy PamPam heart. */
.scroll-surprise {
  position: fixed;
  right: clamp(16px, 3vw, 34px);
  bottom: clamp(14px, 3vw, 30px);
  width: 112px;
  height: 112px;
  z-index: 999;
  pointer-events: none;
  color: var(--pink);
  opacity: 0;
  visibility: hidden;
  transform: translate3d(26px, 128px, 0) rotate(20deg) scale(.72);
  transform-origin: 54% 62%;
  filter: drop-shadow(0 14px 20px rgba(23,63,58,.16));
}

.scroll-surprise.is-showing {
  visibility: visible;
  animation: surprise-pop 1.05s cubic-bezier(.2,.78,.2,1) both;
}

.scroll-surprise[data-direction="up"] {
  transform-origin: 40% 64%;
}

.surprise-heart {
  position: absolute;
  left: 19px;
  top: 20px;
  width: 76px;
  height: auto;
  color: var(--pink);
}

.scroll-surprise.is-showing .surprise-heart {
  animation: surprise-dizzy .68s cubic-bezier(.36,.07,.19,.97) 1 both;
}

.surprise-face {
  position: absolute;
  left: 39px;
  top: 47px;
  width: 40px;
  height: 28px;
  color: var(--green);
}

.surprise-face i {
  position: absolute;
  top: 0;
  width: 9px;
  height: 9px;
  border: 2px solid currentColor;
  border-radius: 50%;
}
.surprise-face i::after {
  content: "";
  position: absolute;
  inset: 2px;
  border-top: 1.5px solid currentColor;
  transform: rotate(35deg);
}
.surprise-face i:first-child { left: 3px; }
.surprise-face i:nth-child(2) { right: 3px; transform: rotate(75deg); }
.surprise-face b {
  position: absolute;
  left: 15px;
  top: 13px;
  font: 900 15px/1 Georgia, "Times New Roman", serif;
  transform: rotate(-8deg);
}

.surprise-orbit {
  position: absolute;
  left: 8px;
  top: 26px;
  width: 98px;
  height: 60px;
  border: 2px solid rgba(219,116,77,.48);
  border-radius: 50%;
  opacity: 0;
}
.surprise-orbit-b {
  left: 26px;
  top: 5px;
  width: 62px;
  height: 101px;
  border-color: rgba(23,63,58,.28);
}
.scroll-surprise.is-showing .surprise-orbit-a { animation: surprise-orbit-a .82s ease-out .05s both; }
.scroll-surprise.is-showing .surprise-orbit-b { animation: surprise-orbit-b .9s ease-out .03s both; }

.surprise-spark {
  position: absolute;
  color: var(--orange);
  font-weight: 900;
  opacity: 0;
}
.surprise-spark-one { left: 5px; top: 12px; font-size: 20px; }
.surprise-spark-two { right: 0; top: 30px; font-size: 14px; color: var(--green); }
.surprise-spark-three { left: 11px; bottom: 9px; font-size: 26px; color: var(--peach); }
.scroll-surprise.is-showing .surprise-spark-one { animation: surprise-spark .72s ease-out .08s both; }
.scroll-surprise.is-showing .surprise-spark-two { animation: surprise-spark .74s ease-out .18s both; }
.scroll-surprise.is-showing .surprise-spark-three { animation: surprise-spark .7s ease-out .26s both; }

@keyframes surprise-pop {
  0% { opacity: 0; transform: translate3d(28px, 126px, 0) rotate(28deg) scale(.72); }
  17% { opacity: 1; transform: translate3d(-4px, -4px, 0) rotate(-14deg) scale(1.06); }
  33% { transform: translate3d(2px, 0, 0) rotate(10deg) scale(.99); }
  68% { opacity: 1; transform: translate3d(0, 0, 0) rotate(-4deg) scale(1); }
  100% { opacity: 0; transform: translate3d(18px, 118px, 0) rotate(22deg) scale(.78); }
}

@keyframes surprise-dizzy {
  0% { transform: rotate(0deg); }
  18% { transform: rotate(-14deg); }
  34% { transform: rotate(13deg); }
  50% { transform: rotate(-10deg); }
  68% { transform: rotate(7deg); }
  84% { transform: rotate(-3deg); }
  100% { transform: rotate(0deg); }
}

@keyframes surprise-orbit-a {
  0% { opacity: 0; transform: rotate(-25deg) scale(.72); }
  22% { opacity: 1; }
  100% { opacity: 0; transform: rotate(205deg) scale(1.06); }
}

@keyframes surprise-orbit-b {
  0% { opacity: 0; transform: rotate(20deg) scale(.75); }
  20% { opacity: .9; }
  100% { opacity: 0; transform: rotate(-190deg) scale(1.08); }
}

@keyframes surprise-spark {
  0% { opacity: 0; transform: scale(.2) rotate(0deg); }
  25% { opacity: 1; transform: scale(1.2) rotate(65deg); }
  100% { opacity: 0; transform: translateY(-12px) scale(.72) rotate(150deg); }
}

@media (max-width: 620px) {
  .scroll-surprise {
    right: 10px;
    bottom: 10px;
    transform: translate3d(20px, 118px, 0) rotate(20deg) scale(.66);
  }
}

@media (prefers-reduced-motion: reduce) {
  .scroll-surprise { display: none !important; }
}
