/* Saroya Psychotherapy: site styles on top of theme.json */
:root {
	--paper: var(--wp--preset--color--paper);
	--sand: var(--wp--preset--color--sand);
	--teal: var(--wp--preset--color--teal);
	--teal-deep: var(--wp--preset--color--teal-deep);
	--ink: var(--wp--preset--color--ink);
	--muted: var(--wp--preset--color--muted);
	--salmon: var(--wp--preset--color--salmon);
	--salmon-soft: var(--wp--preset--color--salmon-soft);
	--line: var(--wp--preset--color--line);
	--wrap: 1120px;
	--display: var(--wp--preset--font-family--display);
}

/* ---------- page skeleton: no gaps between header, sections and footer ---------- */
.wp-site-blocks > *,
.site-main > *,
.wp-block-post-content > .band,
.wp-block-post-content > .facts { margin-block-start: 0 !important; margin-block-end: 0; }
.wp-site-blocks { padding: 0; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid var(--salmon); outline-offset: 3px; border-radius: 4px; }
h1, h2, h3 { text-wrap: balance; }

/* ---------- header ---------- */
.site-header { position: sticky; top: 0; z-index: 50; }
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-header { top: 46px; } }
.site-head { padding: 0 16px; }
.site-head__inner { max-width: var(--wrap); margin: 0 auto; min-height: 80px; gap: 16px; }
.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; color: #fff; }
.brand:hover { color: #fff; }
.brand__icon { display: block; flex: none; }
.brand__name { font-family: var(--display); font-size: 1.45rem; line-height: 1; white-space: nowrap; letter-spacing: .005em; }
.site-head__nav { gap: 28px; }
.site-nav { gap: 28px; }
.site-nav a { color: #F2EFEA; text-decoration: none; }
.site-nav a:hover { color: #fff; text-decoration: underline; text-decoration-color: var(--salmon); text-underline-offset: 4px; }
.site-nav .wp-block-navigation__submenu-container {
	background: var(--paper) !important; color: var(--ink) !important; border: 1px solid var(--line) !important;
	border-radius: 10px; padding: 8px !important; min-width: 250px !important; box-shadow: 0 10px 30px rgba(48, 54, 54, .10);
}
.site-nav .wp-block-navigation__submenu-container a { color: var(--ink); padding: 9px 12px !important; border-radius: 6px; }
.site-nav .wp-block-navigation__submenu-container a:hover { background: var(--wp--preset--color--sand-soft); text-decoration: none; color: var(--ink); }
.site-nav .wp-block-navigation__responsive-container.is-menu-open { padding: 24px 20px; }
.site-nav .is-menu-open .wp-block-navigation__submenu-container { background: transparent !important; border: 0 !important; box-shadow: none; padding: 0 0 0 14px !important; }
.site-nav .is-menu-open a, .site-nav .is-menu-open .wp-block-navigation__submenu-container a { color: #fff !important; font-size: 1.15rem; }
.site-nav .wp-block-navigation__responsive-container-open, .site-nav .wp-block-navigation__responsive-container-close { color: #fff; }
.header-cta .wp-block-button__link { background: var(--paper); color: var(--teal-deep); padding: 12px 18px; font-size: .95rem; }
.header-cta .wp-block-button__link:hover { background: #fff; color: var(--teal-deep); }
@media (max-width: 700px) {
	.site-head .header-cta { display: none !important; }
	.brand__name { font-size: 1.2rem; }
	.brand__icon { width: 38px; height: 38px; }
	.site-head__inner { min-height: 68px; }
}

/* ---------- sections ---------- */
.band { padding: clamp(56px, 8vw, 104px) 16px; }
.band__inner { max-width: var(--wrap); margin-inline: auto; }
.wp-block-post-content > .band:first-child,
.site-main > .band:first-child { padding-top: clamp(28px, 4vw, 52px); }
.band--tight-bottom { padding-bottom: clamp(24px, 3vw, 40px); }
.band--tight-top { padding-top: 12px; }
/* page content: first band sits close to the header; two plain bands in a row share one gap */
.wp-block-post-content > .band:first-child { padding-top: clamp(28px, 4vw, 52px); }
.band:not(.has-background):not(.facts) + .band:not(.has-background) { padding-top: 0; }

.band .wp-block-columns { gap: clamp(28px, 5vw, 72px); margin-bottom: 0; }
.has-white-color h1, .has-white-color h2, .has-white-color h3 { color: #fff; }
.band--teal .muted { color: #D5DDDB; }
.crumbs { font-size: .88rem; color: var(--muted); }
.crumbs a { color: var(--muted); }
.eyebrow { font-size: .85rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.intro, .lede { font-size: 1.18rem; max-width: 600px; }
.small { font-size: .92rem; color: var(--muted); }
.muted { color: var(--muted); }
.answer { font-size: 1.2rem; color: var(--teal-deep); }
.tip { font-size: 1.12rem; }
.tip strong, .tip b { color: var(--teal-deep); }
.textlink a, a.textlink { font-weight: 700; color: var(--teal); text-decoration: underline; text-decoration-color: var(--salmon); text-decoration-thickness: 2px; text-underline-offset: 5px; }
.cta-row { gap: 14px 24px; }
.cta-row > * { margin: 0 !important; }
.wp-block-list li::marker { color: var(--salmon); }
.wp-block-list { padding-left: 1.1em; }
.wp-block-list li + li { margin-top: 6px; }

/* hero */
.hero3 h1 { font-size: clamp(2.1rem, 3.7vw, 3.1rem); }
.hero3 { overflow-x: clip; }
.hero-copy > * + * { margin-top: 24px !important; }
@media (max-width: 781px) {
	.hero3 .wp-block-column:last-child { order: -1; }
}

/* ---------- round photos ---------- */
.wp-block-image.is-style-circle-left, .wp-block-image.is-style-circle-right, .wp-block-image.is-style-circle-ring,
.wp-block-post-featured-image.is-style-circle-left {
	position: relative; isolation: isolate; aspect-ratio: 1 / 1; margin: 0; width: 100%; max-width: 420px;
}
.wp-block-image.is-style-circle-left img, .wp-block-image.is-style-circle-right img, .wp-block-image.is-style-circle-ring img,
.wp-block-post-featured-image.is-style-circle-left img {
	position: absolute; top: 0; width: 88% !important; height: auto !important; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 50%;
	background: linear-gradient(150deg, #EFE7DF, #E5E3DC 55%, #E9D6CB);
}
.is-style-circle-left::before, .is-style-circle-right::before, .is-style-circle-ring::before,
.is-style-circle-ring::after {
	content: ""; position: absolute; width: 88%; aspect-ratio: 1 / 1; border-radius: 50%; z-index: -1;
}
.is-style-circle-left::before, .is-style-circle-right::before, .is-style-circle-ring::before { background: var(--salmon-soft); top: 9%; }
.is-style-circle-left img, .is-style-circle-ring img { left: 11%; }
.is-style-circle-left::before, .is-style-circle-ring::before { left: 6%; }
.is-style-circle-right img { right: 11%; }
.is-style-circle-right::before { right: 6%; }
.is-style-circle-ring::after { border: 2px solid #E2B49F; top: 6%; left: 0; }
.hero3 .is-style-circle-ring { max-width: 560px; margin-left: auto; }
.svc-hero .wp-block-image, .post-hero .wp-block-post-featured-image { max-width: 340px; margin-left: auto; }
.virtual .wp-block-image { max-width: 420px; }
@media (max-width: 781px) {
	.hero3 .is-style-circle-ring { max-width: 320px; margin-left: 0; }
	.svc-hero .wp-block-image, .post-hero .wp-block-post-featured-image { max-width: 240px; margin-left: 0; }
	.virtual .wp-block-image { max-width: 280px; }
}

/* arch photos of people */
.wp-block-image.arch img { width: 100%; aspect-ratio: 4 / 4.6; object-fit: cover; object-position: 50% 20%; border-radius: 999px 999px 10px 10px; }

/* ---------- facts strip ---------- */
.facts { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 0 16px; }
.facts .wp-block-columns { gap: 0 !important; }
.facts .wp-block-column { padding: 22px 20px; }
.facts .wp-block-column:first-child { padding-left: 0; }
.facts .wp-block-column + .wp-block-column { border-left: 1px solid var(--line); }
.facts__big { font-family: var(--display); font-size: 1.3rem; color: var(--teal-deep); margin: 0; }
.facts__small { font-size: .95rem; color: var(--muted); margin: 2px 0 0 !important; }
@media (max-width: 781px) {
	.facts .wp-block-columns { flex-wrap: wrap !important; }
	.facts .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column { flex-basis: 50% !important; flex-grow: 0; box-sizing: border-box; }
	.facts .wp-block-column:nth-child(odd) { padding-left: 0; border-left: 0; }
	.facts .wp-block-column:nth-child(even) { padding-left: 16px; }
	.facts .wp-block-column:nth-child(n+3) { border-top: 1px solid var(--line); }
}

/* ---------- issues we help with ---------- */
.reasons-list { list-style: none; margin: 0; padding: 0 !important; border-top: 1px solid var(--line); }
.reasons-list li { margin: 0 !important; }
.reasons-list li a { display: flex; justify-content: space-between; gap: 20px; align-items: baseline; padding: 18px 0; border-bottom: 1px solid var(--line); text-decoration: none; color: inherit; }
.reasons-list .q { font-family: var(--display); font-size: 1.28rem; line-height: 1.35; color: var(--teal-deep); }
.reasons-list .q::before { content: "\201C"; } .reasons-list .q::after { content: "\201D"; }
.reasons-list .lbl { font-size: .8rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.reasons-list li a:hover .q { text-decoration: underline; text-decoration-color: var(--salmon); text-underline-offset: 5px; }
.band--teal .reasons-list, .band--teal .reasons-list li a { border-color: rgba(255, 255, 255, .22); }
.band--teal .reasons-list .q { color: #fff; }
.band--teal .reasons-list .lbl { color: #C9D3D1; }
@media (max-width: 781px) { .reasons-list li a { flex-direction: column; gap: 4px; } }

/* ---------- service cards ---------- */
.services { gap: 16px !important; margin-top: 40px !important; }
.svc-box { border: 1px solid var(--line); border-radius: 14px; padding: 24px 24px 22px; position: relative; }
.svc-box > * + * { margin-top: 10px !important; }
.svc-box h3 { font-size: 1.3rem; }
.svc-box h3 a { color: inherit; text-decoration: none; }
.svc-box h3 a::after { content: ""; position: absolute; inset: 0; border-radius: 14px; }
.svc-box:hover h3 a { text-decoration: underline; text-decoration-color: var(--salmon); text-underline-offset: 5px; text-decoration-thickness: 2px; }
.svc-box p { font-size: .98rem; color: var(--muted); }
.svc-box--cta { border-color: var(--teal); }
.svc-box--cta p { color: #DCE3E1; }
.svc-icon { color: var(--teal); display: block; }

/* ---------- team ---------- */
.team-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 22px; max-width: 780px; margin-top: 32px !important; }
.team-card .wp-block-image.arch { margin: 0; max-width: 200px; }
.team-card h3 { font-size: 1.35rem; }
.role { font-size: .92rem; color: var(--muted); font-weight: 700; line-height: 1.45; }
.profile > .wp-block-column:first-child { position: sticky; top: 110px; align-self: flex-start; }
.profile .wp-block-image.arch { margin: 0; max-width: 340px; }
.profile h2 { font-size: 2rem; }
.profile-body { max-width: 640px; }
.profile-body h3 { font-size: 1.55rem; }
.profile-body h3:not(:first-child) { margin-top: 36px !important; padding-top: 28px; border-top: 1px solid var(--line); }
.profile-body p { font-size: 1.08rem; line-height: 1.7; }
@media (max-width: 781px) { .profile > .wp-block-column:first-child { position: static; } .profile .wp-block-image.arch { max-width: 260px; } }

/* ---------- how to get started ---------- */
.steps { margin-top: 40px !important; gap: 32px !important; }
.step-n { font-family: var(--display); color: var(--muted); margin: 0; }
.steps h3 { font-size: 1.3rem; margin-top: 8px !important; }
.steps p:not(.step-n) { color: var(--muted); font-size: 1rem; margin-top: 8px !important; }
.callout { margin-top: 40px !important; padding: 24px 28px; background: #fff; border-left: 3px solid var(--salmon); max-width: 760px; }
.callout h3 { font-size: 1.15rem; }
.callout > * + * { margin-top: 6px !important; }
.plain-list li + li { margin-top: 10px; }

/* ---------- closing band ---------- */
.closing .wp-block-button__link { background: var(--paper); color: var(--teal-deep); }
.closing .wp-block-button__link:hover { background: #fff; color: var(--teal-deep); }
.closing p { max-width: 640px; }

/* ---------- service pages ---------- */
.svc > .wp-block-column:first-child { max-width: 680px; }
.svc h2 { font-size: 1.8rem; margin-top: 40px !important; }
.svc h2:first-child { margin-top: 0 !important; }
.aside { position: sticky; top: 110px; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 24px; }
.aside > * + * { margin-top: 14px !important; }
.aside h3 { font-size: 1.25rem; }
.aside .wp-block-button, .aside .wp-block-button__link { width: 100%; }
.meta { font-size: .85rem; color: var(--muted); border-top: 1px solid var(--line); padding-top: 12px; }
@media (max-width: 781px) { .aside { position: static; } }

/* questions */
.wp-block-details { border-bottom: 1px solid var(--line); padding: 14px 0; margin: 0 !important; }
.wp-block-details summary { cursor: pointer; font-weight: 700; color: var(--teal-deep); list-style: none; display: flex; justify-content: space-between; gap: 12px; }
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: "+"; font-size: 1.4rem; line-height: 1; color: var(--teal); }
.wp-block-details[open] summary::after { content: "\2212"; }
.wp-block-details p { margin-top: 10px; color: var(--muted); }
.faq .wp-block-details p { color: var(--ink); }
.faq h2 { font-size: 1.7rem; margin: 36px 0 6px !important; }
.faq { max-width: 760px; }

/* ---------- blog ---------- */
.post-grid .wp-block-post-template { gap: 16px; }
.post-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; height: 100%; display: flex; flex-direction: column; }
.post-card__img { margin: 0 !important; }
.post-card__img img { border-radius: 0; }
.post-card__body { padding: 18px 20px 22px; display: flex; flex-direction: column; flex: 1; }
.post-card__body > * { margin: 0 0 8px !important; }
.post-card__tag, .post-card__tag a { font-size: .8rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); text-decoration: none; }
.post-card__title { font-size: 1.25rem; }
.post-card__title a { color: var(--teal-deep); text-decoration: none; }
.post-card:hover .post-card__title a { text-decoration: underline; text-decoration-color: var(--salmon); text-underline-offset: 4px; }
.post-card__excerpt { font-size: .92rem; color: var(--muted); }
.post-card__excerpt .wp-block-post-excerpt__more-text { display: none; }
.post-card__date { font-size: .85rem; color: var(--muted); margin-top: auto !important; }
@media (max-width: 900px) { .post-grid .wp-block-post-template.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .post-grid .wp-block-post-template.is-layout-grid { grid-template-columns: 1fr; } }
.wp-block-query-pagination { margin-top: 32px; }

.post-h1 { font-size: clamp(2rem, 3.6vw, 2.9rem); }
.post-meta { font-size: .95rem; color: var(--muted); }
.post-meta > * { margin: 0 !important; }
.post-body { max-width: 680px; }
.post-body > :first-child { margin-top: 0; }
.post-body p { margin: 0 0 16px; }
.post-body h2 { font-size: clamp(1.5rem, 2.6vw, 1.85rem); margin: 44px 0 14px; }
.post-body h3 { font-size: 1.28rem; margin: 30px 0 10px; }
.post-body ul, .post-body ol { margin: 0 0 18px; }
.post-body a { font-weight: 700; text-decoration-color: var(--salmon); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.back-link { margin-top: 36px !important; }

/* ---------- footer ---------- */
.site-foot { padding: clamp(48px, 6vw, 80px) 16px 32px; font-size: .95rem; color: #D9DEDC; }
.site-foot__inner { max-width: var(--wrap); margin: 0 auto; }
.site-foot a { color: #F2EFEA; }
.site-foot h3 { color: #fff; font-size: 1.15rem; }
.site-foot .brand { margin-bottom: 16px; }
.foot-list { list-style: none; padding: 0 !important; }
.foot-list li + li { margin-top: 6px; }
.crisis { margin-top: 36px !important; padding: 18px 20px; border: 1px solid #4B5553; border-radius: 6px; color: #E8ECEA; }
.copyright { font-size: .85rem; color: #AEB6B3; }
.sticky-cta { display: none; }
@media (max-width: 700px) {
	.sticky-cta { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px)); background: rgba(251, 250, 247, .97); border-top: 1px solid var(--line); margin: 0 !important; }
	.sticky-cta .wp-block-buttons, .sticky-cta .wp-block-button, .sticky-cta .wp-block-button__link { width: 100%; }
	body { padding-bottom: 76px; }
}

/* mobile menu: read left to right like the rest of the site */
.site-nav .wp-block-navigation__responsive-container.is-menu-open { --navigation-layout-justification-setting: flex-start; --navigation-layout-justify: flex-start; }
.site-nav .is-menu-open .wp-block-navigation__responsive-container-content,
.site-nav .is-menu-open .wp-block-navigation__container,
.site-nav .is-menu-open .wp-block-navigation-item { align-items: flex-start !important; text-align: left; }