/*
Theme Name: Navyaa
Theme URI: https://navyaa.blog
Author: Navyaa
Description: Custom editorial theme for Navyaa — cream, charcoal, burgundy and olive, built around the five pillars (Love, Self, Life, Soul, Unfiltered).
Version: 1.0.0
Text Domain: navyaa
Requires PHP: 7.4
*/

/* ---------- Reset & base ---------- */
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: #F7F4EE;
  color: #151515;
  font-family: 'DM Sans', Helvetica, Arial, sans-serif;
}
img { max-width: 100%; display: block; }
a { text-decoration: none; color: inherit; }
h1, h2, h3, h4, h5 { font-family: 'Cormorant Garamond', Georgia, serif; margin: 0; font-weight: 500; }
p { margin: 0; }
ul { list-style: none; margin: 0; padding: 0; }
button, input { font-family: 'DM Sans', Helvetica, Arial, sans-serif; }

/* ---------- Palette tokens (for reference) ----------
  cream:    #F7F4EE
  charcoal: #151515
  burgundy: #6E3035
  olive:    #3F4738
  taupe:    #77736D
  rose:     #E9DDD5
  tan:      #B5A99A
  border:   #D8D1C8
------------------------------------------------------ */

.nvy-wrap { width: 100%; max-width: 1440px; margin: 0 auto; background: #F7F4EE; }
.nvy-serif { font-family: 'Cormorant Garamond', Georgia, serif; }
.nvy-sans { font-family: 'DM Sans', Helvetica, Arial, sans-serif; }
.nvy-eyebrow { font-family: 'DM Sans', sans-serif; font-size: 12px; letter-spacing: 2.5px; color: #77736D; text-transform: uppercase; }
.nvy-tag { font-family: 'DM Sans', sans-serif; font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; color: #6E3035; font-weight: 600; }
.nvy-link { color: #6E3035; }
.nvy-link:hover { color: #4a1f23; }
.nvy-btn {
  display: inline-block; background: #6E3035; color: #F7F4EE; padding: 14px 28px;
  font-size: 12.5px; letter-spacing: 1.5px; border-radius: 2px; border: none; cursor: pointer;
}
.nvy-btn:hover { background: #4a1f23; }

/* ---------- Header ---------- */
.nvy-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 26px 56px; border-bottom: 1px solid #D8D1C8; background: #F7F4EE;
}
.nvy-logo { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 24px; font-weight: 600; letter-spacing: 5px; color: #151515; }
.nvy-nav { display: flex; gap: 34px; align-items: center; }
.nvy-nav a { font-size: 13px; letter-spacing: 0.5px; color: #151515; }
.nvy-nav a:hover { color: #6E3035; }
.nvy-header-right { display: flex; align-items: center; gap: 26px; }

/* ---------- Footer ---------- */
.nvy-footer { padding: 56px; display: flex; flex-direction: column; gap: 28px; border-top: 1px solid #D8D1C8; }
.nvy-footer-top { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 24px; }
.nvy-footer-nav { display: flex; gap: 24px; flex-wrap: wrap; }
.nvy-footer-nav a { font-size: 13px; color: #77736D; }
.nvy-footer-social-col { display: flex; flex-direction: column; gap: 14px; }
.nvy-footer-social { display: flex; gap: 16px; }
.nvy-footer-contact { font-size: 13px; color: #77736D; }
.nvy-footer-contact:hover { color: #6E3035; }
.nvy-footer-bottom { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; font-size: 12px; color: #77736D; padding-top: 24px; border-top: 1px solid #D8D1C8; }

/* ---------- Hero ---------- */
.nvy-hero { position: relative; width: 100%; height: 640px; overflow: hidden; }
.nvy-hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nvy-hero-scrim { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(21,21,21,0.72) 0%, rgba(21,21,21,0.38) 45%, rgba(21,21,21,0.08) 75%); }
.nvy-hero-content { position: relative; height: 100%; display: flex; flex-direction: column; justify-content: center; gap: 22px; padding: 0 56px; max-width: 640px; }
.nvy-hero-content h1 { font-size: 56px; line-height: 1.12; color: #F7F4EE; }
.nvy-hero-content p { font-size: 16px; line-height: 1.6; color: #E9DDD5; max-width: 440px; }

/* ---------- Explore grid ---------- */
.nvy-section { padding: 72px 56px; display: flex; flex-direction: column; gap: 34px; }
.nvy-explore-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 28px; }
.nvy-explore-tile-img { position: relative; width: 100%; height: 150px; overflow: hidden; background: linear-gradient(150deg, #77736D 0%, #151515 100%); }
.nvy-explore-tile-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nvy-explore-tile h3 { font-size: 19px; font-weight: 600; letter-spacing: 1px; }
.nvy-explore-tile .sub { font-size: 13px; line-height: 1.7; color: #77736D; }

/* ---------- Featured essay band ---------- */
.nvy-featured { display: flex; width: 100%; min-height: 480px; flex-wrap: wrap; }
.nvy-featured-text { flex: 1 1 50%; background: #3F4738; padding: 64px; display: flex; flex-direction: column; justify-content: center; gap: 20px; }
.nvy-featured-text h2 { font-size: 38px; line-height: 1.18; color: #F7F4EE; }
.nvy-featured-text p.quote { font-size: 17px; font-style: italic; color: #E9DDD5; }
.nvy-featured-img { position: relative; flex: 1 1 50%; min-height: 360px; overflow: hidden; }
.nvy-featured-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* ---------- Card grid ---------- */
.nvy-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.nvy-card-img { position: relative; width: 100%; height: 220px; overflow: hidden; background: linear-gradient(150deg, #77736D 0%, #151515 100%); }
.nvy-card-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nvy-card h3 { font-size: 22px; font-weight: 600; line-height: 1.3; }
.nvy-card:hover h3 { color: #6E3035; }
.nvy-card p { font-size: 14px; line-height: 1.65; color: #77736D; }
.nvy-card .meta { font-size: 12px; color: #77736D; }

/* ---------- Navyaa note ---------- */
.nvy-note { display: flex; align-items: center; width: 100%; min-height: 280px; background: #E9DDD5; padding: 48px 56px; gap: 40px; flex-wrap: wrap; }
.nvy-note-text { flex: 1; display: flex; flex-direction: column; gap: 18px; max-width: 640px; }
.nvy-note-text p.quote { font-size: 26px; line-height: 1.5; font-style: italic; }

/* ---------- Most read + why navyaa ---------- */
.nvy-split { display: flex; width: 100%; min-height: 420px; flex-wrap: wrap; }
.nvy-most-read { flex: 1 1 55%; padding: 64px 56px; display: flex; flex-direction: column; gap: 24px; }
.nvy-most-read-row { display: flex; align-items: baseline; gap: 18px; padding: 16px 0; border-bottom: 1px solid #D8D1C8; }
.nvy-most-read-row .num { font-size: 20px; color: #6E3035; width: 28px; font-family: 'Cormorant Garamond', Georgia, serif; }
.nvy-most-read-row .title { font-size: 18px; flex: 1; font-family: 'Cormorant Garamond', Georgia, serif; }
.nvy-why { position: relative; flex: 1 1 45%; min-height: 320px; padding: 64px 48px; display: flex; flex-direction: column; justify-content: center; gap: 16px; overflow: hidden; }
.nvy-why img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nvy-why .scrim { position: absolute; inset: 0; background: rgba(21,21,21,0.42); }
.nvy-why > * { position: relative; }
.nvy-why h2 { font-size: 28px; line-height: 1.3; color: #F7F4EE; }

/* ---------- Newsletter ---------- */
.nvy-newsletter { display: flex; width: 100%; min-height: 300px; flex-wrap: wrap; }
.nvy-newsletter-img { position: relative; flex: 1 1 45%; min-height: 220px; overflow: hidden; }
.nvy-newsletter-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nvy-newsletter-form { flex: 1 1 55%; background: #6E3035; padding: 48px 56px; display: flex; flex-direction: column; justify-content: center; gap: 16px; }
.nvy-newsletter-form h2 { font-size: 32px; color: #F7F4EE; }
.nvy-newsletter-form p { font-size: 14px; color: #E9DDD5; }
.nvy-newsletter-row { display: flex; gap: 12px; margin-top: 6px; flex-wrap: wrap; }
.nvy-newsletter-row input { flex: 1; min-width: 180px; max-width: 320px; padding: 13px 18px; border: none; border-radius: 2px; font-size: 13px; background: #F7F4EE; color: #151515; }
.nvy-newsletter-row button { background: #F7F4EE; color: #151515; border-radius: 2px; padding: 13px 26px; font-size: 12px; letter-spacing: 0.5px; }

/* ---------- Category / archive ---------- */
.nvy-cat-intro { padding: 80px 56px 56px; display: flex; flex-direction: column; gap: 20px; max-width: 820px; }
.nvy-cat-intro h1 { font-size: 44px; line-height: 1.35; }
.nvy-older-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.nvy-older-grid .thumb { width: 100%; height: 130px; overflow: hidden; position: relative; background: linear-gradient(150deg, #77736D 0%, #151515 100%); }
.nvy-older-grid .thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nvy-older-grid h4 { font-size: 16px; font-weight: 600; line-height: 1.3; }
.nvy-pagination { display: flex; gap: 12px; padding: 0 56px 72px; }
.nvy-pagination a, .nvy-pagination span { font-size: 13px; padding: 8px 14px; border: 1px solid #D8D1C8; color: #151515; }
.nvy-pagination .current { background: #6E3035; color: #F7F4EE; border-color: #6E3035; }

/* ---------- Single article ---------- */
.nvy-article-header { max-width: 760px; margin: 0 auto; padding: 72px 56px 40px; display: flex; flex-direction: column; gap: 18px; align-items: flex-start; }
.nvy-article-header h1 { font-size: 48px; line-height: 1.18; }
.nvy-article-header .subhead { font-size: 19px; font-style: italic; color: #77736D; font-family: 'Cormorant Garamond', Georgia, serif; }
.nvy-article-hero { position: relative; max-width: 1080px; margin: 0 auto; width: calc(100% - 112px); height: 520px; overflow: hidden; }
.nvy-article-hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nvy-article-body { max-width: 720px; margin: 0 auto; padding: 56px 56px 24px; font-size: 17px; line-height: 1.85; }
.nvy-article-body p { margin: 0 0 22px; }
.nvy-more { max-width: 720px; margin: 0 auto; padding: 24px 56px 64px; }
.nvy-more .divider { height: 1px; background: #D8D1C8; margin-bottom: 32px; }

/* ---------- Start Here / About ---------- */
.nvy-page-hero { max-width: 760px; margin: 0 auto; padding: 88px 56px 40px; display: flex; flex-direction: column; gap: 20px; text-align: center; align-items: center; }
.nvy-page-hero h1 { font-size: 46px; line-height: 1.25; }
.nvy-path-list { max-width: 900px; margin: 0 auto; padding: 40px 56px 96px; display: flex; flex-direction: column; gap: 16px; }
.nvy-path-row { display: flex; align-items: center; justify-content: space-between; padding: 34px 40px; border: 1px solid #D8D1C8; }
.nvy-path-row:hover { border-color: #6E3035; }
.nvy-path-row span.title { font-size: 23px; font-family: 'Cormorant Garamond', Georgia, serif; }
.nvy-path-row span.arrow { color: #6E3035; }
.nvy-philosophy { max-width: 640px; margin: 0 auto; padding: 40px 56px 24px; text-align: center; }
.nvy-philosophy p { margin: 0 0 14px; font-size: 20px; line-height: 1.7; font-family: 'Cormorant Garamond', Georgia, serif; }
.nvy-portrait { position: relative; max-width: 900px; margin: 24px auto; width: calc(100% - 112px); height: 420px; overflow: hidden; }
.nvy-portrait img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nvy-cta-band { padding: 64px 56px; display: flex; flex-direction: column; align-items: center; gap: 18px; text-align: center; background: #3F4738; }
.nvy-cta-band h2 { font-size: 28px; color: #F7F4EE; }

/* ---------- Navyaa Intelligence badges (front-end, optional) ---------- */
.nvy-mood-chip { display: inline-block; font-size: 10.5px; letter-spacing: 1px; text-transform: uppercase; color: #77736D; border: 1px solid #D8D1C8; border-radius: 20px; padding: 4px 12px; }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
  .nvy-explore-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .nvy-card-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .nvy-older-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 720px) {
  .nvy-header, .nvy-section, .nvy-footer { padding-left: 24px; padding-right: 24px; }
  .nvy-nav { display: none; }
  .nvy-explore-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .nvy-card-grid { grid-template-columns: 1fr; }
  .nvy-older-grid { grid-template-columns: 1fr; }
  .nvy-hero-content h1 { font-size: 38px; }
  .nvy-featured-text, .nvy-featured-img, .nvy-most-read, .nvy-why, .nvy-newsletter-img, .nvy-newsletter-form { flex: 1 1 100%; }
}