/*
Theme Name: Custom Auto Theme
Author: System
Version: 1.0
*/

@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;1,9..40,400&family=JetBrains+Mono:wght@400&display=swap');

html{scroll-behavior:smooth;}
html,body{overflow-x:hidden;}
a{display:inline-block;text-align:center;}

:root{
  --bg:#FAFAF8;
  --bg-alt:#F0EFEB;
  --bg-card:#FFFFFF;
  --text:#1A1A1A;
  --text-muted:#6B6B6B;
  --text-light:#999;
  --accent:#2D5F5D;
  --accent-light:#3A7A77;
  --accent-bg:rgba(45,95,93,0.06);
  --border:#D4D2CC;
  --border-light:#E8E6E1;
  --font-heading:'Libre Baskerville',Georgia,serif;
  --font-body:'DM Sans',sans-serif;
  --font-mono:'JetBrains Mono',monospace;
  --max-w:1180px;
  --content-w:720px;
  --radius:3px;
  --shadow:0 1px 3px rgba(0,0,0,0.04);
  --shadow-md:0 4px 16px rgba(0,0,0,0.06);
  --transition:0.25s cubic-bezier(0.4,0,0.2,1);
}

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

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

img{max-width:100%;height:auto;display:block;}

h1,h2,h3,h4{
  font-family:var(--font-heading);
  font-weight:700;
  line-height:1.25;
  color:var(--text);
}

h1{font-size:clamp(1.8rem,4vw,2.6rem);letter-spacing:-0.02em;}
h2{font-size:clamp(1.3rem,2.5vw,1.7rem);letter-spacing:-0.01em;margin-top:2.5rem;}
h3{font-size:clamp(1.05rem,2vw,1.25rem);margin-top:2rem;}

p{margin-bottom:1.2rem;}

a{
  color:var(--accent);
  text-decoration:none;
  transition:color var(--transition);
}
a:hover{color:var(--accent-light);}

/* ── SITE HEADER ── */
.site-header{
  border-bottom:1px solid var(--border);
  background:var(--bg);
  position:sticky;top:0;z-index:100;
}
.site-header-inner{
  max-width:var(--max-w);
  margin:0 auto;
  padding:1rem 2rem;
  display:flex;align-items:center;justify-content:space-between;
}
.site-logo{
  font-family:var(--font-mono);
  font-size:1.3rem;
  color:var(--text);
  letter-spacing:0.08em;
  text-transform:lowercase;
}
.site-logo span{color:var(--accent);font-weight:700;}
.site-nav{display:flex;gap:1.8rem;align-items:center;}
.site-nav a{
  font-size:0.85rem;
  color:var(--text-muted);
  letter-spacing:0.04em;
  text-transform:uppercase;
  font-weight:500;
  position:relative;
}
.site-nav a::after{
  content:'';position:absolute;bottom:-2px;left:0;width:0;height:1px;
  background:var(--accent);transition:width var(--transition);
}
.site-nav a:hover{color:var(--text);}
.site-nav a:hover::after{width:100%;}

/* ── BREADCRUMBS ── */
.breadcrumbs{
  max-width:var(--max-w);margin:0 auto;padding:1.2rem 2rem 0;
  font-size:0.8rem;color:var(--text-light);
  display:flex;gap:0.4rem;align-items:center;
}
.breadcrumbs a{color:var(--text-muted);font-size:0.8rem;}
.breadcrumbs span{color:var(--text-light);}

/* ── ARTICLE LAYOUT ── */
.article-layout{
  max-width:var(--max-w);margin:0 auto;padding:2rem;
  display:grid;
  grid-template-columns:1fr 300px;
  gap:3rem;
  align-items:start;
}
.article-main{max-width:var(--content-w);}
.article-meta{
  display:flex;gap:1.5rem;align-items:center;
  font-size:0.82rem;color:var(--text-muted);
  margin-bottom:1.5rem;padding-bottom:1rem;
  border-bottom:1px solid var(--border-light);
  font-family:var(--font-mono);
}
.meta-dot{width:3px;height:3px;border-radius:50%;background:var(--border);}
.article-main h1{margin-bottom:1.8rem;}

.article-main blockquote{
  border-left:2px solid var(--accent);
  padding:1rem 1.5rem;
  margin:2rem 0;
  background:var(--accent-bg);
  font-style:italic;
  color:var(--text-muted);
  font-size:1.05rem;
}

.article-main .data-point{
  background:var(--bg-card);
  border:1px solid var(--border-light);
  border-radius:var(--radius);
  padding:1.2rem 1.5rem;
  margin:1.8rem 0;
  display:flex;align-items:center;gap:1rem;
}
.data-point .dp-num{
  font-family:var(--font-mono);
  font-size:1.6rem;
  color:var(--accent);
  font-weight:700;
  min-width:60px;
}
.data-point .dp-text{font-size:0.92rem;color:var(--text-muted);}

.key-list{
  display:flex;flex-direction:column;gap:0.8rem;
  margin:1.5rem 0;
}
.key-item{
  display:flex;align-items:flex-start;gap:0.8rem;
  padding:0.8rem 1rem;
  background:var(--bg-alt);
  border-radius:var(--radius);
}
.key-item .ki-num{
  font-family:var(--font-mono);font-size:0.85rem;
  color:var(--accent);font-weight:700;min-width:28px;
}
.key-item .ki-body{font-size:0.95rem;}
.key-item .ki-body strong{font-weight:600;}

/* ── ASIDE / SIDEBAR ── */
.article-aside{position:sticky;top:5rem;}
.aside-gallery{
  display:grid;grid-template-columns:1fr 1fr;gap:0.6rem;
  margin-bottom:2rem;
}
.aside-gallery .gallery-img{
  aspect-ratio:1;
  background:var(--bg-alt);
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid var(--border-light);
}
.aside-gallery .gallery-img img{
  width:100%;height:100%;object-fit:cover;
  transition:transform 0.4s ease;
}
.aside-gallery .gallery-img:hover img{transform:scale(1.05);}
.aside-box{
  background:var(--bg-card);
  border:1px solid var(--border-light);
  border-radius:var(--radius);
  padding:1.5rem;
  margin-bottom:1.5rem;
}
.aside-box h3{font-size:0.95rem;margin-bottom:0.8rem;margin-top:0;}
.aside-box p{font-size:0.88rem;color:var(--text-muted);margin-bottom:0.5rem;}

/* ── READ ALSO ── */
.read-also{
  max-width:var(--max-w);margin:0 auto;padding:2rem 2rem 0;
}
.read-also h2{
  font-size:1rem;text-transform:uppercase;letter-spacing:0.08em;
  color:var(--text-muted);font-family:var(--font-body);font-weight:600;
  margin-bottom:1.5rem;margin-top:0;
}
.read-also-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;
}
.read-also-card{
  background:var(--bg-card);
  border:1px solid var(--border-light);
  border-radius:var(--radius);
  padding:1.5rem;
  transition:box-shadow var(--transition),transform var(--transition);
}
.read-also-card:hover{
  box-shadow:var(--shadow-md);
  transform:translateY(-2px);
}
.read-also-card .rac-cat{
  font-size:0.72rem;text-transform:uppercase;letter-spacing:0.1em;
  color:var(--accent);font-family:var(--font-mono);margin-bottom:0.6rem;
}
.read-also-card h3{font-size:1rem;margin-top:0;line-height:1.35;}
.read-also-card p{font-size:0.85rem;color:var(--text-muted);margin-top:0.5rem;}
.read-also-card .rac-link{
  font-size:0.8rem;color:var(--accent);margin-top:0.8rem;
  font-weight:500;
}

/* ── SUBSCRIBE ── */
.subscribe-section{
  max-width:var(--max-w);margin:2.5rem auto 0;padding:0 2rem;
}
.subscribe-box{
  background:var(--bg-alt);
  border:1px solid var(--border-light);
  border-radius:var(--radius);
  padding:2.5rem;
  display:flex;align-items:center;gap:2rem;
}
.subscribe-box .sb-text{flex:1;}
.subscribe-box .sb-text h2{margin-top:0;font-size:1.2rem;margin-bottom:0.4rem;}
.subscribe-box .sb-text p{font-size:0.9rem;color:var(--text-muted);margin:0;}
.subscribe-box .sb-form{display:flex;gap:0.6rem;}
.subscribe-box input[type="email"]{
  font-family:var(--font-body);
  font-size:0.9rem;
  padding:0.7rem 1rem;
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:var(--bg);
  color:var(--text);
  width:260px;
  transition:border-color var(--transition);
}
.subscribe-box input[type="email"]:focus{
  outline:none;border-color:var(--accent);
}
.subscribe-box button{
  font-family:var(--font-body);
  font-size:0.85rem;
  padding:0.7rem 1.5rem;
  background:var(--accent);color:#fff;
  border:none;border-radius:var(--radius);
  cursor:pointer;font-weight:500;
  letter-spacing:0.03em;
  transition:background var(--transition);
}
.subscribe-box button:hover{background:var(--accent-light);}

/* ── DISCLAIMER ── */
.disclaimer{
  max-width:var(--max-w);margin:2rem auto;padding:0 2rem;
}
.disclaimer-inner{
  padding:1rem 1.5rem;
  border:1px dashed var(--border);
  border-radius:var(--radius);
  font-size:0.8rem;
  color:var(--text-light);
  line-height:1.6;
}

/* ── FOOTER ── */
.site-footer{
  border-top:1px solid var(--border);
  margin-top:3rem;padding:2rem;
}
.footer-inner{
  max-width:var(--max-w);margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:1rem;
}
.footer-left{font-size:0.82rem;color:var(--text-muted);}
.footer-links{display:flex;gap:1.2rem;}
.footer-links a{font-size:0.8rem;color:var(--text-muted);}
.footer-links a:hover{color:var(--accent);}
.footer-disclaimer{
  width:100%;margin-top:1rem;padding-top:1rem;
  border-top:1px solid var(--border-light);
  font-size:0.75rem;color:var(--text-light);text-align:center;
}

/* ── COOKIE MODAL ── */
.cookie-modal{
  position:fixed;bottom:1.5rem;right:1.5rem;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:1.5rem;
  max-width:360px;width:90%;
  box-shadow:var(--shadow-md);
  z-index:999;
  animation:slideUp 0.4s ease;
}
@keyframes slideUp{
  from{opacity:0;transform:translateY(20px);}
  to{opacity:1;transform:translateY(0);}
}
.cookie-modal h4{font-size:0.95rem;margin-bottom:0.5rem;}
.cookie-modal p{font-size:0.82rem;color:var(--text-muted);margin-bottom:1rem;}
.cookie-btns{display:flex;gap:0.6rem;}
.cookie-btns button{
  font-family:var(--font-body);
  font-size:0.8rem;
  padding:0.5rem 1.2rem;
  border-radius:var(--radius);
  cursor:pointer;
  border:1px solid var(--border);
  transition:all var(--transition);
}
.cookie-accept{background:var(--accent);color:#fff;border-color:var(--accent)!important;}
.cookie-accept:hover{background:var(--accent-light);}
.cookie-decline{background:transparent;color:var(--text-muted);}
.cookie-decline:hover{border-color:var(--text-muted);}

/* ── HOME HERO ── */
.home-hero{
  max-width:var(--max-w);margin:0 auto;padding:4rem 2rem 2rem;
  text-align:center;
}
.home-hero .hero-label{
  font-family:var(--font-mono);font-size:0.75rem;
  text-transform:uppercase;letter-spacing:0.15em;
  color:var(--accent);margin-bottom:1rem;display:block;
}
.home-hero h1{margin-bottom:1rem;}
.home-hero .hero-sub{
  font-size:1.05rem;color:var(--text-muted);max-width:600px;margin:0 auto;
}

/* ── LEGAL PAGES ── */
.legal-page{
  max-width:var(--content-w);margin:0 auto;padding:3rem 2rem;
}
.legal-page h1{margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid var(--accent);}
.legal-page h2{margin-top:2.5rem;margin-bottom:1rem;font-size:1.15rem;}
.legal-page p,.legal-page li{font-size:0.95rem;line-height:1.75;color:var(--text-muted);}

/* ── SUCCESS ── */
.success-page{
  min-height:60vh;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;
  padding:4rem 2rem;
}
.success-page h1{font-size:clamp(2rem,5vw,3rem);margin-bottom:1rem;color:var(--accent);}
.success-page p{font-size:1.1rem;color:var(--text-muted);margin-bottom:2rem;}
.success-page .back-btn{
  display:inline-block;
  padding:0.8rem 2rem;
  background:var(--accent);color:#fff;
  border-radius:var(--radius);
  font-weight:500;font-size:0.95rem;
  transition:background var(--transition);
}
.success-page .back-btn:hover{background:var(--accent-light);}

/* ── 404 ── */
.page-404{
  min-height:70vh;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;
  padding:4rem 2rem;
}
.page-404 .four-num{
  font-family:var(--font-mono);
  font-size:clamp(6rem,15vw,10rem);
  color:var(--border);
  line-height:1;
  letter-spacing:-0.05em;
}
.page-404 h1{font-size:1.5rem;margin:1rem 0 0.5rem;}
.page-404 p{color:var(--text-muted);margin-bottom:2rem;}
.page-404 .back-btn{
  display:inline-block;
  padding:0.8rem 2rem;
  background:var(--accent);color:#fff;
  border-radius:var(--radius);
  font-weight:500;
  transition:background var(--transition);
}
.page-404 .back-btn:hover{background:var(--accent-light);}

/* ── MOBILE NAV ── */
.nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:0.5rem;}
.nav-toggle span{display:block;width:20px;height:2px;background:var(--text);margin:4px 0;transition:var(--transition);}

/* ── RESPONSIVE ── */
@media(max-width:900px){
  .article-layout{grid-template-columns:1fr;gap:2rem;}
  .article-aside{position:static;}
  .read-also-grid{grid-template-columns:1fr;}
  .subscribe-box{flex-direction:column;text-align:center;}
  .subscribe-box .sb-form{flex-direction:column;width:100%;}
  .subscribe-box input[type="email"]{width:100%;}
}
@media(max-width:640px){
  .site-nav{
    display:none;position:absolute;top:100%;left:0;right:0;
    background:var(--bg);border-bottom:1px solid var(--border);
    flex-direction:column;padding:1rem 2rem;gap:1rem;
  }
  .site-nav.open{display:flex;}
  .nav-toggle{display:block;}
  .site-header-inner{padding:0.8rem 1.5rem;}
  .breadcrumbs{padding:0.8rem 1.5rem 0;}
  .article-layout{padding:1.5rem;}
  .home-hero{padding:2.5rem 1.5rem 1.5rem;}
  .footer-inner{flex-direction:column;text-align:center;}
  .aside-gallery{grid-template-columns:repeat(4,1fr);}
}