/*
Theme Name: Tuart Hill (Web Wizards Divi child)
Description: Child theme for Divi 5, for Tuart Hill Baby & Childcare. Built on the Web Wizards child theme's conventions.
Author: Web Wizards
Author URI: https://webwizards.com.au
Template: Divi
Version: 1.0
Text Domain: tuarthill-child
*/

/*
 * Only what Divi 5 can't do itself. Each rule is listed in docs/divi5-assessment.md.
 */

/* 0. Base: Divi's theme stylesheet puts 10px under every heading; spacing here comes from the modules instead. */
h1, h2, h3, h4, h5, h6 { padding-bottom: 0; }
/* Module Groups set to the list tags (ol/ul/li) keep their semantics but not Divi's article list styling. */
ol.et_pb_group, ul.et_pb_group { list-style: none; padding: 0; margin: 0; line-height: inherit; }
li.et_pb_group { line-height: inherit; }

/* 1. Highlighted words in a headline: accent colour plus the hand-drawn underline. Divi styles whole text
      elements, not a few words inside one, so editors wrap the words in <span class="th-mark">. */
.th-mark {
	position: relative;
	white-space: nowrap;
	color: var(--gcid-th-green);
}
.th-mark::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -14px;
	width: var(--th-mark-width, 100%);
	height: 22px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 30' preserveAspectRatio='none'%3E%3Cpath d='M4 20 C 80 6, 160 26, 240 12 S 360 8, 396 16' fill='none' stroke='%23F7B8A3' stroke-width='9' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat;
	background-size: 100% 100%;
	pointer-events: none;
}
.th-mark--alt::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 30' preserveAspectRatio='none'%3E%3Cpath d='M4 18 C 90 8, 170 26, 250 14 S 360 8, 396 15' fill='none' stroke='%23F7B8A3' stroke-width='9' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 2. Type inside SVG drawings: Divi's SVG module removes style attributes, so text in the "30 years" stamp is
      styled by class. */
.th-svg-arc { font-family: var(--gvid-th-font-body), sans-serif; font-size: 12.5px; font-weight: 700; letter-spacing: 3px; }
.th-svg-big { font-family: var(--gvid-th-font-heading), serif; font-size: 44px; font-weight: 800; text-anchor: middle; }
.th-svg-small { font-family: var(--gvid-th-font-body), sans-serif; font-size: 12px; font-weight: 700; letter-spacing: 2px; text-anchor: middle; }

/* 3. Educators filter (js/tuarthill.js) hides cards with the hidden attribute; Divi's flex display would win. */
.th-person[hidden] { display: none !important; }

/* 4. Layout shift while the web fonts load (Lighthouse CLS). Divi prints a font Design Variable as one quoted name,
      so it can't carry a fallback. Here each variable gets the web font, then Arial resized to take the same space
      (so text doesn't re-wrap when the web font arrives), then a generic family.
      If a font Design Variable is changed in Divi, change the first name here too. */
@font-face { font-family: 'Bricolage Fallback'; src: local('Arial Bold'), local('Arial-BoldMT'), local('Arial'); font-weight: 100 900; size-adjust: 79.7%; ascent-override: 116.7%; descent-override: 33.9%; line-gap-override: 0%; }
@font-face { font-family: 'Figtree Fallback'; src: local('Arial'), local('ArialMT'); font-weight: 100 900; size-adjust: 100.2%; ascent-override: 94.8%; descent-override: 25%; line-gap-override: 0%; }
:root:root {
	--gvid-th-font-heading: 'Bricolage Grotesque', 'Bricolage Fallback', sans-serif;
	--gvid-th-font-body: 'Figtree', 'Figtree Fallback', sans-serif;
	--gvid-th-font-script: 'Caveat', cursive;
}
