/* ==========================================================
   COSMIC NUSANTARA (clean edition) — black + gold
   Paste into: Appearance > Customize > Additional CSS

   FONTS (all free, loaded from Google Fonts, nothing to upload)
   - Titles: Cinzel Decorative for the main title, Cinzel for
     everything else. Inscription-style capitals, celestial feel.
   - Reading: Cormorant Garamond.
   ========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600&family=Cinzel+Decorative:wght@400;700&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&display=swap');

:root {
  --black:      #08080a;
  --black-soft: #121215;
  --gold:       #d4a94c;
  --gold-soft:  #ecd28f;
  --text:       #e8e4d8;
  --muted:      #8f8b7e;
  --line:       rgba(212, 169, 76, .25);

  --font-title: 'Cinzel', 'Cormorant Garamond', serif;
  --font-display: 'Cinzel Decorative', 'Cinzel', serif;
  --font-read:  'Cormorant Garamond', Georgia, serif;
}

/* ---------- Base ---------- */
body {
  font-family: var(--font-read);
  font-size: 1.2rem;
  line-height: 1.8;
  color: var(--text);
  background: var(--black);
}

::selection { background: var(--gold); color: var(--black); }

/* ---------- Headings ---------- */
h1, h2, h3, h4, h5, h6,
.site-title, .entry-title, .page-title, .widget-title,
.wp-block-heading, .wp-block-post-title, .wp-block-site-title {
  font-family: var(--font-title);
  font-weight: normal;
  letter-spacing: .04em;
  line-height: 1.25;
  color: var(--gold);
}

h1, .entry-title, .page-title, .site-title, .wp-block-site-title {
  font-family: var(--font-display);
  font-size: clamp(2.2rem, 5vw, 3.4rem);
}
.site-title, .wp-block-site-title { font-size: clamp(1.5rem, 3vw, 2rem); }
h2 { font-size: clamp(1.7rem, 3.5vw, 2.3rem); }
h3 { font-size: clamp(1.4rem, 2.5vw, 1.7rem); }

.entry-title a, .wp-block-post-title a, .site-title a, .wp-block-site-title a {
  color: inherit;
  text-decoration: none;
}

/* ---------- Links ---------- */
a {
  color: var(--gold);
  text-decoration: none;
  transition: color .25s;
}
a:hover, a:focus { color: var(--gold-soft); text-decoration: underline; text-underline-offset: 4px; }

/* ---------- Header, nav, footer ---------- */
.site-header, header.wp-block-template-part, #masthead,
.site-footer, footer.wp-block-template-part, #colophon {
  background: var(--black);
  border-color: var(--line);
}
.site-header, header.wp-block-template-part, #masthead { border-bottom: 1px solid var(--line); }
.site-footer, footer.wp-block-template-part, #colophon { border-top: 1px solid var(--line); color: var(--muted); }

.site-description, .wp-block-site-tagline { color: var(--muted); font-style: italic; }

.main-navigation a, .wp-block-navigation a {
  font-family: var(--font-title);
  letter-spacing: .08em;
  color: var(--text);
}
.main-navigation a:hover, .wp-block-navigation a:hover { color: var(--gold); text-decoration: none; }

/* ---------- Content (no boxes, just breathing room) ---------- */
.widget { background: transparent; border: 0; }
.widget-title { font-size: 1.2rem; padding-bottom: .5rem; border-bottom: 1px solid var(--line); }

/* ---------- Divider & quotes ---------- */
hr, .wp-block-separator {
  border: 0;
  height: 1px;
  background: var(--line);
  margin: 2.5rem auto;
}

blockquote, .wp-block-quote {
  margin: 2rem 0;
  padding: .2rem 0 .2rem 1.5rem;
  font-style: italic;
  font-size: 1.3rem;
  color: var(--gold-soft);
  border-left: 2px solid var(--gold);
  background: none;
}

/* ---------- Buttons ---------- */
button, input[type="submit"], .button, .wp-block-button__link, .more-link {
  font-family: var(--font-title);
  letter-spacing: .08em;
  color: var(--gold);
  background: transparent;
  border: 1px solid var(--gold);
  border-radius: 2px;
  padding: .7em 1.8em;
  cursor: pointer;
  transition: background .25s, color .25s;
}
button:hover, input[type="submit"]:hover, .button:hover,
.wp-block-button__link:hover, .more-link:hover {
  background: var(--gold);
  color: var(--black);
  text-decoration: none;
}

/* ---------- Forms ---------- */
input[type="text"], input[type="email"], input[type="url"],
input[type="search"], input[type="password"], textarea, select {
  font-family: var(--font-read);
  font-size: 1.1rem;
  color: var(--text);
  background: var(--black-soft);
  border: 1px solid var(--line);
  border-radius: 2px;
  padding: .7em 1em;
}
input:focus, textarea:focus, select:focus {
  outline: none;
  border-color: var(--gold);
}

/* ---------- Media ---------- */
img { border-radius: 2px; }
figcaption, .wp-caption-text { color: var(--muted); font-style: italic; text-align: center; }

/* ---------- Lists, code, tables ---------- */
li::marker { color: var(--gold); }

code, pre {
  background: var(--black-soft);
  color: var(--gold-soft);
  border: 1px solid var(--line);
  border-radius: 2px;
}
code { padding: .1em .4em; }
pre { padding: 1rem; overflow-x: auto; }

table { border-collapse: collapse; width: 100%; }
th { font-family: var(--font-title); color: var(--gold); text-align: left; }
th, td { border-bottom: 1px solid var(--line); padding: .6em .9em; }

/* ---------- Meta ---------- */
.entry-meta, .posted-on, .byline, .cat-links, .tags-links,
.wp-block-post-date, .wp-block-post-author { color: var(--muted); font-size: .95rem; }

/* ---------- Scrollbar ---------- */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--black); }
::-webkit-scrollbar-thumb { background: var(--gold); border-radius: 10px; border: 2px solid var(--black); }

/* ---------- Mobile ---------- */
@media (max-width: 600px) {
  body { font-size: 1.1rem; }
}