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

:root {
  --aqua: #7BAFA5;
  --aqua-light: #A5D4CC;
  --aqua-dark: #5A8F85;
  --plum: #7B4B8A;
  --plum-light: #9B6BAA;
  --plum-dark: #5B2B6A;
  --ivory: #F5F0E8;
  --ivory-dark: #E8E0D0;
  --silver: #B8B8C0;
  --silver-light: #D8D8DE;
  --dark: #121220;
  --dark-mid: #1E1E30;
  --dark-light: #2A2A40;
  --radius: 18px;
  --transition: .35s cubic-bezier(.4,0,.2,1);
}

html{scroll-behavior:smooth}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400&family=Source+Sans+3:wght@300;400;600;700&display=swap');

body{
  font-family:'Source Sans 3',sans-serif;
  background:var(--dark);
  color:var(--ivory);
  line-height:1.75;
  font-size:16px;
  overflow-x:hidden;
}

h1,h2,h3,h4{font-family:'Playfair Display',Georgia,serif;font-weight:700;line-height:1.25}
h1{font-size:clamp(2rem,5vw,3.4rem)}
h2{font-size:clamp(1.5rem,3.5vw,2.4rem);margin-bottom:.6em}
h3{font-size:clamp(1.2rem,2.5vw,1.6rem);margin-bottom:.4em}

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

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

/* ─── HEADER ─── */
.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(18,18,32,.92);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(184,184,192,.12);
}
.header-inner{
  max-width:1280px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:.9rem 1.5rem;
}
.logo{
  font-family:'Playfair Display',serif;font-size:1.6rem;font-weight:700;
  color:var(--ivory);
  display:flex;align-items:center;gap:.5rem;
}
.logo-wave{display:inline-block;color:var(--aqua);font-size:1.3rem}
.nav-list{display:flex;gap:1.8rem;list-style:none}
.nav-list a{
  color:var(--silver-light);font-weight:600;font-size:.95rem;
  position:relative;padding-bottom:2px;
}
.nav-list a::after{
  content:'';position:absolute;bottom:0;left:0;width:0;height:2px;
  background:var(--aqua);transition:width var(--transition);
}
.nav-list a:hover{color:var(--ivory)}
.nav-list a:hover::after{width:100%}

.burger{display:none;background:none;border:none;cursor:pointer;padding:8px}
.burger span{display:block;width:26px;height:2px;background:var(--ivory);margin:6px 0;transition:var(--transition)}

@media(max-width:768px){
  .burger{display:block}
  .nav-list{
    display:none;flex-direction:column;
    position:absolute;top:100%;left:0;right:0;
    background:rgba(18,18,32,.97);padding:1.5rem;gap:1.2rem;
    border-bottom:1px solid var(--silver);
  }
  .nav-list.open{display:flex}
}

/* ─── WAVE DIVIDERS ─── */
.wave-divider{
  width:100%;height:80px;overflow:hidden;position:relative;
}
.wave-divider svg{
  position:absolute;bottom:0;width:100%;height:100%;
}
.wave-divider--flip{transform:scaleY(-1)}

/* ─── HERO ─── */
.hero{
  position:relative;min-height:85vh;
  display:flex;align-items:flex-end;
  padding:2rem 1.5rem 4rem;
  background:linear-gradient(165deg,var(--dark) 0%,var(--dark-mid) 40%,var(--plum-dark) 100%);
  overflow:hidden;
}
.hero::before{
  content:'';position:absolute;top:-30%;right:-20%;
  width:700px;height:700px;border-radius:50%;
  background:radial-gradient(circle,rgba(123,175,165,.18) 0%,transparent 70%);
  animation:heroFloat 8s ease-in-out infinite;
}
.hero::after{
  content:'';position:absolute;bottom:-15%;left:-10%;
  width:500px;height:500px;border-radius:50%;
  background:radial-gradient(circle,rgba(123,75,138,.15) 0%,transparent 70%);
  animation:heroFloat 10s ease-in-out infinite reverse;
}
@keyframes heroFloat{
  0%,100%{transform:translate(0,0) scale(1)}
  50%{transform:translate(30px,-20px) scale(1.05)}
}
.hero-content{
  position:relative;z-index:2;max-width:720px;
}
.hero-label{
  display:inline-block;
  background:var(--aqua);color:var(--dark);
  padding:.25rem .9rem;border-radius:30px;
  font-size:.8rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.08em;margin-bottom:1rem;
}
.hero h1{margin-bottom:1rem}
.hero p{font-size:1.15rem;color:var(--silver-light);max-width:560px;margin-bottom:1.5rem}
.hero-cta{
  display:inline-flex;align-items:center;gap:.5rem;
  background:var(--plum);color:var(--ivory);
  padding:.85rem 2rem;border-radius:40px;
  font-weight:600;transition:var(--transition);
}
.hero-cta:hover{background:var(--plum-light);color:#fff;transform:translateY(-2px)}

/* ─── LAYOUT ─── */
.container{max-width:1280px;margin:0 auto;padding:0 1.5rem}
.section{padding:4rem 0}

.grid-main{
  display:grid;
  grid-template-columns:1fr 340px;
  gap:3rem;
}
@media(max-width:960px){
  .grid-main{grid-template-columns:1fr;gap:2rem}
}

/* ─── SIDEBAR ─── */
.sidebar{display:flex;flex-direction:column;gap:2rem}
.sidebar-card{
  background:var(--dark-mid);
  border:1px solid rgba(184,184,192,.1);
  border-radius:var(--radius);padding:1.5rem;
  transition:var(--transition);
}
.sidebar-card:hover{border-color:var(--aqua);transform:translateY(-3px)}
.sidebar-card h3{color:var(--aqua-light);font-size:1.05rem}
.sidebar-card p{color:var(--silver);font-size:.9rem;margin-top:.4rem}

/* ─── ARTICLE BODY ─── */
.article-body p{
  margin-bottom:1.2rem;color:var(--ivory-dark);font-size:1.05rem;
}
.article-body h2{color:var(--aqua-light);margin-top:2.5rem}
.article-body h3{color:var(--plum-light);margin-top:1.8rem}

/* ─── QUOTE ─── */
.pullquote{
  position:relative;
  margin:2.5rem 0;padding:2rem 2rem 2rem 3rem;
  background:linear-gradient(135deg,rgba(123,75,138,.12),rgba(123,175,165,.08));
  border-left:4px solid var(--plum);
  border-radius:0 var(--radius) var(--radius) 0;
  font-family:'Playfair Display',serif;
  font-style:italic;font-size:1.2rem;
  color:var(--ivory);
}
.pullquote cite{
  display:block;margin-top:.8rem;
  font-family:'Source Sans 3',sans-serif;
  font-style:normal;font-size:.85rem;color:var(--silver);
}

/* ─── CARDS GRID ─── */
.cards-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:1.5rem;margin:2rem 0;
}
.card{
  background:var(--dark-mid);
  border:1px solid rgba(184,184,192,.08);
  border-radius:var(--radius);padding:1.8rem;
  transition:var(--transition);
  position:relative;overflow:hidden;
}
.card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--aqua),var(--plum));
  transform:scaleX(0);transform-origin:left;
  transition:transform var(--transition);
}
.card:hover{transform:translateY(-5px);border-color:var(--aqua)}
.card:hover::before{transform:scaleX(1)}
.card-icon{font-size:2rem;margin-bottom:.8rem;display:block}
.card h3{color:var(--ivory);margin-bottom:.5rem}
.card p{color:var(--silver);font-size:.95rem}

/* ─── HIGHLIGHT BOX ─── */
.highlight-box{
  background:linear-gradient(135deg,var(--aqua-dark),var(--plum-dark));
  border-radius:var(--radius);padding:2.5rem;
  margin:2.5rem 0;position:relative;overflow:hidden;
}
.highlight-box::after{
  content:'';position:absolute;top:-50px;right:-50px;
  width:200px;height:200px;border-radius:50%;
  background:rgba(255,255,255,.04);
}
.highlight-box h3{color:#fff;margin-bottom:.6rem}
.highlight-box p{color:rgba(255,255,255,.85)}
.highlight-box ul{list-style:none;margin-top:1rem}
.highlight-box li{
  padding:.5rem 0;color:rgba(255,255,255,.8);
  padding-left:1.5rem;position:relative;
}
.highlight-box li::before{
  content:'~';position:absolute;left:0;color:var(--aqua-light);font-weight:700;
}

/* ─── IMAGE SECTION ─── */
.img-section{
  display:grid;grid-template-columns:1fr 1fr;gap:2rem;
  align-items:center;margin:3rem 0;
}
.img-section.reverse{direction:rtl}
.img-section.reverse > *{direction:ltr}
@media(max-width:768px){
  .img-section,.img-section.reverse{grid-template-columns:1fr;direction:ltr}
}
.img-section img{
  border-radius:var(--radius);
  box-shadow:0 20px 60px rgba(0,0,0,.3);
  transition:var(--transition);
}
.img-section img:hover{transform:scale(1.02)}

/* ─── CURVED SECTION ─── */
.curved-section{
  background:var(--dark-mid);
  padding:5rem 1.5rem;
  clip-path:polygon(0 40px,100% 0,100% calc(100% - 40px),0 100%);
  margin:2rem 0;
}
@media(max-width:768px){
  .curved-section{clip-path:polygon(0 20px,100% 0,100% calc(100% - 20px),0 100%);padding:4rem 1.5rem}
}

/* ─── FLOWING TEXT ─── */
.flow-block{
  max-width:800px;margin:0 auto;
  padding:0 1.5rem;
}

/* ─── NEWSLETTER ─── */
.newsletter{
  background:linear-gradient(135deg,var(--plum-dark),var(--dark-mid));
  border-radius:var(--radius);padding:3rem;
  text-align:center;margin:3rem 0;
  border:1px solid rgba(123,75,138,.3);
}
.newsletter h2{color:var(--ivory)}
.newsletter p{color:var(--silver-light);margin-bottom:1.5rem}
.newsletter-form{
  display:flex;gap:.8rem;max-width:480px;margin:0 auto;
}
.newsletter-form input[type="email"]{
  flex:1;padding:.9rem 1.2rem;
  border-radius:40px;border:1px solid var(--silver);
  background:rgba(255,255,255,.06);color:var(--ivory);
  font-size:1rem;
}
.newsletter-form input[type="email"]::placeholder{color:var(--silver)}
.newsletter-form button{
  padding:.9rem 2rem;border-radius:40px;border:none;
  background:var(--aqua);color:var(--dark);
  font-weight:700;font-size:1rem;cursor:pointer;
  transition:var(--transition);min-width:44px;min-height:44px;
}
.newsletter-form button:hover{background:var(--aqua-light);transform:scale(1.05)}
@media(max-width:520px){
  .newsletter-form{flex-direction:column}
}

/* ─── FOOTER ─── */
.site-footer{
  background:var(--dark);
  border-top:1px solid rgba(184,184,192,.1);
  padding:3rem 1.5rem 2rem;
}
.footer-inner{
  max-width:1280px;margin:0 auto;
  display:flex;flex-wrap:wrap;justify-content:space-between;
  align-items:flex-start;gap:2rem;
}
.footer-brand{font-family:'Playfair Display',serif;font-size:1.3rem;font-weight:700;color:var(--ivory)}
.footer-links{display:flex;gap:1.5rem;flex-wrap:wrap}
.footer-links a{color:var(--silver);font-size:.9rem}
.footer-links a:hover{color:var(--aqua-light)}
.footer-disclaimer{
  width:100%;margin-top:1.5rem;padding-top:1.5rem;
  border-top:1px solid rgba(184,184,192,.08);
  font-size:.8rem;color:var(--silver);line-height:1.6;
}

/* ─── LEGAL ─── */
.legal-page{max-width:820px;margin:0 auto;padding:3rem 1.5rem}
.legal-page h1{margin-bottom:1.5rem;color:var(--aqua-light)}
.legal-page h2{color:var(--plum-light);font-size:1.3rem;margin-top:2rem;margin-bottom:.6rem}
.legal-page p{color:var(--ivory-dark);margin-bottom:1rem}
.legal-page ol{
  counter-reset:legal;list-style:none;
}
.legal-page ol li{
  counter-increment:legal;padding:1rem 0;
  border-bottom:1px solid rgba(184,184,192,.08);
  color:var(--ivory-dark);
}
.legal-page ol li::before{
  content:counter(legal) '.';
  font-family:'Playfair Display',serif;
  font-weight:700;color:var(--aqua);
  margin-right:.6rem;font-size:1.1rem;
}

/* ─── SUCCESS / 404 ─── */
.status-page{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:60vh;text-align:center;padding:3rem 1.5rem;
}
.status-page h1{font-size:clamp(2.5rem,8vw,5rem);margin-bottom:1rem}
.status-page p{color:var(--silver-light);font-size:1.1rem;margin-bottom:2rem;max-width:500px}
.status-btn{
  display:inline-flex;align-items:center;gap:.5rem;
  background:var(--aqua);color:var(--dark);
  padding:.9rem 2.2rem;border-radius:40px;
  font-weight:700;transition:var(--transition);
  min-height:44px;
}
.status-btn:hover{background:var(--aqua-light);transform:translateY(-2px);color:var(--dark)}

/* ─── COOKIES BANNER ─── */
#cookies-toggle{display:none}
.cookies-banner{
  position:fixed;bottom:1rem;right:1rem;left:1rem;
  max-width:480px;margin-left:auto;
  background:var(--dark-mid);
  border:1px solid rgba(184,184,192,.15);
  border-radius:var(--radius);padding:1.5rem;
  z-index:999;
  transition:var(--transition);
  box-shadow:0 10px 40px rgba(0,0,0,.5);
}
#cookies-toggle:checked ~ .cookies-banner{display:none}
.cookies-banner p{font-size:.88rem;color:var(--silver-light);margin-bottom:1rem}
.cookies-banner a{color:var(--aqua-light)}
.cookies-actions{display:flex;gap:.6rem;flex-wrap:wrap}
.cookies-actions label,
.cookies-actions a.cookie-btn{
  padding:.55rem 1.2rem;border-radius:30px;
  font-size:.85rem;font-weight:600;cursor:pointer;
  min-height:44px;display:inline-flex;align-items:center;
  transition:var(--transition);
}
.cookie-accept{background:var(--aqua);color:var(--dark);border:none}
.cookie-accept:hover{background:var(--aqua-light)}
.cookie-reject{background:transparent;color:var(--silver);border:1px solid var(--silver)}
.cookie-reject:hover{border-color:var(--ivory);color:var(--ivory)}

/* ─── AUTHOR TAG ─── */
.author-tag{
  display:inline-flex;align-items:center;gap:.5rem;
  color:var(--silver);font-size:.88rem;margin-bottom:1.5rem;
}
.author-tag span{color:var(--aqua-light);font-weight:600}

/* ─── SCROLL ANIMATIONS ─── */
.fade-up{
  opacity:0;transform:translateY(30px);
  transition:opacity .7s ease,transform .7s ease;
}
.fade-up.visible{opacity:1;transform:translateY(0)}

/* ─── RELATED ARTICLES ─── */
.related-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:1.5rem;margin-top:2rem;
}
.related-item{
  background:var(--dark-mid);border-radius:var(--radius);
  overflow:hidden;transition:var(--transition);
  border:1px solid rgba(184,184,192,.06);
}
.related-item:hover{transform:translateY(-4px);border-color:var(--aqua)}
.related-item-body{padding:1.3rem}
.related-item h3{font-size:1.05rem;margin-bottom:.4rem}
.related-item p{font-size:.88rem;color:var(--silver)}

/* ─── STAT STRIP ─── */
.stat-strip{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:1px;background:rgba(184,184,192,.08);
  border-radius:var(--radius);overflow:hidden;
  margin:2.5rem 0;
}
.stat-item{
  background:var(--dark-mid);padding:1.8rem 1.2rem;text-align:center;
  transition:var(--transition);
}
.stat-item:hover{background:var(--dark-light)}
.stat-num{
  font-family:'Playfair Display',serif;font-size:2.2rem;
  font-weight:700;color:var(--aqua);display:block;
}
.stat-label{font-size:.85rem;color:var(--silver);margin-top:.3rem}

/* ─── TAG PILLS ─── */
.tags{display:flex;gap:.5rem;flex-wrap:wrap;margin:1.5rem 0}
.tag{
  padding:.3rem .9rem;border-radius:20px;font-size:.8rem;font-weight:600;
  background:rgba(123,175,165,.12);color:var(--aqua-light);
  border:1px solid rgba(123,175,165,.2);
}
