/*
Theme Name: Glamritz
Theme URI: https://glamritzaestheticclinic.com
Description: Block theme for Glamritz Aesthetic Clinic — by dr. Amelia Budiman, M. Biomed. Brand palette: espresso, rose brown, dusty rose, mauve pink, ivory. Fonts: DM Serif Display + Montserrat (Proxima Nova substitute). Signature motif: the chamfered gold frame from the clinic's interior.
Version: 2.0.9
Requires at least: 6.6
Requires PHP: 8.1
License: GNU General Public License v2 or later
Text Domain: glamritz
*/

/* ===== Tokens ===== */
:root {
	--glam-oct: polygon(14% 0, 86% 0, 100% 9%, 100% 91%, 86% 100%, 14% 100%, 0 91%, 0 9%);
	--glam-rule: rgba(103, 62, 56, .16);
	--glam-frame-bg: var(--wp--preset--color--ivory);
	--glam-header-h: 84px;
}

/* ===== Base ===== */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
::selection { background: #D6BDC3; color: #673E38; }
img { height: auto; }
p { text-wrap: pretty; }
h1, h2, h3 { text-wrap: balance; }
.has-text-align-center { margin-left: auto; margin-right: auto; }
[id] { scroll-margin-top: calc(var(--glam-header-h) + 40px); }

/* Visible keyboard focus everywhere */
a:focus-visible,
button:focus-visible,
.wp-element-button:focus-visible,
input:focus-visible,
textarea:focus-visible {
	outline: 2px solid var(--wp--preset--color--rose);
	outline-offset: 3px;
	border-radius: 2px;
}

/* ===== Quiet labels (block style "Eyebrow"): sentence-case serif italic, never tracked caps ===== */
.is-style-eyebrow {
	font-family: var(--wp--preset--font-family--display);
	font-style: italic;
	font-size: 1.05rem !important;
	letter-spacing: 0;
	text-transform: none;
	color: var(--wp--preset--color--rose);
	margin-bottom: .4rem !important;
}

/* ===== Signature frame: chamfered photo + offset hairline, from the clinic's gold partition frames ===== */
.is-style-frame { position: relative; isolation: isolate; margin: 0 22px 22px 0 !important; }
.is-style-frame img { clip-path: var(--glam-oct); display: block; width: 100%; object-fit: cover; }
.is-style-frame::before,
.is-style-frame::after {
	content: "";
	position: absolute;
	clip-path: var(--glam-oct);
	pointer-events: none;
}
.is-style-frame::before { inset: 22px -22px -22px 22px; background: var(--wp--preset--color--dusty); z-index: -2; }
.is-style-frame::after { inset: 23px -21px -21px 23px; background: var(--glam-frame-bg); z-index: -1; }
.has-blush-background-color { --glam-frame-bg: var(--wp--preset--color--blush); }
.has-white-background-color { --glam-frame-bg: #fff; }
@media (max-width: 600px) {
	.is-style-frame { margin: 0 14px 14px 0 !important; }
	.is-style-frame::before { inset: 14px -14px -14px 14px; }
	.is-style-frame::after { inset: 15px -13px -13px 15px; }
}

/* Legacy arch style (kept for editors) */
.is-style-arch img { border-radius: 999px 999px 0 0; object-fit: cover; }

/* Block style "Ornament" now renders as a short quiet rule */
.is-style-ornament { border: 0 !important; border-top: 1px solid var(--wp--preset--color--dusty) !important; max-width: 64px !important; margin-left: 0 !important; opacity: 1 !important; background: none !important; height: 0 !important; }

/* ===== Header ===== */
.glam-topbar { font-size: .78rem; letter-spacing: .01em; }
.glam-topbar a { color: inherit; }
.glam-topbar a:hover { color: #fff; text-decoration: none; }
.glam-header {
	position: sticky; top: 0; z-index: 60;
	isolation: isolate;
	border-bottom: 1px solid var(--glam-rule);
}
/* The blur lives on a pseudo-element: backdrop-filter on the header itself would become the containing
   block for the fixed-position mobile menu and trap it inside the 80px bar. */
.glam-header::before {
	content: "";
	position: absolute; inset: 0; z-index: -1;
	background: rgba(246, 242, 242, .94);
	-webkit-backdrop-filter: saturate(140%) blur(10px);
	backdrop-filter: saturate(140%) blur(10px);
}
.admin-bar .glam-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .glam-header { top: 46px; } }
.glam-brand { gap: .85rem !important; }
.glam-brand .wp-block-site-logo { flex-shrink: 0; }
.glam-brand .wp-block-site-logo img { width: 46px; height: auto; }
.glam-brand .wp-block-site-title { margin: 0; }
.glam-byline {
	font-family: var(--wp--preset--font-family--display);
	font-style: italic;
	font-size: .9rem !important;
	color: var(--wp--preset--color--rose);
	margin: .3rem 0 0 !important;
	line-height: 1.2;
	white-space: nowrap;
}
.glam-header .wp-block-navigation__container { flex-wrap: nowrap !important; }
.glam-header .wp-block-navigation-item,
.glam-header .wp-block-navigation-item__content,
.glam-header-cta .wp-block-button__link { white-space: nowrap; }
.glam-header .wp-block-navigation .wp-block-navigation-item__content { padding: .35rem 0; text-underline-offset: .4em; text-decoration-thickness: 1px; }
.glam-header .wp-block-navigation .wp-block-navigation-item__content:hover,
.glam-header .wp-block-navigation .current-menu-item > .wp-block-navigation-item__content { color: var(--wp--preset--color--rose); text-decoration: underline; }
.glam-header .wp-block-navigation__submenu-container {
	border: 1px solid var(--glam-rule) !important;
	padding: .6rem 1.1rem !important;
	min-width: 280px !important;
	background: var(--wp--preset--color--ivory) !important;
}
.glam-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding: .45rem 0 !important; }
.glam-header .wp-block-navigation__responsive-container.is-menu-open { background: var(--wp--preset--color--ivory) !important; padding: 2rem !important; }
.glam-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { flex-wrap: wrap !important; }
.glam-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { gap: 1.1rem; font-size: 1.05rem; }
.glam-header .wp-block-navigation__responsive-container-open svg { width: 30px; height: 30px; }
@media (min-width: 600px) and (max-width: 1199px) {
	.glam-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex !important; }
	.glam-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none !important; }
}
@media (max-width: 1199px) {
	.glam-topbar { display: none !important; }
	.glam-header-cta { display: none !important; }
}
@media (max-width: 600px) {
	.glam-brand .wp-block-site-title { font-size: 1.2rem !important; letter-spacing: .24em !important; }
	.glam-byline { font-size: .78rem !important; }
	.glam-brand .wp-block-site-logo img { width: 36px; }
}

/* ===== Hero (split: type left, framed interior right) ===== */
.glam-hero2 { overflow: hidden; }
.glam-hero2 h1 {
	font-size: clamp(3.4rem, 7.2vw, 6.6rem) !important;
	line-height: .95 !important;
	letter-spacing: -.012em;
	margin: 0;
}
.glam-hero2 .glam-hero-by {
	font-family: var(--wp--preset--font-family--display);
	font-style: italic;
	font-size: clamp(1.25rem, 2vw, 1.6rem);
	color: var(--wp--preset--color--rose);
	margin-top: 1.4rem;
}
.glam-hero2 .glam-hero-lede { font-size: 1.0625rem; max-width: 44ch; }
.glam-hero2 .is-style-frame img { aspect-ratio: 4 / 5; }
@media (max-width: 781px) {
	.glam-hero2 .wp-block-columns { flex-direction: column-reverse; }
	.glam-hero2 .is-style-frame img { aspect-ratio: 4 / 3; }
}
@media (prefers-reduced-motion: no-preference) {
	.glam-hero2 .glam-hero-copy > * { animation: glamRise .9s cubic-bezier(.2,.7,.2,1) both; }
	.glam-hero2 .glam-hero-copy > *:nth-child(2) { animation-delay: .08s; }
	.glam-hero2 .glam-hero-copy > *:nth-child(3) { animation-delay: .16s; }
	.glam-hero2 .glam-hero-copy > *:nth-child(4) { animation-delay: .24s; }
	.glam-hero2 .is-style-frame img { animation: glamUnveil 1.4s .1s cubic-bezier(.65,0,.25,1) both; }
}
@keyframes glamRise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes glamUnveil { from { opacity: 0; transform: scale(1.04); } to { opacity: 1; transform: none; } }

/* ===== Doctor spotlight ===== */
.glam-doctor .is-style-frame img { aspect-ratio: 4 / 5; }
.glam-doctor h2 { margin-bottom: .2rem; }

/* ===== Lede sentence (replaces stat counters) ===== */
.glam-lede {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.5rem, 2.6vw, 2.1rem) !important;
	line-height: 1.3;
	color: var(--wp--preset--color--rose);
	border-left: 1px solid var(--wp--preset--color--dusty);
	padding-left: 1.4rem;
}

/* ===== Vision & mission ===== */
.glam-vision {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.6rem, 3vw, 2.4rem) !important;
	line-height: 1.25;
	max-width: 30ch !important;
}
.glam-mission { list-style: none; padding: 0; margin: 0; }
.glam-mission li { border-top: 1px solid var(--glam-rule); padding: 1rem 0; max-width: none !important; }
.glam-mission li:last-child { border-bottom: 1px solid var(--glam-rule); }

/* ===== Cards: flat, hairline, no hover theatre ===== */
.is-style-card {
	background: #fff;
	border: 1px solid var(--glam-rule);
	height: 100%;
	overflow: hidden;
}
.is-style-card .wp-block-image { margin: 0; }
.is-style-card .wp-block-image img { width: 100%; }
.glam-card-body { padding: 1.5rem 1.5rem 1.75rem; }
.glam-card-body h3 { margin: 0 0 .5rem; }
.glam-card-body p { margin: 0 0 1rem; font-size: .95rem; }
.glam-new-card { border-top: 2px solid var(--wp--preset--color--dusty) !important; }
.glam-new-card h3 { margin-top: 0; }
.glam-more a,
a.glam-more {
	font-size: .9rem;
	font-weight: 600;
	color: var(--wp--preset--color--rose);
	text-decoration: underline;
	text-underline-offset: .3em;
	text-decoration-thickness: 1px;
}
.glam-more a:hover { color: var(--wp--preset--color--espresso); }

/* Feature list (reasons): ruled list, no counters */
.glam-feature { border-top: 1px solid var(--glam-rule); padding-top: 1.25rem; }
.glam-feature h3 { font-size: 1.35rem; margin: 0 0 .45rem; }
.glam-feature p { font-size: .95rem; margin: 0; }
/* Steps keep their numbers: they are a real sequence */
.glam-steps .glam-num { font-family: var(--wp--preset--font-family--display); font-style: italic; font-size: 1.1rem; color: var(--wp--preset--color--rose); margin: 0 0 .6rem; letter-spacing: 0; }

/* ===== Buttons ===== */
.wp-block-button.is-style-outline > .wp-block-button__link { background: transparent; color: var(--wp--preset--color--rose); border-color: currentColor; }
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--wp--preset--color--rose); color: #fff; border-color: var(--wp--preset--color--rose); }
.glam-on-dark .wp-block-button.is-style-outline > .wp-block-button__link { color: #fff; border-color: rgba(255,255,255,.7); }
.glam-on-dark .wp-block-button.is-style-outline > .wp-block-button__link:hover { background: #fff; color: var(--wp--preset--color--espresso); border-color: #fff; }
.glam-btn-light > .wp-block-button__link { background: var(--wp--preset--color--ivory) !important; color: var(--wp--preset--color--espresso) !important; border-color: var(--wp--preset--color--ivory) !important; }
.glam-btn-light > .wp-block-button__link:hover { background: var(--wp--preset--color--mauve) !important; border-color: var(--wp--preset--color--mauve) !important; }

/* ===== Before / After placeholders ===== */
.glam-ba-item {
	aspect-ratio: 4 / 5;
	display: flex; align-items: center; justify-content: center;
	background:
		linear-gradient(90deg, transparent calc(50% - .5px), #fff calc(50% - .5px), #fff calc(50% + .5px), transparent calc(50% + .5px)),
		var(--wp--preset--color--blush);
	position: relative;
}
.glam-ba-item::before, .glam-ba-item::after {
	position: absolute; top: 1rem; font-size: .8rem; font-weight: 600;
	color: var(--wp--preset--color--rose); background: #fff; padding: .3rem .75rem; border-radius: 999px;
}
.glam-ba-item::before { content: "Before"; left: 1rem; }
.glam-ba-item::after { content: "After"; right: 1rem; }
.glam-ba-ph { text-align: center; font-family: var(--wp--preset--font-family--display); font-style: italic; color: var(--wp--preset--color--rose); background: rgba(255,255,255,.9); padding: .8rem 1.2rem; margin: 0; }

/* ===== Gallery & posts ===== */
.glam-gallery.wp-block-gallery .wp-block-image { overflow: hidden; }
.glam-posts .wp-block-post-featured-image { margin-bottom: 1rem; }
.glam-posts .wp-block-post-title { font-size: 1.3rem; margin: .4rem 0 .5rem; }
.glam-posts .wp-block-post-excerpt { font-size: .95rem; }

/* ===== Page title band ===== */
.glam-page-hero { border-bottom: 1px solid var(--glam-rule); }
.glam-page-hero .wp-block-post-title,
.glam-page-hero h1 { margin: 0; }

/* ===== Content helpers ===== */
.glam-note { border-left: 1px solid var(--wp--preset--color--dusty); padding: .2rem 0 .2rem 1.1rem; font-size: .9rem; font-style: italic; color: var(--wp--preset--color--rose); }
.glam-map iframe { width: 100%; min-height: 420px; border: 0; display: block; }

/* ===== Footer ===== */
.glam-footer a { color: var(--wp--preset--color--mauve); }
.glam-footer a:hover { color: #fff; }
.glam-footer h4 { font-family: var(--wp--preset--font-family--display); font-style: italic; font-size: 1.15rem; font-weight: 400; color: var(--wp--preset--color--mauve); margin-bottom: 1rem; text-transform: none; letter-spacing: 0; }
.glam-footer p { font-size: .95rem; }
.glam-footer .wp-block-site-title a { color: #fff; }
.glam-footer-list p { margin: 0 0 .55rem !important; }

/* ===== Floating WhatsApp ===== */
.glam-wa {
	position: fixed; right: 22px; bottom: 22px; z-index: 80;
	display: inline-flex; align-items: center; gap: .55rem;
	padding: .75rem 1.15rem .75rem .9rem;
	border-radius: 999px;
	background: var(--wp--preset--color--rose);
	color: #fff !important;
	font-size: .9rem; font-weight: 600;
	box-shadow: 0 12px 30px -14px rgba(103, 62, 56, .7);
	transition: background .25s ease;
}
.glam-wa:hover { background: var(--wp--preset--color--espresso); text-decoration: none !important; }
.glam-wa svg { width: 22px; height: 22px; fill: currentColor; flex: none; }
@media (max-width: 600px) { .glam-wa span { display: none; } .glam-wa { padding: .85rem; } }
.glam-gap { display: inline-block; width: 1.6rem; }

/* Before/after galleries */
.glam-ba-gallery.wp-block-gallery { gap: 1rem; }
.glam-ba-gallery .wp-block-image img { border: 1px solid var(--glam-rule); background: #fff; }
.glam-ba-jump { display: flex; flex-wrap: wrap; gap: .6rem; }
.glam-ba-jump a { border: 1px solid var(--wp--preset--color--dusty); border-radius: 999px; padding: .35rem 1rem; font-size: .9rem; font-weight: 500; }
.glam-ba-jump a:hover { background: var(--wp--preset--color--rose); border-color: var(--wp--preset--color--rose); color: #fff; text-decoration: none; }
@media (max-width: 600px) { .glam-ba-gallery.wp-block-gallery.columns-3 > .wp-block-image { width: calc(50% - .5rem) !important; flex-grow: 0 !important; } }

/* Inner pages: one 1200px grid; running text anchored to its left edge at a readable measure */
.glam-page-content > p,
.glam-page-content > ul,
.glam-page-content > ol { max-width: 64ch !important; margin-left: max(0px, calc((100% - 1200px) / 2)) !important; }
.glam-page-content > .glam-ba-jump { max-width: none !important; }
.glam-doctor .glam-byline { font-size: 1.2rem !important; white-space: normal; margin-top: .5rem !important; }
.glam-lede { font-size: clamp(1.4rem, 2.2vw, 1.85rem) !important; }

/* ===== Mobile menu (overlay) ===== */
.glam-header .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--ivory) !important;
	padding: 1.25rem clamp(1.25rem, 6vw, 2.5rem) 2.5rem !important;
	overflow-y: auto;
}
.glam-header .is-menu-open .wp-block-navigation__responsive-container-close { top: 1.4rem; right: clamp(1.25rem, 6vw, 2.5rem); }
.glam-header .is-menu-open .wp-block-navigation__responsive-container-close svg { width: 30px; height: 30px; }
.glam-header .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 3.5rem !important; gap: 0 !important; align-items: stretch !important; }
.glam-header .is-menu-open .wp-block-navigation__container { gap: 0 !important; width: 100%; align-items: stretch !important; }
.glam-header .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item { border-bottom: 1px solid var(--glam-rule); padding: .55rem 0; width: 100%; align-items: flex-start !important; }
.glam-header .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.45rem !important;
	padding: .2rem 0 !important;
	text-decoration: none !important;
	color: var(--wp--preset--color--espresso);
}
.glam-header .is-menu-open .wp-block-navigation__submenu-container {
	border: 0 !important;
	background: transparent !important;
	min-width: 0 !important;
	padding: .15rem 0 .35rem .9rem !important;
	gap: 0 !important;
}
.glam-header .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	font-size: .98rem !important;
	padding: .3rem 0 !important;
	color: var(--wp--preset--color--rose);
	white-space: normal;
}
.glam-header .is-menu-open .wp-block-navigation__submenu-icon { display: none !important; }

.glam-header .is-menu-open .wp-block-navigation__submenu-container,
.glam-header .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item { align-items: flex-start !important; text-align: left !important; width: 100%; }
.has-modal-open .glam-wa { display: none !important; }

/* Per-treatment WhatsApp buttons */
.glam-wa-btn { margin-top: 1rem !important; }
.glam-wa-btn .wp-block-button__link { display: inline-flex; align-items: center; gap: .5em; font-size: .85rem; padding: .7em 1.3em; }
.glam-wa-btn .wp-block-button__link::before {
	content: ""; width: 1.15em; height: 1.15em; flex: none; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 3a13 13 0 0 0-11.2 19.6L3 29l6.6-1.7A13 13 0 1 0 16 3Zm0 23.6c-2 0-3.9-.5-5.6-1.5l-.4-.2-3.9 1 1-3.8-.2-.4A10.6 10.6 0 1 1 16 26.6Zm5.8-7.9c-.3-.2-1.9-.9-2.2-1-.3-.1-.5-.2-.7.2l-1 1.2c-.2.2-.4.2-.7.1-.3-.2-1.3-.5-2.6-1.6-1-.9-1.6-1.9-1.8-2.2-.2-.3 0-.5.1-.7l.5-.5.3-.5c.1-.2 0-.4 0-.6l-1-2.4c-.3-.6-.5-.5-.7-.6h-.6c-.2 0-.6.1-.9.4-.3.3-1.1 1.1-1.1 2.7s1.1 3 1.3 3.3c.2.2 2.2 3.4 5.4 4.8 2.7 1.1 3.2.9 3.8.8.6-.1 1.9-.8 2.2-1.5.3-.7.3-1.4.2-1.5-.1-.2-.3-.3-.6-.4Z'/%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 32 32'%3E%3Cpath d='M16 3a13 13 0 0 0-11.2 19.6L3 29l6.6-1.7A13 13 0 1 0 16 3Zm0 23.6c-2 0-3.9-.5-5.6-1.5l-.4-.2-3.9 1 1-3.8-.2-.4A10.6 10.6 0 1 1 16 26.6Zm5.8-7.9c-.3-.2-1.9-.9-2.2-1-.3-.1-.5-.2-.7.2l-1 1.2c-.2.2-.4.2-.7.1-.3-.2-1.3-.5-2.6-1.6-1-.9-1.6-1.9-1.8-2.2-.2-.3 0-.5.1-.7l.5-.5.3-.5c.1-.2 0-.4 0-.6l-1-2.4c-.3-.6-.5-.5-.7-.6h-.6c-.2 0-.6.1-.9.4-.3.3-1.1 1.1-1.1 2.7s1.1 3 1.3 3.3c.2.2 2.2 3.4 5.4 4.8 2.7 1.1 3.2.9 3.8.8.6-.1 1.9-.8 2.2-1.5.3-.7.3-1.4.2-1.5-.1-.2-.3-.3-.6-.4Z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.glam-card-body .glam-more { margin-bottom: 0 !important; }

.glam-wa-btn .wp-block-button__link { white-space: normal; text-align: left; line-height: 1.3; }
/* In cards the button spans the card; softer corners keep 2-line treatment names tidy */
.is-style-card .glam-wa-btn,
.is-style-card .glam-wa-btn .wp-block-button { width: 100%; }
.is-style-card .glam-wa-btn .wp-block-button__link { width: 100%; justify-content: center; text-align: center; border-radius: 12px; padding: .75em 1em; }