/* Sound Herbs theme styles. Tokens live in theme.json. */

:root {
	--sh-radius: 6px;
	--sh-radius-lg: 14px;
	--sh-shadow: 0 1px 2px rgb(22 48 29 / 6%), 0 8px 24px rgb(22 48 29 / 6%);
	--sh-ease: cubic-bezier(.2, .7, .2, 1);
}

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
:where(.wp-site-blocks) > * { margin-block-start: 0; }
.sh-main { padding-inline: 0; }
.sh-main > .wp-block-post-content > :first-child { margin-block-start: 0; }
.sh-main > .wp-block-post-content > :last-child { margin-block-end: 0; }
strong, b { font-weight: 500; }
::selection { background: var(--wp--preset--color--moss); }
:focus-visible { outline: 2px solid var(--wp--preset--color--sage); outline-offset: 3px; }

/* ---------- Header ---------- */
.sh-site-header { position: sticky; top: 0; z-index: 50; transition: box-shadow .25s var(--sh-ease); }
.admin-bar .sh-site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .sh-site-header { top: 0; } }
.sh-site-header.is-scrolled { box-shadow: 0 1px 0 var(--wp--preset--color--stone), 0 6px 20px rgb(22 48 29 / 6%); }
.sh-header { border-bottom: 1px solid transparent; }
.sh-brand { text-decoration: none; }
.sh-brand__mark { margin: 0 !important; flex: 0 0 auto; }
.sh-brand__mark img { border-radius: 50%; display: block; }
.sh-brand__title, .sh-brand__title a {
	font-family: var(--wp--preset--font-family--serif); font-weight: 500; font-size: 1.45rem; line-height: 1;
	letter-spacing: .14em; text-transform: uppercase; color: var(--wp--preset--color--forest-deep); text-decoration: none; margin: 0;
}
.sh-brand__tag { margin: .3rem 0 0 !important; font-size: .62rem; letter-spacing: .16em; text-transform: uppercase; color: var(--wp--preset--color--muted); line-height: 1.3; }
.sh-brand--light .sh-brand__title, .sh-brand--light .sh-brand__tag { color: var(--wp--preset--color--sand); }
.sh-nav .wp-block-navigation-item__content { text-decoration: none; padding-block: .35rem; position: relative; }
.sh-nav .wp-block-navigation-item__content::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .25s var(--sh-ease); }
.sh-nav .wp-block-navigation-item__content:hover::after, .sh-nav .current-menu-item > .wp-block-navigation-item__content::after { transform: scaleX(1); }
.sh-nav .wp-block-navigation__submenu-container { background: var(--wp--preset--color--cream) !important; border: 1px solid var(--wp--preset--color--stone) !important; border-radius: var(--sh-radius); padding: .5rem !important; box-shadow: var(--sh-shadow); min-width: 240px !important; }
.sh-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding: .5rem .75rem; }
.sh-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content::after { display: none; }
.sh-nav .wp-block-navigation__responsive-container.is-menu-open { background: var(--wp--preset--color--cream); padding: 2rem; }
.sh-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-family: var(--wp--preset--font-family--serif); font-size: 1.6rem; }
.sh-header__cta .wp-block-button__link { padding: .75rem 1.25rem; white-space: nowrap; }
.sh-nav { font-size: .9rem !important; }
.sh-nav .wp-block-navigation__container { flex-wrap: nowrap; }
.sh-nav .wp-block-navigation-item__content, .sh-nav .wp-block-navigation-item__label { white-space: nowrap; }
@media (max-width: 1480px) { .sh-brand__tag { display: none; } }
@media (max-width: 1080px) { .sh-header__cta { display: none; } }
@media (max-width: 600px) { .sh-brand__title, .sh-brand__title a { font-size: 1.15rem; } .sh-brand__mark img { width: 40px !important; height: 40px !important; } }

/* ---------- Type helpers ---------- */
.is-style-eyebrow { font-size: .75rem !important; letter-spacing: .2em; text-transform: uppercase; font-weight: 400; color: var(--wp--preset--color--sage); margin-block-end: .25rem; }
.has-forest-background-color .is-style-eyebrow, .has-forest-deep-background-color .is-style-eyebrow { color: rgb(242 236 221 / 70%); }
.sh-lead { font-size: var(--wp--preset--font-size--lg); line-height: 1.6; color: var(--wp--preset--color--muted); }
.sh-hero .sh-lead { max-width: 40rem; }
.has-forest-background-color .sh-lead, .has-forest-deep-background-color .sh-lead { color: rgb(242 236 221 / 85%); }
.has-forest-background-color :where(h1, h2, h3, h4), .has-forest-deep-background-color :where(h1, h2, h3, h4) { color: var(--wp--preset--color--cream); }
.has-forest-background-color a:not(.wp-element-button), .has-forest-deep-background-color a:not(.wp-element-button) { color: var(--wp--preset--color--sand); }
.sh-serif-intro { font-family: var(--wp--preset--font-family--serif); font-size: var(--wp--preset--font-size--xl); line-height: 1.45; font-weight: 400; color: var(--wp--preset--color--forest-deep); }

/* ---------- Wave background ---------- */
.is-style-waves { position: relative; isolation: isolate; overflow: hidden; }
.is-style-waves::before { content: ""; position: absolute; inset: auto -5% -10% -5%; height: 70%; background: url("../images/waves-dark.svg") center / 100% 100% no-repeat; z-index: -1; pointer-events: none; }
.is-style-waves.has-forest-background-color::before, .is-style-waves.has-forest-deep-background-color::before { background-image: url("../images/waves-light.svg"); }

/* ---------- Buttons ---------- */
.wp-element-button { transition: background-color .2s, color .2s, border-color .2s, transform .2s var(--sh-ease); }
.wp-block-button .wp-block-button__link:hover { transform: translateY(-1px); }
.is-style-ghost .wp-block-button__link { background: transparent !important; border: 1px solid currentColor; }
.is-style-ghost .wp-block-button__link:hover { background: rgb(255 255 255 / 8%) !important; }
.is-style-ghost .wp-block-button__link { color: var(--wp--preset--color--forest) !important; }
:is(.has-forest-background-color, .has-forest-deep-background-color) .is-style-ghost .wp-block-button__link { color: var(--wp--preset--color--cream) !important; }
.is-style-light .wp-block-button__link { background: var(--wp--preset--color--cream) !important; color: var(--wp--preset--color--forest-deep) !important; }
.is-style-light .wp-block-button__link:hover { background: var(--wp--preset--color--white) !important; }
.sh-textlink a, a.sh-textlink { text-decoration: none; font-size: var(--wp--preset--font-size--sm); letter-spacing: .03em; border-bottom: 1px solid currentColor; padding-bottom: 2px; }

/* ---------- Hero ---------- */
.sh-hero { min-height: min(78vh, 720px); display: flex; align-items: center; }
.sh-hero h1 { font-weight: 400; max-width: 13ch; }
.sh-hero__emblem img { width: min(100%, 380px); height: auto; border-radius: 50%; box-shadow: 0 30px 80px rgb(0 0 0 / 25%); }
.sh-hero__emblem { display: flex; justify-content: center; }
.sh-trust { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; color: rgb(242 236 221 / 75%); }
.sh-trust li { position: relative; }
.sh-trust li + li::before { content: ""; position: absolute; left: -.8rem; top: 50%; width: 4px; height: 4px; border-radius: 50%; background: currentColor; transform: translateY(-50%); opacity: .6; }
@media (max-width: 781px) { .sh-hero { min-height: 0; } .sh-hero__emblem img { width: 200px; } }

/* ---------- Icons ---------- */
.sh-ico { display: inline-block; width: 2.4rem; height: 2.4rem; }
[class*="sh-ico--"]::before {
	content: ""; display: block; width: 2.4rem; height: 2.4rem; margin: 0 auto .9rem; background: var(--sh-ico-color, var(--wp--preset--color--forest));
	-webkit-mask: var(--sh-ico) center / contain no-repeat; mask: var(--sh-ico) center / contain no-repeat;
}
.sh-ico--anxiety { --sh-ico: url("../images/icons/anxiety.svg"); }
.sh-ico--stress { --sh-ico: url("../images/icons/stress.svg"); }
.sh-ico--low-mood { --sh-ico: url("../images/icons/low-mood.svg"); }
.sh-ico--exhaustion { --sh-ico: url("../images/icons/exhaustion.svg"); }
.sh-ico--overthinking { --sh-ico: url("../images/icons/overthinking.svg"); }
.sh-ico--sleep { --sh-ico: url("../images/icons/sleep.svg"); }
.sh-ico--fatigue { --sh-ico: url("../images/icons/fatigue.svg"); }
.sh-ico--prolonged { --sh-ico: url("../images/icons/prolonged.svg"); }
.sh-ico--herbs { --sh-ico: url("../images/icons/herbs.svg"); }
.sh-ico--acupuncture { --sh-ico: url("../images/icons/acupuncture.svg"); }
.sh-ico--selfcare { --sh-ico: url("../images/icons/selfcare.svg"); }
.sh-ico--sound { --sh-ico: url("../images/icons/sound.svg"); }
.sh-ico--video { --sh-ico: url("../images/icons/video.svg"); }
.sh-ico--calendar { --sh-ico: url("../images/icons/calendar.svg"); }
.sh-ico--form { --sh-ico: url("../images/icons/form.svg"); }
.sh-ico--parcel { --sh-ico: url("../images/icons/parcel.svg"); }

/* ---------- Focus grid ---------- */
.sh-focus { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 1px !important; background: var(--wp--preset--color--stone); border: 1px solid var(--wp--preset--color--stone); border-radius: var(--sh-radius-lg); overflow: hidden; }
.sh-focus > * { margin: 0 !important; background: var(--wp--preset--color--cream); text-align: center; padding: 1.6rem .75rem 1.4rem; text-decoration: none; color: var(--wp--preset--color--ink); font-size: .9rem; line-height: 1.35; transition: background .2s; }
.sh-focus > *:hover { background: var(--wp--preset--color--white); }
.sh-focus a { color: inherit; text-decoration: none; }
.sh-focus a::after { content: ""; position: absolute; inset: 0; }
.sh-focus > * { position: relative; }

/* ---------- Cards ---------- */
.is-style-card { background: var(--wp--preset--color--white); border: 1px solid var(--wp--preset--color--stone); border-radius: var(--sh-radius-lg); padding: clamp(1.4rem, 3vw, 2rem); height: 100%; transition: box-shadow .25s var(--sh-ease), transform .25s var(--sh-ease); }
.is-style-card:hover { box-shadow: var(--sh-shadow); transform: translateY(-2px); }
.is-style-card[class*="sh-ico--"]::before { margin: 0 0 1.1rem; }
.is-style-card h3 { margin-block-start: 0; }
.is-style-card > :last-child { margin-block-end: 0; }
.wp-block-columns.sh-cards { align-items: stretch !important; }
.wp-block-columns.sh-cards > .wp-block-column > .is-style-card { display: flex; flex-direction: column; }
.wp-block-columns.sh-cards .sh-textlink { margin-top: auto; padding-top: .75rem; }

/* ---------- Steps ---------- */
.sh-steps { counter-reset: step; }
.sh-steps > .wp-block-column { counter-increment: step; position: relative; padding-top: 3.6rem; }
.sh-steps > .wp-block-column::before { content: counter(step, decimal-leading-zero); position: absolute; top: 0; left: 0; font-family: var(--wp--preset--font-family--serif); font-size: 2.4rem; line-height: 1; color: var(--wp--preset--color--sage); }
.sh-steps > .wp-block-column::after { content: ""; position: absolute; top: 1.25rem; left: 3.6rem; right: 0; height: 1px; background: var(--wp--preset--color--stone); }
.sh-steps > .wp-block-column:last-child::after { display: none; }
.sh-steps h3 { font-size: var(--wp--preset--font-size--lg); margin-top: 0; }
@media (max-width: 781px) { .sh-steps > .wp-block-column::after { display: none; } }

/* ---------- Split / quote ---------- */
.sh-split { border-radius: var(--sh-radius-lg); overflow: hidden; }
.sh-quote-panel { display: flex; flex-direction: column; justify-content: center; }
.sh-quote-panel blockquote { border: 0; padding: 0; margin: 0; }
.sh-quote-panel blockquote p { font-size: var(--wp--preset--font-size--xxl); line-height: 1.25; }
.sh-quote-panel blockquote cite { display: block; margin-top: 1rem; font-family: var(--wp--preset--font-family--sans); font-style: normal; font-size: .75rem; letter-spacing: .16em; text-transform: uppercase; opacity: .75; }
.wp-block-quote cite { font-style: normal; font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--muted); }

/* ---------- Lists ---------- */
.is-style-dots { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.is-style-dots li { padding: .45rem 1rem; border: 1px solid var(--wp--preset--color--stone); border-radius: 999px; font-size: .9rem; background: var(--wp--preset--color--white); }
.is-style-checks { list-style: none; padding-left: 0; }
.is-style-checks li { position: relative; padding-left: 1.9rem; margin-bottom: .6rem; }
.is-style-checks li::before { content: ""; position: absolute; left: 0; top: .3em; width: 1.1rem; height: 1.1rem; background: var(--wp--preset--color--sage); -webkit-mask: url("../images/icons/herbs.svg") center / contain no-repeat; mask: url("../images/icons/herbs.svg") center / contain no-repeat; }

/* ---------- Notes ---------- */
.sh-note { background: var(--wp--preset--color--moss); border-left: 3px solid var(--wp--preset--color--sage); border-radius: 0 var(--sh-radius) var(--sh-radius) 0; padding: 1.1rem 1.4rem !important; }
.sh-note p { margin: 0; }

/* ---------- Credentials ---------- */
.sh-creds { border: 1px solid var(--wp--preset--color--stone); border-radius: var(--sh-radius-lg); padding: 1.6rem !important; background: var(--wp--preset--color--white); }
.sh-creds ul { margin: 0; }

/* ---------- FAQ (details) ---------- */
.wp-block-details summary { cursor: pointer; list-style: none; font-family: var(--wp--preset--font-family--serif); font-size: var(--wp--preset--font-size--xl); color: var(--wp--preset--color--forest-deep); padding-right: 2rem; position: relative; }
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: "+"; position: absolute; right: 0; top: 0; font-family: var(--wp--preset--font-family--sans); font-weight: 300; font-size: 1.6rem; line-height: 1.1; color: var(--wp--preset--color--sage); transition: transform .2s; }
.wp-block-details[open] summary::after { transform: rotate(45deg); }
.wp-block-details > :not(summary) { margin-top: .75rem; }

/* ---------- Tables ---------- */
.wp-block-table table, .sh-table { width: 100%; border-collapse: collapse; background: var(--wp--preset--color--white); border-radius: var(--sh-radius-lg); overflow: hidden; }
.wp-block-table { border: 1px solid var(--wp--preset--color--stone); border-radius: var(--sh-radius-lg); overflow: hidden; }
.wp-block-table th, .wp-block-table td, .sh-table th, .sh-table td { border: 0; border-bottom: 1px solid var(--wp--preset--color--stone); padding: 1rem 1.25rem; text-align: left; }
.wp-block-table thead, .sh-table thead { border: 0; background: var(--wp--preset--color--sand); }
.wp-block-table th, .sh-table th { font-weight: 500; font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; }
.wp-block-table tr:last-child td, .sh-table tr:last-child td { border-bottom: 0; }

/* ---------- Page hero ---------- */
.sh-page-hero h1 { margin-block: .25rem 1rem; }

/* ---------- Footer ---------- */
.sh-footer .is-style-eyebrow { margin-bottom: 1rem; }
.sh-footer__links { list-style: none; padding: 0; margin: 0; font-size: var(--wp--preset--font-size--sm); }
.sh-footer__links li { margin-bottom: .55rem; }
.sh-footer a { text-decoration: none; color: var(--wp--preset--color--sand); opacity: .85; }
.sh-footer a:hover { opacity: 1; text-decoration: underline; }
.sh-footer__rule { border-color: rgb(242 236 221 / 15%) !important; margin-block: var(--wp--preset--spacing--50) 1.25rem !important; }
.sh-footer__bottom p { margin: 0; opacity: .75; }

/* ---------- Section rhythm ---------- */
.sh-section { padding-block: var(--wp--preset--spacing--60); }
.sh-section-head { display: flex; justify-content: space-between; align-items: end; gap: 1rem; flex-wrap: wrap; }
.sh-section-head h2 { margin: 0; }
.sh-portrait img { border-radius: var(--sh-radius-lg); aspect-ratio: 4 / 5; object-fit: cover; width: 100%; }
.sh-emblem-soft img { border-radius: 50%; width: 100%; max-width: 360px; height: auto; display: block; margin-inline: auto; }

/* ---------- Forms (theme-level fallback) ---------- */
.sh-form input:not([type=checkbox]):not([type=radio]), .sh-form select, .sh-form textarea {
	width: 100%; padding: .85rem 1rem; border: 1px solid var(--wp--preset--color--stone); border-radius: var(--sh-radius); background: var(--wp--preset--color--white); font: inherit; font-weight: 400; color: var(--wp--preset--color--ink);
}
.sh-form input:focus, .sh-form select:focus, .sh-form textarea:focus { outline: 2px solid var(--wp--preset--color--sage); outline-offset: 1px; border-color: transparent; }
.sh-form label { display: block; font-size: .85rem; font-weight: 400; margin-bottom: .35rem; }

/* ---------- Header: responsive refinements ---------- */
.sh-header .sh-header__cta { flex-shrink: 0; }
@media (max-width: 1080px) {
	.sh-header .sh-header__actions { gap: .9rem !important; }
	.sh-header .sh-nav { order: 2; }
	.sh-header .sh-header__cta { order: 1; display: flex !important; }
}
@media (max-width: 600px) {
	.sh-brand__title, .sh-brand__title a { font-size: 1rem; letter-spacing: .1em; white-space: nowrap; }
	.sh-header .sh-header__cta .wp-block-button__link { font-size: .78rem; padding: .55rem .8rem; letter-spacing: .02em; }
	.sh-brand { gap: .5rem !important; }
	.sh-brand__mark img { width: 34px !important; height: 34px !important; }
}
@media (max-width: 360px) { .sh-brand__text { display: none !important; } }

/* Trust list stacks on small screens */
@media (max-width: 600px) {
	.sh-trust { flex-direction: column; gap: .4rem; }
	.sh-trust li + li::before { display: none; }
}

/* Quote attribution on dark panel */
.sh-quote-panel blockquote cite { color: rgb(242 236 221 / 72%); }

/* Keep anchored content clear of the sticky header */
.shb, .shb-details, [id] { scroll-margin-top: 110px; }

/* Long-form sections: calmer heading scale */
.sh-prose h2 { font-size: var(--wp--preset--font-size--xxl); margin-block-start: var(--wp--preset--spacing--50); }
.sh-prose h2:first-child { margin-block-start: 0; }
.sh-prose h3 { margin-block-start: var(--wp--preset--spacing--40); }
.single-sh_guide .wp-block-post-content h2 { font-size: var(--wp--preset--font-size--xxl); }

/* Form boxes never overflow their column */
.sh-form input, .sh-form select, .sh-form textarea, .shb input, .shb select, .shb textarea { box-sizing: border-box; max-width: 100%; }
.shc-grid2 > * { min-width: 0; }