/*
Theme Name: Beaver Builder Child Theme
Theme URI: http://www.wpbeaverbuilder.com
Version: 1.0
Description: An example child theme that can be used as a starting point for custom development.
Author: The Beaver Builder Team
Author URI: http://www.fastlinemedia.com
template: bb-theme
*/

/* ====================
   GLOBAL & BASE STYLES
   ==================== */
   

/* Body and Page Background */
body,
.fl-page,
.fl-page-content,
.fl-content-full {
    background: #f9f9f9;
}

.fl-content.col-md-12 {
    padding: 20px;
}

/* Global Link Styles */
:root {
  --link-color: #0074aa;
  --link-hover-color: #51b357;
  --link-border-color: rgba(0, 115, 170, 0.3);
  --link-hover-border-color: rgba(96, 163, 95, 0.7);
}

/* Base link styles - ONLY for text links in content */
.entry-content a,
.archive-description a,
.post-content a,
article a, quote-container2 a,
.content a,
main a {
  color: var(--link-color);
  text-decoration: none;
  border-bottom: 1px dotted var(--link-border-color);
  transition: border-bottom 0.2s, color 0.2s;
  padding-bottom: 1px;
}

/* EXCLUDE images, buttons, and special links from dotted borders */
a img,
a.button,
a.btn,
a[class*="copy"],
.menu a,
nav a,
.logo a,
.site-logo a,
.custom-logo-link,
.show-more,
.best-icon-hover,
a.copy-html-link,
header a,
footer a,
.widget a,
.sidebar a {
  border-bottom: none !important;
  text-decoration: none !important;
  padding-bottom: 0 !important;
}

/* Keep hover colors but remove borders for these */
.menu a:hover,
nav a:hover,
.show-more:hover {
  color: var(--link-hover-color);
  border-bottom: none;
  text-decoration: none;
}

/* Simple color-only styles for navigation and UI elements */
nav a,
.menu a,
header a,
footer a {
  color: inherit;
  transition: color 0.2s;
}

nav a:hover,
.menu a:hover,
header a:hover {
  color: var(--link-hover-color);
}


a.fl-button {
    text-decoration: none !important;
}

/* ====================
   TYPOGRAPHY
   ==================== */

/* Paragraph Margins */
.fl-post-content p {
    margin-bottom: 24px !important;
}

.fl-module-content p {
    margin-bottom: 24px; 
}



/* ====================
   LAYOUT COMPONENTS
   ==================== */

/* Horizontal Rules */
hr.salesletter {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(102, 102, 102, 0.40), rgba(0, 0, 0, 0));
    margin: 50px auto;
}

hr {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(102, 102, 102, 0.40), rgba(0, 0, 0, 0));
}

.shortdivider {
    width: 25px;
    height: 0;
    border-bottom: 2px solid #888888;
    margin: 18px 0px 6px;
}

.shortdivider-green {
    width: 25px;
    height: 0;
    border-bottom: 2px solid #82ab67;
    margin: 10px 0px 6px;
}

/* List Styling */
#fl-main-content .fl-module-content li {
    margin-bottom: 12px;
}

li.cat-item {
    font-size: 14px;
    line-height: 13px;
}

/* ====================
   POST META & NAVIGATION
   ==================== */

div.fl-post-meta.fl-post-meta-top {
    margin: 5px 0px 5px 0px !important;
    text-align: left;
    font-size: 12px;
}

span.fl-post-author {
    color: #666666;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    text-align: left;
}

.nav-links {
    font-size: 14px;
}



/* ====================
   SEARCH COMPONENTS
   ==================== */

/* Search Forms */
div.searchwp-search-form.searchwp-supplemental-search-form input {
    background: #f3f3f3 !important;
    padding: 20px;
    margin: 0px auto;
    font-size: 20px;
    color: #555555;
    font-family: Raleway, sans-serif;
    margin-bottom: 10px;
}

div.searchwp-search-form.searchwp-supplemental-search-form input#searchsubmit {
    display: none;
}

.timt-search input {    
    background: #F5FAF5 !important;
    padding: 40px;
    margin: 0px auto;
    font-size: 20px;
    color: #555555;
    font-family: Raleway, sans-serif;
    margin-bottom: 10px;
}

.timt-search input#searchsubmit {
    display: none;
}

section.searchform input {    
    background: #f8fdfc;
    margin: 0px auto;
    padding: 10px;
    font-size: 20px;
    color: #555555;
    font-family: Raleway, sans-serif;
}

.searchform input#searchsubmit {
    display: none !important;
}

/* SearchWP Specific */
#searchwp-form-1 .swp-input,
#searchwp-form-1 .swp-select {
    border: 1px solid #dddddd;
    border-radius: 5px;
    background-color: #EFF6EF !important;
    padding: 24px !important;
}

#searchwp-form-2 .swp-input,
#searchwp-form-2 .swp-select {
    border: 1px solid #dddddd;
    border-radius: 5px;
    background-color: #EFF6EF !important;
}

.swp-results-template-1 .swp-result-item .entry-title,
.swp-results-template-1 .swp-result-item .entry-title a {
    text-align: left !important;
    display: block !important;
}

.swp-results-template-1 .swp-result-item .entry-title {
    margin-bottom: 5px !important;
}

.swp-results-template-1 .swp-result-item .swp-result-item--desc {
    font-size: 16px !important;
    margin-bottom: 5px !important;
}

.facetwp-search {
    background: #ffffff !important;
}

.swp-search-results h2.entry-title, .swp-search-results h2.entry-title a {
	font-size: 20px !important;
}

.swp-result-item {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    margin-bottom: 8px !important;
}

button.swp-button.swp-load-more-button {
	background: #4caf50 !important;
	border: none;
}

button.swp-button.swp-load-more-button:hover {
	color: #ffffff !important;
	border: none;
}

/* ====================
   MENUS & NAVIGATION
   ==================== */

.fl-menu .fl-menu-responsive-toggle-mobile {
    font-size: 14px;
    line-height: 13px;
}

.fl-page-nav-search a.fa-search {
    color: #82c141 !important;
}

.fl-page-nav-search a.fa-search:hover {
    color: #ffffff !important;
}

.button.searchwp-modal-form-trigger-el.nav-search {
    background-color: #ff6155;
    color: #ffffff;
    border: none;
}

.button.searchwp-modal-form-trigger-el.nav-search:hover {
    background-color: #4caf50;
}

/* ====================
   TABS
   ==================== */

.tab-tags h2.widgettitle {
    display: none;
}

.tab-outline a:focus {
    outline: none !important;
}

.tab-outline button:focus {
    outline: 0 !important;
}

.fl-tabs-label {
	border-bottom: 1px solid #f7f9fc !important;
}

/* Beaver Builder Tabs */
.fl-tabs-label {
    border-right: 2px solid #ffffff !important;
}

.fl-tabs-label:hover {
    background-color: #dde6f3 !important;
}

.fl-tabs-label:focus {
    outline: none !important;
}

.fl-tabs.fl-tabs-horizontal .fl-tabs-labels {
    display: flex;
    justify-content: center;
}

.fl-tabs-label.fl-tab-active {
    /*border-top: 2px solid #0073aa !important;*/
    background-color: #ffffff !important;
}


/* ====================
   QUOTES & BLOCKQUOTES
   ==================== */

/* Grid Quotes */
.quote-container2 {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 25px 30px;
    padding-bottom: 30px;
}

.quote-content2 {
    font-style: italic;
    font-size: 17px;
    font-family: Georgia, serif;
    color: #555555;
    position: relative;
    margin-bottom: 8px;
}

.author-terms-container2 {
    margin: -10px 0px 10px 0px;
    text-align: right;
    padding-right: 5px;
}

.author-terms-container2 > span {
    flex: 0 1 auto;
    min-width: 0;
}

.quote-author2, .quote-terms2 {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 13px;
    color: #666;
    display: inline-block;
}

.quote-terms2 {
    margin-left: 5px;
    text-overflow: ellipsis;
    overflow: hidden;
}

.quote-terms2 a {
    color: #0073aa;
    text-decoration: none;
    border-bottom: 1px dotted rgba(0, 115, 170, 0.3);
    transition: border-bottom 0.2s, color 0.2s;
    padding-bottom: 1px;
}

.quote-terms2 a:hover {
    border-bottom: 1px dotted rgba(96, 163, 95, 0.7);
}

.author-terms-container2:last-of-type {
    margin-bottom: 12px;
}

/* Single Quote Page */
.single-quote-description p {
    background-color: #f7f9fc;
    border-left: 4px solid #0073aa;
    padding: 20px;
    font-family: Georgia, serif;
    font-size: 17px;
    font-style: italic;
    line-height: 150%;
}

/* ====================
   ARCHIVE & LISTINGS
   ==================== */

/* Archive Container */
.archive-container {
    box-sizing: border-box !important;
    position: relative;
    width: 100%;
    overflow: visible !important;  /* Changed from hidden to visible */
    background: #ffffff;
    margin: 0px;
    z-index: 1;  /* Add base z-index */
}
.archive-container-inner {
    padding: 24px 30px 30px 30px; /* Your current padding */
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Distributes content nicely */
}

/*.archive-container-inner {
    padding: 24px 20px 40px 20px;
}*/

.archive-bottom-section-inner {
    padding: 0px 20px 35px 20px !important;
}

.archive-container a {
    text-decoration: none;
    border-bottom: 1px dotted rgba(0, 115, 170, 0.3);
    transition: border-bottom 0.2s, color 0.2s;
    padding-bottom: 1px;
}

.archive-container a:hover {
    color: #60a35f !important;
    border-bottom: 1px solid rgba(96, 163, 95, 0.7);
}

/* Archive Badge */
.archive-badge {
    position: absolute;
    top: 0px;
    left: 0px;
    display: inline-block;
    background-color: #f37f73;
    color: #1a0dab !important;
    z-index: 100;
    padding: 10px 15px 12px 10px;
    font-size: 17px;
    line-height: 1rem;
    font-weight: 500;
    box-shadow: 2px 2px 2px 0 rgba(0,0,0,.14);
    margin-bottom: 20px;
}

.archive-badge::after {
    content: " ";
    display: block;
    position: absolute;
    left: -10px;
    bottom: -7px;
    border-color: transparent #c2665c transparent transparent;
    border-style: inset solid inset inset;
    border-width: 0 10px 7px;
    filter: brightness(50%);
}

.archive-badge:hover {
    background: #f5998f;
    text-decoration: none !important;
}

.archive-badge a {
    color: #ffffff;
}

.archive-badge a:hover {
    color: #ffffff;
}

/* Archive Images */
.archive-image img {
    width: 275px;
    height: 135px;
    margin-top: 20px !important;
    max-width: 100%;
    text-decoration: none !important;
    transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
    background: #f1f1f1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.archive-image img:hover {
    opacity: 0.7;
}

.browser-shot.alignnone {
    padding: 0px !important;
    margin: 0px !important;
}

.archive-magazine-image img {
    box-shadow: none !important;
    display: block;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0px;
}

/* Archive Content */
.archive-content {
    padding: 0px 25px 15px 25px;
}

.archive-container p {
    font-size: 14px;
    line-height: 22px;
    color: #222222;
}

.archive-container h3 {
    padding: 11px auto 5px;
    font-size: 18px;
    color: #282828 !important;
    font-weight: 600;
    line-height: 130%;
    margin-top: 2px;
}

.archive-container h3 a {
    color: #111111 !important;
    text-decoration: none;
}

.archive-container h3 a:hover {
    color: #777777 !important;
    text-decoration: none;
}

div.archive-short-description {
    font-size: 18px;
    line-height: 24px;
    font-weight: 500;
    margin: 10px auto 10px !important;
    color: #555555;
}

.archive-description {
    display: block;
    margin: 10px 0px 0px 0px;
}

.archive-description p {
    font-size: 15px !important;
    line-height: 24px !important;
    color: #596675 !important;
}

.archive-description a {
    font-size: 15px;
}

.archive-description ul {
    padding-left: 15px;
    list-style: none;
    margin: 0;
}

.archive-description ul li {
    margin: 0 !important;
    padding: 0 !important;
}

.archive-description ul li a {
    display: inline-block;
    line-height: 1.2;
}

.archive-description ul li marker {
    margin: 0;
    padding: 0;
}

.archive-affiliate-description {
    font-size: 14px !important;
    margin-top: 17px;
}

.archive-description li {
    font-family: Helvetica, sans-serif;
    font-size: 16px !important;
    line-height: 24px !important;
    color: #596675 !important;
}

.archive-best-for {
    font-size: 13px;
    font-family: Helvetica, Arial;
    margin-bottom: 15px;
    margin-top: 20px;
    color: #444444;
    background: #ebfbfb;
    border-top: 1px solid #dddddd;
    padding-top: 5px;
    border-bottom: 1px solid #dddddd;
    padding-bottom: 5px;
    padding-left: 10px;
    padding-right: 10px;
}

.archive-reviews {
    font-size: 14px;
    font-family: Helvetica, Arial;
    margin-bottom: 15px;
    color: #666666;
}

.archive-meta-bottom {
    font-size: 13px;
    font-family: Helvetica, Arial;
    line-height: 140%;
    margin-top: 5px;
    color: #666666;
    padding-bottom: 5px;
    display: block !important;
    width: 100%;
    clear: both;
    border-bottom: none !important;
}

/* Archive Buttons */
.archive-button-container {
    margin: 15px auto 15px;
    text-align: center;
}

.archive-button {
    display: inline-block;
    background: #6296ec;
    padding: 10px 10px;
    font-size: 18px;
    color: #ffffff;
    border-radius: 6px;
    font-family: Helvetica, Arial, sans-serif;
    font-weight: 600;
    margin: 0px auto;
    text-decoration: none;
    text-align: center;
}

.archive-button:hover {
    background: #444444;
    color: #444444 !important;
}

.archive-button a {
    color: #ffffff;
}

.archive-button a:hover {
    color: #ffffff;
    text-decoration: none !important;
}

/* Archive Single Line Titles */
h3.archive2-title {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 20px;
    color: #222222;
    border-bottom: 1px dotted #cccccc;
    margin: 0px;
    padding-bottom: 5px;
    font-weight: 400;
}

h3.archive2-title a {
    color: #004668 !important;
}

h3.archive2-title a:hover {
    color: #0CC1CE !important;
}

/* ====================
   SINGLE POST STYLES
   ==================== */

.single-container {
    box-sizing: border-box !important;
    padding: 5px 15px 0px 20px;
    position: relative;
    width: 100%;
    background: #ffffff;
    overflow: hidden !important;
}

.single-image img {
    text-decoration: none !important;
    transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
    max-width: 100%;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.4);
}

.single-image img:hover {
    opacity: 0.7;
}

.single-magazine-image img {
    box-shadow: none !important;
}

.single-container h3 {
    margin-bottom: 15px;
    font-size: 20px !important;
    color: #333333 !important;
    font-family: Helvetica, sans-serif;
    font-weight: 600;
    line-height: 120%;
}

.single-container h3 a {
    color: #0073aa !important;
    text-decoration: none !important;
}

.single-container h3 a:hover {
    color: #4caf50 !important;
    text-decoration: none !important;
}

.single-container a {
    color: #0073aa;
    text-decoration: none;
    border-bottom: 1px dotted rgba(0, 115, 170, 0.3);
    transition: border-bottom 0.2s, color 0.2s;
    padding-bottom: 1px;
}

.single-container a:hover {
    color: #60a35f;
    border-bottom: 1px dotted rgba(96, 163, 95, 0.7);
}

.single-container h4 {
    margin-bottom: 0px !important;
    font-size: 20px;
    color: #666666 !important;
    font-family: Helvetica, sans-serif;
    font-weight: 600;
    line-height: 120%;
    border-top: 1px dashed #cccccc;
    padding-top: 9px;
}

.single-content-container {
    margin: 13px 10px 5px 10px;
}

.single-short-description p {
    font-size: 15px;
    line-height: 24px !important;
    margin: 18px 0px;
    color: #444444;
    font-style: normal;
}

.single-short-description ul {
    padding-left: 0px;
    list-style: none;
    margin: 0;
}

.single-short-description ul li {
    margin: 0 !important;
    padding: 0 !important;
}

.single-short-description ul li a {
    display: inline-block;
    line-height: 1.2;
    font-size: 16px;
}

.single-short-description ul li marker {
    margin: 0;
    padding: 0;
}

.single-best-for {
    font-size: 14px;
    font-family: Helvetica, Arial;
    margin-bottom: 15px;
    margin-top: 2px;
    color: #444444;
    background: #ebfbfb;
    border-top: 1px solid #dddddd;
    padding-top: 5px;
    border-bottom: 1px solid #dddddd;
    padding-bottom: 5px;
    padding-left: 10px;
    padding-right: 10px;
}

.single-long-description {
    display: block;
    font-family: Verdana, sans-serif;
    font-size: 16px !important;
    line-height: 24px !important;
    color: #222222 !important;
}

.single-long-description h4 {
    padding-bottom: 20px;
}

.single-reviews {
    font-size: 14px;
    font-family: Helvetica, Arial;
    margin-bottom: 15px;
    margin-top: 20px;
    color: #666666;
}

.single-meta-bottom {
    font-size: 13px;
    font-family: Helvetica, Arial;
    line-height: 120%;
    margin-top: 20px;
    color: #666666;
    border-top: 1px solid #dddddd;
    padding-top: 5px;
    padding-bottom: 20px;
}

h4.single-interview {
    font-family: Helvetica, Arial;
    font-weight: bold;
}

.selectalltext {
    font-size: 13px;
    font-family: Helvetica, Arial;
    margin-top: 10px;
    color: #D06B5D;
    padding-top: 5px;
    padding-bottom: 2px;
}

/* Single Post Buttons */
#single-button-container {
    margin: 25px auto 15px;
    text-align: center;
}

.single-button {
    display: inline-block;
    background: #5D8CDD;
    padding: 10px 10px;
    font-size: 22px;
    color: #ffffff;
    border-radius: 6px;
    font-family: Helvetica, Arial, sans-serif;
    font-weight: 600;
    margin: 0px auto;
    text-decoration: none;
    text-align: center;
}

.single-button:hover {
    background: #333333;
    color: #ffffff;
}

.single-button a {
    color: #ffffff;
}

.single-button a:hover {
    color: #ffffff;
    text-decoration: none !important;
}

#single-button-insert-container {
    margin: 10px auto 15px;
    text-align: center;
}

.single-button-insert {
    display: inline-block;
    background: #ED768D;
    padding: 10px 10px;
    font-size: 17px;
    color: #ffffff;
    border-radius: 6px;
    font-family: Helvetica, Arial, sans-serif;
    font-weight: 600;
    margin: 0px auto;
    text-decoration: none;
    text-align: center;
}

.single-button-insert:hover {
    background: #333333;
    color: #ffffff;
}

.single-button-insert a {
    color: #ffffff;
}

.single-button-insert a:hover {
    color: #ffffff;
    text-decoration: none !important;
}

.single-instructions {
    background: #e7f9fa;
    padding: 15px;
    font-size: 14px;
    font-family: Helvetica, Arial;
    margin: 20px auto 15px;
}

.single-instructions2 {
    background: #e7f9fa;
    padding: 15px;
    font-size: 16px;
    font-family: Helvetica, Arial;
    margin: 0px auto 15px;
}

/* Show More Buttons */
.archive-container .show-more,
a.show-more {
    color: #444444;
	  font-family: Helvetica, Arial, sans-serif;
    border: none;
    padding: 8px 0px 10px 0px;
    cursor: pointer;
    border-radius: 3px;
    font-size: 13px;
    font-weight: 500;
    transition: background-color 0.2s ease, transform 0.1s ease;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.archive-container .show-more:hover,
.archive-container .show-more:focus,
.archive-container .show-more:active,
a.show-more:hover,
a.show-more:focus,
a.show-more:active {
    color: #4caf50 !important;
    text-decoration: none !important;
}

.entry-content a.show-more:hover,
.site-content a.show-more:hover,
.content-area a.show-more:hover,
.post-content a.show-more:hover,
#content a.show-more:hover,
article a.show-more:hover,
main a.show-more:hover {
    color: #ffffff !important;
    text-decoration: none !important;
}

.show-more i {
    margin-left: 0.5rem;
}


/* ====================
   NEWS LAYOUT
   ==================== */

/* Archive Container */
.news-container {
    box-sizing: border-box !important;
	  background: #ffffff;
	border-bottom: 1px solid #dddddd;
    position: relative;
	padding: 20px 30px;
    width: 100%;
    overflow: visible !important;  /* Changed from hidden to visible */
    background: #ffffff;
    margin: 0px;
    z-index: 1;
}

.news-container h3 {
	font-size: 17px;
	font-weight: bold;
	line-height: 24px;
}

.news-description {
	font-size: 15px;
	line-height: 20px;
	color: #222222;
}

.news-link {
	font-size: 14px;

}

.news-archive-container .occ-modal-trigger {
    display: inline;
    background: none !important;
    border: none !important;
    border-radius: 0;
    color: #0073aa;
    font-size: 14px;
    font-weight: 400;
    padding: 0;
    transform: none;
}
.news-archive-container .occ-modal-trigger:hover {
    background: none !important;
    border: none !important;
    color: #005177;
    text-decoration: underline !important;
    transform: none;
}


/* Copy HTML Link Buttons */
.item .copy-html-link {
    background-color: #ffffff !important;
    margin: 5px 0px 8px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition: box-shadow 0.2s ease;
    display: block;
    width: 100%; /* Take full width of container */
    max-width: 220px; /* But don't get too wide */
    min-width: 160px; /* And don't get too narrow */
    padding: 7px 8px;
    color: #28a745 !important;
    font-weight: normal;
    text-align: center !important;
    font-size: 13px;
    font-family: Helvetica, Arial, sans-serif;
    text-decoration: none;
    box-sizing: border-box;
}

/* For very small containers, allow smaller buttons */
@media (max-width: 300px) {
    .item .copy-html-link {
        min-width: 120px;
        font-size: 12px;
    }
}

.item .copy-html-link:hover {
    color: #282828 !important;
    border-bottom: 1px dotted rgba(96, 163, 95, 0.7);
    background-color: #f8f9fa !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.item .copy-html-link[style*="background-color"] {
    background-color: transparent !important;
    color: #2e7d32 !important;
}

.item {
    display: flex;
    justify-content: center;
    align-items: center;
}

.copy-buttons-container {
    display: grid;
    grid-template-columns: 1fr 1fr; /* Two equal columns */
    gap: 10px;
    margin: 10px 0;
}


/* ====================
   FACET WP & FILTERING
   ==================== */

.facetwp-display-value {
    font-size: 15px;
}

.facetwp-counter {
    font-size: 15px;
}

.facetwp-dropdown, fs-wrap.multiple {
    margin-right: 10px !important;
    min-width: 270px;
}

select.facetwp-dropdown {
    background-color: #FFFFFF;
    border: thin solid #dddddd;
    border-radius: 4px;
    display: inline-block;
    font: Helvetica, Arial, sans-serif;
    font-size: 14px;
    padding: 10px;
    background-image:
        linear-gradient(45deg, transparent 50%, gray 50%),
        linear-gradient(135deg, gray 50%, transparent 50%),
        radial-gradient(#ddd 70%, transparent 72%);
    background-position:
        calc(100% - 20px) calc(1em + 2px),
        calc(100% - 15px) calc(1em + 2px),
        calc(100% - .5em) .5em;
    background-size:
        5px 5px,
        5px 5px,
        1.5em 1.5em;
    background-repeat: no-repeat;
    margin: 5px 15px 0px 0px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
}

select.facetwp-dropdown:focus {
    background-image:
        linear-gradient(45deg, white 50%, transparent 50%),
        linear-gradient(135deg, transparent 50%, white 50%),
        radial-gradient(gray 70%, transparent 72%);
    background-position:
        calc(100% - 15px) 1em,
        calc(100% - 20px) 1em,
        calc(100% - .5em) .5em;
    background-size:
        5px 5px,
        5px 5px,
        1.5em 1.5em;
    background-repeat: no-repeat;
    border-color: #dddddd;
    outline: 0;
}

/* FacetWP Margins */
.facetwp-facet.facetwp-type-dropdown {
    margin-bottom: 0px !important;
}

.facetwp-facet.facetwp-type-search {
    margin-bottom: 0px !important;
}

.facetwp-facet.facetwp-type-reset {
    margin-bottom: 0px !important;
}

.facetwp-facet.facetwp-type-checkboxes {
    margin-bottom: 0px !important;
}

.facetwp-facet.facetwp-facet-page_counter_results.facetwp-type-pager {
    margin-bottom: 0px !important;
    margin-top: 0px !important;
}

.facetwp-facet.facetwp-facet-page_numbers.facetwp-type-pager {
    margin-bottom: 0px !important;
}

.facetwp-facet.facetwp-type-fselect {
    margin-bottom: 0px !important;
}

/* FacetWP Pagination */
.facetwp-page {
    border: 1px solid #dddddd;
    padding: 4px 8px !important;
    color: #444444;
    font-size: 14px;
    font-family: Helvetica, Arial, sans-serif;
}

.facetwp-page.first.active {
    background: #ffffff !important;
} 

.facetwp-page.active {
    background: #ffffff !important;
} 

.facetwp-page.inactive {
    background: #ffffff !important;
} 

.facetwp-page:hover {
    background: #ffffff;
}

/* FacetWP Reset Button */
button.facetwp-reset.facetwp-hide-empty {
    background: #0073aa;
    border: none;
    color: #ffffff;
}

button.facetwp-reset.facetwp-hide-empty:hover {
    background: #4caf50;
    border: none;
}

.facet-selections {
    text-transform: capitalize;
    font-weight: 600 !important;
}

/* FacetWP Alphabet */
.facetwp-alpha {
    color: #0073aa !important;
}

.facetwp-alpha:hover {
    color: #60a35f !important;
}

.oneline-block {
    display: inline-block;
    vertical-align: middle;
}

/* ====================
   GLOSSARY
   ==================== */

.glossary-container {
    background-color: #fff;
    border-bottom: 1px solid #eee;
	border-left: 8px solid #51b357;
    padding: 20px 35px;
    margin: 0px 0px;
}

.glossary-container:last-child {
    border-bottom: none;
}

.glossary-container h3 {
    font-size: 21px;
    font-weight: 600;
    color: #333;
    margin: 0 0 5px 0;
    padding: 0;
}

.glossary-description {
    font-size: 15px;
    line-height: 1.6;
    color: #555;
    margin-bottom: 15px;
}

.glossary-meta {
    font-size: 13px;
    color: #666;
    line-height: 1.6;
}

.glossary-meta a {
    color: #0073aa;
    text-decoration: none;
    border-bottom: 1px dotted rgba(0, 115, 170, 0.3);
    transition: border-bottom 0.2s, color 0.2s;
    padding-bottom: 1px;
}

.glossary-meta a:hover {
    color: #60a35f;
    border-bottom: 1px dotted rgba(96, 163, 95, 0.7);
}

.glossary-meta .copy-html-link {
    color: #4CAF50;
    font-weight: 500;
}

.glossary-meta .copy-html-link:hover {
    color: #388E3C;
    background-color: none;
}

.glossary-meta .copy-html-link i {
    margin-right: 5px;
}

.glossary-meta .copy-html-link[style*="background-color"] {
    background-color: transparent !important;
    color: #2e7d32 !important;
}



/* ====================
   WIDGET CLEARFIX (Global)
   This replaces all the individual widget clearfix CSS
   ==================== */
.widget {
    clear: both;
    margin-bottom: 20px;
    overflow: visible;
    display: block;
}

.fl-widget-content {
    overflow: visible !important;
}

.fl-widget {
    overflow: visible !important;
}


/* ====================
   ARCHIVE SECTIONS
   ==================== */

.from-the-archives {
    background-color: #ffffff;
    padding: 15px;
    border: 1px solid #dddddd;
    margin: 20px 0px 10px 0px !important;
}

.from-the-archives h3 {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 17px;
    color: #222222;
    font-weight: bold;
    line-height: 120%;
}

.from-the-archives a {
    color: #0073aa;
	font-size: 14px;
    text-decoration: none;
    border-bottom: 1px dotted rgba(0, 115, 170, 0.3);
    transition: border-bottom 0.2s, color 0.2s;
    padding-bottom: 1px;
}

.from-the-archives a:hover {
    color: #60a35f;
    border-bottom: 1px dotted rgba(96, 163, 95, 0.7);
}

p.archives-description {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 14px;
    color: #555555;
    line-height: 120%;
}

div.archive-item.archive-tools h4 {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 120% !important;
    font-weight: normal;
}

div.archive-item.archive-tools h4 a {
    color: #0073aa;
    text-decoration: none;
}

div.archive-item.archive-tools h4 a:hover {
    color: #4caf50;
}

div.archive-item.archive-best h4 {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 120% !important;
    font-weight: normal;
}

div.archive-item.archive-best h4 a {
    color: #0073aa;
    text-decoration: none;
}

div.archive-item.archive-best h4 a:hover {
    color: #4caf50;
}

div.archive-item.archive-quotes h4 {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 120% !important;
    font-weight: normal;
}

div.archive-item.archive-quotes h4 a {
    color: #0073aa;
    text-decoration: none;
}

div.archive-item.archive-quotes h4 a:hover {
    color: #4caf50;
}

/* ===================
 ARTICLES DIRECTORY STYLES
=================*/
.articles-container {
    box-sizing: border-box !important;
    position: relative;
    width: 100%;
    overflow: visible !important;
    background: #ffffff;
    margin: 0px;
    z-index: 1;
}


.article-entry {
    padding-bottom: 5px; /* Increase this - was 20px */
    margin-bottom: 10px;
    border-bottom: 1px solid #e5e5e5;
}

.article-title {
    font-size: 16px;
    color: #131313;
    font-weight: 600;
    line-height: 140%;
	  padding-top: 15px;
}

.article-title a {
    color: #111111;
    text-decoration: none;
}

.article-title a:hover {
    color: #777777;
}


.top-copied-items {
    margin: 20px 0px 10px 0px !important;
    background-color: #ffffff;
    border: 1px solid #dddddd;
    padding: 15px;
}
        
.top-copied-items h3 {
    margin-bottom: 10px;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 17px;
    color: #555555;
}
        
.top-copied-list {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
}
        
.top-copied-list li {
    padding: 5px 0;
    border-bottom: 1px solid #eee;
    margin-bottom: 5px;
    font-size: 13px;
    line-height: 120%;
    color: #555555;
}
        
.top-copied-list .copy-count {
    color: #666;
    font-size: 0.9em;
}



/* ====================
   CONTENT SPECIFIC
   ==================== */

.prompt-content {
    display: block;
    font-size: 14px !important;
    line-height: 22px !important;
    color: #596675 !important;
}

.prompt-content p {
    font-size: 14px !important;
    line-height: 20px !important;
    color: #596675 !important;
}

.honorable-mention {
    display: inline-block !important;
    font-size: 15px;
    color: #666666;
    padding: 20px 30px 20px 30px;
    border-top: 3px dotted #dddddd;
    background: #faf0ef;
    width: 100%;
    border-radius: 0px 0px 10px 10px;
}

div.pdfjs-fullscreen {
    margin-bottom: 30px !important;
    font-size: 12px !important;
}

.tabs-content-container {
    padding: 20px 40px 30px 40px;
}

/* ====================
   CUSTOM SIDEBARS
   ==================== */

.widget_custom_html h3.widget-title {
    font-size: 18px !important;
}

#customsidebar h3.widget-title {
    font-size: 18px !important;
    color: #444444;
    margin: 20px auto 10px !important;
}

#customsidebar .widget.dwqa-widget.dwqa-latest-questions {
    font-size: 14px;
}

#customsidebar ul {
    padding: 0px 0px 0px 10px;
    list-style-type: none; 
}

#customsidebar ul a:hover {
    text-decoration: underline;
}

/* ====================
   HIDDEN CONTENT
   ==================== */

.hidden-content {
    width: 100%;
    max-width: 100%;
    overflow: visible;
    z-index: 1;
    margin-top: 0px !important;
    margin-bottom: 15px;
	  padding: 0px;
}

.item .hidden-content[style*="display: block"] {
    display: block !important;
    width: 100%;
    clear: both;
    border-top: none !important;
}

/* ====================
   COPY NOTIFICATIONS
   ==================== */

.copy-notification {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background-color: #0073aa;
    color: white;
    padding: 10px;
    border-radius: 5px;
    transition: opacity 0.3s, transform 0.3s;
    z-index: 1000;
    opacity: 0;
    transform: translateY(10px);
}

.copy-notification.show {
    opacity: 1;
    transform: translateY(0);
}

.copy-notification.hidden {
    display: none;
}

.copy-notification.error {
    background-color: #F44336;
}

.copy-notification.fade-out {
    opacity: 0;
    transform: translateY(10px);
}

@keyframes fadeOut {
    from { opacity: 1; }
    to { opacity: 0; }
}
  
.fade-out {
    animation: fadeOut 1s ease-out forwards;
}

/* ====================
   ADVANCED ADS
   ==================== */

.pp-content-grid-ad-space {
    height: auto !important;
    overflow: visible !important;
    padding: 15px;
    margin-bottom: 20px;
    text-align: center;
    background: #f7f7f7;
    border-radius: 4px;
}

.pp-content-grid-ad-space img {
    max-width: 100%;
    height: auto !important;
    object-fit: contain;
}

.pp-content-grid-item {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.pp-content-grid-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(0,0,0,0.08);
}

.pp-content-grid-post {
  margin-bottom: 28px;
}

.pp-content-grid-post {
  position: relative;
}


/* OCC directory card category and New pills */

.occ-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 14px;
	flex-wrap: nowrap;
}

.occ-card-top2 {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 15px;
  margin-bottom: 14px;
  flex-wrap: nowrap;
}

.occ-card-top2 .occ-new-chip {
  margin-left: auto;
}

.occ-category-pill {
  display: inline-flex !important;
  align-items: center !important;     /* ensures text centers inside pill */
  justify-content: center !important;
  margin: 0 !important;
  width: auto !important;
  max-width: fit-content !important;
  background: #F1FBF5 !important;
  border: none;
  color: #2E7D32 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  padding: 6px 12px !important;
  border-radius: 999px !important;
}

.occ-new-chip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: static !important;
  margin: 0 !important;
  background: #EAF6FB;
  border: none;   /* optional but matches your style */
  color: #0073A8;
  font-size: 11px;
  font-weight: 600;
  line-height: 1 !important;
  padding: 5px 10px;
  border-radius: 999px;
}


/* ============
   Modern Hover Lift Effect for directory cards(Desktop Only)
   ========= */

@media (hover: hover) {

  .pp-content-grid-post {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
  }

  .pp-content-grid-post:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(0,0,0,0.08);
  }

}



/* ====================
   FORMS
   ==================== */

.form-support {
    background-color: #ffffff;
    padding: 40px;
    border: 8px solid #e8f1f7;
}

.form-suggest {
    background-color: #ffffff;
    padding: 40px;
    border: 8px solid #DBEFDD;
}

/* Fluent Forms Buttons */
.ff-btn.ff-btn-submit.ff-btn-md.ff_btn_style {
    background: #0074aa;
    color: #ffffff;
    font-family: Helvetica, sans-serif;
    font-size: 16px;
}

.ff-btn.ff-btn-submit.ff-btn-md.ff_btn_style:hover {
    background: #51b357;
}

.fluentform .ff-el-input--label {
    font-size: 13px;
}

.fluentcrm_unsubscribe_wrapper {
    background-color: #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    border-radius: 5px;
    max-width: 600px;
    margin: 40px auto;
    padding: 30px;
}

input#fluentcrm_unsubscribe_submit {
    background-color: #0075ac !important;
    color: white !important;
    padding: 0px 24px !important;
    border: none !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    font-weight: bold !important;
}

input#fluentcrm_unsubscribe_submit:hover {
    background-color: #5ba760 !important;
}



/* ====================
   OCC RELATED POSTS
   ==================== */

.occ-related-posts {
    margin: 5px 0;
}

.occ-related-posts h3 {
    font-size: 15px;
    font-weight: bold;
    margin: 0 0 5px 0;
}

.related-posts-grid {
    display: block;
}

.related-post-item {
    margin-bottom: 6px;
    position: relative;
    padding-left: 12px;
}

.related-post-item:last-child {
    margin-bottom: 0;
}

.related-post-item::before {
    content: '•';
    position: absolute;
    left: 0;
    top: 0;
    color: #666;
}

.related-post-item h4 {
    font-size: 13px !important;
    font-weight: normal;
    margin: 0;
    line-height: 1.4;
}

.related-post-item h4 a {
    text-decoration: none;
    font-weight: normal;
    color: #0074aa;
}

.related-post-item h4 a:hover {
    color: #51b357;
}

.occ-post-excerpt {
    font-size: 12px;
    margin: 3px 0 0 0;
    line-height: 1.3;
}

/* About page container */

.occ-content-container {
	padding: 30px 40px;
}

.occ-content-container h3 {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 18px !important;
    font-weight: bold !important;
}

.occ-content-container a {
	color: #0074aa !important;
	text-decoration: none;
}

.occ-content-container a:hover {
	color: #51b357;
}

/* ====================
   MISC ELEMENTS
   ==================== */

.ss-inline-share-wrapper.ss-left-inline-content.ss-small-icons.ss-with-spacing.ss-rounded-icons.ss-without-labels {
    margin: 7px 0px 10px 0px !important;
    text-align: left !important;
}

.simplefavorite-button.preset {
    font-size: 12px !important;
    font-family: Helvetica, Arial, sans-serif !important;
}

#cp_popup_id_36513 {
    margin: -20px auto 5px !important;
}

/* ====================
   RESPONSIVE DESIGN
   ==================== */

@media (max-width: 768px) {
    .directory-extra-info {
        display: none;
    }
    
    .time-filter-row {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .tools-buttons {
        margin-left: 0;
        margin-top: 10px;
        width: 100%;
    }
    
    .random-tools-btn {
        flex: 1;
        justify-content: center;
    }
    
    #tool-category-form {
        flex-direction: column;
        width: 100%;
    }
    
    #tool-category-select {
        width: 100%;
    }
    
    .random-tools-container {
        padding: 15px 10px;
    }
    
    .random-tools-title {
        font-size: 18px !important;
    }
    
    .glossary-container {
        padding: 15px 10px;
    }
    
    .glossary-container h3 {
        font-size: 18px;
    }
    
    .glossary-description {
        font-size: 15px;
    }
    
    .glossary-meta {
        font-size: 13px;
    }
    
    .resource-row {
        flex-direction: column;
    }
    
    .resource-link {
        flex: 0 0 100%;
    }
}

@media (min-width: 769px) {
    .directory-extra-info {
        display: block;
    }
}

@media (min-width: 300px) {
    .option-row:first-child {
        flex-direction: row;
        gap: 12px;
    }
}


/* Red header for generators */
.random-tools-cta {
    background: #fa8072;
    padding: 15px;
    color: #fff;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    text-align: center;
	  margin-bottom: 0px !important;
}

/* New OCC Generator Panel*/

/*
 * OCC Copy Modal Styles
 */

/* ── Trigger button (inline, below each generator result) ── */
.occ-copy-trigger-wrap {
    margin-top: 5px;
	  margin-bottom: 12px;
}

.occ-modal-trigger {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: #F8FAFC;
    border: 1px solid #CFE8F5 !important;
    border-radius: 4px;
    color: #4caf50;
    font-size: 15px;
    font-weight: 600;
    padding: 12px 16px;
    text-decoration: none !important;
    transition: all 0.2s ease;
    cursor: pointer;
}

.occ-modal-trigger:hover {
    background: #EAF6FB;
    border-color: #0073A8;
    transform: translateY(-1px);
}

.occ-modal-trigger i {
    font-size: 14px;
}

/* ── OneClick Copy as plain text link (news list layout) ── */
.occ-modal-trigger-link {
    display: inline;
    background: none !important;
    border: none !important;
    border-radius: 0;
    color: #0073aa;
    font-size: 14px;
    font-weight: 400;
    padding: 0;
    text-decoration: none !important;
    transition: color 0.2s ease;
    cursor: pointer;
}
.occ-modal-trigger-link:hover {
    color: #005177;
    background: none !important;
    border: none !important;
    transform: none;
    text-decoration: underline !important;
}
.occ-modal-trigger-link i {
    font-size: 13px;
    margin-right: 4px;
}

/* For the wide card layout like Niches */


.fl-post-feed-post .occ-modal-trigger {
  text-align: left !important;
}

.fl-post-feed-post .occ-modal-trigger, .niche-template-default .occ-modal-trigger {
  display: inline-block !important;
  width: auto !important;
}

.fl-post-feed-post .occ-modal-trigger a, .niche-template-default .occ-modal-trigger a {
  width: auto !important;
  display: inline-block !important;
}

.single .occ-copy-trigger-wrap .occ-modal-trigger {
    display: inline-block !important;
    width: auto !important;
}

.occ-gen .occ-copy-trigger-wrap .occ-modal-trigger {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    justify-content: center !important;
}


/* ── Modal overlay ─────── */
.occ-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    box-sizing: border-box;
}

/* Prevent body scroll when modal is open */
body.occ-modal-open {
    overflow: hidden;
}

/* ── Modal box ──────────*/
.occ-modal-box {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 8px 40px rgba(0,0,0,0.22);
    width: 100%;
    max-width: 560px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    font-family: inherit;
}

/* ── Modal header ────── */
.occ-modal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 18px 20px 14px;
    border-bottom: 1px solid #e8e8e8;
    background: #f7f9fc;
    flex-shrink: 0;
}

.occ-modal-header-text {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.occ-modal-icon {
    color: #0073aa;
    font-size: 20px;
    margin-top: 2px;
    flex-shrink: 0;
}

.occ-modal-header-text h2 {
    margin: 0 0 3px;
    font-size: 16px;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.2;
}

.occ-modal-subtitle {
    margin: 0;
    font-size: 12px;
    color: #666;
    line-height: 1.4;
    max-width: 380px;
}

.occ-modal-close {
    background: #51b357;
    border: none;
    font-size: 22px;
    line-height: 1;
    color: #fff !important;
    cursor: pointer;
    padding: 0 5px 0 5px;
    flex-shrink: 0;
    transition: color 0.15s;
}

.occ-modal-close:hover {
    color: #ffffff;
	  background: #0074aa;
}

/* ── Modal body ─────── */
.occ-modal-body {
    padding: 16px 20px;
    overflow-y: auto;
    flex: 1;
}

/* ── Format tabs ──── */
.occ-modal-tabs {
    display: flex;
    gap: 4px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.occ-modal-tab {
    background: #f0f0f0;
    border: 1px solid #ddd;
    border-radius: 4px;
    color: #555;
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
    font-family: inherit;
    padding: 5px 12px;
    transition: background 0.12s, color 0.12s, border-color 0.12s;
    line-height: 1.4;
}

.occ-modal-tab:hover {
    background: #e0e0e0;
    color: #222;
}

.occ-modal-tab.occ-modal-tab-active {
    background: #0073aa;
    border-color: #0073aa;
    color: #fff;
}

/* ── Format description ───── */
.occ-format-description {
    font-size: 12px;
    color: #666;
    margin: 0 0 10px;
    font-style: italic;
}

/* ── Preview pane ─────────── */
.occ-preview-pane {
    background: #f7f9fc;
    border: 1px solid #e0e8f0;
    border-radius: 5px;
    padding: 14px 16px;
    margin-bottom: 12px;
    min-height: 80px;
    max-height: 200px;
    overflow-y: auto;
    font-size: 13px;
    line-height: 1.6;
    color: #333;
}

/* Plain text preview */
.occ-text-preview {
    margin: 0;
    white-space: pre-wrap;
    font-family: inherit;
    font-size: 13px;
    line-height: 1.6;
    color: #333;
    word-wrap: break-word;
}

/* HTML preview — let the HTML render naturally but constrain it */
.occ-html-preview {
    font-size: 13px;
    line-height: 1.6;
}

.occ-html-preview h3,
.occ-html-preview h4 {
    margin: 0 0 6px;
    font-size: 14px;
}

.occ-html-preview p {
    margin: 0 0 8px;
}

.occ-html-preview ul {
    margin: 4px 0 8px 18px;
    padding: 0;
}

.occ-html-preview a {
    color: #0073aa;
}

/* ── Raw copy area ────── */
.occ-raw-wrap {
    margin-bottom: 4px;
}

.occ-raw-label {
    display: block;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #888;
    margin-bottom: 5px;
}

.occ-raw-textarea {
    width: 100%;
    height: 80px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 12px;
    font-family: 'Courier New', Courier, monospace;
    color: #444;
    background: #fafafa;
    padding: 8px 10px;
    box-sizing: border-box;
    resize: vertical;
    line-height: 1.5;
}

.occ-raw-textarea:focus {
    outline: 2px solid #0073aa;
    outline-offset: -1px;
}

/* ── Modal footer ─────── */
.occ-modal-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 20px 16px;
    border-top: 1px solid #e8e8e8;
    background: #f7f9fc;
    flex-shrink: 0;
    flex-wrap: wrap;
}

.occ-modal-note {
    margin: 0;
    font-size: 11px;
    color: #888;
    display: flex;
    align-items: center;
    gap: 5px;
}

.occ-modal-note i {
    color: #0073aa;
    opacity: 0.7;
}

/* ── Copy button ──────*/
.occ-copy-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: #0073aa;
    border: none;
    border-radius: 4px;
    color: #fff;
    cursor: pointer;
    font-size: 13px;
    font-weight: 700;
    font-family: inherit;
    padding: 8px 12px;
    transition: background 0.15s, transform 0.1s;
    white-space: nowrap;
}

.occ-copy-btn:hover {
    background: #4caf50;
	  color: #ffffff;
}

.occ-copy-btn:active {
    transform: scale(0.98);
	  color: #ffffff;
}

.occ-copy-btn.occ-copied {
    background: #2e7d32;
	  color: #ffffff;
}

/* ── Responsive ────── */
@media (max-width: 480px) {
    .occ-modal-box {
        max-height: 95vh;
    }

    .occ-modal-footer {
        flex-direction: column;
        align-items: stretch;
    }

    .occ-copy-btn {
        width: 100%;
        justify-content: center;
    }

    .occ-modal-tab {
        font-size: 11px;
        padding: 4px 9px;
    }
}

/* OCC Copy Block — directory card button */
.occ-copy-trigger-wrap {
    margin-top: 12px;
}

.occ-copy-trigger-wrap .occ-modal-trigger {
    display: block;
    width: 100%;
    text-align: center;
    padding: 10px 16px;
    box-sizing: border-box;
    justify-content: center;
}

/* ============================================================
   OCC Generator — additions to existing Customizer CSS
   Add these rules to your existing occ-copy-block.css section
   ============================================================ */

/* ── Universal toggle links (Show More / Show Content / Show AI Prompt) ── */
.occ-gen-toggle-link {
    display: inline-block;
    margin: 6px 0;
    font-size: 13px;
    color: #0073aa;
    text-decoration: none;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
}

.occ-gen-toggle-link:hover {
    color: #f7b41a;
    text-decoration: none;
}

.occ-gen-toggle-link:visited {
    color: #0073aa;
}

/* Collapsible content panels — hidden by default */
.occ-gen-collapsible {
    display: none;
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.6;
    color: #444;
}

/* ── Tools items — tighten spacing between entries ── */
.occ-gen-tools__item {
    padding-bottom: 8px;
    margin-bottom: 8px;
    border-bottom: 1px solid #f0f0f0;
}

.occ-gen-tools__item:last-of-type {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.occ-gen-tools__name {
    font-weight: 600;
    margin: 0 0 2px;
    font-size: 13px;
}

.occ-gen-tools__desc {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
}

.occ-gen-tools__item p {
    margin: 0 !important;
    padding: 0 !important;
}

.occ-gen-tools__item .occ-gen-tools__desc {
    margin-top: 2px !important;
}

/* NEW STYLES FOR UNIVERSAL SIDEBAR GENERATOR */

 .occ-gen {
        font-family: inherit;
        font-size: 14px;
        color: #333;
        background: #ffffff;
        padding: 15px 18px 20px 18px;
	      border: 1px solid #eeeeee;
        margin-top: 0px !important;
	 
    }


    /* Header / title */
    .occ-gen__title {
        margin: 0 0 10px;
        font-size: 17px;
        font-weight: 700;
        line-height: 1.3;
			  
    }

.occ-centered {
  display: flex;             
  flex-direction: column;     
  align-items: center;       
  justify-content: center;   
  text-align: center;         
}


    /* Instructions toggle */
    .occ-gen__toggle {
        cursor: pointer;
        color: #0073aa;
        font-size: 13px;
        font-weight: 600;
        margin-bottom: 8px;
        display: flex;
        align-items: center !important;
        gap: 5px;
        user-select: none;
    }
    .occ-gen__toggle-icon {
        font-style: normal;
    }
    .occ-gen__instructions {
        display: none;
        padding: 10px 12px;
        background: #f9f9f9;
        border: 1px solid #ededed;
        border-radius: 4px;
        margin-bottom: 10px;
        font-size: 13px;
        line-height: 1.5;
    }
    .occ-gen__instructions p { margin: 0 0 7px; text-align: left !important; }
    .occ-gen__instructions ul {
        margin: 4px 0 4px 18px;
        padding: 0;
			  text-align: left !important;
    }
    .occ-gen__instructions li { margin-bottom: 3px; }

    /* Radio option rows */
    .occ-gen__options { margin-bottom: 10px; }
    .occ-gen__option-row {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        align-items: center;
        margin-bottom: 6px;
			margin-top: 5px;
        font-size: 12px;
			display: flex;           
    }
    .occ-gen__option-row label {
        display: flex;
        align-items: center;
        gap: 4px;
        cursor: pointer;
        white-space: nowrap;
    }
    .occ-gen__time-label {
        font-weight: 600;
        margin-right: 2px;
    }

    /* Category select */
    .occ-gen__cat-wrap {
        display: none;
        margin-bottom: 8px;
    }
    .occ-gen__cat-select {
        width: 100%;
        padding: 5px 8px;
        border: 1px solid #ddd;
        border-radius: 4px;
        font-size: 13px;
    }

    /* Refresh button */
    .occ-gen__btn {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: #0073aa;
        color: #fff;
        border: none;
        border-radius: 4px;
        padding: 9px 16px;
        font-size: 13px;
        font-weight: 600;
        font-family: inherit;
        cursor: pointer;
        transition: background 0.15s;
        width: 100%;
        justify-content: center;
        margin-bottom: 12px;
    }
    .occ-gen__btn:hover { background: #005177; color: #ffffff !important; }
    .occ-gen__btn:disabled { opacity: 0.65; cursor: default; }

    /* Result area */
    .occ-gen__result { margin-top: 2px; background: #f9f9f9; padding: 10px 17px 10px 17px !important;}

    /* ── Individual result card styles ───────────────────── */

    /* BEST */
    .occ-gen-best__title {
        font-size: 16px;
        font-weight: 700;
        margin: 0 0 8px;
        line-height: 1.3;
    }
    .occ-gen-best__desc { margin: 0 0 8px; line-height: 1.5; }
    .occ-gen-best__links ul {
        list-style: disc;
        margin: 2px 0 0 16px !important;
        padding: 0;
    }
    .occ-gen-best__links li { margin-bottom: 2px !important; }

    /* QUOTES */
    .occ-gen-quotes__wrap {
        border-left: 4px solid #0073aa;
        padding-left: 14px;
        margin-bottom: 6px;
    }
    .occ-gen-quotes__text {
        font-style: italic;
			  font-family: Georgia;
        font-size: 16px;
        line-height: 1.55;
        margin: 0 0 6px;
    }
    .occ-gen-quotes__author {
        font-size: 13px;
        font-weight: normal;
        color: #555;
        margin: 0;
			  text-align: right;
    }

    /* PROMPTS */
    .occ-gen-prompts__title {
        font-size: 16px;
        font-weight: 700;
        margin: 0 0 6px;
    }
    .occ-gen-prompts__content {
        font-size: 13px;
        line-height: 1.55;
        margin: 0 0 6px;
        white-space: pre-wrap;
    }
    .occ-gen-prompts__show-more {
        color: #0073aa;
        font-size: 13px;
        cursor: pointer;
        background: none;
        border: none;
        padding: 0;
        font-family: inherit;
        text-decoration: underline;
    }
    .occ-gen-prompts__full { display: none; margin-top: 6px; }

    /* TOOLS */
    .occ-gen-tools__item { margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid #eee; }
    .occ-gen-tools__item:last-child { border-bottom: none; padding-bottom: 0; margin-bottom: 0; }
    .occ-gen-tools__name { font-weight: 700; margin: 0 0 3px; font-size: 14px; }
    .occ-gen-tools__desc { font-size: 13px; margin: 0; line-height: 1.45; }

    /* GLOSSARY */
    .occ-gen-glossary__term { font-size: 17px; font-weight: 700; margin: 0 0 4px; }
    .occ-gen-glossary__def  { font-size: 14px; margin: 0; line-height: 1.5; }

    /* SUBLINE */
    .occ-gen-subline__title { font-size: 16px; font-weight: 700; margin: 0 0 5px; line-height: 1.3; }
    .occ-gen-subline__example { font-size: 13px; color: #555; margin: 0 0 5px; }
    .occ-gen-subline__prompt-toggle {
        color: #0073aa; font-size: 13px; cursor: pointer;
        background: none; border: none; padding: 0;
        font-family: inherit; text-decoration: underline;
    }
.occ-gen-subline__prompt-toggle:hover {
        background: none;
	      border: none;
	      color: #51b357;
}
    .occ-gen-subline__prompt { display: none; margin-top: 6px; font-size: 13px; color: #444; }

    /* TRAFFIC TIPS */
    .occ-gen-traffic__title { font-size: 16px; font-weight: 700; margin: 0 0 5px; }
    .occ-gen-traffic__goal  { font-size: 13px; font-weight: 600; color: #555; margin: 0 0 4px; }
    .occ-gen-traffic__content-toggle {
        color: #0073aa; font-size: 13px; cursor: pointer;
        background: none; border: none; padding: 0;
        font-family: inherit; text-decoration: underline;
        margin-bottom: 6px; display: inline-block;
    }
    .occ-gen-traffic__full { display: none; margin-top: 6px; font-size: 13px; line-height: 1.5; }

    /* NICHE */
    .occ-gen-niche__title { font-size: 18px; font-weight: 700; margin: 0 0 2px; }
    .occ-gen-niche__subcategory { color: #c0392b; font-weight: 600; font-size: 13px; margin: 0 0 10px; }
    .occ-gen-niche__field { margin-bottom: 7px; font-size: 13px; line-height: 1.45; }
    .occ-gen-niche__field strong { display: block; margin-bottom: 1px; }
    .occ-gen-niche__bottom-line { font-style: italic; color: #666; font-size: 13px; margin-top: 8px; }

    /* TIP */
    .occ-gen-tip__title { font-size: 17px; font-weight: 700; margin: 0 0 8px; line-height: 1.3; }
    .occ-gen-tip__content { font-size: 13px; line-height: 1.55; }
    .occ-gen-tip__content p { margin: 0 0 6px; }

    /* Loading shimmer */
    .occ-gen__loading {
        opacity: 0.5;
        pointer-events: none;
    }

.fl-node-content {
    overflow: visible !important;
}

/* For styling FA icons on single left sidedbars */

.occ-cpt-icon {
    font-size: 100px;
    color: #0073aa;
	  align-items: center;
}

/*Styles to make web page screenshots angled and shadows */
.screenshot-module .fl-photo-img {
  display: block;
  margin: 0 auto;

  max-width: 800px;
  width: 100%;
  height: auto;

  transform: perspective(1200px) rotateY(-12deg);
	
	-webkit-mask-image: linear-gradient(to bottom, black 45%, transparent 95%);
    mask-image: linear-gradient(to bottom, black 55%, transparent 95%);
    display: block;
}

.screenshot-module .fl-photo-content {
    filter: drop-shadow(0 20px 30px rgba(0, 0, 0, 0.2));
}

/* Style for home page sidbar text ads */
.editorial-ad {
  width: 100%;
  max-width: 220px;
  padding: 18px;
  border: 1px solid #e6e6e6;
  background: #ffffff;
  box-shadow: 0 4px 14px rgba(0,0,0,0.04);
  border-radius: 10px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.ad-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #888;
  margin-bottom: 10px;
}

.ad-title {
  font-size: 18px;
  margin: 0 0 10px 0;
  font-weight: 600;
  color: #111;
}

.ad-description {
  font-size: 14px;
  line-height: 1.5;
  color: #444;
  margin-bottom: 14px;
}

.ad-link {
  display: inline-block;
  font-size: 13px;
  color: #2a6df4;
  text-decoration: none;
  margin-bottom: 12px;
}

.ad-link:hover {
  text-decoration: underline;
}

.ad-button {
  display: block;
  text-align: center;
  padding: 7px 10px;
  font-size: 14px;
  font-weight: 500;
  background: #FA8072;
  color: #fff;
  text-decoration: none;
  border-radius: 6px;
  transition: all 0.2s ease;
}

.ad-button:hover {
  background: #E17367;
	color: #ffffff !important;
}

/* PMPro Submit Button */
#pmpro_btn-submit, 
input#pmpro_btn-submit,
.pmpro_btn-submit-checkout {
    background: #4caf50 !important;
    background-color: #4caf50 !important;
    color: white !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    padding: 15px 36px !important;
    border-radius: 5px !important;
    border: none !important;
    letter-spacing: 0.03em !important;
    box-shadow: 0 4px 18px rgba(0,0,0,0.25) !important;
    cursor: pointer !important;
    transition: background 0.2s, transform 0.15s !important;
}

#pmpro_btn-submit:hover,
input#pmpro_btn-submit:hover,
.pmpro_btn-submit-checkout:hover {
    background: #388e3c !important;
    background-color: #388e3c !important;
    transform: translateY(-2px) !important;
}

/* For centering the PMPro submit button */
.pmpro_form_submit {
    display: flex !important;
    justify-content: center !important;
}

#pmpro_submit_span {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
}

/* PMPro member page section titles. */
.pmpro_section_title {
	font-size: 24px !important;
	color: #444444 !important;
}

/* PMPro Member card name */
h3.pmpro_card_title.pmpro_font-large.pmpro_heading-with-avatar {
	font-size: 22px !important;
}

/* Right side info box on member account page */
.member-account-start-box {
	background: #F7FBFD;
  border: 1px solid #2e7fa6;
	border-radius: 8px;
	padding: 20px 30px;
	margin: 18px auto;
}

.member-account-start-box p {
	font-size: 16px;
}

.member-account-start-box h2 {
	font-size: 24px;
}

.member-account-start-box li {
	margin-bottom: 10px;
	font-size: 16px;
}

/* Main filter wrapper */
.resource-filters-wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 15px;
    padding: 12px 18px;
    background: #FEF8E8;
    border-radius: 6px;
    margin-bottom: 5px;
    margin-top: 10px;
	box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

/* Optional separator between toggle/types and other filters */
.filter-separator {
    color: #ddd;
    font-size: 20px;
    margin: 0 10px;
}

/* Resource types facet styling (keep existing) */
.facetwp-facet-resource_types {
    display: inline-block;
    margin: 0;
	    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Ensure the radio wrapper has no extra space */
.facetwp-facet-resource_types .facetwp-radio-wrapper {
    margin: 0;
    padding: 0;
}

.facetwp-facet-resource_types .facetwp-radio {
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 0;
}

.facetwp-facet-resource_types .facetwp-radio input[type="radio"] {
    display: none;
}

.facetwp-facet-resource_types .facetwp-radio {
    display: inline-block;
    padding: 2px 6px;
    background: #008bd4;
    border: 1px solid #ddd;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
    margin: 0px 10px 0px 0px;
    white-space: nowrap;
	font-size: 10px !important;
    font-weight: normal;
			color: #ffffff;
}

.facetwp-facet-resource_types .facetwp-radio:hover {
    background: #34A1DC;
	  color: #ffffff;
}

.facetwp-facet-resource_types .facetwp-radio.checked {
    background: #018ad3;
    color: #ffffff;
    border-color: #34A1DC;
}

/* Hides the count for this filter bar only beside each radio button */
.facetwp-facet-resource_types .facetwp-counter {
    display: none !important;
}

/* Make dropdowns and search boxes consistent size */
.facetwp-facet select,
.facetwp-facet input[type="search"] {
    min-width: 180px;
    padding: 6px 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

/* Responsive: Stack on mobile */
@media (max-width: 768px) {
    .resource-filters-wrapper {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }
    
    .oneline-block {
        display: block;
        width: 100%;
    }
    
    .filter-separator {
        display: none;
    }
    
/* Target the span inside the label for the text */
.facetwp-facet-resource_types .facetwp-radio label .facetwp-display-value {
    font-size: 12px !important;
}

/* Target the counter span */
.facetwp-facet-resource_types .facetwp-radio label .facetwp-counter {
    font-size: 11px !important;
}

/* Also force the label itself */
.facetwp-facet-resource_types .facetwp-radio label {
    font-size: 12px !important;
}

/* Close media query */
}

/* New resource type badges */

.resource-type-badge {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
}

.starting-points-badge {
    background: #e8f8e9;
    color: #589763;
}

.unmuddling-badge {
    background: #F2ECE6;
    color: #7B3F00;
}

.no-excuses-badge {
    background: #f7fbff;
    color: #4292c6;
}

.tools-picks-badge {
    background: #f0e9ff;
    color: #8c78c1;
}

.worth-your-time-badge {
    background: #FFDFDD;
    color: #CC4C45;
}

.real-examples-badge {
    background: #FEEEB3;
    color: #B18B01;
}

.where-ai-helps-badge {
    background: #D7F7F7;
    color: #279597;
}

/* LINKS DIRECTORY STYLES */
    .links-listing-item {
        padding: 12px 0;
        border-bottom: 1px solid #e5e5e5;
        margin-bottom: 4px;
    }
 
    /* ── Title ── */
    .links-listing-title {
        font-size: 1rem;
        font-weight: 600;
        margin: 0 0 4px 0;
        line-height: 1.4;
    }
    .links-listing-title a {
        text-decoration: none;
    }
    .links-listing-title a:hover {
        text-decoration: underline;
    }
 
    /* ── One-line blurb ── */
    .links-listing-blurb {
        font-size: 0.9rem;
        color: #555;
        margin: 0 0 6px 0;
        line-height: 1.5;
    }
 
    /* ── CTA row ── */
    .links-listing-cta-row {
        display: flex;
        gap: 16px;
        flex-wrap: wrap;
        align-items: center;
        margin-bottom: 6px;
    }
    .links-cta-link,
    .links-download-link {
        font-size: 0.85rem;
        text-decoration: none;
        font-weight: 500;
    }
    .links-cta-link:hover,
    .links-download-link:hover {
        text-decoration: underline;
    }
    .links-download-link {
        opacity: 0.8;
    }
 
    /* ── Show more toggle ── */
    .links-show-more-wrap {
        margin-top: 4px;
    }
    .links-show-more {
        font-size: 13px;
        text-decoration: none;
        display: inline-block;
        align-items: center;
        gap: 4px;
        opacity: 0.7;
        border: none;
    }
    .links-show-more:hover {
        opacity: 1;
    }
    .links-show-more i {
        font-size: 0.75rem;
        transition: transform 0.2s ease;
    }
    
    .show-more:focus,
.show-more:active {
    outline: none;
    box-shadow: none;
    border: none;
}
 
    /* ── Hidden content (full description + terms) ── */
    .links-hidden-content {
        margin-top: 10px;
        padding: 10px 12px;
        background: #f9f9f9;
        border-left: 3px solid #ddd;
        border-radius: 0 4px 4px 0;
    }
    .links-full-content {
        font-size: 0.88rem;
        line-height: 1.6;
        margin-bottom: 8px;
    }
    .links-meta-terms {
        font-size: 0.8rem;
        color: #666;
        margin-top: 6px;
    }
    .links-meta-terms a {
        text-decoration: none;
    }
    .links-meta-terms a:hover {
        text-decoration: underline;
    }


/*
.hero-grid {
  position: relative;
  background-image: linear-gradient(135deg, #2a2a2a, #1a1a1a);
  background-size: cover;
}

.hero-grid::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(to right, rgba(255, 255, 255, 0.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse at center, black 30%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 75%);
}*/

/* NEW LANDING PAGE STYLES - CLAUDE */
  .uir-page{
    --ink:#0E0D0C;
    --charcoal:#1A1815;
    --gold:#F7BE38;
    --gold-deep:#C99A2E;
    --parchment:#F4EFE4;
    --stone:#A39B8B;
    --hair: rgba(244,239,228,0.14);

    background:var(--ink);
    color:var(--parchment);
    font-family:'Inter',sans-serif;
    font-size:18px;
    line-height:1.65;
    -webkit-font-smoothing:antialiased;
  }
  .uir-page, .uir-page *{box-sizing:border-box;}
  .uir-page a{color:inherit; text-decoration:none;}
  .uir-page h1,.uir-page h2,.uir-page h3{font-family:'Fraunces',serif;font-weight:500;margin:0;letter-spacing:-0.01em;}
  .uir-page .uir-wrap{max-width:1180px;margin:0 auto;padding:0 40px;}
  .uir-page .eyebrow{
    font-size:13px; letter-spacing:0.18em; text-transform:uppercase;
    color:var(--gold); font-weight:600; display:flex; align-items:center; gap:12px;
  }
  .uir-page .eyebrow::before{content:"";width:24px;height:1px;background:var(--gold);display:inline-block;}

  /* NAV (renamed away from <nav> tag so it can't inherit theme header styles) */
  .uir-nav{background:rgba(14,13,12,0.88); border-bottom:1px solid var(--hair);}
  .uir-nav-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 0 38px;}
  .uir-nav-logo{width:350px;max-width:100%;height:auto;display:block; margin-bottom: 20px !important;}
  /* Qualifying the selector with .uir-nav-inner gives this more specificity than the
     ".uir-page a{color:inherit}" rule above, so the dark button text actually sticks —
     previously that rule was silently winning and turning the text light. */
  .uir-nav-inner .uir-nav-cta{
    font-size:14px;font-weight:600;color:var(--ink)!important;background:var(--gold);
    padding:12px 24px;border-radius:3px;white-space:nowrap;transition:background .15s;
  }
  .uir-nav-inner .uir-nav-cta:hover{background:var(--gold-deep);}
  @media (max-width:600px){ .uir-nav-inner{flex-wrap:wrap; justify-content:center; text-align:center;} }

  /* HERO */
  .uir-hero{position:relative;overflow:hidden;padding:56px 0 70px;}
  .uir-horizon{
    position:absolute; left:50%; top:64%; width:1600px; height:1600px;
    transform:translate(-50%,0); border-radius:50%;
    border-top:1px solid rgba(247,190,56,0.35);
    background:radial-gradient(ellipse at 50% 0%, rgba(247,190,56,0.07), transparent 60%);
    pointer-events:none;
  }
  .uir-hero-grid{position:relative; z-index:2; display:grid; grid-template-columns:0.85fr 1.15fr; gap:64px; align-items:start;}
  .uir-hero h1{font-size:52px; line-height:1.08; margin:22px 0 24px; color:var(--parchment);}
  .uir-hero h1 em{font-style:normal;color:var(--gold);}
  .uir-hero p.uir-lede{font-size:19px;color:var(--stone);max-width:480px;margin:0 0 36px;}
  .uir-bullets{list-style:none; margin:0 0 36px; padding:0; max-width:520px;}
  .uir-bullets li{
    position:relative; padding-left:26px; margin-bottom:9px;
    font-size:17px; color:var(--parchment); line-height:1.5;
  }
  .uir-bullets li::before{
    content:""; position:absolute; left:0; top:9px;
    width:7px; height:7px; border-radius:50%; background:var(--gold);
  }

  /* CTA button that opens the ConvertPro popup, used in place of an embedded form */
  .uir-cta-block{max-width:480px;}
  .uir-cta-button{
    display:inline-block; width:100%; text-align:center; box-sizing:border-box;
    background:var(--gold); color:var(--ink)!important; border:none;
    font-family:'Inter',sans-serif; font-weight:600; font-size:16px;
    padding:17px; border-radius:3px; cursor:pointer; letter-spacing:0.01em; transition:background .15s;
  }
  .uir-cta-button:hover{background:var(--gold-deep);}
  .uir-cta-fine{font-size:12.5px;color:var(--stone);margin:10px 2px 0;text-align:center;}

  /* BOOK RENDER (real cover image) */
  .uir-book-stage{position:relative; display:flex; justify-content:center; align-items:flex-start; z-index:2; margin-top:6px;}
  /* Rotation lives on the wrapper, drop-shadow lives on the image below it.
     Keeping these on two separate elements avoids a browser rendering bug where
     transform + filter on the same element causes visible tiling-seam artifacts
     (the red dashes) when the layer is rotated. */
  .uir-book-frame{
    width:390px; max-width:100%;
    transform: rotate(-4deg);
  }
  .uir-book-img{
    display:block; width:100%; height:auto;
    filter:drop-shadow(0px 26px 40px rgba(0,0,0,0.55));
  }

  /* STAT STRIP */
  .uir-stats{border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); padding:44px 0;}
  .uir-stats-grid{display:grid;grid-template-columns:repeat(3,1fr);}
  .uir-stat{text-align:center; padding:0 20px; border-left:1px solid var(--hair);}
  .uir-stat:first-child{border-left:none;}
  .uir-stat .uir-num{font-family:'Fraunces',serif;font-size:38px;color:var(--gold);font-weight:500;}
  .uir-stat .uir-label{font-size:14px;color:var(--stone);margin-top:6px;max-width:220px;margin-left:auto;margin-right:auto;}

  /* CHAPTERS / TOC */
  .uir-chapters{padding:100px 0 90px;}
  .uir-chapters-head{max-width:640px;margin-bottom:56px;}
  .uir-chapters-head h2{font-size:36px;color:var(--parchment);margin-top:18px;}
  .uir-chapters-head p{color:var(--stone);font-size:17px;margin-top:14px;}
  .uir-toc{border-top:1px solid var(--hair);}
  .uir-toc-row{display:grid; grid-template-columns:70px 1fr auto; align-items:center; gap:28px; padding:26px 0; border-bottom:1px solid var(--hair);}
  .uir-toc-num{font-family:'Fraunces',serif;font-size:26px;color:var(--gold-deep);}
  .uir-toc-title{font-size:19px;color:var(--parchment);font-weight:500;}
  .uir-toc-desc{font-size:15px;color:var(--stone);margin-top:5px;max-width:520px;}
  .uir-toc-tag{font-size:12px;color:var(--stone);letter-spacing:0.08em;text-transform:uppercase;white-space:nowrap;}

  /* CREDIBILITY */
  .uir-credibility{background:var(--charcoal); border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); padding:90px 0;}
  .uir-cred-grid{display:grid;grid-template-columns:220px 1fr;gap:56px;align-items:center;}
  .uir-avatar{
    width:220px;height:220px;border-radius:50%;
    background:linear-gradient(155deg,#2a2620,#141210);
    border:1px solid rgba(247,190,56,0.3);
    display:flex;align-items:center;justify-content:center;
    font-family:'Fraunces',serif;font-size:15px;color:var(--stone);
  }
  .uir-quote{font-family:'Fraunces',serif;font-style:italic;font-size:26px;line-height:1.5;color:var(--parchment);}
  .uir-quote-attr{margin-top:22px;font-family:'Inter',sans-serif;font-style:normal;font-size:14px;color:var(--gold);letter-spacing:0.02em;}

  /* FINAL CTA */
  .uir-final-cta{position:relative;overflow:hidden;padding:110px 0;text-align:center;}
  .uir-final-cta .uir-horizon{top:100%;}
  .uir-final-cta h2{font-size:40px;color:var(--parchment);max-width:640px;margin:0 auto 18px;position:relative;z-index:2;}
  .uir-final-cta .eyebrow{justify-content:center;}
  .uir-final-cta p{color:var(--stone);font-size:18px;max-width:480px;margin:0 auto 40px;position:relative;z-index:2;}
  .uir-final-cta .uir-cta-block{margin:0 auto;position:relative;z-index:2;}

  /* FOOTER (renamed from <footer> for the same isolation reason) */
  .uir-footer{padding:44px 0;border-top:1px solid var(--hair);}
  .uir-foot-inner{display:flex;justify-content:space-between;align-items:center;font-size:13.5px;color:var(--stone);flex-wrap:wrap;gap:16px;}
  .uir-foot-links{display:flex;gap:28px;}
  .uir-foot-links a{color:var(--stone);}
  .uir-foot-links a:hover{color:var(--gold);}

  @media (max-width:900px){
    .uir-page .uir-wrap{padding:0 24px;}
    .uir-page .uir-hero-grid{grid-template-columns:1fr;}
    .uir-page .uir-book-stage{margin-top:40px;}
    .uir-page .uir-hero h1{font-size:38px;}
    .uir-page .uir-stats-grid{grid-template-columns:1fr;}
    .uir-page .uir-stat{border-left:none;border-top:1px solid var(--hair);padding:24px 0;}
    .uir-page .uir-stat:first-child{border-top:none;}
    .uir-page .uir-toc-row{grid-template-columns:44px 1fr;}
    .uir-page .uir-toc-tag{grid-column:2;margin-top:4px;}
    .uir-page .uir-cred-grid{grid-template-columns:1fr;text-align:center;}
    .uir-page .uir-avatar{margin:0 auto;}
  }