/*
Theme Name: BlissfulPlate Child
Template: generatepress
Version: 1.2
Description: Child theme for BlissfulPlate. Owns heading scale (to win over GeneratePress
defaults), GeneratePress structural overrides, and all component + layout CSS.
Design tokens (colors, font sizes, spacing) live in theme.json.
*/

/* =========================================================
   FONT FAMILY
   ========================================================= */
body,
h1, h2, h3, h4, h5, h6,
.main-navigation a,
button, input, select, textarea {
  font-family: 'Poppins', sans-serif;
}

html {
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* =========================================================
   HEADINGS
   ========================================================= */
h1 { font-size: var(--wp--preset--font-size--xxxx-large); font-weight: 800; line-height: 1.2; color: var(--wp--preset--color--near-black); }

h2 { font-size: var(--wp--preset--font-size--xxx-large); font-weight: 700; line-height: 1.25; color: var(--wp--preset--color--near-black); }

h3 { font-size: var(--wp--preset--font-size--xx-large); font-weight: 700; line-height: 1.3; color: var(--wp--preset--color--near-black); }

h4 { font-size: var(--wp--preset--font-size--x-large); font-weight: 600; line-height: 1.35; color: var(--wp--preset--color--near-black); }

h5 { font-size: var(--wp--preset--font-size--large); font-weight: 600; line-height: 1.4; color: var(--wp--preset--color--near-black); }

h6 { font-size: var(--wp--preset--font-size--x-small); font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--wp--preset--color--orange); line-height: 1.4; margin-bottom: var(--wp--preset--spacing--30);}

body,
p {
  font-size: var(--wp--preset--font-size--medium);
    color: var(--wp--preset--color--near-black);
    letter-spacing: 0.1px;
}

h1, h2, h3, h4, h5, h6 {
    margin-bottom: var(--wp--preset--spacing--40);
}

.eyebrow {
  display: block;
  font-size: var(--wp--preset--font-size--x-small);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--wp--preset--color--orange);
}

/* =========================================================
   IMAGES
   ========================================================= */
.wp-block-image {
	margin-bottom: var(--wp--preset--spacing--40);
}

/* =========================================================
   LINKS
   ========================================================= */
a { color: var(--wp--preset--color--orange); text-decoration: none; }
a:hover { color: var(--wp--preset--color--burnt-orange); text-decoration: underline; }

/* =========================================================
   BUTTONS
   ========================================================= */
a.wp-block-button__link:not(.has-background),
.wp-element-button:not(.has-background) {
  background-color: var(--wp--preset--color--yellow);
  color: var(--wp--preset--color--near-black);
  font-weight: 700;
  font-size: var(--wp--preset--font-size--medium);
  letter-spacing: 0.02em;
  padding: 10px 24px;
  border-radius: 4px;
  text-decoration: none;
}
a.wp-block-button__link:not(.has-background):hover,
.wp-element-button:not(.has-background):hover {
  background-color: var(--wp--preset--color--dark-gold);
  color: var(--wp--preset--color--near-black);
}

/* =========================================================
   ANNOUNCEMENT BAR  (GP Hook Element on wp_body_open)
   ========================================================= */
.announcement-bar {
  background: var(--wp--preset--color--yellow);
  color: var(--wp--preset--color--near-black);
  text-align: center;
  padding: 12px 20px;
  font-size: var(--wp--preset--font-size--x-small);
  font-weight: 500;
}
.announcement-bar a { color: var(--wp--preset--color--near-black); font-weight: 700; text-decoration: underline; }
.announcement-bar a:hover { color: var(--wp--preset--color--charcoal); }

/* =========================================================
   PRIMARY NAV MENU
   ========================================================= */
/* Item spacing */
#site-navigation .main-nav > ul > li {
  margin: 0 10px;
}
 
/* Links: near-black, semibold, kill native underline */
#site-navigation .main-nav ul li a {
  position: relative;
  text-decoration: none;
  font-weight: 600;
  color: var(--wp--preset--color--near-black);
  transition: color 0.2s ease;
}
 
/* Animated underline bar.
   GP menu links have tall vertical padding, so the bar is positioned
   from the bottom of that padded area. Adjust `bottom` until it sits
   just under the text (higher number = higher up). */
#site-navigation .main-nav ul li a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 18px;              /* tune to sit under the text */
  transform: scaleX(0);
  transform-origin: left center;
  height: 2px;
  background: var(--wp--preset--color--orange);
  transition: transform 0.25s ease;
}
#site-navigation .main-nav ul li a:hover::after,
#site-navigation .main-nav ul li.current-menu-item > a::after,
#site-navigation .main-nav ul li.current-menu-ancestor > a::after {
  transform: scaleX(1);
}
 
/* Hover + active color */
#site-navigation .main-nav ul li a:hover,
#site-navigation .main-nav ul li.current-menu-item > a,
#site-navigation .main-nav ul li.current-menu-ancestor > a {
  color: var(--wp--preset--color--orange);
}
 
/* No bar on submenu dropdown items */
#site-navigation .main-nav ul ul li a::after { display: none; }
 
/* =========================================================
   POLISH — hover transitions
   ========================================================= */
.gb-container img,
.gb-element img { transition: transform 0.2s ease; }

/* =========================================================
   NUMBERED COUNTER
   ========================================================= */
.numbered-grid { counter-reset: item; }
.numbered-grid .numbered-item { counter-increment: item; }
.numbered-grid .numbered-item .image-wrap { position: relative; }
.numbered-grid .numbered-item .number-badge {
  position: absolute; bottom: 0; left: 50%; width: 0; height: 0;
}

.numbered-grid .numbered-item .number-badge::before {
  content: counter(item);
  position: absolute;
  bottom: -16px; left: -16px;
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--wp--preset--color--orange);
  color: #FFFFFF;
  font-weight: 700; font-size: var(--wp--preset--font-size--x-small);
  display: flex; align-items: center; justify-content: center;
  z-index: 2;
}

/* =========================================================
   LIST STYLES
   ========================================================= */

/* ---- Unordered: orange round bullets ---- */
.entry-content ul {
  list-style: none;
  padding-left: 0;
  margin: 0 0 1.25em;
}
.entry-content ul li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 10px;
  line-height: 1.6;
}
.entry-content ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.6em;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--wp--preset--color--orange);
}

/* ---- Ordered: numbered orange circles ---- */
.entry-content ol {
  list-style: none;
  padding-left: 0;
  margin: 0 0 1.25em;
  counter-reset: step;
}
.entry-content ol li {
  position: relative;
  padding-left: 40px;
  margin-bottom: 12px;
  line-height: 1.6;
  counter-increment: step;
}
.entry-content ol li::before {
  content: counter(step);
  position: absolute;
  left: 0;
  top: 0.1em;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--wp--preset--color--orange);
  color: #FFFFFF;
  font-size: 13px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ---- Nested lists keep the same markers, indented ---- */
.entry-content li ul,
.entry-content li ol {
  margin-top: 10px;
  margin-bottom: 0;
}

/* =========================================================
   NEWSLETTER
   ========================================================= */
.newsletter-section {
  background: var(--wp--preset--color--lemon-cream);
  border-top: 4px solid var(--wp--preset--color--yellow);
  border-bottom: 4px solid var(--wp--preset--color--yellow);
  text-align: center;
}
.newsletter-form { display: flex; gap: 12px; max-width: 460px; margin: 0 auto; }
.newsletter-form input[type="email"] {
  flex: 1;
  background: var(--wp--preset--color--near-black);
  color: #FFFFFF; border: none; border-radius: 8px;
  padding: 16px 20px; font-size: var(--wp--preset--font-size--small);
}
.newsletter-form input::placeholder { color: #999; }
.newsletter-form button {
  background: var(--wp--preset--color--yellow);
  color: var(--wp--preset--color--near-black);
  border: none; border-radius: 8px;
  padding: 16px 28px; font-weight: 700; font-size: var(--wp--preset--font-size--x-small);
  cursor: pointer; white-space: nowrap;
}
.newsletter-form button:hover { background: var(--wp--preset--color--dark-gold); }

/* =========================================================
   BREADCRUMBS
   ========================================================= */
.rank-math-breadcrumb p {
  font-size: var(--wp--preset--font-size--min) !important;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--wp--preset--color--mid-gray);
  margin-bottom: 8px;
}
.rank-math-breadcrumb a { color: var(--wp--preset--color--orange); text-decoration: underline; }
.rank-math-breadcrumb a:hover { color: var(--wp--preset--color--mid-gray); }
.rank-math-breadcrumb .separator { color: var(--wp--preset--color--orange); }

/* =========================================================
   AFFILIATE DISCLOSURE
   ========================================================= */
.affiliate-disclosure {
  font-size: var(--wp--preset--font-size--min);
  color: var(--wp--preset--color--mid-gray);
  line-height: 1.5;
  margin: 4px 0 0;
}

.entry-header {
  display: flex;
  flex-direction: column;
}

.entry-meta {
	font-size: var(--wp--preset--font-size--x-small);
	margin-top: 8px;
}
.entry-title       { order: 1; }
.entry-meta        { order: 2; }
.affiliate-disclosure { order: 3; }
.intro-buttons     { order: 4; }

/* =========================================================
   ALL ARTICLE TEMPLATES
   ========================================================= */
:is(.template-nutrition, .template-roundup, .template-recipe, .template-mealplan) .wp-block-image {
	margin-bottom: var(--wp--preset--spacing--70);
}

:is(.template-nutrition, .template-roundup, .template-recipe, .template-mealplan) h2, h3 {
  	margin-top: var(--wp--preset--spacing--70);
}

:is(.template-nutrition, .template-roundup, .template-recipe, .template-mealplan) h6 {
  	margin-top: var(--wp--preset--spacing--60);
}


/* Featured image — full width */
:is(.template-nutrition, .template-roundup, .template-recipe, .template-mealplan) .wp-block-image:first-of-type img {
  	max-width: 100%;
}

/* List item images — 450px, vertical */
:is(.template-nutrition, .template-roundup, .template-recipe, .template-mealplan) .wp-block-image:not(:first-of-type) {
  text-align: center;
}

:is(.template-nutrition, .template-roundup, .template-recipe, .template-mealplan) .wp-block-image:not(:first-of-type) img {
  	max-width: 450px;
  	aspect-ratio: 3/4;
  	object-fit: cover;
}

/* ---- Intro buttons (GB icon buttons) ---- */
.intro-buttons {
  	display: flex;
  	column-gap: 24px;
 	 align-items: center;
  	flex-wrap: wrap;
	margin-top: 20px;
  	margin-bottom: 10px;
}
.intro-buttons a {
  display: inline-flex;
  width: auto;
  align-items: center;
  column-gap: 0.5em;
  font-weight: 700;
  font-size: var(--wp--preset--font-size--x-small);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  text-decoration: none;
}
.intro-buttons .intro-btn-pin {
  	background: var(--wp--preset--color--yellow);
  	color: var(--wp--preset--color--near-black);
	padding: 14px 26px;
}
.intro-buttons .intro-btn-pin:hover {
  background: var(--wp--preset--color--dark-gold);
  color: var(--wp--preset--color--near-black);
}
.intro-buttons .intro-btn-email {
  	background: transparent;
  	color: var(--wp--preset--color--orange);
  	border: 2px solid var(--wp--preset--color--orange);
	padding: 12px 22px;
}
.intro-buttons .intro-btn-email:hover {
  	background: var(--wp--preset--color--orange);
  	color: #FFFFFF;
}
.intro-buttons a svg {
  	width: 1em;
  	height: 1em;
  	fill: currentColor;
}



/* =========================================================
   ARTICLE TEMPLATES — Nutrition & Roundup
   ========================================================= */

/* ---- Auto-numbered H3 ---- */
.template-nutrition,
.template-roundup { counter-reset: item; }

.template-nutrition h3,
.template-roundup h3 {
  	counter-increment: item;
  	border-bottom: 3px solid var(--wp--preset--color--yellow);
  	padding-bottom: 8px;
  	width: fit-content;
	margin-bottom: var(--wp--preset--spacing--60);
}
.template-nutrition h3::before,
.template-roundup h3::before {
  	content: counter(item, decimal-leading-zero) " ";
	color: var(--wp--preset--color--orange);
  	font-weight: 800;
  	margin-right: 10px;
}

/* =========================================================
   CTA BOX
   ========================================================= */
.cta-box {
  display: flex;
  align-items: center;
  gap: 14px;
  background: #FEF7F5;
  padding: 22px 28px;
  border: 1px solid var(--wp--preset--color--orange);
  margin: 0 0 var(--wp--preset--spacing--50);
}

/* Tag icon */
.cta-box::before {
  content: "";
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  background-color: var(--wp--preset--color--orange);
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M21.41 11.58l-9-9A2 2 0 0 0 11 2H4a2 2 0 0 0-2 2v7a2 2 0 0 0 .59 1.42l9 9a2 2 0 0 0 2.82 0l7-7a2 2 0 0 0 0-2.84zM7 9a2 2 0 1 1 0-4 2 2 0 0 1 0 4z'/></svg>") no-repeat center / contain;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M21.41 11.58l-9-9A2 2 0 0 0 11 2H4a2 2 0 0 0-2 2v7a2 2 0 0 0 .59 1.42l9 9a2 2 0 0 0 2.82 0l7-7a2 2 0 0 0 0-2.84zM7 9a2 2 0 1 1 0-4 2 2 0 0 1 0 4z'/></svg>") no-repeat center / contain;
}

/* Heading inside the box  */
.cta-box h5 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.2px;
  color: var(--wp--preset--color--near-black);
}


/* =========================================================
   LIST OF MEALS (not in use)
   ========================================================= */
.entry-content ul.meal-list li {
  border-bottom: 1px solid var(--wp--preset--color--light-gray);
  padding-bottom: 9px;
  margin-bottom: 9px;
}
.entry-content ul.meal-list li:last-child {
  border-bottom: none;
}
.entry-content ul.meal-list strong {
  color: var(--wp--preset--color--orange);
  font-weight: 700;
}

/* =========================================================
   NUTRITION CARD
   ========================================================= */
.nutrition-card {
  background: #FFFFFF;
  border: 1px solid var(--wp--preset--color--light-gray);
  border-radius: 8px;
  box-shadow: var(--wp--preset--shadow--card);
  padding: 22px 28px;
  margin: 0 0 var(--wp--preset--spacing--50);
}

.nutrition-card .wp-block-table { margin: 0; }
.nutrition-card table {
  border: none;
  border-collapse: separate;
  border-spacing: 0;
  margin: 0;
  width: 100%;
}
.nutrition-card tbody { display: block; }
.nutrition-card tr {
  display: flex;
  width: 100%;
  border: none;
}

/* Cells distribute evenly across full width */
.nutrition-card td {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border: none;
  padding: 0;
  white-space: nowrap;
}

/* Row 1 — 46px circle drawn as a centered radial background */
.nutrition-card tr:nth-child(1) { margin-bottom: 8px; }
.nutrition-card tr:nth-child(1) td {
  height: 46px;
  font-weight: 800;
  font-size: 15px;
  line-height: 46px;
  color: var(--wp--preset--color--near-black);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 46px 46px;
}
.nutrition-card tr:nth-child(1) td:nth-child(1) { background-image: radial-gradient(circle, var(--wp--preset--color--yellow) 23px, transparent 23px); font-size: 13px; }
.nutrition-card tr:nth-child(1) td:nth-child(2) { background-image: radial-gradient(circle, var(--wp--preset--color--orange) 23px, transparent 23px); color: #FFFFFF; }
.nutrition-card tr:nth-child(1) td:nth-child(3) { background-image: radial-gradient(circle, var(--wp--preset--color--lemon-cream) 22px, var(--wp--preset--color--light-gray) 22px, var(--wp--preset--color--light-gray) 23px, transparent 23px); }
.nutrition-card tr:nth-child(1) td:nth-child(4) { background-image: radial-gradient(circle, var(--wp--preset--color--near-black) 23px, transparent 23px); color: #FFFFFF; }
.nutrition-card tr:nth-child(1) td:nth-child(n+5) { background-image: radial-gradient(circle, #FFD5D0 23px, transparent 23px); }

/* Row 2 — values */
.nutrition-card tr:nth-child(2) { margin-bottom: 4px; }
.nutrition-card tr:nth-child(2) td {
  font-size: 17px;
  font-weight: 800;
  line-height: 1.1;
  color: var(--wp--preset--color--near-black);
}

/* Row 3 — labels */
.nutrition-card tr:nth-child(3) td {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--wp--preset--color--mid-gray);
}

/* =========================================================
   MEAL PLAN — nutrition data table
   ========================================================= */
.meal-nutrition-table {
  background: #FFFFFF;
  border: 1px solid var(--wp--preset--color--light-gray);
  border-radius: 8px;
  box-shadow: var(--wp--preset--shadow--card);
  overflow: hidden;
  margin: 0 0 var(--wp--preset--spacing--50);
}
.meal-nutrition-table table {
  border-collapse: collapse;
  width: 100%;
  margin: 0;
  border: none;
  font-size: var(--wp--preset--font-size--small);
}
.meal-nutrition-table td { border: none; vertical-align: middle; }
 
/* ---- ROW 1 = abbreviation on a colored badge ---- */
.meal-nutrition-table tbody tr:nth-child(1) td {
  padding: 28px 8px 6px;
  text-align: center;
  vertical-align: bottom;
}
/* badge cells (not the Meal label) */
.meal-nutrition-table tbody tr:nth-child(1) td:not(:first-child) {
  font-size: 13px;
  font-weight: 800;
  color: var(--wp--preset--color--near-black);
  /* the badge itself: a 42px circle, text centered inside */
  background-repeat: no-repeat;
  background-position: center 28px;
  background-size: 42px 42px;
  padding: 28px 8px 6px;
  line-height: 42px;
}
.meal-nutrition-table tbody tr:nth-child(1) td:nth-child(2) { background-image: radial-gradient(circle, var(--wp--preset--color--yellow) 21px, transparent 21px); }
.meal-nutrition-table tbody tr:nth-child(1) td:nth-child(3) { background-image: radial-gradient(circle, var(--wp--preset--color--orange) 21px, transparent 21px); color: #FFFFFF; }
.meal-nutrition-table tbody tr:nth-child(1) td:nth-child(4) { background-image: radial-gradient(circle, var(--wp--preset--color--lemon-cream) 20px, var(--wp--preset--color--light-gray) 20px, var(--wp--preset--color--light-gray) 21px, transparent 21px); }
.meal-nutrition-table tbody tr:nth-child(1) td:nth-child(5) { background-image: radial-gradient(circle, var(--wp--preset--color--near-black) 21px, transparent 21px); color: #FFFFFF; }
.meal-nutrition-table tbody tr:nth-child(1) td:nth-child(n+6) { background-image: radial-gradient(circle, #FFD5D0 21px, transparent 21px); }
 
/* Row 1, first cell (Meal) — plain label, aligned with badges */
.meal-nutrition-table tbody tr:nth-child(1) td:first-child {
  font-size: var(--wp--preset--font-size--small);
  font-weight: 700;
  text-align: left;
  padding: 16px 8px 6px 16px;
  background: none;
  color: var(--wp--preset--color--near-black);
  vertical-align: middle;
  height: 42px;
  line-height: 42px;
}
 
/* ---- ROW 2 = labels beneath badges ---- */
.meal-nutrition-table tbody tr:nth-child(2) {
  border-bottom: 2px solid var(--wp--preset--color--light-gray);
}
.meal-nutrition-table tbody tr:nth-child(2) td {
  padding: 4px 8px 14px;
  text-align: center;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--wp--preset--color--mid-gray);
  line-height: 1.3;
  vertical-align: top;
}
 
/* ---- ROW 3+ = meal data ---- */
.meal-nutrition-table tbody tr:nth-child(n+3) td {
  padding: 14px 8px;
  text-align: center;
  border-bottom: 1px solid var(--wp--preset--color--light-gray);
  font-weight: 600;
  color: var(--wp--preset--color--charcoal);
}
/* Meal name (left column) — orange, to anchor each row */
.meal-nutrition-table tbody tr:nth-child(n+3) td:first-child {
  text-align: left;
  padding-left: 16px;
  font-weight: 700;
  color: var(--wp--preset--color--near-black);
}
.meal-nutrition-table tbody tr:last-child td { border-bottom: none; }

/* =========================================================
   SIDEBAR
   ========================================================= */
.widget_block p {
	font-size: var(--wp--preset--font-size--small)
}

/* =========================================================
   H2 ICONS
   ========================================================= */

/* Shared look for all section headings */
[class*="h2-"]:is(h2) {
  display: flex;
  align-items: center;
  gap: 14px;
  border-bottom: 3px solid var(--wp--preset--color--yellow);
  padding-bottom: 8px;
  width: fit-content;
}
[class*="h2-"]:is(h2)::before {
  content: "";
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  background-color: var(--wp--preset--color--orange);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center;  mask-position: center;
  -webkit-mask-size: contain;     mask-size: contain;
}

/* Ingredients — carrot (viewBox 640x512) */
.h2-ingredients::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 512'><path d='M453.1-36.7L440.9-24.6c-31.2 31.2-31.2 81.9 0 113.1 15.6 15.6 31.2 31.2 46.9 46.9 31.2 31.2 81.9 31.2 113.1 0l12.1-12.1c6.2-6.2 6.2-16.4 0-22.6L600.9 88.6c-31.2-31.2-81.9-31.2-113.1 0 31.2-31.2 31.2-81.9 0-113.1L475.7-36.7c-6.2-6.2-16.4-6.2-22.6 0zM331.6 96c-45.2 0-87.1 20.4-115 54.3L273.3 207c9.4 9.4 9.4 24.6 0 33.9s-24.6 9.4-33.9 0L191.6 193.2 67.2 466.8c-5.5 12.1-2.9 26.4 6.5 35.9s23.7 12 35.9 6.5l141.6-64.4-43.8-43.8c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l56.5 56.5 95.3-43.3c53.1-24.1 87.2-77.1 87.2-135.5 0-82.2-66.6-148.8-148.8-148.8z'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 512'><path d='M453.1-36.7L440.9-24.6c-31.2 31.2-31.2 81.9 0 113.1 15.6 15.6 31.2 31.2 46.9 46.9 31.2 31.2 81.9 31.2 113.1 0l12.1-12.1c6.2-6.2 6.2-16.4 0-22.6L600.9 88.6c-31.2-31.2-81.9-31.2-113.1 0 31.2-31.2 31.2-81.9 0-113.1L475.7-36.7c-6.2-6.2-16.4-6.2-22.6 0zM331.6 96c-45.2 0-87.1 20.4-115 54.3L273.3 207c9.4 9.4 9.4 24.6 0 33.9s-24.6 9.4-33.9 0L191.6 193.2 67.2 466.8c-5.5 12.1-2.9 26.4 6.5 35.9s23.7 12 35.9 6.5l141.6-64.4-43.8-43.8c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l56.5 56.5 95.3-43.3c53.1-24.1 87.2-77.1 87.2-135.5 0-82.2-66.6-148.8-148.8-148.8z'/></svg>");
}

/* Equipment — utensils (viewBox 512x512) */
.h2-equipment::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path d='M63.9 14.4C63.1 6.2 56.2 0 48 0s-15.1 6.2-16 14.3L17.9 149.7c-1.3 6-1.9 12.1-1.9 18.2 0 45.9 35.1 83.6 80 87.7L96 480c0 17.7 14.3 32 32 32s32-14.3 32-32l0-224.4c44.9-4.1 80-41.8 80-87.7 0-6.1-.6-12.2-1.9-18.2L223.9 14.3C223.1 6.2 216.2 0 208 0s-15.1 6.2-15.9 14.4L178.5 149.9c-.6 5.7-5.4 10.1-11.1 10.1-5.8 0-10.6-4.4-11.2-10.2L143.9 14.6C143.2 6.3 136.3 0 128 0s-15.2 6.3-15.9 14.6L99.8 149.8c-.5 5.8-5.4 10.2-11.2 10.2-5.8 0-10.6-4.4-11.1-10.1L63.9 14.4zM448 0C432 0 320 32 320 176l0 112c0 35.3 28.7 64 64 64l32 0 0 128c0 17.7 14.3 32 32 32s32-14.3 32-32l0-448c0-17.7-14.3-32-32-32z'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path d='M63.9 14.4C63.1 6.2 56.2 0 48 0s-15.1 6.2-16 14.3L17.9 149.7c-1.3 6-1.9 12.1-1.9 18.2 0 45.9 35.1 83.6 80 87.7L96 480c0 17.7 14.3 32 32 32s32-14.3 32-32l0-224.4c44.9-4.1 80-41.8 80-87.7 0-6.1-.6-12.2-1.9-18.2L223.9 14.3C223.1 6.2 216.2 0 208 0s-15.1 6.2-15.9 14.4L178.5 149.9c-.6 5.7-5.4 10.1-11.1 10.1-5.8 0-10.6-4.4-11.2-10.2L143.9 14.6C143.2 6.3 136.3 0 128 0s-15.2 6.3-15.9 14.6L99.8 149.8c-.5 5.8-5.4 10.2-11.2 10.2-5.8 0-10.6-4.4-11.1-10.1L63.9 14.4zM448 0C432 0 320 32 320 176l0 112c0 35.3 28.7 64 64 64l32 0 0 128c0 17.7 14.3 32 32 32s32-14.3 32-32l0-448c0-17.7-14.3-32-32-32z'/></svg>");
}

/* Step by Step — list-ol (viewBox 512x512) */
.h2-steps::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path d='M0 72C0 58.8 10.7 48 24 48l48 0c13.3 0 24 10.7 24 24l0 104 24 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-96 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l24 0 0-80-24 0C10.7 96 0 85.3 0 72zM30.4 301.2C41.8 292.6 55.7 288 70 288l4.9 0c33.7 0 61.1 27.4 61.1 61.1 0 19.6-9.4 37.9-25.2 49.4l-24 17.5 33.2 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-90.7 0C13.1 464 0 450.9 0 434.7 0 425.3 4.5 416.5 12.1 411l70.5-51.3c3.4-2.5 5.4-6.4 5.4-10.6 0-7.2-5.9-13.1-13.1-13.1L70 336c-3.9 0-7.7 1.3-10.8 3.6L38.4 355.2c-10.6 8-25.6 5.8-33.6-4.8S-1 324.8 9.6 316.8l20.8-15.6zM224 64l256 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-256 0c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 160l256 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-256 0c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 160l256 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-256 0c-17.7 0-32-14.3-32-32s14.3-32 32-32z'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path d='M0 72C0 58.8 10.7 48 24 48l48 0c13.3 0 24 10.7 24 24l0 104 24 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-96 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l24 0 0-80-24 0C10.7 96 0 85.3 0 72zM30.4 301.2C41.8 292.6 55.7 288 70 288l4.9 0c33.7 0 61.1 27.4 61.1 61.1 0 19.6-9.4 37.9-25.2 49.4l-24 17.5 33.2 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-90.7 0C13.1 464 0 450.9 0 434.7 0 425.3 4.5 416.5 12.1 411l70.5-51.3c3.4-2.5 5.4-6.4 5.4-10.6 0-7.2-5.9-13.1-13.1-13.1L70 336c-3.9 0-7.7 1.3-10.8 3.6L38.4 355.2c-10.6 8-25.6 5.8-33.6-4.8S-1 324.8 9.6 316.8l20.8-15.6zM224 64l256 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-256 0c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 160l256 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-256 0c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 160l256 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-256 0c-17.7 0-32-14.3-32-32s14.3-32 32-32z'/></svg>");
}

/* Tips — pencil (viewBox 512x512) */
.h2-tips::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path d='M36.4 353.2c4.1-14.6 11.8-27.9 22.6-38.7l181.2-181.2 33.9-33.9c16.6 16.6 51.3 51.3 104 104l33.9 33.9-33.9 33.9-181.2 181.2c-10.7 10.7-24.1 18.5-38.7 22.6L30.4 510.6c-8.3 2.3-17.3 0-23.4-6.2S-1.4 489.3 .9 481L36.4 353.2zm55.6-3.7c-4.4 4.7-7.6 10.4-9.3 16.6l-24.1 86.9 86.9-24.1c6.4-1.8 12.2-5.1 17-9.7L91.9 349.5zm354-146.1c-16.6-16.6-51.3-51.3-104-104L308 65.5C334.5 39 349.4 24.1 352.9 20.6 366.4 7 384.8-.6 404-.6S441.6 7 455.1 20.6l35.7 35.7C504.4 69.9 512 88.3 512 107.4s-7.6 37.6-21.2 51.1c-3.5 3.5-18.4 18.4-44.9 44.9z'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path d='M36.4 353.2c4.1-14.6 11.8-27.9 22.6-38.7l181.2-181.2 33.9-33.9c16.6 16.6 51.3 51.3 104 104l33.9 33.9-33.9 33.9-181.2 181.2c-10.7 10.7-24.1 18.5-38.7 22.6L30.4 510.6c-8.3 2.3-17.3 0-23.4-6.2S-1.4 489.3 .9 481L36.4 353.2zm55.6-3.7c-4.4 4.7-7.6 10.4-9.3 16.6l-24.1 86.9 86.9-24.1c6.4-1.8 12.2-5.1 17-9.7L91.9 349.5zm354-146.1c-16.6-16.6-51.3-51.3-104-104L308 65.5C334.5 39 349.4 24.1 352.9 20.6 366.4 7 384.8-.6 404-.6S441.6 7 455.1 20.6l35.7 35.7C504.4 69.9 512 88.3 512 107.4s-7.6 37.6-21.2 51.1c-3.5 3.5-18.4 18.4-44.9 44.9z'/></svg>");
}

/* Highlights — award (viewBox 384x512) */
.h2-highlights::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'><path d='M97.12 362.63c-8.69-8.69-4.16-6.24-25.12-11.85-9.51-2.55-17.87-7.45-25.43-13.32L1.2 448.7c-4.39 10.77 3.81 22.47 15.43 22.03l52.69-2.01L105.56 507c8 8.44 22.04 5.81 26.43-4.96l52.05-127.62c-10.84 6.04-22.87 9.58-35.31 9.58-19.5 0-37.82-7.59-51.61-21.37zM382.8 448.7l-45.37-111.24c-7.56 5.88-15.92 10.77-25.43 13.32-21.07 5.64-16.45 3.18-25.12 11.85-13.79 13.78-32.12 21.37-51.62 21.37-12.44 0-24.47-3.55-35.31-9.58L252 502.04c4.39 10.77 18.44 13.4 26.43 4.96l36.25-38.28 52.69 2.01c11.62.44 19.82-11.27 15.43-22.03zM263 340c15.28-15.55 17.03-14.21 38.79-20.14 13.89-3.79 24.75-14.84 28.47-28.98 7.48-28.4 5.54-24.97 25.95-45.75 10.17-10.35 14.14-25.44 10.42-39.58-7.47-28.38-7.48-24.42 0-52.83 3.72-14.14-.25-29.23-10.42-39.58-20.41-20.78-18.47-17.36-25.95-45.75-3.72-14.14-14.58-25.19-28.47-28.98-27.88-7.61-24.52-5.62-44.95-26.41-10.17-10.35-25-14.4-38.89-10.61-27.87 7.6-23.98 7.61-51.9 0-13.89-3.79-28.72.25-38.89 10.61-20.41 20.78-17.05 18.8-44.94 26.41-13.89 3.79-24.75 14.84-28.47 28.98-7.47 28.39-5.54 24.97-25.95 45.75-10.17 10.35-14.15 25.44-10.42 39.58 7.47 28.36 7.48 24.4 0 52.82-3.72 14.14.25 29.23 10.42 39.59 20.41 20.78 18.47 17.35 25.95 45.75 3.72 14.14 14.58 25.19 28.47 28.98C104.6 325.96 106.27 325 121 340c13.23 13.47 33.84 15.88 49.74 5.82a39.676 39.676 0 0 1 42.53 0c15.89 10.06 36.5 7.65 49.73-5.82zM97.66 175.96c0-53.03 42.24-96.02 94.34-96.02s94.34 42.99 94.34 96.02-42.24 96.02-94.34 96.02-94.34-42.99-94.34-96.02z'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'><path d='M97.12 362.63c-8.69-8.69-4.16-6.24-25.12-11.85-9.51-2.55-17.87-7.45-25.43-13.32L1.2 448.7c-4.39 10.77 3.81 22.47 15.43 22.03l52.69-2.01L105.56 507c8 8.44 22.04 5.81 26.43-4.96l52.05-127.62c-10.84 6.04-22.87 9.58-35.31 9.58-19.5 0-37.82-7.59-51.61-21.37zM382.8 448.7l-45.37-111.24c-7.56 5.88-15.92 10.77-25.43 13.32-21.07 5.64-16.45 3.18-25.12 11.85-13.79 13.78-32.12 21.37-51.62 21.37-12.44 0-24.47-3.55-35.31-9.58L252 502.04c4.39 10.77 18.44 13.4 26.43 4.96l36.25-38.28 52.69 2.01c11.62.44 19.82-11.27 15.43-22.03zM263 340c15.28-15.55 17.03-14.21 38.79-20.14 13.89-3.79 24.75-14.84 28.47-28.98 7.48-28.4 5.54-24.97 25.95-45.75 10.17-10.35 14.14-25.44 10.42-39.58-7.47-28.38-7.48-24.42 0-52.83 3.72-14.14-.25-29.23-10.42-39.58-20.41-20.78-18.47-17.36-25.95-45.75-3.72-14.14-14.58-25.19-28.47-28.98-27.88-7.61-24.52-5.62-44.95-26.41-10.17-10.35-25-14.4-38.89-10.61-27.87 7.6-23.98 7.61-51.9 0-13.89-3.79-28.72.25-38.89 10.61-20.41 20.78-17.05 18.8-44.94 26.41-13.89 3.79-24.75 14.84-28.47 28.98-7.47 28.39-5.54 24.97-25.95 45.75-10.17 10.35-14.15 25.44-10.42 39.58 7.47 28.36 7.48 24.4 0 52.82-3.72 14.14.25 29.23 10.42 39.59 20.41 20.78 18.47 17.35 25.95 45.75 3.72 14.14 14.58 25.19 28.47 28.98C104.6 325.96 106.27 325 121 340c13.23 13.47 33.84 15.88 49.74 5.82a39.676 39.676 0 0 1 42.53 0c15.89 10.06 36.5 7.65 49.73-5.82zM97.66 175.96c0-53.03 42.24-96.02 94.34-96.02s94.34 42.99 94.34 96.02-42.24 96.02-94.34 96.02-94.34-42.99-94.34-96.02z'/></svg>");
}


/* =========================================================
   H3 ICONS
   ========================================================= */
.h3-calendar {
  display: flex;
  align-items: center;
  gap: 14px;
  border-bottom: 3px solid var(--wp--preset--color--yellow);
  padding-bottom: 8px;
  width: fit-content;
}
.h3-calendar::before {
  content: "";
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  background-color: var(--wp--preset--color--orange);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center;  mask-position: center;
  -webkit-mask-size: contain;     mask-size: contain;
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'><path d='M128 0C110.3 0 96 14.3 96 32l0 32-32 0C28.7 64 0 92.7 0 128l0 48 448 0 0-48c0-35.3-28.7-64-64-64l-32 0 0-32c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 32-128 0 0-32c0-17.7-14.3-32-32-32zM0 224L0 416c0 35.3 28.7 64 64 64l320 0c35.3 0 64-28.7 64-64l0-192-448 0z'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'><path d='M128 0C110.3 0 96 14.3 96 32l0 32-32 0C28.7 64 0 92.7 0 128l0 48 448 0 0-48c0-35.3-28.7-64-64-64l-32 0 0-32c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 32-128 0 0-32c0-17.7-14.3-32-32-32zM0 224L0 416c0 35.3 28.7 64 64 64l320 0c35.3 0 64-28.7 64-64l0-192-448 0z'/></svg>");
}