/*
Theme Name: Prime Lab
Theme URI: https://primelab.co.id
Author: Prime Lab
Author URI: https://primelab.co.id
Description: Prime Lab — Laboratorium Klinik. A Joyful Heart is the Health of the Body. Custom block (FSE) theme.
Version: 1.4.1
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: primelab
Tags: block-theme, full-site-editing, healthcare, custom-colors, custom-logo, custom-menu, featured-images, threaded-comments
*/

/* --- Wordmark --------------------------------------------------------- */
.primelab-wordmark {
	font-weight: 800;
	letter-spacing: -0.02em;
	text-decoration: none;
	color: inherit;
	font-size: 1rem;
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	gap: 0.45ch;
}
.primelab-wordmark:hover { color: inherit; }
.primelab-wordmark .glyph {
	color: var(--wp--preset--color--accent);
	font-weight: 900;
	font-style: normal;
	margin: 0 0.4ch;
	display: inline-block;
	transform: rotate(0deg);
	font-size: 1.15em;
	line-height: 1;
	font-family: 'Inter', sans-serif;
}
.primelab-wordmark--img {
	gap: 0.7ch;
}
.primelab-wordmark--img .glyph {
	font-size: 1.4rem;
	line-height: 1;
	color: var(--wp--preset--color--accent);
}
.primelab-wordmark--img img {
	mix-blend-mode: multiply;
}
.site-footer .primelab-wordmark--img img {
	mix-blend-mode: normal;
	background: var(--wp--preset--color--cream);
	padding: 0.3rem 0.5rem;
	border-radius: 4px;
}
.site-footer .primelab-wordmark--img .glyph {
	color: var(--wp--preset--color--accent-light);
}

/* --- Section head (eyebrow + h2 + see-all on one row) -------------- */
.section-head,
.services-summary__head {
	display: flex;
	justify-content: space-between;
	align-items: end;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-bottom: 1.25rem;
	padding-bottom: 0.75rem;
	border-bottom: 1px solid var(--wp--preset--color--ink);
}
.section-head__left,
.services-summary__head > div:first-child {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}
.section-head__left .hero-eyebrow,
.services-summary__head .hero-eyebrow {
	margin: 0 !important;
	padding-top: 0.4rem !important;
	min-width: 0 !important;
}
.section-head__left h2,
.services-summary__head h2 {
	margin: 0 !important;
	line-height: 1 !important;
}
.section-head__seeall {
	text-decoration: underline;
	text-underline-offset: 0.2em;
	font-weight: 500;
	color: var(--wp--preset--color--ink);
	font-size: 0.95rem;
	white-space: nowrap;
}
.section-head__seeall:hover { color: var(--wp--preset--color--primary); }
@media (max-width: 540px) {
	.section-head,
	.services-summary__head {
		gap: 0.4rem;
		margin-bottom: 1rem;
		padding-bottom: 0.6rem;
	}
}

/* --- BRAI stats block (rendered by [primelab_stats]) --------------- */
.primelab-stats {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--cream);
	padding: 0;
	border-top: 1px solid var(--wp--preset--color--ink);
	border-bottom: 1px solid var(--wp--preset--color--ink);
}
.primelab-stats__inner {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 0;
}
.primelab-stats .stat-cell {
	padding: 3rem 2rem;
	border-right: 1px solid #1F2937;
	border-bottom: 1px solid #1F2937;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}
.primelab-stats .stat-cell:last-child { border-right: 0; }
.primelab-stats .stat-cell__value {
	font-size: clamp(2rem, 3vw + 0.75rem, 3.75rem);
	font-weight: 800;
	line-height: 0.95;
	letter-spacing: -0.04em;
	color: var(--wp--preset--color--cream);
}
.primelab-stats .stat-cell:nth-child(1) .stat-cell__value { color: var(--wp--preset--color--accent-light); }
.primelab-stats .stat-cell:nth-child(2) .stat-cell__value { color: var(--wp--preset--color--accent); }
.primelab-stats .stat-cell:nth-child(3) .stat-cell__value { color: var(--wp--preset--color--secondary); }
.primelab-stats .stat-cell:nth-child(4) .stat-cell__value { color: var(--wp--preset--color--cream); }
.primelab-stats .stat-cell:nth-child(5) .stat-cell__value { color: var(--wp--preset--color--accent-light); }
.primelab-stats .stat-cell__label {
	font-size: 0.75rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #98A2B3;
	font-weight: 600;
	margin-top: 0.5rem;
}

/* --- Services full (rendered by [primelab_services_full]) ---------- */
.services-full {
	max-width: 1320px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 0;
}
/* Mobile: kill the block-gap between the JAM OPERASIONAL hours strip and
 * the service rows so the rows visually butt up against the strip's
 * bottom border — no dead cream band in between. */
@media (max-width: 640px) {
	main .services-full {
		margin-top: 0.5rem !important;
	}
}
@media (max-width: 540px) {
	main .services-full {
		margin-top: 0 !important;
	}
}
.service-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	align-items: stretch;
	border-top: 1px solid var(--wp--preset--color--ink);
}
.service-row:last-child { border-bottom: 1px solid var(--wp--preset--color--ink); }
@media (max-width: 820px) {
	.service-row { grid-template-columns: 1fr; }
}
.service-row.is-flipped .service-row__media { order: 2; border-left: 1px solid var(--wp--preset--color--ink); border-right: 0; }
.service-row.is-flipped .service-row__body  { order: 1; }
.service-row__media {
	background: var(--wp--preset--color--cream-warm);
	min-height: 320px;
	border-right: 1px solid var(--wp--preset--color--ink);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}
@media (max-width: 820px) {
	.service-row__media {
		border-right: 0;
		border-bottom: 1px solid var(--wp--preset--color--ink);
		min-height: 200px;
	}
	.service-row.is-flipped .service-row__media { order: 0; border-left: 0; border-bottom: 1px solid var(--wp--preset--color--ink); }
	.service-row.is-flipped .service-row__body  { order: 1; }
}
@media (max-width: 540px) {
	.service-row__media { min-height: 180px; }
}
.service-row__photo {
	width: 100%;
	height: 100%;
	display: block;
}
.service-row__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.service-row__media:empty::before {
	content: "";
	display: block;
	width: 64px;
	height: 64px;
	background:
		linear-gradient(45deg, transparent calc(50% - 1px), var(--wp--preset--color--ink) calc(50% - 1px), var(--wp--preset--color--ink) calc(50% + 1px), transparent calc(50% + 1px)),
		linear-gradient(-45deg, transparent calc(50% - 1px), var(--wp--preset--color--ink) calc(50% - 1px), var(--wp--preset--color--ink) calc(50% + 1px), transparent calc(50% + 1px));
	opacity: 0.15;
}
.service-row__body {
	padding: 3.5rem 3rem;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	background: var(--wp--preset--color--base);
}
@media (max-width: 540px) {
	.service-row__body { padding: 1.5rem 1.25rem 1.75rem; }
}
.service-row__eyebrow {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	margin: 0;
	display: inline-block;
	border-top: 1px solid currentColor;
	padding-top: 0.6rem;
	min-width: 14rem;
}
.service-row--blue     .service-row__eyebrow { color: var(--wp--preset--color--primary); }
.service-row--green    .service-row__eyebrow { color: var(--wp--preset--color--secondary); }
.service-row--lavender .service-row__eyebrow { color: var(--wp--preset--color--accent); }
.service-row--sage     .service-row__eyebrow { color: var(--wp--preset--color--accent-light); }
.service-row__title {
	font-size: clamp(1.75rem, 2.5vw + 0.75rem, 2.75rem);
	font-weight: 800;
	letter-spacing: -0.025em;
	line-height: 1.05;
	margin: 0;
}
.service-row__content {
	color: var(--wp--preset--color--ink-soft);
	font-size: 1rem;
	line-height: 1.65;
}
.service-row__content p { margin: 0 0 0.75rem 0; }
.service-row__content strong { color: var(--wp--preset--color--ink); }
.service-row__items {
	list-style: none;
	margin: 0.5rem 0 0 0;
	padding: 0;
	color: var(--wp--preset--color--ink-soft);
	font-size: 0.95rem;
	line-height: 1.7;
}
.service-row__items li {
	padding-left: 1.25em;
	position: relative;
}
.service-row__items li::before {
	content: "—";
	position: absolute;
	left: 0;
}
.service-row--blue     .service-row__items li::before { color: var(--wp--preset--color--primary); }
.service-row--green    .service-row__items li::before { color: var(--wp--preset--color--secondary); }
.service-row--lavender .service-row__items li::before { color: var(--wp--preset--color--accent); }
.service-row--sage     .service-row__items li::before { color: var(--wp--preset--color--accent-light); }
.service-row--ink      .service-row__items li::before { color: var(--wp--preset--color--ink); }

/* --- Services summary cards (Home → Layanan teaser) ---------------- */
.services-summary {
	max-width: 1320px;
	margin: 0 auto;
}
.services-summary__head {
	display: flex;
	justify-content: space-between;
	align-items: end;
	flex-wrap: wrap;
	gap: 1rem;
	margin-bottom: 2.5rem;
	border-bottom: 1px solid var(--wp--preset--color--ink);
	padding-bottom: 1.5rem;
}
.services-summary__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 0;
	border: 1px solid var(--wp--preset--color--ink);
}
.service-card {
	padding: 0;
	border-right: 1px solid var(--wp--preset--color--ink);
	border-bottom: 1px solid var(--wp--preset--color--ink);
	background: var(--wp--preset--color--base);
	display: flex;
	flex-direction: column;
	gap: 0;
	transition: background-color 0.15s ease;
	text-decoration: none;
	color: inherit;
	overflow: hidden;
}
.service-card__image {
	aspect-ratio: 4 / 3;
	background: var(--wp--preset--color--cream-warm);
	overflow: hidden;
	border-bottom: 1px solid var(--wp--preset--color--ink);
}
.service-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.4s ease;
}
.service-card:hover .service-card__image img {
	transform: scale(1.03);
}
.service-card__image--placeholder {
	background:
		linear-gradient(135deg, rgba(30, 58, 138, 0.07), rgba(46, 157, 92, 0.07));
	background-color: var(--wp--preset--color--cream-warm);
}
.service-card__body {
	padding: 1.5rem 1.5rem 1.75rem;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
	flex: 1;
}
.service-card:hover { background: var(--wp--preset--color--cream); color: inherit; }
.service-card:last-child { border-right: 0; }
.service-card__index {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
}
.service-card:nth-child(1) .service-card__index { color: var(--wp--preset--color--primary); }
.service-card:nth-child(2) .service-card__index { color: var(--wp--preset--color--accent); }
.service-card:nth-child(3) .service-card__index { color: var(--wp--preset--color--secondary); }
.service-card:nth-child(4) .service-card__index { color: var(--wp--preset--color--accent-light); }
.service-card__title {
	font-size: 1.5rem;
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1.05;
	margin: 0;
}
.service-card__desc {
	font-size: 0.95rem;
	line-height: 1.6;
	color: var(--wp--preset--color--ink-soft);
	margin: 0;
}
.service-card__more {
	margin-top: auto;
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: underline;
	text-underline-offset: 0.3em;
}

/* --- Featured package highlight ------------------------------------- */
.featured-package {
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: 0;
	border: 1px solid var(--wp--preset--color--ink);
	background: var(--wp--preset--color--base);
}
@media (max-width: 720px) {
	.featured-package { grid-template-columns: 1fr; }
}
.featured-package__media {
	background: var(--wp--preset--color--cream-warm);
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 380px;
	overflow: hidden;
}
.featured-package__media img {
	max-width: 80%;
	max-height: 320px;
	object-fit: contain;
	mix-blend-mode: multiply;
}
.featured-package__body {
	padding: 3rem;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	border-left: 1px solid var(--wp--preset--color--ink);
}
@media (max-width: 720px) {
	.featured-package__body { border-left: none; border-top: 1px solid var(--wp--preset--color--ink); }
}
.featured-package__eyebrow {
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent);
	margin: 0;
}
.featured-package__title {
	font-size: clamp(1.75rem, 2vw + 1rem, 2.5rem);
	font-weight: 800;
	letter-spacing: -0.025em;
	line-height: 1.05;
	margin: 0;
}
.featured-package__price {
	font-size: 2.25rem;
	font-weight: 800;
	letter-spacing: -0.025em;
	margin: 0.5rem 0;
}
.featured-package__price .currency {
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--wp--preset--color--ink-soft);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	margin-right: 0.5ch;
}
.featured-package__items {
	list-style: none;
	margin: 0;
	padding: 0;
	color: var(--wp--preset--color--ink-soft);
	font-size: 0.95rem;
	line-height: 1.7;
}
.featured-package__items li {
	padding-left: 1.25em;
	position: relative;
}
.featured-package__items li::before {
	content: "—";
	color: var(--wp--preset--color--accent);
	position: absolute;
	left: 0;
}

/* --- Blog list (single-column row layout on /blog/) ---------------- */
.blog-list .wp-block-post {
	border-top: 1px solid var(--wp--preset--color--ink);
	padding: var(--wp--preset--spacing--50) 0;
	margin: 0;
}
.blog-list .wp-block-post:last-child {
	border-bottom: 1px solid var(--wp--preset--color--ink);
}
.blog-list-row__image img {
	width: 100%;
	height: auto;
	display: block;
	border: 1px solid var(--wp--preset--color--ink);
}
.blog-list-row__title a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}
.blog-list-row__title a:hover {
	color: var(--wp--preset--color--primary);
}
.blog-list-row__date {
	margin: 0;
}

/* --- Article summary cards (Home page hero teaser) ----------------- */
.article-summary {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	background: transparent;
	border: 0;
	border-top: 1px solid var(--wp--preset--color--ink);
	padding-top: 1.5rem;
	overflow: hidden;
}
.article-summary > .article-summary__date,
.article-summary > .article-summary__title,
.article-summary > .article-summary__excerpt {
	padding-left: 0;
	padding-right: 0;
}
.article-summary > .article-summary__date { padding-top: 0; }
.article-summary > .article-summary__excerpt { padding-bottom: 0; }
.article-summary__image {
	display: block;
	background: var(--wp--preset--color--cream-warm);
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--ink);
	margin-bottom: 0.5rem;
}
.article-summary__image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	mix-blend-mode: multiply;
	transition: transform 0.3s ease;
}
.article-summary__image:hover img {
	transform: scale(1.03);
}
.article-summary__date {
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent);
}
.article-summary__title {
	font-size: 1.5rem;
	font-weight: 800;
	letter-spacing: -0.03em;
	line-height: 1.05;
	margin: 0;
}
.article-summary__title a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}
.article-summary__title a:hover {
	color: var(--wp--preset--color--primary);
}
.article-summary__excerpt {
	font-size: 0.95rem;
	line-height: 1.65;
	color: var(--wp--preset--color--ink-soft);
	margin: 0;
}

/* --- Package card with feature image ------------------------------- */
.package-card__image {
	margin: -1.5rem -1.5rem 0 -1.5rem;
	background: var(--wp--preset--color--cream-warm);
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 160px;
	border-bottom: 1px solid var(--wp--preset--color--ink);
}
.package-card__image img {
	max-width: 100%;
	max-height: 180px;
	height: auto;
	display: block;
	mix-blend-mode: multiply;
}

/* --- Header ----------------------------------------------------------- */
.site-header {
	border-bottom: 1px solid var(--wp--preset--color--ink);
}
/* Override block theme's default constrained content-size so the header
   bar truly spans the full viewport. */
.site-header > .site-header__bar {
	max-width: none;
	width: 100%;
}
.site-header .wp-block-navigation .wp-block-navigation-item__content {
	font-weight: 500;
	font-size: 0.95rem;
	letter-spacing: -0.005em;
}

/* --- Festive brand-palette accents ---------------------------------- */
/* Logo gradient banding — used as subtle background blocks behind hero
   eyebrows, between sections, and in the home cover. Pulls all four
   logo colours: blue (Prime Lab), green (Lab), lavender + sage (Beth Rapha). */
.brand-band {
	background: linear-gradient(
		90deg,
		var(--wp--preset--color--primary) 0%,
		var(--wp--preset--color--primary) 25%,
		var(--wp--preset--color--accent) 25%,
		var(--wp--preset--color--accent) 50%,
		var(--wp--preset--color--secondary) 50%,
		var(--wp--preset--color--secondary) 75%,
		var(--wp--preset--color--accent-light) 75%,
		var(--wp--preset--color--accent-light) 100%
	);
	height: 6px;
	border: 0;
	margin: 0;
}
.brand-band--thick { height: 12px; }
.brand-band--thin  { height: 3px; opacity: 0.85; }

/* ---------------------------------------------------------------------
 * Company profile page — design pass: tight hero, quick-facts card grid,
 * numbered section eyebrows, brand-band dividers between sections.
 * ------------------------------------------------------------------- */
.company-hero h1 {
	margin-top: 0.25rem !important;
	margin-bottom: 1rem;
}
.company-hero__lede {
	font-size: 1.125rem;
	line-height: 1.6;
	color: var(--wp--preset--color--ink-soft);
	max-width: 68ch;
	margin: 0;
}
.company-hero__lede a {
	color: var(--wp--preset--color--primary);
	font-weight: 600;
	text-decoration: none;
	border-bottom: 1px solid currentColor;
}
.company-hero__lede a:hover { color: var(--wp--preset--color--secondary); }

.company-facts {
	padding: 2.25rem 0 2.75rem;
}
.company-facts > .hero-eyebrow {
	margin-bottom: 1.4rem;
}
.company-facts__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.25rem;
}
.company-facts__cell {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding: 1.5rem 1.4rem;
	background: var(--wp--preset--color--cream-warm);
	border: 1px solid rgba(15, 23, 42, 0.08);
	border-radius: 4px;
}
.company-facts__cell .company-facts__label {
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-soft);
}
.company-facts__cell .company-facts__value {
	font-size: 1.35rem;
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1.15;
	color: var(--wp--preset--color--ink);
	display: block;
}
.company-facts__cell p {
	margin: 0.15rem 0 0 0;
	font-size: 0.93rem;
	color: var(--wp--preset--color--ink-soft);
	line-height: 1.5;
}
@media (max-width: 820px) {
	.company-facts__grid { grid-template-columns: 1fr; gap: 0.9rem; }
	.company-facts__cell { padding: 1.2rem 1.1rem; }
}

.company-section h2 {
	font-size: clamp(1.625rem, 1.3rem + 1.2vw, 2.25rem);
	font-weight: 800;
	letter-spacing: -0.025em;
	line-height: 1.1;
	margin: 0.25rem 0 1rem !important;
}
.company-section__lead {
	font-size: 1.05rem;
	line-height: 1.6;
	color: var(--wp--preset--color--ink-soft);
	max-width: 68ch;
	margin: 0 0 1.25rem 0;
}
.company-facilities {
	list-style: none;
	padding: 0;
	margin: 0.5rem 0 0;
	display: grid;
	gap: 0.85rem;
}
.company-facilities li {
	padding: 0.85rem 1rem;
	border-left: 3px solid var(--wp--preset--color--accent-light);
	background: rgba(149, 196, 117, 0.06);
	border-radius: 0 3px 3px 0;
	font-size: 1rem;
	line-height: 1.55;
}
.company-facilities li:nth-child(1) { border-left-color: var(--wp--preset--color--primary); }
.company-facilities li:nth-child(2) { border-left-color: var(--wp--preset--color--accent); }
.company-facilities li:nth-child(3) { border-left-color: var(--wp--preset--color--secondary); }
.company-facilities li:nth-child(4) { border-left-color: var(--wp--preset--color--accent-light); }
.company-facilities li:nth-child(5) { border-left-color: var(--wp--preset--color--primary); }
.company-facilities li strong a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	border-bottom: 1px solid transparent;
}
.company-facilities li strong a:hover {
	border-bottom-color: currentColor;
}

/* Soft cream gradient for hero overlay */
.has-cream-background-color.is-hero-soft {
	background: radial-gradient(
		ellipse at 30% 30%,
		#FBE8DD 0%,
		var(--wp--preset--color--cream) 60%
	) !important;
}

/* Section-divider with brand-coloured dot */
.section-dot-divider {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	margin: 0;
	padding: 1.5rem 0;
}
.section-dot-divider span {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	display: inline-block;
}
.section-dot-divider span:nth-child(1) { background: var(--wp--preset--color--primary); }
.section-dot-divider span:nth-child(2) { background: var(--wp--preset--color--accent); }
.section-dot-divider span:nth-child(3) { background: var(--wp--preset--color--secondary); }
.section-dot-divider span:nth-child(4) { background: var(--wp--preset--color--accent-light); }

/* Stats band: alternate cell tints with brand colours (subtle backgrounds) */
.primelab-stats .stat-cell:nth-child(1) { background: linear-gradient(180deg, rgba(30,58,138,0.08) 0%, transparent 60%); }
.primelab-stats .stat-cell:nth-child(2) { background: linear-gradient(180deg, rgba(151,119,188,0.10) 0%, transparent 60%); }
.primelab-stats .stat-cell:nth-child(3) { background: linear-gradient(180deg, rgba(46,157,92,0.10) 0%, transparent 60%); }
.primelab-stats .stat-cell:nth-child(4) { background: linear-gradient(180deg, rgba(149,196,117,0.10) 0%, transparent 60%); }
.primelab-stats .stat-cell:nth-child(5) { background: linear-gradient(180deg, rgba(232,68,127,0.06) 0%, transparent 60%); }

/* Service-row alternating tinted backgrounds */
.service-row:nth-child(1) .service-row__body { background: linear-gradient(135deg, rgba(30,58,138,0.04) 0%, var(--wp--preset--color--base) 100%); }
.service-row:nth-child(2) .service-row__body { background: linear-gradient(135deg, rgba(151,119,188,0.06) 0%, var(--wp--preset--color--base) 100%); }
.service-row:nth-child(3) .service-row__body { background: linear-gradient(135deg, rgba(46,157,92,0.06) 0%, var(--wp--preset--color--base) 100%); }
.service-row:nth-child(4) .service-row__body { background: linear-gradient(135deg, rgba(149,196,117,0.08) 0%, var(--wp--preset--color--base) 100%); }

/* Service summary card — coloured top edge per logo colour */
.service-card { position: relative; }
.service-card::before {
	content: "";
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 4px;
}
.service-card:nth-child(1)::before { background: var(--wp--preset--color--primary); }
.service-card:nth-child(2)::before { background: var(--wp--preset--color--accent); }
.service-card:nth-child(3)::before { background: var(--wp--preset--color--secondary); }
.service-card:nth-child(4)::before { background: var(--wp--preset--color--accent-light); }

/* Package-card hover: subtle brand-coloured edge instead of plain cream tint */
.package-card { position: relative; overflow: hidden; }
.package-card::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 3px;
	background: linear-gradient(90deg,
		var(--wp--preset--color--primary) 0%,
		var(--wp--preset--color--accent) 50%,
		var(--wp--preset--color--secondary) 100%);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.25s ease;
}
.package-card:hover::after { transform: scaleX(1); }

/* Detailed-services tinted grid (About) */
.detailed-service:nth-child(4n+1) { background: linear-gradient(160deg, rgba(30,58,138,0.06), var(--wp--preset--color--base)); }
.detailed-service:nth-child(4n+2) { background: linear-gradient(160deg, rgba(151,119,188,0.08), var(--wp--preset--color--base)); }
.detailed-service:nth-child(4n+3) { background: linear-gradient(160deg, rgba(46,157,92,0.07), var(--wp--preset--color--base)); }
.detailed-service:nth-child(4n+4) { background: linear-gradient(160deg, rgba(149,196,117,0.09), var(--wp--preset--color--base)); }

/* Article-summary date pill on home gets a small dot-marker in lavender */
.article-summary__date::before {
	content: "● ";
	color: var(--wp--preset--color--accent);
	margin-right: 0.4rem;
}

/* --- Hero ------------------------------------------------------------- */
.hero-eyebrow {
	font-size: 0.7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.22em;
	color: var(--wp--preset--color--secondary);
	margin: 0 0 0.6rem 0;
	display: inline-block;
	border-top: 1px solid var(--wp--preset--color--secondary);
	padding-top: 0.6rem;
	min-width: 14rem;
}

/* Tighten the gap between any hero-eyebrow and the heading that follows it
 * (Profil Perusahaan → PT. Beth Rapha Agave Insani, etc.). Overrides the
 * default constrained-layout block-gap. */
.hero-eyebrow + .wp-block-heading,
.hero-eyebrow + h1,
.hero-eyebrow + h2,
.hero-eyebrow + h3 {
	margin-top: 0.25rem !important;
}
.hero-eyebrow.is-blue {
	color: var(--wp--preset--color--primary);
	border-top-color: var(--wp--preset--color--primary);
}
.hero-eyebrow.is-lavender {
	color: var(--wp--preset--color--accent);
	border-top-color: var(--wp--preset--color--accent);
}
.hero-display h1,
h1.hero-display {
	font-weight: 800 !important;
	letter-spacing: -0.035em !important;
	line-height: 1.0 !important;
	font-size: clamp(2.25rem, 4vw + 0.75rem, 4.5rem) !important;
}
.hero-illustration img {
	width: auto;
	max-width: 100%;
	height: auto;
	display: block;
	margin: 0 auto;
	mix-blend-mode: multiply;
	image-rendering: -webkit-optimize-contrast;
	image-rendering: crisp-edges;
}

/* Remove the WP-default block-gap between top-level template regions
 * (<header>, <main>, <footer>). Each region carries its own internal
 * padding; the 24px gap was leaving a visible cream strip between the
 * site header and the photo hero. */
.wp-site-blocks > * + * {
	margin-block-start: 0 !important;
}

/* ---------------------------------------------------------------------
 * Home hero — full-bleed BRAI clinic building photo with text overlay.
 * Uses a real <img> so object-position can crop the sky out and keep the
 * building dominant. Dark left→right gradient for legibility on desktop;
 * top→bottom gradient on mobile so the text sits clearly at the bottom.
 * Only the home / front-page first section uses this; About etc. don't.
 * ------------------------------------------------------------------- */
/* The hero is rendered as a plain <section> via wp:html — it sits outside
 * WordPress's alignfull / has-global-padding / constrained-layout system, so
 * the standard "full-bleed via negative margins" technique works without any
 * specificity battles. */
.home-hero--photo {
	position: relative;
	isolation: isolate;
	background-color: var(--wp--preset--color--ink);
	overflow: hidden;
	box-sizing: border-box;
	/* Span true viewport width regardless of where this section sits in the
	 * document tree. `100vw` + the negative margin centres it on the viewport;
	 * `html, body { overflow-x: hidden }` (already in the theme) absorbs any
	 * scrollbar-width overshoot. */
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	/* Photo is 2000×960 (≈2.08:1). 48vw height matches that ratio so the
	 * full photo shows with no cropping on desktop. Min/max bounds keep
	 * vertical room for the text on short / ultra-wide viewports. */
	height: 48vw;
	min-height: 540px;
	max-height: 940px;
	display: flex;
	align-items: center;
	padding: clamp(2rem, 5vh, 4rem) 0;
	border: 0;
	outline: 0;
}
.home-hero--photo .home-hero__bg,
.home-hero--photo .home-hero__overlay {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	border: 0;
	pointer-events: none;
}
.home-hero--photo .home-hero__bg {
	object-fit: cover;
	/* Anchor the top so the building's roofline stays in frame; any
	 * overflow trims from the bottom (parked bikes) instead. */
	object-position: center top;
	z-index: -2;
	display: block;
}
.home-hero--photo .home-hero__overlay {
	background:
		linear-gradient(90deg, rgba(15, 23, 42, 0.78) 0%, rgba(15, 23, 42, 0.55) 45%, rgba(15, 23, 42, 0.22) 100%),
		linear-gradient(180deg, rgba(15, 23, 42, 0.10) 0%, rgba(15, 23, 42, 0.45) 100%);
	z-index: -1;
}
.home-hero--photo .home-hero__inner {
	position: relative;
	width: 100%;
	max-width: 1180px;
	margin: 0 auto;
	padding: 0 clamp(1.25rem, 5vw, 5rem);
	box-sizing: border-box;
}
.home-hero--photo .home-hero__inner > * {
	max-width: 680px;
}
/* Spacing between hero text items (replaces the block-gap that wp:group
 * children used to inherit). */
.home-hero--photo .home-hero__inner > * + * {
	margin-top: 0.85rem;
}
.home-hero--photo .home-hero__inner .hero-lede {
	margin-top: 1.4rem;
	margin-bottom: 1.6rem;
	font-size: 1.125rem;
	line-height: 1.6;
}
.home-hero--photo .home-hero__inner .home-hero__ctas {
	margin-top: 1.6rem;
}
.home-hero--photo .hero-brand,
.home-hero--photo .home-hero__inner > .hero-brand {
	/* `display: block` keeps the brand on its OWN line above the green
	 * divider — `inline-block` was letting the strapline flow next to it.
	 * `width: max-content` shrinks the block to fit content, `nowrap`
	 * stops it from breaking, and higher specificity defeats the 680px
	 * `> *` cap elsewhere. */
	display: block;
	width: max-content;
	max-width: 100%;
	white-space: nowrap;
	margin: 0 0 0.85rem 0;
	/* Scales with viewport. Bumped the desktop cap to 1.5rem with a
	 * heavier letterspacing-light treatment so it reads as a wordmark
	 * over the photo, not a body line. */
	font-size: clamp(0.95rem, 1.5vw + 0.5rem, 1.5rem);
	font-weight: 700;
	letter-spacing: 0.01em;
	color: var(--wp--preset--color--cream);
	opacity: 1;
	/* Subtle drop-shadow lifts the type off the photo background so it
	 * doesn't get lost against busy areas. */
	text-shadow: 0 1px 14px rgba(0, 0, 0, 0.45);
}
.home-hero--photo .hero-brand .glyph {
	margin: 0 0.4em;
	color: var(--wp--preset--color--accent-light);
	font-weight: 400;
	font-size: 0.92em;
	vertical-align: 0.05em;
}
.home-hero--photo .hero-brand .glyph {
	margin: 0 0.35em;
	color: var(--wp--preset--color--accent-light);
	font-weight: 400;
}
.home-hero--photo .hero-eyebrow {
	color: var(--wp--preset--color--cream);
	opacity: 0.92;
}
/* Keep eyebrow → h1 nicely tight inside the photo hero too. */
.home-hero--photo .home-hero__inner .hero-display,
.home-hero--photo .home-hero__inner h1.hero-display {
	margin-top: 0.25rem;
}
.home-hero--photo .hero-display,
.home-hero--photo h1.hero-display,
.home-hero--photo .wp-block-heading {
	color: var(--wp--preset--color--cream);
	text-shadow: 0 2px 28px rgba(0, 0, 0, 0.45);
}
.home-hero--photo .hero-lede {
	color: rgba(253, 250, 244, 0.94);
	text-shadow: 0 1px 12px rgba(0, 0, 0, 0.35);
}
.home-hero--photo .wp-block-button__link {
	background-color: var(--wp--preset--color--cream);
	color: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--cream);
}
.home-hero--photo .wp-block-button__link:hover,
.home-hero--photo .wp-block-button__link:focus {
	background-color: var(--wp--preset--color--secondary);
	color: var(--wp--preset--color--cream);
	border-color: var(--wp--preset--color--secondary);
}
/* Outline (tertiary) button — transparent over the photo, cream text + border */
.home-hero--photo .wp-block-button.is-style-outline .wp-block-button__link {
	background-color: transparent;
	color: var(--wp--preset--color--cream);
	border: 1px solid rgba(253, 250, 244, 0.78);
}
.home-hero--photo .wp-block-button.is-style-outline .wp-block-button__link:hover,
.home-hero--photo .wp-block-button.is-style-outline .wp-block-button__link:focus {
	background-color: var(--wp--preset--color--cream);
	color: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--cream);
}
/* Three-CTA stack — slightly tighter gaps; on mobile, full-width column */
.home-hero--photo .home-hero__ctas {
	gap: 0.6rem 0.75rem;
	flex-wrap: wrap;
}
@media (max-width: 640px) {
	.home-hero--photo .home-hero__ctas {
		flex-direction: column;
		align-items: stretch;
	}
	.home-hero--photo .home-hero__ctas .wp-block-button {
		width: 100%;
	}
	.home-hero--photo .home-hero__ctas .wp-block-button__link {
		display: block;
		text-align: center;
	}
}
@media (max-width: 640px) {
	.home-hero--photo {
		/* Portrait phone: drop the wide-ratio height; cover fills a taller
		 * box, the landscape photo is trimmed left/right but the full
		 * building height (top included) stays visible. */
		height: auto;
		min-height: clamp(380px, 60vh, 560px);
		max-height: none;
		align-items: flex-end;
	}
	.home-hero--photo .home-hero__bg {
		object-position: center top;
	}
	.home-hero--photo .home-hero__overlay {
		background: linear-gradient(180deg, rgba(15, 23, 42, 0.18) 0%, rgba(15, 23, 42, 0.30) 38%, rgba(15, 23, 42, 0.78) 100%);
	}
}

/* Oversized typographic accent — OUTFIT-style ©26 mark */
.big-mark {
	font-weight: 900;
	font-size: clamp(6rem, 28vw, 28rem);
	line-height: 0.85;
	letter-spacing: -0.07em;
	color: var(--wp--preset--color--ink);
	margin: 0;
}
.big-mark .accent { color: var(--wp--preset--color--accent); }

/* Print-style horizontal rule that spans the section */
.print-rule {
	border: 0;
	border-top: 1px solid var(--wp--preset--color--ink);
	margin: 0;
}
.print-rule--thick {
	border-top-width: 2px;
}

/* Section number index (e.g. 01 / 02 / 03) */
.section-index {
	font-family: 'Inter', sans-serif;
	font-weight: 700;
	font-size: 0.75rem;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-soft);
}

/* --- Partner gallery -------------------------------------------------- */
.partner-gallery {
	border-top: 1px solid var(--wp--preset--color--ink);
	border-bottom: 1px solid var(--wp--preset--color--ink);
	padding-top: var(--wp--preset--spacing--70);
	padding-bottom: var(--wp--preset--spacing--70);
}
.partner-gallery__inner {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 var(--wp--preset--spacing--40);
}
.partner-gallery__heading {
	text-align: center;
	font-size: clamp(1.75rem, 3vw + 1rem, 3rem);
	font-weight: 700;
	letter-spacing: -0.025em;
	margin: 0 0 0.75rem 0;
}
.partner-gallery__intro {
	text-align: center;
	color: var(--wp--preset--color--ink-soft);
	max-width: 54ch;
	margin: 0 auto 3rem auto;
}
.partner-gallery__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 0;
	border-left: 1px solid var(--wp--preset--color--ink);
	border-top: 1px solid var(--wp--preset--color--ink);
}
.partner-gallery .partner-cell {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 110px;
	padding: 2rem 1.25rem;
	border-right: 1px solid var(--wp--preset--color--ink);
	border-bottom: 1px solid var(--wp--preset--color--ink);
	background: var(--wp--preset--color--cream);
	transition: background-color 0.2s ease;
}
.partner-gallery .partner-cell:hover {
	background: var(--wp--preset--color--base);
}
.partner-gallery img {
	max-height: 56px;
	max-width: 100%;
	width: auto;
	object-fit: contain;
	/* Show partner logos in full colour by default — was greyscale before. */
	filter: none;
	opacity: 1;
	transition: transform 0.2s ease;
	mix-blend-mode: multiply;
}
.partner-gallery .partner-cell:hover img {
	transform: scale(1.05);
}

/* Tablet: 4 columns */
@media (max-width: 1024px) {
	.partner-gallery__grid {
		grid-template-columns: repeat(4, 1fr);
	}
}
/* Tablet portrait: 3 columns */
@media (max-width: 820px) {
	.partner-gallery {
		padding-top: var(--wp--preset--spacing--50);
		padding-bottom: var(--wp--preset--spacing--50);
	}
	.partner-gallery__inner {
		padding: 0 1rem;
	}
	.partner-gallery__intro {
		margin-bottom: 2rem;
		font-size: 0.95rem;
	}
	.partner-gallery__grid {
		grid-template-columns: repeat(3, 1fr);
	}
	.partner-gallery .partner-cell {
		min-height: 90px;
		padding: 1.25rem 0.75rem;
	}
	.partner-gallery img {
		max-height: 44px;
	}
}
/* Phone: keep 3 columns (denser logo grid) */
@media (max-width: 540px) {
	.partner-gallery__grid {
		grid-template-columns: repeat(3, 1fr);
	}
	.partner-gallery .partner-cell {
		min-height: 72px;
		padding: 0.85rem 0.4rem;
	}
	.partner-gallery img {
		max-height: 32px;
	}
}
/* Very small phones: still 3 columns, just tighter */
@media (max-width: 380px) {
	.partner-gallery .partner-cell {
		min-height: 64px;
		padding: 0.65rem 0.3rem;
	}
	.partner-gallery img {
		max-height: 26px;
	}
}

/* --- Package cards (CPT archive + listing) ---------------------------- */
.package-card {
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
	padding: 1.5rem;
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--ink);
	transition: background-color 0.15s ease;
}
.package-card:hover {
	background: var(--wp--preset--color--cream);
}
.package-card__category {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--wp--preset--color--secondary);
}
.package-card__title {
	font-size: 1.35rem;
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.15;
	margin: 0;
}
.package-card__price {
	font-size: 1.85rem;
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1;
}
.package-card__price-currency {
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--wp--preset--color--ink-soft);
	text-transform: uppercase;
	letter-spacing: 0.12em;
	margin-right: 0.5ch;
}
.package-card__items {
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 0.95rem;
	line-height: 1.7;
	color: var(--wp--preset--color--ink-soft);
}
.package-card__items li {
	padding-left: 1.25em;
	position: relative;
}
.package-card__items li::before {
	content: "—";
	color: var(--wp--preset--color--secondary);
	position: absolute;
	left: 0;
}
.package-card__cta {
	display: inline-block;
	padding: 1.05rem 1.75rem;
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--cream);
	text-decoration: none;
	font-weight: 600;
	font-size: 0.78rem;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	margin-top: auto;
	align-self: flex-start;
	transition: background-color 0.15s ease;
}
.package-card__cta:hover {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
}

/* --- Package category section heading -------------------------------- */
.package-section + .package-section {
	margin-top: 5rem;
}
.package-section__bumper {
	width: 100%;
	aspect-ratio: 21 / 9;
	max-height: 320px;
	overflow: hidden;
	border-radius: 4px;
	margin: 0 0 1.5rem 0;
	background: var(--wp--preset--color--cream-warm);
	position: relative;
	isolation: isolate;
}
.package-section__bumper img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
/* Overlay variant: heading + intro sit on top of the image with a dark
 * bottom-up gradient so text stays legible whatever the photo looks like. */
.package-section__bumper--overlay::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg,
		rgba(15, 23, 42, 0.05) 0%,
		rgba(15, 23, 42, 0.15) 40%,
		rgba(15, 23, 42, 0.65) 80%,
		rgba(15, 23, 42, 0.85) 100%);
	z-index: 1;
	pointer-events: none;
}
.package-section__bumper-text {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 2;
	padding: 1.75rem 2rem 1.5rem;
	color: var(--wp--preset--color--cream);
}
.package-section__bumper-text h2 {
	margin: 0 0 0.45rem 0 !important;
	color: var(--wp--preset--color--cream);
	text-shadow: 0 2px 14px rgba(0, 0, 0, 0.45);
	letter-spacing: -0.025em;
	line-height: 1.05;
}
.package-section__bumper-intro {
	margin: 0;
	font-size: 1rem;
	line-height: 1.5;
	color: rgba(253, 250, 244, 0.92);
	max-width: 60ch;
	text-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
}
@media (max-width: 640px) {
	.package-section__bumper {
		aspect-ratio: 16 / 10;
		max-height: 240px;
		margin-bottom: 1rem;
	}
	.package-section + .package-section { margin-top: 3rem; }
	.package-section__bumper-text { padding: 1.25rem 1.25rem 1.1rem; }
	.package-section__bumper-text h2 { font-size: 1.5rem !important; }
	.package-section__bumper-intro { font-size: 0.9rem; }
}
.package-section h2 {
	font-size: clamp(2rem, 3vw + 1rem, 3rem);
	font-weight: 700;
	letter-spacing: -0.025em;
	margin: 0 0 0.5rem 0;
}
.package-section__intro {
	color: var(--wp--preset--color--ink-soft);
	font-size: 1.05rem;
	max-width: 56ch;
	margin: 0 0 3rem 0;
}

/* --- Language switcher (Polylang) ------------------------------------ */
.lang-switcher {
	display: flex;
	gap: 0.5ch;
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}
.lang-switcher a,
.lang-switcher .current-lang {
	text-decoration: none;
	color: var(--wp--preset--color--muted);
	transition: color 0.15s ease;
	padding: 0 0.25ch;
}
.lang-switcher a:hover {
	color: var(--wp--preset--color--ink);
}
.lang-switcher .current-lang {
	color: var(--wp--preset--color--ink);
}
.lang-switcher .sep {
	color: var(--wp--preset--color--muted);
}

/* --- Contact page redesign (high-visibility cards) ---------------- */
.contact-redesign {
	max-width: 100%;
	width: 100%;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 0;
	box-sizing: border-box;
}
.contact-redesign,
.contact-redesign * { box-sizing: border-box; }
.contact-card-v2 {
	display: grid;
	grid-template-columns: 280px 1fr auto;
	gap: 2.5rem;
	align-items: start;
	padding: 2.5rem 2rem;
	border-bottom: 1px solid var(--wp--preset--color--ink);
}
.contact-card-v2:first-of-type { border-top: 1px solid var(--wp--preset--color--ink); }
@media (max-width: 820px) {
	.contact-card-v2 { grid-template-columns: 1fr; gap: 1.25rem; }
}
.contact-card-v2--brai { background: var(--wp--preset--color--cream-warm); }
.contact-card-v2--lab  { background: var(--wp--preset--color--ink); color: var(--wp--preset--color--cream); }
.contact-card-v2--lab a { color: var(--wp--preset--color--cream); }
.contact-card-v2--lab .contact-card-v2__label { color: var(--wp--preset--color--accent-light); }

/* Contact cards with leading logo column on the left */
.contact-card-v2--with-logo {
	grid-template-columns: 96px 1fr 1fr auto;
	gap: 1.75rem;
}
.contact-card-v2__logo {
	display: flex;
	align-items: center;
	justify-content: center;
}
.contact-card-v2__logo img {
	width: 100%;
	max-width: 96px;
	height: auto;
	display: block;
}

/* Lab variant: PRIMELAB wordmark is landscape & needs more width, plus a
 * cream backdrop so the navy/green logo stays readable on the dark ink card. */
.contact-card-v2--lab.contact-card-v2--with-logo {
	grid-template-columns: 160px 1fr 1fr auto;
}
.contact-card-v2__logo--lab {
	background: var(--wp--preset--color--cream);
	padding: 0.6rem 0.85rem;
	border-radius: 10px;
	align-self: center;
}
.contact-card-v2__logo--lab img {
	max-width: 130px;
}

@media (max-width: 820px) {
	.contact-card-v2--with-logo,
	.contact-card-v2--lab.contact-card-v2--with-logo {
		grid-template-columns: 1fr;
		gap: 1.25rem;
	}
	.contact-card-v2__logo { justify-content: flex-start; }
	.contact-card-v2__logo img { max-width: 72px; }
	.contact-card-v2__logo--lab {
		align-self: flex-start;
		justify-self: flex-start;
		padding: 0.5rem 0.7rem;
	}
	.contact-card-v2__logo--lab img { max-width: 120px; }
}

.contact-card-v2__brand { display: flex; flex-direction: column; gap: 0.35rem; }
.contact-card-v2__label {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent);
}
.contact-card-v2--brai .contact-card-v2__label { color: var(--wp--preset--color--accent); }
.contact-card-v2__name {
	font-size: clamp(1.75rem, 2.5vw + 0.5rem, 2.5rem);
	font-weight: 800;
	letter-spacing: -0.025em;
	line-height: 1;
	margin: 0;
}
.contact-card-v2__tagline {
	margin: 0.5rem 0 0 0;
	font-size: 0.95rem;
	line-height: 1.55;
	color: var(--wp--preset--color--ink-soft);
}
.contact-card-v2--lab .contact-card-v2__tagline { color: #c0c8d0; }

.contact-card-v2__details {
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}
.contact-card-v2__row {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}
.contact-card-v2__row-label {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-soft);
}
.contact-card-v2--lab .contact-card-v2__row-label { color: #98A2B3; }
.contact-card-v2__row-value {
	font-size: 1.25rem;
	font-weight: 600;
	letter-spacing: -0.005em;
	line-height: 1.4;
}
.contact-card-v2__row-value a {
	text-decoration: none;
	border-bottom: 1px solid currentColor;
	padding-bottom: 1px;
	overflow-wrap: anywhere;
	word-break: break-word;
}
.contact-card-v2__row-value a:hover { color: var(--wp--preset--color--primary); }
.contact-card-v2--lab .contact-card-v2__row-value a:hover { color: var(--wp--preset--color--accent-light); }
.contact-card-v2__row-value--big {
	font-size: clamp(1.5rem, 1.5vw + 1rem, 2rem);
	font-weight: 800;
	letter-spacing: -0.02em;
}

.contact-card-v2__cta {
	align-self: center;
}
@media (max-width: 820px) { .contact-card-v2__cta { align-self: start; } }
.contact-card-v2__cta a {
	display: inline-block;
	padding: 1.1rem 1.75rem;
	font-size: 0.85rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	text-decoration: none;
	border: 0;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--cream);
	transition: background-color 0.15s ease;
}
.contact-card-v2--lab .contact-card-v2__cta a {
	background: var(--wp--preset--color--accent-light);
	color: var(--wp--preset--color--ink);
}
.contact-card-v2__cta a:hover {
	background: var(--wp--preset--color--secondary);
	color: var(--wp--preset--color--cream);
}

/* Hours strip */
.contact-hours-strip {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 1rem;
	padding: 1.5rem 2rem;
	background: var(--wp--preset--color--secondary);
	color: var(--wp--preset--color--cream);
	border-bottom: 1px solid var(--wp--preset--color--ink);
	max-width: 100%;
	box-sizing: border-box;
	overflow: hidden;
}
.contact-hours-strip__value {
	overflow-wrap: anywhere;
}
.contact-hours-strip__label {
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
}
.contact-hours-strip__value {
	font-size: clamp(1.1rem, 1vw + 0.75rem, 1.35rem);
	font-weight: 700;
	letter-spacing: -0.005em;
}

/* --- About page timelines + detailed services --------------------- */
.history-timeline {
	list-style: none;
	margin: 1.5rem 0 0 0;
	padding: 0 0 0 2rem;
	border-left: 1px solid var(--wp--preset--color--ink);
}
.history-timeline li {
	position: relative;
	padding: 0 0 1.75rem 0;
	margin: 0;
}
.history-timeline li:last-child { padding-bottom: 0; }
.history-timeline li::before {
	content: "";
	position: absolute;
	left: -2.45rem;
	top: 0.45rem;
	width: 11px;
	height: 11px;
	background: var(--wp--preset--color--accent);
	border-radius: 50%;
	box-shadow: 0 0 0 4px var(--wp--preset--color--cream);
}
.history-timeline .year {
	display: inline-block;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--wp--preset--color--primary);
	margin-bottom: 0.25rem;
}
.history-timeline .event {
	display: block;
	color: var(--wp--preset--color--ink);
	font-size: 1rem;
	line-height: 1.55;
}
.history-timeline.is-quality li::before { background: var(--wp--preset--color--secondary); }
.history-timeline.is-quality .year { color: var(--wp--preset--color--secondary); }

/* Detailed services grid on About */
.detailed-services {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 0;
	border: 1px solid var(--wp--preset--color--ink);
	margin: 1.5rem 0 0 0;
}
.detailed-service {
	padding: 1.5rem;
	border-right: 1px solid var(--wp--preset--color--ink);
	border-bottom: 1px solid var(--wp--preset--color--ink);
	background: var(--wp--preset--color--base);
}
.detailed-service__name {
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: -0.01em;
	margin: 0 0 0.4rem 0;
}
.detailed-service__desc {
	font-size: 0.85rem;
	line-height: 1.55;
	color: var(--wp--preset--color--ink-soft);
	margin: 0;
}

/* --- Footer (redesigned) -------------------------------------------- */
.site-footer {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--cream);
	font-family: var(--wp--preset--font-family--sans);
}
.site-footer a {
	color: inherit;
	text-decoration: none;
}
.site-footer .primelab-wordmark .glyph { color: var(--wp--preset--color--accent-light); }

/* Show only the active language inside .lang-id / .lang-en spans */
.site-footer .lang-en { display: none; }
html[lang^="en"] .site-footer .lang-en,
.site-footer[lang="en"] .lang-en { display: inline; }
html[lang^="en"] .site-footer .lang-id,
.site-footer[lang="en"] .lang-id { display: none; }

/* TOP STRIP — wordmark + tagline */
.site-footer__top { padding: 0 0 2rem 0; }
.site-footer__top-inner {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 2rem;
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	justify-content: space-between;
	gap: 1.5rem;
	border-bottom: 1px solid #1F2937;
	padding-bottom: 2rem;
}
.site-footer__brand .primelab-wordmark { display: inline-flex; }
.site-footer__tagline {
	margin: 0;
	font-size: 0.95rem;
	line-height: 1.55;
	color: #d1d5dc;
	max-width: 32ch;
}

/* COLUMNS */
.site-footer__cols { padding: 2.5rem 0 2rem 0; }
.site-footer__cols-inner {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 2rem;
	display: grid;
	grid-template-columns: 1.1fr 1fr 1.1fr 1.1fr;
	gap: 3rem 2rem;
	align-items: start;
}
.footer-col__title {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent-light);
	margin: 0 0 1.25rem 0;
	padding-bottom: 0.5rem;
	border-bottom: 1px solid #1F2937;
}
.footer-col__list,
.footer-col__contact {
	list-style: none;
	margin: 0;
	padding: 0;
}
.footer-col__list li {
	margin: 0;
	padding: 0.4rem 0;
	font-size: 0.95rem;
	line-height: 1.4;
}
.footer-col__list a {
	border-bottom: 1px solid transparent;
	padding-bottom: 1px;
	transition: color 0.15s ease, border-color 0.15s ease;
}
.footer-col__list a:hover {
	color: var(--wp--preset--color--accent-light);
	border-bottom-color: var(--wp--preset--color--accent-light);
}
.footer-col__address {
	font-style: normal;
	font-size: 0.9rem;
	line-height: 1.7;
	color: #c5cad3;
	margin: 0 0 1.5rem 0;
}
.footer-col__hours {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
	font-size: 0.9rem;
	line-height: 1.45;
}
.footer-col__hours-label {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--wp--preset--color--secondary);
	margin-bottom: 0.25rem;
}
.footer-col__hours-value {
	color: var(--wp--preset--color--cream);
	font-weight: 600;
}
.footer-col__hours-closed {
	color: #98A2B3;
	font-size: 0.85rem;
}

.footer-col__contact li {
	display: flex;
	flex-direction: column;
	gap: 0.1rem;
	padding: 0.45rem 0;
	border-bottom: 1px solid #1F2937;
}
.footer-col__contact li:last-child { border-bottom: 0; }
.footer-col__contact-label {
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #98A2B3;
}
.footer-col__contact-value {
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--wp--preset--color--cream);
	letter-spacing: -0.005em;
	transition: color 0.15s ease;
}
.footer-col__contact-value:hover {
	color: var(--wp--preset--color--accent-light);
}

/* BOTTOM BAR */
.site-footer__bottom {
	border-top: 1px solid #1F2937;
	padding: 1.5rem 0;
	margin-top: 1rem;
}
.site-footer__bottom-inner {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 2rem;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem 2rem;
}
.site-footer__legal {
	display: flex;
	gap: 0.75rem;
	align-items: center;
	font-size: 0.78rem;
	color: #98A2B3;
	letter-spacing: 0.04em;
}
.site-footer__legal-co { font-weight: 600; color: #c5cad3; }
.site-footer__legal-sep { color: #475467; }
.site-footer__legal-year { font-weight: 700; color: #c5cad3; }
.site-footer__legal-rights { color: #98A2B3; }

.site-footer__brand-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 1.25rem;
}
.site-footer__brand-tag {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #c5cad3;
}
.site-footer__brand-tag .dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	display: inline-block;
}
.site-footer__brand-tag .dot--blue     { background: var(--wp--preset--color--primary); }
.site-footer__brand-tag .dot--green    { background: var(--wp--preset--color--secondary); }
.site-footer__brand-tag .dot--lavender { background: var(--wp--preset--color--accent); }
.site-footer__brand-tag .dot--sage     { background: var(--wp--preset--color--accent-light); }

/* RESPONSIVE FOOTER */
@media (max-width: 900px) {
	.site-footer__top-inner { flex-direction: column; align-items: start; gap: 1rem; }
	.site-footer__cols-inner { grid-template-columns: 1fr 1fr; gap: 2rem; }
	.site-footer__bottom-inner { flex-direction: column; align-items: start; }
}
@media (max-width: 540px) {
	.site-footer__top-inner,
	.site-footer__cols-inner,
	.site-footer__bottom-inner { padding: 0 1.25rem; }
	.site-footer__cols-inner { grid-template-columns: 1fr; gap: 2rem; }
	.site-footer__brand-tags { gap: 0.75rem 1.25rem; }
}

/* --- Section dividers ------------------------------------------------- */
.section-rule {
	border-top: 1px solid var(--wp--preset--color--ink);
	margin: 0;
}

/* =====================================================================
 * MOBILE / RESPONSIVE
 * Targeted overrides for tablet (≤1024) → phone (≤640) → small (≤420).
 * Block-theme defaults handle a lot, but a few of our custom components
 * need explicit help (header bar, hero columns, service rows, footer
 * columns, contact cards).
 * =================================================================== */

/* Tablet ≤ 1024px ----------------------------------------------------- */
@media (max-width: 1024px) {
	.site-header__bar {
		gap: 1rem;
	}
	.primelab-wordmark--img img { height: 24px !important; }
	.primelab-stats .stat-cell { padding: 2rem 1.5rem; }
	.featured-package { grid-template-columns: 1fr; }
	.featured-package__media { min-height: 260px; }
	.contact-card-v2 {
		grid-template-columns: 240px 1fr;
		gap: 2rem;
	}
	.contact-card-v2__cta { grid-column: 1 / -1; align-self: start; }
	.contact-card-v2__cta a { width: 100%; text-align: center; }
}

/* --- Mobile menu overlay — extend breakpoint from 600px → 900px ------
   WP block theme nav defaults to mobile-overlay only below 600px. At
   typical tablet-portrait + large-phone widths (601–900px) the inline
   nav links crowd the wordmark and the lang-switcher. Force the
   hamburger to appear up to 900px so the menu is reliably tappable. */
@media (max-width: 900px) {
	/* Hide inline nav list */
	.site-header .wp-block-navigation .wp-block-navigation__container.has-modal-open,
	.site-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.is-menu-open) > .wp-block-navigation__responsive-close {
		display: block;
	}
	.site-header .wp-block-navigation:not(.is-vertical) > .wp-block-navigation__container {
		display: none !important;
	}
	/* Always show the hamburger button */
	.site-header .wp-block-navigation .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex !important;
		background: transparent;
		border: 0;
		padding: 0.5rem;
		cursor: pointer;
	}
	/* Style overlay panel when open */
	.site-header .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open {
		display: flex !important;
		position: fixed;
		top: 0; left: 0; right: 0; bottom: 0;
		z-index: 100000;
		padding: 1.5rem;
		flex-direction: column;
		justify-content: flex-start;
		overflow-y: auto;
		background: var(--wp--preset--color--cream);
	}
	.site-header .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open
		.wp-block-navigation__responsive-container-content {
		display: flex;
		flex-direction: column;
		gap: 0;
		padding-top: 4rem;
		width: 100%;
	}
	.site-header .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open
		.wp-block-navigation__container {
		display: flex !important;
		flex-direction: column;
		gap: 0;
	}
	.site-header .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open
		.wp-block-navigation-item {
		display: block;
		padding: 1rem 0;
		border-bottom: 1px solid var(--wp--preset--color--border);
	}
	.site-header .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open
		.wp-block-navigation-item__content {
		font-size: 1.5rem;
		font-weight: 700;
		letter-spacing: -0.02em;
		color: var(--wp--preset--color--ink);
		text-decoration: none;
	}
	.site-header .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open
		.wp-block-navigation__responsive-container-close {
		position: absolute;
		top: 1.5rem;
		right: 1.5rem;
		background: transparent;
		border: 0;
		cursor: pointer;
	}
	/* When overlay is open, lock the body scroll */
	.has-modal-open { overflow: hidden; }
}

/* Tablet portrait / large phone ≤ 820px ------------------------------- */
@media (max-width: 820px) {
	body { font-size: 0.95rem; }
	.site-header > .site-header__bar { padding: 0; }
	.site-header { padding-left: 1rem !important; padding-right: 1rem !important; padding-top: 0.75rem !important; padding-bottom: 0.75rem !important; }

	/* Tighten the gap between the header and the hero eyebrow on mobile.
	   The header already has its own bottom padding + border, so push the
	   hero up close to it. */
	.home-hero {
		padding-top: 0.5rem !important;
		padding-bottom: 2.5rem !important;
	}
	/* The photo-led hero must keep its full-bleed sizing & internal padding;
	   override the bare .home-hero shrink above. Drop the wide-ratio height
	   on tablet/portrait so the photo fills a taller box (top stays in
	   frame via object-position: center top). */
	.home-hero--photo {
		padding-top: 2.5rem !important;
		padding-bottom: 2.5rem !important;
		height: auto !important;
		min-height: 70vh !important;
		max-height: none !important;
	}
	.site-header {
		padding-bottom: 0.5rem !important;
	}
	.home-hero .hero-eyebrow {
		margin: 0 !important;
		padding-top: 0.35rem !important;
		min-width: 0 !important;
		font-size: 0.6rem;
		letter-spacing: 0.16em;
	}
	/* Tighten the eyebrow → h1 → lede stack on mobile (WP defaults to ~1.5rem
	   block-gap — too much when the eyebrow is one tiny line of micro-type). */
	.home-hero .wp-block-column > * + * {
		margin-top: 0.5rem !important;
	}
	.home-hero .hero-display,
	.home-hero h1.hero-display {
		margin-top: 0.5rem !important;
	}
	.home-hero .wp-block-buttons {
		margin-top: 1rem !important;
	}
	.primelab-wordmark { font-size: 0.85rem; gap: 0.4ch; }
	.primelab-wordmark--img img { height: 22px !important; }
	.primelab-wordmark--img .glyph { font-size: 1.05rem; }

	/* Hero typography scales down further than the global clamp */
	.hero-display h1, h1.hero-display {
		font-size: clamp(2rem, 7vw, 3.25rem) !important;
		letter-spacing: -0.03em !important;
	}
	.hero-eyebrow {
		font-size: 0.65rem;
		letter-spacing: 0.18em;
		min-width: 0;
	}

	/* Header layout on mobile */
	.site-header__bar {
		flex-wrap: wrap;
	}
	.site-header__bar > .wp-block-group {
		gap: 1rem;
	}

	/* Service rows stack image above content */
	.service-row { grid-template-columns: 1fr; }
	.service-row.is-flipped .service-row__media,
	.service-row.is-flipped .service-row__body { order: initial; }
	.service-row__media {
		min-height: 180px;
		border-right: 0;
		border-bottom: 1px solid var(--wp--preset--color--ink);
	}
	.service-row.is-flipped .service-row__media { border-left: 0; }
	.service-row__body { padding: 1.75rem 1.25rem; }

	/* Stats cell font-size */
	.primelab-stats .stat-cell__value { font-size: clamp(1.75rem, 5vw + 0.5rem, 2.25rem); }
	.primelab-stats .stat-cell { padding: 1.75rem 1.25rem; }

	/* Section spacing tightened */
	.services-summary__head {
		flex-direction: column;
		align-items: start;
		gap: 0.5rem;
	}

	/* Corporate CTA — stack heading + button */
	.corporate-cta .wp-block-columns { flex-direction: column !important; }
	.corporate-cta .wp-block-column { flex-basis: 100% !important; width: 100% !important; }
	.corporate-cta .wp-block-buttons { justify-content: flex-start; }
	.corporate-cta .wp-block-button__link { width: 100%; text-align: center; }

	/* Article summaries — image above text on home (stacked) */
	.article-summary { gap: 0.75rem; }

	/* Footer 4-col → 2-col */
	.site-footer .wp-block-columns {
		flex-wrap: wrap !important;
	}
	.site-footer .wp-block-column {
		flex-basis: calc(50% - 1rem) !important;
		min-width: 0 !important;
	}
	.site-footer__wordmark-row .primelab-wordmark--img img { height: 32px !important; }

	/* Featured-package full media */
	.featured-package__body { padding: 2rem 1.5rem; }

	/* Contact cards — full stack */
	.contact-card-v2 {
		grid-template-columns: 1fr;
		gap: 1.5rem;
		padding: 2rem 1.5rem;
	}
	.contact-card-v2__row-value--big {
		font-size: clamp(1.4rem, 4vw + 0.5rem, 1.85rem);
	}
	.contact-hours-strip {
		flex-direction: column;
		align-items: start;
		padding: 1.25rem 1.5rem;
	}

	/* Black contact CTA at bottom of home — heading + button stack */
	.has-ink-background-color .wp-block-columns {
		flex-direction: column;
	}
	.has-ink-background-color .wp-block-column {
		flex-basis: 100% !important;
		width: 100% !important;
	}

	/* Hero illustration — sits below text on mobile, no negative margin */
	.hero-illustration img { max-height: none; margin: 0 auto; }

	/* Brand band thinner */
	.brand-band { height: 4px; }
	.brand-band--thick { height: 8px; }
}

/* Phone ≤ 640px ------------------------------------------------------- */
@media (max-width: 640px) {
	.primelab-wordmark { font-size: 0.78rem; }
	.primelab-wordmark--img img { height: 20px !important; }
	.lang-switcher { font-size: 0.8rem; }

	/* Hero h1 scales down once more on small phones */
	.hero-display h1, h1.hero-display {
		font-size: clamp(1.85rem, 9vw, 2.75rem) !important;
		line-height: 0.95 !important;
	}

	/* Comfortable mobile horizontal margin — was 1rem, content felt
	   cramped against the screen edges (especially long h1s like
	   "Berbagai layanan, satu lokasi."). 1.5rem (24px) reads better. */
	main.wp-block-group {
		padding-left: 1.5rem !important;
		padding-right: 1.5rem !important;
	}

	/* Service summary cards — stack */
	.services-summary__grid { grid-template-columns: 1fr !important; }
	.service-card { border-right: 0 !important; border-bottom: 1px solid var(--wp--preset--color--ink); padding: 1.5rem 1.25rem; }
	.service-card__title { font-size: 1.25rem; }

	/* Package grid — stack */
	.package-grid { grid-template-columns: 1fr !important; }

	/* Footer → 1 col */
	.site-footer .wp-block-column {
		flex-basis: 100% !important;
	}
	.site-footer__wordmark-row { padding-bottom: 1.5rem; }

	/* (Partner gallery responsive rules now live in the partner-gallery
	   block above — class-based, no longer needs inline-style overrides.) */

	/* Detailed-services About → 2 col then 1 */
	.detailed-services { grid-template-columns: 1fr !important; }
	.detailed-service { border-right: 0 !important; }

	/* Stats → 2 col on phone */
	.primelab-stats__inner { grid-template-columns: repeat(2, 1fr) !important; }
	.primelab-stats .stat-cell:nth-child(odd)  { border-right: 1px solid #1F2937; }
	.primelab-stats .stat-cell:nth-child(even) { border-right: 0; }

	/* Blog list rows: image stacks above text */
	.blog-list-row .wp-block-columns { flex-direction: column !important; }
	.blog-list-row .wp-block-column { flex-basis: 100% !important; width: 100% !important; }
	.blog-list-row__title { font-size: 1.35rem !important; }

	/* Article-summary cards (home) stack neatly */
	.article-summary__title { font-size: 1.25rem; }

	/* Corporate CTA */
	.corporate-cta { padding-left: 1rem; padding-right: 1rem; }

	/* History timeline — tighter padding on small screens */
	.history-timeline { padding-left: 1.5rem; }
	.history-timeline li::before { left: -2rem; }

	/* Services full title */
	.service-row__title { font-size: clamp(1.5rem, 5vw + 0.5rem, 2rem) !important; }

	/* Hide the navigation justifyContent right on overlay mode — let
	   block theme handle hamburger naturally */
}

/* Small phone ≤ 420px ------------------------------------------------- */
@media (max-width: 420px) {
	.primelab-wordmark { font-size: 0.72rem; gap: 0.35ch; }
	.primelab-wordmark--img img { height: 18px !important; }
	.primelab-wordmark--img .glyph { font-size: 0.95rem; }

	/* Stats → 1 col on tiny screens */
	.primelab-stats__inner { grid-template-columns: 1fr !important; }
	.primelab-stats .stat-cell { border-right: 0 !important; padding: 1.5rem 1.25rem; }
	.primelab-stats .stat-cell__value { font-size: 2rem; }

	/* Hero buttons full width */
	.wp-block-buttons { width: 100%; }
	.wp-block-button { width: 100%; }
	.wp-block-button__link { display: block; text-align: center; width: 100%; }

	/* Big-mark / display text */
	.has-display-size { font-size: clamp(2.5rem, 12vw, 4rem); }
}

/* =====================================================================
 * GLOBAL MOBILE SAFETY NET — FINAL PASS
 * Catches overflow, tightens single-post / article / table rendering,
 * ensures every alignfull section stays within the viewport.
 * =================================================================== */

/* Prevent horizontal overflow site-wide */
html, body { overflow-x: hidden; }

/* All images self-contain */
img, video, iframe { max-width: 100%; height: auto; }

/* Long words / URLs in content shouldn't blow out the column */
.entry-content,
.wp-block-post-content,
main article,
.service-row__content,
.article-summary__excerpt,
.blog-list-row__excerpt,
.detailed-service__desc {
	overflow-wrap: break-word;
	word-wrap: break-word;
}

/* Tables (HbA1c thresholds, BP classifications, etc.) get a horizontal-scroll
   wrapper on small screens instead of overflowing the page */
.wp-block-table {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	margin-left: -1rem;
	margin-right: -1rem;
	padding: 0 1rem;
}
@media (min-width: 821px) {
	.wp-block-table { margin-left: 0; margin-right: 0; padding: 0; }
}
.wp-block-table table {
	min-width: 480px; /* keeps columns readable; wrapper handles overflow */
	border-collapse: collapse;
}
.wp-block-table th,
.wp-block-table td {
	padding: 0.5rem 0.75rem;
	border: 1px solid var(--wp--preset--color--border);
	font-size: 0.9rem;
}
.wp-block-table thead th {
	background: var(--wp--preset--color--cream-warm);
	font-weight: 700;
}

/* Tablet+phone tightening across pages -------------------------------- */
@media (max-width: 820px) {
	/* Generic stacks for any 2-col custom flex group I might have written
	   without the wp-block-columns class */
	.contact-card-v2 .wp-block-columns,
	.featured-package .wp-block-columns,
	.corporate-cta .wp-block-columns {
		flex-direction: column !important;
	}

	/* Quote blocks tighter */
	.wp-block-quote {
		padding-left: 1rem !important;
		font-size: 1.05rem !important;
	}

	/* Single post (article) — featured image + meta cleanup */
	.wp-block-post-featured-image {
		max-height: 320px;
		overflow: hidden;
	}
	.wp-block-post-featured-image img {
		object-fit: cover;
		width: 100%;
		height: auto;
	}

	/* Single post body padding */
	main.wp-block-group {
		padding-top: 2rem !important;
		padding-bottom: 3rem !important;
	}

	/* Hero illustration on home: keep at native size on mobile (no shrink). */
	.hero-illustration img {
		max-height: none;
	}

	/* About — detailed services 9-card grid: 2 cols then 1 */
	.detailed-services {
		grid-template-columns: repeat(2, 1fr) !important;
	}
	.detailed-service {
		padding: 1.25rem 1rem;
	}

	/* About — quote block alignment */
	.alignwide .wp-block-quote { margin-left: 0; }

	/* Company Profile 3-col stacks via wp-block-columns native; nothing extra */

	/* Embedded Maps iframe wrapper height */
	main .wp-block-group [style*="padding-bottom:50%"] {
		padding-bottom: 75% !important;
	}

	/* Single-package detail page — center & contain */
	.single-package-wrap {
		max-width: 100% !important;
		padding: 0 1rem;
	}
}

/* Phone refinements ≤ 640px ----------------------------------------- */
@media (max-width: 640px) {
	body { font-size: 0.92rem; }

	/* Detailed services on About: 1-col already happens via earlier rule;
	   make sure padding is right */
	.detailed-services {
		grid-template-columns: 1fr !important;
	}

	/* All h1 across all pages stay readable */
	h1, .wp-block-heading[class*="level-1"] {
		font-size: clamp(1.85rem, 7vw + 0.5rem, 2.75rem) !important;
		line-height: 1 !important;
	}
	h2 {
		font-size: clamp(1.5rem, 5vw + 0.5rem, 2rem) !important;
	}
	h3 { font-size: 1.2rem !important; }

	/* Hero illustration — keep native; the underlying asset is 300×282 so it
	   already fits a phone column comfortably. */
	.hero-illustration img { max-height: none; }

	/* Buttons full-width, stacked spacing */
	.wp-block-buttons { gap: 0.75rem; }

	/* History timeline tighter dots */
	.history-timeline {
		padding-left: 1.25rem;
	}
	.history-timeline li::before {
		left: -1.7rem;
		width: 9px;
		height: 9px;
	}

	/* Service row body padding tightens */
	.service-row__body {
		padding: 1.5rem 1rem !important;
	}
	.service-row__title { font-size: 1.5rem !important; }

	/* Featured-package on home */
	.featured-package__body {
		padding: 1.5rem 1rem !important;
	}

	/* Maps iframe wrapper */
	main .wp-block-group [style*="padding-bottom"] {
		padding-bottom: 90% !important;
	}

	/* Recommended packages grid stays 1-col (auto-fit handles this when
	   minmax(260px,1fr) fails to fit two columns) — but ensure the gap is small */
	.package-grid { gap: 0.75rem !important; }

	/* Package cards on mobile — tighter padding + smaller internal gaps */
	.package-card {
		padding: 1.1rem 1.1rem !important;
		gap: 0.5rem !important;
	}
	.package-card__category {
		font-size: 0.62rem !important;
		letter-spacing: 0.16em !important;
		margin: 0 !important;
	}
	.package-card__title {
		font-size: 1.1rem !important;
		line-height: 1.2 !important;
		margin: 0 !important;
	}
	.package-card__price {
		font-size: 1.45rem !important;
		line-height: 1 !important;
		margin: 0 !important;
	}
	.package-card__price-currency {
		font-size: 0.7rem !important;
		letter-spacing: 0.1em !important;
	}
	.package-card__items {
		font-size: 0.85rem !important;
		line-height: 1.4 !important;
	}
	.package-card__items li {
		padding-left: 0.9em !important;
	}
	.package-card__cta {
		padding: 0.75rem 1.1rem !important;
		font-size: 0.7rem !important;
	}
	.package-card__image {
		margin: -1.1rem -1.1rem 0 -1.1rem !important;
		min-height: 130px !important;
	}

	/* Single post post-title spacing */
	.wp-block-post-title {
		font-size: clamp(1.75rem, 7vw, 2.5rem) !important;
		letter-spacing: -0.025em !important;
		line-height: 1.05 !important;
	}

	/* Article body: tighter spacing */
	.wp-block-post-content > * + * { margin-top: 1rem; }
	.wp-block-post-content h2 { margin-top: 2rem !important; }
	.wp-block-post-content h3 { margin-top: 1.5rem !important; }
	.wp-block-post-content ul,
	.wp-block-post-content ol { padding-left: 1.25rem; }

	/* Stats cells smaller font */
	.primelab-stats .stat-cell__value { font-size: 1.85rem !important; }
	.primelab-stats .stat-cell__label { font-size: 0.65rem; letter-spacing: 0.16em; }

	/* Contact-hours-strip stacks gracefully */
	.contact-hours-strip__value {
		font-size: 1rem !important;
	}

	/* Footer top stack */
	.site-footer__top-inner { gap: 1rem; padding: 0 1.25rem; }
	.site-footer__tagline { font-size: 0.9rem; }
}

/* Tiny phone ≤ 380px ------------------------------------------------- */
@media (max-width: 380px) {
	main.wp-block-group {
		padding-left: 1.15rem !important;
		padding-right: 1.15rem !important;
	}

	.home-hero { padding-top: 0.4rem !important; padding-bottom: 1.75rem !important; }
	.home-hero--photo {
		padding-top: 2rem !important;
		padding-bottom: 2rem !important;
		height: auto !important;
		max-height: none !important;
		min-height: 68vh !important;
	}

	h1.hero-display, .hero-display h1 {
		font-size: clamp(1.7rem, 9vw, 2.2rem) !important;
	}
	.hero-eyebrow {
		font-size: 0.55rem;
		letter-spacing: 0.14em;
	}

	.primelab-wordmark--img img { height: 17px !important; }

	/* Footer brand tags row may wrap awkwardly — tighter gap */
	.site-footer__brand-tags { gap: 0.5rem 0.85rem; }
	.site-footer__brand-tag { font-size: 0.62rem; letter-spacing: 0.12em; }

	/* Stats cells in 1-col */
	.primelab-stats__inner { grid-template-columns: 1fr !important; }
	.primelab-stats .stat-cell { padding: 1.25rem 1rem; }

	/* Tighten history timeline year markers further */
	.history-timeline .year { font-size: 0.62rem; letter-spacing: 0.14em; }
}

/* Prevent flex children from overflowing in any custom layout */
.wp-block-columns > .wp-block-column,
.site-header__bar > *,
.contact-card-v2,
.contact-card-v2 > *,
.footer-col,
.service-row,
.service-row > * {
	min-width: 0;
}

/* Long links inside footer / nav don't blow out cell width */
.footer-col__contact-value,
.footer-col__list a,
.contact-card-v2__row-value a {
	overflow-wrap: anywhere;
}

/* --- Utility ---------------------------------------------------------- */
.has-tight-tracking { letter-spacing: -0.02em; }
.has-display-size {
	font-size: clamp(3rem, 9vw, 8rem);
	font-weight: 900;
	letter-spacing: -0.045em;
	line-height: 0.92;
}

/* =====================================================================
 * Feedback form (public /feedback/ page)
 * ================================================================== */
.feedback-form-wrap {
	max-width: 720px;
	margin: 0;
}
.feedback-form {
	display: flex;
	flex-direction: column;
	gap: 1.75rem;
	padding: 0;
}
.feedback-form__notice {
	padding: 1rem 1.1rem;
	border-radius: 4px;
	font-size: 0.95rem;
	line-height: 1.5;
	margin: 0 0 1.5rem 0;
	border: 1px solid transparent;
}
.feedback-form__notice--ok {
	background: rgba(46, 157, 92, 0.10);
	border-color: rgba(46, 157, 92, 0.45);
	color: #0e5a36;
}
.feedback-form__notice--err {
	background: rgba(220, 53, 69, 0.08);
	border-color: rgba(220, 53, 69, 0.45);
	color: #8a1f2c;
}

.feedback-form__hp {
	position: absolute !important;
	left: -10000px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.feedback-form__group {
	border: 1px solid rgba(15, 23, 42, 0.10);
	border-radius: 6px;
	padding: 1.25rem 1.25rem 1.4rem;
	margin: 0;
	background: var(--wp--preset--color--cream-warm, #f7f3ea);
}
.feedback-form__legend {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink);
	padding: 0 0.4rem;
	margin-left: -0.4rem;
}
.feedback-form__hint {
	margin: 0.4rem 0 0.8rem 0;
	font-size: 0.85rem;
	color: var(--wp--preset--color--ink-soft);
	line-height: 1.5;
}
.feedback-form__req {
	color: #c5374a;
	font-style: normal;
	font-weight: 600;
}
.feedback-form__opt {
	color: var(--wp--preset--color--ink-soft);
	font-style: normal;
	font-weight: 500;
}

/* ---- Star rating ---- */
.star-rating {
	display: inline-flex;
	flex-direction: row-reverse;
	justify-content: flex-end;
	gap: 0.15rem;
	font-size: 2.2rem;
	line-height: 1;
	margin: 0.75rem 0 0.25rem;
}
.star-rating input[type="radio"] {
	position: absolute;
	left: -10000px;
	width: 1px;
	height: 1px;
	opacity: 0;
}
.star-rating label {
	cursor: pointer;
	color: #d8dde2;
	transition: color 0.15s ease, transform 0.15s ease;
	user-select: none;
	padding: 0 0.05em;
}
.star-rating label:hover,
.star-rating label:hover ~ label,
.star-rating input:checked ~ label {
	color: #E5A50A;
}
.star-rating label:hover {
	transform: scale(1.08);
}
.star-rating input:focus-visible + label {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
	border-radius: 2px;
}

/* ---- Fields ---- */
.feedback-form__field {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}
.feedback-form__field--narrow {
	max-width: 280px;
}
.feedback-form__label {
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
}
.feedback-form__label em {
	font-size: 0.78rem;
	margin-left: 0.25rem;
}
.feedback-form__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 1rem;
	margin-top: 0.5rem;
}
.feedback-form input[type="text"],
.feedback-form input[type="email"],
.feedback-form input[type="date"],
.feedback-form textarea {
	font: inherit;
	font-size: 1rem;
	line-height: 1.5;
	color: var(--wp--preset--color--ink);
	background: #fff;
	border: 1px solid rgba(15, 23, 42, 0.20);
	border-radius: 4px;
	padding: 0.65rem 0.85rem;
	width: 100%;
	box-sizing: border-box;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.feedback-form input[type="text"]:focus,
.feedback-form input[type="email"]:focus,
.feedback-form input[type="date"]:focus,
.feedback-form textarea:focus {
	outline: 0;
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.12);
}
.feedback-form textarea {
	min-height: 140px;
	resize: vertical;
	font-family: inherit;
}

/* ---- File input ---- */
.feedback-form__file {
	display: inline-block;
}
.feedback-form__file input[type="file"] {
	display: block;
	margin-top: 0.5rem;
	font: inherit;
	font-size: 0.9rem;
}
.feedback-form__file input[type="file"]::file-selector-button {
	font: inherit;
	background: var(--wp--preset--color--cream);
	border: 1px solid var(--wp--preset--color--ink);
	border-radius: 3px;
	padding: 0.5rem 1rem;
	margin-right: 0.75rem;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}
.feedback-form__file input[type="file"]::file-selector-button:hover {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--cream);
}

/* ---- Submit ---- */
.feedback-form__actions {
	margin-top: 0.5rem;
}
.feedback-form__submit {
	font: inherit;
	font-size: 1rem;
	font-weight: 600;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--cream);
	border: 0;
	border-radius: 3px;
	padding: 0.9rem 1.75rem;
	cursor: pointer;
	letter-spacing: 0.01em;
	transition: background 0.15s ease;
}
.feedback-form__submit:hover,
.feedback-form__submit:focus-visible {
	background: var(--wp--preset--color--secondary);
}

@media (max-width: 640px) {
	.feedback-form { gap: 1.4rem; }
	.feedback-form__group { padding: 1rem 1rem 1.25rem; }
	.star-rating { font-size: 2rem; gap: 0.05rem; }
}

/* Feedback page lead paragraph */
.feedback-page__lede {
	font-size: 1.125rem;
	line-height: 1.6;
	color: var(--wp--preset--color--ink-soft);
	max-width: 60ch;
	margin: 0 0 2.25rem 0;
}

/* =====================================================================
 * Partner cell — clickable variant + detail modal
 * ================================================================== */
.partner-cell--clickable {
	font: inherit;
	color: inherit;
	cursor: pointer;
	border: 0;
	border-right: 1px solid var(--wp--preset--color--ink);
	border-bottom: 1px solid var(--wp--preset--color--ink);
	background: var(--wp--preset--color--cream);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	padding: 1.5rem 1rem 1.25rem;
	min-height: 110px;
	transition: background-color 0.2s ease;
	position: relative;
}
.partner-cell--clickable:hover,
.partner-cell--clickable:focus-visible {
	background: var(--wp--preset--color--base);
	outline: 0;
}
.partner-cell--clickable .partner-cell__name {
	display: none;
}

.partner-detail {
	position: fixed;
	inset: 0;
	background: rgba(15, 23, 42, 0.55);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.25rem;
	animation: partner-fade 0.18s ease-out;
}
.partner-detail[hidden] { display: none; }
@keyframes partner-fade { from { opacity: 0; } to { opacity: 1; } }

.partner-detail__inner {
	background: var(--wp--preset--color--base);
	max-width: 520px;
	width: 100%;
	padding: 2.25rem 2rem 2rem;
	border-radius: 6px;
	position: relative;
	max-height: 90vh;
	overflow-y: auto;
	box-shadow: 0 18px 60px rgba(0, 0, 0, 0.25);
}
.partner-detail__close {
	position: absolute;
	top: 0.6rem;
	right: 0.85rem;
	background: transparent;
	border: 0;
	font-size: 1.6rem;
	line-height: 1;
	cursor: pointer;
	color: var(--wp--preset--color--ink-soft);
	padding: 0.25rem 0.5rem;
	border-radius: 3px;
}
.partner-detail__close:hover { color: var(--wp--preset--color--ink); }
.partner-detail__logo {
	background: var(--wp--preset--color--cream-warm);
	padding: 1.25rem;
	border-radius: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 96px;
	margin: 0 0 1.25rem 0;
}
.partner-detail__logo img {
	max-height: 64px;
	max-width: 100%;
	height: auto;
	width: auto;
	object-fit: contain;
	display: block;
	mix-blend-mode: multiply;
}
.partner-detail__name {
	margin: 0 0 0.75rem 0;
	font-size: 1.45rem;
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1.15;
}
.partner-detail__desc {
	margin: 0 0 1.25rem 0;
	font-size: 1rem;
	line-height: 1.6;
	color: var(--wp--preset--color--ink);
}
.partner-detail__link {
	display: inline-block;
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--wp--preset--color--primary);
	text-decoration: none;
	border-bottom: 1px solid currentColor;
}
.partner-detail__link:hover { color: var(--wp--preset--color--secondary); }

body.partner-detail-open { overflow: hidden; }

@media (max-width: 640px) {
	.partner-detail__inner { padding: 1.75rem 1.25rem 1.5rem; }
	.partner-detail__name { font-size: 1.25rem; }
}

/* =====================================================================
 * Mobile gap killers — applied last so they win source order.
 * On phones, close the dead band between the Operational Hours strip
 * and the first service row on /services/.
 * ================================================================== */
@media (max-width: 820px) {
	/* Pull the services-full up to butt against the hours strip's
	 * border-bottom, regardless of WP block-gap or layout rules. */
	main .services-full,
	main.wp-block-group .services-full,
	body main .services-full {
		margin-top: 0 !important;
		padding-top: 0 !important;
	}
	/* First service-row in the list: zero any margin its container adds */
	main .services-full > .service-row:first-child {
		margin-top: 0 !important;
		padding-top: 0 !important;
	}
	/* Tighten the hours strip's own bottom padding on mobile */
	main .wp-block-group.is-content-justification-space-between {
		padding-top: 0.6rem !important;
		padding-bottom: 0.6rem !important;
	}
}

/* ── Company identity (Informasi Umum / General Information) ───────── */
.company-identity {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0;
	margin: 1rem 0 0;
	border: 1px solid var(--wp--preset--color--line, #E2E8F0);
	border-radius: 12px;
	overflow: hidden;
	background: #fff;
}
.company-identity__row {
	display: grid;
	grid-template-columns: minmax(160px, 0.35fr) 1fr;
	gap: 1rem;
	padding: 0.85rem 1.25rem;
	border-bottom: 1px solid var(--wp--preset--color--line, #E2E8F0);
}
.company-identity__row:last-child { border-bottom: 0; }
.company-identity__row dt {
	margin: 0;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-soft, #64748B);
	align-self: center;
}
.company-identity__row dd {
	margin: 0;
	font-size: 0.98rem;
	font-weight: 500;
	color: var(--wp--preset--color--ink, #0F172A);
	line-height: 1.5;
}
.company-identity__row dd a {
	color: var(--wp--preset--color--primary, #1E3A8A);
	text-decoration: none;
	border-bottom: 1px solid currentColor;
}
.company-identity__row dd a:hover {
	color: var(--wp--preset--color--secondary, #2E9D5C);
}
@media (max-width: 640px) {
	.company-identity__row {
		grid-template-columns: 1fr;
		gap: 0.2rem;
		padding: 0.85rem 1rem;
	}
	.company-identity__row dt { font-size: 0.7rem; }
}

/* ── Company profile YouTube embed (16:9 responsive) ───────────────── */
.company-video {
	position: relative;
	width: 100%;
	max-width: 920px;
	margin: 0 auto;
	aspect-ratio: 16 / 9;
	border-radius: 14px;
	overflow: hidden;
	background: #000;
	box-shadow: 0 8px 28px rgba(15, 23, 42, 0.12);
}
.company-video iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}