/*
 Theme Name:   Dante Bland, LLC
 Theme URI:    https://dantebland.com
 Description:  Child Theme for Divi
 Author:       Dante Bland, LLC
 Author URI:   https://dantebland.com
 Template:     Divi
 Version:      1.0.0
*/

/*****Add any custom CSS below this line*****/

.db-llc{
    overflow: visible;
}

.db-llc::before {
    top: 10px;
    background-repeat: no-repeat;
    background-image: url(https://dantebland.com/wp-content/uploads/db-logo-white.png);
    background-size: 25px;
    display: inline-block;
    width: 30px;
    height: 30px;
    content: "";
    position: relative;
}

@media only screen and (min-width: 981px) {
	.et_header_style_left #et-top-navigation nav>ul>li>a, .et_header_style_split #et-top-navigation nav>ul>li>a {;
		padding: 10px !important;
	}
	.et_header_style_left #et-top-navigation nav>ul>li.menu-item-has-children>a, .et_header_style_split #et-top-navigation nav>ul>li.menu-item-has-children>a {
		padding-right: 24px !important;
		border-radius: 0;
	}
	#et-top-navigation .et-cart-info, #et_top_search, #et_search_icon {
		margin-top: 10px;
	}
}

#et-secondary-nav .menu-item-has-children>a:first-child:after, #top-menu .menu-item-has-children>a:first-child:after {
    right: 6px !important;
    top: 50% !important;
    bottom: auto !important;
    margin-top: 0 !important;
    transform: translateY(-50%);
    font-size: 14px;
    line-height: 1;
    /* The parent link paints its own text with the gold gradient clipped to the
       glyphs. This ::after arrow INHERITS the transparent -webkit-text-fill-color
       but not the gradient behind it, so without the four lines below it renders
       invisible. Give the arrow its own copy of the gradient. */
    background: linear-gradient(90deg, #f8e0a1 0%, #c69327 26%, #f4ca5d 41%, #864604 87%, #f0b519 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

#main-content {
    background-color: transparent !important;
} 

@media only screen and (min-width: 981px) {
	.et_header_style_left #et-top-navigation, .et_header_style_split #et-top-navigation {
		padding-top: 25px !important;
		padding-bottom: 25px !important;
	}
}

@media (max-width: 980px) {
    .pa-open-mobile-menu .et_pb_menu__menu {
        display: flex!important;
    }
    .pa-open-mobile-menu .et_mobile_nav_menu {
        display: none!important;
    }
}

.pa-inline-buttons .et_pb_button_module_wrapper {
    display: inline-block;
}

@media (max-width: 980px) {
	.pa-open-mobile-menu .et_pb_menu__menu {
		display: flex!important;
	}
	.pa-open-mobile-menu .et_mobile_nav_menu {
		display: none!important;
	}
}

.pa-inline-buttons .et_pb_button_module_wrapper {
    display: inline-block;
}

.pa-inline-buttons {
    text-align: center !important;
}

.li-100 li {
	display: block !important;
    width: 100% !important;
	justify-content: left !important;
	text-align: left;
}
 @media (max-width: 980px) {
	.et_pb_menu--style-left_aligned .et_pb_menu__wrap {
		justify-content: left !important;
		text-align: left !important;
	}
}

.li-100 .et_pb_menu .et_pb_menu__menu>nav {
	width: 100% !important;
	
}

@media only screen and (max-width: 980px) {
	#main-header, #main-header .nav li ul, .et-search-form, #main-header .et_mobile_menu {
		/*background-color: #000000 !important;*/
	}
}

.bg-gold {
	background-color: #f0b519;
	background: rgb(235,199,138);
    background: linear-gradient(90deg, #f8e0a1 0%, #c69327 26%, #f4ca5d 41%, #864604 87%, #f0b519 100%);
}

.et_mobile_menu li.color-gold,
.et_mobile_menu li li.color-gold,
.h-color-gold,
.h1-color-gold,
.h2-color-gold,
.h3-color-gold,
.h4-color-gold,
.h5-color-gold,
.h6-color-gold {
	display: block !important;
}

.et_mobile_menu li.color-gold a,
.et_mobile_menu li li.color-gold a,
.mobile_menu_bar:before,
.h-color-gold h1,
.h-color-gold h2,
.h-color-gold h3,
.h-color-gold h4,
.h-color-gold h5,
.h-color-gold h6,
.h1-color-gold h1,
.h2-color-gold h2,
.h3-color-gold h3,
.h4-color-gold h4,
.h5-color-gold h5,
.h6-color-gold h6,
.tribe-events .tribe-events-calendar-list__event-title-link,
.tribe-events .tribe-events-calendar-latest-past__event-title-link,
.tribe-events .tribe-events-calendar-month__calendar-event-title-link,
.tribe-events .tribe-events-calendar-day__event-title-link,
#tribe-events-content .tribe-events-sub-nav a,
#tribe-events-footer .tribe-events-sub-nav a,
.ecmd-event-title a,
.lo-stat .percent-value,
.color-gold,
.color-gold a,
.color-gold h1,
.color-gold h2,
.color-gold h3,
.color-gold h4,
.color-gold h5,
.color-gold h6,
.color-gold p,
a.color-gold,
a.a-color-gold,
.a-color-gold a,
.color-gold-active:active,
.color-gold-active a:active, 
.color-gold-active.current_page_item a,
.btn-gold-txt,
a.color-gold-active:active,
#et_search_icon:before,
#et-top-navigation .et-cart-info span:before,
#main-header .nav li.btn-gold ul a,
#main-header .nav li.btn-border-gold ul a,
#main-header .nav li.btn-gold a:after {
	position: relative; /* Make sure the element is positioned relative for the ::after element */
	color: transparent; /* the gradient below is what paints; the builder
       guard at the end of this file swaps this back to solid gold */
	background: -webkit-linear-gradient(0deg, #f8e0a1 0%, #c69327 26%, #f4ca5d 41%, #864604 87%, #f0b519 100%); /* Gradient for text */
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}
.mobile_menu_bar:before, #et-top-navigation .et-cart-info span:before {
	color: transparent !important;
}
.et_mobile_menu .menu-item-has-children.color-gold {
	display: block;
}
.et_mobile_menu li.color-gold a {
	padding-left: 0;
}
.et_mobile_menu .menu-item-has-children>a {
    font-weight: inherit;
    background-color: transparent !important;
}

/* Projectopia */
 .pto-field-label, #cqpim_frontend_leadform .form-control {
	color: #ffffff;
}
#cqpim_frontend_leadform .form-control, #cqpim_frontend_leadform input[type=submit] {
    background-color: #111111 !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 16px !important;
    font-size: 14px !important;
}

#cqpim_frontend_leadform input[type=submit] {
	/* divi style */
	font-weight: 500 !important;
    padding: .3em 1em !important;
    line-height: 1.7em !important;
	border: 2px solid !important;
	font-size: 16px !important;
	/* custom */
	color: #111111 !important;
	box-shadow: 0px 12px 18px -6px rgba(0, 0, 0, 0.3);
	background-color: #f0b519;
	background: rgb(235,199,138);
    background: linear-gradient(0deg, #f8e0a1 0%, #c69327 26%, #f4ca5d 41%, #864604 87%, #f0b519 100%);
}

body.logged-in .logged-in-hide,
body:not(.logged-in) .not-logged-in-hide {
    display: none !important;
}

#top-menu .btn-gold a,
#top-menu .btn-gold a:hover,
footer .btn-gold a,
footer .btn-gold a:hover,
.et-fixed-header #top-menu li.btn-gold.current-menu-item>a, 
.et-fixed-header #top-menu li.btn-gold.current_page_item>a,
.et_header_style_left #et-top-navigation nav>ul>li.btn-gold.menu-item-has-children.btn-gold>a {
    background-color: #f0b519;
	background: rgb(235,199,138);
    background: linear-gradient(90deg, #f8e0a1 0%, #c69327 26%, #f4ca5d 41%, #864604 87%, #f0b519 100%);
    border-radius: 0px;
	color: #111111 !important;	
    font-weight: 700!important;
	padding: 10px !important;
	text-align: center;
}

@media only screen and (min-width: 981px) {
	.et-fixed-header #top-menu .btn-gold a {
		color: #111111 !important;
	}
}

#top-menu .btn-border-gold a,
#top-menu .btn-border-gold a:hover,
footer .btn-border-gold a,
footer .btn-border-gold a:hover {
	padding: 10px;
}



/* Menu + footer variants only. Divi button modules take their colour,
   fill and border from the .et_pb_button.btn-border-gold rule further
   down; the bare a.btn-border-gold selectors used to be here and were
   overriding it with flat white. */
#top-menu .btn-border-gold a,
#top-menu .btn-border-gold a:hover,
footer .btn-border-gold a,
footer .btn-border-gold a:hover {
    position: relative !important; /* Make sure the element is positioned relative for the ::after element */
    display: inline-block !important; /* Ensure proper display of inline elements like <a> */
    text-align: center;
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
    background: rgba(10, 10, 10, 0.55) !important;
}

#top-menu .btn-border-gold.menu-item-has-children>a:first-child,
#top-menu .btn-border-gold.menu-item-has-children>a:first-child {
	padding: 10px 10px 10px 20px !important;
}

.et_header_style_left #et-top-navigation nav>ul>li.menu-item-has-children.btn-border-gold>a,
.et_header_style_split #et-top-navigation nav>ul>li.menu-item-has-children.btn-border-gold>a,
.et_header_style_left #et-top-navigation nav>ul>li.menu-item-has-children.btn-gold>a,
.et_header_style_split #et-top-navigation nav>ul>li.menu-item-has-children.btn-gold>a {
	border-radius: 0px !important;
}

@media only screen and (min-width: 981px){
	#top-menu .btn-border-gold.menu-item-has-children>a:first-child,
	#et-secondary-nav .btn-border-gold.menu-item-has-children>a:first-child,
	#top-menu .btn-gold.menu-item-has-children>a:first-child,
	#et-secondary-nav .btn-gold.menu-item-has-children>a:first-child{
		padding-right: 20px !important;
	}
}

#top-menu .btn-border-gold.menu-item-has-children>a:first-child:after,
#et-secondary-nav .btn-border-gold.menu-item-has-children>a:first-child:after,
#top-menu .btn-gold.menu-item-has-children>a:first-child:after,
#et-secondary-nav .btn-gold.menu-item-has-children>a:first-child:after {
    right: 5px !important;
    top: 10px !important;
}

#main-header .nav li.btn-gold ul a,
#main-header .nav li.btn-border-gold ul a {
	text-align: left !important;
}

/* Gradient ring — menu items only. Divi button modules carry their own
   border from the module's design settings; both at once double-draws. */
#top-menu .btn-border-gold a::after,
footer .btn-border-gold a::after {
    content: '';
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    border-radius: 0px !important; /* Same border radius */
    padding: 1px; /* Adjust padding for border thickness */
    background: linear-gradient(90deg, #f8e0a1 0%, #c69327 26%, #f4ca5d 41%, #864604 87%, #f0b519 100%) !important;
    -webkit-mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0) !important;
    -webkit-mask-composite: destination-out !important;
    mask-composite: exclude !important;
    pointer-events: none !important; /* Ensure the pseudo-element doesn't interfere with clicks */
}

@media (max-width: 980px) {
    /* Apply gold color to text for tablet size */
    .et_mobile_menu li.btn-gold a,
    .et_mobile_menu li.btn-gold a:hover,
    .et_mobile_menu li.btn-border-gold a,
    .et_mobile_menu li.btn-border-gold a:hover,
    #top-menu .btn-gold a,
    #top-menu .btn-gold a:hover,
    footer .btn-gold a,
    footer .btn-gold a:hover,
	#top-menu .btn-border-gold a,
    #top-menu .btn-border-gold a:hover,
    footer .btn-border-gold a,
    footer .btn-border-gold a:hover {
        position: relative; /* Make sure the element is positioned relative for the ::after element */
		display: inline-block; /* Ensure proper display of inline elements like <a> */
		padding: 10px !important;
		color: transparent; /* Hide original text color */
		background: -webkit-linear-gradient(0deg, #f8e0a1 0%, #c69327 26%, #f4ca5d 41%, #864604 87%, #f0b519 100%); /* Gradient for text */
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		background-clip: text;
		padding: 10px 0 !important;
    }
	.btn-border-gold a{
		color: #ffffff;
	}
}

a .woocommerce-loop-product__short_description {
	color: #ffffff !important;
}

.woocommerce div.product span.price, .woocommerce-page div.product span.price {
	color: #ffffff !important;
}

/* ==========================================================================
   LINDA ORJI CREATIVE UNIVERSE - 2026 REDESIGN ADDITIONS
   Added for the new Divi 4 service-page layouts.
   NOTE: .color-gold is intentionally NOT redefined here - the gold gradient
   rule above remains the single source of truth for gold text sitewide.
   ========================================================================== */

/* Crimson accent - pairs with the existing gold. Named to match .color-gold. */
.color-crimson,
.color-crimson a,
a.color-crimson {
	color: #D91E4A;
}

/* Diamond bullet lists. Divi list controls cannot add a colored marker glyph
   or a per-item bottom border, so this is a class not module settings. */
.lo-list ul { margin: 0; padding: 0; list-style: none; }
.lo-list ul li {
	position: relative;
	padding: 14px 0 14px 30px;
	list-style: none;
}
.lo-list ul li::before {
	content: "\25C6";
	position: absolute;
	left: 0;
	top: 14px;
	font-size: 15px;
	line-height: 1.6;
	color: #D91E4A;
}
.lo-list--light ul li { border-bottom: 1px solid rgba(196,152,46,0.35); }
.lo-list--dark ul li {
	padding: 11px 0 11px 30px;
	border-bottom: 1px solid rgba(196,152,46,0.22);
}
.lo-list--dark ul li::before { top: 11px; font-size: 14px; }
@media (min-width: 981px) {
	.lo-list--2col ul { column-count: 2; column-gap: 40px; }
	.lo-list--2col ul li { break-inside: avoid; }
}

/* Keyboard focus ring - the dark palette hides the browser default. */
.et_pb_button:focus-visible,
.et_pb_text a:focus-visible {
	outline: 2px solid #C4982E;
	outline-offset: 3px;
}

/* ===== BUTTON SYSTEM - 2026 redesign =====================================
   .btn-gold higher up this file is scoped to #top-menu / footer anchors, so it
   styles MENU items only. These rules extend the same gold gradient to Divi
   content buttons, and add a crimson variant for both menus and content.
   Colour lives here, not per-module: change a button colour once, site-wide.
   Classes: btn-gold | btn-border-gold | btn-red (btn-pink = alias)
   ======================================================================== */
.et_pb_button.btn-gold,
.et_pb_button.btn-gold:hover,
a.btn-gold.et_pb_button {
  background-color: #f0b519 !important;
  background-image: linear-gradient(90deg,#f8e0a1 0%,#c69327 26%,#f4ca5d 41%,#864604 87%,#f0b519 100%) !important;
  color: #111111 !important;
  border: 1px solid #c69327 !important;
  border-image: linear-gradient(90deg,#f8e0a1 0%,#c69327 26%,#f4ca5d 41%,#864604 87%,#f0b519 100%) 1 !important;
  border-radius: 0 !important;
  font-weight: 700 !important;
}
.et_pb_button.btn-gold:after { color: #111111 !important; }
/* Brand marks keep their own colour, same convention as the rule above.
   Needed because .btn-border-gold sets color:#fff !important, which the
   icon pseudo-element would otherwise inherit. */
body #page-container .et_pb_button.btn-spotify:after {
  color: #1DB954 !important;
  -webkit-text-fill-color: #1DB954 !important;
}

#top-menu .btn-red a,
#top-menu .btn-red a:hover,
#top-menu .btn-pink a,
footer .btn-red a,
footer .btn-pink a,
.et_mobile_menu li.btn-red a,
.et_mobile_menu li.btn-pink a,
.et-fixed-header #top-menu li.btn-red.current-menu-item>a,
.et_pb_button.btn-red,
.et_pb_button.btn-pink,
a.btn-red,
a.btn-pink {
  background-color: #D91E4A !important;
  background-image: none !important;
  color: #FFFFFF !important;
  border: none !important;
  border-radius: 0 !important;
  font-weight: 700 !important;
  text-align: center;
}
@media (max-width: 980px) {
	#top-menu .btn-red a,
	#top-menu .btn-red a:hover,
	#top-menu .btn-pink a,
	footer .btn-red a,
	footer .btn-pink a,
	.et_mobile_menu li.btn-red a,
	.et_mobile_menu li.btn-pink a,
	.et-fixed-header #top-menu li.btn-red.current-menu-item>a,
	.et_pb_button.btn-red,
	.et_pb_button.btn-pink,
	a.btn-red,
	a.btn-pink {
	  margin: 0 18px;
	}
}
.et_pb_button.btn-red,
.et_pb_button.btn-pink { padding: 15px 30px !important; }
#top-menu .btn-red a,
#top-menu .btn-pink a { padding: 10px !important; }
.et_pb_button.btn-red:hover,
.et_pb_button.btn-pink:hover,
#top-menu .btn-red a:hover,
a.btn-red:hover,
a.btn-pink:hover {
  background-color: #b01840 !important;
  color: #FFFFFF !important;
}
.et_pb_button.btn-red:after,
.et_pb_button.btn-pink:after { color: #FFFFFF !important; }

/* Menu button - red/pink variant.
   Mirrors the .btn-gold menu rule above, same selectors and spacing, with the
   mockup's crimson as a flat fill instead of the gold gradient. Text goes to
   cream because #111 on crimson fails contrast. */
#top-menu .btn-red a,
#top-menu .btn-red a:hover,
#top-menu .btn-pink a,
#top-menu .btn-pink a:hover,
footer .btn-red a,
footer .btn-red a:hover,
footer .btn-pink a,
footer .btn-pink a:hover,
.et-fixed-header #top-menu li.btn-red.current-menu-item>a,
.et-fixed-header #top-menu li.btn-red.current_page_item>a,
.et-fixed-header #top-menu li.btn-pink.current-menu-item>a,
.et-fixed-header #top-menu li.btn-pink.current_page_item>a,
.et_header_style_left #et-top-navigation nav>ul>li.btn-red.menu-item-has-children.btn-red>a,
.et_header_style_left #et-top-navigation nav>ul>li.btn-pink.menu-item-has-children.btn-pink>a {
	background-color: #D91E4A;
	background: #D91E4A;
	border-radius: 0px;
	color: #F5F1EA !important;
	font-weight: 700!important;
	padding: 10px !important;
	text-align: center;
}

/* Mobile menu, matching the .color-gold mobile treatment above. */
.et_mobile_menu li.btn-red a,
.et_mobile_menu li.btn-pink a {
	background-color: #D91E4A;
	color: #F5F1EA !important;
	font-weight: 700 !important;
	text-align: center;
}

/* Text colour - pink/crimson.
   Mirrors the .color-gold selector set above. Gold is a metallic gradient
   (background-clip:text); pink is a flat fill from the mockup, so no clip
   trickery is needed - just colour. .color-crimson is kept as an alias
   because the page exports already use that name. */
.et_mobile_menu li.color-pink a,
.et_mobile_menu li li.color-pink a,
.h-color-pink h1,
.h-color-pink h2,
.h-color-pink h3,
.h-color-pink h4,
.h-color-pink h5,
.h-color-pink h6,
.h1-color-pink h1,
.h2-color-pink h2,
.h3-color-pink h3,
.h4-color-pink h4,
.h5-color-pink h5,
.h6-color-pink h6,
.color-pink,
.color-pink a,
a.color-pink,
a.a-color-pink,
.a-color-pink a,
.color-pink-active:active,
.color-pink-active a:active,
.color-pink-active.current_page_item a,
a.color-pink-active:active,
.color-crimson,
.color-crimson a,
a.color-crimson {
	color: #D91E4A;
}

.color-pink h1,
.color-pink h2,
.color-pink h3,
.color-pink h4,
.color-pink h5,
.color-pink h6,
.color-crimson h1,
.color-crimson h2,
.color-crimson h3,
.color-crimson h4,
.color-crimson h5,
.color-crimson h6 {
	color: #D91E4A;
}

/* ============================================================
   MODULE BUTTON COLOURS
   These selectors deliberately outrank Divi's later per-module rules,
   including saved zero-width borders.
   ============================================================ */
body #page-container .et_pb_section .et_pb_button.btn-gold,
body #page-container .et_pb_section .et_pb_button.btn-gold:hover {
  background-color: #C4982E !important;
  background-image: linear-gradient(90deg,#f8e0a1 0%,#c69327 26%,#f4ca5d 41%,#864604 87%,#f0b519 100%) !important;
  border: 2px solid #c69327 !important;
  border-image: linear-gradient(90deg,#f8e0a1 0%,#c69327 26%,#f4ca5d 41%,#864604 87%,#f0b519 100%) 1 !important;
  border-radius: 0 !important;
  color: #0A0A0A !important;
}
body #page-container .et_pb_section .et_pb_button.btn-gold:hover {
  background-color: #D9AD3F !important;
  background-image: linear-gradient(90deg,#f8e0a1 0%,#f4ca5d 30%,#f8e0a1 55%,#f0b519 100%) !important;
}
/* White label on a dark transparent fill, with the brand metallic ramp
   rendered as a true gradient border at rest and on hover. */
body #page-container .et_pb_section .et_pb_button.btn-border-gold,
body #page-container .et_pb_section .et_pb_button.btn-border-gold:hover {
  background-image: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  border: 2px solid #c69327 !important;
  border-image: linear-gradient(90deg,#f8e0a1 0%,#c69327 26%,#f4ca5d 41%,#864604 87%,#f0b519 100%) 1 !important;
  border-radius: 0 !important;
  padding: 15px 30px !important;
  box-sizing: border-box;
}
body #page-container .et_pb_section .et_pb_button.btn-border-gold {
  background-color: rgba(10, 10, 10, .55) !important;
}
body #page-container .et_pb_section .et_pb_button.btn-border-gold:hover {
  background-color: rgba(196, 152, 46, .22) !important;
}
body #page-container .et_pb_button.btn-red,
body #page-container .et_pb_button.btn-pink {
	background: #D91E4A !important;
	background-color: #D91E4A !important;
	border: 2px solid #D91E4A !important;
	color: #F5F1EA !important;
}
body #page-container .et_pb_button.btn-red:hover,
body #page-container .et_pb_button.btn-pink:hover {
	background: #b01840 !important;
	background-color: #b01840 !important;
	border-color: #b01840 !important;
	color: #FFFFFF !important;
}

/* ------------------------------------------------------------------
   Visual Builder: gradient text falls back to solid gold.
   .color-gold paints its gold with background-clip:text, which needs
   color + -webkit-text-fill-color to be transparent. Divi's builder
   renders module content in editable regions where that clip does not
   paint, so the text reads as invisible and cannot be edited. Inside
   the builder only (body.et-fb) we swap to a solid #C4982E. The front
   end is untouched and keeps the gradient.
   ------------------------------------------------------------------ */
/*html.et-fb-app-frame [class*="color-gold"],
html.et-fb-app-frame [class*="color-gold"] *,
body.et-fb [class*="color-gold"],
body.et-fb [class*="color-gold"] * {
  color: #C4982E !important;
  -webkit-text-fill-color: #C4982E !important;
  background-image: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
}

/* ------------------------------------------------------------------
   Fixed header on scroll — matches the mockup header bar:
   92% dark fill, 8px backdrop blur, hairline gold underline.
   Divi has no setting for backdrop-filter or a header border, so this
   lives here rather than in the Customizer.
   ------------------------------------------------------------------ */
/* Hairline gold underline — the mockup header carries it at all times. */
#main-header,
#main-header.et-fixed-header {
  border-bottom: 1px solid rgba(196, 152, 46, .22) !important;
}

/* Once Divi marks the bar fixed, add the mockup's translucent fill and blur. */
#main-header.et-fixed-header {
  background-color: rgba(10, 10, 10, .92) !important;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow: none !important;
}

/* ------------------------------------------------------------------
   TEXT-ONLY CTAs — no background, no border, no padding.
   .btn-gold-txt  gold GRADIENT   ·   .btn-pink-txt  crimson #D91E4A
   Works on plain <a> links in text modules AND on Divi button
   modules that carry the class (the arrow :after inherits the colour).
   ------------------------------------------------------------------ */
body #page-container a.btn-gold-txt,
body #page-container .et_pb_button.btn-gold-txt,
body #page-container a.btn-pink-txt,
body #page-container .et_pb_button.btn-pink-txt,
body #page-container a.btn-gold-txt:hover,
body #page-container .et_pb_button.btn-gold-txt:hover,
body #page-container a.btn-pink-txt:hover,
body #page-container .et_pb_button.btn-pink-txt:hover {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  padding: 0 !important;
}
/* Gold means the GRADIENT, not a flat swatch. background-clip:text paints the
   gradient through the glyphs, so color and -webkit-text-fill-color must both
   go transparent or they cover it. The :after arrow needs its own copy of the
   gradient - background-image and background-clip are not inherited, only the
   transparent text-fill is, which is what makes a glyph vanish instead. */
body #page-container a.btn-gold-txt,
body #page-container .et_pb_button.btn-gold-txt,
body #page-container .et_pb_button.btn-gold-txt:after {
  /* Same brand golds as the headline gradient, but the #864604 stop is dropped.
     At 87% it lands on the tail of a short label ("RE ->") and measures 2.66:1
     against the #111 card - under the 4.5:1 AA floor for 16px text. On giant
     display type it reads as depth; on a 16px link it reads as a fade-out.
     Remaining stops measure 6.99:1 to 14.86:1. */
  background: linear-gradient(90deg, #f8e0a1 0%, #c69327 30%, #f4ca5d 62%, #f0b519 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}
/* Hover lifts the same palette brighter - no new hues introduced. */
body #page-container a.btn-gold-txt:hover,
body #page-container .et_pb_button.btn-gold-txt:hover,
body #page-container .et_pb_button.btn-gold-txt:hover:after {
  background: linear-gradient(90deg, #f8e0a1 0%, #f4ca5d 30%, #f8e0a1 55%, #f0b519 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}
body #page-container a.btn-pink-txt,
body #page-container .et_pb_button.btn-pink-txt,
body #page-container .et_pb_button.btn-pink-txt:after {
  color: #D91E4A !important;
  -webkit-text-fill-color: #D91E4A !important;
}
body #page-container a.btn-pink-txt:hover,
body #page-container .et_pb_button.btn-pink-txt:hover,
body #page-container .et_pb_button.btn-pink-txt:hover:after {
  color: #F02A58 !important;
  -webkit-text-fill-color: #F02A58 !important;
}


/* ------------------------------------------------------------------
   JOURNAL GRID + SINGLE POST
   Divi's blog grid uses salvattore column masonry, which staggers the
   tiles. Every other card grid on this site lines up, so the grid is
   rebuilt with flex. Divi exposes no setting for this.
   (Written with flex + calc rather than CSS grid: WordPress's built-in
   CSSLint does not recognise the fr unit and blocks the file from saving.)
   ------------------------------------------------------------------ */
.et_pb_blog_grid .et_pb_salvattore_content {
  display: flex;
  flex-wrap: wrap;
  gap: 26px;
}
.et_pb_blog_grid .et_pb_salvattore_content > .column {
  display: contents;
}
.et_pb_blog_grid .et_pb_post {
  width: calc(33.333% - 18px);
  margin: 0 !important;
  display: flex;
  flex-direction: column;
}
@media (max-width: 980px) {
  .et_pb_blog_grid .et_pb_post { width: calc(50% - 13px); }
}
@media (max-width: 767px) {
  .et_pb_blog_grid .et_pb_post { width: 100%; }
}

/* Blog list gold. The meta line and read-more link were flat #C4982E, which
   reads yellow beside the gradient gold used everywhere else on the site.
   Both Divi blog layouts are covered: .et_pb_blog_grid (grid) and
   .et_pb_posts (fullwidth / standard).
   The gradient sits on .post-meta and its descendants are given a transparent
   fill with no background of their own, so the parent's clipped gradient shows
   through them as one continuous sweep instead of restarting at every link. */
body #page-container .et_pb_blog_grid .post-meta,
body #page-container .et_pb_posts .post-meta,
body #page-container .et_pb_blog_grid .wp-pagenavi a,
body #page-container .et_pb_posts .wp-pagenavi a,
body #page-container .et_pb_blog_grid .pagination a,
body #page-container .et_pb_posts .pagination a {
    background: linear-gradient(90deg, #f8e0a1 0%, #c69327 30%, #f4ca5d 62%, #f0b519 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
}
body #page-container .et_pb_blog_grid .post-meta a,
body #page-container .et_pb_posts .post-meta a,
body #page-container .et_pb_blog_grid .post-meta span,
body #page-container .et_pb_posts .post-meta span {
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
}
body #page-container .et_pb_blog_grid .post-meta a:hover,
body #page-container .et_pb_posts .post-meta a:hover {
    background: linear-gradient(90deg, #f8e0a1 0%, #f4ca5d 30%, #f8e0a1 55%, #f0b519 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent !important;
}


/* Single post: the Divi Theme Builder body template governs these pages, so
   .entry-title and #main-content selectors do nothing here. The one thing the
   template cannot express is a comfortable reading measure - 1080px of 17px
   Jost runs about 110 characters a line. Cap the body rows only. */
body.single-post .et-l--body .et_pb_row {
  max-width: 840px;
}




/* ==================================================================
   MOVED FROM DIVI - THEME OPTIONS - CUSTOM CSS  (2026-08-04)
   All site CSS lives in this file. Theme Options Custom CSS is empty
   on purpose - do not put rules back there.
   The old .btn-gold / .btn-border-gold patches that used to sit here
   were removed: the gold metallic fill moved into the .btn-gold rule
   above, and the .btn-border-gold gradient-text treatment was retired
   when the label became white.
   ================================================================== */

/* ---- Mockup design devices ---- */

/* Neon sign flicker — Stay Write Podcast title (matches lo-neon in the mockup) */
@keyframes lo-neon{0%,100%{opacity:1;text-shadow:0 0 6px rgba(217,30,74,.9),0 0 22px rgba(217,30,74,.65),0 0 40px rgba(217,30,74,.35)}45%{opacity:.92}48%{opacity:.72}}
.lo-neon h1,.lo-neon h2{animation:lo-neon 4s ease-in-out infinite}

/* Neon glow variants. Glow colour only — the text keeps whatever colour is assigned
   in the module, so these can sit on cream, gold or crimson type alike. */
@keyframes lo-neon-yellow{0%,100%{opacity:1;text-shadow:0 0 6px rgba(196,152,46,.9),0 0 22px rgba(196,152,46,.65),0 0 40px rgba(196,152,46,.35)}45%{opacity:.92}48%{opacity:.72}}
@keyframes lo-neon-pink{0%,100%{opacity:1;text-shadow:0 0 6px rgba(217,30,74,.9),0 0 22px rgba(217,30,74,.65),0 0 40px rgba(217,30,74,.35)}45%{opacity:.92}48%{opacity:.72}}
.lo-neon-yellow h1,.lo-neon-yellow h2,.lo-neon-yellow h3,.lo-neon-yellow h4,.lo-neon-yellow h5,.lo-neon-yellow h6,.lo-neon-yellow p{animation:lo-neon-yellow 4s ease-in-out infinite}
.lo-neon-pink h1,.lo-neon-pink h2,.lo-neon-pink h3,.lo-neon-pink h4,.lo-neon-pink h5,.lo-neon-pink h6,.lo-neon-pink p{animation:lo-neon-pink 4s ease-in-out infinite}
/* Steady versions — same glow, no flicker */
.lo-glow-yellow h1,.lo-glow-yellow h2,.lo-glow-yellow h3,.lo-glow-yellow h4,.lo-glow-yellow h5,.lo-glow-yellow h6,.lo-glow-yellow p{text-shadow:0 0 6px rgba(196,152,46,.9),0 0 22px rgba(196,152,46,.65),0 0 40px rgba(196,152,46,.35)}
.lo-glow-pink h1,.lo-glow-pink h2,.lo-glow-pink h3,.lo-glow-pink h4,.lo-glow-pink h5,.lo-glow-pink h6,.lo-glow-pink p{text-shadow:0 0 6px rgba(217,30,74,.9),0 0 22px rgba(217,30,74,.65),0 0 40px rgba(217,30,74,.35)}

/* Award / status badge pill */
.lo-badge p{display:inline-block;border:1px solid rgba(196,152,46,.55);border-radius:2px;padding:5px 12px}

/* Ornamental glyph — oversized, gold, used as a section mark */
.lo-glyph p{font-size:26px;line-height:1}
/* Respect reduced-motion: show everything, no rise-in, no neon flicker */
@media (prefers-reduced-motion: reduce){
  .et_pb_row.et_animated,.et_pb_section.et_animated{opacity:1 !important;animation:none !important}
  .lo-neon h1,.lo-neon h2,.lo-neon-yellow h1,.lo-neon-yellow h2,.lo-neon-yellow h3,.lo-neon-yellow h4,.lo-neon-yellow h5,.lo-neon-yellow h6,.lo-neon-yellow p,.lo-neon-pink h1,.lo-neon-pink h2,.lo-neon-pink h3,.lo-neon-pink h4,.lo-neon-pink h5,.lo-neon-pink h6,.lo-neon-pink p{animation:none !important}
}
/* H1 hero sizing lives in each page's Divi text module (Design > Heading Text >
   H1 > Font Size) with Desktop / Tablet / Phone values set there, so it is
   editable in the builder. Do not re-add per-page-ID overrides here. */
/* Fillout embed anchor offset */
#start{scroll-margin-top:110px}
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ==================================================================
   GRADIENT-SAFE GLOW / NEON  (works with .color-gold and friends)
   ------------------------------------------------------------------
   .color-gold paints the gold as a BACKGROUND clipped to the glyphs
   (background-clip:text + transparent text-fill). Paint order inside
   an element is background -> text-shadow -> glyph, so a text-shadow
   lands ON TOP of that gold gradient and washes it out. Every glow
   class below uses filter: drop-shadow() instead, which runs on the
   element AFTER it is fully rendered - so the glow traces the gold
   glyphs and the gradient stays intact.

   filter applies to the whole painted subtree, so ONE rule on the
   module wrapper covers every heading and paragraph inside it. That
   is why there is no h1/h2/p list here.

   Put these on a Divi MODULE (Advanced > CSS Class). Avoid putting
   them on a section or row that has its own background colour - the
   filter would glow the whole box, not just the type.
   ================================================================== */

@keyframes lo-flicker{0%,100%{opacity:1}45%{opacity:.92}}

/* Steady gold glow - safe on gradient gold, solid gold, cream, white */
.lo-glow-gold {
  filter:
    drop-shadow(0 0 6px rgba(196,152,46,.85))
    drop-shadow(0 0 18px rgba(196,152,46,.5))
    drop-shadow(0 0 34px rgba(196,152,46,.3));
}

/* Steady crimson glow - same technique, brand red */
.lo-glow-crimson {
  filter:
    drop-shadow(0 0 6px rgba(217,30,74,.85))
    drop-shadow(0 0 18px rgba(217,30,74,.5))
    drop-shadow(0 0 34px rgba(217,30,74,.3));
}

/* Flickering versions. The glow itself is static and only opacity
   pulses - same feel as the original lo-neon, and far cheaper than
   animating a three-stack filter every frame. */
.lo-neon-gold {
  filter:
    drop-shadow(0 0 6px rgba(196,152,46,.9))
    drop-shadow(0 0 18px rgba(196,152,46,.6))
    drop-shadow(0 0 34px rgba(196,152,46,.32));
  animation: lo-flicker 4s ease-in-out infinite;
}

.lo-neon-crimson {
  filter:
    drop-shadow(0 0 6px rgba(217,30,74,.9))
    drop-shadow(0 0 18px rgba(217,30,74,.6))
    drop-shadow(0 0 34px rgba(217,30,74,.32));
  animation: lo-flicker 4s ease-in-out infinite;
}

/* Backwards compatibility. If one of the older text-shadow classes
   lands on a module that also carries any *-color-gold class, the
   shadow would wash the gradient out. Upgrade it to the filter. */
[class*="color-gold"].lo-glow-yellow,
[class*="color-gold"].lo-neon-yellow {
  filter:
    drop-shadow(0 0 6px rgba(196,152,46,.85))
    drop-shadow(0 0 18px rgba(196,152,46,.5))
    drop-shadow(0 0 34px rgba(196,152,46,.3));
}

[class*="color-gold"].lo-glow-pink,
[class*="color-gold"].lo-neon-pink {
  filter:
    drop-shadow(0 0 6px rgba(217,30,74,.85))
    drop-shadow(0 0 18px rgba(217,30,74,.5))
    drop-shadow(0 0 34px rgba(217,30,74,.3));
}

[class*="color-gold"].lo-neon-yellow,
[class*="color-gold"].lo-neon-pink {
  animation: lo-flicker 4s ease-in-out infinite;
}

/* ...and strip the text-shadow the old classes would have applied */
[class*="color-gold"][class*="lo-glow-"],
[class*="color-gold"][class*="lo-neon-"],
[class*="color-gold"][class*="lo-glow-"] *,
[class*="color-gold"][class*="lo-neon-"] * {
  text-shadow: none !important;
}

[class*="color-gold"].lo-neon-yellow *,
[class*="color-gold"].lo-neon-pink * {
  animation: none !important;
}

@media (prefers-reduced-motion: reduce) {
  .lo-neon-gold,
  .lo-neon-crimson,
  [class*="color-gold"].lo-neon-yellow,
  [class*="color-gold"].lo-neon-pink {
    animation: none !important;
    opacity: 1 !important;
  }
}

/* The gradient can also sit on an inline span INSIDE a glowing heading,
   e.g. <h2>Stay <span class="color-gold">Write</span></h2> on the home page.
   text-shadow is an inherited property, so the span picks it up from the
   heading and it paints over the gold ramp - the same washout as before, just
   one level down. The compound selectors above only fire when both classes are
   on the SAME element, so they miss this. Cancel the inherited shadow on the
   span and give it its own drop-shadow instead. No animation needed here: the
   parent keyframes already pulse opacity for the whole heading, span included. */
.lo-neon [class*="color-gold"],
.lo-glow-yellow [class*="color-gold"],
.lo-neon-yellow [class*="color-gold"] {
  text-shadow: none !important;
  filter:
    drop-shadow(0 0 6px rgba(196,152,46,.85))
    drop-shadow(0 0 18px rgba(196,152,46,.5))
    drop-shadow(0 0 34px rgba(196,152,46,.3));
}

.lo-glow-pink [class*="color-gold"],
.lo-neon-pink [class*="color-gold"] {
  text-shadow: none !important;
  filter:
    drop-shadow(0 0 6px rgba(217,30,74,.85))
    drop-shadow(0 0 18px rgba(217,30,74,.5))
    drop-shadow(0 0 34px rgba(217,30,74,.3));
}

/* ------------------------------------------------------------------
   Event galleries (The Events Calendar single-event content).
   TEC renders event descriptions as plain WP content, not Divi, so the
   markup carries named classes and the styling lives here. Flex + calc
   rather than CSS grid - WP's CSSLint rejects the fr unit and blocks
   the save. ------------------------------------------------------- */
.lo-evgal-h {
  font-family: Oswald, sans-serif; font-weight: 600; text-transform: uppercase;
  letter-spacing: .02em; font-size: 22px; color: #C4982E; margin: 38px 0 6px;
}
.lo-evgal-n {
  font-family: Jost, sans-serif; font-size: 15px; line-height: 1.7;
  color: rgba(245,241,234,.7); margin: 0 0 18px;
}
.lo-evgal { display: flex; flex-wrap: wrap; gap: 14px; margin: 0 0 10px; }
.lo-evgal .lo-evfig { margin: 0; width: calc(33.333% - 10px); }
.lo-evgal .lo-evfig img {
  display: block; width: 100%; height: 220px; object-fit: cover;
  border: 1px solid rgba(196,152,46,.28); border-radius: 4px;
}
@media (max-width: 980px) { .lo-evgal .lo-evfig { width: calc(50% - 7px); } }
@media (max-width: 640px) { .lo-evgal .lo-evfig { width: 100%; }
  .lo-evgal .lo-evfig img { height: auto; } }

/* Poster / flyer artwork is portrait - contain it rather than crop. */
.lo-evgal--posters .lo-evfig img {
  height: 340px; object-fit: contain; background: #111111; padding: 8px;
}

/* ==================================================================
   The Events Calendar - brand skin
   TEC v2 ships a light-mode design (white search bar, blue buttons)
   that is unreadable on this dark site. Scoped to .tribe-common /
   .tribe-events so nothing here can leak into Divi modules.
   ================================================================== */
.tribe-common, .tribe-events { background: #0A0A0A; }
.tribe-common .tribe-common-h1,.tribe-common .tribe-common-h2,
.tribe-common .tribe-common-h3,.tribe-common .tribe-common-h4,
.tribe-common .tribe-common-h5,.tribe-common .tribe-common-h6,
.tribe-common .tribe-common-h7,.tribe-common .tribe-common-h8 {
  font-family: Oswald, sans-serif; letter-spacing: .01em; color: #F5F1EA;
}
.tribe-common .tribe-common-b1,.tribe-common .tribe-common-b2,
.tribe-common .tribe-common-b3 { font-family: Jost, sans-serif; color: rgba(245,241,234,.78); }
.tribe-events .tribe-events-calendar-list__event-title-link,
.tribe-events .tribe-events-calendar-latest-past__event-title-link,
.tribe-events .tribe-events-calendar-month__calendar-event-title-link,
.tribe-events .tribe-events-calendar-month__multiday-event-bar-title,
.tribe-events .tribe-events-calendar-day__event-title-link,
#tribe-events-content .tribe-events-sub-nav a,
#tribe-events-footer .tribe-events-sub-nav a { color: #C4982E; }
.tribe-events .tribe-events-calendar-list__event-title-link:hover,
.tribe-events .tribe-events-calendar-latest-past__event-title-link:hover,
.tribe-events .tribe-events-calendar-month__calendar-event-title-link:hover,
.tribe-events .tribe-events-calendar-day__event-title-link:hover,
#tribe-events-content .tribe-events-sub-nav a:hover,
#tribe-events-footer .tribe-events-sub-nav a:hover { color: #F4CA5D; filter: brightness(1.18); }
.tribe-events a { color: #C4982E; }
.tribe-events a:hover { color: #D91E4A; }
.tribe-events .tribe-events-calendar-list__event-date-tag-daynum,
.tribe-events .tribe-events-calendar-list__event-date-tag-weekday{background-image:linear-gradient(90deg, #f8e0a1 0%, #c69327 30%, #f4ca5d 62%, #f0b519 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.tribe-events .tribe-events-calendar-list__event-datetime,
.tribe-events .tribe-events-calendar-day__event-datetime { color: rgba(245,241,234,.7); }
.tribe-events .tribe-events-calendar-list__event-venue,
.tribe-events .tribe-events-calendar-list__event-venue-title { color: rgba(245,241,234,.8); }
.tribe-events .tribe-events-header,
.tribe-events .tribe-events-c-events-bar,
.tribe-events .tribe-events-c-search__input-control {
  background: #111111; border-color: rgba(196,152,46,.28);
}
.tribe-events .tribe-common-form-control-text__input {
  background: #111111; color: #F5F1EA; font-family: Jost, sans-serif;
}
.tribe-events .tribe-common-form-control-text__input::placeholder { color: rgba(245,241,234,.45); }
.tribe-events .tribe-common-c-svgicon path { fill: #C4982E; }
.tribe-events .tribe-common-c-btn,
.tribe-events button.tribe-common-c-btn {
  background: #C4982E; color: #0A0A0A; font-family: Oswald, sans-serif;
  font-weight: 600; text-transform: uppercase; letter-spacing: .06em; border-radius: 2px;
}
.tribe-events .tribe-common-c-btn:hover,
.tribe-events button.tribe-common-c-btn:hover { background: #F5F1EA; color: #0A0A0A; }
.tribe-events .tribe-events-c-top-bar__today-button {
  background: transparent; color: #F5F1EA; border: 1px solid rgba(196,152,46,.5);
  border-radius: 2px; font-family: Oswald, sans-serif; text-transform: uppercase; letter-spacing: .06em;
}
.tribe-events .tribe-events-c-top-bar__today-button:hover { border-color: #C4982E; color: #C4982E; }
.tribe-events .tribe-events-c-view-selector__list-item-link,
.tribe-events .tribe-events-c-view-selector__list-item-text { color: #F5F1EA; }
.tribe-events .tribe-events-c-view-selector__list-item--active .tribe-events-c-view-selector__list-item-text { color: #C4982E; }
.tribe-events .tribe-events-c-top-bar__nav-link svg path,
.tribe-events .tribe-events-c-top-bar__datepicker-button svg path,
.tribe-events .tribe-events-c-nav__prev svg path,
.tribe-events .tribe-events-c-nav__next svg path{fill:#C4982E !important}
.tribe-events .tribe-events-c-top-bar__nav-link[disabled] svg path,
.tribe-events .tribe-events-c-nav__prev[disabled] svg path,
.tribe-events .tribe-events-c-nav__next[disabled] svg path{fill:rgba(196,152,46,.35) !important}
.tribe-events .tribe-events-c-top-bar__datepicker-button { color: #F5F1EA; font-family: Oswald, sans-serif; }
.tribe-events .tribe-events-calendar-list__month-separator-text{font-family:Oswald, sans-serif;text-transform:uppercase;background-image:linear-gradient(90deg, #f8e0a1 0%, #c69327 30%, #f4ca5d 62%, #f0b519 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.tribe-events .tribe-events-calendar-list__month-separator::after{background-color:rgba(196,152,46,.4) !important;background-image:linear-gradient(90deg, rgba(196,152,46,.7) 0%, rgba(196,152,46,.1) 100%) !important}
.tribe-events .tribe-events-calendar-month__day { border-color: rgba(196,152,46,.16); }
.tribe-events .tribe-events-calendar-month__header-column-title { color: #C4982E; font-family: Oswald, sans-serif; }

/* Month grid — TEC ships dark-navy day numbers and grey times that vanish on the dark grid */
.tribe-events .tribe-events-calendar-month__day-date-daynum,
.tribe-events .tribe-events-calendar-month__day-date-link{color:rgba(245,241,234,.75) !important}
.tribe-events .tribe-events-calendar-month__day-date-link:hover,
.tribe-events .tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date-daynum{color:#C4982E !important}
.tribe-events .tribe-events-calendar-month__calendar-event-datetime,
.tribe-events .tribe-events-calendar-month__calendar-event-datetime time,
.tribe-events .tribe-events-calendar-month__calendar-event-datetime-separator,
.tribe-events .tribe-events-calendar-month__calendar-event-tooltip-datetime,
.tribe-events .tribe-events-calendar-month__calendar-event-tooltip-datetime time{color:rgba(245,241,234,.7) !important}
.tribe-events .tribe-events-calendar-month__mobile-events-icon--event{background-color:#C4982E !important}
.tribe-events .tribe-events-c-search__input{color:#F5F1EA !important}
.tribe-events .tribe-events-c-view-selector__button .tribe-common-c-svgicon__svg-fill,
.tribe-events .tribe-events-c-view-selector__list-item-link .tribe-common-c-svgicon__svg-fill{fill:#C4982E !important}
.tribe-events .tribe-events-calendar-month__day-date { color: #F5F1EA; }
.tribe-events-single .tribe-events-event-meta,
.tribe-events .tribe-events-c-subscribe-dropdown__button {
  background: #111111; border: 1px solid rgba(196,152,46,.22); color: #F5F1EA;
}
.tribe-events-single .tribe-events-event-meta a { color: #C4982E; }

/* Remaining TEC light-mode surfaces, targeted by their real classes */
.tribe-events .tribe-events-header__events-bar,
.tribe-events .tribe-events-c-events-bar__search-container,
.tribe-events .tribe-events-c-view-selector__content {
  background: #111111; border-color: rgba(196,152,46,.28);
}
.tribe-events a.tribe-events-c-top-bar__today-button,
.tribe-events a.tribe-common-c-btn-border-small {
  background: transparent; color: #F5F1EA; border: 1px solid rgba(196,152,46,.5);
}
.tribe-events a.tribe-events-c-top-bar__today-button:hover { border-color: #C4982E; color: #C4982E; }
.tribe-events button.tribe-events-c-search__button{color:#0A0A0A !important;-webkit-text-fill-color:#0A0A0A;background-color:#C4982E;background-image:linear-gradient(90deg, #f8e0a1 0%, #c69327 26%, #f4ca5d 41%, #864604 87%, #f0b519 100%);background-size:150% 100%;background-position:0 0;border-radius:2px;box-shadow:0 0 0 0 rgba(196,152,46,0);transition:background-image .3s ease, box-shadow .3s ease, transform .3s ease}
/* TEC hover wipes the gradient, swaps in its own blue/white fill and jumps the radius 2px -> 4px.
   Hold the shape, brighten the gradient — same behaviour as every other gold button on the site. */
.tribe-events button.tribe-events-c-search__button:hover,
.tribe-events button.tribe-events-c-search__button:focus,
.tribe-events button.tribe-events-c-search__button:focus-visible,
.tribe-events button.tribe-events-c-search__button:active{color:#0A0A0A !important;-webkit-text-fill-color:#0A0A0A;background-color:#C4982E !important;background-image:linear-gradient(90deg, #f8e0a1 0%, #f4ca5d 30%, #f8e0a1 55%, #f0b519 100%) !important;background-size:150% 100%;background-position:0 0;border:0 !important;border-radius:2px !important;padding:11px 20px !important;box-shadow:0 0 0 1px rgba(196,152,46,.55), 0 6px 18px rgba(196,152,46,.18) !important;transform:translateY(-1px);outline:none}
.tribe-events .tribe-events-c-view-selector__list-item--active .tribe-events-c-view-selector__list-item-link::after{background-color:#C4982E !important;background-image:linear-gradient(90deg, #f8e0a1 0%, #c69327 30%, #f4ca5d 62%, #f0b519 100%) !important}
.tribe-events button.tribe-common-c-btn__clear,
.tribe-events .tribe-events-c-top-bar__datepicker-desktop { color: #F5F1EA; }
.tribe-events .tribe-events-c-nav__prev,
.tribe-events .tribe-events-c-nav__next,
.tribe-events .tribe-events-c-nav__prev-label,
.tribe-events .tribe-events-c-nav__next-label{color:#C4982E !important}
.tribe-events .tribe-events-c-nav__prev[disabled],
.tribe-events .tribe-events-c-nav__next[disabled]{color:rgba(196,152,46,.35) !important}
.tribe-events .tribe-events-c-view-selector__list-item-text { color: #F5F1EA; }

/* These two carry .tribe-events on themselves, so a descendant selector
   (.tribe-events .x) never matches them. Target them directly. */
body .tribe-events-header__events-bar,
body .tribe-events-c-events-bar,
body .tribe-events-c-view-selector__content,
body .tribe-events-c-events-bar__search-container {
  background: #111111 !important; border-color: rgba(196,152,46,.28) !important;
}
body .tribe-events-c-view-selector__list-item-text { color: #F5F1EA; }

/* Events page rows (Divi-built, /events-page/). Mockup row is
   date-tag | body | Details. Divi cannot nest columns inside a column, so
   the row is one column of stacked text modules and the grid is composed
   here. Colours/type/borders/padding all live in module settings. */
.lo-evrow{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"date meta link" "date body link" "date desc link";gap:4px 24px;align-items:center;transition:border-color .3s,transform .3s}
.lo-evrow:hover{border-color:#C4982E !important;transform:translateY(-3px)}
.lo-evrow > .et_pb_module{margin-bottom:0 !important}
.lo-evrow > .lo-evdate{grid-area:date}
.lo-evrow > .lo-evmeta{grid-area:meta;align-self:end}
.lo-evrow > .et_pb_text:nth-child(3){grid-area:body;align-self:center}
.lo-evrow > .et_pb_text:nth-child(4){grid-area:desc;align-self:start}
.lo-evrow > .et_pb_text:nth-child(5){grid-area:link;justify-self:end;align-self:center;white-space:nowrap}
.lo-evrow .lo-evdate p{border:1px solid rgba(196,152,46,.55);border-radius:3px;padding:12px 16px;text-align:center;min-width:78px;margin:0}
.lo-evrow .lo-evmy{display:block;font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:rgba(245,241,234,.7)}
.lo-evpill{display:inline-block;border:1px solid rgba(245,241,234,.25);border-radius:2px;padding:2px 8px;margin-right:8px}
.lo-evvenue{font-family:Jost,sans-serif;font-size:13px;letter-spacing:0;text-transform:none;color:rgba(245,241,234,.6)}
@media (max-width:720px){.lo-evrow{grid-template-columns:1fr;grid-template-areas:"date" "meta" "body" "desc" "link";gap:12px}.lo-evrow > .et_pb_text:nth-child(5){justify-self:start}.lo-evrow .lo-evdate p{display:inline-block}}

/* ==================================================================
   Single event pages - EventDetail.dc.html skin
   TEC already outputs the back link, title, schedule, featured image
   and meta panel. Restyling those in place rather than rebuilding them
   in Divi avoids duplicate H1s and duplicate date/venue blocks.
   ================================================================== */
.tribe-events-single{max-width:1140px;margin:0 auto;padding:56px 40px 70px}
.tribe-events-single .tribe-events-back{margin:0 0 22px}
.tribe-events-single .tribe-events-back a{font-family:Oswald,sans-serif;font-weight:600;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:rgba(245,241,234,.6)}
.tribe-events-single .tribe-events-back a:hover{color:#C4982E}
.tribe-events-single h1.tribe-events-single-event-title{font-family:Oswald,sans-serif;font-weight:700;font-size:clamp(34px,4.2vw,56px);line-height:1;text-transform:uppercase;color:#F5F1EA;margin:0 0 14px;max-width:900px}
.tribe-events-single .tribe-events-schedule{background:transparent;border:0;padding:0;margin:0 0 26px}
.tribe-events-single .tribe-events-schedule h2,
.tribe-events-single .tribe-events-schedule .tribe-events-schedule__datetime{font-family:Oswald,sans-serif;font-weight:600;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:#D91E4A}
.tribe-events-single .tribe-events-event-image{margin:0 0 34px}
.tribe-events-single .tribe-events-event-image img{display:block;width:100%;height:auto;border:1px solid rgba(196,152,46,.3);border-radius:6px}
.tribe-events-single .tribe-events-single-event-description p,
.tribe-events-single .tribe-events-single-event-description li{font-size:16.5px;line-height:1.85;color:rgba(245,241,234,.82)}
.tribe-events-single .tribe-events-single-event-description ul{margin:0 0 18px 20px;padding:0}
.tribe-events-single .tribe-events-single-event-description li{margin:0 0 8px}
.tribe-events-single .tribe-events-single-event-description li::marker{color:#C4982E}
/* Event Details / Venue panel */
.tribe-events-single .tribe-events-event-meta{background:#0c0c0c;border:1px solid rgba(196,152,46,.4);border-radius:6px;padding:26px 28px;margin:34px 0 0;color:#F5F1EA}
.tribe-events-single .tribe-events-event-meta .tribe-events-single-section-title{font-family:Oswald,sans-serif;font-weight:600;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:#C4982E;margin:0 0 14px}
.tribe-events-single .tribe-events-event-meta dt{font-family:Oswald,sans-serif;font-weight:500;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:rgba(245,241,234,.55);margin-top:10px}
.tribe-events-single .tribe-events-event-meta dd{font-size:14.5px;color:#F5F1EA;margin:2px 0 0;padding-bottom:10px;border-bottom:1px solid rgba(196,152,46,.18)}
.tribe-events-single .tribe-events-event-meta a{color:#C4982E}
@media (max-width:900px){.tribe-events-single{padding:40px 24px 56px}
  .tribe-events-single h1.tribe-events-single-event-title{font-size:42px}}
@media (max-width:640px){.tribe-events-single h1.tribe-events-single-event-title{font-size:34px}}
/* Lineup grid + closing CTA, added into the event description */
.lo-evsec{font-family:Oswald,sans-serif;font-weight:600;font-size:24px;letter-spacing:.02em;text-transform:uppercase;color:#C4982E;margin:38px 0 16px}
.lo-lineup{display:flex;flex-wrap:wrap;gap:14px;margin:0 0 10px}
.lo-lineup .lo-act{width:calc(50% - 7px);border:1px solid rgba(196,152,46,.28);border-radius:5px;background:#0c0c0c;padding:16px 18px;font-family:Oswald,sans-serif;font-weight:600;font-size:15px;letter-spacing:.02em;text-transform:uppercase;color:#F5F1EA;line-height:1.15}
@media (max-width:640px){.lo-lineup .lo-act{width:100%}}
.lo-evcta2{border-top:1px solid rgba(217,30,74,.3);margin:40px 0 0;padding:40px 0 0;text-align:center}
.lo-evcta2 h3{font-family:Oswald,sans-serif;font-weight:700;font-size:32px;text-transform:uppercase;color:#F5F1EA;margin:0 0 10px}
.lo-evcta2 p{font-size:16px;color:rgba(245,241,234,.8);margin:0 0 20px}
body #page-container .lo-evcta2 a{display:inline-block;font-family:Oswald,sans-serif;font-weight:600;font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:#0A0A0A;background-color:#C4982E;background-image:linear-gradient(90deg, #f8e0a1 0%, #c69327 26%, #f4ca5d 41%, #864604 87%, #f0b519 100%);padding:15px 30px;border-radius:2px;background-size:150% 100%;background-position:0 0;color:#0A0A0A;-webkit-text-fill-color:#0A0A0A;transition:background-image .3s ease}
body #page-container .lo-evcta2 a:hover{background-image:linear-gradient(90deg, #f8e0a1 0%, #f4ca5d 30%, #f8e0a1 55%, #f0b519 100%);color:#0A0A0A;-webkit-text-fill-color:#0A0A0A}

/* The schedule line is spans, not a heading - target them directly. */
.tribe-events-single .tribe-events-schedule .tribe-event-date-start,
.tribe-events-single .tribe-events-schedule .tribe-event-time,
.tribe-events-single .tribe-events-schedule .tribe-event-date-end{font-family:Oswald,sans-serif;font-weight:600;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:#D91E4A}
.tribe-events-single .tribe-events-schedule .tribe-events-cost{font-family:Oswald,sans-serif;font-weight:600;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:#C4982E}
.tribe-events-single .tribe-events-notices{background:transparent;border:0;padding:0;margin:0 0 10px}
.tribe-events-single .tribe-events-notices li,
.tribe-events-single .tribe-events-notices p{font-family:Oswald,sans-serif;font-weight:500;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:rgba(245,241,234,.55);border:1px solid rgba(245,241,234,.25);border-radius:2px;padding:3px 9px;display:inline-block;margin:0}

.tribe-events-single .tribe-events-notices ul{list-style:none;margin:0;padding:0}


/* ==========================================================================
   SINGLE EVENT - sticky two-column layout (EventDetail mockup)
   ========================================================================== */
.tribe-events-single .type-tribe_events { overflow: visible; }
.tribe-events-single .tribe-events-meta-list { list-style: none; margin: 0; padding: 0; }
.tribe-events-single .tribe-events-meta-item { margin: 0 0 12px; padding: 0 0 12px; border-bottom: 1px solid rgba(196,152,46,.18); }
.tribe-events-single .tribe-events-meta-item:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.tribe-events-single .tribe-events-meta-label { display: block; font-family: Oswald, sans-serif; font-weight: 500; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: rgba(245,241,234,.55); margin: 0 0 3px; }
.tribe-events-single .tribe-events-meta-value { display: block; font-size: 14.5px; line-height: 1.45; color: #F5F1EA; }
.tribe-events-single .tribe-events-meta-value a { color: #C4982E; text-decoration: none; border-bottom: 1px solid rgba(196,152,46,.35); }
.tribe-events-single .tribe-events-meta-value a:hover { color: #F5F1EA; border-bottom-color: #F5F1EA; }

@media (min-width: 981px) {
  .tribe-events-single .type-tribe_events { display: grid; grid-template-columns: 1.35fr .65fr; column-gap: 52px; align-items: start; }
  .tribe-events-single .type-tribe_events > .tribe-events-event-image { grid-column: 1 / -1; grid-row: 1; margin: 0 0 38px; }
  .tribe-events-single .type-tribe_events > .tribe-events-single-event-description { grid-column: 1; grid-row: 2; margin: 0; }
  .tribe-events-single .type-tribe_events > .tribe-events.tribe-common { grid-column: 1; grid-row: 3; margin: 26px 0 0; }
  .tribe-events-single .type-tribe_events > .tribe-events-event-meta { grid-column: 2; grid-row: 2 / span 2; align-self: start; position: sticky; top: 110px; margin: 0; }
}


/* Single event - meta panel cleanup + poster gallery natural heights */
.tribe-events-single .tribe-events-event-meta::before,
.tribe-events-single .tribe-events-event-meta::after { content: none; border: none; }
.tribe-events-single .tribe-events-event-meta { display: block; }
.tribe-events-single .tribe-events-meta-group { float: none; width: auto; padding: 0; margin: 0 0 22px; }
.tribe-events-single .tribe-events-meta-group:last-child { margin-bottom: 0; }
.lo-evgal--posters { align-items: flex-start; }
.lo-evgal--posters .lo-evfig img { height: auto; object-fit: contain; }


/* Single event - heading colour inside TEC content + sticky offset clears fixed header */
.tribe-events-single .tribe-events-content h2,
.tribe-events-single .tribe-events-content h3,
.tribe-events-single .tribe-events-content h4 { color: #F5F1EA; }
.tribe-events-single .tribe-events-content h3.lo-evgal-h,
.tribe-events-single .tribe-events-content .lo-evgal-h { color: #C4982E; }
@media (min-width: 981px) {
  .tribe-events-single .type-tribe_events > .tribe-events-event-meta { top: 120px; }
}


/* Single event - venue text contrast + section heading parity */
.tribe-events-single .tribe-events-meta-group .tribe-venue,
.tribe-events-single .tribe-events-meta-group .tribe-venue a,
.tribe-events-single .tribe-events-address,
.tribe-events-single .tribe-events-address span,
.tribe-events-single .tribe-events-address abbr { color: #F5F1EA; font-size: 14.5px; line-height: 1.5; font-style: normal; border-bottom: none; text-decoration: none; }
.tribe-events-single .tribe-events-meta-group .tribe-venue { font-family: Oswald, sans-serif; font-weight: 600; letter-spacing: .01em; }
.tribe-events-single .tribe-events-content h3.lo-evsec,
.tribe-events-single .tribe-events-content .lo-evsec { color: #C4982E; }


/* TEC templates: Divi never adds .et-fixed-header here, so the transparent nav
   stays see-through and page content scrolls through it. Force it solid. */
body.single-tribe_events #main-header,
body.post-type-archive-tribe_events #main-header,
body.tribe-events-page-template #main-header {
  background-color: #0A0A0A;
  background-image: none;
  box-shadow: 0 1px 0 rgba(196,152,46,.18);
}


/* Event nav footer separator - TEC ships --tec-color-border-secondary #e4e4e4 (light mode). */
#tribe-events-footer { border-top: 1px solid rgba(196,152,46,.22); }


/* Dropdown panel. Divi only paints a dropdown background in the fixed-header state,
   so unfixed it renders transparent -- the Customizer emits
   `#main-header .nav li ul { background-color: rgba(0,0,0,0) }`, which ties on
   specificity and loads later, hence the #main-header prefix here. */
#main-header #top-menu li ul.sub-menu,
#main-header.et-fixed-header #top-menu li ul.sub-menu {
  background-color: #0C0C0C;
  border: 1px solid rgba(196,152,46,.35);
  border-radius: 3px;
  padding: 12px 0;
  box-shadow: 0 16px 38px rgba(0,0,0,.55);
}
#top-menu li ul.sub-menu > li { padding-left: 0; padding-right: 0; }
#top-menu li ul.sub-menu > li > a { padding: 8px 18px; }


/* Events Calendar Modules for Divi hardcodes a white card on its list layout
   (plugin style.min.css: .ecmd-list-post.style1{background-color:#fff}).
   Divi's module background setting sits on the outer .et_pb_module wrapper and
   cannot reach it, so it has to be unset here. */
.ecmd-event-list-wrapper .ecmd-list-post.style1 { background-color: transparent; }


/* Impact counters. Divi's Number Counter has no suffix field, so the "+"
   is a pseudo-element - it inherits the gradient because it is part of the
   same element's text, and Divi's JS only rewrites the text node. */
.lo-stat--plus .percent-value:after { content: "+"; }

/* ---------------------------------------------------------------------------
   INLINE LEFT BUTTONS  -  reusable module class: .lo-btn-inline-left

   Add the class directly to each adjacent Divi Button module that should share
   a left-aligned desktop row. It is independent of its column, section, page,
   builder-generated module number, and location in the page structure.

   Desktop (>980px): tagged adjacent Button modules share one left row.
   Tablet/phone: the wrappers return to normal block flow, so each module's own
   responsive Divi alignment setting remains authoritative.
   --------------------------------------------------------------------------- */
@media (min-width: 981px) {
    body #page-container .et_pb_column:has(> .et_pb_button_module_wrapper > .et_pb_button.lo-btn-inline-left) {
        white-space: nowrap;
    }
    body #page-container .et_pb_column:has(> .et_pb_button_module_wrapper > .et_pb_button.lo-btn-inline-left) > :not(.et_pb_button_module_wrapper) {
        white-space: normal;
    }
    body #page-container .et_pb_button_module_wrapper:has(> .et_pb_button.lo-btn-inline-left) {
        display: inline-block !important;
        vertical-align: top;
        text-align: left !important;
    }
    body #page-container .et_pb_button_module_wrapper:has(> .et_pb_button.lo-btn-inline-left) + .et_pb_button_module_wrapper:has(> .et_pb_button.lo-btn-inline-left) {
        margin-left: 15px !important;
    }
}

@media (max-width: 980px) {
    body #page-container .et_pb_column:has(> .et_pb_button_module_wrapper > .et_pb_button.lo-btn-inline-left) {
        white-space: normal;
    }
    body #page-container .et_pb_button_module_wrapper:has(> .et_pb_button.lo-btn-inline-left) {
        display: block !important;
        width: auto;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/* Existing centred multi-button groups remain supported independently. */
body #page-container .lo-btn-row-center {
    text-align: center !important;
}
body #page-container .lo-btn-row-center .et_pb_button_module_wrapper:has(+ .et_pb_button_module_wrapper),
body #page-container .lo-btn-row-center .et_pb_button_module_wrapper + .et_pb_button_module_wrapper {
    display: inline-block;
    vertical-align: top;
}
body #page-container .lo-btn-row-center .et_pb_button_module_wrapper:has(+ .et_pb_button_module_wrapper) {
    margin-right: 15px !important;
}

/* ---------------------------------------------------------------------------
   TRAILER PLAYER  -  .lo-trailer
   Wraps the native <audio> element used for the Stay Write Podcast trailer.
   A native audio element has no Divi module settings to style it through,
   which is why this needs CSS. color-scheme:dark makes the browser draw its
   own control bar in dark tones so it sits on the black hero instead of
   glowing light grey.

   The controls attribute stays ON deliberately. Audio that starts on its own
   must have a visible way to stop it (WCAG 2.1 SC 1.4.2) - do not hide this
   player to make the autoplay less obvious.

   Alignment is inherited from the column, so this sits under the hero buttons
   and follows whichever .lo-btn-row modifier that column carries.
   --------------------------------------------------------------------------- */
.lo-trailer {
    margin-top: 30px;
}
.lo-trailer-label {
    font-family: 'Oswald', Helvetica, Arial, sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #C4982E;
    margin: 0 0 10px;
    padding: 0;
}
.lo-trailer-audio {
    display: inline-block;
    vertical-align: middle;
    width: 100%;
    max-width: 420px;
    height: 40px;
    color-scheme: dark;
}

/* ---------------------------------------------------------------------------
   MEDIA SLOT  -  .lo-media-slot
   A reserved, labelled placeholder for a photograph from the blueprint's
   Final Image Library Production List (Blueprint Section 8).

   These are NOT decorative and NOT filler. Blueprint 8.2 explicitly forbids
   stock and "generic AI-looking images", so the slot names the exact shot that
   belongs there and cites the spec, ready for Linda's Media Day (8.12).

   Put .lo-media-strip on the SECTION and .lo-media-slot on a text module.
   When the real photo arrives, replace the text module with a Divi Image
   module and delete the slot - do not style photos with this class.
   --------------------------------------------------------------------------- */
body #page-container .lo-media-slot {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 260px;
    padding: 28px 22px;
    border: 1px dashed rgba(196, 152, 46, .45);
    border-radius: 2px;
    background: rgba(196, 152, 46, .035);
}
body #page-container .lo-media-slot .lo-slot-num {
    display: block;
    font-family: 'Oswald', Helvetica, Arial, sans-serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: #C4982E;
    margin-bottom: 10px;
}
body #page-container .lo-media-slot .lo-slot-title {
    display: block;
    font-family: 'Oswald', Helvetica, Arial, sans-serif;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #F5F1EA;
    line-height: 1.2;
    margin-bottom: 12px;
}
body #page-container .lo-media-slot .lo-slot-note {
    display: block;
    font-family: 'Jost', Helvetica, Arial, sans-serif;
    font-size: 13px;
    line-height: 1.5;
    color: rgba(184, 178, 168, .85);
    max-width: 260px;
}
@media (max-width: 980px) {
    body #page-container .lo-media-slot { min-height: 200px; }
}


/* ---------------------------------------------------------------------------
   OFFER CARD IMAGE SLOT - .lo-card-media
   The compact sibling of .lo-media-slot. Sits as the FIRST module inside an
   offer card column and bleeds to the card edge by cancelling the column's
   own padding, so the placeholder occupies exactly the frame the real photo
   will occupy. Two variants because the two card grids differ:
     .lo-cm-light - cream cards (Home 7954), column padding 30px|26px
     .lo-cm-dark  - dark cards  (Ways We Can Work Together 7967), 30px|28px
   Same rule as .lo-media-slot: when the photo arrives, replace the text
   module with a Divi Image module and delete the slot.
   --------------------------------------------------------------------------- */
body #page-container .lo-card-media {
    --cm-x: 26px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    padding: 16px 14px;
    margin: -30px calc(-1 * var(--cm-x)) 22px !important;
    border-bottom: 1px dashed rgba(196, 152, 46, .45);
    border-radius: 4px 4px 0 0;
    background: rgba(196, 152, 46, .06);
}
body #page-container .lo-card-media .lo-cm-num {
    display: block;
    font-family: 'Oswald', Helvetica, Arial, sans-serif;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: #C4982E;
    margin-bottom: 8px;
}
body #page-container .lo-card-media .lo-cm-title {
    display: block;
    font-family: 'Oswald', Helvetica, Arial, sans-serif;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: .04em;
    line-height: 1.25;
    text-transform: uppercase;
}
body #page-container .lo-card-media.lo-cm-light { --cm-x: 26px; }
body #page-container .lo-card-media.lo-cm-light .lo-cm-title { color: #1A1A1A; }
body #page-container .lo-card-media.lo-cm-dark { --cm-x: 28px; }
body #page-container .lo-card-media.lo-cm-dark .lo-cm-title { color: #F5F1EA; }
@media (max-width: 980px) {
    body #page-container .lo-card-media { aspect-ratio: 16 / 9; }
}

/* Podcast card variant - column padding is 34px|32px, not 30px|28px */
body #page-container .lo-card-media.lo-cm-pod {
    --cm-x: 32px;
    margin: -34px calc(-1 * var(--cm-x)) 22px !important;
}
body #page-container .lo-card-media.lo-cm-pod .lo-cm-title { color: #F5F1EA; }

/* Inset card variant - Featured Projects cards on the Home page already carry
   contained images (4px radius, sitting above the title, no bleed), so their
   placeholders must match that treatment rather than bleeding to the card edge. */
body #page-container .lo-card-media.lo-cm-inset {
    aspect-ratio: 16 / 9;
    margin: 0 0 20px !important;
    border: 1px dashed rgba(196, 152, 46, .45);
    border-radius: 4px;
}
body #page-container .lo-card-media.lo-cm-inset .lo-cm-title { color: #F5F1EA; }

/* Read more as a gold button. Same gradient, casing and tracking as .btn-gold,
   stepped down to card scale (13px / 11px 22px) so it sits inside a 285px card
   without wrapping. .more-link is deliberately excluded from the gradient-text
   group above - a button label needs a solid fill, not a transparent one. */
body #page-container .et_pb_blog_grid .more-link,
body #page-container .et_pb_posts .more-link,
body #page-container .et_pb_post .more-link,
body #page-container #left-area .more-link {
    display: inline-block;
    margin-top: 6px;
    padding: 11px 22px;
    background-color: #C4982E;
    background-image: linear-gradient(90deg, #f8e0a1 0%, #c69327 26%, #f4ca5d 41%, #864604 87%, #f0b519 100%);
    color: #0A0A0A !important;
    -webkit-text-fill-color: #0A0A0A !important;
    font-family: 'Oswald', Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1;
    border: 0;
    border-radius: 0;
    transition: background-image .3s ease;
}
body #page-container .et_pb_blog_grid .more-link:hover,
body #page-container .et_pb_posts .more-link:hover,
body #page-container .et_pb_post .more-link:hover,
body #page-container #left-area .more-link:hover {
    background-image: linear-gradient(90deg, #f8e0a1 0%, #f4ca5d 30%, #f8e0a1 55%, #f0b519 100%);
    color: #0A0A0A !important;
    -webkit-text-fill-color: #0A0A0A !important;
}

/* Single post meta. The Divi Theme Builder body template renders the post title
   through a Post Title module; when its meta is switched on, Divi outputs
   .et_pb_title_meta_container. These rules make that line the same gradient gold
   as the Journal list, so the styling is already correct the moment it is enabled. */
body.single-post #page-container .et_pb_title_meta_container,
body.single-post #page-container .et_pb_post_title .et_pb_title_meta_container {
    background: linear-gradient(90deg, #f8e0a1 0%, #c69327 30%, #f4ca5d 62%, #f0b519 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
}
body.single-post #page-container .et_pb_title_meta_container a,
body.single-post #page-container .et_pb_title_meta_container span {
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
}


/* ============================================================
   CLASSIC (NON-BUILDER) SINGLE POSTS
   59 of the 74 posts predate the Divi builder. Their raw content is dropped
   straight into the fullwidth post-content module with no width, no padding
   and no type treatment, so a poem ran edge to edge from x=0 at 1520px.
   Everything below targets DIRECT children of the post-content module.
   Builder posts wrap their whole layout in a single .et-l div and therefore
   have zero direct text children — they are untouched by every rule here.
   ============================================================ */
body.single-post .et_pb_fullwidth_post_content > p,
body.single-post .et_pb_fullwidth_post_content > h1,
body.single-post .et_pb_fullwidth_post_content > h2,
body.single-post .et_pb_fullwidth_post_content > h3,
body.single-post .et_pb_fullwidth_post_content > h4,
body.single-post .et_pb_fullwidth_post_content > h5,
body.single-post .et_pb_fullwidth_post_content > ul,
body.single-post .et_pb_fullwidth_post_content > ol,
body.single-post .et_pb_fullwidth_post_content > blockquote,
body.single-post .et_pb_fullwidth_post_content > figure,
body.single-post .et_pb_fullwidth_post_content > img,
body.single-post .et_pb_fullwidth_post_content > iframe,
body.single-post .et_pb_fullwidth_post_content > pre,
body.single-post .et_pb_fullwidth_post_content > table,
body.single-post .et_pb_fullwidth_post_content > hr,
body.single-post .et_pb_fullwidth_post_content > .wp-block-audio,
body.single-post .et_pb_fullwidth_post_content > .wp-block-image,
body.single-post .et_pb_fullwidth_post_content > .wp-block-embed,
body.single-post .et_pb_fullwidth_post_content > .wp-block-quote,
body.single-post .et_pb_fullwidth_post_content > .wp-block-gallery{width:min(760px, calc(100% - 48px));max-width:none;margin-left:auto;margin-right:auto}
body.single-post .et_pb_fullwidth_post_content:has(> p){padding-top:110px;padding-bottom:70px}
body.single-post .et_pb_fullwidth_post_content > p{font-family:Jost, Helvetica, Arial, sans-serif;font-size:17px;line-height:1.85;color:rgba(245,241,234,.82);margin-top:0;margin-bottom:20px}
body.single-post .et_pb_fullwidth_post_content > h1,
body.single-post .et_pb_fullwidth_post_content > h2,
body.single-post .et_pb_fullwidth_post_content > h3,
body.single-post .et_pb_fullwidth_post_content > h4{font-family:Oswald, Helvetica, Arial, sans-serif;font-weight:600;letter-spacing:.02em;color:#F5F1EA;margin-top:34px;margin-bottom:14px;line-height:1.2}
body.single-post .et_pb_fullwidth_post_content > h1{font-size:38px}
body.single-post .et_pb_fullwidth_post_content > h2{font-size:30px}
body.single-post .et_pb_fullwidth_post_content > h3{font-size:24px}
body.single-post .et_pb_fullwidth_post_content > h4{font-size:20px}
body.single-post .et_pb_fullwidth_post_content > ul,
body.single-post .et_pb_fullwidth_post_content > ol{font-family:Jost, Helvetica, Arial, sans-serif;font-size:17px;line-height:1.85;color:rgba(245,241,234,.82);margin-bottom:20px;padding-left:22px}
body.single-post .et_pb_fullwidth_post_content > ul li::marker,
body.single-post .et_pb_fullwidth_post_content > ol li::marker{color:#C4982E}
body.single-post .et_pb_fullwidth_post_content > blockquote{border-left:2px solid #C4982E;padding:4px 0 4px 22px;margin-bottom:24px;font-style:italic;color:#F5F1EA}
body.single-post .et_pb_fullwidth_post_content > figure,
body.single-post .et_pb_fullwidth_post_content > .wp-block-image,
body.single-post .et_pb_fullwidth_post_content > .wp-block-audio,
body.single-post .et_pb_fullwidth_post_content > .wp-block-embed{margin-bottom:28px}
body.single-post .et_pb_fullwidth_post_content > figure img,
body.single-post .et_pb_fullwidth_post_content > .wp-block-image img{width:100%;height:auto;border-radius:2px}
body.single-post .et_pb_fullwidth_post_content > .wp-block-audio audio{width:100%}
body.single-post .et_pb_fullwidth_post_content > hr{border:0;border-top:1px solid rgba(196,152,46,.28);margin:38px auto}
body.single-post .et_pb_fullwidth_post_content > p a,
body.single-post .et_pb_fullwidth_post_content > ul a,
body.single-post .et_pb_fullwidth_post_content > ol a{color:#C4982E;text-decoration:underline;text-underline-offset:3px}
@media (max-width:820px){
body.single-post .et_pb_fullwidth_post_content:has(> p){padding-top:96px;padding-bottom:56px}
body.single-post .et_pb_fullwidth_post_content > p,
body.single-post .et_pb_fullwidth_post_content > ul,
body.single-post .et_pb_fullwidth_post_content > ol{font-size:16px}
body.single-post .et_pb_fullwidth_post_content > h1{font-size:30px}
body.single-post .et_pb_fullwidth_post_content > h2{font-size:25px}
body.single-post .et_pb_fullwidth_post_content > h3{font-size:21px}
}

/* Mobile dropdown - match desktop dark panel and gold detail. */
@media (max-width: 980px) {
  #main-header .et_mobile_menu {
    background-color: #0C0C0C !important;
    border: 1px solid rgba(196,152,46,.35) !important;
    border-radius: 3px;
    padding: 12px 0 !important;
    box-shadow: 0 16px 38px rgba(0,0,0,.55);
  }
 #main-header .et_mobile_menu li a {
     /*color: #F5F1EA;
    background-color: transparent !important;
    border-bottom: 1px solid rgba(196,152,46,.16);*/
    padding: 10px 18px !important;
  }
  #main-header .et_mobile_menu li:last-child > a {
    border-bottom: 0;
  }
  /*#main-header .et_mobile_menu li.current-menu-item > a,
  #main-header .et_mobile_menu li.current-menu-ancestor > a,
  #main-header .et_mobile_menu li a:hover,
  #main-header .et_mobile_menu li a:focus {
    color: #C4982E !important;
    background-color: rgba(196,152,46,.08) !important;
    opacity: 1;
  }*/
  #main-header .et_mobile_menu li ul {
    background-color: #111111 !important;
    padding-left: 0 !important;
  }
  #main-header .et_mobile_menu li li a {
    /*padding-left: 30px !important;*/
  }
}







/* ============================================================
   STAY WRITE SHOP + REUSABLE DIVI PRODUCT TEMPLATE
   Dynamic WooCommerce feeds keep only image, name and price.
   Product descriptions remain available on individual products.
   ============================================================ */
body.woocommerce-shop #main-content,
body.single-product #main-content,
body.single-product .et-l--body,
body.post-type-archive-product #main-content {
  background: #0A0A0A;
  color: #F5F1EA;
}

/* Product cards: open editorial grid, not hardcoded cards. */
body #page-container .lo-shop-products ul.products,
body.woocommerce-shop #page-container .et_pb_shop ul.products,
body.single-product #page-container .related ul.products,
body.single-product #page-container .upsells ul.products {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 54px 26px;
  margin: 0 !important;
}
body #page-container .lo-shop-products ul.products::before,
body #page-container .lo-shop-products ul.products::after,
body.single-product #page-container .related ul.products::before,
body.single-product #page-container .related ul.products::after,
body.single-product #page-container .upsells ul.products::before,
body.single-product #page-container .upsells ul.products::after {
  display: none;
}
body #page-container .lo-shop-products ul.products li.product,
body.woocommerce-shop #page-container .et_pb_shop ul.products li.product,
body.single-product #page-container .related ul.products li.product,
body.single-product #page-container .upsells ul.products li.product {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0;
  background: transparent;
}
body #page-container .lo-shop-products ul.products li.product a img,
body.woocommerce-shop #page-container .et_pb_shop ul.products li.product a img,
body.single-product #page-container .related ul.products li.product a img,
body.single-product #page-container .upsells ul.products li.product a img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  margin: 0 0 18px !important;
  border: 1px solid rgba(196,152,46,.40);
  border-radius: 0;
  background: #ECE9E4;
  transition: border-color .25s ease, transform .25s ease;
}
body #page-container .lo-shop-products ul.products li.product a:hover img,
body.woocommerce-shop #page-container .et_pb_shop ul.products li.product a:hover img,
body.single-product #page-container .related ul.products li.product a:hover img,
body.single-product #page-container .upsells ul.products li.product a:hover img {
  border-color: #E6BE64;
  transform: translateY(-3px);
}
body #page-container .lo-shop-products .woocommerce-loop-product__title,
body.woocommerce-shop #page-container .et_pb_shop .woocommerce-loop-product__title,
body.single-product #page-container .related .woocommerce-loop-product__title,
body.single-product #page-container .upsells .woocommerce-loop-product__title {
  padding: 0;
  color: #F5F1EA !important;
  font-family: Oswald, Helvetica, Arial, sans-serif;
  font-size: 22px !important;
  font-weight: 500;
  line-height: 1.28;
  letter-spacing: .015em;
}
body #page-container .lo-shop-products ul.products li.product .price,
body.woocommerce-shop #page-container .et_pb_shop ul.products li.product .price,
body.single-product #page-container .related ul.products li.product .price,
body.single-product #page-container .upsells ul.products li.product .price {
  display: block;
  margin-top: 7px;
  color: #E6BE64 !important;
  font-family: Jost, Helvetica, Arial, sans-serif;
  font-size: 18px !important;
  font-weight: 500;
}
body #page-container .et_pb_shop .woocommerce-loop-product__description,
body #page-container .et_pb_woo_related_products .woocommerce-loop-product__description,
body #page-container .et_pb_woo_upsells .woocommerce-loop-product__description,
body.single-product #page-container .related .woocommerce-loop-product__description,
body.single-product #page-container .upsells .woocommerce-loop-product__description {
  display: none !important;
}

/* Reusable All Products template: gallery and purchase column. */
body.single-product #page-container .product_title,
body.single-product #page-container .et_pb_module_inner > h1 {
  color: #F5F1EA;
  font-family: Oswald, Helvetica, Arial, sans-serif;
  font-size: clamp(34px, 4vw, 54px);
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: .01em;
  text-transform: uppercase;
}
body.single-product #page-container div.product p.price,
body.single-product #page-container div.product span.price,
body.single-product #page-container .et_pb_wc_price {
  color: #E6BE64 !important;
  font-family: Jost, Helvetica, Arial, sans-serif;
  font-size: 25px;
  font-weight: 500;
}
body.single-product #page-container div.product div.images .woocommerce-product-gallery__wrapper {
  background: #ECE9E4;
  border: 1px solid rgba(196,152,46,.42);
}
body.single-product #page-container div.product div.images img {
  border-radius: 0;
}
body.single-product #page-container div.product div.images .flex-control-thumbs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-top: 12px;
}
body.single-product #page-container div.product div.images .flex-control-thumbs li {
  width: auto;
  float: none;
}
body.single-product #page-container div.product div.images .flex-control-thumbs img {
  border: 1px solid rgba(196,152,46,.30);
  opacity: .70;
}
body.single-product #page-container div.product div.images .flex-control-thumbs img.flex-active,
body.single-product #page-container div.product div.images .flex-control-thumbs img:hover {
  border-color: #E6BE64;
  opacity: 1;
}
body.single-product #page-container table.variations,
body.single-product #page-container .woocommerce-variation,
body.single-product #page-container .quantity {
  color: #F5F1EA;
  font-family: Jost, Helvetica, Arial, sans-serif;
}
body.single-product #page-container table.variations label {
  color: #F5F1EA;
  font-family: Oswald, Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .09em;
  text-transform: uppercase;
}
body.single-product #page-container table.variations select,
body.single-product #page-container .quantity input.qty {
  min-height: 48px;
  background: #151515;
  color: #F5F1EA;
  border: 1px solid #C4982E;
  border-radius: 0;
  font-family: Jost, Helvetica, Arial, sans-serif;
}
body.single-product #page-container .reset_variations {
  color: #E6BE64;
  font-family: Jost, Helvetica, Arial, sans-serif;
}
body.single-product #page-container button.single_add_to_cart_button,
body.single-product #page-container .single_add_to_cart_button.button.alt {
  min-height: 48px;
  padding: 14px 28px !important;
  background: #D91E4A !important;
  color: #FFFFFF !important;
  border: 1px solid #D91E4A !important;
  border-radius: 0 !important;
  font-family: Oswald, Helvetica, Arial, sans-serif !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: .09em;
  line-height: 1.2 !important;
  text-transform: uppercase;
}
body.single-product #page-container button.single_add_to_cart_button:hover,
body.single-product #page-container .single_add_to_cart_button.button.alt:hover {
  background: #B91840 !important;
  border-color: #B91840 !important;
}
body.single-product #page-container table.variations select:focus-visible,
body.single-product #page-container .quantity input.qty:focus-visible,
body.single-product #page-container button.single_add_to_cart_button:focus-visible {
  outline: 2px solid #E6BE64;
  outline-offset: 3px;
}
body.single-product #page-container .woocommerce-tabs,
body.single-product #page-container .woocommerce-Tabs-panel {
  background: transparent;
  color: rgba(245,241,234,.84);
  font-family: Jost, Helvetica, Arial, sans-serif;
}
body.single-product #page-container .woocommerce-tabs ul.tabs {
  padding: 0;
  border-bottom: 1px solid rgba(196,152,46,.45);
}
body.single-product #page-container .woocommerce-tabs ul.tabs::before {
  border: 0;
}
body.single-product #page-container .woocommerce-tabs ul.tabs li,
body.single-product #page-container .woocommerce-tabs ul.tabs li.active {
  margin: 0 22px 0 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}
body.single-product #page-container .woocommerce-tabs ul.tabs li::before,
body.single-product #page-container .woocommerce-tabs ul.tabs li::after {
  display: none;
}
body.single-product #page-container .woocommerce-tabs ul.tabs li a {
  padding: 13px 0;
  color: rgba(245,241,234,.68);
  font-family: Oswald, Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}
body.single-product #page-container .woocommerce-tabs ul.tabs li.active a {
  color: #F5F1EA;
  border-bottom: 2px solid #E6BE64;
}
body.single-product #page-container .woocommerce-Tabs-panel h2,
body.single-product #page-container .related > h2,
body.single-product #page-container .upsells > h2 {
  color: #F5F1EA;
  font-family: Oswald, Helvetica, Arial, sans-serif;
  font-weight: 600;
  letter-spacing: .02em;
  text-transform: uppercase;
}
body.single-product #page-container .woocommerce-product-attributes th,
body.single-product #page-container .woocommerce-product-attributes td {
  background: transparent;
  color: rgba(245,241,234,.84);
  border-color: rgba(196,152,46,.25);
}

@media (max-width: 980px) {
  body #page-container .lo-shop-products ul.products,
  body.woocommerce-shop #page-container .et_pb_shop ul.products,
  body.single-product #page-container .related ul.products,
  body.single-product #page-container .upsells ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 38px 20px;
  }
}
@media (max-width: 560px) {
  body #page-container .lo-shop-products ul.products,
  body.woocommerce-shop #page-container .et_pb_shop ul.products,
  body.single-product #page-container .related ul.products,
  body.single-product #page-container .upsells ul.products {
    grid-template-columns: 1fr;
    gap: 34px;
  }
  body.single-product #page-container .product_title,
  body.single-product #page-container .et_pb_module_inner > h1 {
    font-size: 34px;
  }
  body.single-product #page-container .woocommerce-tabs ul.tabs li,
  body.single-product #page-container .woocommerce-tabs ul.tabs li.active {
    display: block;
    margin-right: 0;
  }
}



/* Reusable Maytra script font: secure local font source. */
@font-face {
  font-family: "Maytra Secure";
  src: url("https://lindaorji.com/staging/wp-content/uploads/et-fonts/Maytra.otf") format("opentype"),
       url("https://lindaorji.com/staging/wp-content/uploads/et-fonts/Maytra.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

body .lo-font-script,
body .lo-font-script * {
  font-family: "Maytra Secure", cursive !important;
  font-style: normal !important;
  font-weight: 400 !important;
}