/*
 * Layout: header, footer, page titles, hero and section patterns.
 */

/* ---------- header ---------- */
#masthead .site-main-header-wrap .site-header-row-container-inner,
#masthead .site-header-row-container-inner {
	background: color-mix(in srgb, var(--sgc-bg) 92%, transparent);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border-bottom: 1px solid var(--sgc-line);
}
#masthead .kadence-sticky-header.item-is-fixed,
#masthead .kadence-sticky-header.item-is-fixed .site-header-row-container-inner { background: color-mix(in srgb, var(--sgc-bg) 92%, transparent) !important; }

.sgc-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: inherit; }
.sgc-brand:hover { color: inherit; }
.sgc-brand-mark {
	width: 40px; height: 40px; border-radius: 12px; flex-shrink: 0;
	display: grid; place-items: center;
	background: var(--sgc-brand); color: var(--sgc-on-brand);
	font-weight: 900; font-size: 1.05rem; line-height: 1;
}
.sgc-brand-name { font-weight: 900; font-size: 1.15rem; line-height: 1; color: var(--sgc-heading); letter-spacing: -.01em; }
.sgc-brand-name small {
	display: block; margin-top: 3px;
	font-family: var(--sgc-font-body); font-weight: 700; font-size: .62rem;
	letter-spacing: .14em; text-transform: uppercase; color: var(--sgc-brand);
}

/* Primary menu: quiet pills, current page on surface 2. */
.main-navigation .primary-menu-container > ul > li.menu-item > a {
	padding: 8px 12px;
	margin: 0 2px;
	border-radius: 10px;
	font-weight: 600;
	font-size: .88rem;
	color: var(--sgc-muted);
	text-decoration: none;
}
.main-navigation .primary-menu-container > ul > li.menu-item > a:hover,
.main-navigation .primary-menu-container > ul > li.menu-item.current-menu-item > a,
.main-navigation .primary-menu-container > ul > li.menu-item.current-menu-ancestor > a,
.main-navigation .primary-menu-container > ul > li.menu-item.current_page_parent > a {
	color: var(--sgc-heading);
	background: var(--sgc-surface-2);
}

/* Account button (header HTML element). */
.header-html, .mobile-html { margin: 0; }
.header-html-inner > p, .mobile-html-inner > p { margin: 0; }
.sgc-acct {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 6px 14px 6px 6px;
	border: 1px solid var(--sgc-line); border-radius: 12px;
	background: var(--sgc-surface);
	color: var(--sgc-heading); text-decoration: none;
	font-weight: 600; font-size: .92rem; line-height: 1;
	white-space: nowrap;
}
.sgc-acct, .sgc-acct:hover, .sgc-acct:focus { text-decoration: none !important; }
.sgc-acct:hover { color: var(--sgc-heading); border-color: var(--sgc-brand); }
.sgc-avatar {
	width: 28px; height: 28px; border-radius: 50%;
	display: grid; place-items: center;
	background: var(--sgc-accent-soft); color: var(--sgc-brand);
	font-weight: 800; font-size: .8rem;
}
.site-header-main-section-right .site-header-item + .site-header-item { margin-left: 12px; }

/* Mobile: icon-only account button, Menu pill. */
@media (max-width: 1024px) {
	.sgc-acct { padding: 6px; }
	.sgc-acct-label {
		position: absolute !important; width: 1px; height: 1px; overflow: hidden;
		clip: rect(1px, 1px, 1px, 1px); white-space: nowrap;
	}
	.mobile-html { margin-right: 8px; }
	.sgc-brand-mark { width: 36px; height: 36px; font-size: .95rem; }
	.sgc-brand-name { font-size: 1.05rem; }
}
@media (max-width: 420px) {
	.sgc-brand-name small { font-size: .55rem; letter-spacing: .08em; white-space: nowrap; }
}
.menu-toggle-open {
	border: 1px solid var(--sgc-line) !important;
	border-radius: 999px !important;
	padding: 8px 14px !important;
	color: var(--sgc-heading) !important;
	background: transparent !important;
	font-weight: 600;
	box-shadow: none !important;
}
.menu-toggle-open .menu-toggle-label { font-size: .88rem; text-transform: none; letter-spacing: 0; }
#mobile-drawer .drawer-inner { background: var(--sgc-bg); color: var(--sgc-ink); }
#mobile-drawer .drawer-header .drawer-toggle { color: var(--sgc-heading); background: transparent; box-shadow: none; }
.mobile-navigation ul li > a,
.mobile-navigation ul li.menu-item-has-children > .drawer-nav-drop-wrap {
	color: var(--sgc-heading);
	font-weight: 600;
	padding: 14px 4px;
	border-bottom: 1px solid var(--sgc-line);
}
.mobile-navigation ul li.current-menu-item > a { color: var(--sgc-brand); }

/* ---------- page titles (in content) ---------- */
.entry-hero + .content-area, .content-area { margin-top: 0; }
.entry-header .entry-title,
.page-title,
.wp-site-blocks h1.wp-block-post-title {
	font-family: var(--sgc-font-display);
	font-weight: 800;
	font-size: clamp(2.4rem, 5.4vw, 4rem);
	line-height: 1.02;
	letter-spacing: -.02em;
	color: var(--sgc-heading);
}
.content-area { margin-top: 48px; margin-bottom: 64px; }
.home .content-area, .sgc-full-bleed .content-area { margin-top: 0; }
.entry-content-wrap { padding: 0; }
.content-bg, .entry.content-bg { background: transparent; box-shadow: none; }

/* ---------- footer ---------- */
#colophon .site-bottom-footer-wrap .site-footer-row-container-inner {
	background: transparent;
	border-top: 1px solid var(--sgc-line);
}
#colophon .site-footer-row-container-inner { padding-top: 40px; padding-bottom: 40px; }
#colophon .footer-html { font-size: .9rem; color: var(--sgc-ink); }
#colophon .footer-html strong { font-family: var(--sgc-font-body); color: var(--sgc-ink); }
#colophon .footer-html .sgc-muted { display: inline-block; margin-top: 6px; color: var(--sgc-muted); font-size: .875rem; }
#colophon .footer-navigation ul { gap: 18px; justify-content: flex-end; }
@media (min-width: 768px) {
	#colophon .site-footer-bottom-section-2 { justify-content: flex-end; }
}
#colophon .footer-navigation .menu > li > a { color: var(--sgc-muted); font-size: .9rem; padding: 4px 0; text-decoration: underline; text-underline-offset: 3px; }
#colophon .footer-navigation .menu > li > a:hover { color: var(--sgc-heading); }
@media (max-width: 767px) {
	#colophon .footer-navigation ul { justify-content: flex-start; flex-wrap: wrap; }
	#colophon .site-bottom-footer-inner-wrap { gap: 20px; }
}

/* ---------- hero (pattern: "SGC hero") ---------- */
.sgc-hero {
	background-color: var(--sgc-hero-bg) !important;
	background-image: var(--sgc-dots);
	background-size: var(--sgc-dots-size);
	color: var(--sgc-hero-ink);
}
.sgc-hero h1, .sgc-hero h2, .sgc-hero h3, .sgc-hero .wp-block-heading { color: var(--sgc-hero-ink); }
.sgc-hero h1 { font-weight: 900; font-size: clamp(2.8rem, 6.6vw, 5.6rem); line-height: 1.02; }
.sgc-hero .sgc-hero-line2 { display: block; color: var(--sgc-hero-accent); }
.sgc-hero p { color: var(--sgc-hero-soft); font-size: 1.1rem; max-width: 46ch; }
.sgc-hero a { color: var(--sgc-hero-ink); }

/* Path links inside the hero: big Outfit label, sub-line, arrow. */
.sgc-paths { border-top: 1px solid var(--sgc-hero-line); margin: 0 !important; padding: 0 !important; list-style: none; }
.sgc-paths li { margin: 0; }
.sgc-paths a {
	display: grid; grid-template-columns: 1fr auto; gap: 6px 16px; align-items: center;
	padding: 20px 4px; border-bottom: 1px solid var(--sgc-hero-line);
	color: var(--sgc-hero-ink); text-decoration: none;
	font-family: var(--sgc-font-display); font-weight: 700; font-size: 1.4rem; line-height: 1.2;
}
.sgc-paths a::after {
	content: ""; grid-row: 1 / 3; grid-column: 2; width: 22px; height: 22px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
	transition: transform .2s;
}
.sgc-paths a:hover { color: var(--sgc-hero-accent); }
.sgc-paths a:hover::after { transform: translateX(4px); }
.sgc-paths a span { grid-column: 1; font-family: var(--sgc-font-body); font-weight: 400; font-size: .95rem; color: var(--sgc-merlot-tint); }

/* Dot-grid tile (coach photo placeholder): deep bone with line-coloured dots. */
.sgc-dot-art {
	background-color: var(--sgc-tile-bg);
	background-image: radial-gradient(var(--sgc-tile-dot) 1.2px, transparent 1.2px);
	background-size: 22px 22px;
	color: var(--sgc-merlot);
	border-radius: var(--sgc-radius-card);
}

/* ---------- sections ---------- */
.sgc-section { padding-top: 72px; padding-bottom: 72px; }
.sgc-section.is-tinted { background: var(--sgc-surface-2); }
.sgc-creds { display: flex; flex-wrap: wrap; gap: 10px 28px; padding: 18px 0; border-bottom: 1px solid var(--sgc-line); font-size: .92rem; color: var(--sgc-muted); }
.sgc-creds > * { margin: 0 !important; }
.sgc-creds strong, .sgc-creds b { color: var(--sgc-ink); font-weight: 650; }

/* Three studios row. */
.sgc-locs { border-top: 2px solid var(--sgc-brand); gap: 0 !important; }
.sgc-locs > .wp-block-column { padding: 22px 22px 22px 0; border-right: 1px solid var(--sgc-line); }
.sgc-locs > .wp-block-column + .wp-block-column { padding-left: 22px; }
.sgc-locs > .wp-block-column:last-child { border-right: 0; }
@media (max-width: 781px) {
	.sgc-locs > .wp-block-column, .sgc-locs > .wp-block-column + .wp-block-column { padding: 20px 0; border-right: 0; border-bottom: 1px solid var(--sgc-line); }
}

/* Membership tier card (the featured, "Most popular" one is merlot). */
.sgc-tier { display: flex; flex-direction: column; gap: 14px; }
.sgc-tier.is-featured { background: var(--sgc-hero-bg); border-color: var(--sgc-hero-bg); color: var(--sgc-hero-ink); }
.sgc-tier.is-featured :is(h2, h3, .sgc-price) { color: var(--sgc-hero-ink); }
.sgc-tier.is-featured .sgc-muted { color: var(--sgc-merlot-tint); }
.sgc-tier.is-featured .wp-block-button__link, .sgc-tier.is-featured .sgc-btn { background: var(--sgc-bone-light); border-color: var(--sgc-bone-light); color: var(--sgc-merlot); }
.sgc-tier.is-featured .wp-block-button__link:hover, .sgc-tier.is-featured .sgc-btn:hover { background: var(--sgc-bone-deep); border-color: var(--sgc-bone-deep); color: var(--sgc-merlot-shade); }

/* Full-bleed sections keep their content on the site grid. */
.sgc-hero > *,
.sgc-section > * {
	box-sizing: border-box;
	max-width: var(--global-content-width, 1180px);
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: var(--global-content-edge-padding, 1.25rem);
	padding-right: var(--global-content-edge-padding, 1.25rem);
}
.sgc-section.is-flush-top { padding-top: 0; }
@media (max-width: 781px) {
	.sgc-hero > .wp-block-columns { padding-top: 48px !important; padding-bottom: 40px !important; gap: 36px; }
}

/* Block editor alignment helpers on unboxed pages. */
.entry-content > .alignfull.sgc-hero,
.entry-content > .alignfull.sgc-section { margin-top: 0; margin-bottom: 0; }

/* Keyboard focus on merlot surfaces (hero, featured tier): a light ring, since the usual merlot ring wouldn't show. */
.sgc-hero :focus-visible, .sgc-tier.is-featured :focus-visible { outline-color: var(--sgc-bone-light) !important; }

/* Language switch (sgc-core [sgc_lang_switch]): "EN | BM" beside the account link; full names
   at the end of the mobile menu. */
.sgc-head-tools { display: flex; align-items: center; gap: 14px; }
.sgc-lang { display: inline-flex; align-items: center; gap: 6px; font-size: .75rem; font-weight: 700; letter-spacing: .06em; }
.sgc-lang__item { color: var(--sgc-muted); text-decoration: none !important; padding: 4px 2px; border-radius: 4px; }
.sgc-lang__item abbr { text-decoration: none; }
a.sgc-lang__item:hover { color: var(--sgc-heading); text-decoration: underline !important; }
a.sgc-lang__item:focus-visible { outline: 3px solid var(--sgc-brand); outline-offset: 2px; }
.sgc-lang__item.is-current { color: var(--sgc-heading); }
.sgc-lang__sep { color: var(--sgc-line-strong, var(--sgc-muted)); font-weight: 400; }
.sgc-lang--full { display: flex; flex-direction: column; align-items: stretch; gap: 0; font-size: 1rem; letter-spacing: 0; padding: 12px 0; border-top: 1px solid var(--sgc-line); }
.sgc-lang--full .sgc-lang__item { padding: 10px 0; font-weight: 600; }
.sgc-lang--full .sgc-lang__item.is-current::after { content: " ✓"; }

/* ---------- prototype polish (21 Oct 2026) ---------- */
/* Page intros: close under the title and no wider than the prototype's 60 characters. */
.entry-header.page-title, .entry-header.courses-archive-title { margin-bottom: 0; }
.single-content > p.sgc-muted:first-child, .sgc-academy-intro { margin-top: 12px; max-width: 60ch; }
/* Online academy: intro, notice and cards line up with the title. */
.course-archive-page.tutor-container { padding-left: 0; padding-right: 0; }
.course-archive-page > .tutor-row { margin-left: 0; margin-right: 0; }
.course-archive-page > .tutor-row > .tutor-col-12 { padding-left: 0; padding-right: 0; }

/* Home: studio links as bold merlot links. */
.sgc-locs .sgc-small a { color: var(--sgc-brand); font-weight: 700; text-decoration: none; }
.sgc-locs .sgc-small a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Outline buttons the same size as filled ones (core's outline style is more specific). */
.wp-block-button.is-style-outline > .wp-block-button__link { padding: 13px 22px; border-width: 1.5px; font-size: .78rem; }

/* Coach tile: the plate rings, as on the course cards. */
.sgc-dot-art { position: relative; overflow: hidden; }
.sgc-dot-art::before {
	content: "";
	position: absolute;
	top: -40px;
	right: -60px;
	width: 300px;
	height: 300px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Ccircle cx='100' cy='100' r='92' fill='none' stroke='%23DDD2C1' stroke-width='16'/%3E%3Ccircle cx='100' cy='100' r='58' fill='none' stroke='%236B1F35' stroke-width='2' opacity='.25'/%3E%3Ccircle cx='100' cy='100' r='14' fill='%236B1F35' opacity='.2'/%3E%3C/svg%3E") no-repeat center / contain;
	pointer-events: none;
}
.sgc-dot-art > * { position: relative; }
.wp-block-columns:has(> .wp-block-column > .sgc-dot-art) p { max-width: 58ch; }