/* Simeon & Mathews: component styles on top of theme.json. Class names start with sm-. */

:root {
	--sm-navy: var(--wp--preset--color--navy);
	--sm-deep: var(--wp--preset--color--navy-deep);
	--sm-red: var(--wp--preset--color--red);
	--sm-red-dark: #b8141b;
	--sm-ink: var(--wp--preset--color--ink);
	--sm-slate: var(--wp--preset--color--slate);
	--sm-line: var(--wp--preset--color--line);
	--sm-mist: var(--wp--preset--color--mist);
	--sm-tint: #eceefa;
	--sm-radius: 14px;
	--sm-shadow: var(--wp--preset--shadow--card);
	--sm-ease: cubic-bezier(.2, .7, .2, 1);
}

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
:focus-visible { outline: 2px solid var(--sm-red); outline-offset: 3px; }
.sm-main > .wp-block-post-content > * { margin-block-start: 0; }

/* ---------- icons (masks, so they take the text colour) ---------- */
.sm-ico-audit { --ico: url(../icons/audit.svg); }
.sm-ico-tax { --ico: url(../icons/tax.svg); }
.sm-ico-advisory { --ico: url(../icons/advisory.svg); }
.sm-ico-accounting { --ico: url(../icons/accounting.svg); }
.sm-ico-secretarial { --ico: url(../icons/secretarial.svg); }
.sm-ico-planning { --ico: url(../icons/planning.svg); }
.sm-ico-risk { --ico: url(../icons/risk.svg); }
.sm-ico-witness { --ico: url(../icons/witness.svg); }
.sm-ico-vision { --ico: url(../icons/vision.svg); }
.sm-ico-mission { --ico: url(../icons/mission.svg); }
.sm-ico-objective { --ico: url(../icons/objective.svg); }
.sm-ico-place { --ico: url(../icons/place.svg); }
.sm-ico-mail { --ico: url(../icons/mail.svg); }
.sm-ico-phone { --ico: url(../icons/phone.svg); }

/* ---------- type helpers ---------- */
.sm-eyebrow {
	display: flex; align-items: center; gap: 0.75rem;
	font-size: 0.78rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--sm-red);
}
.sm-eyebrow::before { content: ""; width: 28px; height: 2px; background: currentColor; flex-shrink: 0; }
.sm-eyebrow--light { color: #ffb3b6; }
.sm-lead { font-size: var(--wp--preset--font-size--large); color: var(--sm-slate); line-height: 1.6; }
.sm-muted { color: var(--sm-slate); font-size: 0.95rem; }
.sm-more a, .sm-card__title a { text-decoration: none; }
.sm-more a { display: inline-flex; align-items: center; gap: 0.5rem; font-weight: 600; color: var(--sm-navy); }
.sm-more a::after {
	content: ""; width: 18px; height: 18px; background: currentColor;
	-webkit-mask: url(../icons/arrow.svg) center / contain no-repeat; mask: url(../icons/arrow.svg) center / contain no-repeat;
	transition: transform .2s var(--sm-ease);
}
.sm-more a:hover::after { transform: translateX(4px); }

/* ---------- buttons ---------- */
.wp-block-button__link { transition: background .18s, color .18s, border-color .18s, transform .18s var(--sm-ease); }
.wp-block-button__link:hover { transform: translateY(-1px); }
.wp-block-button.is-style-outline > .wp-block-button__link { border: 1.5px solid var(--sm-navy); color: var(--sm-navy); background: transparent; padding: calc(0.85rem - 1.5px) calc(1.5rem - 1.5px); }
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--sm-navy); color: #fff; }
.sm-btn-red > .wp-block-button__link { background: var(--sm-red); color: #fff; }
.sm-btn-red > .wp-block-button__link:hover { background: var(--sm-red-dark); }
.wp-block-button.sm-btn-light > .wp-block-button__link { border-color: rgba(255, 255, 255, 0.6); color: #fff; }
.wp-block-button.sm-btn-light > .wp-block-button__link:hover { background: #fff; color: var(--sm-navy); border-color: #fff; }

/* ---------- masthead ---------- */
.sm-masthead { position: sticky; top: 0; z-index: 50; }
.admin-bar .sm-masthead { top: 32px; }
@media (max-width: 782px) { .admin-bar .sm-masthead { top: 46px; } }
.sm-topbar { font-size: 0.8rem; overflow: hidden; max-height: 60px; transition: max-height .25s var(--sm-ease), padding .25s var(--sm-ease); }
.sm-topbar a { color: #fff; text-decoration: none; opacity: 0.85; }
.sm-topbar a:hover { opacity: 1; color: #fff; }
.sm-topbar p { margin: 0; opacity: 0.9; }
.sm-topbar__sep { opacity: 0.35; margin: 0 0.5rem; }
.is-scrolled .sm-topbar { max-height: 0; padding-top: 0 !important; padding-bottom: 0 !important; }
.sm-header { background: rgba(255, 255, 255, 0.97); backdrop-filter: blur(12px); border-bottom: 1px solid var(--sm-line); transition: box-shadow .25s; }
.is-scrolled .sm-header { box-shadow: 0 8px 30px -18px rgba(14, 18, 64, 0.35); }
.sm-header__in { padding-block: 0.9rem; gap: 1.5rem; }
.sm-header__nav { gap: 1.75rem; }
.sm-brand { gap: 0.75rem; }
.sm-brand .wp-block-site-logo { flex-shrink: 0; }
.sm-brand .wp-block-site-logo img { width: 48px; height: auto; }
.sm-brand__text { gap: 0; }
.sm-brand .wp-block-site-title { line-height: 1.1; white-space: nowrap; }
.sm-brand .wp-block-site-title a { color: var(--sm-navy); text-decoration: none; }
.sm-brand__tag { margin: 2px 0 0; font-size: 0.68rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--sm-red); white-space: nowrap; }
.sm-header .wp-block-navigation a { text-decoration: none; color: var(--sm-ink); position: relative; padding-block: 0.4rem; }
.sm-header .wp-block-navigation a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--sm-red); transform: scaleX(0); transform-origin: left; transition: transform .22s var(--sm-ease); }
.sm-header .wp-block-navigation a:hover::after, .sm-header .wp-block-navigation a[aria-current="page"]::after { transform: scaleX(1); }
.sm-header .wp-block-navigation a[aria-current="page"] { color: var(--sm-navy); }
.sm-header__cta .wp-block-button__link { padding: 0.7rem 1.2rem; font-size: 0.88rem; }
.sm-header .wp-block-navigation__responsive-container.is-menu-open { padding: 2rem; }
.sm-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 1.25rem; font-size: 1.25rem; }
@media (max-width: 1080px) { .sm-header .sm-header__cta { display: none; } }
@media (max-width: 720px) {
	.sm-topbar { display: none; }
	.sm-brand__tag { display: none; }
	.sm-brand .wp-block-site-logo img { width: 40px; }
	.sm-brand .wp-block-site-title { font-size: 1.1rem !important; }
}

/* ---------- hero ---------- */
.sm-hero, .sm-pagehero { padding-top: var(--wp--preset--spacing--60) !important; }
.sm-hero { padding-bottom: calc(var(--wp--preset--spacing--60) + 70px) !important; align-items: center; }
.sm-hero .wp-block-cover__background,
.sm-pagehero .wp-block-cover__background {
	opacity: 1 !important;
	background: linear-gradient(100deg, rgba(14, 18, 64, 0.95) 0%, rgba(22, 28, 96, 0.86) 42%, rgba(14, 18, 64, 0.35) 78%, rgba(14, 18, 64, 0.15) 100%) !important;
}
.sm-hero .wp-block-cover__image-background { object-position: 70% 40%; }
.sm-hero__copy { max-width: 1200px; }
.sm-hero__copy > * { max-width: 660px; }
.sm-hero h1 { margin-block: 1rem 1.25rem; }
.sm-hero__lead { font-size: var(--wp--preset--font-size--large); color: rgba(255, 255, 255, 0.86); line-height: 1.6; }
.sm-hero__buttons { margin-top: 2rem; }
.sm-hero::after { content: ""; position: absolute; left: 0; bottom: 0; width: 34%; height: 6px; background: var(--sm-red); z-index: 1; }

.sm-pagehero { padding-bottom: var(--wp--preset--spacing--60) !important; }
.sm-pagehero .wp-block-cover__image-background { object-position: center 35%; }
.sm-pagehero__copy > * { max-width: 720px; }
.sm-pagehero h1 { font-size: var(--wp--preset--font-size--xx-large); margin-block: 0.75rem; }
.sm-pagehero__lead { color: rgba(255, 255, 255, 0.85); font-size: var(--wp--preset--font-size--large); }

/* ---------- figures ---------- */
.sm-stats { gap: 0 !important; background: #fff; border-radius: var(--sm-radius); box-shadow: var(--sm-shadow); border: 1px solid var(--sm-line); position: relative; z-index: 2; }
.wp-block-cover + .sm-stats { margin-top: -70px !important; }
.sm-stat { padding: 1.75rem 2rem; border-left: 1px solid var(--sm-line); }
.sm-stat:first-child { border-left: 0; }
.sm-stat__num { margin: 0; font-family: var(--wp--preset--font-family--serif); font-size: clamp(2.1rem, 3.4vw, 2.75rem); font-weight: 600; line-height: 1; color: var(--sm-navy); }
.sm-stat__num::before { content: ""; display: block; width: 24px; height: 3px; background: var(--sm-red); margin-bottom: 0.9rem; }
.sm-stat__label { margin: 0.5rem 0 0; font-size: 0.9rem; color: var(--sm-slate); }
.sm-stats--inline { box-shadow: none; margin-top: 1.5rem !important; }
@media (max-width: 760px) {
	.sm-stat { border-left: 0; border-top: 1px solid var(--sm-line); padding: 1.25rem 1.5rem; }
	.sm-stat:first-child, .sm-stats .sm-stat:nth-child(2) { border-top: 0; }
}

/* ---------- sections ---------- */
.sm-section { padding-block: var(--wp--preset--spacing--60); }
.sm-band { padding-block: var(--wp--preset--spacing--60); }
.sm-band--mist { background: var(--sm-mist); }
.sm-band + .sm-section, .sm-section + .sm-band { margin-block-start: 0 !important; }
.wp-block-post-content > .alignfull, .wp-block-post-content > .alignwide { margin-block: 0; }
.sm-head { max-width: 760px; margin-bottom: 2.5rem; }
.sm-head h2, .sm-split h2 { margin-block: 0.75rem 1rem; }
.sm-split { gap: clamp(2rem, 5vw, 5rem) !important; }
@media (min-width: 782px) { .sm-split--flip { flex-direction: row; } }

.sm-checks { list-style: none; padding: 0; margin: 1.5rem 0; display: grid; gap: 0.85rem; }
.sm-checks li { position: relative; padding-left: 2.25rem; }
.sm-checks li::before {
	content: ""; position: absolute; left: 0; top: 0.15em; width: 1.4rem; height: 1.4rem; border-radius: 50%; background: var(--sm-tint);
}
.sm-checks li::after {
	content: ""; position: absolute; left: 0.3rem; top: calc(0.15em + 0.3rem); width: 0.8rem; height: 0.8rem; background: var(--sm-navy);
	-webkit-mask: url(../icons/check.svg) center / contain no-repeat; mask: url(../icons/check.svg) center / contain no-repeat;
}

.sm-photo { margin: 0; position: relative; }
.sm-photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--sm-radius); display: block; position: relative; z-index: 1; }
.sm-photo--accent::before { content: ""; position: absolute; right: -18px; bottom: -18px; width: 45%; height: 55%; border-radius: var(--sm-radius); background: var(--sm-navy); z-index: 0; }
.sm-photo--accent::after { content: ""; position: absolute; left: -14px; top: -14px; width: 70px; height: 70px; border-radius: 10px; border: 2px solid var(--sm-red); z-index: 0; }

/* ---------- cards ---------- */
.sm-card, .sm-service {
	position: relative; background: #fff; border: 1px solid var(--sm-line); border-radius: var(--sm-radius); padding: 2rem 1.75rem 1.75rem;
	transition: transform .25s var(--sm-ease), box-shadow .25s var(--sm-ease), border-color .25s;
}
.sm-card:hover, .sm-service:hover { transform: translateY(-4px); box-shadow: var(--sm-shadow); border-color: #c9cee6; }
.sm-card::before, .sm-service::before, .sm-info::before {
	content: ""; display: block; width: 52px; height: 52px; border-radius: 12px; background: var(--sm-tint); margin-bottom: 1.25rem; transition: background .25s;
}
.sm-card::after, .sm-service::after, .sm-info::after {
	content: ""; position: absolute; width: 26px; height: 26px; background: var(--sm-navy); transition: background .25s;
	-webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat;
}
.sm-card::after, .sm-service::after { left: calc(1.75rem + 13px); top: calc(2rem + 13px); }
.sm-card:hover::before, .sm-service:hover::before { background: var(--sm-navy); }
.sm-card:hover::after, .sm-service:hover::after { background: #fff; }
.sm-card__title { font-size: 1.3rem; margin-block: 0 0.6rem; }
.sm-card__title a { color: var(--sm-ink); }
.sm-card__title a:hover { color: var(--sm-red); }
.sm-card p { color: var(--sm-slate); font-size: 0.96rem; margin-block: 0; }
.sm-cards--plain .sm-card:hover { transform: none; }

.sm-service { scroll-margin-top: 130px; padding: 2.25rem 2rem 2rem; }
.sm-service::after { left: calc(2rem + 13px); top: calc(2.25rem + 13px); }
.sm-service .sm-card__title { font-size: 1.5rem; }
.sm-service p { color: var(--sm-slate); margin-block: 0.6rem 0; }
.sm-service .sm-service__summary { color: var(--sm-ink); font-weight: 500; font-size: 1.05rem; }
.sm-service:target { border-color: var(--sm-red); box-shadow: 0 0 0 3px rgba(227, 27, 35, 0.12), var(--sm-shadow); }

/* ---------- steps ---------- */
.sm-steps, .sm-numbered { counter-reset: sm-step; margin-top: 1.75rem; }
.sm-step { counter-increment: sm-step; border-top: 2px solid var(--sm-line); }
.sm-step::before { content: counter(sm-step, decimal-leading-zero); display: block; width: 36px; margin-top: -2px; padding-top: 0.9rem; border-top: 2px solid var(--sm-red); font-family: var(--wp--preset--font-family--serif); font-size: 0.95rem; font-weight: 600; color: var(--sm-red); }
.sm-step h4 { margin: 0.35rem 0 0.4rem !important; }
.sm-step p { color: var(--sm-slate); font-size: 0.96rem; margin: 0; }
.sm-numbered .sm-step { background: var(--sm-mist); border-radius: 0 0 var(--sm-radius) var(--sm-radius); padding: 0 1.5rem 1.5rem; }

/* ---------- mission band ---------- */
.sm-band--navy { position: relative; overflow: hidden; background: var(--sm-navy) radial-gradient(800px 400px at 100% 0%, rgba(255, 255, 255, 0.09), transparent 70%); }
.sm-band--navy::after { content: ""; position: absolute; right: -120px; bottom: -160px; width: 420px; height: 420px; border-radius: 50%; border: 60px solid rgba(255, 255, 255, 0.04); }
.sm-mission { border: 0 !important; padding: 0 !important; margin-top: 1.25rem !important; position: relative; }
.sm-mission p { font-family: var(--wp--preset--font-family--serif); font-size: clamp(1.6rem, 3.2vw, 2.4rem); line-height: 1.3; font-weight: 500; color: #fff; }
.sm-mission::before { content: "\201C"; display: block; font-family: var(--wp--preset--font-family--serif); font-size: 5rem; line-height: 0.6; color: var(--sm-red); margin-bottom: 0.75rem; }

/* ---------- people ---------- */
.sm-person { gap: 1.5rem !important; padding: 1.5rem; border: 1px solid var(--sm-line); border-radius: var(--sm-radius); background: #fff; }
.sm-person__photo { margin: 0; flex-shrink: 0; }
.sm-person__photo img { width: 112px; height: 112px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 4px #fff, 0 0 0 6px var(--sm-tint); }
.sm-person__name { font-size: 1.35rem; margin: 0; }
.sm-person__role { margin: 0.2rem 0 0.5rem; font-size: 0.8rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--sm-red); }
.sm-person__text p:last-child { color: var(--sm-slate); font-size: 0.95rem; margin: 0; }
.sm-section > .sm-more { margin-top: 2rem; }

.sm-profile { padding: 2rem; border: 1px solid var(--sm-line); border-radius: var(--sm-radius); margin-bottom: 1.5rem; }
.sm-profile__cols { gap: clamp(1.5rem, 4vw, 3rem) !important; margin: 0; }
.sm-profile__photo { margin: 0; }
.sm-profile__photo img { width: 100%; max-width: 280px; aspect-ratio: 1; object-fit: cover; border-radius: var(--sm-radius); }
.sm-profile h2 { margin-block: 0.5rem 1rem; font-size: var(--wp--preset--font-size--x-large); }
.sm-profile p { color: var(--sm-slate); }
.sm-profile .sm-lead { color: var(--sm-ink); font-size: 1.1rem; }
.sm-contactline { margin-top: 1.25rem; padding-top: 1.25rem; border-top: 1px solid var(--sm-line); font-weight: 500; }
.sm-contactline a { text-decoration: none; }
.sm-note { background: var(--sm-mist); border-left: 4px solid var(--sm-red); border-radius: 0 var(--sm-radius) var(--sm-radius) 0; padding: 1.5rem 1.75rem; }
.sm-note h4 { margin: 0 0 0.35rem; }
.sm-note p { margin: 0; color: var(--sm-slate); }

/* ---------- call to action ---------- */
.sm-cta { padding-block: 0 var(--wp--preset--spacing--60); }
.sm-cta__cols { border-radius: calc(var(--sm-radius) + 4px); overflow: hidden; margin: 0; box-shadow: var(--sm-shadow); }
.sm-cta__photo { position: relative; min-height: 280px; }
.sm-cover-img { margin: 0; position: absolute; inset: 0; }
.sm-cover-img img { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; }
.sm-cta__body { padding: clamp(2rem, 5vw, 3.75rem) !important; background-image: radial-gradient(600px 300px at 100% 100%, rgba(227, 27, 35, 0.18), transparent 70%); }
.sm-cta__body h2 { font-size: clamp(1.7rem, 3vw, 2.3rem); margin-block: 0.75rem 1rem; }
.sm-cta__text { color: rgba(255, 255, 255, 0.82); margin-bottom: 1.75rem; }
@media (max-width: 781px) { .sm-cta__photo { min-height: 260px; } }

/* ---------- contact ---------- */
.sm-contact { gap: clamp(2rem, 5vw, 4rem) !important; }
.sm-contact__info { display: grid; gap: 1rem; align-content: start; }
.sm-info { position: relative; padding: 1.5rem 1.5rem 1.5rem 5.25rem; border: 1px solid var(--sm-line); border-radius: var(--sm-radius); }
.sm-info::before { position: absolute; left: 1.5rem; top: 1.5rem; width: 44px; height: 44px; margin: 0; }
.sm-info::after { left: calc(1.5rem + 11px); top: calc(1.5rem + 11px); width: 22px; height: 22px; }
.sm-info h4 { margin: 0 0 0.25rem; font-size: 1rem; }
.sm-info p { margin: 0; color: var(--sm-slate); font-size: 0.95rem; overflow-wrap: anywhere; }
.sm-info a { text-decoration: none; }
.sm-contact__form { background: #fff; border: 1px solid var(--sm-line); border-radius: var(--sm-radius); box-shadow: var(--sm-shadow); padding: clamp(1.5rem, 4vw, 2.5rem) !important; }
.sm-contact__form h3 { margin: 0 0 0.35rem; }
.sm-map { margin-bottom: var(--wp--preset--spacing--60) !important; }
.sm-map iframe { display: block; width: 100%; height: 420px; border: 0; border-radius: var(--sm-radius); filter: grayscale(0.25); }

/* form (rendered by the Simeon & Mathews Site plugin) */
.sm-form { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem 1.25rem; margin-top: 1.5rem; }
.sm-form .sm-field { display: grid; gap: 0.4rem; }
.sm-form .sm-field--full { grid-column: 1 / -1; }
.sm-form label { font-size: 0.85rem; font-weight: 600; color: var(--sm-ink); }
.sm-form input, .sm-form select, .sm-form textarea {
	width: 100%; font: inherit; font-size: 0.97rem; color: var(--sm-ink); background: var(--sm-mist); border: 1px solid var(--sm-line); border-radius: 8px; padding: 0.8rem 0.95rem;
	transition: border-color .18s, background .18s, box-shadow .18s;
}
.sm-form textarea { min-height: 150px; resize: vertical; }
.sm-form input:focus, .sm-form select:focus, .sm-form textarea:focus { outline: none; background: #fff; border-color: var(--sm-navy); box-shadow: 0 0 0 3px rgba(30, 37, 119, 0.12); }
.sm-form .sm-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.sm-form button {
	grid-column: 1 / -1; justify-self: start; font: inherit; font-weight: 600; font-size: 0.95rem; color: #fff; background: var(--sm-red); border: 0; border-radius: 6px; padding: 0.95rem 1.75rem; cursor: pointer;
	transition: background .18s, transform .18s;
}
.sm-form button:hover { background: var(--sm-red-dark); transform: translateY(-1px); }
.sm-form__note { grid-column: 1 / -1; font-size: 0.8rem; color: var(--sm-slate); margin: 0; }
.sm-alert { padding: 1rem 1.25rem; border-radius: 8px; margin-top: 1.25rem; font-weight: 500; }
.sm-alert--ok { background: #e8f6ef; color: #0d6b3f; border: 1px solid #b9e3cc; }
.sm-alert--err { background: #fdecec; color: #9b1c22; border: 1px solid #f4c4c6; }
@media (max-width: 600px) { .sm-form { grid-template-columns: 1fr; } }

/* ---------- footer ---------- */
.sm-footer { font-size: 0.93rem; }
.sm-footer a { color: rgba(255, 255, 255, 0.78); text-decoration: none; }
.sm-footer a:hover { color: #fff; }
.sm-footer__cols { gap: clamp(2rem, 4vw, 3.5rem) !important; }
.sm-brand--light { gap: 0.75rem; margin-bottom: 1.25rem; }
.sm-brand--light .wp-block-site-title { color: #fff; font-size: 1.35rem; }
.sm-footer__mark { margin: 0; }
.sm-footer__about { color: rgba(255, 255, 255, 0.7); max-width: 36ch; }
.sm-footer__title { font-family: var(--wp--preset--font-family--sans); font-size: 0.75rem !important; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: #fff; margin: 0.4rem 0 1.1rem; }
.sm-footer__links { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.6rem; }
.sm-footer__contact { color: rgba(255, 255, 255, 0.7); margin: 0 0 1rem; overflow-wrap: anywhere; }
.sm-footer__base { margin-top: var(--wp--preset--spacing--50) !important; padding-top: 1.5rem; border-top: 1px solid rgba(255, 255, 255, 0.12); font-size: 0.82rem; color: rgba(255, 255, 255, 0.55); }
.sm-footer__base p { margin: 0; }

/* ---------- motion ---------- */
@media (prefers-reduced-motion: no-preference) {
	.sm-reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s var(--sm-ease), transform .7s var(--sm-ease); }
	.sm-reveal.is-in { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	* { transition: none !important; }
}
