.actual-logo { width: 190px; height: 88px; object-fit: contain; display: block; }
.logo-showcase { width: 230px; height: auto; float: right; margin: -12px 0 20px 34px; border-radius: 50%; box-shadow: 0 14px 36px rgba(46, 69, 52, .10); }
.counsellor-name { font-family: Georgia, serif; font-size: 24px; color: var(--rust); margin-top: 32px; }
.counsellor-name small { display: block; font-family: Arial, sans-serif; color: #74847d; text-transform: uppercase; letter-spacing: .16em; font-size: 10px; margin-top: 8px; }
.cards article img { width: 100%; aspect-ratio: 4/3; object-fit: cover; margin-bottom: 24px; filter: saturate(.85); transition: filter .25s, transform .25s; }
.cards article:hover img { filter: saturate(1); transform: translateY(-3px); }
.hero-art .hero-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-art::before { content: ""; position: absolute; z-index: 1; inset: 0; width: auto; height: auto; border: 0; border-radius: 0; transform: none; background: linear-gradient(180deg, transparent 45%, rgba(16, 43, 36, .82) 100%); }
.hero-art p { color: white; text-shadow: 0 2px 18px rgba(0, 0, 0, .35); }
.hero-art strong { color: #f8d766; }
.ways { padding: 110px 9vw 120px; background: var(--cream); }
.ways-heading { max-width: 760px; }
.ways-heading h2 { font-size: clamp(44px, 5vw, 72px); line-height: 1.05; }
.ways-heading > p:last-child { max-width: 590px; color: #5c746c; line-height: 1.7; font-size: 17px; }
.ways-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; margin-top: 58px; background: #d5dacd; border: 1px solid #d5dacd; }
.ways-grid article { background: var(--paper); min-height: 285px; padding: 38px 30px; }
.ways-grid article > span { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--sage); color: var(--ink); font-size: 25px; }
.ways-grid article:nth-child(even) > span { background: #f3d584; }
.ways-grid h3 { font-family: Georgia, serif; font-size: 24px; font-weight: 400; margin: 34px 0 14px; }
.ways-grid p { color: #61736d; line-height: 1.7; margin: 0; }
.ways-note { text-align: center; font-family: Georgia, serif; font-style: italic; font-size: 22px; color: var(--rust); margin: 48px 0 0; }
.expertise { padding: 115px 9vw; background: var(--paper); }
.expertise-intro { max-width: 760px; }
.expertise-intro h2 { font-size: clamp(44px, 5vw, 72px); line-height: 1.05; }
.expertise-intro > p:last-child { color: #5c746c; line-height: 1.7; font-size: 17px; max-width: 660px; }
.expertise-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 55px; }
.expertise-grid article { padding: 34px 38px; background: #f1f5ee; border-top: 4px solid var(--yellow); }
.expertise-grid article:nth-child(2), .expertise-grid article:nth-child(4) { background: #f8f1e6; border-color: var(--rust); }
.expertise-grid b { display: block; font-family: Georgia, serif; font-size: 25px; font-weight: 400; margin-bottom: 20px; }
.expertise-grid ul { columns: 2; column-gap: 24px; list-style: none; padding: 0; margin: 0; color: #526a62; }
.expertise-grid li { break-inside: avoid; position: relative; padding: 7px 0 7px 18px; line-height: 1.45; }
.expertise-grid li::before { content: "•"; position: absolute; left: 0; color: var(--rust); }
.training { display: grid; grid-template-columns: .75fr 1.25fr; gap: 8vw; align-items: center; margin-top: 18px; padding: 45px 50px; background: var(--ink); color: white; }
.training h3 { font-family: Georgia, serif; font-size: 30px; font-weight: 400; margin: 12px 0 0; }
.training > p { color: #c4d2cd; line-height: 1.8; margin: 0; }
.scope-note { text-align: center; color: #6b7c76; font-size: 13px; margin: 28px auto 0; max-width: 740px; }
.expertise, .ways { position: relative; overflow: hidden; isolation: isolate; }
.expertise::before, .ways::before { content: ""; position: absolute; z-index: -1; width: 520px; height: 520px; background: url("sunflowers-smiles-logo.png") center / contain no-repeat; opacity: .055; pointer-events: none; mix-blend-mode: multiply; }
.expertise::before { right: -110px; top: 40px; transform: rotate(8deg); }
.ways::before { left: -150px; bottom: -150px; transform: rotate(-10deg); opacity: .07; }
.footer-logo { width: 76px; height: 76px; object-fit: contain; border-radius: 50%; background: white; }
@media (max-width: 850px) { .actual-logo { width: 145px; height: 70px; } .logo-showcase { width: 180px; } .expertise { padding: 85px 7vw; } .expertise-grid { grid-template-columns: 1fr; } .training { grid-template-columns: 1fr; gap: 20px; } }
@media (max-width: 850px) { .ways { padding: 80px 7vw; } .ways-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 850px) {
  .hero { min-height: 0; }
  .hero-copy { padding: 48px 6vw 38px; }
  .hero-art { min-height: 360px; }
  .welcome, .support, .expertise, .ways, .contact { padding: 58px 6vw; }
  .welcome { gap: 14px; }
  .welcome-copy { font-size: 18px; line-height: 1.55; }
  .welcome-copy p:first-child { font-size: 22px; }
  .cards { margin-top: 36px; }
  .cards article { padding: 22px 0; }
  .cards article img { aspect-ratio: 16/9; margin-bottom: 18px; }
  .cards h3 { margin: 18px 0 10px; }
  .expertise-grid, .ways-grid { margin-top: 34px; }
  .training { margin-top: 12px; }
  footer { padding: 38px 6vw; gap: 24px; }
}
@media (max-width: 520px) {
  .site-header { height: 68px; padding: 0 16px; }
  .actual-logo { width: 118px; height: 62px; }
  h1 { font-size: 44px; }
  .intro { margin: 22px 0; line-height: 1.55; }
  .hero-copy { padding: 38px 18px 32px; }
  .hero-art { min-height: 285px; border-radius: 0 0 0 70px; }
  .hero-art p { bottom: 28px; font-size: 18px; }
  .welcome, .support, .expertise, .ways, .contact { padding: 46px 18px; }
  .welcome h2, .section-heading h2, .contact h2, .expertise-intro h2, .ways-heading h2 { font-size: 38px; }
  .logo-showcase { float: none; width: 135px; margin: 0 auto 18px; display: block; }
  .cards article img { aspect-ratio: 3/2; }
  .expertise-grid article { padding: 24px 20px; }
  .expertise-grid ul, .ways-grid { columns: 1; }
  .ways-grid { grid-template-columns: 1fr; }
  .ways-grid article { min-height: auto; padding: 26px 22px; }
  .ways-grid h3 { margin: 20px 0 8px; }
  .training { padding: 30px 22px; }
  .contact-panel { padding: 8px 18px; }
  .footer-logo { width: 62px; height: 62px; }
  footer { grid-template-columns: 1fr; padding: 34px 18px; gap: 14px; }
}