/* ==========================================================================
   AVENI REFRESH — unified design layer (loaded last on every page)
   Palette: mist-blue page / white cards / ink-navy type / antique gold accent
   ========================================================================== */

:root{
  --an-bg:#f0f6fa;        /* page background */
  --an-paper:#ffffff;     /* card surface */
  --an-soft:#f4f9fc;      /* nested surface */
  --an-ink:#17304f;       /* headings / primary text */
  --an-body:#3d5872;      /* body text */
  --an-muted:#60758a;     /* secondary text */
  --an-line:#d5e5ed;      /* hairline borders */
  --an-gold:#c9a45e;      /* accent */
  --an-gold-dark:#8d6728; /* accent text */
  --an-gold-soft:#f8f2e3; /* gold tint surface */
  --an-radius:22px;
}

/* ---------- 1. The giant-logo bug ---------- */
.brand-mark-image{height:38px;width:38px;border-radius:50%;object-fit:cover;flex:none}

/* ---------- 2. Typography base ---------- */
.seo-page{background:var(--an-bg);color:var(--an-body)}
.seo-page h1,.seo-page h2,.seo-page h3,.trust-page h1,.trust-page h2{
  font-family:Georgia,'Times New Roman',serif;color:var(--an-ink);
  letter-spacing:-.015em}
.tool-page-intro h1{font-size:clamp(2.4rem,4.6vw,3.9rem);line-height:1.06;margin:0 0 16px}
.tool-page-text h2,.faq h2{font-size:1.75rem;margin:0 0 14px}
.tool-page-text p,.tool-page-text li,.faq p,.trust-page p,.trust-page li{color:var(--an-muted)}
/* gold kicker eyebrows, everywhere */
.eyebrow,.result-kicker,.bazi-label{
  color:var(--an-gold-dark)!important;
  text-transform:uppercase;letter-spacing:.2em;font-size:11px;font-weight:700}
/* Playfair references fall back to Georgia for consistency */
.bazi-pillar strong,.bazi-summary strong,.zodiac-result h3,.life-path-number{
  font-family:Georgia,'Times New Roman',serif}

/* ---------- 3. Buttons: one navy pill ---------- */
.button.primary,.bazi-fields button,#find-bazi,.moon-form button,.zodiac-form button,
#find-sign,#find-animal,#find-life-path,#find-moon-sign,#draw-card,#bazi-fields button{
  background:var(--an-ink);color:#fff;border:none;border-radius:999px;
  padding:14px 26px;font:600 14.5px 'DM Sans',sans-serif;cursor:pointer;
  transition:background .15s ease,transform .15s ease;box-shadow:none}
.button.primary:hover,.bazi-fields button:hover,.moon-form button:hover,
.zodiac-form button:hover{background:#0e2340;transform:translateY(-1px)}

/* ---------- 4. Forms: one white-field style ---------- */
.seo-page input,.seo-page select,.bazi-fields input,.moon-form input,.moon-form select,
.zodiac-form input,#life-path-date,#birthday,#birth-date{
  background:#fff;color:var(--an-ink);border:1px solid var(--an-line);
  border-radius:12px;min-height:48px;padding:12px 14px;font:14.5px 'DM Sans',sans-serif;
  outline:none;transition:border-color .15s ease,box-shadow .15s ease}
.seo-page input:focus,.seo-page select:focus,.bazi-fields input:focus,
.moon-form input:focus,.moon-form select:focus,.zodiac-form input:focus{
  border-color:var(--an-gold);box-shadow:0 0 0 3px #c9a45e26}
.seo-page label,.bazi-fields label,.moon-form label,.zodiac-form label{
  color:var(--an-muted);font-size:12.5px;font-weight:600}

/* ---------- 5. Tool sections: stop the colour jumps ---------- */
.bazi-section,.tarot-section,.moon-sign-section,.life-path-section,
.chinese-zodiac-section,.zodiac-section{background:transparent!important;color:var(--an-body)}
.moon-sign-section{color:var(--an-body)}
.moon-sign-section .eyebrow{color:var(--an-gold-dark)!important}
.moon-sign-section .section-heading>p:last-child{color:var(--an-muted)}
.tool-page-tool>section{
  border:1px solid var(--an-line);border-top:3px solid var(--an-gold);
  border-radius:var(--an-radius);background:var(--an-paper);
  box-shadow:0 24px 60px #17304f0d}

/* ---------- 6. The unified glyph badge ---------- */
.zodiac-glyph,.card-symbol,#moon-glyph,.moon-result .zodiac-glyph{
  display:inline-grid;place-items:center;width:76px;height:76px;margin:0 auto 14px;
  border-radius:50%;background:var(--an-gold-soft);border:1px solid #e3cf9f;
  color:var(--an-gold-dark);font-size:34px;line-height:1;font-family:Georgia,serif}
.life-path-number{
  display:inline-grid;place-items:center;width:96px;height:96px;margin:0 auto 12px;
  border-radius:50%;background:var(--an-gold-soft);border:1px solid #e3cf9f;
  color:var(--an-gold-dark);font:500 44px/1 Georgia,serif}
.zodiac-result h3,.tarot-result h3{font-size:1.9rem;margin:10px 0}
.tarot-result .result-kicker{margin-bottom:2px}

/* ---------- 7. Result cards & readings ---------- */
.result-detail{color:var(--an-body)!important}
.result-prompt{
  border-left:3px solid var(--an-gold);background:var(--an-gold-soft);
  color:#6b5320!important;border-radius:0 12px 12px 0}
.result-prompt:empty{display:none}
.moon-result{background:var(--an-soft)!important;border-color:var(--an-line)!important;
  color:var(--an-ink)!important;border-radius:18px}
.moon-result p{color:var(--an-muted)!important}
.zodiac-result{background:#fff;border:1px solid var(--an-line);border-radius:18px}
.zodiac-result p{color:var(--an-muted)}
.bazi-interpretation{border-top-color:var(--an-line)!important}

/* ---------- 8. BaZi: cream -> blue/gold ---------- */
.bazi-form-card,.bazi-results{background:#fff;border-color:var(--an-line);
  border-radius:18px;box-shadow:none;padding:30px}
.bazi-fields button{grid-column:1/-1;width:100%;min-height:50px}
.bazi-pillar{background:var(--an-soft);border-color:var(--an-line);border-radius:14px}
.bazi-pillar small{color:var(--an-gold-dark);text-transform:uppercase;letter-spacing:.14em}
.bazi-pillar strong{color:var(--an-ink)}
.bazi-summary>div{background:var(--an-soft);border-radius:14px}
.bazi-summary strong{color:var(--an-ink)}
.bazi-element{background:var(--an-gold-soft);color:#6b5320;border-radius:12px}
.bazi-element strong{color:var(--an-ink)}

/* ---------- 9. Moon section was dark: fields now light ---------- */
.moon-form input,.moon-form select{background:#fff;color:var(--an-ink);border-color:var(--an-line)}
.moon-form label{color:var(--an-muted)!important}

/* ---------- 10. Tarot: keep the card mystical, align the rest ---------- */
.tarot-card{border-color:var(--an-gold)}
.tarot-card.is-drawn{background:linear-gradient(150deg,#24466b,#0f2238)}
.tarot-result{text-align:center;margin:0 auto}
.fine-print{color:var(--an-muted)}

/* ---------- 11. FAQ ---------- */
.faq details{border-top:1px solid var(--an-line);padding:18px 4px}
.faq summary{color:var(--an-ink);font-weight:600;list-style:none;display:flex;
  align-items:center;gap:10px;cursor:pointer}
.faq summary::before{content:'✦';color:var(--an-gold);font-size:12px;flex:none}
.faq summary::-webkit-details-marker{display:none}
.faq details[open] summary{color:var(--an-gold-dark)}

/* ---------- 12. CTAs, newsletter, footer ---------- */
.auric-cta{background:var(--an-gold-soft);border:1px solid #e3cf9f;border-radius:var(--an-radius)}
.auric-cta h2{color:var(--an-ink)}
.auric-cta a{color:var(--an-gold-dark)}
.newsletter-slot{background:#fff;border:1px solid var(--an-line);border-radius:var(--an-radius)}
.newsletter-slot h2{color:var(--an-ink)}
.seo-page footer{color:var(--an-muted);border-top:1px solid var(--an-line);
  max-width:1120px;margin:0 auto;padding:26px 24px}
.seo-page footer a{color:var(--an-muted)}
.seo-page footer a:hover{color:var(--an-gold-dark)}
.site-header{border-bottom:1px solid var(--an-line)}
.brand-wordmark{font-family:Georgia,serif}
.breadcrumb a{color:var(--an-gold-dark)!important}

/* ---------- 13. Homepage harmony ---------- */
.hero{background:transparent}
.tools-section{background:var(--an-paper)}
.tool-card{background:var(--an-soft);border:1px solid var(--an-line);border-radius:16px}
.tool-card:hover{border-color:var(--an-gold)}
.tool-card.featured{background:var(--an-gold-soft);border-color:#e3cf9f}
.tool-icon{background:#fff;border:1px solid var(--an-line);color:var(--an-gold-dark)}
.tool-card b{color:var(--an-gold-dark)}
.signup{background:#12263f}

/* ---------- 14. Small screens ---------- */
@media(max-width:700px){
  .brand-mark-image{height:32px;width:32px}
  .tool-page-tool>section{border-radius:16px}
  .bazi-form-card,.bazi-results{padding:22px}
}
