/*
 * Perio Child — child.css (version = PERIO_CHILD_VERSION in functions.php).
 * One section per finding; each says who decided and when.
 */

/* ---------------------------------------------------------------------------
 * W4 — Homepage slider: reserve its height at desktop widths (PM brief 003, 2026-09-24).
 * Divi's slider JS sets every slide container to the tallest slide's height after load
 * (measured locally: 585.797px at 981, 1100, 1280, 1350, 1440 and 1920 px wide; 540px before JS).
 * The vertically centred slide content then jumps, which is the 0.32 desktop CLS in the baseline.
 * Giving the container that height from the start leaves the JS nothing to change.
 * If the slide text is edited and a slide gets taller, re-measure:
 *   document.querySelector('.et_pb_fullwidth_slider_0 .et_pb_container').style.height
 * Below 981px Divi stacks the layout differently and mobile CLS is fine (0.05–0.10), so no rule there.
 * ------------------------------------------------------------------------- */
@media (min-width: 981px) {
	.home .et_pb_fullwidth_slider_0 .et_pb_slide .et_pb_container {
		height: 586px;
	}
}

/* ---------------------------------------------------------------------------
 * W5 — Visible Gravity Forms labels (PM brief 003, 2026-09-24).
 * Replaces the "REMOVE LABEL ON FIELDS USING PLACEHOLDER" rule in Divi → Theme Options → Custom CSS,
 * which Juan Carlos deletes after activation. The `body` prefix outranks that rule, so labels are
 * visible even before it is deleted.
 * Field labels (Name, Email, Phone, Message) are shown. The Name field has a single input whose
 * sub-label reads "First"; that sub-label stays available to screen readers but is not shown,
 * so sighted users see one "Name" label, not "Name … First".
 * ------------------------------------------------------------------------- */
body .gform_wrapper .top_label .gfield_label {
	display: block;
	margin-bottom: 4px;
	font-weight: 600;
	color: inherit;
}

body .gform_wrapper .field_sublabel_below .ginput_complex.ginput_container label {
	display: block;
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* ---------------------------------------------------------------------------
 * W1 — tel: links inherit the text colour of where they sit (header bar, footer, body copy),
 * so the change is behavioural, not visual. Underline on hover/focus only.
 * ------------------------------------------------------------------------- */
a.perio-tel {
	color: inherit;
	text-decoration: none;
}

a.perio-tel:hover,
a.perio-tel:focus {
	text-decoration: underline;
}

/* ---------------------------------------------------------------------------
 * Collapsible mobile sub-menus — styles for assets/js/mobile-submenu.js.
 * Moved from Divi → Theme Options → Custom CSS in 1.0.0 together with the script (PM brief 003 item 7).
 * Why here and not left in Custom CSS: activating a child theme makes Divi copy Custom CSS into a new
 * post and that copy turns ">" into ">" and drops the backslash in "\4c" (measured locally,
 * 2026-09-24) — the menu rules break. A Theme Options save also strips backslashes. A theme file does
 * neither. The #mobile_menu prefix outranks any leftover copy in Custom CSS.
 * ------------------------------------------------------------------------- */
#main-header #mobile_menu li ul.hide {
	display: none !important;
}

#mobile_menu .menu-item-has-children {
	position: relative;
}

#mobile_menu .menu-item-has-children > a {
	background: transparent;
}

#mobile_menu .menu-item-has-children > a + span {
	position: absolute;
	right: 0;
	top: 0;
	padding: 10px 20px;
	font-size: 20px;
	font-weight: 700;
	cursor: pointer;
	z-index: 3;
}

#mobile_menu span.menu-closed::before {
	content: "\4c";
	display: block;
	color: #000;
	font-size: 16px;
	font-family: ETmodules;
}

#mobile_menu span.menu-closed.menu-open::before {
	content: "\4d";
}