/*
Theme Name: The Veiled Throne
Theme URI: https://brittany-johnston.com/
Author: Brittany Johnston
Description: A fully editable dark romantic fantasy WordPress block theme for Brittany Johnston and The Veiled Throne series.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
Text Domain: the-veiled-throne
*/

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

:root {
  --tvt-black: #050207;
  --tvt-ink: #0b0612;
  --tvt-midnight: #13091d;
  --tvt-plum: #321437;
  --tvt-plum-light: #8b5a8f;
  --tvt-lavender: #c69cff;
  --tvt-gold: #d8b46a;
  --tvt-cream: #f6edff;
  --tvt-muted: #cfc3d8;
  --tvt-border: rgba(216,180,106,.35);
}

html { scroll-behavior: smooth; }

body {
  background: var(--tvt-black);
  color: var(--tvt-cream);
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 20px;
  line-height: 1.55;
}

a {
  color: var(--tvt-gold);
  text-decoration: none;
}

a:hover { color: var(--tvt-lavender); }

h1, h2, h3, h4, h5, h6 {
  font-family: "Cinzel", serif;
  color: var(--tvt-gold);
  font-weight: 400;
  letter-spacing: .04em;
}

.tvt-header {
  position: absolute;
  z-index: 30;
  top: 0;
  left: 0;
  width: 100%;
  background: linear-gradient(180deg, rgba(5,2,7,.96), rgba(5,2,7,.25), transparent);
}

.tvt-header-inner {
  padding: 28px 7vw 22px;
}

.tvt-site-title,
.tvt-site-title a {
  font-family: "Cinzel Decorative", serif !important;
  font-size: clamp(34px, 4vw, 60px) !important;
  line-height: 1 !important;
  color: var(--tvt-gold) !important;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.tvt-tagline {
  font-family: "Cinzel", serif;
  font-size: 12px;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--tvt-cream);
}

.tvt-nav a {
  font-family: "Cinzel", serif;
  font-size: 13px;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--tvt-cream) !important;
}

.tvt-nav a:hover { color: var(--tvt-gold) !important; }

.tvt-hero {
  min-height: 100vh;
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(5,2,7,.98) 0%, rgba(19,9,29,.88) 42%, rgba(19,9,29,.42) 100%),
    radial-gradient(circle at 80% 44%, rgba(198,156,255,.34), transparent 28%),
    radial-gradient(circle at 55% 70%, rgba(216,180,106,.16), transparent 24%),
    url("assets/veiled-throne-hero.png");
  background-size: cover;
  background-position: center;
}

.tvt-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, transparent 70%, var(--tvt-black) 100%),
    radial-gradient(circle at 15% 35%, rgba(198,156,255,.12), transparent 28%);
  pointer-events: none;
}

.tvt-hero-inner {
  min-height: 100vh;
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  padding: 160px 7vw 80px;
}

.tvt-hero-copy {
  max-width: 670px;
}

.tvt-eyebrow {
  font-family: "Cinzel", serif;
  letter-spacing: .35em;
  text-transform: uppercase;
  color: var(--tvt-lavender);
  font-size: 14px;
}

.tvt-hero-title {
  font-family: "Cinzel Decorative", serif !important;
  font-size: clamp(48px, 8vw, 98px) !important;
  line-height: .95 !important;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--tvt-cream) !important;
  margin: 20px 0 24px;
}

.tvt-divider {
  width: 380px;
  max-width: 85%;
  height: 1px;
  background: linear-gradient(90deg, var(--tvt-gold), transparent);
  margin: 0 0 34px;
}

.tvt-hero-text {
  color: var(--tvt-cream);
  font-size: clamp(21px, 2vw, 28px);
  line-height: 1.45;
}

.tvt-script {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-style: italic;
  color: var(--tvt-gold);
  font-size: clamp(32px, 4vw, 48px);
  line-height: 1.1;
}

.wp-block-button__link {
  border-radius: 0 !important;
  font-family: "Cinzel", serif;
  letter-spacing: .16em;
  text-transform: uppercase;
  padding: 16px 32px;
}

.tvt-button-primary .wp-block-button__link {
  background: var(--tvt-plum-light) !important;
  color: white !important;
}

.tvt-button-secondary .wp-block-button__link {
  background: transparent !important;
  color: var(--tvt-gold) !important;
  border: 1px solid var(--tvt-gold);
}

.tvt-section {
  padding: 90px 7vw;
}

.tvt-section-dark {
  background:
    radial-gradient(circle at 50% 0%, rgba(198,156,255,.10), transparent 28%),
    linear-gradient(180deg, #050207, #100719);
}

.tvt-section-plum {
  background:
    radial-gradient(circle at 15% 50%, rgba(198,156,255,.15), transparent 28%),
    linear-gradient(90deg, #16091e, #351331, #16091e);
}

.tvt-section-title {
  font-family: "Cinzel Decorative", serif !important;
  font-size: clamp(38px, 5vw, 66px) !important;
  line-height: 1.1 !important;
  color: var(--tvt-gold) !important;
  text-align: center;
}

.tvt-section-subtitle {
  text-align: center;
  color: var(--tvt-muted);
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
}

.tvt-book-card {
  border: 1px solid var(--tvt-border);
  background: rgba(255,255,255,.035);
  padding: 34px;
  min-height: 100%;
}

.tvt-book-title {
  font-family: "Cinzel", serif !important;
  color: var(--tvt-cream) !important;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.tvt-release {
  font-family: "Cinzel", serif;
  color: var(--tvt-lavender);
  letter-spacing: .15em;
  text-transform: uppercase;
  font-size: 14px;
}

.tvt-book-cover-placeholder,
.tvt-image-placeholder {
  border: 1px solid var(--tvt-border);
  background:
    radial-gradient(circle at 50% 35%, rgba(198,156,255,.20), transparent 34%),
    linear-gradient(160deg, #050207, #2a1232);
  color: var(--tvt-gold);
  font-family: "Cinzel", serif;
  letter-spacing: .1em;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 24px;
}

.tvt-book-cover-placeholder { aspect-ratio: 2 / 3; overflow: hidden; }

.tvt-book-cover-image,
.tvt-book-cover-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  margin: 0;
  display: block;
}

.tvt-image-placeholder {
  min-height: 420px;
}

.tvt-card {
  border: 1px solid rgba(216,180,106,.25);
  background: rgba(255,255,255,.035);
  padding: 30px;
}

.tvt-author-section {
  background:
    linear-gradient(90deg, rgba(5,2,7,.95), rgba(50,20,55,.75)),
    radial-gradient(circle at 85% 50%, rgba(198,156,255,.15), transparent 30%);
}

.tvt-newsletter input[type="email"],
.tvt-newsletter input[type="text"] {
  background: transparent;
  border: 1px solid rgba(216,180,106,.65);
  color: var(--tvt-cream);
  padding: 16px;
  width: 100%;
  font-size: 18px;
}

.tvt-footer {
  background: #030104;
  border-top: 1px solid rgba(216,180,106,.25);
  color: var(--tvt-muted);
  padding: 60px 7vw 30px;
}

.tvt-footer h2,
.tvt-footer h3 {
  font-family: "Cinzel", serif !important;
  color: var(--tvt-gold) !important;
  letter-spacing: .12em;
  text-transform: uppercase;
}

@media (max-width: 900px) {
  body { font-size: 18px; }

  .tvt-header {
    position: relative;
    background: var(--tvt-black);
  }

  .tvt-header-inner {
    padding: 24px;
  }

  .tvt-hero-inner {
    padding: 90px 28px 70px;
  }

  .tvt-section {
    padding: 60px 28px;
  }

  .tvt-site-title,
  .tvt-site-title a {
    font-size: 38px !important;
  }

  .tvt-nav {
    margin-top: 20px;
  }
}