/*
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
*/

/* Add your custom styles here... */ 




/* Adjusts font size in Author's box on posts */
div.fl-author-description p {
	font-size: 15px;
}

h1.fl-post-title {
    line-height: 125%

}

/* Adjust font size for meta info under title */
div.fl-post-meta.fl-post-meta-top {
margin: 5px 0px 5px 0px!important;
text-align: left;
font-size: 12px;

}

/* Adjusts post content paragraph margins */
.fl-post-content p {
margin-bottom: 30px !important;

}

/* Adjusts post content paragraph margins in builder modules */

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

/* Adjusts bottom margin of list elements on content areas */
#fl-main-content .fl-module-content li {
    margin-bottom: 20px;
}

/* Color of unlinked text in meta info under title */
span.fl-post-author {
color: #666666;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
text-align: left;
    
}


/* Adjusts bottom margin of featured image */
.fl-post-thumb {
width: 100%;
margin-bottom: 25px;

}

/* Custom styles for blockquote */
blockquote {
width: 90%;
padding: 35px 20px 30px 50px;
margin: 25px auto 35px;
overflow: auto;
color: #666666;
font-size:17px;
font-style: italic;
border-top: 2px dashed #dddddd;
border-bottom: 2px dashed #dddddd;
	border-left: 6px solid #dddddd !important;
-moz-box-shadow: 2px 2px 15px #eee;
-webkit-box-shadow: 2px 2px 15px #eee;
box-shadow: 2px 2px 15px #eee;
position: relative;
background: #ffffff;

}

blockquote::before {
content: "\201C"; /*Unicode for Left Double Quote*/
  
/*Font*/
font-family: Georgia, serif;
font-size: 80px;
font-weight: bold;
color: #ccc;
  
/*Positioning*/
position: absolute;
left: 0px;
top:-10px;

}

blockquote::after {
/*Reset to make sure*/
  content: "";
  
}

/* Adds a line below the post tags and increases spacing */
.fl-post-meta-bottom {
border-bottom: 1px solid #ddd;
border-top: none !important;
font-style: italic;
margin-top: 20px;
padding-top: 10px;

}

/* Adjusts font size and color of post tags */
.fl-post-cats-tags {
font-family: Helvetica, Arial, sans-serif;
font-size: 13px;
color: #888888;

}

/* Removes underline from post title hover */
h1.title a:hover, h2.title a:hover {
text-decoration: none !important;

}

/** For next page styling **/
.fl-archive-nav-next {
font-family: Helvetica, Arial, sans-serif;
font-size: 15px;

}

.img:hover {
    opacity: 0.8;
}

/* FSB For adding custom styling around widget titles */
.fl-widget-title {
font-family: Helvetica, Arial, sans-serif;
font-size: 18px;
margin: 14px 0px 15px 0px !important;
padding: 10px 10px 10px 10px;
background: #999999 !important;
border: none;
color: #eeeeee;
text-align: left;
width: 100%;
}

.widget ul { list-style-type: none; }



/* Adds spacing and dotted line between sidebar menu items */

.widget_nav_menu ul li {
	border-bottom: 1px dotted #dddddd;
	margin: 5px 0px 5px 10px;
	padding: 7px;
}




/* Removes the underline in widget link hover */
.fl-sidebar .fl-widget  ul li.active  a, ul li.normal a:hover, li.categories a:hover, li.cat-item a:hover {
    text-decoration: none

}

/* Bolds the current category link name */
.fl-sidebar .fl-widget  ul li.current-cat  a {
   color: #000 !important;
   font-weight: bold;

}

/* Bolds the current page or post name in widget links */
.fl-sidebar .fl-widget  li.current-menu-item a {
    font-weight: bold !important;
    color: #444444 !important;

}

#sidebar .menu-item-has-children .parent   a {
font-weight: bold !important;

}

/** this adjusts the bottom margin on the post title on the search results page **/
body.search.search-results header.fl-post-header {
margin-bottom: 0px !important;

}

body.search.search-results .fl-post-content p {
font-size: 16px;
line-height: 23px;

}

body.search.search-results a.fl-post-more-link {
font-size: 14px !important;

}

h1.fl-archive-title {
font-size: 24px !important;

}

/* For the hard rule line divider */
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));
    
}
  
.clearfix:after {  
    content:"\0020";  
    display:block;  
    height:0;  
    clear:both;  
    visibility:hidden;  
    overflow:hidden;  
}  
  
.clearfix {  
    display:block;  
}  

/* Adjust size of view all posts by author link */
.fl-author-link {
font-size: 14px;
    
}

/* FSB For styling WPForms */

label.wpforms-field-label {
font-size: 14px !important;

}

.wpforms-container.wpforms-container-full {
margin: 40px auto 40px;
border: 1px solid #dddddd !important;
padding: 20px 40px!important;
background: #f5f5f5 !important;

}

.wpforms-submit {
background: #0287D0 !important;
color: #ffffff !important;

}

.wpforms-submit:hover {
background: #28B5F5 !important;
color: #ffffff !important;

}

/* ## Comments
--------------------------------------------- */

.fl-comment-form label {
	font-weight: normal;
	font-size: 14px;
}

h3.fl-comments-list-title {
    font-size: 22px;
}

.comment-respond,
.entry-pings,
.entry-comments {
color: #666;
padding: 20px 45px 40px 45px;
overflow: hidden;
background: #fff;
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.13);
box-shadow: 0 1px 3px rgba(0,0,0,0.13);

}

li.comment {
    background-color: #f9f9f9;
    border-right: none;
      padding: 30px;

}

.comment-content {
font-size: 16px;
font-family: Tahoma, Helvetica, sans-serif;
color: #666;
clear: both;
overflow: hidden;
background: #fff;
border-radius: 6px;
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.13);
box-shadow: 0 1px 3px rgba(0,0,0,0.13);
padding: 20px !important;
}

.entry-comments .comment-author img {
    border-radius: 50%;
    border: 5px solid #fff;
    left: -80px;
    top: -5px;
    position: absolute;
    width: 60px;
}

.entry-pings .reply {
    display: none;

}

.bypostauthor {
background: #F4F7FA !important;
border-radius: 6px;
	border: 6px solid #0287D0;
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.13);
box-shadow: 0 1px 3px rgba(0,0,0,0.13);
padding: 20px !important;
font-size: 15px;
    
}

.bypostauthor .comment-author-link {
color: #444444;
    
}

.bypostauthor .comment-date {
color: #777777 ;
	font-size: 13px;
    
}

.bypostauthor .comment-reply-link {
color: #dddddd;
padding-top: 12px;
    
}

.bypostauthor .comment-content {
background: #f9f9f9 !important;
color: #444444;
font-size: 16px;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
}

.form-allowed-tags {
background-color: #f5f5f5;
font-size: 16px;
padding: 24px;
    
}

.comment-reply-link {
cursor: pointer;
border: none;
border-radius: 3px;
color: #0287D0;
font-size: 12px;
font-weight: 300;
letter-spacing: 1px;
padding: 10px 10px 20px 0px !important;
text-transform: uppercase;
width: auto;
    
}
.comment-reply-link:hover{
    color: #444444;

}

.comment-notes{
display:none; 
    
}

/* Following styles are for the custom grid for layout with small left-aligned image */
.pst-ttl, .pst-content, .pst-read-more, .pst-authr-name{
    /*font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif !important;*/
}
.pst-ttl{
    font-size: 20px;
    margin: 0 0 15px 0 !important;
    color: #222;
    font-weight: bold;
    line-height: 1.6em;
}
.pst-content{
    font-size: 16px;
    color: #222;
}
.pst-content p {
    
}
.pst-read-more{
    margin-bottom: 20px !important;
    text-transform: uppercase;
   
}
.pst-read-more a{
    color: #029AE4 !important;
}

.pst-read-more a:hover {
    color: #000000 !important;
}
.pst-authr-name{
   
}

.fl-post-image.pst-img.custom-img {
	width: 120px !important;
	height: 120px !important;
}

.post-catgry {
    border-radius: 2px;
    display: inline-block;
    font-size: 12px;
    height: 22px;
    line-height: 22px;
    margin-bottom: 10px;
    padding: 0 8px;
    text-transform: uppercase;
    -webkit-backface-visibility: hidden;
    background-color: #029AE4;
}

.post-catgry a {
	color: #ffffff;
}

.post-catgry a:hover {
	color: #000000;
}

.fl-post-grid-post:hover{
    border:1px solid #222;
}

/* Arhive Category Title Styling */
.cat-title-bg {
background: #f1eee8;
margin: 15px 10px 15px 20px;
	padding: 10px 10px 10px 20px;

}

/* Adds padding for Woocommerce checkout button */
.checkout-button {
    padding: 20px !important;

}


/* Adjusts margins on Resources post filter */
.pp-post-filters {
    margin: 0px auto 20px;
    font-weight: bold;
    background: #eeeeee;
    padding: 15px;
}

/* temporary fix for ConvertPro background images coming forward */
.cp-popup-container.cpro-open.cp-module-widget .cp-popup-wrapper{
  overflow: hidden;
}


/*
  ============================================================
  PICKLEBALLS.COM — CHILD THEME STYLESHEET
  ============================================================
  Paste this into the child theme's style.css (below the
  required theme header comment at the very top of that file
  — don't remove that header, WordPress needs it).

  Every page/template that uses this design wraps its content
  in a single element with class="pbg-page", e.g.:
      <div class="pbg-page pbg-guide">   ...ball buying guide...
      <div class="pbg-page pbg-archive"> ...blog archive...
      <div class="pbg-page pbg-single">  ...blog single post...

  .pbg-page carries the shared tokens/typography/layout
  primitives (colors, fonts, .wrap, .band, .eyebrow, h1-h3, p,
  .link, .callout). The second class (.pbg-guide / .pbg-archive
  / .pbg-single) is only there so page-specific component rules
  further down can be scoped and never leak into other pages.

  Fonts: add this line to the child theme's functions.php
  (see snippet at the very bottom of this file) instead of
  linking Google Fonts from inside every HTML module.
  ============================================================
*/

/* ---------- shared tokens + base (defined once, used everywhere) ---------- */
.pbg-page{
  --ink:#16232E;
  --court:#0E5C63;
  --court-tint:#E7F2F1;
  --lime:#D3E94A;
  --chalk:#FBFAF6;
  --slate:#55666D;
  --line:#D9E2E1;

  font-family:'Source Sans 3', sans-serif;
  color:var(--ink);
  background:var(--chalk);
  line-height:1.6;
}
.pbg-page *{ box-sizing:border-box; }
.pbg-page h1, .pbg-page h2, .pbg-page h3{
  font-family:'Barlow Condensed', sans-serif;
  font-weight:700;
  letter-spacing:.01em;
  line-height:1.05;
  margin:0 0 .4em;
}
.pbg-page .eyebrow{
  font-family:'IBM Plex Mono', monospace;
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--court);
  display:inline-block;
  margin-bottom:.6em;
}
.pbg-page .wrap{ max-width:780px; margin:0 auto; padding:0 40px; }
.pbg-page .wrap-wide{ max-width:1000px; }
.pbg-page .band{ padding:56px 0; }
.pbg-page .band-tint{ background:var(--court-tint); }
.pbg-page .band-dark{ background:var(--court); color:var(--chalk); }
.pbg-page .band-dark .eyebrow{ color:var(--lime); }
.pbg-page .band-dark h2{ color:var(--chalk); }
.pbg-page p{ margin:0 0 1em; color:var(--slate); }
.pbg-page .band-dark p{ color:#DCEAE8; }
.pbg-page a.link{
  color:var(--court);
  font-weight:600;
  text-decoration:none;
  border-bottom:2px solid var(--lime);
}
.pbg-page a.link:hover{ color:var(--ink); }

/* shared "kitchen line" divider */
.pbg-page .kline{
  display:flex;
  align-items:center;
  gap:14px;
  max-width:780px;
  margin:0 auto;
  padding:0 40px;
}
.pbg-page .kline::before, .pbg-page .kline::after{
  content:"";
  flex:1;
  height:0;
  border-top:3px solid var(--court);
}
.pbg-page .kline span{
  font-family:'IBM Plex Mono', monospace;
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--court);
  white-space:nowrap;
}

/* shared dark callout box (used on guide pages and inside post bodies) */
.pbg-page .callout{
  background:var(--ink);
  color:var(--chalk);
  border-radius:4px;
  padding:20px 24px;
  margin:24px 0;
  font-size:15px;
}
.pbg-page .callout p{ color:var(--chalk); font-size:15px; margin:0; }
.pbg-page .callout b{ color:var(--lime); }

@media (max-width:640px){
  .pbg-page .wrap{ padding:0 22px; }
  .pbg-page .kline{ padding:0 22px; }
  .pbg-page .band{ padding:40px 0; }
}


/* ============================================================
   BUYING GUIDE PAGES (.pbg-guide) — hero, compare cards,
   brand grid, factor list, eco card, start grid
   ============================================================ */
.pbg-guide .hero{ text-align:left; overflow:hidden; }
.pbg-guide .hero-grid{ display:grid; grid-template-columns:1.15fr .85fr; gap:32px; align-items:center; }
.pbg-guide .hero h1{ font-size:42px; }
.pbg-guide .hero p{ font-size:17px; max-width:56ch; }
.pbg-guide .hero-art{ position:relative; display:flex; align-items:center; justify-content:center; }
.pbg-guide .hero-art::before{
  content:""; position:absolute; width:82%; aspect-ratio:1/1; border-radius:50%;
  background:radial-gradient(circle, var(--court-tint) 0%, rgba(231,242,241,0) 72%); z-index:0;
}
.pbg-guide .hero-art img{
  position:relative; z-index:1; width:100%; max-width:300px; height:auto; display:block;
  filter:drop-shadow(0 18px 28px rgba(14,92,99,.22));
}

.pbg-guide .section h2{ font-size:30px; color:var(--ink); }
.pbg-guide .section h3{ font-size:19px; color:var(--ink); margin-top:1.4em; }

.pbg-guide .compare{ display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:28px 0; }
.pbg-guide .card{ background:#fff; border:1px solid var(--line); border-radius:4px; padding:24px; }
.pbg-guide .card.outdoor{ border-top:4px solid var(--court); }
.pbg-guide .card.indoor{ border-top:4px solid var(--lime); }
.pbg-guide .card h3{ margin-top:0; font-size:22px; }
.pbg-guide .card p{ font-size:15px; }
.pbg-guide .spec-list{ list-style:none; margin:16px 0 0; padding:0; }
.pbg-guide .spec-list li{ display:flex; justify-content:space-between; gap:12px; padding:8px 0; border-top:1px solid var(--line); font-size:14px; }
.pbg-guide .spec-list li:first-child{ border-top:none; }
.pbg-guide .spec-list .k{ font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--slate); }
.pbg-guide .spec-list .v{ font-weight:600; text-align:right; }

.pbg-guide .brand-grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:24px; }
.pbg-guide .brand-card{ background:#fff; border:1px solid var(--line); border-radius:4px; padding:18px 20px; transition:box-shadow .15s ease, transform .15s ease; }
.pbg-guide .brand-card:hover{ box-shadow:0 6px 16px rgba(14,92,99,.12); transform:translateY(-2px); }
.pbg-guide .brand-card h3{ font-size:17px; margin:0 0 6px; display:flex; align-items:center; gap:8px; }
.pbg-guide .brand-card .dot{ width:8px; height:8px; border-radius:50%; background:var(--lime); flex:none; }
.pbg-guide .brand-card p{ font-size:14px; margin:0; }

.pbg-guide .factor-list{ list-style:none; margin:20px 0 0; padding:0; }
.pbg-guide .factor-list li{ display:grid; grid-template-columns:130px 1fr; gap:18px; padding:14px 0; border-top:1px solid var(--line); }
.pbg-guide .factor-list li:first-child{ border-top:none; }
.pbg-guide .factor-list .term{ font-family:'IBM Plex Mono', monospace; font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--court); padding-top:2px; }
.pbg-guide .factor-list p{ margin:0; font-size:15px; }

.pbg-guide .eco-card{ background:#fff; border:1px solid var(--line); border-left:4px solid var(--lime); border-radius:4px; padding:22px 24px; margin-top:20px; }
.pbg-guide .eco-card p{ font-size:15px; }
.pbg-guide .eco-note{ font-size:13px; color:var(--slate); font-style:italic; margin-top:12px; }

.pbg-guide .start-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:24px; }
.pbg-guide .start-card{ background:rgba(251,250,246,.06); border:1px solid rgba(251,250,246,.25); border-radius:4px; padding:20px 22px; }
.pbg-guide .start-card .eyebrow{ color:var(--lime); }
.pbg-guide .start-card p{ font-size:15px; color:#DCEAE8; }
.pbg-guide .start-card b{ color:var(--chalk); }

@media (max-width:640px){
  .pbg-guide .hero h1{ font-size:34px; }
  .pbg-guide .hero-grid{ grid-template-columns:1fr; gap:24px; }
  .pbg-guide .hero-art{ order:-1; }
  .pbg-guide .hero-art img{ max-width:220px; }
  .pbg-guide .compare, .pbg-guide .brand-grid, .pbg-guide .start-grid{ grid-template-columns:1fr; }
  .pbg-guide .factor-list li{ grid-template-columns:1fr; gap:4px; }
  .pbg-guide .kline span{ font-size:10px; }
}


/* ============================================================
   BLOG ARCHIVE (.pbg-archive) — filters, featured post, grid
   ============================================================ */
.pbg-archive .wrap{ max-width:1080px; }
.pbg-archive .archive-head h1{ font-size:40px; }
.pbg-archive .archive-head p{ font-size:17px; max-width:56ch; }

.pbg-archive .filters{ display:flex; flex-wrap:wrap; gap:10px; margin:24px 0 40px; background: #fbfaf6 !important; }
.pbg-archive .chip{
  font-family:'IBM Plex Mono', monospace; font-size:12px; letter-spacing:.04em; text-transform:uppercase;
  color:var(--court); background:#fff; border:1px solid var(--line); border-radius:20px; padding:8px 16px;
  text-decoration:none; transition:background .15s ease, color .15s ease;
}
.pbg-archive .chip:hover{ background:var(--court-tint); }
.pbg-archive .chip.active{ background:var(--court); border-color:var(--court); color:var(--chalk); }

.pbg-archive .featured{ display:grid; grid-template-columns:1fr 1fr; background:#fff; border:1px solid var(--line); border-radius:6px; overflow:hidden; margin-bottom:48px; }
.pbg-archive .featured .thumb{ background:linear-gradient(135deg, var(--court) 0%, #133F44 100%); min-height:260px; display:flex; align-items:center; justify-content:center; }
.pbg-archive .featured .thumb svg{ width:72px; height:72px; opacity:.85; }
.pbg-archive .featured .copy{ padding:36px 40px; display:flex; flex-direction:column; justify-content:center; }
.pbg-archive .featured h2{ font-size:28px; }
.pbg-archive .featured p{ font-size:15px; }
.pbg-archive .tag{ font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--court); }
.pbg-archive .tag a{color:inherit; text-decoration:none;
}
.pbg-archive .tag a:hover{color:#444444; text-decoration:none;
}
.pbg-archive .meta{ font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:.03em; color:var(--slate); margin-top:auto; padding-top:16px; }

.pbg-archive .post-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:24px; }
.pbg-archive .post-card{ background:#fff; border:1px solid var(--line); border-radius:6px; overflow:hidden; display:flex; flex-direction:column; transition:box-shadow .15s ease, transform .15s ease; }
.pbg-archive .post-card:hover{ box-shadow:0 8px 20px rgba(14,92,99,.12); transform:translateY(-2px); }
.pbg-archive .post-card__img{ height:150px; background:var(--court-tint); display:flex; align-items:center; justify-content:center; }
.pbg-archive .post-card__img a{ display:block; width:100%; height:100%;}
.pbg-archive .post-card__img svg{ width:38px; height:38px; opacity:.5; }
.pbg-archive .post-card__body{ padding:24px 40px 26px !important; display:flex; flex-direction:column; flex:1; }
.pbg-archive .post-card h3{ font-size:19px; margin:8px 0 8px; }
.pbg-archive .post-card p{ font-size:14px; margin:0; }
.pbg-archive .post-card .meta{ margin-top:16px; padding-top:0; }

.pbg-archive .pagination{ display:flex; justify-content:center; align-items:center; gap:8px; margin-top:48px; }
.pbg-archive .page-btn{
  font-family:'IBM Plex Mono', monospace; font-size:13px; width:36px; height:36px;
  display:flex; align-items:center; justify-content:center; border-radius:4px;
  border:1px solid var(--line); background:#fff; color:var(--ink); text-decoration:none;
}
.pbg-archive .page-btn.active{ background:var(--court); border-color:var(--court); color:var(--chalk); }

@media (max-width:900px){
  .pbg-archive .post-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  .pbg-archive .archive-head h1{ font-size:32px; }
  .pbg-archive .featured{ grid-template-columns:1fr; }
  .pbg-archive .post-grid{ grid-template-columns:1fr; }
}


/* ============================================================
   BLOG SINGLE POST (.pbg-single) — head, jump box, body,
   share row, author card, related posts
   ============================================================ */
.pbg-single .wrap{ max-width:740px; }
.pbg-single .band{ padding:48px 0; }
.pbg-single p{ font-size:17px; }
.pbg-single .post-head h1{ font-size:38px; color:var(--ink); }
.pbg-single .byline{ font-family:'IBM Plex Mono', monospace; font-size:12px; letter-spacing:.03em; color:var(--slate); margin-top:6px; }
.pbg-single .featured-img{
  margin-top:28px; margin-bottom: 28px !important; border-radius:6px; overflow:hidden;
  background:linear-gradient(135deg, var(--court) 0%, #133F44 100%);
  height:320px; display:flex; align-items:center; justify-content:center;
}
.pbg-single .featured-img svg{ width:90px; height:90px; opacity:.85; }

.pbg-single .jump-box{ background:#fff; border:1px solid var(--line); border-left:4px solid var(--court); border-radius:4px; padding:18px 22px; margin:32px 0; }
.pbg-single .jump-box .eyebrow{ margin-bottom:8px; }
.pbg-single .jump-box ul{ margin:0; padding-left:18px; }
.pbg-single .jump-box li{ font-size:14px; margin-bottom:4px; }
.pbg-single .jump-box a{ color:var(--ink); text-decoration:none; }
.pbg-single .jump-box a:hover{ color:var(--court); }

.pbg-single .post-body h2{ font-size:26px; margin-top:1.4em; }
.pbg-single .post-body h3{ font-size:19px; margin-top:1.2em; }

.pbg-single .share-row{ display:flex; align-items:center; gap:14px; margin:40px 0; padding:18px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.pbg-single .share-row span{ font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--slate); }
.pbg-single .share-row a{ width:32px; height:32px; border-radius:50%; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; color:var(--court); text-decoration:none; font-size:13px; }

.pbg-single .author-card{ display:flex; gap:16px; align-items:flex-start; background:var(--court-tint); border-radius:6px; padding:22px 24px; margin:40px 0; }
.pbg-single .author-card .avatar{ width:48px; height:48px; border-radius:50%; background:var(--court); flex:none; }
.pbg-single .author-card h3{ font-size:16px; margin:0 0 4px; }
.pbg-single .author-card p{ font-size:14px; margin:0; }

.pbg-single .related h2{ font-size:24px; }
.pbg-single .related-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; margin-top:20px; }
.pbg-single .related-card{ background:#fff; border:1px solid var(--line); border-radius:6px; overflow:hidden; }
.pbg-single .related-card .thumb{ height:100px; background:var(--court-tint); }
.pbg-single .related-card .copy{ padding:14px 16px; }
.pbg-single .related-card h3{ font-size:15px; margin:0 0 4px; }
.pbg-single .related-card .tag{ font-family:'IBM Plex Mono', monospace; font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--court); }

@media (max-width:640px){
  .pbg-single .post-head h1{ font-size:30px; }
  .pbg-single .featured-img{ height:200px; }
  .pbg-single .related-grid{ grid-template-columns:1fr; }
}


/* ============================================================
   RULES / HOW-TO PAGES (.pbg-rules) — used alongside .pbg-guide
   (wrapper should carry BOTH classes: "pbg-page pbg-guide pbg-rules")
   so this page inherits .section/.card/.callout from the guide
   styles above, and only adds what's unique here: a plain bullet
   list, round-by-round sequence cards, a data table, and a
   simple FAQ list.
   ============================================================ */

.pbg-rules ul.plain-list{ list-style:none; margin:16px 0 0; padding:0; }
.pbg-rules ul.plain-list li{
  position:relative; padding-left:22px; margin-bottom:10px; font-size:16px; color:var(--slate);
}
.pbg-rules ul.plain-list li::before{
  content:""; position:absolute; left:0; top:9px; width:8px; height:8px; border-radius:50%; background:var(--lime);
}

.pbg-rules .round-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:28px 0; }
.pbg-rules .round-card{ background:#fff; border:1px solid var(--line); border-radius:4px; padding:22px 24px; }
.pbg-rules .round-card.odd{ border-top:4px solid var(--court); }
.pbg-rules .round-card.even{ border-top:4px solid var(--lime); }
.pbg-rules .round-card .round-tag{
  font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--court);
}
.pbg-rules .round-card h3{ font-size:19px; margin:6px 0 10px; }
.pbg-rules .round-card p{ font-size:14px; margin:0 0 8px; }
.pbg-rules .round-card .round-meta{
  font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--slate); margin-top:10px; padding-top:10px; border-top:1px solid var(--line);
}

.pbg-rules .data-table{ width:100%; border-collapse:collapse; margin:24px 0; font-size:14px; }
.pbg-rules .data-table th{
  font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:.06em; text-transform:uppercase;
  background:var(--court); color:var(--chalk); text-align:left; padding:10px 14px;
}
.pbg-rules .data-table td{ padding:10px 14px; border-bottom:1px solid var(--line); color:var(--ink); }
.pbg-rules .data-table tr:nth-child(even) td{ background:var(--court-tint); }

.pbg-rules .faq-list{ margin-top:20px; }
.pbg-rules .faq-item{ padding:18px 0; border-top:1px solid var(--line); }
.pbg-rules .faq-item:first-child{ border-top:none; }
.pbg-rules .faq-item h3{ font-size:17px; margin:0 0 6px; }
.pbg-rules .faq-item p{ font-size:15px; margin:0; }

@media (max-width:640px){
  .pbg-rules .round-grid{ grid-template-columns:1fr; }
  .pbg-rules .data-table{ font-size:13px; }
  .pbg-rules .data-table th, .pbg-rules .data-table td{ padding:8px 10px; }
}


/* ============================================================
   SEARCH RESULTS (.pbg-search) — a plain scannable feed,
   not a card grid. Wrapper: class="pbg-page pbg-search"
   ============================================================ */
.pbg-search .search-head h1{ font-size:20px; }
.pbg-search .search-head .result-count{
  font-family:'IBM Plex Mono', monospace; font-size:13px; color:var(--slate); margin-top:4px;
}
 
.pbg-search .search-list{ margin-top:20px; }
.pbg-search .search-item{ padding:24px 0; border-top:1px solid var(--line); }
.pbg-search .search-item:first-child{ border-top:none; padding-top:0; }
.pbg-search .search-item .tag{
  font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--court);
}
.pbg-search .search-item h2{ font-size:18px; margin:6px 0 8px; }
.pbg-search .search-item h2 a{ color:var(--ink); text-decoration:none; }
.pbg-search .search-item h2 a:hover{ color:var(--court); }
.pbg-search .search-item p{ font-size:15px; margin:0 0 8px; }
.pbg-search .search-item .meta{
  font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--slate);
}
 
.pbg-search .search-empty{
  background:#fff; border:1px solid var(--line); border-left:4px solid var(--court);
  border-radius:4px; padding:28px 30px; margin-top:32px;
}
.pbg-search .search-empty p{ font-size:16px; margin:0 0 10px; }
.pbg-search .search-empty p:last-child{ margin-bottom:0; }
 
@media (max-width:640px){
  .pbg-search .search-head h1{ font-size:28px; }
}


/* ============================================================
   FONTS — add this to the child theme's functions.php instead
   of linking Google Fonts from every HTML module:

   function pbg_enqueue_fonts() {
       wp_enqueue_style(
           'pbg-google-fonts',
           'https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700&family=Source+Sans+3:wght@400;500;600&family=IBM+Plex+Mono:wght@500&display=swap',
           array(),
           null
       );
   }
   add_action( 'wp_enqueue_scripts', 'pbg_enqueue_fonts' );

   This loads the fonts once per page load no matter how many
   .pbg-page sections are on it, instead of once per HTML module.
   ============================================================ */