/* SmartGolfHub — Blog shared stylesheet. Extends brand system from index.html */
:root{
  --forest:#2E4A37;
  --forest-dark:#21361F;
  --ivory:#E8E1CA;
  --mist:#F5F2E9;
  --ink:#0A0A0A;
  --brass:#B8935A;
  --fairway:#6B8E5A;
  --muted:#6B6B63;
  --rule:rgba(10,10,10,.12);
  --serif: 'Fraunces', 'Georgia', serif;
  --sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--mist);
  color:var(--ink);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
a{color:inherit; text-decoration:none;}
.serif{font-family:var(--serif);}
.container{max-width:1180px; margin:0 auto; padding:0 32px;}
.container-narrow{max-width:760px; margin:0 auto; padding:0 32px;}
.tag{
  font-family:var(--sans); font-size:11px; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase; color:var(--brass);
}
h1,h2,h3{font-family:var(--serif); font-style:italic; font-weight:400; line-height:1.1; letter-spacing:-0.01em;}
h1{font-size:clamp(36px, 5.5vw, 58px); color:var(--forest);}
h2{font-size:clamp(26px, 3.4vw, 36px); color:var(--forest); margin:48px 0 18px;}
h3{font-size:clamp(20px, 2.2vw, 24px); color:var(--forest); margin:32px 0 12px;}
p.lede{font-size:20px; line-height:1.55; color:var(--muted);}

/* Nav (shared) */
@media(max-width:780px){ nav ul li.hide-m{display:none;} }

/* Blog index hero */
.blog-hero{padding:90px 0 60px; background:radial-gradient(1200px 500px at 80% -10%, rgba(46,74,55,.08), transparent 60%), var(--mist);}
.blog-hero .eyebrow{margin-bottom:20px;}
.blog-hero h1{max-width:820px; margin-bottom:20px;}
.blog-hero p.lede{max-width:620px;}

/* Post cards */
.post-list{padding:0 0 120px;}

/* Post page */
.post-hero{padding:70px 0 40px;}
.post-hero .meta-row{display:flex; gap:16px; align-items:center; margin:20px 0 30px; flex-wrap:wrap;}
.post-hero .meta-row span{font-size:13px; color:var(--muted);}
.post-hero .meta-row .dot{width:4px; height:4px; border-radius:50%; background:var(--muted); display:inline-block;}
article{padding:0 0 100px;}
article .container-narrow p{font-size:18px; color:var(--ink); margin-bottom:20px; line-height:1.65;}
article .container-narrow ul, article .container-narrow ol{margin:0 0 24px 22px; font-size:18px; line-height:1.6;}
article .container-narrow li{margin-bottom:8px;}
.standfirst{font-size:21px; line-height:1.55; color:var(--muted); border-left:3px solid var(--brass); padding-left:22px; margin:0 0 44px;}
.pull{background:var(--forest); color:var(--ivory); border-radius:6px; padding:40px 36px; margin:44px 0; }
.pull p{color:var(--ivory) !important; font-family:var(--serif); font-style:italic; font-size:24px !important; line-height:1.35 !important; margin:0 !important;}
.faq{border-top:1px solid var(--rule); padding-top:40px; margin-top:56px;}
.faq-item{border-bottom:1px solid var(--rule); padding:22px 0;}
.faq-item h3{margin:0 0 10px; font-size:19px;}
.faq-item p{font-size:16px !important; color:var(--muted) !important;}
.tags-row{display:flex; gap:10px; flex-wrap:wrap; margin:36px 0;}
.tags-row span{font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--forest); background:var(--ivory); padding:6px 14px; border-radius:999px;}

/* CTA box (shared with site) */
.cta-section{background:var(--mist); padding:80px 0 100px;}
.cta-box{background:var(--forest); color:var(--ivory); border-radius:6px; padding:56px 44px; text-align:center; background-image:radial-gradient(800px 300px at 20% 0%, rgba(184,147,90,.18), transparent 60%), linear-gradient(180deg, var(--forest), var(--forest-dark));}
.cta-box .tag{color:var(--brass);}
.cta-box h2{color:var(--ivory); margin:16px 0 16px; max-width:640px; margin-left:auto; margin-right:auto;}
.cta-box p{color:rgba(232,225,202,.85) !important; max-width:520px; margin:0 auto 30px !important; font-size:16px !important;}
.cta-box .btn-ivory{background:var(--ivory); color:var(--forest); padding:15px 28px; border-radius:999px; font-weight:600; font-size:15px; display:inline-block; border:1.5px solid var(--ivory);}
.cta-box .btn-ivory:hover{background:var(--brass); color:var(--ivory); border-color:var(--brass);}

/* Footer (shared) */
@media(max-width:780px){ footer .wrap{grid-template-columns:1fr;} footer .links{grid-template-columns:repeat(2,1fr);} }
