/*
Theme Name: Custom Auto Theme
Author: System
Version: 1.0
*/
@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,400;0,700;0,900;1,400&family=Source+Sans+3:ital,wght@0,300;0,400;0,600;0,700;1,400&display=swap');

html{scroll-behavior:smooth}
a{display:inline-block;text-align:center}

:root{
--c-primary:#111827;
--c-accent:#ff6b35;
--c-bg:#ffffff;
--c-bg2:#f9fafb;
--c-text:#111827;
--c-text-light:#4b5563;
--c-border:#e5e7eb;
--c-accent-light:#fff0e9;
--radius:4px;
--shadow:0 1px 3px rgba(0,0,0,.08),0 1px 2px rgba(0,0,0,.06);
--shadow-lg:0 4px 14px rgba(0,0,0,.1);
--font-heading:'Merriweather',Georgia,serif;
--font-body:'Source Sans 3','Source Sans Pro',sans-serif;
--max-w:1140px;
--article-w:720px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

body{
font-family:var(--font-body);
color:var(--c-text);
background:var(--c-bg);
line-height:1.75;
font-size:17px;
-webkit-font-smoothing:antialiased;
}

img{max-width:100%;height:auto;display:block;border-radius:var(--radius)}

h1,h2,h3,h4{font-family:var(--font-heading);line-height:1.3;color:var(--c-primary)}
h1{font-size:clamp(1.8rem,4vw,2.6rem);font-weight:900}
h2{font-size:clamp(1.3rem,3vw,1.7rem);font-weight:700;margin:2rem 0 1rem}
h3{font-size:1.15rem;font-weight:700}

p{margin-bottom:1rem}

a{color:var(--c-accent);text-decoration:none;transition:color .2s}
a:hover{color:#e55a28}

/* ── LAYOUT ── */
.container{max-width:var(--max-w);margin:0 auto;padding:0 1.25rem}
.narrow{max-width:var(--article-w);margin:0 auto}

/* ── HEADER ── */
.site-header{
background:var(--c-bg);
border-bottom:1px solid var(--c-border);
padding:1rem 0;
position:sticky;
top:0;
z-index:100;
backdrop-filter:blur(10px);
background:rgba(255,255,255,.95);
}
.site-header .container{display:flex;align-items:center;justify-content:space-between}
.site-logo{
font-family:var(--font-heading);
font-size:1.5rem;
font-weight:900;
color:var(--c-primary);
letter-spacing:-.02em;
}
.site-logo:hover{color:var(--c-accent)}

.nav-list{display:flex;gap:1.5rem;list-style:none;align-items:center}
.nav-list a{font-size:.95rem;color:var(--c-text-light);font-weight:600;padding:.25rem 0;position:relative}
.nav-list a::after{content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background:var(--c-accent);transition:width .3s}
.nav-list a:hover{color:var(--c-primary)}
.nav-list a:hover::after{width:100%}

.burger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:.5rem}
.burger span{display:block;width:24px;height:2px;background:var(--c-primary);transition:transform .3s,opacity .3s}

@media(max-width:768px){
.burger{display:flex}
.nav-list{
  display:none;
  position:absolute;
  top:100%;
  left:0;
  right:0;
  background:var(--c-bg);
  flex-direction:column;
  padding:1rem 1.25rem;
  gap:.75rem;
  border-bottom:1px solid var(--c-border);
  box-shadow:var(--shadow-lg);
}
.nav-list.open{display:flex}
}

/* ── BREADCRUMBS ── */
.breadcrumbs{
padding:1rem 0;
font-size:.85rem;
color:var(--c-text-light);
}
.breadcrumbs a{color:var(--c-text-light);font-weight:400}
.breadcrumbs a:hover{color:var(--c-accent)}
.breadcrumbs span{margin:0 .4rem;opacity:.5}

/* ── ARTICLE ── */
.article-hero{padding:2rem 0 1rem;text-align:center}
.article-meta{
display:flex;
align-items:center;
justify-content:center;
gap:1rem;
font-size:.9rem;
color:var(--c-text-light);
margin-bottom:1.25rem;
flex-wrap:wrap;
}
.article-meta .divider{width:4px;height:4px;border-radius:50%;background:var(--c-border);display:inline-block}
.article-category{
display:inline-block;
background:var(--c-accent-light);
color:var(--c-accent);
font-size:.8rem;
font-weight:600;
padding:.2rem .65rem;
border-radius:var(--radius);
text-transform:uppercase;
letter-spacing:.03em;
}

.article-lead{
font-size:1.15rem;
color:var(--c-text-light);
line-height:1.8;
max-width:var(--article-w);
margin:1rem auto 2rem;
text-align:center;
}

.article-body{padding-bottom:2rem}
.article-body h2{border-bottom:2px solid var(--c-accent);padding-bottom:.4rem;display:inline-block}
.article-body p{color:var(--c-text);line-height:1.85}

.article-two-col{
display:grid;
grid-template-columns:1fr 1fr;
gap:2rem;
}
@media(max-width:768px){.article-two-col{grid-template-columns:1fr}}

/* ── AUTHOR BLOCK (with photo) ── */
.author-hero{
display:flex;
align-items:center;
gap:1.5rem;
margin-bottom:2rem;
}
.author-hero img{
width:80px;
height:80px;
border-radius:50%;
object-fit:cover;
border:3px solid var(--c-accent);
}
.author-hero-info .author-name{font-family:var(--font-heading);font-size:1rem;font-weight:700}
.author-hero-info .author-role{font-size:.85rem;color:var(--c-text-light)}

.author-box{
display:flex;
align-items:center;
gap:1.5rem;
padding:1.5rem;
background:var(--c-bg2);
border-radius:var(--radius);
margin:2rem 0;
border-left:4px solid var(--c-accent);
}
.author-box .author-avatar{
width:64px;
height:64px;
border-radius:50%;
background:var(--c-accent-light);
display:flex;
align-items:center;
justify-content:center;
font-size:1.5rem;
font-weight:700;
color:var(--c-accent);
flex-shrink:0;
}
.author-box .author-details{flex:1}
.author-box .author-name{font-weight:700;font-family:var(--font-heading);font-size:1.05rem}
.author-box .author-bio{font-size:.9rem;color:var(--c-text-light);margin-top:.25rem;margin-bottom:0}

/* ── SUBSCRIBE TO AUTHOR ── */
.subscribe-author{
text-align:center;
padding:2rem;
background:var(--c-bg2);
border-radius:var(--radius);
margin:2rem 0;
}
.subscribe-author h3{margin-bottom:.5rem}
.subscribe-author p{color:var(--c-text-light);font-size:.95rem;margin-bottom:1rem}
.btn-subscribe{
display:inline-block;
background:var(--c-accent);
color:#fff;
padding:.65rem 1.5rem;
border-radius:var(--radius);
font-weight:600;
font-size:.95rem;
transition:background .2s,transform .15s;
border:none;
cursor:pointer;
}
.btn-subscribe:hover{background:#e55a28;color:#fff;transform:translateY(-1px)}

/* ── PULL QUOTE ── */
.pull-quote{
border-left:4px solid var(--c-accent);
padding:1.25rem 1.5rem;
margin:2rem 0;
background:var(--c-bg2);
border-radius:0 var(--radius) var(--radius) 0;
font-family:var(--font-heading);
font-size:1.15rem;
font-style:italic;
color:var(--c-primary);
line-height:1.6;
}

.wide-quote{
background:var(--c-primary);
color:#fff;
padding:3rem 2rem;
text-align:center;
margin:2.5rem -1.25rem;
border-radius:var(--radius);
}
.wide-quote blockquote{
font-family:var(--font-heading);
font-size:clamp(1.1rem,2.5vw,1.4rem);
font-style:italic;
line-height:1.6;
margin-bottom:1rem;
}
.wide-quote cite{font-size:.9rem;opacity:.8;font-style:normal}

/* ── READING TIME ── */
.reading-time{
display:inline-flex;
align-items:center;
gap:.4rem;
font-size:.85rem;
color:var(--c-text-light);
background:var(--c-bg2);
padding:.35rem .75rem;
border-radius:var(--radius);
margin-bottom:1.5rem;
}
.reading-time svg{width:16px;height:16px;stroke:var(--c-accent);fill:none}

/* ── KEY TAKEAWAYS ── */
.key-takeaways{
background:var(--c-accent-light);
border-radius:var(--radius);
padding:1.5rem;
margin-bottom:2rem;
}
.key-takeaways h3{color:var(--c-accent);margin-bottom:.75rem;font-size:1rem}
.key-takeaways ul{list-style:none;padding:0}
.key-takeaways li{
padding:.5rem 0;
padding-left:1.75rem;
position:relative;
font-size:.95rem;
color:var(--c-text);
border-bottom:1px solid rgba(255,107,53,.12);
}
.key-takeaways li:last-child{border-bottom:none}
.key-takeaways li::before{
content:'\2713';
position:absolute;
left:0;
color:var(--c-accent);
font-weight:700;
}

/* ── TAGS ── */
.article-tags{
display:flex;
flex-wrap:wrap;
gap:.5rem;
margin:1.5rem 0;
justify-content:flex-start;
}
.article-tags a,.tag{
display:inline-block;
background:var(--c-bg2);
color:var(--c-text-light);
font-size:.8rem;
padding:.3rem .7rem;
border-radius:var(--radius);
border:1px solid var(--c-border);
transition:all .2s;
}
.article-tags a:hover,.tag:hover{
background:var(--c-accent-light);
color:var(--c-accent);
border-color:var(--c-accent);
}

/* ── READ ALSO ── */
.read-also{padding:2.5rem 0;border-top:1px solid var(--c-border);margin-top:2rem}
.read-also h2{text-align:center;margin-bottom:1.5rem;border:none;display:block}
.read-also-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.25rem}
.read-also-card{
background:var(--c-bg);
border:1px solid var(--c-border);
border-radius:var(--radius);
padding:1.25rem;
transition:box-shadow .25s,transform .25s;
}
.read-also-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}
.read-also-card .card-category{font-size:.75rem;color:var(--c-accent);font-weight:600;text-transform:uppercase;letter-spacing:.03em}
.read-also-card h3{font-size:1rem;margin:.5rem 0;line-height:1.4}
.read-also-card h3 a{color:var(--c-primary)}
.read-also-card h3 a:hover{color:var(--c-accent)}
.read-also-card p{font-size:.85rem;color:var(--c-text-light);margin-bottom:0;line-height:1.6}

/* ── SUBSCRIPTION FORM ── */
.subscribe-section{
background:var(--c-primary);
padding:3rem 1.25rem;
text-align:center;
border-radius:var(--radius);
margin:2rem 0;
}
.subscribe-section h2{color:#fff;border:none;display:block;margin-bottom:.5rem}
.subscribe-section p{color:rgba(255,255,255,.75);margin-bottom:1.25rem}
.subscribe-form{
display:flex;
gap:.5rem;
max-width:460px;
margin:0 auto;
}
.subscribe-form input[type='email']{
flex:1;
padding:.7rem 1rem;
border:2px solid rgba(255,255,255,.2);
background:rgba(255,255,255,.1);
color:#fff;
border-radius:var(--radius);
font-size:1rem;
font-family:var(--font-body);
transition:border-color .2s;
}
.subscribe-form input[type='email']::placeholder{color:rgba(255,255,255,.5)}
.subscribe-form input[type='email']:focus{outline:none;border-color:var(--c-accent)}
.subscribe-form button{
background:var(--c-accent);
color:#fff;
border:none;
padding:.7rem 1.5rem;
border-radius:var(--radius);
font-weight:600;
font-size:.95rem;
cursor:pointer;
font-family:var(--font-body);
white-space:nowrap;
transition:background .2s;
}
.subscribe-form button:hover{background:#e55a28}
@media(max-width:520px){.subscribe-form{flex-direction:column}}

/* ── FOOTER ── */
.site-footer{
background:var(--c-primary);
color:rgba(255,255,255,.7);
padding:2.5rem 0 1.5rem;
font-size:.9rem;
margin-top:3rem;
}
.footer-inner{
display:flex;
justify-content:space-between;
align-items:flex-start;
flex-wrap:wrap;
gap:1.5rem;
}
.footer-brand .site-logo{color:#fff;font-size:1.25rem;margin-bottom:.5rem}
.footer-brand .site-logo:hover{color:var(--c-accent)}
.footer-links{display:flex;gap:1.25rem;flex-wrap:wrap}
.footer-links a{color:rgba(255,255,255,.6);font-size:.85rem}
.footer-links a:hover{color:#fff}
.footer-disclaimer{
margin-top:1.5rem;
padding-top:1.25rem;
border-top:1px solid rgba(255,255,255,.1);
font-size:.8rem;
color:rgba(255,255,255,.45);
line-height:1.6;
}
.footer-copy{margin-top:.75rem;font-size:.8rem;color:rgba(255,255,255,.4)}

/* ── TOC ── */
.toc{
background:var(--c-bg2);
border:1px solid var(--c-border);
border-radius:var(--radius);
padding:1.25rem 1.5rem;
margin-bottom:2rem;
}
.toc h3{font-size:.95rem;margin-bottom:.75rem;color:var(--c-primary)}
.toc ol{padding-left:1.25rem}
.toc li{padding:.3rem 0;font-size:.9rem}
.toc a{color:var(--c-text-light);font-weight:400}
.toc a:hover{color:var(--c-accent)}

/* ── LIFE STORY BLOCK ── */
.life-story{
background:linear-gradient(135deg,var(--c-accent-light),#fff);
border-radius:var(--radius);
padding:2rem;
margin:2rem 0;
border:1px solid rgba(255,107,53,.15);
}
.life-story h3{color:var(--c-accent);margin-bottom:.75rem}
.life-story p{color:var(--c-text);font-size:.95rem;line-height:1.8}

/* ── COOKIE MODAL (CSS only) ── */
.cookie-toggle{display:none}
.cookie-modal{
position:fixed;
bottom:1.25rem;
right:1.25rem;
max-width:380px;
background:var(--c-bg);
border:1px solid var(--c-border);
border-radius:var(--radius);
padding:1.25rem;
box-shadow:var(--shadow-lg);
z-index:999;
font-size:.88rem;
line-height:1.6;
animation:slideUp .4s ease;
}
.cookie-toggle:checked~.cookie-modal{display:none}
.cookie-modal p{color:var(--c-text-light);margin-bottom:.75rem}
.cookie-modal a{font-size:.85rem}
.cookie-actions{display:flex;gap:.5rem;margin-top:.75rem}
.cookie-actions label{
padding:.45rem 1rem;
border-radius:var(--radius);
font-weight:600;
font-size:.85rem;
cursor:pointer;
transition:background .2s;
}
.cookie-accept{background:var(--c-accent);color:#fff}
.cookie-accept:hover{background:#e55a28}
.cookie-decline{background:var(--c-bg2);color:var(--c-text-light);border:1px solid var(--c-border)}
.cookie-decline:hover{background:var(--c-border)}

@keyframes slideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

/* ── DISCLAIMER ── */
.disclaimer{
background:var(--c-bg2);
border-left:3px solid var(--c-border);
padding:1rem 1.25rem;
font-size:.85rem;
color:var(--c-text-light);
line-height:1.6;
margin:2rem 0 1rem;
border-radius:0 var(--radius) var(--radius) 0;
}

/* ── ANIMATIONS ── */
@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.article-body,.article-hero,.read-also,.subscribe-section{animation:fadeIn .5s ease both}

/* ── 404 ── */
.page-404{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
min-height:60vh;
text-align:center;
padding:2rem;
}
.page-404 h1{font-size:clamp(4rem,10vw,8rem);color:var(--c-accent);margin-bottom:.5rem;line-height:1}
.page-404 p{color:var(--c-text-light);font-size:1.1rem;margin-bottom:1.5rem}
.page-404 a{
background:var(--c-accent);
color:#fff;
padding:.65rem 1.5rem;
border-radius:var(--radius);
font-weight:600;
transition:background .2s;
}
.page-404 a:hover{background:#e55a28;color:#fff}

/* ── SUCCESS PAGE ── */
.success-page{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
min-height:60vh;
text-align:center;
padding:2rem;
}
.success-page h1{color:var(--c-accent);margin-bottom:.75rem}
.success-page p{color:var(--c-text-light);font-size:1.05rem;margin-bottom:1.5rem;max-width:480px}
.success-page a{
background:var(--c-accent);
color:#fff;
padding:.65rem 1.5rem;
border-radius:var(--radius);
font-weight:600;
}
.success-page a:hover{background:#e55a28;color:#fff}

/* ── POLICY PAGES ── */
.policy-page{padding:2rem 0}
.policy-page h1{margin-bottom:1.5rem}
.policy-page h2{margin-top:2rem;margin-bottom:.75rem;border:none;display:block}
.policy-page p{color:var(--c-text);line-height:1.8}