/* Vida Academy — shared article stylesheet */
:root{
  --ink:#0B2440; --ink-2:#13345C; --ink-soft:#33485f;
  --paper:#F1F5FA; --paper-2:#F9FBFD; --card:#FFFFFF;
  --gold:#C8932B; --gold-deep:#8A6318; --gold-soft:#F3E7C6; --gold-tint:#FBF2DC;
  --sage:#2E7D5B; --sage-soft:#E4F1EA;
  --line:rgba(11,36,64,.12); --line-soft:rgba(11,36,64,.07);
  --shadow:0 16px 44px -30px rgba(11,36,64,.24);
  --shadow-sm:0 10px 30px -16px rgba(11,36,64,.34);
  --r:16px; --r-sm:11px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:"DM Sans",system-ui,sans-serif;color:var(--ink);background:var(--paper);line-height:1.68;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(1000px 560px at 92% -10%,#DFE9F5,transparent 60%),
             radial-gradient(820px 520px at -10% 6%,#E7F0F8,transparent 55%);opacity:.7}
.serif{font-family:"Fraunces",Georgia,serif}
a{color:var(--ink)}
.wrap{max-width:760px;margin:0 auto;padding:0 20px}

header{border-bottom:1px solid var(--line);background:rgba(249,251,253,.9);backdrop-filter:blur(8px);position:sticky;top:0;z-index:20}
.head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0}
.logo-img{height:40px;width:auto;display:block}
.lang{display:flex;border:1.5px solid var(--line);border-radius:999px;overflow:hidden;font-size:12.5px;font-weight:700;background:var(--card)}
.lang a{padding:6px 13px;color:var(--ink-soft);text-decoration:none;transition:background .2s,color .2s}
.lang a.on{background:var(--ink);color:var(--gold-soft)}

.crumb{font-size:13px;color:var(--ink-soft);padding:18px 0 0}
.crumb a{color:var(--ink-soft);text-decoration:none;border-bottom:1px solid var(--line)}
.crumb a:hover{color:var(--gold-deep)}

article{padding:10px 0 8px}
.eyebrow{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:10px}
h1{font-family:"Fraunces",Georgia,serif;font-weight:600;font-size:clamp(28px,5.2vw,40px);line-height:1.12;letter-spacing:-.02em;margin-bottom:12px}
.standfirst{font-size:clamp(16.5px,2.2vw,19px);color:var(--ink-soft);margin-bottom:14px}
.meta{font-size:13px;color:var(--ink-soft);padding-bottom:20px;border-bottom:1px solid var(--line);margin-bottom:26px}

.body h3{font-family:"Fraunces",Georgia,serif;font-weight:600;font-size:clamp(19px,3vw,23px);line-height:1.25;margin:30px 0 10px;color:var(--ink)}
.body p{margin-bottom:15px;font-size:16.5px}
.body ul,.body ol{margin:0 0 16px 20px}
.body li{margin-bottom:8px;font-size:16.5px}
.body b{color:var(--ink)}
.body i{color:var(--ink-soft)}
.callout{background:var(--gold-tint);border:1px solid var(--gold-soft);border-left:4px solid var(--gold);
  border-radius:var(--r-sm);padding:16px 18px;margin:22px 0;font-size:16px}
.callout b{color:var(--ink)}

.disc{font-size:13px;color:var(--ink-soft);font-style:italic;margin:30px 0 0;padding-top:16px;border-top:1px solid var(--line)}

.related{margin:34px 0 0;padding-top:26px;border-top:1px solid var(--line)}
.related h2{font-family:"Fraunces",Georgia,serif;font-weight:600;font-size:20px;margin-bottom:14px}
.rel-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.rel{display:block;background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:15px 16px;text-decoration:none;box-shadow:var(--shadow-sm);transition:transform .15s,border-color .2s}
.rel:hover{transform:translateY(-2px);border-color:var(--gold-soft)}
.rel .c{font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--gold-deep);display:block;margin-bottom:5px}
.rel h3{font-family:"Fraunces",Georgia,serif;font-weight:600;font-size:15.5px;line-height:1.3;color:var(--ink)}

.backlink{display:inline-flex;align-items:center;gap:8px;margin-top:28px;font-size:15px;font-weight:600;
  color:var(--gold-deep);text-decoration:none}
.backlink:hover{color:var(--ink)}

footer{margin-top:40px;padding:26px 0 40px;border-top:1px solid var(--line);background:var(--ink);color:rgba(255,255,255,.72)}
footer .wrap{max-width:760px}
footer img{height:38px;width:auto;margin-bottom:8px}
.fnav{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;margin-bottom:14px}
.fnav a{color:var(--gold-soft);text-decoration:none}
.legal{font-size:11.5px;line-height:1.65}
.legal a{color:rgba(255,255,255,.72)}
.legal p{margin-bottom:8px}

@media(max-width:600px){
  .wrap{padding:0 16px}
  .body p,.body li{font-size:16px}
  article{padding:6px 0}
}
@media(prefers-reduced-motion:reduce){*{transition-duration:.001ms!important}}

.q-head{font-family:"Fraunces",Georgia,serif;font-weight:600;font-size:clamp(20px,3.2vw,25px);line-height:1.22;margin:26px 0 8px;color:var(--ink)}
.q-answer{background:var(--gold-tint);border:1px solid var(--gold-soft);border-left:4px solid var(--gold);border-radius:var(--r-sm);padding:16px 18px;margin:0 0 24px;font-size:16.5px;line-height:1.62;color:var(--ink)}