/*
Theme Name: SmartQuote Insights
Description: The article section of smartquoteinsure.com. Fixed look, no options.
Author: Click Circle LLC
Version: 1.0
Requires PHP: 8.0
*/

/* The design tokens (--navy, --accent-blue, --radius-md ...), buttons, header
   and footer come from the ROOT SITE's /css/tokens.css and /css/site.css,
   which functions.php loads before this file. Only what is specific to the
   article section lives here. Montserrat only — no serif anywhere (brand rule). */

body{min-height:100vh; display:flex; flex-direction:column;}
.site-main{flex:1 0 auto;}
.site-footer{margin-top:0;}
.screen-reader-text{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* ---------- List (home, archives, search) ---------- */
.insights-list{padding:56px 0 80px;}
.insights-head{text-align:center; max-width:640px; margin:0 auto 44px;}
.insights-head h1{font-size:clamp(28px, 3.8vw, 40px); margin-top:8px;}
.insights-head .sub{color:var(--slate); font-size:17px; margin:0;}

.post-grid{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(4, 1fr); gap:24px;
}
@media (max-width:1080px){ .post-grid{grid-template-columns:repeat(3, 1fr);} }
@media (max-width:800px){ .post-grid{grid-template-columns:repeat(2, 1fr);} }
@media (max-width:520px){ .post-grid{grid-template-columns:1fr;} }
.post-grid > li{display:flex;}
.tile{
  flex:1; display:flex; flex-direction:column; overflow:hidden;
  background:#fff; border:1px solid var(--border-soft); border-radius:var(--radius-md);
  transition:transform 0.18s ease, box-shadow 0.18s ease;
}
.tile:hover{transform:translateY(-3px); box-shadow:var(--shadow-card);}
.tile-img{display:block; aspect-ratio:16 / 10; background:var(--bg-alt); overflow:hidden;}
.tile-img img{width:100%; height:100%; object-fit:cover;}
.tile-ph{display:flex; align-items:center; justify-content:center; width:100%; height:100%; background:var(--gradient-hero);}
.tile-ph img{width:44px; height:44px; object-fit:contain; opacity:0.85;}
.tile-body{padding:16px 18px 20px; display:flex; flex-direction:column; gap:6px;}
.tile-date{font-size:12.5px; font-weight:600; color:var(--muted);}
.tile h2{font-size:16.5px; line-height:1.35; margin:0; font-weight:700;}
.tile h2 a{color:var(--navy);}
.tile h2 a:hover{color:var(--accent-blue);}
.empty{color:var(--muted); font-size:16px; text-align:center;}

.pagination{margin-top:40px; display:flex; justify-content:center;}
.pagination .nav-links{display:flex; gap:6px; flex-wrap:wrap;}
.pagination .page-numbers{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:40px; height:40px; padding:0 14px; border-radius:999px;
  border:1.5px solid var(--border-soft); background:#fff;
  color:var(--navy); font-weight:700; font-size:14px;
}
.pagination .page-numbers.current{background:var(--accent-blue); color:#fff; border-color:var(--accent-blue);}
.pagination .page-numbers.dots{border:none; background:transparent;}
.pagination a.page-numbers:hover{border-color:var(--accent-blue); color:var(--accent-blue);}

/* ---------- Single article (same shape as the site's old static article pages) ---------- */
.article-page{padding:48px 0 80px;}
.article-page__inner{max-width:760px;}
.article-page .eyebrow{margin:0;}
.article-page .eyebrow a{color:inherit;}
.article-page h1{font-size:clamp(26px, 3.8vw, 36px); margin-top:8px; margin-bottom:10px;}
.article-page .sub{color:var(--slate); font-size:17px;}
.article-page__meta{color:var(--muted); font-size:13.5px; font-weight:600; margin-bottom:40px;}
.article-page__hero{
  margin:0 0 8px; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-card);
}
.article-page__hero img{width:100%; height:auto; aspect-ratio:16 / 9; object-fit:cover;}
.article-page__back{margin-top:48px; padding-top:24px; border-top:1px solid var(--border-soft);}

.entry-content{margin-top:32px; color:var(--body-text); font-size:15.5px; line-height:1.75;}
.entry-content > *{margin-top:0;}
.entry-content h2{
  font-size:21px; margin-top:44px; margin-bottom:14px; padding-top:6px;
  border-top:1px solid var(--border-soft);
}
.entry-content h2:first-of-type{border-top:none; margin-top:32px;}
.entry-content h3{font-size:16.5px; margin-top:26px; margin-bottom:10px;}
.entry-content h4{font-size:14px; margin-top:22px; margin-bottom:8px; letter-spacing:0.04em; text-transform:uppercase;}
.entry-content p{margin:0 0 16px;}
.entry-content ul, .entry-content ol{margin:0 0 16px; padding-left:22px;}
.entry-content li{margin-bottom:8px;}
.entry-content a{font-weight:600; text-decoration:underline; text-decoration-color:rgba(18,160,238,0.35);}
.entry-content a:hover{text-decoration-color:var(--accent-blue);}
.entry-content strong{color:var(--navy);}
.entry-content hr{border:none; border-top:1px solid var(--border-soft); margin:32px 0;}
.entry-content blockquote{
  margin:28px 0; padding:18px 22px; border-left:4px solid var(--accent-green);
  background:var(--bg-alt); border-radius:var(--radius-sm); color:var(--navy);
}
.entry-content blockquote p{margin:0;}
.entry-content blockquote p + p{margin-top:8px;}
.entry-content blockquote cite{display:block; margin-top:8px; font-size:13px; color:var(--muted); font-style:normal;}
.entry-content img{height:auto; border-radius:var(--radius-md);}
.entry-content figure{margin:28px 0;}
.entry-content figcaption{font-size:13px; color:var(--muted); margin-top:8px; text-align:center;}
.entry-content table{width:100%; border-collapse:collapse; margin:0 0 24px; font-size:14.5px;}
.entry-content th, .entry-content td{border:1px solid var(--border-soft); padding:10px 12px; text-align:left; vertical-align:top;}
.entry-content th{background:var(--bg-alt); color:var(--navy); font-weight:700;}
.entry-content code{background:var(--bg-alt); padding:2px 6px; border-radius:6px; font-size:0.92em;}
.entry-content pre{background:var(--navy); color:#E6EEF6; padding:18px; border-radius:var(--radius-md); overflow:auto;}
.entry-content pre code{background:none; padding:0; color:inherit;}
.entry-content .wp-block-button__link{
  background:var(--gradient-cta); color:#fff; border-radius:999px; font-weight:700;
  text-decoration:none; padding:14px 30px; box-shadow:var(--shadow-btn);
}
.entry-content .aligncenter{margin-left:auto; margin-right:auto;}
.entry-content .alignwide, .entry-content .alignfull{max-width:none;}
.entry-content .wp-block-image img{margin:0 auto;}
.entry-content > :last-child{margin-bottom:0;}

.tags{display:flex; flex-wrap:wrap; gap:8px; margin-top:32px;}
.tags a{
  font-size:12px; font-weight:700; color:var(--accent-blue); background:var(--bg-alt);
  padding:5px 12px; border-radius:999px;
}

/* CTA band into the funnels (the point of the whole section) */
.article-cta{margin-top:56px;}
.article-cta .pill-cta-band h2{font-size:clamp(24px, 3vw, 32px);}
.article-cta .pill-cta-band p{max-width:520px; margin:0 auto 26px;}
.article-cta__buttons{display:flex; flex-wrap:wrap; gap:14px; justify-content:center;}
@media (max-width:640px){
  .article-cta .pill-cta-band{padding:36px 22px;}
  .article-cta__buttons .btn{width:100%;}
}

/* Search (404 page) */
.search-form{display:flex; gap:8px; max-width:420px; margin-top:20px;}
.search-form input[type=search]{
  flex:1; font:inherit; padding:11px 16px; border:1.5px solid var(--border-soft);
  border-radius:999px; background:#fff; color:var(--navy);
}
.search-form button{
  font:inherit; font-weight:700; padding:11px 20px; border:none; border-radius:999px;
  background:var(--gradient-cta); color:#fff; cursor:pointer;
}